@extends('layouts.layout')
@section('content')
    <div class="page-body">
        <!-- Container-fluid starts-->
        <div class="container-fluid">
            <div class="page-header">
                <div class="row">
                    <div class="col-lg-6">
                        <div class="page-header-left">
                            <h3>Dashboard
                                <small>Diamond Admin panel</small>
                            </h3>
                        </div>
                    </div>
                    <div class="col-lg-6">
                        <ol class="breadcrumb pull-right">
                            <li class="breadcrumb-item">
                                <a href="{{ route('admin.dashboard') }}">
                                    <i data-feather="home"></i>
                                </a>
                            </li>
                            <li class="breadcrumb-item active">Dashboard</li>
                        </ol>
                    </div>
                </div>
            </div>
        </div>
        <!-- Container-fluid Ends-->

        <!-- Container-fluid starts-->
        <div class="container-fluid">
            <div class="row">
                <div class="col-sm-4  ">
                    {{-- <a href="{{ route('admin.widget.list') }}"> --}}
                        <div class="card o-hidden widget-cards">
                            <div class="warning-box card-body">
                                <div class="media static-top-widget align-items-center">
                                    <div class="icons-widgets">
                                        <div class="align-self-center text-center">
                                            <i data-feather="dollar-sign" class="font-warning"></i>
                                        </div>
                                    </div>
                                    <div class="media-body media-doller">
                                        <span class="m-0">Daily sales</span>
                                        <h3 class="mb-0"> <span class="counter">$ {{ $dalysales }}</span>
                                        </h3>
                                    </div>
                                </div>
                            </div>
                        </div>
                        {{--
                    </a> --}}
                </div>
                <div class="col-sm-4 ">
                    {{-- <a href="{{ route('admin.widget.list') }}"> --}}
                        <div class="card o-hidden widget-cards">
                            <div class="secondary-box card-body">
                                <div class="media static-top-widget align-items-center">
                                    <div class="icons-widgets">
                                        <div class="align-self-center text-center">
                                            <i data-feather="dollar-sign" class="font-warning"></i>
                                        </div>
                                    </div>
                                    <div class="media-body media-doller">
                                        <span class="m-0">Monthly sales </span>
                                        <h3 class="mb-0"> <span class="counter">$ {{ $monthlysales }}</span>
                                        </h3>
                                    </div>
                                </div>
                            </div>
                        </div>
                        {{--
                    </a> --}}
                </div>
                <div class="col-sm-4  ">
                    {{-- <a href="{{ route('admin.widget.list') }}"> --}}
                        <div class="card o-hidden widget-cards">
                            <div class="primary-box  card-body">
                                <div class="media static-top-widget align-items-center">
                                    <div class="icons-widgets">
                                        <div class="align-self-center text-center">
                                            <i data-feather="dollar-sign" class="font-warning"></i>
                                        </div>
                                    </div>
                                    <div class="media-body media-doller">
                                        <span class="m-0">Average Basket YTD</span>
                                        <h3 class="mb-0"> <span class="counter">$
                                                {{ number_format($averageBasket, 2) }}</span>
                                        </h3>
                                    </div>
                                </div>
                            </div>
                        </div>
                        {{--
                    </a> --}}
                </div>
                <div class="col-sm-4  ">
                    <a href="{{ route('admin.widget.list') }}">
                        <div class="card o-hidden widget-cards">
                            <div class="success-box card-body">
                                <div class="media static-top-widget align-items-center">
                                    <div class="icons-widgets">
                                        <div class="align-self-center text-center">
                                            <i data-feather="layout" class="font-success"></i>
                                        </div>
                                    </div>
                                    <div class="media-body media-doller">
                                        <span class="m-0">Widget</span>
                                        <h3 class="mb-0"> <span class="counter">{{ $widget }}</span>
                                        </h3>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col-sm-4  ">
                    <a href="{{ route('admin.product.dblist') }}">
                        <div class="card o-hidden widget-cards">
                            <div class="secondary-box card-body">
                                <div class="media static-top-widget align-items-center">
                                    <div class="icons-widgets">
                                        <div class="align-self-center text-center">
                                            <i data-feather="box" class="font-secondary"></i>
                                        </div>
                                    </div>
                                    <div class="media-body media-doller">
                                        <span class="m-0">Products</span>
                                        <h3 class="mb-0"><span class="counter"></span><small> </small>
                                        </h3>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col-sm-4  ">
                    <a href="{{ route('admin.customer.messagelist') }}">
                        <div class="card o-hidden widget-cards">
                            <div class="primary-box card-body">
                                <div class="media static-top-widget align-items-center">
                                    <div class="icons-widgets">
                                        <div class="align-self-center text-center"><i data-feather="message-square"
                                                class="font-primary"></i></div>
                                    </div>
                                    <div class="media-body media-doller"><span class="m-0">Messages</span>
                                        <h3 class="mb-0"><span class="counter">{{ $contactMsg }}</span></h3>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col-sm-4 ">
                    <a href="{{ route('admin.customer') }}">
                        <div class="card o-hidden widget-cards">
                            <div class="secondary-box card-body">
                                <div class="media static-top-widget align-items-center">
                                    <div class="icons-widgets">
                                        <div class="align-self-center text-center"><i data-feather="users"
                                                class="font-danger"></i></div>
                                    </div>
                                    <div class="media-body media-doller"><span class="m-0">New Customers</span>
                                        <h3 class="mb-0"><span class="counter">{{ $users }}</span></h3>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col-sm-4  ">
                    <a href="{{ route('sale.orders') }}">
                        <div class="card o-hidden widget-cards">
                            <div class="primary-box card-body">
                                <div class="media static-top-widget align-items-center">
                                    <div class="icons-widgets">
                                        <div class="align-self-center text-center"><i data-feather="package"
                                                class="font-danger"></i></div>
                                    </div>
                                    <div class="media-body media-doller"><span class="m-0">Orders</span>
                                        <h3 class="mb-0"><span class="counter">{{ $orders }}</span></h3>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col-sm-4 ">
                    <a href="{{ route('custom.intake.list') }}">
                        <div class="card o-hidden widget-cards">
                            <div class="secondary-box card-body">
                                <div class="media static-top-widget align-items-center">
                                    <div class="icons-widgets">
                                        <div class="align-self-center text-center">
                                            <i data-feather="dollar-sign" class="font-warning"></i>
                                        </div>
                                    </div>
                                    <div class="media-body media-doller">
                                        <span class="m-0">Custom Intakes</span>
                                        <h3 class="mb-0"> <span class="counter">{{ $intakes }}</span>
                                        </h3>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </a>
                </div>

                <div class="col-sm-4 ">
                    <a href="{{ route('sale.shipments') }}?filter=2">
                        <div class="card o-hidden widget-cards">
                            <div class="success-box card-body">
                                <div class="media static-top-widget align-items-center">
                                    <div class="icons-widgets">
                                        <div class="align-self-center text-center"><i data-feather="truck"
                                                class="font-success"></i></div>
                                    </div>
                                    <div class="media-body media-doller"><span class="m-0">Total Shipped
                                            Products</span>
                                        <h3 class="mb-0"><span class="counter">{{ $totalShipped }}</span></h3>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col-sm-4   ">
                    <a href="{{ route('sale.shipments') }}?filter=3">
                        <div class="card o-hidden widget-cards">
                            <div class="primary-box card-body">
                                <div class="media static-top-widget align-items-center">
                                    <div class="icons-widgets">
                                        <div class="align-self-center text-center"><i data-feather="truck"
                                                class="font-danger"></i></div>
                                    </div>
                                    <div class="media-body media-doller"><span class="m-0">Total Ready to Ship
                                            Products</span>
                                        <h3 class="mb-0"><span class="counter">{{ $readyToShipment }}</span></h3>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col-sm-4 ">
                    <a href="{{ route('sale.transactions') }}">
                        <div class="card o-hidden widget-cards">
                            <div class="secondary-box card-body">
                                <div class="media static-top-widget align-items-center">
                                    <div class="icons-widgets">
                                        <div class="align-self-center text-center"><i data-feather="dollar-sign"
                                                class="font-danger"></i></div>
                                    </div>
                                    <div class="media-body media-doller"><span class="m-0">Transactions</span>
                                        <h3 class="mb-0"><span class="counter">{{ $trnsactions }}</span></h3>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col-sm-4">
                    <a href="{{ route('sama.internal-product.list') }}">
                        <div class="card o-hidden widget-cards">
                            <div class="primary-box card-body">
                                <div class="media static-top-widget align-items-center">
                                    <div class="icons-widgets">
                                        <div class="align-self-center text-center">
                                            <i data-feather="box" class="font-secondary"></i>
                                        </div>
                                    </div>
                                    <div class="media-body media-doller"><span class="m-0">Sama Internal
                                            Products</span>
                                        <h3 class="mb-0"><span class="counter">{{ $internalProduct }}</span></h3>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </a>
                </div>


            </div>
            <div class="row mt-2 mb-3">
                <div class="col-sm-12">
                    <button class="btn btn-success" id="deploy"><i class="fa fa-refresh"></i> Clear application
                        cache</button>

                    <button class="btn btn-primary" id="clearCloudfront">
                        <i class="fa fa-cloud"></i> Clear CloudFront Cache
                    </button>
                </div>
            </div>

            <div class="row">
                <div class="col-xl-6 xl-100">
                    <div class="card">
                        <div class="card-header">
                            <h5>Latest Orders</h5>
                            <div class="card-header-right">
                                <ul class="list-unstyled card-option">
                                    <li><i class="icofont icofont-simple-left"></i></li>
                                    <li><i class="view-html fa fa-code"></i></li>
                                    <li><i class="icofont icofont-maximize full-card"></i></li>
                                    <li><i class="icofont icofont-minus minimize-card"></i></li>
                                    <li><i class="icofont icofont-refresh reload-card"></i></li>
                                    <li><i class="icofont icofont-error close-card"></i></li>
                                </ul>
                            </div>
                        </div>
                        <div class="card-body">
                            <div class="user-status table-responsive latest-order-table">
                                <table class="table table-bordernone">
                                    <thead>
                                        <tr>
                                            <th scope="col">Order ID</th>
                                            <th scope="col">Order Total</th>
                                            <th scope="col">Payment Method</th>
                                            <th scope="col">Status</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @foreach ($latest_orders as $latestOrder)
                                            <tr>
                                                <td><a href="{{ route('sale.orders.detail', ['id' => $latestOrder->id]) }}"
                                                        class="text-decoration-underline">{{ $latestOrder->order_id }}</a>
                                                </td>
                                                <td class="digits">
                                                    ${{ number_format($latestOrder->final_amount, 2) }}
                                                </td>
                                                <td>{{ $latestOrder->method }}</td>
                                                <td
                                                    class="font-{{ $latestOrder->status == 'SUCCESS' ? 'success' : 'primary' }}">
                                                    <span
                                                        class="badge badge-{{ $latestOrder->status == 'SUCCESS' ? 'success' : 'primary' }}">{{ $latestOrder->status }}</span>
                                                </td>
                                            </tr>
                                        @endforeach


                                    </tbody>
                                </table>
                                <a href="{{ route('sale.orders') }}" class="btn btn-primary mt-4">View All Orders</a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-xl-6 xl-100">
                    <div class="card">
                        <div class="card-header">
                            <h5>Latest Transactions</h5>
                            <div class="card-header-right">
                                <ul class="list-unstyled card-option">
                                    <li><i class="icofont icofont-simple-left"></i></li>
                                    <li><i class="view-html fa fa-code"></i></li>
                                    <li><i class="icofont icofont-maximize full-card"></i></li>
                                    <li><i class="icofont icofont-minus minimize-card"></i></li>
                                    <li><i class="icofont icofont-refresh reload-card"></i></li>
                                    <li><i class="icofont icofont-error close-card"></i></li>
                                </ul>
                            </div>
                        </div>
                        <div class="card-body">
                            <div class="user-status table-responsive latest-order-table">
                                <table class="table table-bordernone">
                                    <thead>
                                        <tr>
                                            <th scope="col">Transaction ID</th>
                                            {{-- <th scope="col">Order ID</th> --}}
                                            <th scope="col">Order Total</th>
                                            <th scope="col">Payment Method</th>
                                            <th scope="col">Status</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @foreach ($latest_transaction as $latest_transaction)
                                            <tr>
                                                <td>{{ $latest_transaction->transaction_id }}</td>
                                                {{-- <td>{{ $latest_transaction->order_id }}</td> --}}
                                                <td class="digits">
                                                    ${{ number_format($latestOrder->final_amount, 2) }}
                                                </td>
                                                <td>{{ $latestOrder->method }}</td>
                                                <td
                                                    class="font-{{ $latestOrder->status == 'SUCCESS' ? 'success' : 'primary' }}">
                                                    <span
                                                        class="badge badge-{{ $latestOrder->status == 'SUCCESS' ? 'success' : 'primary' }}">{{ $latestOrder->status }}</span>
                                                </td>
                                            </tr>
                                        @endforeach


                                    </tbody>
                                </table>
                                <a href="{{ route('sale.transactions') }}" class="btn btn-primary mt-4">View All</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            {{-- {!! $ring_sizer['content'] !!} --}}
        </div>
        <!-- Container-fluid Ends-->
    </div>
    <!-- Modal -->
    {{-- <div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <form action="{{ route('most.love.import') }}" method="POST" enctype="multipart/form-data">
                    @csrf
                    <div class="modal-body">
                        <input type="file" name="file" class="form-control">
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                        <button type="submit" class="btn btn-primary">Save changes</button>
                    </div>
                </form>
            </div>

        </div>
    </div> --}}
@endsection
@push('scripts')
    <script>
        $("#deploy").click(function () {
            var url = "{{ route('redeployment') }}";
            $.ajax({
                url: url,
                type: 'GET',
                beforeSend: function () {
                    $("#deploy").attr("disabled", true);
                    $(".fa-refresh").addClass('fa-spin');
                },
                success: function (response) {
                    console.log(response);
                    if (response.res == 'success') {
                        iziToast.warning({
                            title: 'Caution',
                            message: response.msg,
                        });
                        $(".fa-refresh").removeClass('fa-spin');
                        $("#deploy").attr("disabled", false);
                    }
                    if (response.res == 'error') {
                        iziToast.error({
                            title: 'Error',
                            message: response.msg,
                        });
                        $(".fa-refresh").removeClass('fa-spin');
                        $("#deploy").attr("disabled", true);
                    }


                },
                error: function (res) {
                    console.log(res);
                    $(".fa-refresh").removeClass('fa-spin');
                    $(this).attr("disabled", false);
                }
            })
        });
    </script>

    <script>
        $("#clearCloudfront").click(function () {
            var url = "{{ route('cloudfront.clearCache') }}";

            $.ajax({
                url: url,
                type: "POST",
                headers: {
                    "X-CSRF-TOKEN": "{{ csrf_token() }}"
                },
                beforeSend: function () {
                    $("#clearCloudfront").attr("disabled", true);
                    $("#clearCloudfront i").addClass("fa-spin");
                },
                success: function (response) {
                    if (response.status === 'success') {
                        iziToast.success({
                            title: 'Success',
                            message: response.msg,
                        });
                    } else {
                        iziToast.error({
                            title: 'Error',
                            message: response.msg,
                        });
                    }

                    $("#clearCloudfront i").removeClass("fa-spin");
                    $("#clearCloudfront").attr("disabled", false);
                },
                error: function (res) {
                    iziToast.error({
                        title: 'Error',
                        message: 'Something went wrong while clearing CloudFront cache.',
                    });
                    $("#clearCloudfront i").removeClass("fa-spin");
                    $("#clearCloudfront").attr("disabled", false);
                }
            });
        });
    </script>


@endpush