144 lines
5.0 KiB
PHP
144 lines
5.0 KiB
PHP
@extends('layouts.backapp')
|
|
|
|
@section('content')
|
|
<div class="kt-portlet kt-portlet--mobile" id="kt_blockui_datatable">
|
|
<div class="kt-portlet__head kt-portlet__head--lg">
|
|
<div class="kt-portlet__head-label">
|
|
<span class="kt-portlet__head-icon">
|
|
<i class="kt-font-brand flaticon2-line-chart"></i>
|
|
</span>
|
|
<h3 class="kt-portlet__head-title">
|
|
Laporan Performa Dealer
|
|
</h3>
|
|
</div>
|
|
<div class="kt-portlet__head-toolbar">
|
|
<div class="kt-portlet__head-wrapper">
|
|
<div class="kt-portlet__head-actions mt-2 mb-2">
|
|
<a href="{{ route('report.transaction.bulkclose') }}" id="bulk-close" class="btn btn-warning">Close Terpilih</a>
|
|
<button id="export" class="btn btn-success">Export</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="kt-portlet__body">
|
|
<ul class="nav nav-tabs" role="tablist">
|
|
<li class="nav-item">
|
|
<a class="nav-link active" data-toggle="tab" href="#" data-target="#kt_tabs_1_1">Tabel</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" data-toggle="tab" href="#kt_tabs_1_2">Diagram</a>
|
|
</li>
|
|
</ul>
|
|
|
|
<div class="tab-content">
|
|
<div class="tab-pane active" id="kt_tabs_1_1" role="tabpanel">
|
|
<div class="table-responsive">
|
|
<!--begin: Datatable -->
|
|
<table class="table table-striped table-responsive table-bordered table-hover table-checkable" id="kt_table">
|
|
<thead>
|
|
<tr>
|
|
{{-- <th><input type="checkbox" onclick="$('input[name*=\'selected\']').prop('checked', this.checked);" /></th> --}}
|
|
<th rowspan="2">No</th>
|
|
<th rowspan="2">SA</th>
|
|
<th colspan="{{ $work_count }}" class="text-center">Pekerjaan</th>
|
|
</tr>
|
|
<tr>
|
|
@foreach ($works as $work)
|
|
<th>{{ $work['name'] }}</th>
|
|
@endforeach
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
@foreach ($trxs as $index => $transaction)
|
|
<tr>
|
|
<td>{{ $index + 1 }}</td>
|
|
<td>{{ $transaction['sa_name'] }}</td>
|
|
@foreach ($transaction['works'] as $item)
|
|
<td>{{ $item['qty'] }}</td>
|
|
@endforeach
|
|
</tr>
|
|
@endforeach
|
|
</tbody>
|
|
</table>
|
|
<!--end: Datatable -->
|
|
</div>
|
|
</div>
|
|
<div class="tab-pane" id="kt_tabs_1_2" role="tabpanel">
|
|
<div style="margin-top: 100px"><canvas id="sa-chart"></canvas></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<input type="hidden" name="ajax_url" value="{{ route('report.transaction_sa') }}">
|
|
@endsection
|
|
|
|
@section('javascripts')
|
|
<script>
|
|
$.ajaxSetup({
|
|
headers: {
|
|
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
|
|
}
|
|
});
|
|
|
|
function random_rgba(alpha) {
|
|
var o = Math.round, r = Math.random, s = 255;
|
|
return 'rgba(' + o(r()*s) + ',' + o(r()*s) + ',' + o(r()*s) + ','+ alpha +')';
|
|
}
|
|
|
|
let labels = JSON.parse('{{ $sa_names }}'.replace(/("\;)/g,"\""));
|
|
let labels2 = []
|
|
labels.forEach(function(label) {
|
|
if (/\s/.test(label)) {
|
|
labels2.push(label.split(" "))
|
|
}else{
|
|
labels2.push(label)
|
|
}
|
|
})
|
|
|
|
const trx_data = JSON.parse('{{ $trx_data }}'.replace(/("\;)/g,"\""));
|
|
let trxs = []
|
|
trx_data.forEach(trx => {
|
|
let data = {
|
|
label : trx['work_name'],
|
|
data: trx[['qty']],
|
|
fill: false,
|
|
backgroundColor: random_rgba(0.2),
|
|
borderColor: random_rgba(1),
|
|
borderWidth: 1
|
|
}
|
|
|
|
trxs.push(data)
|
|
});
|
|
|
|
const data = {
|
|
labels: labels2,
|
|
datasets: trxs
|
|
};
|
|
|
|
new Chart($("#sa-chart"), {
|
|
type: 'bar',
|
|
data: data,
|
|
options: {
|
|
indexAxis: 'y',
|
|
maintainAspectRatio: false,
|
|
scales: {
|
|
xAxis: {
|
|
position: 'top'
|
|
}
|
|
},
|
|
plugins: {
|
|
legend: {
|
|
display: true,
|
|
labels: {
|
|
color: 'rgb(255, 99, 132)'
|
|
},
|
|
position: 'bottom'
|
|
}
|
|
}
|
|
}
|
|
});
|
|
$('#kt_table').DataTable();
|
|
</script>
|
|
@endsection |