arifal/CKB
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first initial

Browse Source
This commit is contained in:
arifal
2025-05-27 19:09:17 +07:00
commit 80375d8af3
1587 changed files with 572586 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

368
resources/views/dashboard.blade.php.old2 Normal file
View File

@@ -0,0 +1,368 @@
@extends('layouts.backapp')
@section('styles')
<style>
.kt-spinner--info {
width: 100%;
height: 100%;
}
.kt-spinner--info::before {
width: 300px;
height: 300px;
top: 30%;left: 30%;
}
</style>
@endsection
@section('content')
<div class="row">
<div class="col-12">
<div class="kt-portlet kt-portlet--mobile" id="kt_blockui_datatable">
<div class="kt-portlet__head kt-portlet__head--lg row pt-4">
<div class="col-6">
<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 Dealers
</h3>
</div>
</div>
<div class="col-6">
<form action="{{ route('dashboard') }}" method="get" class="row" style="display: flex; justify-content:right;">
<div class="col-lg-5 col-4">
<div class="form-group float-right" >
<label for="dealer">Dealer</label>
<select name="dealer" id="dealer" class="form-control">
<option value="all" @if($dealer == 'all') selected @endif>Semua Dealer</option>
@foreach ($dealers_data as $dealer_data)
<option value="{{ $dealer_data->id }}" @if($dealer == $dealer_data->id) selected @endif>{{ $dealer_data->name }}</option>
@endforeach
</select>
</div>
</div>
<div class="col-lg-3 col-4">
<div class="form-group float-right" >
<label for="month">Bulan</label>
<select name="month" id="month" class="form-control">
<option value="01" @if($month == '01') selected @endif>Januari</option>
<option value="02" @if($month == '02') selected @endif>Februari</option>
<option value="03" @if($month == '03') selected @endif>Maret</option>
<option value="04" @if($month == '04') selected @endif>April</option>
<option value="05" @if($month == '05') selected @endif>Mei</option>
<option value="06" @if($month == '06') selected @endif>Juni</option>
<option value="07" @if($month == '07') selected @endif>Juli</option>
<option value="08" @if($month == '08') selected @endif>Agustus</option>
<option value="09" @if($month == '09') selected @endif>September</option>
<option value="10" @if($month == '10') selected @endif>Oktober</option>
<option value="11" @if($month == '11') selected @endif>November</option>
<option value="12" @if($month == '12') selected @endif>Desember</option>
</select>
</div>
</div>
<div class="col-lg-2 col-4">
<button class="btn btn-primary float-right">Cari</button>
</div>
</form>
</div>
{{-- <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 Dealers
</h3>
</div>
<div class="kt-portlet__head-toolbar">
<div class="kt-portlet__head-wrapper">
<div class="kt-portlet__head-actions mt-4">
<form action="{{ route('dashboard') }}" method="get">
<div class="form-group">
<label for="month">Bulan</label>
<select name="month" id="month" class="form-control">
<option value="01" @if($month == '01') selected @endif>Januari</option>
<option value="02" @if($month == '02') selected @endif>Februari</option>
<option value="03" @if($month == '03') selected @endif>Maret</option>
<option value="04" @if($month == '04') selected @endif>April</option>
<option value="05" @if($month == '05') selected @endif>Mei</option>
<option value="06" @if($month == '06') selected @endif>Juni</option>
<option value="07" @if($month == '07') selected @endif>Juli</option>
<option value="08" @if($month == '08') selected @endif>Agustus</option>
<option value="09" @if($month == '09') selected @endif>September</option>
<option value="10" @if($month == '10') selected @endif>Oktober</option>
<option value="11" @if($month == '11') selected @endif>November</option>
<option value="12" @if($month == '12') selected @endif>Desember</option>
</select>
</div>
<button class="btn btn-primary">Cari</button>
</form>
</div>
</div>
</div> --}}
</div>
<div class="kt-portlet__body" id="data">
{{-- <div id="spinner-data" style="height: 400px;" class="kt-spinner kt-spinner--info"></div> --}}
<!--begin: Datatable -->
<style>
.table-responsive {
height: 60vh;
overflow: auto;
}
.nav-link-tab {
font-weight: bold !important;
}
.nav-link-tab.active {
font-weight: normal !important;
}
.dataTables_wrapper .dataTable td, .dataTables_wrapper .dataTable th {
background: #fff;
}
</style>
<ul class="nav nav-tabs" role="tablist">
<li class="nav-item">
<a class="nav-link nav-link-tab active btn-primary text-light" data-toggle="tab" href="#kt_tabs_1_2"><i class="flaticon2-pie-chart-4 text-light"></i> Diagram</a>
</li>
<li class="nav-item">
<a class="nav-link nav-link-tab btn-primary text-light" data-toggle="tab" href="#" data-target="#kt_tabs_1_1"><i class="flaticon-squares-1 text-light"></i> Tabel</a>
</li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="kt_tabs_1_2" role="tabpanel">
<div>
<canvas id="dealer-chart"></canvas>
</div>
</div>
<div class="tab-pane" id="kt_tabs_1_1" role="tabpanel">
<div class="table-responsive" id="table">
<table class="table" id="kt_table">
<thead>
<tr>
<th rowspan="2" style="width: 18%; z-index: 99;">Dealer</th>
@if ($works)
<th colspan="{{ count($works) }}" class="text-center">Pekerjaan</th>
@endif
<th rowspan="2" style="width: 18%; z-index: 99;">Aksi</th>
</tr>
@if ($works)
<tr>
@foreach ($works as $work)
<th>{{ $work->name }}</th>
@endforeach
</tr>
@endif
</thead>
<tbody>
</tbody>
<tfoot>
<tr>
<th style="background: #C5CEFF !important;">
<p>Total Bulan Ini</p><hr>
<p>Total Bulan Kemarin</p>
</th>
@foreach ($totals as $total)
<th style="background: #C5CEFF !important;">
<p>{{ $total['now'] }} @if($total['now'] > $total['prev']) <i class="ml-3 fa fa-caret-up text-success"></i> @else <i class="ml-3 fa fa-caret-down text-danger"></i> @endif</p><hr>
<p>{{ $total['prev'] }}</p>
</th>
@endforeach
<th style="background: #C5CEFF !important;"></th>
</tr>
</tfoot>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
@endsection
@section('javascripts')
<script src="{{ url('js/pages/doublescroll.js') }}" type="text/javascript"></script>
<script>
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 +')';
}
// var table = $("#kt_table").DataTable({
// paging: false,
// fixedColumns: {
// left: 1,
// right: 1
// }
// })
const options = {
indexAxis: 'y',
maintainAspectRatio: false,
scales: {
x: {
position: 'top'
}
},
plugins: {
legend: {
display: true,
labels: {
color: 'rgb(255, 99, 132)'
},
position: 'top'
}
}
}
var chart = new Chart($("#dealer-chart"), {
type: 'bar',
data: {
labels: [],
datasets: []
},
plugins: [ChartDataLabels],
options: options
});
$.ajax({
url: '{{ route("get_dealer_has_transactions") }}',
type: 'POST',
data: {
_token: '{{ csrf_token() }}',
month: '{{ $month }}',
dealer: '{{ $dealer }}'
},
success: function(res) {
res.forEach(function(dealer, i) {
$.ajax({
url: '{{ route("dealer_work_trx") }}',
type: 'POST',
data: {
'_token': '{{ csrf_token() }}',
'month' : '{{ $month }}',
'dealer_filter' : '{{ $dealer }}',
'dealer' : dealer.id
},
success: function(resWork) {
if (/\s/.test(dealer.name)) {
chart.data.labels.push(dealer.name.split(" "))
if(res.length == 1) {
chart.update()
}
}else{
chart.data.labels.push(dealer.name)
if(res.length == 1) {
chart.update()
}
}
let tds = `<td id="row-${dealer.id}">${dealer.name}</td>`;
resWork.forEach(function(work, j) {
if(i == 0) {
$.when(addTrxData(work)).then(function() {
chart.data.datasets[j].data.push(work.qty)
if(res.length == 1) {
chart.update()
}
})
}else{
chart.data.datasets[j].data.push(work.qty)
if(res.length == 1) {
chart.update()
}
}
tds += `<td>${work.qty}</td>`
})
var url = '{{ route("dealer_recap", ":id") }}';
url = url.replace(':id', dealer.id);
$("#kt_table tbody").append(`
<tr>
${tds}
<td><a href="${url}" class="btn btn-info btn-sm">Detail</a></td>
</tr>
`)
}
}).done(function() {
if(res.length > 1) {
chart.update()
}
})
$("#dealer-chart").parent().height($("#dealer-chart").parent().height() + 650)
})
}
}).done(function(res) {
if(res.length == 0) {
$("#dealer-chart").parent().append(`
<div class="alert" role="alert">
<div class="alert-text">
<h4 class="alert-heading">Data Kosong!</h4>
<p>Belum ada data pekerjaan masuk untuk bulan
@if($month == '01')
januari
@elseif($month == '02')
februari
@elseif($month == '03')
maret
@elseif($month == '04')
april
@elseif($month == '05')
mei
@elseif($month == '06')
juni
@elseif($month == '07')
juli
@elseif($month == '08')
agustus
@elseif($month == '09')
september
@elseif($month == '10')
oktober
@elseif($month == '11')
november
@elseif($month == '12')
desember
@endif
</p>
<hr>
</div>
</div>
`)
$("#dealer-chart").parent().css('height', '100%')
$("#dealer-chart").remove()
}
})
function addTrxData(work) {
let data = {
label : work['work_name'],
data: [],
fill: false,
backgroundColor: random_rgba(0.2),
borderColor: random_rgba(1),
borderWidth: 1,
barPercentage: 0.5,
categoryPercentage: 1
}
chart.data.datasets.push(data)
}
$(".nav-link-tab.active").removeClass('btn-primary')
$(".nav-link-tab.active").removeClass('text-light')
$(".nav-link-tab.active i").toggleClass('text-light')
$(".nav-link-tab").parent().click(function() {
$(".nav-link-tab").toggleClass('btn-primary')
$(".nav-link-tab").toggleClass('text-light')
$(".nav-link-tab i").toggleClass('text-light')
})
</script>
@endsection