@extends('layouts.user')
@section('content')
<div class="grid gap-10">
    <div class="grid md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-7">
        <div class="dashboardCard">
            <a href="{{url('user/orders')}}">
                <div class="flex items-center justify-between mb-5 pb-1">
                    <div class="grid gap-2.5">
                        <h3 class="font-bold text-3xl text-darkblue">{{$allInvoice->count()}}</h3>
                        <span class="text-gray-700 uppercase">Total Order</span>
                    </div>
                    <div class="dashboardCardIcon">
                        <svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 384 512"
                            height="1em" width="1em" xmlns="http://www.w3.org/2000/svg">
                            <path
                                d="M64 0C28.7 0 0 28.7 0 64L0 448c0 35.3 28.7 64 64 64l256 0c35.3 0 64-28.7 64-64l0-384c0-35.3-28.7-64-64-64L64 0zM96 64l192 0c17.7 0 32 14.3 32 32l0 32c0 17.7-14.3 32-32 32L96 160c-17.7 0-32-14.3-32-32l0-32c0-17.7 14.3-32 32-32zm32 160a32 32 0 1 1 -64 0 32 32 0 1 1 64 0zM96 352a32 32 0 1 1 0-64 32 32 0 1 1 0 64zM64 416c0-17.7 14.3-32 32-32l96 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-96 0c-17.7 0-32-14.3-32-32zM192 256a32 32 0 1 1 0-64 32 32 0 1 1 0 64zm32 64a32 32 0 1 1 -64 0 32 32 0 1 1 64 0zm64-64a32 32 0 1 1 0-64 32 32 0 1 1 0 64zm32 64a32 32 0 1 1 -64 0 32 32 0 1 1 64 0zM288 448a32 32 0 1 1 0-64 32 32 0 1 1 0 64z">
                            </path>
                        </svg>
                    </div>
                </div>
            </a>
        </div>

        <div class="dashboardCard">
            <a href="{{url('user/orders?status=delete')}}">
                <div class="flex items-center justify-between mb-5 pb-1">
                    <div class="grid gap-2.5">
                        <h3 class="font-bold text-3xl text-darkblue">{{$allInvoice->where('status', 'delete')->count()}}
                        </h3>
                        <span class="text-gray-700 uppercase">Delete Order</span>
                    </div>
                    <div class="dashboardCardIcon">
                        <svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 384 512"
                            height="1em" width="1em" xmlns="http://www.w3.org/2000/svg">
                            <path
                                d="M64 0C28.7 0 0 28.7 0 64L0 448c0 35.3 28.7 64 64 64l256 0c35.3 0 64-28.7 64-64l0-384c0-35.3-28.7-64-64-64L64 0zM96 64l192 0c17.7 0 32 14.3 32 32l0 32c0 17.7-14.3 32-32 32L96 160c-17.7 0-32-14.3-32-32l0-32c0-17.7 14.3-32 32-32zm32 160a32 32 0 1 1 -64 0 32 32 0 1 1 64 0zM96 352a32 32 0 1 1 0-64 32 32 0 1 1 0 64zM64 416c0-17.7 14.3-32 32-32l96 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-96 0c-17.7 0-32-14.3-32-32zM192 256a32 32 0 1 1 0-64 32 32 0 1 1 0 64zm32 64a32 32 0 1 1 -64 0 32 32 0 1 1 64 0zm64-64a32 32 0 1 1 0-64 32 32 0 1 1 0 64zm32 64a32 32 0 1 1 -64 0 32 32 0 1 1 64 0zM288 448a32 32 0 1 1 0-64 32 32 0 1 1 0 64z">
                            </path>
                        </svg>
                    </div>
                </div>
            </a>
        </div>

        <div class="dashboardCard">
            <a href="{{url('user/orders?status=pending')}}">
                <div class="flex items-center justify-between mb-5 pb-1">
                    <div class="grid gap-2.5">
                        <h3 class="font-bold text-3xl text-darkblue">{{$allInvoice->where('status',
                            'pending')->count()}}</h3>
                        <span class="text-gray-700 uppercase">Pending Order</span>
                    </div>
                    <div class="dashboardCardIcon">
                        <svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 384 512"
                            height="1em" width="1em" xmlns="http://www.w3.org/2000/svg">
                            <path
                                d="M64 0C28.7 0 0 28.7 0 64L0 448c0 35.3 28.7 64 64 64l256 0c35.3 0 64-28.7 64-64l0-384c0-35.3-28.7-64-64-64L64 0zM96 64l192 0c17.7 0 32 14.3 32 32l0 32c0 17.7-14.3 32-32 32L96 160c-17.7 0-32-14.3-32-32l0-32c0-17.7 14.3-32 32-32zm32 160a32 32 0 1 1 -64 0 32 32 0 1 1 64 0zM96 352a32 32 0 1 1 0-64 32 32 0 1 1 0 64zM64 416c0-17.7 14.3-32 32-32l96 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-96 0c-17.7 0-32-14.3-32-32zM192 256a32 32 0 1 1 0-64 32 32 0 1 1 0 64zm32 64a32 32 0 1 1 -64 0 32 32 0 1 1 64 0zm64-64a32 32 0 1 1 0-64 32 32 0 1 1 0 64zm32 64a32 32 0 1 1 -64 0 32 32 0 1 1 64 0zM288 448a32 32 0 1 1 0-64 32 32 0 1 1 0 64z">
                            </path>
                        </svg>
                    </div>
                </div>
            </a>
        </div>

        <div class="dashboardCard">
            <a href="{{url('user/orders?status=paid')}}">
                <div class="flex items-center justify-between mb-5 pb-1">
                    <div class="grid gap-2.5">
                        <h3 class="font-bold text-3xl text-darkblue">{{$allInvoice->where('status', 'paid')->count()}}
                        </h3>
                        <span class="text-gray-700 uppercase">Complete Order</span>
                    </div>
                    <div class="dashboardCardIcon">
                        <svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 384 512"
                            height="1em" width="1em" xmlns="http://www.w3.org/2000/svg">
                            <path
                                d="M64 0C28.7 0 0 28.7 0 64L0 448c0 35.3 28.7 64 64 64l256 0c35.3 0 64-28.7 64-64l0-384c0-35.3-28.7-64-64-64L64 0zM96 64l192 0c17.7 0 32 14.3 32 32l0 32c0 17.7-14.3 32-32 32L96 160c-17.7 0-32-14.3-32-32l0-32c0-17.7 14.3-32 32-32zm32 160a32 32 0 1 1 -64 0 32 32 0 1 1 64 0zM96 352a32 32 0 1 1 0-64 32 32 0 1 1 0 64zM64 416c0-17.7 14.3-32 32-32l96 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-96 0c-17.7 0-32-14.3-32-32zM192 256a32 32 0 1 1 0-64 32 32 0 1 1 0 64zm32 64a32 32 0 1 1 -64 0 32 32 0 1 1 64 0zm64-64a32 32 0 1 1 0-64 32 32 0 1 1 0 64zm32 64a32 32 0 1 1 -64 0 32 32 0 1 1 64 0zM288 448a32 32 0 1 1 0-64 32 32 0 1 1 0 64z">
                            </path>
                        </svg>
                    </div>
                </div>
            </a>
        </div>
    </div>

    <div class="border rounded grid">
        <div class="panelHeader bg-darkblue text-white">
            <h3 class="panelHeaderTitle text-center lg:text-xl">Recent Order</h3>
            <a href="{{ route('user.orders') }}"
                class="button bg-secondary text-black hover:bg-white hover:text-darkblue text-sm">
                <i class="fas fa-list"></i>
                All Order
            </a>
        </div>

        <div class="p-5">
            <div class="relative overflow-x-auto border">
                <table class="w-full text-sm text-left  text-gray-500 ">
                    <thead class="text-xs text-gray-700 uppercase bg-gray-50 ">
                        <tr>
                            <th scope="col" class="px-6 py-3">
                                Invoice No
                            </th>
                            <th scope="col" class="px-6 py-3">
                                Created At
                            </th>
                            <th scope="col" class="px-6 py-3">
                                Method
                            </th>
                            <th scope="col" class="px-6 py-3">
                                Paid Date
                            </th>
                            <th scope="col" class="px-6 py-3">
                                Email
                            </th>
                            <th scope="col" class="px-6 py-3">
                                Status
                            </th>
                            <th scope="col" class="px-6 py-3">
                                Amount
                            </th>
                            <th scope="col" class="px-6 py-3">
                                Link
                            </th>
                        </tr>
                    </thead>

                    @php($results = $allInvoice->sortByDesc('id')->take(5))
                    <tbody>

                        @if(!empty($results))
                        @foreach($results as $row)
                        <tr class="bg-white border-b last:border-b-0">
                            <td class="px-6 py-3">
                                #{{ $row->invoice_no }}
                            </td>
                            <td class="px-6 py-3">
                                {{ !empty($row->created) ? date('d F, Y', strtotime($row->created)) : '' }}
                            </td>
                            <td class="px-6 py-3">
                                {{ !empty($row->method->name) ? $row->method->name : '' }}
                            </td>
                            <td class="px-6 py-3">
                                {{ !empty($row->payment_date) ? date('d F, Y', strtotime($row->payment_date)) : '' }}
                            </td>
                            <td class="px-6 py-3">
                                {{ $row->email }}
                            </td>
                            <td class="px-6 py-3">
                                @if ($row->status == 'pending')
                                <span class="badge badge-premium mb-2">{{ strFilter($row->status) }}</span>
                                @elseif($row->status == 'unpaid')
                                <span class="badge badge-warning mb-2">{{ strFilter($row->status) }}</span>
                                @elseif($row->status == 'delete')
                                <span class="badge badge-danger mb-2">{{ strFilter($row->status) }}</span>
                                @else
                                <span class="badge badge-success mb-2">{{ strFilter($row->status) }}</span>
                                @endif
                            </td>
                            <td class="px-6 py-3">
                                {{ sprintf("$%0.2f", $row->grand_total) }}
                            </td>
                            <td class="px-6 py-3">
                                <a href="{{ url('invoice', $row->ref_code) }}" target="_blank"
                                    class="py-2 px-3 rounded duration-300  bg-green-600/20 text-green-600 cursor-pointer hover:bg-green-600 hover:text-white gap-4">
                                    View
                                </a>
                            </td>
                        </tr>
                        @endforeach
                        @endif
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>
@endsection

@push('headerPartial')
<style>
    #dashboardMain {
        border: none
    }
</style>
@endpush