732 lines
36 KiB
PHP
732 lines
36 KiB
PHP
@extends('layouts.main')
|
|
@section('css-tambahan')
|
|
<style>
|
|
.select2-container .select2-selection--single {
|
|
border: none;
|
|
background: none;
|
|
outline: none;
|
|
box-shadow: none;
|
|
padding: 0;
|
|
}
|
|
|
|
.select2-container .select2-selection--single:focus {
|
|
border: none;
|
|
}
|
|
|
|
.select2-container--default .select2-selection--single .select2-selection__rendered {
|
|
color: #900c3e;
|
|
line-height: 28px;
|
|
}
|
|
|
|
.select2-container .select2-selection--single .select2-selection__arrow {
|
|
border: none;
|
|
background: none;
|
|
}
|
|
|
|
.select2-container--default.select2-container--open .select2-selection--single {
|
|
border: none;
|
|
}
|
|
|
|
.select2-results {
|
|
border-bottom: 1px solid #aaa;
|
|
}
|
|
|
|
.select2-results__option {
|
|
padding: 10px;
|
|
color: #333;
|
|
background-color: white;
|
|
}
|
|
|
|
.select2-container--default .select2-results>.select2-results__options .select2-results__option--highlighted {
|
|
background-color: #900c3e !important;
|
|
color: #fff !important;
|
|
}
|
|
</style>
|
|
@endsection
|
|
@section('content')
|
|
<!-- Main Content -->
|
|
<div class="main-content">
|
|
<section class="section">
|
|
<div class="row">
|
|
<div class="col-lg-4 col-md-12 col-sm-12">
|
|
<div class="card card-statistic-2">
|
|
<div class="card-stats">
|
|
<div class="card-stats-title">
|
|
<h4>
|
|
Transaksi - <select class="input" style="width: 40%;" name="filterRole" id="filterRole">
|
|
<option value="1" selected>Semua</option>
|
|
<option value="2">Pembeli</option>
|
|
<option value="3">Penjual</option>
|
|
</select>
|
|
</h4>
|
|
</div>
|
|
<div id="semua">
|
|
<div class="card-stats-items">
|
|
<div class="card-stats-item">
|
|
<div class="card-stats-item-count" id="countAllFinished">{{ $countAllFinished }}
|
|
</div>
|
|
<div class="card-stats-item-label">Selesai</div>
|
|
</div>
|
|
<div class="card-stats-item">
|
|
<div class="card-stats-item-count" id="countAllPending">{{ $countAllPending }}</div>
|
|
<div class="card-stats-item-label">Menunggu</div>
|
|
</div>
|
|
<div class="card-stats-item">
|
|
<div class="card-stats-item-count" id="countAllProcessed">{{ $countAllProcessed }}
|
|
</div>
|
|
<div class="card-stats-item-label">Diproses</div>
|
|
</div>
|
|
</div>
|
|
<div class="card-stats-items">
|
|
<div class="card-stats-item">
|
|
<div class="card-stats-item-count" id="countAllCanceled">{{ $countAllCanceled }}
|
|
</div>
|
|
<div class="card-stats-item-label">Gagal</div>
|
|
</div>
|
|
<div class="card-stats-item">
|
|
<div class="card-stats-item-count" id="countAllRefund">{{ $countAllRefund }}</div>
|
|
<div class="card-stats-item-label">Refund</div>
|
|
</div>
|
|
<div class="card-stats-item">
|
|
<div class="card-stats-item-count" id="countAllIndicated">{{ $countAllIndicated }}
|
|
</div>
|
|
<div class="card-stats-item-label">Tertunda</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="pembeli" hidden>
|
|
<div class="card-stats-items mt-3">
|
|
<div class="card-stats-item">
|
|
<div class="card-stats-item-count" id="countBuyerFinished">{{ $countBuyerFinished }}
|
|
</div>
|
|
<div class="card-stats-item-label">Selesai</div>
|
|
</div>
|
|
<div class="card-stats-item">
|
|
<div class="card-stats-item-count" id="countBuyerPaid">{{ $countBuyerPaid }}
|
|
</div>
|
|
<div class="card-stats-item-label">Dibayar</div>
|
|
</div>
|
|
<div class="card-stats-item">
|
|
<div class="card-stats-item-count" id="countBuyerProcessed">
|
|
{{ $countBuyerProcessed }}
|
|
</div>
|
|
<div class="card-stats-item-label">Diproses</div>
|
|
</div>
|
|
<div class="card-stats-item">
|
|
<div class="card-stats-item-count" id="countBuyerPending">{{ $countBuyerPending }}
|
|
</div>
|
|
<div class="card-stats-item-label">Menunggu</div>
|
|
</div>
|
|
</div>
|
|
<div class="card-stats-items">
|
|
<div class="card-stats-item">
|
|
<div class="card-stats-item-count" id="countBuyerCancelled">
|
|
{{ $countBuyerCancelled }}</div>
|
|
<div class="card-stats-item-label">Gagal</div>
|
|
</div>
|
|
<div class="card-stats-item">
|
|
<div class="card-stats-item-count" id="countBuyerIndicated">
|
|
{{ $countBuyerIndicated }}
|
|
</div>
|
|
<div class="card-stats-item-label">Tertunda</div>
|
|
</div>
|
|
<div class="card-stats-item">
|
|
<div class="card-stats-item-count" id="countBuyerRefundPending">
|
|
{{ $countBuyerRefundPending }}</div>
|
|
<div class="card-stats-item-label">Pengajuan Refund</div>
|
|
</div>
|
|
<div class="card-stats-item">
|
|
<div class="card-stats-item-count" id="countBuyerRefundApproved">
|
|
{{ $countBuyerRefundApproved }}</div>
|
|
<div class="card-stats-item-label">Disetujui</div>
|
|
</div>
|
|
<div class="card-stats-item">
|
|
<div class="card-stats-item-count" id="countBuyerRefundDenied">
|
|
{{ $countBuyerRefundDenied }}</div>
|
|
<div class="card-stats-item-label">Ditolak</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="penjual" hidden>
|
|
<div class="card-stats-items mt-3">
|
|
<div class="card-stats-item">
|
|
<div class="card-stats-item-count" id="countSellerFinished">
|
|
{{ $countSellerFinished }}</div>
|
|
<div class="card-stats-item-label">selesai</div>
|
|
</div>
|
|
<div class="card-stats-item">
|
|
<div class="card-stats-item-count" id="countSellerProcessed">
|
|
{{ $countSellerProcessed }}</div>
|
|
<div class="card-stats-item-label">Diproses</div>
|
|
</div>
|
|
<div class="card-stats-item">
|
|
<div class="card-stats-item-count" id="countSellerSending">
|
|
{{ $countSellerSending }}</div>
|
|
<div class="card-stats-item-label">Dikirim</div>
|
|
</div>
|
|
<div class="card-stats-item">
|
|
<div class="card-stats-item-count" id="countSellerSent">{{ $countSellerSent }}
|
|
</div>
|
|
<div class="card-stats-item-label">Sampai</div>
|
|
</div>
|
|
</div>
|
|
<div class="card-stats-items">
|
|
<div class="card-stats-item">
|
|
<div class="card-stats-item-count" id="countSellerPending">
|
|
{{ $countSellerPending }}</div>
|
|
<div class="card-stats-item-label">Menunggu</div>
|
|
</div>
|
|
<div class="card-stats-item">
|
|
<div class="card-stats-item-count" id="countSellerCancelled">
|
|
{{ $countSellerCancelled }}</div>
|
|
<div class="card-stats-item-label">Gagal</div>
|
|
</div>
|
|
<div class="card-stats-item">
|
|
<div class="card-stats-item-count" id="countSellerRefund">
|
|
{{ $countSellerRefund }}</div>
|
|
<div class="card-stats-item-label">Refund</div>
|
|
</div>
|
|
<div class="card-stats-item">
|
|
<div class="card-stats-item-count" id="countSellerIndicated">
|
|
{{ $countSellerIndicated }}</div>
|
|
<div class="card-stats-item-label">Tertunda</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="card-icon shadow-primary bg-primary">
|
|
<i class="fas fa-archive"></i>
|
|
</div>
|
|
<div class="card-wrap">
|
|
<div class="card-header">
|
|
<h4>Jumlah Transaction</h4>
|
|
</div>
|
|
<div class="card-body" id="totalTransaction">
|
|
{{ $totalTransaction }} Transaksi
|
|
</div>
|
|
</div>
|
|
<p class="mb-0 text-muted" id="rateTransaction">
|
|
<span
|
|
class="text-{{ $rateTransaction == 0 ? 'secondary text-black-50' : ($rateTransaction > 0 ? 'success' : 'danger') }} me-2"><span
|
|
class="mdi {{ $rateTransaction == 0 ? 'mdi-equal' : ($rateTransaction > 0 ? 'mdi-arrow-up-bold' : 'mdi-arrow-down-bold') }}"></span>
|
|
{{ abs($rateTransaction) }}%</span>
|
|
<span class="text-nowrap">Dibandingkan sebelumnya</span>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-4 col-md-12 col-sm-12">
|
|
<div class="card card-statistic-2">
|
|
<div class="card-chart">
|
|
<canvas id="pemasukan-chart" height="100"></canvas>
|
|
</div>
|
|
<div class="card-icon shadow-primary bg-primary">
|
|
<i class="fas fa-dollar-sign"></i>
|
|
</div>
|
|
<div class="card-wrap">
|
|
<div class="card-header">
|
|
<h4>Pemasukan</h4>
|
|
</div>
|
|
<div class="card-body" id="totalPemasukan">
|
|
Rp {{ number_format($totalPemasukan, 2, ',', '.') }}
|
|
</div>
|
|
</div>
|
|
<p class="mb-0 text-muted" id="ratePemasukan">
|
|
<span
|
|
class="text-{{ $ratePemasukan == 0 ? 'secondary text-black-50' : ($ratePemasukan > 0 ? 'success' : 'danger') }} me-2"><span
|
|
class="mdi {{ $ratePemasukan == 0 ? 'mdi-equal' : ($ratePemasukan > 0 ? 'mdi-arrow-up-bold' : 'mdi-arrow-down-bold') }}"></span>
|
|
{{ abs($ratePemasukan) }}%</span>
|
|
<span class="text-nowrap">Dibandingkan sebelumnya</span>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-4 col-md-12 col-sm-12">
|
|
<div class="card card-statistic-2">
|
|
<div class="card-chart">
|
|
<canvas id="pengeluaran-chart" height="100"></canvas>
|
|
</div>
|
|
<div class="card-icon shadow-primary bg-primary">
|
|
<i class="fas fa-shopping-bag"></i>
|
|
</div>
|
|
<div class="card-wrap">
|
|
<div class="card-header">
|
|
<h4>Pengeluaran</h4>
|
|
</div>
|
|
<div class="card-body" id="totalPengeluaran">Rp
|
|
{{ number_format($totalPengeluaran, 2, ',', '.') }}
|
|
</div>
|
|
</div>
|
|
<p class="mb-0 text-muted" id="ratePengeluaran">
|
|
<span
|
|
class="text-{{ $ratePengeluaran == 0 ? 'secondary text-black-50' : ($ratePengeluaran > 0 ? 'success' : 'danger') }} me-2"><span
|
|
class="mdi {{ $ratePengeluaran == 0 ? 'mdi-equal' : ($ratePengeluaran > 0 ? 'mdi-arrow-up-bold' : 'mdi-arrow-down-bold') }}"></span>
|
|
{{ abs($ratePengeluaran) }}%</span>
|
|
<span class="text-nowrap">Dibandingkan sebelumnya</span>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-12">
|
|
<div class="input-group">
|
|
<input type="text" name="from-to" class="form-control" id="date-range">
|
|
<span class="input-group-text bg-primary text-white align-items-center">
|
|
<i class="mdi mdi-calendar-range font-13"></i>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<div class="card">
|
|
<div id="rateProfit">
|
|
<div class="alert alert-{{ $rateProfit == 0 ? 'secondary text-black-50' : ($rateProfit > 0 ? 'success' : 'error') }} alert-dismissible fade show mb-3"
|
|
role="alert">
|
|
Transaksi {{ $rateProfit == 0 ? 'sama' : ($rateProfit > 0 ? 'meningkat' : 'menurun') }}
|
|
<span
|
|
class="mdi {{ $rateProfit == 0 ? 'mdi-equal' : ($rateProfit > 0 ? 'mdi-arrow-up-bold' : 'mdi-arrow-down-bold') }}"></span>
|
|
{{ $rateProfit }}%
|
|
</div>
|
|
</div>
|
|
<div class="card-header">
|
|
<h4>Transaksi</h4>
|
|
</div>
|
|
<div class="card-body">
|
|
<canvas id="myChart" height="120"></canvas>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
@endsection
|
|
@section('tambahan-js')
|
|
<script>
|
|
let dataLabel = {!! json_encode($dataLabel) !!}
|
|
let dataChartTransaction = {{ json_encode($dataChartTransaction) }}
|
|
let dataChartRefund = {{ json_encode($dataChartRefund) }}
|
|
let dataChartPemasukan = {{ json_encode($dataChartPemasukan) }}
|
|
let dataChartPengeluaran = {{ json_encode($dataChartPengeluaran) }}
|
|
</script>
|
|
<script>
|
|
// Set new default font family and font color to mimic Bootstrap's default styling
|
|
Chart.defaults.global.defaultFontFamily = 'Nunito',
|
|
'-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif';
|
|
Chart.defaults.global.defaultFontColor = '#858796';
|
|
|
|
var ctx = document.getElementById("myChart").getContext('2d');
|
|
var myChartTransaksi = new Chart(ctx, {
|
|
type: 'line',
|
|
data: {
|
|
labels: dataLabel,
|
|
datasets: [{
|
|
label: 'Transaksi',
|
|
data: dataChartTransaction,
|
|
borderWidth: 2,
|
|
backgroundColor: 'rgba(63,82,227,.8)',
|
|
borderWidth: 0,
|
|
borderColor: 'transparent',
|
|
pointBorderWidth: 0,
|
|
pointRadius: 3.5,
|
|
pointBackgroundColor: 'transparent',
|
|
pointHoverBackgroundColor: 'rgba(63,82,227,.8)',
|
|
},
|
|
{
|
|
label: 'Refund',
|
|
data: dataChartRefund,
|
|
borderWidth: 2,
|
|
backgroundColor: 'rgba(254,86,83,.7)',
|
|
borderWidth: 0,
|
|
borderColor: 'transparent',
|
|
pointBorderWidth: 0,
|
|
pointRadius: 3.5,
|
|
pointBackgroundColor: 'transparent',
|
|
pointHoverBackgroundColor: 'rgba(254,86,83,.8)',
|
|
}
|
|
]
|
|
},
|
|
options: {
|
|
layout: {
|
|
padding: 10,
|
|
},
|
|
legend: {
|
|
display: true,
|
|
labels: {
|
|
padding: 10,
|
|
fontSize: 16
|
|
}
|
|
},
|
|
scales: {
|
|
yAxes: [{
|
|
gridLines: {
|
|
// display: false,
|
|
drawBorder: false,
|
|
color: '#f2f2f2',
|
|
},
|
|
ticks: {
|
|
beginAtZero: true,
|
|
fontSize: 14,
|
|
maxTicksLimit: 6,
|
|
},
|
|
scaleLabel: {
|
|
display: true,
|
|
labelString: 'Dalam Rupiah (Rp)', // Label khusus untuk sumbu Y
|
|
fontSize: 16 // Ukuran font untuk label sumbu Y
|
|
},
|
|
}],
|
|
xAxes: [{
|
|
gridLines: {
|
|
display: true,
|
|
tickMarkLength: 15,
|
|
},
|
|
ticks: {
|
|
display: false,
|
|
maxTicksLimit: 8,
|
|
},
|
|
offset: true,
|
|
}]
|
|
},
|
|
}
|
|
});
|
|
|
|
var pemasukan_chart = document.getElementById("pemasukan-chart").getContext('2d');
|
|
|
|
var pemasukan_chart_bg_color = pemasukan_chart.createLinearGradient(0, 0, 0, 70);
|
|
|
|
pemasukan_chart_bg_color.addColorStop(0, 'rgba(63,82,227,.2)');
|
|
|
|
pemasukan_chart_bg_color.addColorStop(1, 'rgba(63,82,227,0)');
|
|
|
|
var myChartPemasukan = new Chart(
|
|
pemasukan_chart, {
|
|
type: 'line',
|
|
data: {
|
|
labels: dataLabel,
|
|
datasets: [{
|
|
label: 'Pemasukan',
|
|
data: dataChartPemasukan,
|
|
backgroundColor: pemasukan_chart_bg_color,
|
|
borderWidth: 3,
|
|
borderColor: 'rgba(63,82,227,1)',
|
|
pointBorderWidth: 0,
|
|
pointBorderColor: 'transparent',
|
|
pointRadius: 3,
|
|
pointBackgroundColor: 'transparent',
|
|
pointHoverBackgroundColor: 'rgba(63,82,227,1)',
|
|
}]
|
|
},
|
|
options: {
|
|
layout: {
|
|
padding: 10
|
|
},
|
|
legend: {
|
|
display: false
|
|
},
|
|
scales: {
|
|
yAxes: [{
|
|
gridLines: {
|
|
display: false,
|
|
drawBorder: false,
|
|
},
|
|
ticks: {
|
|
beginAtZero: true,
|
|
display: false,
|
|
maxTicksLimit: 4,
|
|
}
|
|
}],
|
|
xAxes: [{
|
|
gridLines: {
|
|
drawBorder: false,
|
|
display: true,
|
|
},
|
|
ticks: {
|
|
display: false,
|
|
maxTicksLimit: 8,
|
|
},
|
|
offset: true,
|
|
}]
|
|
},
|
|
}
|
|
});
|
|
|
|
var pengeluaran = document.getElementById("pengeluaran-chart");
|
|
var pengeluaran_chart = pengeluaran.getContext('2d');
|
|
|
|
var pengeluaran_chart_bg_color = pengeluaran_chart.createLinearGradient(0, 0, 0, 80);
|
|
pengeluaran_chart_bg_color.addColorStop(0, 'rgba(63,82,227,.2)');
|
|
pengeluaran_chart_bg_color.addColorStop(1, 'rgba(63,82,227,0)');
|
|
|
|
var myChartPengeluaran = new Chart(pengeluaran_chart, {
|
|
type: 'line',
|
|
data: {
|
|
labels: dataLabel,
|
|
datasets: [{
|
|
label: 'Pengeluaran',
|
|
data: dataChartPengeluaran,
|
|
borderWidth: 2,
|
|
backgroundColor: pengeluaran_chart_bg_color,
|
|
borderWidth: 3,
|
|
borderColor: 'rgba(63,82,227,1)',
|
|
pointBorderWidth: 0,
|
|
pointBorderColor: 'transparent',
|
|
pointRadius: 3,
|
|
pointBackgroundColor: 'transparent',
|
|
pointHoverBackgroundColor: 'rgba(63,82,227,1)',
|
|
}]
|
|
},
|
|
options: {
|
|
layout: {
|
|
padding: 10
|
|
},
|
|
legend: {
|
|
display: false
|
|
},
|
|
scales: {
|
|
yAxes: [{
|
|
gridLines: {
|
|
display: false,
|
|
drawBorder: false,
|
|
},
|
|
ticks: {
|
|
beginAtZero: true,
|
|
display: false,
|
|
maxTicksLimit: 4,
|
|
}
|
|
}],
|
|
xAxes: [{
|
|
gridLines: {
|
|
drawBorder: false,
|
|
display: true,
|
|
},
|
|
ticks: {
|
|
display: false,
|
|
maxTicksLimit: 8,
|
|
},
|
|
offset: true,
|
|
}]
|
|
},
|
|
}
|
|
});
|
|
</script>
|
|
<script>
|
|
$(document).ready(function() {
|
|
const csrfToken = $('meta[name="csrf-token"]').attr('content');
|
|
let searchParams = new URLSearchParams(window.location.search);
|
|
let dateInterval = searchParams.get('from-to');
|
|
let start = moment().subtract(29, 'days');
|
|
let end = moment();
|
|
|
|
$('#filterRole').select2();
|
|
|
|
$('#filterRole').change(function() {
|
|
let id = $(this).val();
|
|
|
|
if (id == "1") {
|
|
$('#semua').removeAttr('hidden');
|
|
$('#pembeli').attr('hidden', true);
|
|
$('#penjual').attr('hidden', true);
|
|
} else if (id == "2") {
|
|
$('#semua').attr('hidden', true);
|
|
$('#pembeli').removeAttr('hidden');
|
|
$('#penjual').attr('hidden', true);
|
|
} else {
|
|
$('#semua').attr('hidden', true);
|
|
$('#pembeli').attr('hidden', true);
|
|
$('#penjual').removeAttr('hidden');
|
|
}
|
|
});
|
|
|
|
if (dateInterval) {
|
|
dateInterval = dateInterval.split(' - ');
|
|
start = moment(dateInterval[0]);
|
|
end = moment(dateInterval[1]);
|
|
}
|
|
|
|
$('#date-range').daterangepicker({
|
|
"showDropdowns": true,
|
|
"showWeekNumbers": true,
|
|
"alwaysShowCalendars": true,
|
|
startDate: start,
|
|
endDate: end,
|
|
locale: {
|
|
format: 'YYYY-MM-DD',
|
|
firstDay: 1,
|
|
},
|
|
minDate: "2023-01-01",
|
|
maxDate: "2025-12-31",
|
|
ranges: {
|
|
'Today': [moment(), moment()],
|
|
'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
|
|
'Last 7 Days': [moment().subtract(6, 'days'), moment()],
|
|
'Last 30 Days': [moment().subtract(29, 'days'), moment()],
|
|
'This Month': [moment().startOf('month'), moment().endOf('month')],
|
|
'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1,
|
|
'month').endOf(
|
|
'month')],
|
|
'This Year': [moment().startOf('year'), moment().endOf('year')],
|
|
'Last Year': [moment().subtract(1, 'year').startOf('year'), moment().subtract(1, 'year')
|
|
.endOf(
|
|
'year')
|
|
]
|
|
}
|
|
}).on('apply.daterangepicker', function(ev, picker) {
|
|
var startDate = picker.startDate.format('YYYY-MM-DD');
|
|
var endDate = picker.endDate.format('YYYY-MM-DD');
|
|
|
|
Swal.fire({
|
|
html: '<div class="mt-3"><lord-icon src="https://cdn.lordicon.com/etwtznjn.json" trigger="loop" colors="primary:#0ab39c,secondary:#405189" style="width:120px;height:120px"></lord-icon><div class="mt-4 pt-2 fs-15"><h4>Form Anda sedang diproses!</h4><p class="text-muted mx-4 mb-0">Mohon tunggu...</p></div></div>',
|
|
allowEscapeKey: false,
|
|
allowOutsideClick: false,
|
|
didOpen: () => {
|
|
Swal.showLoading();
|
|
}
|
|
});
|
|
|
|
$.ajaxSetup({
|
|
headers: {
|
|
'X-CSRF-TOKEN': csrfToken
|
|
}
|
|
});
|
|
|
|
$.ajax({
|
|
url: "{{ route('user.get-data-dashboard') }}",
|
|
type: 'GET',
|
|
data: {
|
|
startDate: startDate,
|
|
endDate: endDate
|
|
},
|
|
success: function(response) {
|
|
Swal.close();
|
|
myChartTransaksi.data.datasets[0].data = response.dataChartTransaction;
|
|
myChartTransaksi.data.datasets[1].data = response.dataChartRefund;
|
|
myChartTransaksi.data.labels = response.dataLabel;
|
|
myChartTransaksi.update();
|
|
|
|
myChartPemasukan.data.datasets[0].data = response.dataChartUser;
|
|
myChartPemasukan.data.labels = response.dataLabel;
|
|
myChartPemasukan.update();
|
|
|
|
myChartPengeluaran.data.datasets[0].data = response.dataChartUser;
|
|
myChartPengeluaran.data.labels = response.dataLabel;
|
|
myChartPengeluaran.update();
|
|
|
|
// Semua
|
|
$('#countAllFinished').html(response.countAllFinished);
|
|
$('#countAllPending').html(response.countAllPending);
|
|
$('#countAllProcessed').html(response.countAllProcessed);
|
|
$('#countAllCanceled').html(response.countAllCanceled);
|
|
$('#countAllRefund').html(response.countAllRefund);
|
|
$('#countAllIndicated').html(response.countAllIndicated);
|
|
|
|
// Pembeli
|
|
$('#countBuyerFinished').html(response.countBuyerFinished);
|
|
$('#countBuyerPaid').html(response.countBuyerPaid);
|
|
$('#countBuyerPending').html(response.countBuyerPending);
|
|
$('#countBuyerProcessed').html(response.countBuyerProcessed);
|
|
$('#countBuyerCancelled').html(response.countBuyerCancelled);
|
|
$('#countBuyerRefundPending').html(response.countBuyerRefundPending);
|
|
$('#countBuyerRefundApproved').html(response.countBuyerRefundApproved);
|
|
$('#countBuyerRefundDenied').html(response.countBuyerRefundDenied);
|
|
$('#countBuyerIndicated').html(response.countBuyerIndicated);
|
|
|
|
// Penjual
|
|
$('#countSellerPending').html(response.countSellerPending);
|
|
$('#countSellerFinished').html(response.countSellerFinished);
|
|
$('#countSellerProcessed').html(response.countSellerProcessed);
|
|
$('#countSellerSending').html(response.countSellerSending);
|
|
$('#countSellerSent').html(response.countSellerSent);
|
|
$('#countSellerCancelled').html(response.countSellerCancelled);
|
|
$('#countSellerRefund').html(response.countSellerRefund);
|
|
$('#countSellerIndicated').html(response.countSellerIndicated);
|
|
|
|
$('#totalTransaction').html(response.totalTransaction);
|
|
|
|
var activitiesRateTransaction = '';
|
|
var rateTransactionClass = response.rateTransaction == 0 ?
|
|
"secondary text-black-50" : (response.rateTransaction > 0 ?
|
|
"success" : "danger");
|
|
var rateTransactionClassIcon = response.rateTransaction == 0 ?
|
|
"mdi-equal" : (response.rateTransaction > 0 ?
|
|
"mdi-arrow-up-bold" : "mdi-arrow-down-bold");
|
|
|
|
activitiesRateTransaction = `
|
|
<span class="text-${rateTransactionClass} me-2"><span
|
|
class="mdi ${rateTransactionClassIcon}"></span>
|
|
${Math.abs(response.rateTransaction)}%</span>
|
|
<span class="text-nowrap">Dibandingkan sebelumnya</span>
|
|
`;
|
|
|
|
$('#rateTransaction').html(activitiesRateTransaction);
|
|
|
|
// Pemasukan
|
|
$('#totalPemasukan').html(response.totalPemasukan);
|
|
|
|
var activitiesratePemasukan = '';
|
|
var ratePemasukanClass = response.ratePemasukan == 0 ?
|
|
"secondary text-black-50" : (response.ratePemasukan > 0 ?
|
|
"success" : "danger");
|
|
var ratePemasukanClassIcon = response.ratePemasukan == 0 ?
|
|
"mdi-equal" : (response.ratePemasukan > 0 ?
|
|
"mdi-arrow-up-bold" : "mdi-arrow-down-bold");
|
|
|
|
activitiesratePemasukan = `
|
|
<span class="text-${ratePemasukanClass} me-2"><span
|
|
class="mdi ${ratePemasukanClassIcon}"></span>
|
|
${Math.abs(response.ratePemasukan)}%</span>
|
|
<span class="text-nowrap">Dibandingkan sebelumnya</span>
|
|
`;
|
|
|
|
$('#ratePemasukan').html(activitiesratePemasukan);
|
|
|
|
// Pengeluaran
|
|
$('#totalPengeluaran').html(response.totalPengeluaran);
|
|
|
|
var activitiesRatePengeluaran = '';
|
|
var ratePengeluaranClass = response.ratePengeluaran == 0 ?
|
|
"secondary text-black-50" : (response.ratePengeluaran > 0 ?
|
|
"success" : "danger");
|
|
var ratePengeluaranClassIcon = response.ratePengeluaran == 0 ?
|
|
"mdi-equal" : (response.ratePengeluaran > 0 ?
|
|
"mdi-arrow-up-bold" : "mdi-arrow-down-bold");
|
|
|
|
activitiesRatePengeluaran = `
|
|
<span class="text-${ratePengeluaranClass} me-2"><span
|
|
class="mdi ${ratePengeluaranClassIcon}"></span>
|
|
${Math.abs(response.ratePengeluaran)}%</span>
|
|
<span class="text-nowrap">Dibandingkan sebelumnya</span>
|
|
`;
|
|
|
|
$('#ratePengeluaran').html(activitiesRatePengeluaran);
|
|
|
|
// Profit
|
|
var activitiesRateProfit = '';
|
|
var rateProfitClass = response.rateProfit == 0 ?
|
|
"secondary text-black-50" : (response.rateProfit > 0 ?
|
|
"success" : "danger");
|
|
var rateProfitMention = response.rateProfit == 0 ? "sama" : (response
|
|
.rateProfit > 0 ? "meningkat" : "menurun");
|
|
var rateProfitClassIcon = response.rateProfit == 0 ?
|
|
"sama" : (response.rateProfit > 0 ?
|
|
"meningkat" : "menurun");
|
|
|
|
activitiesRateProfit = `
|
|
<div class="alert alert-${rateProfitClass} alert-dismissible fade show mb-3"
|
|
role="alert">
|
|
Pendapatan ${rateProfitMention}
|
|
<span
|
|
class="mdi ${rateProfitClassIcon}"></span>
|
|
${Math.abs(response.rateProfit)}%
|
|
</div>
|
|
`;
|
|
|
|
$('#rateProfit').html(activitiesRateProfit);
|
|
},
|
|
error: function(error) {
|
|
Swal.close();
|
|
console.log(error);
|
|
}
|
|
});
|
|
});
|
|
});
|
|
</script>
|
|
@endsection
|