105 lines
4.2 KiB
PHP

@extends('dashboard.layouts.main')
@section('body_main')
<div class="container-xxl flex-grow-1 container-p-y">
<div class="d-flex justify-content-between align-items-center flex-wrap">
<h4 class="fw-bold mb-0">Dashboard Pesanan</h4>
</div>
{{-- Filter Tanggal --}}
<div class="row justify-content-end mb-4">
<div class="col-auto">
<form method="GET" action="" class="d-flex flex-wrap justify-content-end align-items-end">
<div class="me-2">
<label class="form-label mb-1">Dari Tanggal</label>
<input type="date" name="start_date" class="form-control" value="">
</div>
<div class="me-2">
<label class="form-label mb-1">Sampai Tanggal</label>
<input type="date" name="end_date" class="form-control" value="">
</div>
<div class="mt-3 mt-md-0">
<button type="submit" class="btn btn-primary">Tampilkan</button>
</div>
</form>
</div>
</div>
{{-- Row 1: Ringkasan Umum --}}
<div class="row g-4">
<div class="col-md-4">
<div class="card border-0 shadow-sm bg-light-primary text-primary">
<div class="card-body">
<h5 class="card-title mb-1"><i class="bx bx-calendar me-1"></i> Pesanan Hari Ini</h5>
<h2 class="fw-bold mb-1">23</h2>
<small>Data tanggal {{ \Carbon\Carbon::now()->format('d M Y') }}</small>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card border-0 shadow-sm bg-light-success text-success">
<div class="card-body">
<h5 class="card-title mb-1"><i class="bx bx-check-circle me-1"></i> Pesanan Lunas</h5>
<h2 class="fw-bold mb-1">15</h2>
<small>Status: Lunas</small>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card border-0 shadow-sm bg-light-warning text-warning">
<div class="card-body">
<h5 class="card-title mb-1"><i class="bx bx-time-five me-1"></i> Belum Selesai</h5>
<h2 class="fw-bold mb-1">8</h2>
<small>Menunggu Konfirmasi / Pembayaran</small>
</div>
</div>
</div>
</div>
{{-- Row 2: Transaksi & Status Pengambilan --}}
<div class="row g-4 mt-2">
<div class="col-md-4">
<div class="card border-0 shadow-sm bg-light-info text-info">
<div class="card-body">
<h5 class="card-title mb-1"><i class="bx bx-money me-1"></i> Total Nilai Transaksi</h5>
<h2 class="fw-bold mb-1">Rp 1.240.000</h2>
<small>Akumulasi dari pesanan Lunas</small>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card border-0 shadow-sm bg-light-secondary text-secondary">
<div class="card-body">
<h5 class="card-title mb-1"><i class="bx bx-box me-1"></i> Pesanan Pending</h5>
<h2 class="fw-bold mb-1">5</h2>
<small>Lunas tapi belum diambil</small>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card border-0 shadow-sm bg-light-success text-success">
<div class="card-body">
<h5 class="card-title mb-1"><i class="bx bx-check-square me-1"></i> Pesanan Diambil</h5>
<h2 class="fw-bold mb-1">10</h2>
<small>Pemesan sudah ambil makanannya</small>
</div>
</div>
</div>
</div>
<div class="card mt-4">
<div class="card-header d-flex justify-content-between align-items-center">
<h5 class="mb-0">Data Pesanan </h5>
</div>
<div class="card-body">
<table class="table" id="datatableRekapDashboard"></table>
</div>
</div>
</div>
<script src="{{ ver('/js/dashboard/index.js') }}"></script>
@endsection