@extends('layouts.master')
@section('title')
    Dashboard
@endsection
@section('css')
    <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" type="text/css" />
    <link href="https://cdn.datatables.net/1.11.5/css/dataTables.bootstrap5.min.css" rel="stylesheet" type="text/css" />
    <!--datatable responsive css-->
    <link href="https://cdn.datatables.net/responsive/2.2.9/css/responsive.bootstrap.min.css" rel="stylesheet"
        type="text/css" />
    <style>
        #list-syncs li {
            list-style: none;
            padding: 10px;
            border-bottom: 1px solid #f1f1f1;
        }
    </style>
@endsection
@section('content')
    @can('view dashboard')
        {{-- custom date Modal --}}
        <div class="modal fade" id="customDateModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header bg-light p-3">
                        <h5 class="modal-title" id="exampleModalLabel">Select Date</h5>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"
                            id="close-modal"></button>
                    </div>
                    <form action="" id="customDateForm" method="POST" class="tablelist-form" autocomplete="off">
                        @csrf
                        <div class="modal-body">
                            <div class="mb-3">
                                <label for="custom_start_date" class="form-label">From Date</label>
                                <input type="date" id="custom_start_date" name="custom_start_date" class="form-control"
                                    value="{{ is_array($dashboard_filter) ? $dashboard_filter[0] : '' }}" required>
                            </div>
                            <div class="mb-3">
                                <label for="custom_end_date" class="form-label">To Date</label>
                                <input type="date" id="custom_end_date" name="custom_end_date" class="form-control" required
                                    value="{{ is_array($dashboard_filter) ? $dashboard_filter[1] : '' }}">
                            </div>
                        </div>
                        <div class="modal-footer">
                            <div class="hstack gap-2 justify-content-end">
                                <button type="button" class="btn btn-light" data-bs-dismiss="modal">Close</button>
                                <button type="submit" class="btn btn-primary">Submit</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
        {{-- end custom date Modal --}}
        <div class="row">
            <div class="col">
                <div class="h-100">
                    <div class="row mb-3 pb-1">
                        <div class="col-12">
                            <div class="d-flex align-items-lg-center flex-lg-row flex-column">
                                {{-- @php
                                    $expirationDate = '2025-08-27';
                                    $daysLeft = Carbon\Carbon::now()->diffInDays($expirationDate, false);
                                @endphp --}}

                                <div class="flex-grow-1">
                                    @if (Auth::user()->business_key == 'f579a6e6f10cbba679ae922b4b2d6ab08deee942' ||
                                            Auth::user()->business_key == '40c1cd745136ba47bffbab6fd878c6c8072134de' ||
                                            Auth::user()->business_key == 'a620919a5504c0444d799ca165278f599a1fe063')
                                        <h3 class="text-danger text-center"><b>Your annual subscription is expiring soon. Kindly
                                                clear the due amount at the earliest to continue uninterrupted service.</b></h3>
                                    @endif
                                    @if (Auth::user()->business_key == 'bd4a29988341343c66772ff9ada13659ad94af6f' ||
                                            Auth::user()->business_key == '8a0d2526fe621dc16a971e72de7332cfe753d7cd')
                                        <h3 class="text-danger text-center"><b>Your Free subscription is expiring soon. Kindly
                                                clear the due amount at the earliest to continue uninterrupted service.</b></h3>
                                    @endif
                                    @if (Auth::user()->company_profile->account_type == 'trial')
                                        @php
                                            $userPlan = \App\Models\UserPlan::where(
                                                'business_key',
                                                Auth::user()->business_key,
                                            )->first();
                                        @endphp
                                        <h3 class="text-danger text-center"><b> THE ACCOUNT IS ONLY VALID FOR 7 DAYS AND WILL
                                                BE CLOSED ON
                                                {{ \Carbon\Carbon::parse($userPlan->expired_on)->format('d-m-y') }}</b></h3>
                                    @endif
                                    <h4 class="fs-16 mb-1">{{ $greeting }}, {{ Auth::user()->name }}!</h4>
                                    <p class="text-muted mb-0">Here's what's happening with your business
                                        today.</p>
                                </div>
                                <div>
                                    <select name="" id="filter" class="form-select day-fltr">
                                        <option value="daily" {{ $dashboard_filter == 'daily' ? 'selected' : '' }}>Today
                                        </option>
                                        <option value="yesterday" {{ $dashboard_filter == 'yesterday' ? 'selected' : '' }}>
                                            Yesterday
                                        </option>
                                        <option value="monthly" {{ $dashboard_filter == 'monthly' ? 'selected' : '' }}>This
                                            Month</option>
                                        <option value="previous_month"
                                            {{ $dashboard_filter == 'previous_month' ? 'selected' : '' }}>Previous
                                            Month</option>
                                        <option value="yearly" {{ $dashboard_filter == 'yearly' ? 'selected' : '' }}>This
                                            Financial Year</option>
                                        <option value="customDate" {{ is_array($dashboard_filter) ? 'selected' : '' }}>
                                            {{ is_array($dashboard_filter) ? implode(' - ', $dashboard_filter) : 'Custom Date' }}
                                        </option>

                                    </select>
                                    @if (Auth::user()->staff == null || Auth::user()->staff->all_ledgers == 1)
                                        {{-- <div class="col-md-2 col-sm-6 mb-2"> --}}
                                        <label for="start date"></label>
                                        <select name="branch" class="form-control" id="branch">
                                            <option value="">All Branches</option>
                                            @foreach ($branches as $branch)
                                                <option value="{{ $branch->id }}"
                                                    @if (app('request')->input('branch_id') == $branch->id) selected @endif>{{ $branch->name }}
                                                </option>
                                            @endforeach
                                        </select>
                                        {{-- </div> --}}
                                    @endif
                                </div>
                            </div><!-- end card header -->
                        </div>
                        <!--end col-->
                    </div>
                    <!--end row-->

                    @can('view cash balance')
                        <div class="row">
                            @php
                                $cashInHandGroupId = App\Models\Group::where([
                                    'business_key' => Auth::user()->business_key,
                                    'name' => 'Cash In Hand',
                                ])->first()->id;
                                $bankAccountsGroupId = App\Models\Group::where([
                                    'business_key' => Auth::user()->business_key,
                                    'name' => 'Bank Accounts',
                                ])->first()->id;
                            @endphp
                            <div class="col-xl-3 col-md-6 col-sm-6">
                                <!-- card -->
                                <a href="/admin/group-report/{{ $cashInHandGroupId }}?branch_id={{ $branchId }}">
                                    <div class="card card-animate">
                                        <div class="card-body">
                                            <div class="d-flex align-items-center">
                                                <div class="flex-grow-1 overflow-hidden">
                                                    <p class="text-uppercase fw-medium text-muted text-truncate mb-0">
                                                        Cash Balance</p>
                                                </div>
                                            </div>
                                            <div class="d-flex align-items-end justify-content-between mt-4">
                                                <div>
                                                    <h4 class="fs-22 fw-semibold ff-secondary mb-4">
                                                        <span class="counter-value"
                                                            data-target="{{ $cashBalance['cashInHand'] }}">0</span>
                                                    </h4>
                                                </div>
                                                <div class="avatar-sm flex-shrink-0">
                                                    <span class="avatar-title bg-soft-primary rounded fs-3">
                                                        <i class="las la-money-bill text-primary"></i>
                                                    </span>
                                                </div>
                                            </div>
                                        </div><!-- end card body -->
                                    </div><!-- end card -->
                                </a>
                            </div><!-- end col -->
                            <div class="col-xl-3 col-md-6 col-sm-6">
                                <!-- card -->
                                <a href="/admin/group-report/{{ $bankAccountsGroupId }}?branch_id={{ $branchId }}">
                                    <div class="card card-animate">
                                        <div class="card-body">
                                            <div class="d-flex align-items-center">
                                                <div class="flex-grow-1 overflow-hidden">
                                                    <p class="text-uppercase fw-medium text-muted text-truncate mb-0">
                                                        Bank Balance</p>
                                                </div>
                                            </div>
                                            <div class="d-flex align-items-end justify-content-between mt-4">
                                                <div>
                                                    <h4 class="fs-22 fw-semibold ff-secondary mb-4">
                                                        <span class="counter-value"
                                                            data-target="{{ $cashBalance['bankBalance'] }}">0</span>
                                                    </h4>
                                                </div>
                                                <div class="avatar-sm flex-shrink-0">
                                                    <span class="avatar-title bg-soft-primary rounded fs-3">
                                                        <i class="las la-money-bill text-primary"></i>
                                                    </span>
                                                </div>
                                            </div>
                                        </div><!-- end card body -->
                                    </div><!-- end card -->
                                </a>
                            </div><!-- end col -->
                            <div class="col-xl-3 col-md-6 col-sm-6">
                                <!-- card -->
                                <a href="/admin/outstanding-report">
                                    <div class="card card-animate">
                                        <div class="card-body">
                                            <div class="d-flex align-items-center">
                                                <div class="flex-grow-1 overflow-hidden">
                                                    <p class="text-uppercase fw-medium text-muted text-truncate mb-0">
                                                        Outstanding Balance</p>
                                                </div>
                                            </div>
                                            <div class="d-flex align-items-end justify-content-between mt-4">
                                                <div>
                                                    <h4 class="fs-22 fw-semibold ff-secondary mb-4">
                                                        <span class="counter-value" id="outstandingBalance"
                                                            style="display: none;">0</span>
                                                        <button class="btn btn-sm btn-primary" id="checkOutstanding">
                                                            <i class="las la-sync"></i></button>
                                                    </h4>
                                                </div>
                                                <div class="avatar-sm flex-shrink-0">
                                                    <span class="avatar-title bg-soft-primary rounded fs-3">
                                                        <i class="las la-money-bill text-primary"></i>
                                                    </span>
                                                </div>
                                            </div>
                                        </div><!-- end card body -->
                                    </div><!-- end card -->
                                </a>
                            </div><!-- end col -->
                        </div>
                    @endcan

                    <div class="row">
                        @if (Auth::user()->hasFeature('SALES'))
                            <!-- dashboard init -->
                            <div class="col-xl-3 col-md-6 col-sm-6">
                                <!-- card -->
                                <a href="/admin/sales">
                                    <div class="card card-animate">
                                        <div class="card-body">
                                            <div class="d-flex align-items-center">
                                                <div class="flex-grow-1 overflow-hidden">
                                                    <p class="text-uppercase fw-medium text-muted text-truncate mb-0">
                                                        Total Sales / Amount</p>
                                                </div>
                                                {{-- <div class="flex-shrink-0">
                                    <h5 class="text-success fs-14 mb-0">
                                        <i class="ri-arrow-right-up-line fs-13 align-middle"></i>
                                        +16.24 %
                                    </h5>
                                </div> --}}
                                            </div>
                                            <div class="d-flex align-items-end justify-content-between mt-4">
                                                <div>
                                                    <h4 class="fs-22 fw-semibold ff-secondary mb-4">
                                                        <span class="counter-value"
                                                            data-target="{{ $totalSalesCount }}">0</span>
                                                        /
                                                        <span class="counter-value"
                                                            data-target="{{ $totalSalesAmt }}">0</span>
                                                    </h4>
                                                </div>
                                                <div class="avatar-sm flex-shrink-0">
                                                    <span class="avatar-title bg-soft-primary rounded fs-3">
                                                        <i class="las la-shopping-cart text-primary"></i>
                                                    </span>
                                                </div>
                                            </div>
                                        </div><!-- end card body -->
                                    </div><!-- end card -->
                                </a>
                            </div><!-- end col -->
                        @endif
                        @if (Auth::user()->hasFeature('SALES_RETURN'))
                            <div class="col-xl-3 col-md-6 col-sm-6">
                                <!-- card -->
                                <a href="/admin/sales-return">
                                    <div class="card card-animate">
                                        <div class="card-body">
                                            <div class="d-flex align-items-center">
                                                <div class="flex-grow-1 overflow-hidden">
                                                    <p class="text-uppercase fw-medium text-muted text-truncate mb-0">
                                                        Total Sales Return / Amount</p>
                                                </div>
                                            </div>
                                            <div class="d-flex align-items-end justify-content-between mt-4">
                                                <div>
                                                    <h4 class="fs-22 fw-semibold ff-secondary mb-4">
                                                        <span class="counter-value"
                                                            data-target="{{ $totalSalesReturnCount }}">0</span> /
                                                        <span class="counter-value"
                                                            data-target="{{ $totalSalesReturnAmt }}">0</span>
                                                    </h4>
                                                </div>
                                                <div class="avatar-sm flex-shrink-0">
                                                    <span class="avatar-title bg-soft-primary rounded fs-3">
                                                        <i class="las la-shopping-cart text-primary"></i>
                                                    </span>
                                                </div>
                                            </div>
                                        </div><!-- end card body -->
                                    </div><!-- end card -->
                                </a>
                            </div><!-- end col -->
                        @endif
                        @if (Auth::user()->hasFeature('PURCHASE'))
                            <div class="col-xl-3 col-md-6 col-sm-6">
                                <!-- card -->
                                <a href="/admin/purchase">
                                    <div class="card card-animate">
                                        <div class="card-body">
                                            <div class="d-flex align-items-center">
                                                <div class="flex-grow-1 overflow-hidden">
                                                    <p class="text-uppercase fw-medium text-muted text-truncate mb-0">
                                                        Total Purchase / Amount</p>
                                                </div>
                                            </div>
                                            <div class="d-flex align-items-end justify-content-between mt-4">
                                                <div>
                                                    <h4 class="fs-22 fw-semibold ff-secondary mb-4">
                                                        <span class="counter-value"
                                                            data-target="{{ $totalPurchaseCount }}">0</span>
                                                        /
                                                        <span class="counter-value"
                                                            data-target="{{ $totalPurchaseAmt }}">0</span>
                                                    </h4>
                                                </div>
                                                <div class="avatar-sm flex-shrink-0">
                                                    <span class="avatar-title bg-soft-primary rounded fs-3">
                                                        <i class="las la-shopping-cart text-primary"></i>
                                                    </span>
                                                </div>
                                            </div>
                                        </div><!-- end card body -->
                                    </div><!-- end card -->
                                </a>
                            </div><!-- end col -->
                        @endif
                        @if (Auth::user()->hasFeature('PURCHASE_RETURN'))
                            <div class="col-xl-3 col-md-6 col-sm-6">
                                <!-- card -->
                                <a href="/admin/purchase-return">
                                    <div class="card card-animate">
                                        <div class="card-body">
                                            <div class="d-flex align-items-center">
                                                <div class="flex-grow-1 overflow-hidden">
                                                    <p class="text-uppercase fw-medium text-muted text-truncate mb-0">
                                                        Total Purchase Return / Amount</p>
                                                </div>
                                            </div>
                                            <div class="d-flex align-items-end justify-content-between mt-4">
                                                <div>
                                                    <h4 class="fs-22 fw-semibold ff-secondary mb-4">
                                                        <span class="counter-value"
                                                            data-target="{{ $totalPurchaseReturnCount }}">0</span> /
                                                        <span class="counter-value"
                                                            data-target="{{ $totalPurchaseReturnAmt }}">0</span>
                                                    </h4>
                                                </div>
                                                <div class="avatar-sm flex-shrink-0">
                                                    <span class="avatar-title bg-soft-primary rounded fs-3">
                                                        <i class="las la-shopping-cart text-primary"></i>
                                                    </span>
                                                </div>
                                            </div>
                                        </div><!-- end card body -->
                                    </div><!-- end card -->
                                </a>
                            </div><!-- end col -->
                        @endif
                    </div> <!-- end row-->
                    <div class="row">
                        @if (Auth::user()->hasFeature('RECEIPT'))
                            <div class="col-xl-3 col-md-6 col-sm-6">
                                <!-- card -->
                                <a href="/admin/receipt">
                                    <div class="card card-animate">
                                        <div class="card-body">
                                            <div class="d-flex align-items-center">
                                                <div class="flex-grow-1 overflow-hidden">
                                                    <p class="text-uppercase fw-medium text-muted text-truncate mb-0">
                                                        Total Receipt / Amount</p>
                                                </div>
                                            </div>
                                            <div class="d-flex align-items-end justify-content-between mt-4">
                                                <div>
                                                    <h4 class="fs-22 fw-semibold ff-secondary mb-4">
                                                        <span class="counter-value"
                                                            data-target="{{ $totalReceiptCount }}">0</span>
                                                        /
                                                        <span class="counter-value"
                                                            data-target="{{ $totalReceiptAmt }}">0</span>
                                                    </h4>
                                                </div>
                                                <div class="avatar-sm flex-shrink-0">
                                                    <span class="avatar-title bg-soft-primary rounded fs-3">
                                                        <i class="las la-shopping-cart text-primary"></i>
                                                    </span>
                                                </div>
                                            </div>
                                        </div><!-- end card body -->
                                    </div><!-- end card -->
                                </a>
                            </div><!-- end col -->
                        @endif
                        @if (Auth::user()->hasFeature('PAYMENT'))
                            <div class="col-xl-3 col-md-6 col-sm-6">
                                <!-- card -->
                                <a href="/admin/payment">
                                    <div class="card card-animate">
                                        <div class="card-body">
                                            <div class="d-flex align-items-center">
                                                <div class="flex-grow-1 overflow-hidden">
                                                    <p class="text-uppercase fw-medium text-muted text-truncate mb-0">
                                                        Total Payment / Amount</p>
                                                </div>
                                            </div>
                                            <div class="d-flex align-items-end justify-content-between mt-4">
                                                <div>
                                                    <h4 class="fs-22 fw-semibold ff-secondary mb-4">
                                                        <span class="counter-value"
                                                            data-target="{{ $totalPaymentCount }}">0</span> /
                                                        <span class="counter-value"
                                                            data-target="{{ $totalPaymentAmt }}">0</span>
                                                    </h4>
                                                </div>
                                                <div class="avatar-sm flex-shrink-0">
                                                    <span class="avatar-title bg-soft-primary rounded fs-3">
                                                        <i class="las la-shopping-cart text-primary"></i>
                                                    </span>
                                                </div>
                                            </div>
                                        </div><!-- end card body -->
                                    </div><!-- end card -->
                                </a>
                            </div><!-- end col -->
                        @endif
                        @if (Auth::user()->hasFeature('CONTRA'))
                            <div class="col-xl-3 col-md-6 col-sm-6">
                                <!-- card -->
                                <a href="/admin/contra">
                                    <div class="card card-animate">
                                        <div class="card-body">
                                            <div class="d-flex align-items-center">
                                                <div class="flex-grow-1 overflow-hidden">
                                                    <p class="text-uppercase fw-medium text-muted text-truncate mb-0">
                                                        Total Contra / Amount</p>
                                                </div>
                                            </div>
                                            <div class="d-flex align-items-end justify-content-between mt-4">
                                                <div>
                                                    <h4 class="fs-22 fw-semibold ff-secondary mb-4">
                                                        <span class="counter-value"
                                                            data-target="{{ $totalContraCount }}">0</span> /
                                                        <span class="counter-value"
                                                            data-target="{{ $totalContraAmt }}">0</span>
                                                    </h4>
                                                </div>
                                                <div class="avatar-sm flex-shrink-0">
                                                    <span class="avatar-title bg-soft-primary rounded fs-3">
                                                        <i class="las la-shopping-cart text-primary"></i>
                                                    </span>
                                                </div>
                                            </div>
                                        </div><!-- end card body -->
                                    </div><!-- end card -->
                                </a>
                            </div><!-- end col -->
                        @endif
                        @if (Auth::user()->hasFeature('JOURNAL'))
                            <div class="col-xl-3 col-md-6 col-sm-6">
                                <!-- card -->
                                <a href="/admin/journal">
                                    <div class="card card-animate">
                                        <div class="card-body">
                                            <div class="d-flex align-items-center">
                                                <div class="flex-grow-1 overflow-hidden">
                                                    <p class="text-uppercase fw-medium text-muted text-truncate mb-0">
                                                        Total Journal / Amount</p>
                                                </div>
                                            </div>
                                            <div class="d-flex align-items-end justify-content-between mt-4">
                                                <div>
                                                    <h4 class="fs-22 fw-semibold ff-secondary mb-4">
                                                        <span class="counter-value"
                                                            data-target="{{ $totalJournalCount }}">0</span> /
                                                        <span class="counter-value"
                                                            data-target="{{ $totalJournalAmt }}">0</span>
                                                    </h4>
                                                </div>
                                                <div class="avatar-sm flex-shrink-0">
                                                    <span class="avatar-title bg-soft-primary rounded fs-3">
                                                        <i class="las la-shopping-cart text-primary"></i>
                                                    </span>
                                                </div>
                                            </div>
                                        </div><!-- end card body -->
                                    </div><!-- end card -->
                                </a>
                            </div><!-- end col -->
                        @endif
                    </div>
                    <div class="row">
                        @if (Auth::user()->hasFeature('EXPENSE'))
                            <div class="col-xl-3 col-md-6 col-sm-6">
                                <!-- card -->
                                <a href="/admin/expense">
                                    <div class="card card-animate">
                                        <div class="card-body">
                                            <div class="d-flex align-items-center">
                                                <div class="flex-grow-1 overflow-hidden">
                                                    <p class="text-uppercase fw-medium text-muted text-truncate mb-0">
                                                        Total Expense / Amount</p>
                                                </div>
                                            </div>
                                            <div class="d-flex align-items-end justify-content-between mt-4">
                                                <div>
                                                    <h4 class="fs-22 fw-semibold ff-secondary mb-4">
                                                        <span class="counter-value"
                                                            data-target="{{ $totalExpenseCount }}">0</span> /
                                                        <span class="counter-value"
                                                            data-target="{{ $totalExpenseAmt }}">0</span>
                                                    </h4>
                                                </div>
                                                <div class="avatar-sm flex-shrink-0">
                                                    <span class="avatar-title bg-soft-primary rounded fs-3">
                                                        <i class="las la-shopping-cart text-primary"></i>
                                                    </span>
                                                </div>
                                            </div>
                                        </div><!-- end card body -->
                                    </div><!-- end card -->
                                </a>
                            </div><!-- end col -->
                        @endif
                        <div class="col-xl-3 col-md-6 col-sm-6">
                            <!-- card -->
                            <a href="/admin/stock-ledger?type=warning">
                                <div class="card card-animate">
                                    <div class="card-body">
                                        <div class="d-flex align-items-center">
                                            <div class="flex-grow-1 overflow-hidden">
                                                <p class="text-uppercase fw-medium text-muted text-truncate mb-0">
                                                    Stock Warning Level</p>
                                            </div>
                                        </div>
                                        <div class="d-flex align-items-end justify-content-between mt-4">
                                            <div>
                                                <h4 class="fs-22 fw-semibold ff-secondary mb-4"><span class="counter-value"
                                                        data-target="{{ $warning }}">0</span>
                                                </h4>
                                            </div>
                                            <div class="avatar-sm flex-shrink-0">
                                                <span class="avatar-title bg-soft-warning rounded fs-3">
                                                    <i class="bx bx-border-all text-warning"></i>
                                                </span>
                                            </div>
                                        </div>
                                    </div><!-- end card body -->
                                </div><!-- end card -->
                            </a>
                        </div><!-- end col -->

                        <div class="col-xl-3 col-md-6 col-sm-6">
                            <!-- card -->
                            <a href="/admin/stock-ledger?type=critical">
                                <div class="card card-animate">
                                    <div class="card-body">
                                        <div class="d-flex align-items-center">
                                            <div class="flex-grow-1 overflow-hidden">
                                                <p class="text-uppercase fw-medium text-muted text-truncate mb-0">
                                                    Stock Critical Level</p>
                                            </div>
                                        </div>
                                        <div class="d-flex align-items-end justify-content-between mt-4">
                                            <div>
                                                <h4 class="fs-22 fw-semibold ff-secondary mb-4"><span class="counter-value"
                                                        data-target="{{ $critical }}">0</span></h4>
                                            </div>
                                            <div class="avatar-sm flex-shrink-0">
                                                <span class="avatar-title bg-soft-danger rounded fs-3">
                                                    <i class="bx bx-border-all text-danger"></i>
                                                </span>
                                            </div>
                                        </div>
                                    </div><!-- end card body -->
                                </div><!-- end card -->
                            </a>
                        </div><!-- end col -->
                    </div> <!-- end row-->

                </div> <!-- end .h-100-->

            </div> <!-- end col -->
        </div>
        <div class="col-lg-6 col-md-12">
            <div class="card h-100 ">
                <div class="card-body">
                    <div style="display: flex; justify-content: space-between; margin: 15px 0px;">
                        <h4>Staff Sales Summary</h4>
                    </div>
                    <div class="col-md-12">
                        <div class="row">
                            <div class="col-md-4 col-sm-6 mb-2">
                                <label for="start date">From Date</label>
                                <input class="form-control" type="date" name="from_date" id="from_date"
                                    value="{{ date('Y-m-d') }}">
                            </div>
                            <div class="col-md-4 col-sm-6 mb-2">
                                <label for="start date">To Date</label>
                                <input class="form-control" type="date" name="to_date" id="to_date"
                                    value="{{ date('Y-m-d') }}">
                            </div>
                            <div class="col-md-4 col-sm-6 mb-2 mt-4">
                                <button type="button" name="filter" id="filter_summary" class="btn btn-sm btn-primary"><i
                                        class="ri-search-line fs-6"></i></button>
                                {{-- <button type="button" name="refresh" id="refresh" class="btn btn-sm btn-danger"><i
                                        class="ri-refresh-line fs-6"></i></button> --}}
                            </div>
                        </div>
                        <table class="table table-bordered w-100  dt-responsive nowrap table-striped align-middle dataTable"
                            id="staffSummaryReport">
                            <thead>
                                <tr>
                                    <th scope="col">Sale Executive</th>
                                    <th scope="col">Sales Amount</th>
                                </tr>
                            </thead>
                            <tbody>
                            </tbody>
                            <tfoot>
                                <th>Total: </th>
                                <th></th>
                            </tfoot>
                        </table>
                    </div>
                </div>
            </div>
        </div>
        @if ($currentFinancial->mybuss == 1 && $currentFinancial->software_type == 'mybuss')
            <div class="row">
                <div class="col-xl-4 col-md-4">
                    <div class="card">
                        <div class="card-header align-items-center d-flex">
                            <h4 class="card-title mb-0 flex-grow-1">Mybuss Sync Check</h4>
                        </div><!-- end card header -->
                        <div class="card-body">
                            <p class="text-muted">Click the button to check your mybuss syncs are correct &nbsp;<button
                                    class="btn btn-sm btn-primary" id="checkSync"> Check</button></p>
                            <div class="live-preview">
                                <ul class="list-group" id="list-syncs">
                                </ul>
                            </div>
                        </div><!-- end card-body -->
                    </div>
                </div>
                <div class="col-xl-4 col-md-4">
                    <div class="card">
                        <div class="card-header align-items-center d-flex">
                            <h4 class="card-title mb-0 flex-grow-1">Rectify Cancelled Vouchers</h4>
                        </div><!-- end card header -->
                        <div class="card-body">
                            <p class="text-muted">Click the button to check your Rectify syncs &nbsp;<button
                                    class="btn btn-sm btn-primary" id="rectifySync"> Check</button></p>
                            <div class="live-preview" id="rectify-result">

                            </div>
                        </div><!-- end card-body -->
                    </div>
                </div>
                <div class="col-xl-4 col-md-4">
                    <div class="card">
                        <div class="card-header align-items-center d-flex">
                            <h4 class="card-title mb-0 flex-grow-1">Check amount mismatch</h4>
                        </div><!-- end card header -->
                        <div class="card-body">
                            <p class="text-muted">Click the button to check amount mismatch &nbsp;<button
                                    class="btn btn-sm btn-primary" id="rectifyAmount"> Check</button></p>
                            <div class="live-preview" id="rectify-amount-result">

                            </div>
                        </div><!-- end card-body -->
                    </div>
                </div>
                <div class="col-xl-4 col-md-4">
                    <div class="card">
                        <div class="card-header align-items-center d-flex">
                            <h4 class="card-title mb-0 flex-grow-1">Repair amount mismatch</h4>
                        </div><!-- end card header -->
                        <div class="card-body">
                            <p class="text-muted">Click the button to repair amount mismatch &nbsp;<button
                                    class="btn btn-sm btn-primary" id="rectifyMissMatch"> Repair</button></p>
                            <div class="live-preview" id="rectify-missmatch-result">

                            </div>
                        </div><!-- end card-body -->
                    </div>
                </div>
            </div>
        @else
            <div class="row">
                <div class="col-xl-4 col-md-4">
                    <div class="card">
                        <div class="card-header align-items-center d-flex">
                            <h4 class="card-title mb-0 flex-grow-1">Check amount mismatch</h4>
                        </div><!-- end card header -->
                        <div class="card-body">
                            <p class="text-muted">Click the button to check amount mismatch &nbsp;<button
                                    class="btn btn-sm btn-primary" id="rectifyAmount"> Check</button></p>
                            <div class="live-preview" id="rectify-amount-result">

                            </div>
                        </div><!-- end card-body -->
                    </div>
                </div>
            </div>
            {{-- <div class="col-xl-4 col-md-4">
                <div class="card">
                    <div class="card-header align-items-center d-flex">
                        <h4 class="card-title mb-0 flex-grow-1">Repair amount mismatch</h4>
                    </div><!-- end card header -->
                    <div class="card-body">
                        <p class="text-muted">Click the button to repair amount mismatch &nbsp;<button
                                class="btn btn-sm btn-primary" id="rectifyMissMatch"> Repair</button></p>
                        <div class="live-preview" id="rectify-missmatch-result">

                        </div>
                    </div><!-- end card-body -->
                </div>
            </div> --}}
        @endif
    @else
        <div class="row">
            <div class="col">
                <div class="h-100">
                    <div class="row mb-3 pb-1">
                        <div class="col-12">
                            <div class="d-flex align-items-lg-center flex-lg-row flex-column">
                                <div class="flex-grow-1">
                                    <h4 class="fs-16 mb-1">{{ $greeting }}, {{ Auth::user()->name }}!</h4>
                                    <p class="text-muted mb-0">Here's what's happening with your business
                                        today.</p>
                                </div>
                            </div><!-- end card header -->
                        </div>
                        <!--end col-->
                    </div>
                </div>
            </div>
        </div>
    @endcan
@endsection
@section('script')
    <script src="{{ URL::asset('/assets/js/app.min.js') }}"></script>
    <script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
    <script src="https://cdn.datatables.net/1.11.5/js/jquery.dataTables.min.js"></script>
    <script src="https://cdn.datatables.net/1.11.5/js/dataTables.bootstrap5.min.js"></script>
    <script>
        $('#branch').select2({});
        let statusTab = '';
        $(document).ready(function() {
            $('#staffSummaryReport').DataTable({
                processing: true,
                serverSide: true,
                ordering: false,
                pageLength: 5,
                "scrollX": true,
                autoWidth: true,
                dom: 'lBfrtip',
                buttons: [{
                    extend: 'excelHtml5',
                }, ],
                lengthMenu: [
                    [5, 25, 50],
                    [5, 25, 50]
                ],
                ajax: {
                    url: "{{ route('staff-summary-sales-man-wise') }}",
                    type: 'POST',
                    data: function(d) {
                        d.branch_id = $("#branch").val();
                        d.from_date = $("#from_date").val();
                        d.to_date = $("#to_date").val();
                        d._token = '{{ csrf_token() }}';
                    },
                },

                columns: [{
                        data: 'staff',
                        name: 'staff'
                    },
                    {
                        data: 'sales',
                        name: 'sales'
                    },
                ],

            });
            $('#checkSync').click(function() {
                $('#list-syncs').empty();
                var placeholder =
                    `<li><span class="placeholder col-6"></span></li>
                        <li><span class="placeholder col-6"></span></li>
                        <li><span class="placeholder col-6"></span></li>
                        <li><span class="placeholder col-6"></span></li>`;
                $('#list-syncs').append(placeholder);
                $.ajax({
                    url: '/admin/sync_counts',
                    type: 'GET',
                    success: function(data) {
                        if (data.status) {
                            $('#list-syncs').empty();
                            $.each(data.data, function(key, value) {
                                var key = key.replace(/_/g, ' ');
                                key = key.charAt(0).toUpperCase() + key.slice(1);
                                var badge = '';
                                if (value > 0) {
                                    badge = `<span class="badge bg-danger">SYNC</span>`;
                                } else {
                                    badge = `<span class="badge bg-success">OK</span>`;
                                }
                                var li = `<li class="list-group-item d-flex justify-content-between align-items-center">
                                        ${key} ${badge}
                                    </li>`;
                                $('#list-syncs').append(li);
                            });
                        } else {
                            alert(data.message);
                        }
                    }
                });
            });

            $('#rectifySync').click(function(e) {
                e.preventDefault();
                $('#rectify-result').empty();
                var placeholder =
                    `<div class="spinner-border text-primary" role="status">
                        <span class="visually-hidden">Loading...</span>
                    </div>`;
                $('#rectify-result').append(placeholder);
                $.ajax({
                    url: '/admin/rectify-cancelled',
                    type: 'GET',
                    success: function(data) {
                        if (data.status) {
                            $('#rectify-result').empty();
                            var p =
                                `<p class="text-success">Rectified Vouchers : ${data.data['rectified']}</p>`;
                            $('#rectify-result').append(p);
                        } else {
                            alert(data.message);
                        }
                    }
                });
            });

            $('#rectifyAmount').click(function(e) {
                e.preventDefault();
                $('#rectify-amount-result').empty();
                var placeholder =
                    `<div class="spinner-border text-primary" role="status">
                        <span class="visually-hidden">Loading...</span>
                    </div>`;
                $('#rectify-amount-result').append(placeholder);
                $.ajax({
                    url: '/admin/rectify-amount',
                    type: 'GET',
                    success: function(data) {
                        if (data.status) {
                            $('#rectify-amount-result').empty();
                            var p =
                                '<table class="table table-bordered"><tr><th>Date</th><th>Voucher Number</th><th>Voucher Type</th><th>Amount</th></tr>';

                            $.each(data.data, function(key, value) {
                                p += `<tr>
                                        <td>${value.voucher_date}</td>
                                        <td>${value.voucher_number}</td>
                                        <td> ${value.voucher_type.name}</td>
                                        <td> ${value.diff_amount}</td>
                                    </tr>`;
                            });
                            p += '</table>';
                            $('#rectify-amount-result').append(p);
                        } else {
                            alert(data.message);
                        }
                    }
                });
            });

            $('#rectifyMissMatch').click(function(e) {
                e.preventDefault();
                var placeholder =
                    `<div class="spinner-border text-primary" role="status">
                        <span class="visually-hidden">Loading...</span>
                    </div>`;
                $('#rectify-missmatch-result').append(placeholder);
                $.ajax({
                    url: '/admin/rectify-mismatch',
                    type: 'GET',
                    success: function(data) {
                        if (data.status) {
                            alert(data.message);
                            $('#rectify-missmatch-result').empty();
                        } else {
                            alert(data.message);
                            $('#rectify-missmatch-result').empty();
                        }
                    }
                });
            });
        });

        $('#filter').on('change', function(e) {
            if ($(this).val() == 'customDate') {
                $('#customDateModal').modal('show');
                return;
            }

            var url = ' /admin/update-dashboard-settings';
            $.ajax({
                url: url,
                type: 'POST',
                data: {
                    dashboard_filter: $('#filter').val(),
                    _token: "{{ csrf_token() }}"
                },
                dataType: 'json',
                success: function(data) {
                    if (data.status == 'success') {
                        location.reload();
                    }
                },
                error: function(data) {}
            });
        });

        $('#customDateForm').on('submit', function(e) {
            e.preventDefault();

            var startDate = $('#custom_start_date').val();
            var endDate = $('#custom_end_date').val();

            if (!startDate || !endDate) {
                alert('Please select both start and end dates.');
                return;
            }
            var url = '/admin/update-dashboard-settings';
            $.ajax({
                url: url,
                type: 'POST',
                data: {
                    dashboard_filter: 'customDate',
                    custom_start_date: startDate,
                    custom_end_date: endDate,
                    _token: "{{ csrf_token() }}"
                },
                dataType: 'json',
                success: function(data) {
                    if (data.status == 'success') {
                        $('#customDateModal').modal('hide');
                        location.reload();
                    }
                },
                error: function(data) {}
            });
        });
        $('#customDateModal').on('hidden.bs.modal', function() {
            location.reload();
        });
        $('#branch').on('change', function(e) {
            let branchValue = $(this).val();
            if (branchValue == '') {
                window.location.href = window.location.origin + window.location.pathname;
                return;
            }
            let url = window.location.origin + window.location.pathname;
            let params = new URLSearchParams(window.location.search);
            params.set('branch_id', branchValue);
            window.location.href = url + '?' + params.toString();
        });

        $('#checkOutstanding').on('click', function(e) {
            e.preventDefault();
            $('#outstandingBalance').hide();
            $('#checkOutstanding').prop('disabled', true);
            $.ajax({
                url: '/admin/get-outstanding-balance',
                type: 'POST',
                data: {
                    _token: "{{ csrf_token() }}",
                    branch_id: $('#branch').val()
                },
                success: function(data) {
                    $('#outstandingBalance').text(data.outstanding);
                    $('#outstandingBalance').show();
                    $('#checkOutstanding').prop('disabled', false);
                }
            });
        });
        $('#filter_summary').on('click', function(e) {
            $('#staffSummaryReport').DataTable().ajax.reload();
        })
    </script>
@endsection