@extends('layouts.master')

@section('style')
    <style>
        .table-responsive{
            max-height: 500px;
        }
    </style>
@endsection()

@section('content')
<div class="content d-flex flex-column flex-column-fluid" id="kt_content">
    <div id="kt_content_container" class="container-xxl">
        <div class="row g-5 g-xl-10">
            <div class="col-xl-3">
                <span  class="card card-xl-stretch mb-xl-8 theme-dark-bg-body" style="background-color: #F7D9E3">
                    <div class="card-body d-flex flex-column">
                        <div class="d-flex flex-column">
                            <h3 class="text-gray-900 fw-bold fs-3 mb-6">
                                Total Driver <i class="fa fa-arrow-circle-right"></i>
                                <span><a href="{{route('assets.drivers.index')}}?status=All">{{$driverCount}}</a></span>
                            </h3>
                        </div>

                        <div class="mb-4">
                        <h6 class="text-gray-900 fw-bold fs-1x lh-0 mt-7">Active Driver: <a href="{{route('assets.drivers.index')}}">({{$activeDriver}})</a></h6>
                        </div>
                        <h6 class="text-gray-900 fw-bold fs-1x lh-0 mt-7">Inactive Driver:  <a href="{{route('assets.drivers.index')}}?status=INACTIVE">({{$inActiveDriver}})</a></h6>
                    </div>
                </span>
            </div>

            <div class="col-xl-3">
                <span  class="card card-xl-stretch mb-xl-8 theme-dark-bg-body" style="background-color: #CBF0F4">
                    <div class="card-body d-flex flex-column">
                        <div class="d-flex flex-column">
                        <h3 class="text-gray-900 fw-bold fs-3 mb-4">
                                Total Truck <i class="fa fa-arrow-circle-right"></i>
                                <span><a href="{{route('assets.trucks.index')}}?status=All">{{$truckCount}}</a></span> 
                            </h3>
                        </div>

                        <div class="pt-5 mb-4">
                            <h6 class="text-gray-900 fw-bold fs-1x lh-0 mt-7">Active Truck: <a href="{{route('assets.trucks.index')}}">({{$activeTruck}})</a> </h6>
                        </div>
                        <h6 class="text-gray-900 fw-bold fs-1x lh-0 mt-7">Inactive Truck: <a href="{{route('assets.trucks.index')}}?status=INACTIVE">({{$inActiveTruck}})</a></h6>

                    </div>
                </span>
            </div>

            <div class="col-xl-3">
                <span  class="card card-xl-stretch mb-xl-8 theme-dark-bg-body" style="background-color: #CBD4F4">
                    <div class="card-body d-flex flex-column">
                        <div class="d-flex flex-column">
                        <h3 class="text-gray-900 fw-bold fs-3 mb-4">
                                Total Trailers <i class="fa fa-arrow-circle-right"></i>
                                <span><a href="{{route('assets.trailers.index')}}?status=All">{{$trailerCount}}</a></span>
                            </h3>
                        </div>

                        <div class="pt-5 mb-5">
                        <h6 class="text-gray-900 fw-bold fs-1x lh-0 mt-7">Active Trailers:<a href="{{route('assets.trailers.index')}}">({{$activeTrailer}})</a> </h6>
                        </div>
                        <h6 class="text-gray-900 fw-bold fs-1x lh-0 mt-7">Inactive Trailers: <a href="{{route('assets.trailers.index')}}?status=INACTIVE">({{$inActiveTrailer}})</a></h6>
                    </div>
                </span>
            </div>

            <div class="col-xl-3">
                <span class="card card-xl-stretch mb-5 mb-xl-8 theme-dark-bg-body" style="background-color: #cef4cb">
                    <div class="card-body d-flex flex-column">
                        <div class="d-flex flex-column">
                        <h3 class="text-gray-900 fw-bold fs-3 mb-4">
                                Total Vendor <i class="fa fa-arrow-circle-right"></i>
                                <span><a href="{{route('assets.vendors.index')}}?status=All">{{$vendorCount}}</a></span>
                            </h3>
                        </div>

                        <div class="pt-5 mb-5">
                            <h6 class="text-gray-900 fw-bold fs-1x lh-0 mt-7">Active Vendor: <a href="{{route('assets.vendors.index')}}">({{$activeVendor}})</a></h6>
                        </div>
                        <h6 class="text-gray-900 fw-bold fs-1x lh-0 mt-7">Inactive Vendor: <a href="{{route('assets.vendors.index')}}?status=True">({{$inActiveVendor}})</a></h6>
                    </div>
                </span>
            </div>
            <div class="col-xl-3">
                <span class="card card-xl-stretch mb-5 mb-xl-8 theme-dark-bg-body" style="background-color: #cef4cb">
                    <div class="card-body d-flex flex-column">
                        <div class="d-flex flex-column">
                        <h3 class="text-gray-900 fw-bold fs-3 mb-4">
                                Total Expense <i class="fa fa-arrow-circle-right"></i>
                                <span><a href="{{route('assets.expense.index')}}?status=All">{{$expenseCount}}</a></span>
                            </h3>
                        </div>

                        <div class="pt-5 mb-5">
                            <h6 class="text-gray-900 fw-bold fs-1x lh-0 mt-7">Total Expense Amount: $ {{number_format($expensesTotal,2)}}</a></h6>
                        </div>
                        
                    </div>
                </span>
            </div>

            <div class="col-xl-3">
                <span class="card card-xl-stretch mb-5 mb-xl-8 theme-dark-bg-body" style="background-color: #cef4cb">
                    <div class="card-body d-flex flex-column">
                        <div class="d-flex flex-column">
                        <h3 class="text-gray-900 fw-bold fs-3 mb-4">
                                Total Repair <i class="fa fa-arrow-circle-right"></i>
                                <span><a href="{{route('assets.repair.index')}}?status=All">{{$issuesCount}}</a></span>
                            </h3>
                        </div>

                        <div class="pt-5 mb-5">
                            <h6 class="text-gray-900 fw-bold fs-1x lh-0 mt-7">Total Repair Amount:  ${{number_format($issuesSum,2)}}</h6>
                        </div>
                        
                    </div>
                </span>
            </div>

            <!-- <div class="col-xl-3">
                <span class="card card-xl-stretch mb-5 mb-xl-8 theme-dark-bg-body" style="background-color: #cef4cb">
                    <div class="card-body d-flex flex-column">
                        <div class="d-flex flex-column">
                        <h3 class="text-gray-900 fw-bold fs-3 mb-4">
                                Total Reminders <i class="fa fa-arrow-circle-right"></i>
                                <span><a href="{{route('assets.vendors.index')}}?status=All">{{$vendorCount}}</a></span>
                            </h3>
                        </div>

                        <div class="pt-5 mb-5">
                            <h6 class="text-gray-900 fw-bold fs-1x lh-0 mt-7">Active Vendor: <a href="{{route('assets.vendors.index')}}">({{$activeVendor}})</a></h6>
                        </div>
                        <h6 class="text-gray-900 fw-bold fs-1x lh-0 mt-7">Inactive Vendor: <a href="{{route('assets.vendors.index')}}?status=True">({{$inActiveVendor}})</a></h6>
                    </div>
                </span>
            </div> -->
        </div>
    </div>
</div>

@endsection()
@section('script')

@endsection()