152 lines
6.7 KiB
PHP
152 lines
6.7 KiB
PHP
@extends('layouts.admin')
|
||
|
||
@section('title', 'Dashboard Super Admin')
|
||
@section('page_title', 'Dashboard Super Admin')
|
||
|
||
@push('styles')
|
||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css">
|
||
<link rel="stylesheet" href="{{ asset('assets/css/super-admin-dashboard.css') }}">
|
||
@endpush
|
||
|
||
@push('scripts')
|
||
<script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.6/dist/chart.umd.min.js"></script>
|
||
<script src="{{ asset('assets/js/super-admin-dashboard.js') }}" defer></script>
|
||
@endpush
|
||
|
||
@section('content')
|
||
@php
|
||
$summary = $summary ?? [];
|
||
$quickLinks = $quickLinks ?? [];
|
||
$monthlyBookings = collect($monthlyBookings ?? []);
|
||
|
||
$statCards = collect($summary)->map(function (array $item) {
|
||
return [
|
||
'label' => $item['label'] ?? '-',
|
||
'value' => $item['value'] ?? '-',
|
||
'hint' => $item['hint'] ?? '',
|
||
'icon' => $item['icon'] ?? 'bi-dash-circle',
|
||
];
|
||
})->values();
|
||
|
||
$monthlyBookingLabels = $monthlyBookings->pluck('label')->values()->all();
|
||
$monthlyBookingValues = $monthlyBookings->pluck('value')->map(fn ($value) => (int) $value)->values()->all();
|
||
$hasMonthlyBookingData = collect($monthlyBookingValues)->contains(fn ($value) => $value > 0);
|
||
@endphp
|
||
|
||
<div class="super-admin-dashboard">
|
||
<section class="sa-header-card">
|
||
<div class="sa-breadcrumb">
|
||
<i class="bi bi-speedometer2" aria-hidden="true"></i>
|
||
<span>AREA ADMIN</span>
|
||
</div>
|
||
<h2 class="sa-title">Dashboard Super Admin</h2>
|
||
<p class="sa-description">
|
||
Monitoring ringkas performa platform rental kendaraan, mulai dari mitra aktif, customer, armada, pendapatan, hingga booking bulanan.
|
||
</p>
|
||
<div class="sa-meta-row">
|
||
<span class="sa-pill"><i class="bi bi-percent" aria-hidden="true"></i> Komisi platform {{ number_format((float) $commissionRate, 0, ',', '.') }}%</span>
|
||
<span class="sa-pill"><i class="bi bi-graph-up-arrow" aria-hidden="true"></i> Monitoring operasional harian</span>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="sa-section">
|
||
<div class="sa-section-head">
|
||
<div>
|
||
<h3>Statistik Utama</h3>
|
||
<p>Susunan 2 row × 4 kartu untuk memudahkan monitoring cepat dan jelas.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="sa-stats-grid">
|
||
@forelse ($statCards as $index => $card)
|
||
<article class="sa-stat-card {{ in_array($index, [4, 7], true) ? 'is-accent' : '' }}">
|
||
<div class="sa-stat-top">
|
||
<div class="sa-stat-copy">
|
||
<p>{{ $card['label'] }}</p>
|
||
<h3>{{ $card['value'] }}</h3>
|
||
</div>
|
||
<div class="sa-stat-icon" aria-hidden="true">
|
||
<i class="bi {{ $card['icon'] }}"></i>
|
||
</div>
|
||
</div>
|
||
@if (!empty($card['hint']))
|
||
<p class="sa-stat-hint">{{ $card['hint'] }}</p>
|
||
@endif
|
||
</article>
|
||
@empty
|
||
<article class="sa-empty-state" style="grid-column: 1 / -1; min-height: 200px;">
|
||
<div>
|
||
<div class="icon"><i class="bi bi-inbox" aria-hidden="true"></i></div>
|
||
<h4>Statistik belum tersedia</h4>
|
||
<p>Data ringkasan belum dikirim dari controller.</p>
|
||
</div>
|
||
</article>
|
||
@endforelse
|
||
</div>
|
||
</section>
|
||
|
||
<section class="sa-section">
|
||
<div class="sa-chart-card">
|
||
<div class="sa-section-head">
|
||
<div>
|
||
<h3>Grafik Booking per Bulan</h3>
|
||
<p>Ringkasan booking 12 bulan terakhir untuk membaca tren aktivitas platform.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<script id="monthly-bookings-data" type="application/json">
|
||
@json([
|
||
'labels' => $monthlyBookingLabels,
|
||
'values' => $monthlyBookingValues,
|
||
])
|
||
</script>
|
||
|
||
@if ($hasMonthlyBookingData)
|
||
<div class="sa-chart-wrap">
|
||
<canvas id="monthlyBookingsChart" aria-label="Grafik booking per bulan" role="img"></canvas>
|
||
</div>
|
||
@else
|
||
<div class="sa-chart-empty" data-booking-chart-empty>
|
||
<div>
|
||
<div class="icon"><i class="bi bi-bar-chart-line" aria-hidden="true"></i></div>
|
||
<h4>Belum ada data booking bulanan</h4>
|
||
<p>Grafik akan muncul otomatis ketika data booking per bulan tersedia.</p>
|
||
</div>
|
||
</div>
|
||
@endif
|
||
</div>
|
||
</section>
|
||
|
||
<section class="sa-section">
|
||
<div class="sa-section-head">
|
||
<div>
|
||
<h3>Akses Cepat</h3>
|
||
<p>Tombol pintas untuk ke halaman operasional yang paling sering dipakai.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="sa-quicklinks-card">
|
||
<div class="sa-quicklinks-grid">
|
||
@forelse ($quickLinks as $item)
|
||
<a href="{{ $item['route'] }}" class="sa-quicklink">
|
||
<div class="icon" aria-hidden="true"><i class="bi {{ $item['icon'] ?? 'bi-link-45deg' }}"></i></div>
|
||
<strong>{{ $item['label'] }}</strong>
|
||
@if (!empty($item['hint']))
|
||
<span>{{ $item['hint'] }}</span>
|
||
@endif
|
||
</a>
|
||
@empty
|
||
<div class="sa-empty-state" style="grid-column: 1 / -1; min-height: 180px; box-shadow: none;">
|
||
<div>
|
||
<div class="icon"><i class="bi bi-link-45deg" aria-hidden="true"></i></div>
|
||
<h4>Quick links belum tersedia</h4>
|
||
<p>Tambahkan tautan operasional di controller bila diperlukan.</p>
|
||
</div>
|
||
</div>
|
||
@endforelse
|
||
</div>
|
||
</div>
|
||
</section>
|
||
</div>
|
||
@endsection
|