選択できるのは25トピックまでです。 トピックは、先頭が英数字で、英数字とダッシュ('-')を使用した35文字以内のものにしてください。
 
 
 

241 行
13 KiB

  1. <link href="/assets/owl.carousel.min.css" rel="stylesheet">
  2. <link href="/vendor/multiselect-master/css/style.css" rel="stylesheet">
  3. <body>
  4. <link rel="stylesheet" href="/css/dashboard.css">
  5. <!-- Sidenav -->
  6. <% include ../partials/sidebar %>
  7. <!-- Main content -->
  8. <div class="main-content">
  9. <!-- Top navbar -->
  10. <% include ../partials/navbar %>
  11. <!-- Header -->
  12. <input type="hidden" id="selMaterial">
  13. <div class="header bg-gradient-primary pb-7 pt-5 pt-md-8">
  14. <div class="container-fluid">
  15. <% if(locals.role=='Admin') { %>
  16. <span class="h3 ml-2 mb-0 text-white text-uppercase d-none d-lg-inline-block">
  17. Summary Data Materi by Admin
  18. </span>
  19. <% } %>
  20. <br>
  21. <br>
  22. <div class="header-body">
  23. <!-- Card stats -->
  24. <div class="owl-carousel owl-theme">
  25. <% for(var i =0;i<locals.summaries.length;i++){ %>
  26. <%
  27. var complete = locals.summaries[i].attributes.materials.data.filter(i=>i.attributes.Presented != null&&i.attributes.Presented != '').length;
  28. var count = locals.summaries[i].attributes.materials.data.length;
  29. %>
  30. <div class="item">
  31. <div class="card card-stats mb-4 mb-xl-0">
  32. <div class="card-body">
  33. <div class="row">
  34. <div class="col">
  35. <span class="h4 font-weight-bold mb-0"><%= (locals.summaries[i].attributes.materials.data.length>0)?locals.summaries[i].attributes.materials.data[0].attributes.Title +' <'+locals.summaries[i].attributes.materials.data[0].attributes.Category+'>' :'' %></span>
  36. </div>
  37. <div class="col-auto">
  38. <div class="icon icon-shape <%= (complete>=count)? 'bg-success':'bg-warning' %> text-white rounded-circle shadow">
  39. <i class="fas <%= (complete>=count)? 'fa-check':'fa-spinner' %>"></i>
  40. </div>
  41. </div>
  42. </div>
  43. <div class="row">
  44. <div class="col">
  45. <h5 class="card-title text-muted mb-0"> <%= locals.summaries[i].attributes.Company %>, <%= locals.summaries[i].attributes.Division %></h5>
  46. </div>
  47. <div class="col-auto">
  48. <%
  49. var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
  50. var date = new Date(locals.summaries[i].attributes.createdAt);
  51. %>
  52. <h5 class="card-title text-muted mb-0"> <%= date.toLocaleDateString("id-ID", options) %></h5>
  53. </div>
  54. </div>
  55. <p class="mt-3 mb-0 text-sm">
  56. <span class="text-nowrap"><span class="font-weight-bold"><%= complete %></span> <span class="text-muted">dari</span> <b><%= count %></b> divisi</span>
  57. <span class="<%= (complete>=count)? 'text-success':'text-warning' %> mr-2"><i class="ni <%= (complete>=count)? 'ni-check-bold':'ni-fat-remove' %>"></i> <%= (complete>=count)? 'Lengkap':'Menunggu' %> </span>
  58. <button data-toggle="modal" data-target="#modal-summary" class="btn btn-icon btn-primary btn-sm" material="<%= (locals.summaries[i].attributes.materials.data.length>0)?locals.summaries[i].attributes.materials.data[0].attributes.Title:'' %>" summary="<%= locals.summaries[i].id %>" type="button">
  59. <span class="btn-inner--icon"><i class="ni ni-zoom-split-in"></i></span>
  60. </button>
  61. </p>
  62. </div>
  63. </div>
  64. </div>
  65. <% } %>
  66. <!-- <div class="item">
  67. <div class="card card-stats mb-4 mb-xl-0">
  68. <div class="card-body">
  69. <div class="row">
  70. <div class="col">
  71. <span class="h4 font-weight-bold mb-0">Multi-verse and Augmented Reality</span>
  72. </div>
  73. <div class="col-auto">
  74. <div class="icon icon-shape bg-warning text-white rounded-circle shadow">
  75. <i class="fas fa-spinner"></i>
  76. </div>
  77. </div>
  78. </div>
  79. <div class="row">
  80. <div class="col">
  81. <h5 class="card-title text-muted mb-0"> Yamaha, ICT</h5>
  82. </div>
  83. <div class="col-auto">
  84. <h5 class="card-title text-muted mb-0"> 17 Mar 2022</h5>
  85. </div>
  86. </div>
  87. <p class="mt-3 mb-0 text-sm">
  88. <span class="text-nowrap"><span class="font-weight-bold">2</span> <span class="text-muted">dari</span> <b>5</b> divisi</span>
  89. <span class="text-warning mr-2"><i class="ni ni-check-bold"></i> Menunggu </span>
  90. </p>
  91. </div>
  92. </div>
  93. </div> -->
  94. </div>
  95. </div>
  96. <br>
  97. <span class="h3 ml-2 mb-0 text-white text-uppercase d-none d-lg-inline-block">
  98. Dokumentasi Materi
  99. <a data-toggle="modal" data-target="#modal-form" id="addMaterial" href="#"><i class="ni ni-fat-add btn-circle"></i></a>
  100. </span>
  101. <br>
  102. <br>
  103. <form action="/" method="post">
  104. <select name="Category" class="form-control form-control-sm ml-2 mt-2" id="categorySelect">
  105. <option>Pilih Kategory</option>
  106. <option value="Pintar" <%= locals.category &&(category == 'Pintar') ? 'selected' : '' %>>Sabtu Pintar</option>
  107. <option value="Sharing" <%= locals.category &&(category == 'Sharing') ? 'selected' : '' %>>Sabtu Sharing</option>
  108. </select>
  109. <div class="row mt-3 <%= locals.role!='Admin' ?'hide' : '' %>">
  110. <div class="col-sm">
  111. <select name="company" class="form-control form-control-sm ml-2" id="companySelect">
  112. <option disabled value="">Pilih Company</option>
  113. <option <%= locals.company &&(company == 'All') ? `selected` : '' %> value="All">Semua</option>
  114. <% for(var i=0; i<companies.length; i++) {%>
  115. <% var selected = locals.company &&(company == companies[i].id) ? `selected` : '' %>
  116. <option <%= selected %> value="<%= companies[i].id %>"><%= companies[i].attributes.Name %></option>
  117. <% } %>
  118. </select>
  119. </div>
  120. <div class="col-sm ml-2 pr-2">
  121. <select <%= !locals.company || (company == '') ? `disabled` : '' %> name="division" class="form-control form-control-sm ml-0" id="divisionSelect" <% locals.company?'':'disabled' %>>
  122. <option <%= locals.division &&(division == 'All') ? `selected` : '' %> value="All">Semua</option>
  123. <% if(locals.divisions) { for(var i=0; i<divisions.length; i++) {%>
  124. <% var selected = locals.division &&(division == divisions[i].id) ? `selected` : '' %>
  125. <option <%= selected %> value="<%= divisions[i].id %>"><%= divisions[i].attributes.Name %></option>
  126. <% } }%>
  127. </select>
  128. </div>
  129. </div>
  130. <div class="text-right ml-2 mt-4">
  131. <button type="submit" class="btn btn-success btn-sm">Search</button>
  132. </div>
  133. </form>
  134. </div>
  135. </div>
  136. <!-- Page content -->
  137. <div class="container-fluid mt--7">
  138. <div class="row justify-content-left">
  139. <% if(locals.material) { for(var i=0;i<material.length;i++) {%>
  140. <div class="col-xl-4 order-xl-2 mb-5 mb-xl-0 mt-9">
  141. <div class="container-fluid card card-profile shadow material">
  142. <div class="row justify-content-center <%= (locals.editable && (locals.role=='Admin' || !material[i].attributes.By_Admin))?'cardThumbnailImage':'' %>">
  143. <div class="col-lg-3 order-lg-2">
  144. <img class="card-thumbnail" src="<%= material[i].attributes.Thumbnail.data?material[i].attributes.Thumbnail.data.attributes.url : ''%>">
  145. </div>
  146. </div>
  147. <div class="option-menu card-header text-center border-0 <%= (locals.editable && (locals.role=='Admin' || !material[i].attributes.By_Admin)) ? 'pt-6' : 'pt-7' %> pb-0 mb-0" <%= (locals.editable && (locals.role=='Admin' || locals.role=='Editor')) ? 'style="z-index: 1;"' : '' %>>
  148. <div class="p-2">
  149. <% if(locals.editable && (locals.role=='Admin' || !material[i].attributes.By_Admin)){ %>
  150. <a value="<%= material[i].id %>" href="#" class="btn btn-sm btn-warning removeMaterial">
  151. <span class="btn-inner--icon"><i class="ni ni-bag-17"></i></span>
  152. <span class="btn-inner--text">Remove</span>
  153. </a>
  154. <a category="<%= material[i].attributes.Category %>" value="<%= material[i].id %>" href="#" class="btn btn-sm btn-primary editMaterial">
  155. <span class="btn-inner--icon"><i class="ni ni-ruler-pencil"></i></span>
  156. <span class="btn-inner--text">Edit</span></a>
  157. <% } %>
  158. </div>
  159. </div>
  160. <div class="card-body <%= (locals.editable) ? 'pt-0' : 'pt-4' %> pb-0 pb-2">
  161. <div class="text-center mt-4">
  162. <h3>
  163. <%= material[i].attributes.Title%>
  164. </h3>
  165. <div class="h5 font-weight-300">
  166. <% if(material[i].attributes.Presented){ %>
  167. <%
  168. var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
  169. var date = new Date(material[i].attributes.Presented);
  170. %>
  171. <i class="ni location_pin mr-2"></i><%= material[i].attributes.Name %>, <%= date.toLocaleDateString("id-ID", options) %>
  172. <% } else{ %>
  173. Belum Presentasi
  174. <% } %>
  175. </div>
  176. <div class="h5 mt-1">
  177. <i class="ni business_briefcase-24 mr-2"></i><%= material[i].attributes.company.data?material[i].attributes.company.data.attributes.Name: 'Semua' %> - <%= material[i].attributes.division.data? material[i].attributes.division.data.attributes.Name:'' %>
  178. </div>
  179. <hr class="my-2" />
  180. <a href="/material/<%= material[i].id %>">Masuk</a>
  181. <hr class="my-2" />
  182. <% if(material[i].attributes.participants.data.length <= 0) {%>
  183. <a category="<%= material[i].attributes.Category %>" value="<%= material[i].id %>" href="#" class="btn btn-sm btn-primary completeMaterial">Lengkapi</a>
  184. <% }else{ %>
  185. <a value="<%= material[i].id %>" href="#" class="btn btn-sm btn-primary resetMaterial">Reset</a>
  186. <% } %>
  187. </div>
  188. <div class="row">
  189. <div class="col">
  190. <div class="card-stats card-profile-stats d-flex justify-content-center">
  191. <div>
  192. <a href="#" class="openParticipants" value="<%= material[i].id %>">
  193. <span class="heading"><%= material[i].attributes.participants.data.length %></span>
  194. </a>
  195. <span class="description">Peserta</span>
  196. </div>
  197. <div>
  198. <span class="heading"><%= material[i].attributes.Attachments.data?material[i].attributes.Attachments.data.length:'0' %></span>
  199. <span class="description">Files</span>
  200. </div>
  201. </div>
  202. </div>
  203. </div>
  204. </div>
  205. </div>
  206. </div>
  207. <% } }%>
  208. </div>
  209. <!-- Footer -->
  210. <footer class="footer"></footer>
  211. </div>
  212. </div>
  213. <% include ../partials/dashboard/modal_form %>
  214. <% include ../partials/dashboard/modal_participants %>
  215. <% include ../partials/dashboard/modal_pintar_summary %>
  216. <!-- Include scripts -->
  217. <% include ../partials/scripts %>
  218. <script src="js/page/dashboard.js"></script>
  219. <script src="/vendor/owl-carousel/owl.carousel.min.js"></script>
  220. <script>
  221. $('.owl-carousel').owlCarousel({
  222. loop:false,
  223. margin:10,
  224. nav:true,
  225. responsive:{
  226. 0:{
  227. items:1
  228. },
  229. 800:{
  230. items:2
  231. },
  232. 1000:{
  233. items:4
  234. }
  235. }
  236. })
  237. </script>
  238. </body>