@extends('backend.layouts.app')
@section('dashboard') active @endsection
@section('content')
<!-- Page Content -->
<div class="content">
  <div class="bg-image" style="background-image: url('/backend/assets/media/photos/photo26@2x.jpg');">
    <div class="bg-black-75">
      <div class="content content-top content-full text-center">
        <div class="py-3">
          <h1 class="fw-bold text-white mb-2">
            Dashboard
          </h1>
          <h2 class="h4 fw-medium text-white-75">
            Welcome to Lobongo Kabab &amp; Cafe - Admin Panel
          </h2>
        </div>
      </div>
    </div>
  </div>

  <div class="row mt-3">
    <!-- Row #1 -->
    <div class="col-6 col-xl-3">
      <a class="block block-rounded block-link-shadow text-end" href="{{ route('product.index') }}">
        <div class="block-content block-content-full d-sm-flex justify-content-between align-items-center">
          <div class="d-none d-sm-block">
            <i class="fa fa-shopping-bag fa-2x opacity-25"></i>
          </div>
          <div>
            <div class="fs-3 fw-semibold">{{ $total_products <= 9 ? "0".$total_products : $total_products }}</div>
            <div class="fs-sm fw-semibold text-uppercase text-muted">Products</div>
          </div>
        </div>
      </a>
    </div>
    <div class="col-6 col-xl-3">
      <a class="block block-rounded block-link-shadow text-end" href="javascript:void(0)">
        <div class="block-content block-content-full d-sm-flex justify-content-between align-items-center">
          <div class="d-none d-sm-block">
            <i class="fa fa-wallet fa-2x opacity-25"></i>
          </div>
          <div>
            <div class="fs-3 fw-semibold">{{ $pending_orders <= 9 ? "0".$pending_orders : $pending_orders }}</div>
            <div class="fs-sm fw-semibold text-uppercase text-muted">Pending Orders</div>
          </div>
        </div>
      </a>
    </div>
    <div class="col-6 col-xl-3">
      <a class="block block-rounded block-link-shadow text-end" href="javascript:void(0)">
        <div class="block-content block-content-full d-sm-flex justify-content-between align-items-center">
          <div class="d-none d-sm-block">
            <i class="fa fa-envelope-open fa-2x opacity-25"></i>
          </div>
          <div>
            <div class="fs-3 fw-semibold">{{ $processing_orders <= 9 ? "0".$processing_orders : $processing_orders }}</div>
            <div class="fs-sm fw-semibold text-uppercase text-muted">Processing Orders</div>
          </div>
        </div>
      </a>
    </div>
    <div class="col-6 col-xl-3">
      <a class="block block-rounded block-link-shadow text-end" href="javascript:void(0)">
        <div class="block-content block-content-full d-sm-flex justify-content-between align-items-center">
          <div class="d-none d-sm-block">
            <i class="fa fa-users fa-2x opacity-25"></i>
          </div>
          <div>
            <div class="fs-3 fw-semibold">{{ $delivered_orders <= 9 ? "0".$delivered_orders : $delivered_orders }}</div>
            <div class="fs-sm fw-semibold text-uppercase text-muted">Delivery Orders</div>
          </div>
        </div>
      </a>
    </div>
    <!-- END Row #1 -->
  </div>
</div>
<!-- END Page Content -->
@endsection