sekolah_adiwiyata/resources/views/modules/sampah/index.blade.php

415 lines
20 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">
<div id="panel-4" class="panel">
<div class="panel-container show">
<div class="panel-content">
<div id="toolbar" class="d-flex gap-2 align-items-center">
<div>
<span>Filter :</span>
</div>
<div>
<select name="tahun" class="form-control filterTahun">
@for ($i = date('Y')-3; date('Y') >= $i; $i++)
<option {{ $i == date('Y') ? 'selected' : '' }} value="{{$i}}">{{$i}}</option>
@endfor
</select>
</div>
{{-- <a class="btn btn-secondary btn-filter btn-sm text-white"><i class="fal fa-filter text-white"></i>&nbsp;Filter</a> --}}
<div>
<a data-toggle="modal" data-target="#modal" class="btn btn-success btn-sm text-white"><i class="fal fa-plus text-white"></i>&nbsp;Tambah Data</a>
</div>
</div>
<table class="table w-100 wrap"
data-search="true"
data-toggle="table"
data-pagination="true"
data-toolbar="#toolbar"
data-show-refresh="false"
data-url="{{route($route.'.grid')}}"
data-ajax-options='{"xhrFields": {"withCredentials": true}}'
data-sort-name="ids"
data-sort-order="desc"
data-page-size="10"
data-id-field="id"
data-query-params="queryParams"
id="grid-data">
<thead class="bg-primary-light text-primary">
<tr>
{{-- <th data-field="action">#</th> --}}
<th data-field="no">No</th>
@if(session('group_alias') != 'sekolah')
<th data-field="sekolah">Sekolah</th>
@endif
<th data-field="tahun">Tahun</th>
<th data-field="bulan">Bulan</th>
<th data-field="organik">Organik (Kg)</th>
<th data-field="sampah_anorganik">An Organik (Kg)</th>
<th data-field="b3">B3 (Kg)</th>
<th data-field="minyak_jelantah">Minyak Jelantah</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">
<div class="modal-content">
<div class="modal-header bg-secondary">
<h5><b>Tambah Data Sampah Terkelola</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>
<form action="{{ route($route.'.store') }}" method="POST">
{{ csrf_field() }}
<div class="modal-body">
<div class="row">
<div class="col-md-6 mb-2">
<div class="form-group">
<label class="col-xl-12 form-label">Tahun</label>
<div class="col-12 pr-1">
<input type="text" class="form-control" name="tahun" value="{{ date('Y') }}" disabled>
</div>
</div>
</div>
<div class="col-md-6 mb-2">
<div class="form-group">
<label class="col-xl-12 form-label">Bulan</label>
<div class="col-12 pr-1">
<select name="bulan" class="form-control is-required @error('bulan') is-invalid @enderror" id="">
<option value="">-- Pilih Bulan --</option>
<option value="1">Januari</option>
<option value="2">Februari</option>
<option value="3">Maret</option>
<option value="4">April</option>
<option value="5">Mei</option>
<option value="6">Juni</option>
<option value="7">Juli</option>
<option value="8">Agustus</option>
<option value="9">September</option>
<option value="10">Oktober</option>
<option value="11">November</option>
<option value="12">Desember</option>
</select>
@error('bulan')
<span class="invalid-feedback" style="display: block!important;"><strong>{{$message}}</strong></span>
@enderror
</div>
</div>
</div>
<div class="col-md-6 mb-2">
<div class="form-group">
<label class="col-xl-12 form-label">Sampah Organik</label>
<div class="col-12 pr-1">
<div class="input-group">
<input type="text" name="organik" class="form-control @error('organik') is-invalid @enderror" placeholder="Masukan Jumlah Sampah Organik">
<div class="input-group-append">
<button class="btn btn-default waves-effect waves-themed" type="button">Kg</button>
</div>
</div>
@error('organik')
<span class="invalid-feedback" style="display: block!important;"><strong>{{$message}}</strong></span>
@enderror
</div>
</div>
</div>
<div class="col-md-6 mb-2">
<div class="form-group">
<label class="col-xl-12 form-label">Sampah An Organik</label>
<div class="col-12 pr-1">
<div class="input-group">
<input type="text" name="anorganik" class="form-control @error('anorganik') is-invalid @enderror" placeholder="Masukan Jumlah Sampah An Organik">
<div class="input-group-append">
<button class="btn btn-default waves-effect waves-themed" type="button">Kg</button>
</div>
</div>
@error('anorganik')
<span class="invalid-feedback" style="display: block!important;"><strong>{{$message}}</strong></span>
@enderror
</div>
</div>
</div>
<div class="col-md-6 mb-2">
<div class="form-group">
<label class="col-xl-12 form-label">Sampah B3</label>
<div class="col-12 pr-1">
<div class="input-group">
<input type="text" name="b3" class="form-control @error('b3') is-invalid @enderror" placeholder="Masukan Jumlah Sampah B3">
<div class="input-group-append">
<button class="btn btn-default waves-effect waves-themed" type="button">Kg</button>
</div>
</div>
@error('b3')
<span class="invalid-feedback" style="display: block!important;"><strong>{{$message}}</strong></span>
@enderror
</div>
</div>
</div>
<div class="col-md-6 mb-2">
<div class="form-group">
<label class="col-xl-12 form-label">Minyak Jelantah</label>
<div class="col-12 pr-1">
<div class="input-group">
<input type="text" name="minyak_jelantah" class="form-control @error('minyak_jelantah') is-invalid @enderror" placeholder="Masukan Jumlah Minyak Jelantah">
<div class="input-group-append">
<button class="btn btn-default waves-effect waves-themed" type="button"></button>
</div>
</div>
@error('minyak_jelantah')
<span class="invalid-feedback" style="display: block!important;"><strong>{{$message}}</strong></span>
@enderror
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary">Simpan</button>
</div>
</form>
</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">
var $table = $('#grid-data');
$('.btn-filter').on('click',function(){
$('#filter').toggleClass('d-none');
});
function queryParams(params) {
$('#toolbar').find('input[name], select').each(function() {
params[$(this).attr('name')] = $(this).val()
})
return params
}
$(function() {
$('.filterTahun').on('change',function(){
$table.bootstrapTable('refresh');
});
});
$("#grid-data").on("click", ".tolak", function() {
var base_url = $(this).attr('data-href');
var id = $(this).attr('data-id');
swal({
title: "Tolak Kuesioner!",
text: "Apa anda yakin ingin tolak kuesioner 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,
xhrFields: {
withCredentials: true
},
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("/kuesioner")}}';
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 Kuesioner!",
text: "Apa anda yakin ingin verifikasi kuesioner 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,
xhrFields: {
withCredentials: true
},
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("/kuesioner")}}';
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;
});
$('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,
xhrFields: {
withCredentials: true
},
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