Jefry
/
Saturday_Sharing_Front
1
0
포크 0
코드 이슈 0 풀 리퀘스트 0 릴리즈 0 위키 활동
25개 이상의 토픽을 선택하실 수 없습니다. Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
5 커밋
1 브렌치
7.6 MiB
 
 
 
트리: 0c4ce7ba39
브랜치 태그
${ item.name }
${ searchTerm } 브랜치 생성
from '0c4ce7ba39'
${ noResults }
Saturday_Sharing_Front/public/js/page/dashboard.js

923 lines
35 KiB
Raw Blame 히스토리 

  1. /* eslint-disable no-undef */

  2. 

  3. let list;

  4. let attachment;

  5. let removeMedia = [];

  6. 

  7. var selectCompanyList = new drop({

  8.   selector:  '#modal-form .modalCompanySelect'

  9. });

  10. 

  11. var selectDivisiList = new drop({

  12.   selector:  '#modal-form .modalDivisionSelect'

  13. });

  14. 

  15. 

  16. 

  17. var rowPage = 9;

  18. 

  19. async function paginationSummary(pageSize,page,id,token){

  20.   var res = await fetch(`/api/materials?filters[pintar_summary][id][$eq]=${id}&pagination[page]=${page}&pagination[pageSize]=${pageSize}&populate=*`,{

  21.       headers: {

  22.           'Authorization': `Bearer ${token}`

  23.       },

  24.   });

  25.   if(res.ok){

  26.       var obj = await res.json();

  27.       $("#summaryTable tbody").empty();

  28.       $("#summaryPagination").empty();

  29.       $("#summaryPagination").append(`

  30.           <li class="page-item ${obj.meta.pagination.page==1?'disabled':''}">

  31.               <a value="${obj.meta.pagination.page-1}" class="page-link" href="#" tabindex="-1">

  32.               <i class="fas fa-angle-left"></i>

  33.               <span class="sr-only">Previous</span>

  34.               </a>

  35.           </li>

  36.       `);

  37.       for(var i =1; i <= obj.meta.pagination.pageCount;i++){

  38.           $("#summaryPagination").append(`

  39.               <li class="page-item ${obj.meta.pagination.page==i?"active":''}"><a value="${i}" class="page-link" href="#">${i}</a></li>

  40.           `);

  41.       }

  42.       $("#summaryPagination").append(`

  43.           <li class="page-item ${obj.meta.pagination.page==obj.meta.pagination.pageCount?'disabled':''}">

  44.               <a value="${obj.meta.pagination.page+1}" class="page-link" href="#">

  45.               <i class="fas fa-angle-right"></i>

  46.               <span class="sr-only">Next</span>

  47.               </a>

  48.           </li>

  49.       `);

  50.       obj.data.forEach((i,indx)=>{

  51.         var imgs = '-';

  52.         if(i.attributes.Images.data){

  53.           imgs = '';

  54.           i.attributes.Images.data.forEach(img=>imgs+=`<img style="padding:5px;width:100px;" src="${img.attributes.url}"/><br/>`);

  55.         }

  56.           $("#summaryTable tbody").append(`

  57.           <tr>

  58.           <th scope="row">${((obj.meta.pagination.page-1)*pageSize)+indx+1}</th>

  59.           <td>${i.attributes.company.data.attributes.Name}</td>

  60.           <td>${i.attributes.division.data.attributes.Name}</td>

  61.           <td>${i.attributes.Presented?moment(i.attributes.Presented,'MM/DD/YYYY').format('DD-MMM-YYYY'):'-'}</td>

  62.           <td>${imgs}</td>

  63.           <td>${(i.attributes.Video.data)?"<a href='"+i.attributes.Video.data.attributes.url+"' target='_blank'>video</a>":'-'}</td>

  64.           <td>${i.attributes.Name??'-'}</td>

  65.           <td>${(i.attributes.participants.data)?i.attributes.participants.data.length:''}</td>

  66.           </tr>

  67.           `);

  68.       });

  69. 

  70.       //set callback pagination

  71.       $('#summaryPagination .page-link').off('click');

  72.       $("#summaryPagination .page-link").click(async(e)=>{

  73.           e.preventDefault();

  74.           paginationSummary(pageSize,$(e.target.closest('a')).attr('value'),id,token);

  75.       });

  76.   }

  77.   else{

  78.       showAlert('error','Gagal menarik data. Harap login ulang!');

  79.   }

  80. }

  81. 

  82. $('#modal-summary').on('shown.bs.modal', async function(event) {

  83.   $("#summaryMaterial").text($(event.relatedTarget).attr('material'));

  84.   var id = $(event.relatedTarget).attr('summary');

  85.   if(id){

  86.       var getToken = await fetch(`/session/key?s=jwt`);

  87.       if(getToken.ok){

  88.         paginationSummary(rowPage,1,id,await getToken.text());

  89.       }

  90.       else{

  91.           showAlert('error','Gagal menarik data divisi. Harap login ulang!');

  92.       }

  93.   }

  94.   else{

  95.       showAlert("error","Terjadi kesalahan saat menarik data!");

  96.   }

  97. })

  98. 

  99. $('#companySelect').change(async e => {

  100.   if (e.target.value && e.target.value != '') {

  101.     $('#divisionSelect').removeAttr('disabled');

  102.     const getToken = await fetch(`/session/key?s=jwt`);

  103.     if (getToken.ok) {

  104.       const token = await getToken.text();

  105.       const res = await fetch(`/api/divisions${(e.target.value=='All')?'':"?filters[companies][id][$in]="+e.target.value}`, {

  106.         headers: {

  107.           Authorization: `Bearer ${token}`,

  108.         },

  109.       });

  110.       if (res.ok) {

  111.         const obj = await res.json();

  112.         $('#divisionSelect').empty();

  113.         $('#divisionSelect').append('<option  value="All">Semua</option>');

  114.         obj.data.forEach(i => {

  115.           $('#divisionSelect').append(`<option  value="${i.id}">${i.attributes.Name}</option>`);

  116.         });

  117.       }

  118.     } else {

  119.       showAlert('error', 'Gagal menarik data divisi. Harap login ulang!');

  120.     }

  121.   } else {

  122.     $('#divisionSelect').attr('disabled', 'disabled');

  123.   }

  124. });

  125. 

  126. $('.editMaterial').click(async e => {

  127.   e.preventDefault();

  128.   const getRole = await fetch(`/session/key?s=role`);

  129.     if (getRole.ok) {

  130.       var role = JSON.parse(await getRole.text());

  131.       // if(role.name == 'Editor'||role.name == 'Admin'){

  132.         const id = $(e.target.closest('a')).attr('value');

  133.         $("input.categoryField").val($(e.target.closest('a')).attr('category'));

  134.         $('#selMaterial').val(id);

  135.         $('#modal-form').attr('operation', 'edit');

  136.         $('#modal-form').modal('show');

  137.         showForm('Sharing');

  138.       // }

  139.       // else{

  140.       //   showAlert('error', "Tidak diperbolehkan untuk mengubah data. Minta ijin dari admin terlebih dahulu");

  141.       // }

  142.     }

  143.     else{

  144.       window.location = '/logout'

  145.     }

  146. });

  147. 

  148. $('.completeMaterial').click(async e => {

  149.   e.preventDefault();

  150.   const id = $(e.target.closest('a')).attr('value');

  151.   $("input.categoryField").val($(e.target.closest('a')).attr('category'));

  152.   $('#selMaterial').val(id);

  153.   $('#modal-form').attr('operation', 'complete');

  154.   $('#modal-form').modal('show');

  155.   showForm('Sharing');

  156. });

  157. 

  158. $('.resetMaterial').click(async e => {

  159.   e.preventDefault();

  160.   const id = $(e.target.closest('a')).attr('value');

  161.   loading(70, true);

  162.     const getToken = await fetch(`/session/key?s=jwt`);

  163.     if (getToken.ok) {

  164.       const token = await getToken.text();

  165.       const res = await fetch(`/api/resetMaterial/${id}`, {

  166.         method: 'PUT',

  167.         headers: {

  168.           Authorization: `Bearer ${token}`,

  169.         },

  170.       });

  171.       if (res.ok) {

  172.         location.reload();

  173.       } else {

  174.         loading(0, false);

  175.         try {

  176.           const obj = await res.json();

  177.           if(obj.error.message.includes('Forbidden')){

  178.             showAlert('error', "Tidak diperbolehkan untuk mengubah data. Minta ijin dari admin terlebih dahulu");

  179.           }

  180.           else showAlert('error', obj.error.message);

  181.         } catch (e) {

  182.           showAlert('error', 'Tidak dapat mereset materi. Terjadi kesalahan!');

  183.         }

  184.       }

  185.     } else {

  186.       loading(0, false);

  187.       showAlert('error', 'Gagal menarik data divisi. Harap login ulang!');

  188.     }

  189. });

  190. 

  191. 

  192. 

  193. $('.removeMaterial').click(async e => {

  194.   e.preventDefault();

  195.   const id = $(e.target.closest('a')).attr('value');

  196.   if (confirm('delete this material?')) {

  197.     loading(70, true);

  198.     const getToken = await fetch(`/session/key?s=jwt`);

  199.     if (getToken.ok) {

  200.       const token = await getToken.text();

  201.       const res = await fetch(`/api/materials/${id}`, {

  202.         method: 'DELETE',

  203.         headers: {

  204.           Authorization: `Bearer ${token}`,

  205.         },

  206.       });

  207.       if (res.ok) {

  208.         location.reload();

  209.       } else {

  210.         loading(0, false);

  211. 

  212.         try {

  213.           const obj = await res.json();

  214.           if(obj.error.message.includes('Forbidden')){

  215.             showAlert('error', "Tidak diperbolehkan untuk mengubah data. Minta ijin dari admin terlebih dahulu");

  216.           }

  217.           else showAlert('error', obj.error.message);

  218.         } catch (e) {

  219.           showAlert('error', 'Tidak dapat menghapus materi. Terjadi kesalahan!');

  220.         }

  221.       }

  222.     } else {

  223.       loading(0, false);

  224.       showAlert('error', 'Gagal menarik data divisi. Harap login ulang!');

  225.     }

  226.   }

  227. });

  228. 

  229. function showForm(dialog) {

  230.   $("#pickForm input[name='Category']").val(dialog);

  231.   $("#pickForm span.categoryTitle").text(dialog);

  232.   $('#pickForm').removeClass('hide');

  233.   $('#pickCategory').addClass('hide');

  234. }

  235. 

  236. function hideform() {

  237.   $("#pickForm input[name='Category']").val('');

  238.   $("#pickForm span.categoryTitle").text('');

  239.   $('#pickForm').addClass('hide');

  240.   $('#pickCategory').removeClass('hide');

  241. }

  242. 

  243. $('input[type=file]').change(function(e) {

  244.   var files = e.target.files;

  245.   if (files && [...files].filter(i=>i.size>104857600).length >0) {

  246.     showAlert(

  247.       'error',

  248.       'File yang dipilih terlalu besar Max(100 MB)! Compress atau potong file yang ingin di upload!'

  249.     );

  250.     e.target.value = '';

  251.   }

  252. });

  253. 

  254. function removeUpload(e, listFile) {

  255.   let li = $(e.target).parent();

  256.   

  257.   while  (li[0].localName != 'li') {

  258.     li = $(li).parent();

  259.   }

  260.   if (li.attr('status') == 'uploaded') removeMedia.push(li.val());

  261.   else {

  262.     for (let i = 0; i < listFile.items.length; i++) {

  263.       if (listFile.files[i].name.replace(/["']/g, '') == li.attr('name')) {

  264.         listFile.items.remove(i);

  265.       }

  266.     }

  267.   }

  268.   li.remove();

  269. }

  270. 

  271. $('#modal-form').on('hide.bs.modal', function(e) {

  272.   if($(e.target).hasClass('modal')){

  273.     hideform();

  274.     $('#modal-form').attr('operation', '');

  275.     $('#uploadedAttachment').empty();

  276.     $('#uploadedFile').empty();

  277.     $('#modal-form input[name=Title]').removeAttr('disabled');

  278.     $(`#modal-form input[name=Start_Date]`).removeAttr('disabled');

  279.     $(`#modal-form input[name=End_Date]`).removeAttr('disabled');

  280.     $('#modal-form textarea[name=Description]').removeAttr('disabled');

  281.     $('#modal-form input#formAttachment').closest('.form-group').show();

  282.     $(`#modal-form input#thumbnail`).closest('.form-group').show();

  283.     $('#modal-form select[name=company]').closest('.form-group').show();

  284.     $('#modal-form select[name=division]').closest('.form-group').show();

  285.     $("#thumbnailSelected").remove();

  286.     $("#videoSelected").remove();

  287.     $(`#modal-form .completeData`).addClass('hide');

  288.   }

  289. });

  290. 

  291. $('#modal-form').on('shown.bs.modal', async function() {

  292.   removeMedia = [];

  293.   let materialData;

  294.   $("#modal-form input[type!='hidden']").val('');

  295.   $('#modal-form select').val('');

  296.   $('#modal-form select[name=division]').attr('disabled','disabled');

  297.   $('#modal-form input.modalDivisiAll').attr('disabled','disabled');

  298.   $('#modal-form input[type=checkbox]').prop('checked',false);

  299.   $("#modal-form .modalCompanySelect").parent('.drop').show();

  300.   $("#modal-form .modalDivisionSelect").parent('.drop').show();

  301.   $('#modal-form textarea').html('');

  302.   $('#modal-form textarea').val('');

  303.   const container = document.getElementById('participantCounter');

  304.   if(container)container.innerHTML = '';

  305.   $("#modal-form input[name='ParticipantList']").val('');

  306.   list = new DataTransfer();

  307.   attachment = new DataTransfer();

  308.   if ($('#modal-form').attr('operation') == 'edit' || $('#modal-form').attr('operation') == 'complete') {

  309.     loading(0, true);

  310.     const getToken = await fetch(`/session/key?s=jwt`);

  311.     if (getToken.ok) {

  312.       const token = await getToken.text();

  313.       const res = await fetch(`/api/materials/${$('#selMaterial').val()}?populate=*`, {

  314.         method: 'GET',

  315.         headers: {

  316.           Authorization: `Bearer ${token}`,

  317.         },

  318.       });

  319.       loading(100, true);

  320.       if (res.ok) {

  321.         loading(0, false);

  322.         try {

  323.           let obj = await res.json();

  324.           obj = obj.data.attributes;

  325.           if(obj.Presented) obj.Presented = moment(obj.Presented,'DD MMM YYYY').format('YYYY-MM-DD');

  326.           materialData = obj;

  327.           var form = $("#formCreateAdmin").length>0?'formCreateAdmin':'formCreate';

  328.           $(`#${form} select[name=company]`).closest('.form-group').hide();

  329.           $(`#${form} select[name=division]`).closest('.form-group').hide();

  330.           if(obj.Presented || $('#modal-form').attr('operation') == 'complete')$(`#${form} .completeData`).removeClass('hide');

  331.           if($('#modal-form').attr('operation') =='complete'){

  332.             $(`#${form} input[name=Title]`).attr('disabled','');

  333.             $(`#${form} input[name=Start_Date]`).attr('disabled','');

  334.             $(`#${form} input[name=End_Date]`).attr('disabled','');

  335.             $(`#${form} textarea[name=Description]`).attr('disabled','');

  336.             $(`#${form} input#formAttachment`).closest('.form-group').hide();

  337.             $(`#${form} input#thumbnail`).closest('.form-group').hide();

  338.           }

  339.           $(`#${form} input[name="Category"]`).val(obj.Category);

  340.           Object.keys(obj).forEach(async i => {

  341.             if(obj[i]&&obj[i].data){

  342.                 if (typeof obj[i] === 'object' && !(obj[i].data instanceof Array)) {

  343.                 if (!obj[i].data.attributes.mime) {

  344.                   $(`#${form} [name='${i}']`).val(obj[i].data.id);

  345.                   if (i == 'company') {

  346.                     const res = await fetch(

  347.                       `/api/divisions?filters[companies][id][$in]=${obj[i].data.id}`,

  348.                       {

  349.                         headers: {

  350.                           Authorization: `Bearer ${token}`,

  351.                         },

  352.                       }

  353.                     );

  354.                     if (res.ok) {

  355.                       const resp = await res.json();

  356.                       $(`#${form} .modalDivisionSelect`).empty();

  357.                       $(`#${form} .modalDivisionSelect`).append(

  358.                         $(`#${form} .categoryField`).val()=='Pintar'

  359.                         ?'<option value="All">Semua</option>'

  360.                         :'<option value="">Pilih divisi dari list</option>'

  361.                       );

  362.                       resp.data.forEach(item => {

  363.                         $(`#${form} .modalDivisionSelect`).append(

  364.                           `<option ${item.id == (obj.division.data?obj.division.data.id:'') ? 'selected' : ''} value="${

  365.                             item.id

  366.                           }">${item.attributes.Name}</option>`

  367.                         );

  368.                       });

  369.                       $(`#${form} .modalDivisionSelect`).removeAttr('disabled');

  370.                     }

  371.                   }

  372.                 } else {

  373.                   if(i == 'Video'){

  374.                     $(`#${form} input#videoFile`).after(

  375.                       `<small id="videoSelected" style="line-height: 4em;">current video : ${obj[i].data.attributes.name}</small>`

  376.                     );

  377.                   }

  378.                   else if(i == 'Thumbnail'){

  379.                     $(`#${form} input#thumbnail`).after(

  380.                       `<small id="thumbnailSelected" style="line-height: 4em;">current Thumbnail : ${obj[i].data.attributes.name}</small>`

  381.                     );

  382.                   }

  383.                 }

  384.                 } else if (obj[i].data instanceof Array) {

  385.                   if (i == 'participants') {

  386.                     const aoa = obj[i].data.map(o => o.attributes);

  387.                     const container = document.getElementById('participantCounter');

  388.                     if(container)container.innerHTML = `${aoa.length} Participant(s)`;

  389.                     $(`#${form} input[name='ParticipantList']`).val(JSON.stringify(aoa));

  390.                   } else if (i == 'Images') {

  391.                     obj[i].data.forEach(async thumbnails => {

  392.                       $(`#${form} #uploadedFile`).append(

  393.                         `<li status='uploaded' value='${

  394.                           thumbnails.id

  395.                         }' name='${thumbnails.attributes.name.replace(/["']/g, '')}'>${

  396.                           thumbnails.attributes.name

  397.                         }

  398.                                                     <button type="button" class="btn-close btn-icon removeUpload" onclick="removeUpload(event,list)" aria-label="Close">

  399.                                                       <span class="btn-inner--icon"><i class="ni ni-fat-remove"></i></span>

  400.                                                     </button>

  401.                                                 </li>`

  402.                       );

  403.                     });

  404.                   } else if (i == 'Attachments') {

  405.                     obj[i].data.forEach(async attachments => {

  406.                       $(`#${form} #uploadedAttachment`).append(

  407.                         `<li status='uploaded' value='${

  408.                           attachments.id

  409.                         }' name="${attachments.attributes.name.replace(/["']/g, '')}">${

  410.                           attachments.attributes.name

  411.                         }

  412.                                                     <button type="button" class="btn-close btn-icon removeUpload" onclick="removeUpload(event,attachment)" aria-label="Close">

  413.                                                       <span class="btn-inner--icon"><i class="ni ni-fat-remove"></i></span>

  414.                                                     </button>

  415.                                                 </li>`

  416.                       );

  417.                     });

  418.                   }

  419.                 } 

  420.             }

  421.             else {

  422.               if($(`#${form} [name='${i}']`).length>0)$(`#modal-form [name='${i}']`).val(obj[i]);

  423.             }

  424.             

  425.           });

  426.         } catch (e) {

  427.           $('#loading').hide();

  428.           console.log(e);

  429.         }

  430.       } else {

  431.         loading(0, false);

  432.         showAlert('error', 'Tidak dapat mencari data materi. Terjadi kesalahan!');

  433.       }

  434.     } else {

  435.       loading(0, false);

  436.       showAlert('error', 'Terjadi kesalahan! Harap coba login kembail atau hubungi admin!');

  437.     }

  438.   }

  439.   $('#formCreate').off('submit');

  440.   $('#formCreateAdmin').off('submit');

  441. 

  442.   $('#formCreate').submit(async event => {

  443.     event.preventDefault();

  444.     clearAlert();

  445.     var el = this;

  446.     $(el).find(':input[type=submit]').prop('disabled', true);

  447.     if ($('#modal-form').attr('operation') == 'edit'|| $('#modal-form').attr('operation') == 'complete') {

  448.       if (

  449.         (materialData.Presented || $('#modal-form').attr('operation') == 'complete')

  450.         ?($(event.target)

  451.           .serializeArray()

  452.           .filter(item => item.value == '').length > 0)

  453.         :($(event.target)

  454.         .serializeArray()

  455.         .filter(item => item.value == '' && !($("#modal-form .completeData input").map((idx,i)=>$(i).attr("name")).toArray().includes(item.name))).length > 0)

  456.       ) {

  457.         showAlert('error', 'Cek kembali data yang belum diisi!');

  458.       }

  459.       else if ($('ul#uploadedFile li').length < 3 || $('ul#uploadedAttachment li').length <= 0) {

  460.         showAlert('error', 'File yang dibutuhkan tidak lengkap!');

  461.       } else {

  462.         loading(10, true);

  463.         var getToken = await fetch(`/session/key?s=jwt`);

  464.         if (getToken.ok) {

  465.           const formData = new FormData();

  466.           var obj = {};

  467.           $(event.target)

  468.             .serializeArray()

  469.             .forEach(element => {

  470.               try {

  471.                 obj[element.name] = JSON.parse(element.value);

  472.               } catch (e) {

  473.                 obj[element.name] = element.value;

  474.               }

  475.             });

  476.           if(materialData && materialData.Images.data){

  477.             const Images = materialData.Images.data.map(item => item.id);

  478.             if(removeMedia && removeMedia.length>0 && removeMedia.some(r=> Images.includes(r))){

  479.               obj.Images = Images.filter(item => !removeMedia.includes(item));

  480.             }

  481.           }

  482. 

  483.           for (let i = 0; i < list.files.length; i++) {

  484.             const file = list.files[i];

  485.             formData.append(`files.Images`, file, file.name);

  486.           }

  487. 

  488.           if(materialData && materialData.Attachments){

  489.             const Attachments = materialData.Attachments.data.map(item => item.id);

  490.             if(removeMedia && removeMedia.length>0 && removeMedia.some(r=> Attachments.includes(r))){

  491.               obj.Attachments = Attachments.filter(item => !removeMedia.includes(item));

  492.             }

  493.           }

  494. 

  495.           for (let i = 0; i < attachment.files.length; i++) {

  496.             const file = attachment.files[i];

  497.             formData.append(`files.Attachments`, file, file.name);

  498.           }

  499. 

  500.           if ($('#videoFile').prop('files').length > 0) {

  501.             obj.Video = [];

  502.             formData.append(

  503.               `files.Video`,

  504.               $('#videoFile').prop('files')[0],

  505.               $('#videoFile').prop('files')[0].name

  506.             );

  507.           }

  508. 

  509.           if($('#thumbnail').prop('files').length>0){

  510.             obj.Thumbnail = [];

  511.             formData.append(

  512.               `files.Thumbnail`,

  513.               $('#thumbnail').prop('files')[0],

  514.               $('#thumbnail').prop('files')[0].name

  515.             );

  516.           }

  517. 

  518.           const request = new XMLHttpRequest();

  519.           request.upload.onprogress = function(evt) {

  520.             if (evt.lengthComputable) {

  521.               const percentComplete = parseInt((evt.loaded / evt.total) * 100);

  522.               loading(percentComplete, true);

  523.             }

  524.           };

  525.           request.onreadystatechange = function() {

  526.             if (request.readyState == 4) {

  527.               loading(0, false);

  528.               if (request.status == 200) {

  529.                 location.reload();

  530.               } else {

  531.                 showAlert('error', 'Terjadi kesalahan! Harap coba login kembali / hubungi admin!');

  532.               }

  533.             }

  534.           };

  535. 

  536.           formData.append('data', JSON.stringify(obj));

  537.           if($('#modal-form').attr('operation')=='edit') request.open('PUT', `/api/materials/${$('#selMaterial').val()}`);

  538.           else request.open('PUT', `/api/saveMaterial/${$('#selMaterial').val()}`);

  539.           request.setRequestHeader('Authorization', `Bearer ${await getToken.text()}`);

  540.           request.send(formData);

  541.         } else {

  542.           loading(0, false);

  543.           showAlert('error', 'Terjadi kesalahan. Harap login kembali!');

  544.         }

  545.       }

  546.     } else{

  547.       if (

  548.         $(event.target)

  549.           .serializeArray()

  550.           .filter(item => item.value == '').length > 0

  551.     ) {

  552.       showAlert('error', `Cek kembali data (${$(event.target)

  553.         .serializeArray()

  554.         .filter(item => item.value == '').map(i=>i.name).join(',')})  yang belum diisi!`);

  555.     } else if (

  556.       $('input#videoFile').prop('files').length <= 0 ||

  557.       $('input#thumbnail').prop('files').length <= 0||

  558.       list.files.length <= 0 ||

  559.       attachment.files.length <= 0

  560.     ) {

  561.       showAlert('error', 'File yang dibutuhkan tidak lengkap!');

  562.     } else {

  563.       loading(0, true);

  564.       var getToken = await fetch(`/session/key?s=jwt`);

  565.       if (getToken.ok) {

  566.         var obj = {};

  567.         $(event.target)

  568.           .serializeArray()

  569.           .forEach(element => {

  570.             try {

  571.               obj[element.name] = JSON.parse(element.value);

  572.             } catch (e) {

  573.               obj[element.name] = element.value;

  574.             }

  575.           });

  576.         const formData = new FormData();

  577.         formData.append('data', JSON.stringify(obj));

  578.         for (let i = 0; i < list.files.length; i++) {

  579.           const file = list.files[i];

  580.           formData.append(`files.Images`, file, file.name);

  581.         }

  582.         for (let i = 0; i < attachment.files.length; i++) {

  583.           const file = attachment.files[i];

  584.           formData.append(`files.Attachments`, file, file.name);

  585.         }

  586.         formData.append(

  587.           `files.Video`,

  588.           $('#videoFile').prop('files')[0],

  589.           $('#videoFile').prop('files')[0].name

  590.         );

  591. 

  592.         formData.append(

  593.           `files.Thumbnail`,

  594.           $('#thumbnail').prop('files')[0],

  595.           $('#thumbnail').prop('files')[0].name

  596.         );

  597.         

  598. 

  599.         const request = new XMLHttpRequest();

  600.         request.upload.onprogress = function(evt) {

  601.           if (evt.lengthComputable) {

  602.             const percentComplete = parseInt((evt.loaded / evt.total) * 100);

  603.             loading(percentComplete, true);

  604.           }

  605.         };

  606.         request.onreadystatechange = function() {

  607.           if (request.readyState == 4) {

  608.             loading(0, false);

  609.             if (request.status == 200) {

  610.               location.reload();

  611.             } else {

  612.               showAlert('error', 'Terjadi kesalahan! Harap coba login kembali / hubungi admin!');

  613.             }

  614.           }

  615.         };

  616.         request.open('POST', '/api/materials');

  617.         request.setRequestHeader('Authorization', `Bearer ${await getToken.text()}`);

  618.         request.send(formData);

  619.       } else {

  620.         loading(0, false);

  621.         showAlert('error', 'Terjadi kesalahan. Harap login kembali!');

  622.       }

  623.     }

  624.     } 

  625.     setTimeout(function(){$(el).find(':input[type=submit]').prop('disabled', false);},3000);

  626.   });

  627. 

  628.   $('#formCreateAdmin').submit(async event => {

  629.     event.preventDefault();

  630.     clearAlert();

  631.     var el = this;

  632.     $(el).find(':input[type=submit]').prop('disabled', true);

  633.     setTimeout(function(){$(el).find(':input[type=submit]').prop('disabled', false);},3000);

  634.     if ($('#modal-form').attr('operation') == 'edit'|| $('#modal-form').attr('operation') == 'complete') {

  635.       if (

  636.         (materialData.Presented || $('#modal-form').attr('operation') == 'complete')

  637.         ?($(event.target)

  638.           .serializeArray()

  639.           .filter(item => item.value == '').length > 0)

  640.         :($(event.target)

  641.         .serializeArray()

  642.         .filter(item => item.value == '' && !($("#modal-form .completeData input").map((idx,i)=>$(i).attr("name")).toArray().includes(item.name))).length > 0)

  643.       ) {

  644.         showAlert('error', 'Cek kembali data yang belum diisi!');

  645.       }

  646.       // else if ($('ul#uploadedFile li').length <= 0 || $('ul#uploadedAttachment li').length <= 0) {

  647.         else if(((materialData.Presented || $('#modal-form').attr('operation') == 'complete')?$("#modal-form input[type=file][multiple=multiple]"):$("#modal-form input[type=file][multiple=multiple]").not(".completeData input[type=file][multiple=multiple]")).filter((i,k)=> $(k).parent().next().children('li').length<=0).length>0) {

  648.           showAlert('error', 'File yang dibutuhkan tidak lengkap!');

  649.       } else {

  650.         loading(10, true);

  651.         var getToken = await fetch(`/session/key?s=jwt`);

  652.         if (getToken.ok) {

  653.           const formData = new FormData();

  654.           var obj = {};

  655.           $(event.target)

  656.             .serializeArray()

  657.             .forEach(element => {

  658.               try {

  659.                 if(element.value[0]=='{'){

  660.                   obj[element.name] = JSON.parse(element.value);

  661.                 }

  662.                 else if(element.value.includes('/')){

  663.                   obj[element.name] = moment(element.value,'MM/DD/YYYY').format('YYYY-MM-DD');

  664.                 }

  665.                 else{

  666.                   obj[element.name] = element.value;

  667.                 }

  668.               } catch (e) {

  669.                 obj[element.name] = `"${element.value}"`;

  670.               }

  671.             });

  672.           if(!$(`#modal-form .completeData`).hasClass('hide')){

  673.             if(materialData.Images.data){

  674.               const Images = materialData.Images.data.map(item => item.id);

  675.               if(removeMedia && removeMedia.length>0 && removeMedia.some(r=> Images.includes(r))){

  676.                 obj.Images = Images.filter(item => !removeMedia.includes(item));

  677.               }

  678.             }

  679.             for (let i = 0; i < list.files.length; i++) {

  680.               const file = list.files[i];

  681.               formData.append(`files.Images`, file, file.name);

  682.             }

  683. 

  684.             if($('#videoFile').prop('files').length>0){

  685.               obj.Video = [];

  686.               formData.append(

  687.                 `files.Video`,

  688.                 $('#videoFile').prop('files')[0],

  689.                 $('#videoFile').prop('files')[0].name

  690.               );

  691.             }

  692.           }

  693.           else{

  694.             delete obj['ParticipantList'];

  695.           }

  696.           const Attachments = materialData.Attachments.data.map(item => item.id);

  697.           if(removeMedia && removeMedia.length>0 && removeMedia.some(r=> Attachments.includes(r))){

  698.             obj.Attachments = Attachments.filter(item => !removeMedia.includes(item));

  699.           }

  700. 

  701.           for (let i = 0; i < attachment.files.length; i++) {

  702.             const file = attachment.files[i];

  703.             formData.append(`files.Attachments`, file, file.name);

  704.           }

  705.           

  706.           if($('#thumbnail').prop('files').length>0){

  707.             obj.Thumbnail = [];

  708.             formData.append(

  709.               `files.Thumbnail`,

  710.               $('#thumbnail').prop('files')[0],

  711.               $('#thumbnail').prop('files')[0].name

  712.             );

  713.           }

  714.           const request = new XMLHttpRequest();

  715.           request.upload.onprogress = function(evt) {

  716.             if (evt.lengthComputable) {

  717.               const percentComplete = parseInt((evt.loaded / evt.total) * 100);

  718.               loading(percentComplete, true);

  719.             }

  720.           };

  721.           request.onreadystatechange = function() {

  722.             // console.log(this.responseText,request.readyState,request.status);

  723.             if (request.readyState == 4) {

  724.               loading(0, false);

  725.               if (request.status == 200) {

  726.                 location.reload();

  727.               } else {

  728.                 console.log(this.responseURL,this.responseText);

  729.                 showAlert('error', 'Terjadi kesalahan! Harap coba login kembali / hubungi admin!');

  730.               }

  731.             }

  732.           };

  733.           formData.append('data', JSON.stringify(obj));

  734.           if($('#modal-form').attr('operation')=='edit') request.open('PUT', `/api/materials/${$('#selMaterial').val()}`);

  735.           else request.open('PUT', `/api/saveMaterial/${$('#selMaterial').val()}`);

  736.           request.setRequestHeader('Authorization', `Bearer ${await getToken.text()}`);

  737.           request.send(formData);

  738.         } else {

  739.           loading(0, false);

  740.           showAlert('error', 'Terjadi kesalahan. Harap login kembali!');

  741.         }

  742.       }

  743.     } else {

  744.       if (

  745.         $(event.target)

  746.           .serializeArray()

  747.           .filter(item => item.value == '' && !($("#modal-form .completeData input").map((idx,i)=>$(i).attr("name")).toArray().includes(item.name))).length > 0

  748.       ) {

  749.         showAlert('error', 'Cek kembali data yang belum diisi!');

  750.       } else {

  751.         loading(0, true);

  752.         var getToken = await fetch(`/session/key?s=jwt`);

  753.         if (getToken.ok) {

  754.           var obj = {};

  755.           $(event.target)

  756.             .serializeArray()

  757.             .forEach(element => {

  758.               try {

  759.                 if(element.value[0]=='{'){

  760.                   obj[element.name] = JSON.parse(element.value);

  761.                 }

  762.                 else{

  763.                   obj[element.name] = element.value;

  764.                 }

  765.               } catch (e) {

  766.                 obj[element.name] = element.value;

  767.               }

  768.             });

  769.           // console.log(JSON.stringify(obj));

  770.           const formData = new FormData();

  771.           formData.append('data', JSON.stringify(obj));

  772.           // for (let i = 0; i < list.files.length; i++) {

  773.           //   const file = list.files[i];

  774.           //   formData.append(`files.Images`, file, file.name);

  775.           // }

  776.           for (let i = 0; i < attachment.files.length; i++) {

  777.             const file = attachment.files[i];

  778.             formData.append(`files.Attachments`, file, file.name);

  779.           }

  780.           

  781.           formData.append(

  782.             `files.Thumbnail`,

  783.             $('#thumbnail').prop('files')[0],

  784.             $('#thumbnail').prop('files')[0].name

  785.           );

  786.         

  787.           const request = new XMLHttpRequest();

  788.           request.upload.onprogress = function(evt) {

  789.             if (evt.lengthComputable) {

  790.               const percentComplete = parseInt((evt.loaded / evt.total) * 100);

  791.               loading(percentComplete, true);

  792.             }

  793.           };

  794.           request.onreadystatechange = function() {

  795.             if (request.readyState == 4) {

  796.               loading(0, false);

  797.               if (request.status == 200) {

  798.                 location.reload();

  799.               } else {

  800.                 console.log(this.responseURL,this.responseText);

  801.                 showAlert('error', 'Terjadi kesalahan! Harap coba login kembali / hubungi admin!');

  802.               }

  803.             }

  804.           };

  805.           request.open('POST', '/api/materials');

  806.           request.setRequestHeader('Authorization', `Bearer ${await getToken.text()}`);

  807.           request.send(formData);

  808.         } else {

  809.           loading(0, false);

  810.           showAlert('error', 'Terjadi kesalahan. Harap login kembali!');

  811.         }

  812.       }

  813.     }

  814.   });

  815. 

  816.   $('#formFile').change(event => {

  817.     if (event.target.files.length > 0) {

  818.       for (let i = 0; i < event.target.files.length; i++) {

  819.         list.items.add(event.target.files[i]);

  820.         $('#uploadedFile').append(

  821.           `<li name='${event.target.files[i].name.replace(/["']/g, '')}'>${

  822.             event.target.files[i].name

  823.           }

  824.               <button type="button" class="btn btn-secondary btn-sm btn-close btn-icon removeUpload" onclick="removeUpload(event,list)" aria-label="Close"><i class="ni ni-fat-remove"></i></button>

  825.           </li>`

  826.         );

  827.       }

  828.       $(event.target).val('');

  829.     }

  830.   });

  831. 

  832.   $('#formAttachment').change(event => {

  833.     if (event.target.files.length > 0) {

  834.       for (let i = 0; i < event.target.files.length; i++) {

  835.         attachment.items.add(event.target.files[i]);

  836.         $('#uploadedAttachment').append(

  837.           `<li name='${event.target.files[i].name.replace(/["']/g, '')}'>${

  838.             event.target.files[i].name

  839.           }

  840.                         <button type="button" class="btn btn-secondary btn-sm btn-close removeUpload" onclick="removeUpload(event,attachment)" aria-label="Close"><i class="ni ni-fat-remove"></i></button>

  841.                     </li>`

  842.         );

  843.       }

  844.       $(event.target).val('');

  845.     }

  846.   });

  847. 

  848.   $('#formAttachmentPintar').change(event => {

  849.     if (event.target.files.length > 0) {

  850.       for (let i = 0; i < event.target.files.length; i++) {

  851.         attachment.items.add(event.target.files[i]);

  852.         $('#uploadedAttachmentPintar').append(

  853.           `<li name='${event.target.files[i].name.replace(/["']/g, '')}'>${

  854.             event.target.files[i].name

  855.           }

  856.                         <button type="button" class="btn btn-secondary btn-sm btn-close removeUpload" onclick="removeUpload(event,attachment)" aria-label="Close"><i class="ni ni-fat-remove"></i></button>

  857.                     </li>`

  858.         );

  859.       }

  860.       $(event.target).val('');

  861.     }

  862.   });

  863. 

  864.   $('#formFilePintar').change(event => {

  865.     if (event.target.files.length > 0) {

  866.       for (let i = 0; i < event.target.files.length; i++) {

  867.         list.items.add(event.target.files[i]);

  868.         $('#uploadedFilePintar').append(

  869.           `<li name='${event.target.files[i].name.replace(/["']/g, '')}'>${

  870.             event.target.files[i].name

  871.           }

  872.               <button type="button" class="btn btn-secondary btn-sm btn-close removeUpload" onclick="removeUpload(event,list)" aria-label="Close"><i class="ni ni-fat-remove"></i></button>

  873.           </li>`

  874.         );

  875.       }

  876.       $(event.target).val('');

  877.     }

  878.   });

  879. 

  880.   $('#join-form').change(async event => {

  881.     const file = event.target.files[0];

  882.     const data = await file.arrayBuffer();

  883.     const workbook = XLSX.read(data);

  884.     const aoa = XLSX.utils.sheet_to_json(workbook.Sheets[workbook.SheetNames[0]], { header: 0 });

  885.     const container = document.getElementById('participantCounter');

  886.     container.innerHTML = `${aoa.length} Participant(s)`;

  887.     $("input[name='ParticipantList']").val(JSON.stringify(aoa));

  888.   });

  889. });

  890. 

  891. $('#btnDisabled').click(e => {

  892.   e.preventDefault();

  893.   showAlert('error',"Hanya Admin yang dapat membuat Materi Sabtu Pintar!");

  894. });

  895. 

  896. 

  897. $('#btnPintar').click(e => {

  898.   e.preventDefault();

  899.   showForm('Pintar');

  900. });

  901. 

  902. $('#btnSharing').click(e => {

  903.   e.preventDefault();

  904.   showForm('Sharing');

  905. });

  906. 

  907. $('.exportSummary').click(async e => {

  908.   e.preventDefault();

  909.   window.html2canvas = html2canvas;

  910.   var doc = new jspdf.jsPDF('p', 'pt');          

  911.   var source = window.document.getElementById("summaryTable");

  912.   await doc.html(

  913.       source,

  914.       {

  915.         callback:function(pdf){

  916.           pdf.save(`${$('#summaryMaterial').text()}.pdf`);

  917.         },

  918.         html2canvas: { scale: 0.75 },

  919.       }

  920.   );

  921. });