sigd/resources/views/modules/tool/calculation/index.blade.php

144 lines
5.1 KiB
PHP

@extends('layouts.master')
@section('title', 'Kalkulasi Emisi')
@section('content')
<div class="card shadow-sm">
<div class="card-header d-flex justify-content-between align-items-center">
<h5 class="mb-0 font-weight-bold">Kalkulasi Emisi</h5>
<a href="{{ route('calculation.create') }}" class="btn btn-primary float-right">Kalkulasi Emisi</a>
</div>
<div class="card-body">
@if (session('success'))
<div class="alert alert-success">
{{ session('success') }}
</div>
@endif
<div class="row">
<div class="col-md-2">
<div class="form-group">
<label for="sector">Filter Sektor:</label>
<select id="sector" name = "sector" class="form-control">
<option>SEMUA SEKTOR</option>
@foreach ($sectors as $sector)
<option value="{{ $sector->code }}"
{{ request('sector', null) == $sector->code ? 'selected' : '' }}>
{{ $sector->name }}
</option>
@endforeach
</select>
</div>
</div>
<div class="col-md-2 pr-1">
<div class="form-group">
<label for="inventoryYear">Tahun Inventory:</label>
<div class="input-group">
<select name="inventoryYear" id="inventoryYear" class="form-control">
<option>SEMUA TAHUN</option>
@for ($year = date('Y'); $year >= 2000; $year--)
<option value="{{ $year }}"
{{ old('inventoryYear') == $year ? 'selected' : '' }}>
{{ $year }}
</option>
@endfor
</select>
</div>
</div>
</div>
</div>
<div class="table-responsive">
<table class="table align-items-center mb-0 display" id="data-table" style="width:100%">
<thead>
<tr>
<th scope="col">Waktu Input</th>
<th scope="col">Tahun Inventory</th>
<th scope="col">Sektor</th>
<th scope="col">Status</th>
<th scope="col">Waktu Eksekusi</th>
<th scope="col">Waktu Selesai</th>
<th scope="col">Durasi</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
</div>
@endsection
@section('js')
<script>
$(document).ready(function() {
$('#sector').select2({
placeholder: 'Pilih Kategori',
// allowClear: true,
});
$('#inventoryYear').select2({
placeholder: 'Pilih Tahun',
// allowClear: true,
});
var table = $('#data-table').DataTable({
pageLength: 10,
responsive: true,
serverSide: true,
scrollX: true,
searchDelay: 1000,
ajax: {
url: '{{ route('calculation.index') }}',
data: function(d) {
d.sectorFilter = $('#sector').val();
d.inventoryYearFilter = $('#inventoryYear').val();
}
},
columns: [
{
data: 'created_at',
name: 'created_at',
},
{
data: 'inventory_year',
name: 'inventory_year'
},
{
data: 'sector',
name: 'sector'
},
{
data: 'status',
name: 'status'
},
{
data: 'executed_time',
name: 'executed_time',
},
{
data: 'finished_time',
name: 'finished_time',
},
{
data: 'duration',
name: 'duration'
},
],
order: [
[0, 'desc']
]
});
$('#sector').change(function() {
table.draw();
});
$('#inventoryYear').change(function() {
table.draw();
});
});
</script>
@endsection