265 lines
		
	
	
		
			12 KiB
		
	
	
	
		
			PHP
		
	
	
			
		
		
	
	
			265 lines
		
	
	
		
			12 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">
 | |
|         {{$title}}
 | |
|     </h1>
 | |
| </div>
 | |
| <div class="row">
 | |
|     <div class="col-lg-12 mb-2 d-none" id="filter">
 | |
|         <div class="card">
 | |
|             <div class="card-body">
 | |
|                 <h5 class="mb-4"><i class="fal fa-filter"></i> Filter</h5>
 | |
|                 <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-success btn-block"><i class="fal fa-search"></i> Cari Data</button>
 | |
|                                 </div>
 | |
|                             </div>
 | |
|                         </div>
 | |
|                     </div>
 | |
|                 </div>
 | |
|             </div>
 | |
|         </div>
 | |
|     </div>
 | |
|     <div class="col-lg-12">
 | |
|         <div id="panel-4" class="panel">
 | |
|             <div class="panel-container show">
 | |
|                 <div class="panel-content">
 | |
|                     <div id="toolbar">
 | |
|                         @if(permission('is_create', $route, 'module',true))
 | |
|                         <a href="{{route($route.'.create')}}" class="btn btn-sm btn-primary"><i class="fal fa-plus"></i> Tambah {{$title}}</a>
 | |
|                         @endif
 | |
|                         <a class="btn btn-secondary btn-filter btn-sm text-white"><i class="fal fa-filter text-white"></i> Filter</a>
 | |
|                     </div>
 | |
| 
 | |
|                     <table class="table 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="bg-primary-light text-primary">
 | |
|                         <tr>
 | |
|                           <th data-field="action">#</th>
 | |
|                           <th data-field="no">No</th>
 | |
|                           <th data-field="judul">Judul Surat</th>
 | |
|                           <th data-field="sekolah">Sekolah</th>
 | |
|                           <th data-field="tahun">Tahun</th>
 | |
|                           <th data-field="jenis_usulan">Jenis Usulan</th>
 | |
|                           <th data-field="file">File</th>
 | |
|                         </tr>
 | |
|                       </thead>
 | |
|                       <tbody></tbody>
 | |
|                   </table>
 | |
|                     <!-- datatable end -->
 | |
|                 </div>
 | |
|             </div>
 | |
|         </div>
 | |
|     </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">
 | |
|     $('.btn-filter').on('click',function(){
 | |
|         $('#filter').toggleClass('d-none');
 | |
|     });
 | |
|     $('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 |