508 lines
		
	
	
		
			22 KiB
		
	
	
	
		
			PHP
		
	
	
			
		
		
	
	
			508 lines
		
	
	
		
			22 KiB
		
	
	
	
		
			PHP
		
	
	
| @extends('layouts.master')
 | |
| @section('page-css')
 | |
| <link rel="stylesheet" media="screen, print" href="{{asset('assets/css/datagrid/datatables/datatables.bundle.css')}}">
 | |
| <link rel="stylesheet" href="{{asset('assets/css/bootstrap-table.min.css')}}">
 | |
| @endsection
 | |
| @section('content')
 | |
| <div class="subheader">
 | |
|     <h1 class="subheader-title">
 | |
|         <i class='subheader-icon fal fa-building'></i> {{$title}}
 | |
|     </h1>
 | |
| </div>
 | |
| <div class="row">
 | |
|     <div class="col-lg-12">
 | |
|         <div class="accordion" id="accordionExample">
 | |
|           <div class="card">
 | |
|             <div class="card-header" id="headingOne">
 | |
|               <h2 class="mb-0">
 | |
|                 <button class="btn btn-link btn-block text-left" type="button" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
 | |
|                   <i class="fal fa-filter"></i> Filter
 | |
|                 </button>
 | |
|               </h2>
 | |
|             </div>
 | |
| 
 | |
|             <div id="collapseOne" class="collapse" aria-labelledby="headingOne" data-parent="#accordionExample">
 | |
|               <div class="card-body">
 | |
|                 <div class="row">
 | |
|                     <div class="col-md-12 mb-2">
 | |
|                         <div class="row">
 | |
|                             <div class="col-md-3">
 | |
|                                 <div class="form-group">
 | |
|                                     <select class="form-control select2">
 | |
|                                         <option value="">-- PILIH TINGKAT --</option>
 | |
|                                         <option value="1">SD</option>
 | |
|                                         <option value="2">SMP</option>
 | |
|                                         <option value="3">SMA</option>
 | |
|                                         <option value="4">SMK</option>
 | |
|                                         <option value="5">MI</option>
 | |
|                                         <option value="6">MTs</option>
 | |
|                                         <option value="7">MA</option>
 | |
|                                         <option value="8">SD LB</option>
 | |
|                                         <option value="9">SMP LB</option>
 | |
|                                         <option value="10">SMA LM</option>
 | |
|                                         <option value="11">SLB Khusus</option>
 | |
|                                     </select>
 | |
|                                 </div>
 | |
|                             </div>
 | |
|                             <div class="col-md-3">
 | |
|                                 <div class="form-group">
 | |
|                                     <select class="form-control select2">
 | |
|                                         <option value="">-- PILIH STATUS --</option>
 | |
|                                         <option value="Negeri">Negeri</option>
 | |
|                                         <option value="Swasta">Swasta</option>
 | |
|                                     </select>
 | |
|                                 </div>
 | |
|                             </div>
 | |
|                             <div class="col-md-3">
 | |
|                                 <div class="form-group">
 | |
|                                     <select class="form-control select2">
 | |
|                                         <option value="">-- PILIH LEVEL --</option>
 | |
|                                         <option value="1"> LEVEL 1</option>
 | |
|                                         <option value="2"> LEVEL 2</option>
 | |
|                                         <option value="3"> LEVEL 3</option>
 | |
|                                         <option value="4"> LEVEL 4</option>
 | |
|                                         <option value="5"> LEVEL 5</option>
 | |
|                                     </select>
 | |
|                                 </div>
 | |
|                             </div>
 | |
|                             <div class="col-md-3">
 | |
|                                 <div class="form-group">
 | |
|                                     <select class="form-control select2">
 | |
|                                         <option value="">-- PILIH JENIS USULAN --</option>
 | |
|                                         <option value="1">Kab/Kota</option>
 | |
|                                         <option value="2">Provinsi</option>
 | |
|                                         <option value="3">Nasional</option>
 | |
|                                         <option value="4">Mandiri</option>
 | |
|                                     </select>
 | |
|                                 </div>
 | |
|                             </div>
 | |
|                         </div>
 | |
|                     </div>
 | |
|                     <div class="col-md-12 mb-2">
 | |
|                         <div class="row">
 | |
|                             <div class="col-md-3">
 | |
|                                 <div class="form-group">
 | |
|                                     <select name="provinsi" class="form-control select2" id="provinsi">
 | |
|                                         <option value="0">- PILIH PROVINSI -</option>
 | |
|                                         @foreach($provinsi as $datProv)
 | |
|                                         <option value="{{encode_id($datProv->MsProvinsiId)}}">{{$datProv->name}}</option>
 | |
|                                         @endforeach
 | |
|                                     </select>
 | |
|                                 </div>
 | |
|                             </div>
 | |
|                             <div class="col-md-3">
 | |
|                                 <div class="form-group">
 | |
|                                     <select name="kabupaten" class="form-control select2" id="kabupaten">
 | |
|                                         <option value="0">- PILIH KABUPATEN/KOTA -</option>
 | |
|                                     </select>
 | |
|                                 </div>
 | |
|                             </div>
 | |
|                             <div class="col-md-3">
 | |
|                                 <div class="form-group">
 | |
|                                     <select name="kecamatan" class="form-control select2" id="kecamatan" required>
 | |
|                                         <option value="0">- PILIH KECAMATAN -</option>
 | |
|                                     </select>
 | |
|                                 </div>
 | |
|                             </div>  
 | |
|                             <div class="col-md-3">
 | |
|                                 <div class="form-group">
 | |
|                                     <button class="btn btn-warning btn-block"><i class="fal fa-search"></i> Cari Data</button>
 | |
|                                 </div>
 | |
|                             </div>
 | |
|                         </div>
 | |
|                     </div>
 | |
|                 </div>
 | |
|               </div>
 | |
|             </div>
 | |
|           </div>
 | |
|         </div>
 | |
| 
 | |
|         <div id="panel-4" class="panel">
 | |
|             <div class="panel-container show">
 | |
|                 <div class="panel-content">
 | |
|                     <div id="toolbar"></div>
 | |
| 
 | |
|                     <table class="table table-bordered table-hover table-striped w-100" 
 | |
|                     data-search="true"
 | |
|                     data-toggle="table"
 | |
|                     data-pagination="true"
 | |
|                     data-toolbar="#toolbar"
 | |
|                     data-show-refresh="false"
 | |
|                     data-url="{{route($route.'.grid')}}"
 | |
|                     data-sort-name="ids"
 | |
|                     data-sort-order="desc"
 | |
|                     data-page-size="10"
 | |
|                     data-id-field="id"
 | |
|                     id="grid-data">
 | |
|                       <thead class="text-white">
 | |
|                         <tr class="table-primary">
 | |
|                           <th data-field="action">#</th>
 | |
|                           <th data-field="no">No</th>
 | |
|                           <th data-field="tahun">Tahun</th>
 | |
|                           <th data-field="jenis_usulan">Usulan CSA</th>
 | |
|                           <th data-field="npsn">NPSN</th>
 | |
|                           <th data-field="nama">Nama Sekolah</th>
 | |
|                           <th data-field="wilayah">Wilayah</th>
 | |
|                           <th data-field="labelDok">Status Dokumen</th>
 | |
|                         </tr>
 | |
|                       </thead>
 | |
|                       <tbody></tbody>
 | |
|                   </table>
 | |
|                     <!-- datatable end -->
 | |
|                 </div>
 | |
|             </div>
 | |
|         </div>
 | |
|     </div>
 | |
| </div>
 | |
| 
 | |
| <div class="modal fade" id="modal" tabindex="-1" role="dialog" aria-hidden="true">
 | |
|     <div class="modal-dialog modal-lg modal-dialog-centered" role="document">
 | |
|         <form action="#" method="POST" enctype="multipart/form-data" id="form">
 | |
|             {{csrf_field()}}
 | |
|             <input type="hidden" name="secure_id" class="secure_id" value="">
 | |
|             <div class="modal-content">
 | |
|                 <div class="modal-header">
 | |
|                     <h5><b>{{$title}}</b></h5>
 | |
|                     <button type="button" class="close" data-dismiss="modal" aria-label="Close">
 | |
|                         <span aria-hidden="true"><i class="fal fa-times"></i></span>
 | |
|                     </button>
 | |
|                 </div>
 | |
|                 <div class="modal-body">
 | |
|                     <table class="table table-nobordered wrap">
 | |
|                         <tr>
 | |
|                             <td width="50%">
 | |
|                                 <div class="jenisusulan"></div>
 | |
|                                 <small class="text-primary">(Link Google Drive)</small>
 | |
|                             </td>
 | |
|                             <td>
 | |
|                                 <input type="text" class="form-control is-required" name="file" required>
 | |
|                                 <small class="text-primary">Contoh link : https://example.com</small>
 | |
|                                 <br>
 | |
|                                 <a href="#" class="btn btn-primary btn-xs link mt-2" style="display: none;" target="_blank"><i class="fal fa-link"></i> Link Lampiran</a>
 | |
|                             </td>
 | |
|                         </tr>
 | |
|                     </table>
 | |
|                 </div>
 | |
|                 @if(session('group_alias') == 'sekolah')
 | |
|                 <div class="modal-footer">
 | |
|                     <button type="submit" class="btn btn-primary" id="btnSave">Simpan</button>
 | |
|                     <button type="button" class="btn btn-secondary" data-dismiss="modal">Batal</button>
 | |
|                 </div>
 | |
|                 @endif
 | |
|             </div>
 | |
|         </form>
 | |
|     </div>
 | |
| </div>
 | |
| @endsection
 | |
| @section('page-js')
 | |
| <script src="{{asset('assets/js/datagrid/datatables/datatables.bundle.js')}}"></script>
 | |
| <script src="{{asset('assets/js/bootstrap-table.min.js')}}"></script>
 | |
| <script type="text/javascript">
 | |
|     // <tr class="extra-row" style="display: none;">
 | |
|     //             <td colspan="8">
 | |
|     //                 <strong>Detail Tambahan:</strong> Informasi tambahan lainnya.
 | |
|     //             </td>
 | |
|     //         </tr>
 | |
|     $("#grid-data").on("click", ".toggle-row", function() {
 | |
|         let btn = $(this);
 | |
|         let row = btn.closest("tr");
 | |
|         let icon = btn.find("i");
 | |
|         let jenis_usulan = $(this).attr('data-jenisusulan');
 | |
|         let link = $(this).attr('data-link');
 | |
| 
 | |
|         if (row.next().hasClass("extra-row")) {
 | |
|             row.next().remove(); // Hapus jika sudah ada
 | |
|             icon.removeClass("btn-secondary").addClass("btn-secondary");
 | |
|         } else {
 | |
|             let newRow = `
 | |
|                 <tr class="extra-row">
 | |
|                     <td colspan="8">
 | |
|                         ${jenis_usulan} <br>`
 | |
|                         if(link != ''){
 | |
| 
 | |
|                        newRow += `<a class="btn btn-primary btn-xs" href="${link}" target="_blank"><i class="fal fa-link"></i> Link Lampiran</a>`;
 | |
|                         }
 | |
|                     newRow += `</td>
 | |
|                 </tr>
 | |
|             `;
 | |
|             row.after(newRow);
 | |
|             icon.removeClass("btn-secondary").addClass("btn-secondary");
 | |
|         }
 | |
|     });
 | |
| 
 | |
|     $("#grid-data").on("click", ".tolak", function() {
 | |
|         var base_url = $(this).attr('data-href');
 | |
|         var id = $(this).attr('data-id');
 | |
|         swal({
 | |
|              title: "Tolak Dokumen!",
 | |
|              text: "Apa anda yakin ingin tolak Dokumen ini ?",
 | |
|              type: "warning",
 | |
|              showCancelButton: true,
 | |
|              confirmButtonColor: "#BF3131",
 | |
|              confirmButtonText: "Tolak Sekarang",
 | |
|              cancelButtonText: "Batal",
 | |
|              closeOnConfirm: true,
 | |
|              closeOnCancel: true
 | |
|          },
 | |
|          function(isConfirm) {
 | |
|             if(isConfirm){
 | |
|               
 | |
|               request = $.ajax({
 | |
|                   url: base_url,
 | |
|                   type: "GET",
 | |
|               });
 | |
| 
 | |
|               // Callback handler that will be called on success
 | |
|               request.done(function(response, textStatus, jqXHR){
 | |
|                   console.log(response);
 | |
|                   toastr.success("Berhasil Login", 'Berhasil!', {positionClass: 'toast-bottom-right', containerId: 'toast-bottom-right'});
 | |
|                   window.location.href = '{{url("/usulan/administrasi")}}';
 | |
|                   history.pushState(null, null, location.href);
 | |
|                   window.onpopstate = function () {
 | |
|                       history.go(1);
 | |
|                   };
 | |
|               });
 | |
| 
 | |
|               // Callback handler that will be called on failure
 | |
|               request.fail(function (jqXHR, textStatus, errorThrown){
 | |
|                   toastr.error(
 | |
|                       "Gagal "+textStatus, errorThrown
 | |
|                   );
 | |
|               });
 | |
|             }
 | |
|          }); 
 | |
|         return false;
 | |
|     });
 | |
|     $("#grid-data").on("click", ".verifikasi", function() {
 | |
|         var base_url = $(this).attr('data-href');
 | |
|         var id = $(this).attr('data-id');
 | |
|         swal({
 | |
|              title: "Verifikasi Dokumen!",
 | |
|              text: "Apa anda yakin ingin verifikasi Dokumen ini ?",
 | |
|              type: "warning",
 | |
|              showCancelButton: true,
 | |
|              confirmButtonColor: "#3F7D58",
 | |
|              confirmButtonText: "Approve Sekarang",
 | |
|              cancelButtonText: "Batal",
 | |
|              closeOnConfirm: true,
 | |
|              closeOnCancel: true
 | |
|          },
 | |
|          function(isConfirm) {
 | |
|             if(isConfirm){
 | |
|               
 | |
|               request = $.ajax({
 | |
|                   url: base_url,
 | |
|                   type: "GET",
 | |
|               });
 | |
| 
 | |
|               // Callback handler that will be called on success
 | |
|               request.done(function(response, textStatus, jqXHR){
 | |
|                   console.log(response);
 | |
|                   toastr.success("Berhasil Login", 'Berhasil!', {positionClass: 'toast-bottom-right', containerId: 'toast-bottom-right'});
 | |
|                   window.location.href = '{{url("/usulan/administrasi")}}';
 | |
|                   history.pushState(null, null, location.href);
 | |
|                   window.onpopstate = function () {
 | |
|                       history.go(1);
 | |
|                   };
 | |
|               });
 | |
| 
 | |
|               // Callback handler that will be called on failure
 | |
|               request.fail(function (jqXHR, textStatus, errorThrown){
 | |
|                   toastr.error(
 | |
|                       "Gagal "+textStatus, errorThrown
 | |
|                   );
 | |
|               });
 | |
|             }
 | |
|          }); 
 | |
|         return false;
 | |
|     });
 | |
|     $('#grid-data').on('click',".btnModal", function(e) {
 | |
|         $('.jenisusulan').html($(this).attr('data-jenisusulan'));
 | |
|         $('.secure_id').val($(this).attr('data-secureid'));
 | |
|         var link = $(this).attr('data-link');
 | |
|         if(link != ''){
 | |
|             $('.link').show();
 | |
|             $('.link').attr('href',link);
 | |
|         }else{
 | |
|             $('.link').hide();
 | |
|             $('.link').attr('href','');
 | |
|         }
 | |
|     });
 | |
|     $('#btnSave').on('click',function(e){
 | |
|         e.preventDefault();
 | |
|         let currentForm = $("#form").serializeArray();
 | |
|         console.log(currentForm);
 | |
| 
 | |
|         let formData = {};
 | |
|         let allData = {};
 | |
|         let isValid = true; // Flag validasi
 | |
| 
 | |
|         currentForm.forEach(field => {
 | |
|             let name = field.name.replace(/\[\]$/, ''); // Hapus "[]" di akhir nama input
 | |
| 
 | |
|             if (allData[name]) {
 | |
|                 if (!Array.isArray(allData[name])) {
 | |
|                     allData[name] = [allData[name]];
 | |
|                 }
 | |
|                 allData[name].push(field.value);
 | |
|             } else {
 | |
|                 allData[name] = field.value;
 | |
|             }
 | |
|         });
 | |
| 
 | |
|         $('.is-required').each(function () {
 | |
|             let type = $(this).attr('type');
 | |
|             let name = $(this).attr('name');
 | |
|             let value = $(this).val()?.trim(); // Pastikan nilai di-trim untuk menghindari spasi kosong
 | |
| 
 | |
|             // Validasi input teks atau lainnya
 | |
|             if (!value) {
 | |
|                 isValid = false;
 | |
|                 $(this).addClass("is-invalid");
 | |
|             } else {
 | |
|                 $(this).removeClass("is-invalid");
 | |
|             }
 | |
|         });
 | |
| 
 | |
|         // Jika validasi gagal, hentikan submit
 | |
|         if (!isValid) {
 | |
|             toastr.error("Harap isi semua field yang wajib diisi", 'Error!', {positionClass: 'toast-bottom-right', containerId: 'toast-bottom-right'});
 | |
|             // alert(".");
 | |
|             return;
 | |
|         }
 | |
| 
 | |
|         $.ajax({
 | |
|             url: "{{route($route.'.store')}}", // Ganti dengan URL API-mu
 | |
|             type: 'POST', // Bisa juga 'POST' kalau perlu
 | |
|             data: { 
 | |
|                 _token:'{{csrf_token()}}',
 | |
|                 data: allData 
 | |
|             }, // Kirim number sebagai parameter
 | |
|             dataType: 'json', // Format respons JSON
 | |
|             beforeSend: function () {
 | |
|                 $('#loading-spinner').show(); // Menampilkan spinner
 | |
|             },
 | |
|             success: function (response) {
 | |
|                 if(response.status == true){
 | |
|                     toastr.success("Berhasil menyimpan data", 'Success!', {positionClass: 'toast-bottom-right', containerId: 'toast-bottom-right'});
 | |
|                 }else{
 | |
|                     toastr.warning(response.message, {positionClass: 'toast-bottom-right', containerId: 'toast-bottom-right'});
 | |
|                 }
 | |
|                 location.reload();
 | |
|             },
 | |
|             error: function (xhr, status, error) {
 | |
|                 toastr.error("Maaf Terjadi Kesalahan Menyimpan Data", 'Error!', {positionClass: 'toast-bottom-right', containerId: 'toast-bottom-right'});
 | |
|             },
 | |
|             complete: function () {
 | |
|                 $('#loading-spinner').hide(); // Sembunyikan spinner setelah request selesai
 | |
|             }
 | |
|         });
 | |
| 
 | |
|    });
 | |
|     $('select').on("select2:selecting", function(e) {
 | |
|               var selectorOrigin = this.id;
 | |
|               var id = e.params.args.data.id;
 | |
|               
 | |
|               
 | |
|               if(selectorOrigin=='provinsi'){
 | |
|                 $('#loading-spinner').show();
 | |
|                 clear('kabupaten');
 | |
|                 selector = 'kabupaten';
 | |
|                 url_to = 'kabupaten';
 | |
|                 getSelect(id, selector, url_to);
 | |
|               }
 | |
| 
 | |
|               if(selectorOrigin=='kabupaten'){
 | |
|                 $('#loading-spinner').show();
 | |
|                 clear('kecamatan');
 | |
|                 selector = 'kecamatan';
 | |
|                 url_to = 'kecamatan';
 | |
|                 getSelect(id, selector, url_to);
 | |
|               }
 | |
|               if(selectorOrigin=='kecamatan'){
 | |
|                 $('#loading-spinner').show();
 | |
|                 clear('sekolah');
 | |
|                 selector = 'sekolah';
 | |
|                 url_to = 'sekolah';
 | |
|                 getSelect(id, selector, url_to);
 | |
|               }
 | |
|             });
 | |
| 
 | |
|             function clear(elementId) {
 | |
|               $('#' + elementId).empty();
 | |
|               $('#' + elementId).select2();
 | |
|             }
 | |
| 
 | |
|             function getSelect(id, selectTo, urlTo, selected = "") {
 | |
|                 id = id;
 | |
|                 var base_url = "{{url('/')}}";
 | |
|                 //alert(id);
 | |
|                 destino = "#" + selectTo;
 | |
|                 valor = $('#' + id).find(":selected").val();
 | |
| 
 | |
|                 $.ajax({
 | |
|                         method: "POST",
 | |
|                         url: base_url + "/get/" + urlTo,
 | |
|                         data: {
 | |
|                         _token: '{{csrf_token()}}',
 | |
|                             id: id
 | |
|                         }
 | |
|                     }).done(function(msg) {
 | |
|                       obj = msg.data;
 | |
| 
 | |
|                       if (obj.length > 0) {
 | |
|                         //Clear the current options
 | |
|                         $(destino).empty();
 | |
|                         
 | |
|                         if(selectTo=='kabupaten'){
 | |
|                           $(destino).append('<option value="">-PILIH KABUPATEN/KOTA-</option>').select2("val", "0");
 | |
| 
 | |
| 
 | |
|                           
 | |
|                           $.each(obj, function(index) {
 | |
|                             value = obj[index].id;
 | |
|                             text = obj[index].name;
 | |
|                             $(destino).append('<option value=' + value + '>' + text + '</option>');
 | |
|                           });
 | |
|                           console.log(selected)
 | |
|                           if (selected) {
 | |
|                             $(destino).val(selected).trigger('change');
 | |
|                             selected = "";
 | |
|                           }
 | |
|                         }
 | |
| 
 | |
|                         if(selectTo=='kecamatan'){
 | |
|                           $(destino).append('<option value="">-PILIH KECAMATAN-</option>').select2("val", "0");
 | |
|                           
 | |
|                           $.each(obj, function(index) {
 | |
|                             value = obj[index].id;
 | |
|                             text = obj[index].name;
 | |
|                             $(destino).append('<option value=' + value + '>' + text + '</option>');
 | |
|                           });
 | |
|                           console.log(selected)
 | |
|                           if (selected) {
 | |
|                             $(destino).val(selected).trigger('change');
 | |
|                             selected = "";
 | |
|                           }
 | |
|                         }
 | |
| 
 | |
|                         
 | |
|                       } else {
 | |
| 
 | |
|                         if(selectTo=='provinsi'){
 | |
|                           $(destino).empty().append('<option value="0">-PILIH PROVINSI-</option>').select2("val", "0");
 | |
|                         }
 | |
|                         if(selectTo=='kabupaten'){
 | |
|                           $(destino).empty().append('<option value="0">-PILIH KABUPATEN/KOTA-</option>').select2("val", "0");
 | |
|                         }
 | |
|                         if(selectTo=='kecamatan'){
 | |
|                           $(destino).empty().append('<option value="0">-PILIH KECAMATAN-</option>').select2("val", "0");
 | |
|                         }
 | |
|                         
 | |
|                       }
 | |
|                       $('#loading-spinner').hide();
 | |
|                     });
 | |
|                   return false;
 | |
|             }
 | |
| </script>
 | |
| @endsection |