@extends('Admin.layout.app')

@section('title','Dashboard')

@section('page-title','Dashboard')

@section('content')

<div class="container-fluid py-4">

    <!-- Page Title -->
    <div class="d-flex justify-content-between align-items-center mb-4">
        <h3 class="fw-bold">Dashboard</h3>
        <span class="text-muted">{{ now()->format('d M Y') }}</span>
    </div>

    <!-- Statistics Cards -->
    <div class="row g-3 mb-4">

        <div class="col-md-3">
            <div class="card border-0 shadow-sm bg-primary text-white">
                <div class="card-body">
                    <div class="d-flex justify-content-between">
                        <div>
                            <h6>Total Orders</h6>
                            <h3>{{ $totalOrders }}</h3>
                        </div>
                        <i class="las la-shopping-cart la-3x"></i>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-md-3">
            <div class="card border-0 shadow-sm bg-success text-white">
                <div class="card-body">
                    <div class="d-flex justify-content-between">
                        <div>
                            <h6>Total Customers</h6>
                            <h3>{{$totalCustomers}}</h3>
                        </div>
                        <i class="las la-users la-3x"></i>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-md-3">
            <div class="card border-0 shadow-sm bg-warning text-dark">
                <div class="card-body">
                    <div class="d-flex justify-content-between">
                        <div>
                            <h6>Pending Orders</h6>
                            <h3>{{ $pendingOrders }}</h3>
                        </div>
                        <i class="las la-clock la-3x"></i>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-md-3">
            <div class="card border-0 shadow-sm bg-danger text-white">
                <div class="card-body">
                    <div class="d-flex justify-content-between">
                        <div>
                            <h6>Total Products</h6>
                            <h3>{{ $totalProducts }}</h3>
                        </div>
                        <i class="las la-shopping-bag la-3x"></i>
                    </div>
                </div>
            </div>
        </div>

    </div>

    <!-- Second Row -->
    <div class="row g-3 mb-4">

        <div class="col-md-3">
            <div class="card shadow-sm border-0">
                <div class="card-body text-center">
                    <i class="las la-money-bill-wave text-info la-3x"></i>
                    <h4 class="mt-2">Rs {{ number_format($todaytotalRevenue) }}</h4>
                    <p class="mb-0"> Astemated Revenue Today</p>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="card shadow-sm border-0">
                <div class="card-body text-center">
                    <i class="las la-wallet text-primary la-3x"></i>
                    <h4 class="mt-2">{{ $getrevenuetoday }}</h4>
                    <p class="mb-0">Get Revenue Today</p>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="card shadow-sm border-0">
                <div class="card-body text-center">
                    <i class="las la-box text-warning la-3x"></i>
                    <h4 class="mt-2">{{ $todayOrders }}</h4>
                    <p class="mb-0">Today's Orders</p>
                </div>
            </div>
        </div>

        <div class="col-md-3">
            <div class="card shadow-sm border-0">
                <div class="card-body text-center">
                    <i class="las la-check-circle text-success la-3x"></i>
                    <h4 class="mt-2">{{ $todaydeliveredOrders }}</h4>
                    <p class="mb-0">Today Delivered Orders</p>
                </div>
            </div>
        </div>

        

        

    </div>

    <!-- Recent Orders -->
    <div class="card shadow-sm border-0">
        <div class="card-header bg-white">
            <h5 class="mb-0">Recent Orders</h5>
        </div>

        <div class="card-body p-0">
            <table class="table table-hover mb-0">
                <thead class="table-light">
                    <tr>
                        <th>#</th>
                        <th>Customer</th>
                        <th>Amount</th>
                        <th>Payment</th>
                        <th>Status</th>
                        <th>Date</th>
                    </tr>
                </thead>

                <tbody>
                    @foreach($recentOrders as $order)
                    <tr>
                        <td>{{ $order->id }}</td>
                        <td>{{ $order->customer->name ?? 'Guest' }}</td>
                        <td>Rs {{ number_format($order->grand_total,2) }}</td>

                        <td>
                            @if($order->payment_status == 'Paid')
                                <span class="badge bg-success">Paid</span>
                            @else
                                <span class="badge bg-danger">Unpaid</span>
                            @endif
                        </td>

                        <td>
                            @if($order->order_status == 'delivered')
                                <span class="badge bg-success">Delivered</span>
                            @elseif($order->order_status == 'cancelled')
                                <span class="badge bg-danger">Cancelled</span>
                            @else
                                <span class="badge bg-warning">Pending</span>
                            @endif
                        </td>

                        <td>{{ $order->order_date->format('d M Y h:i A') }}</td>
                    </tr>
                    @endforeach
                </tbody>

            </table>
        </div>
    </div>

</div>

@endsection