@extends('layouts.app')

@section('title', __('My Orders'))

@php
    /*
     * Use the currency selected in Payment Settings throughout
     * this page and its financial partials.
     */
    $displayCurrency = currency_code(
        $currency ?? default_currency()
    );

    $search = trim(
        (string) ($search ?? request('q', ''))
    );

    $paymentStatus = (string) (
        $paymentStatus ?? request('payment_status', 'all')
    );

    $orderStatus = (string) (
        $orderStatus ?? request('order_status', 'all')
    );

    $sort = (string) (
        $sort ?? request('sort', 'latest')
    );

    if (
        ! in_array(
            $sort,
            ['latest', 'oldest', 'total_high', 'total_low'],
            true
        )
    ) {
        $sort = 'latest';
    }

    $allowedPerPage = [10, 20, 30, 50];

    $perPage = (int) (
        $perPage ?? request('per_page', 10)
    );

    if (! in_array($perPage, $allowedPerPage, true)) {
        $perPage = 10;
    }

    $dateFrom = trim(
        (string) request('date_from', '')
    );

    $dateTo = trim(
        (string) request('date_to', '')
    );

    $hasFilters =
        $search !== ''
        || $paymentStatus !== 'all'
        || $orderStatus !== 'all'
        || $sort !== 'latest'
        || $perPage !== 10
        || $dateFrom !== ''
        || $dateTo !== '';

    $pendingPaymentStatus =
        \App\Models\Order::PAYMENT_PENDING;

    $receivedPaymentStatus =
        \App\Models\Order::PAYMENT_RECEIVED;
@endphp

@section('content')
<div class="container-fluid px-4">
    {{-- Page Header --}}
    <div
        class="d-flex flex-wrap align-items-center
            justify-content-between gap-3 mb-4"
    >
        <div>
            <h1 class="h3 mb-1 fw-700">
                {{ __('My Orders') }}
            </h1>

            <p class="text-muted small mb-0">
                {{
                    __(
                        'Track and manage all your orders in one place.'
                    )
                }}
            </p>
        </div>

        @if(
            \Illuminate\Support\Facades\Route::has(
                'account.dashboard'
            )
        )
            <a
                href="{{ route('account.dashboard') }}"
                class="btn btn-sm btn-outline-secondary"
            >
                <i class="fas fa-arrow-left me-1"></i>
                {{ __('Back to Account') }}
            </a>
        @endif
    </div>

    {{-- Statistics --}}
    @include('account.orders.partials.stats-grid', [
        'stats' => $stats ?? [],
        'currency' => $displayCurrency,
        'displayCurrency' => $displayCurrency,
    ])

    {{-- Filters --}}
    <div class="card border-0 shadow-sm mb-4">
        <div class="card-body">
            <form
                method="GET"
                action="{{ route('account.orders.index') }}"
                id="orderFilterForm"
            >
                <div class="row g-3">
                    {{-- Search --}}
                    <div class="col-md-6 col-lg-3">
                        <label
                            for="order_search"
                            class="visually-hidden"
                        >
                            {{ __('Search orders') }}
                        </label>

                        <div class="input-group input-group-sm">
                            <span
                                class="input-group-text
                                    bg-white border-end-0"
                            >
                                <i class="fas fa-search text-muted"></i>
                            </span>

                            <input
                                type="search"
                                name="q"
                                id="order_search"
                                class="form-control
                                    bg-white border-start-0"
                                placeholder="{{
                                    __('Order number, product or tracking...')
                                }}"
                                value="{{ $search }}"
                                maxlength="100"
                                autocomplete="off"
                            >
                        </div>
                    </div>

                    {{-- Payment Status --}}
                    <div class="col-md-6 col-lg-2">
                        <label
                            for="payment_status"
                            class="visually-hidden"
                        >
                            {{ __('Payment status') }}
                        </label>

                        <select
                            name="payment_status"
                            id="payment_status"
                            class="form-select form-select-sm"
                            onchange="this.form.submit()"
                        >
                            <option
                                value="all"
                                @selected($paymentStatus === 'all')
                            >
                                {{ __('All Payments') }}
                            </option>

                            <option
                                value="{{ $pendingPaymentStatus }}"
                                @selected(
                                    $paymentStatus ===
                                    $pendingPaymentStatus
                                )
                            >
                                {{ __('Pending') }}
                            </option>

                            <option
                                value="{{ $receivedPaymentStatus }}"
                                @selected(
                                    $paymentStatus ===
                                    $receivedPaymentStatus
                                )
                            >
                                {{ __('Paid') }}
                            </option>

                            <option
                                value="payment_failed"
                                @selected(
                                    $paymentStatus ===
                                    'payment_failed'
                                )
                            >
                                {{ __('Failed') }}
                            </option>

                            <option
                                value="refunded"
                                @selected(
                                    $paymentStatus === 'refunded'
                                )
                            >
                                {{ __('Refunded') }}
                            </option>
                        </select>
                    </div>

                    {{-- Order Status --}}
                    <div class="col-md-6 col-lg-2">
                        <label
                            for="order_status"
                            class="visually-hidden"
                        >
                            {{ __('Order status') }}
                        </label>

                        <select
                            name="order_status"
                            id="order_status"
                            class="form-select form-select-sm"
                            onchange="this.form.submit()"
                        >
                            <option
                                value="all"
                                @selected($orderStatus === 'all')
                            >
                                {{ __('All Statuses') }}
                            </option>

                            <option
                                value="active"
                                @selected($orderStatus === 'active')
                            >
                                {{ __('Active') }}
                            </option>

                            <option
                                value="cancelled"
                                @selected(
                                    in_array(
                                        $orderStatus,
                                        ['cancelled', 'canceled'],
                                        true
                                    )
                                )
                            >
                                {{ __('Cancelled') }}
                            </option>
                        </select>
                    </div>

                    {{-- Sort --}}
                    <div class="col-md-6 col-lg-2">
                        <label
                            for="order_sort"
                            class="visually-hidden"
                        >
                            {{ __('Sort orders') }}
                        </label>

                        <select
                            name="sort"
                            id="order_sort"
                            class="form-select form-select-sm"
                            onchange="this.form.submit()"
                        >
                            <option
                                value="latest"
                                @selected($sort === 'latest')
                            >
                                {{ __('Newest First') }}
                            </option>

                            <option
                                value="oldest"
                                @selected($sort === 'oldest')
                            >
                                {{ __('Oldest First') }}
                            </option>

                            <option
                                value="total_high"
                                @selected($sort === 'total_high')
                            >
                                {{ __('Total (High to Low)') }}
                            </option>

                            <option
                                value="total_low"
                                @selected($sort === 'total_low')
                            >
                                {{ __('Total (Low to High)') }}
                            </option>
                        </select>
                    </div>

                    {{-- Results Per Page --}}
                    <div class="col-md-3 col-lg-1">
                        <label
                            for="orders_per_page"
                            class="visually-hidden"
                        >
                            {{ __('Results per page') }}
                        </label>

                        <select
                            name="per_page"
                            id="orders_per_page"
                            class="form-select form-select-sm"
                            onchange="this.form.submit()"
                        >
                            @foreach($allowedPerPage as $perPageOption)
                                <option
                                    value="{{ $perPageOption }}"
                                    @selected(
                                        $perPage === $perPageOption
                                    )
                                >
                                    {{ $perPageOption }}
                                </option>
                            @endforeach
                        </select>
                    </div>

                    {{-- Filter Actions --}}
                    <div class="col-md-9 col-lg-2">
                        <div class="d-flex gap-2">
                            <button
                                type="submit"
                                class="btn btn-sm
                                    btn-primary flex-grow-1"
                            >
                                <i class="fas fa-filter me-1"></i>
                                {{ __('Apply') }}
                            </button>

                            @if($hasFilters)
                                <a
                                    href="{{
                                        route('account.orders.index')
                                    }}"
                                    class="btn btn-sm
                                        btn-outline-secondary"
                                    title="{{ __('Clear filters') }}"
                                    aria-label="{{ __('Clear filters') }}"
                                >
                                    <i class="fas fa-times"></i>
                                </a>
                            @endif
                        </div>
                    </div>

                    {{-- Date From --}}
                    <div class="col-md-4">
                        <label
                            for="date_from"
                            class="form-label small fw-600 mb-1"
                        >
                            {{ __('From Date') }}
                        </label>

                        <input
                            type="date"
                            name="date_from"
                            id="date_from"
                            class="form-control form-control-sm"
                            value="{{ $dateFrom }}"
                            max="{{ now()->format('Y-m-d') }}"
                        >
                    </div>

                    {{-- Date To --}}
                    <div class="col-md-4">
                        <label
                            for="date_to"
                            class="form-label small fw-600 mb-1"
                        >
                            {{ __('To Date') }}
                        </label>

                        <input
                            type="date"
                            name="date_to"
                            id="date_to"
                            class="form-control form-control-sm"
                            value="{{ $dateTo }}"
                            max="{{ now()->format('Y-m-d') }}"
                        >
                    </div>

                    <div class="col-md-4 d-flex align-items-end">
                        <button
                            type="submit"
                            class="btn btn-sm
                                btn-outline-primary w-100"
                        >
                            <i class="fas fa-calendar-alt me-1"></i>
                            {{ __('Apply Date Range') }}
                        </button>
                    </div>

                    {{-- Results Information --}}
                    <div class="col-12">
                        <div class="text-muted small">
                            <span class="fw-600">
                                {{ number_format($orders->total()) }}
                            </span>

                            {{ trans_choice(
                                'order found|orders found',
                                $orders->total()
                            ) }}

                            @if($orders->total() > 0)
                                <span>
                                    ({{
                                        number_format(
                                            $orders->firstItem() ?? 0
                                        )
                                    }}–{{
                                        number_format(
                                            $orders->lastItem() ?? 0
                                        )
                                    }})
                                </span>
                            @endif
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>

    {{-- Orders List --}}
    @if($orders->isNotEmpty())
        <div class="row g-3">
            @foreach($orders as $order)
                @include(
                    'account.orders.partials.order-card',
                    [
                        'order' => $order,
                        'currency' => $displayCurrency,
                        'displayCurrency' => $displayCurrency,
                    ]
                )
            @endforeach
        </div>

        {{-- Pagination --}}
        @if($orders->hasPages())
            <div class="card border-0 shadow-sm mt-4">
                <div class="card-body py-3">
                    <div
                        class="d-flex flex-wrap align-items-center
                            justify-content-between gap-3"
                    >
                        <div class="text-muted small">
                            {{
                                __(
                                    'Showing :first to :last of :total orders',
                                    [
                                        'first' =>
                                            $orders->firstItem() ?? 0,
                                        'last' =>
                                            $orders->lastItem() ?? 0,
                                        'total' => $orders->total(),
                                    ]
                                )
                            }}
                        </div>

                        <div>
                            {{
                                $orders
                                    ->withQueryString()
                                    ->links(
                                        'pagination::bootstrap-5'
                                    )
                            }}
                        </div>
                    </div>
                </div>
            </div>
        @endif
    @else
        <div class="card border-0 shadow-sm">
            <div class="card-body text-center py-5 px-3">
                <i
                    class="fas fa-shopping-bag fa-4x
                        text-muted mb-3 d-block opacity-25"
                ></i>

                <h5 class="text-muted">
                    @if($hasFilters)
                        {{ __('No orders match your filters') }}
                    @else
                        {{ __('No orders yet') }}
                    @endif
                </h5>

                <p class="text-muted small mb-3">
                    @if($hasFilters)
                        {{
                            __(
                                'Try adjusting your search or filter criteria.'
                            )
                        }}
                    @else
                        {{
                            __('Start shopping to see your orders here.')
                        }}
                    @endif
                </p>

                @if($hasFilters)
                    <a
                        href="{{ route('account.orders.index') }}"
                        class="btn btn-outline-primary"
                    >
                        <i class="fas fa-redo me-1"></i>
                        {{ __('Clear Filters') }}
                    </a>
                @elseif(
                    \Illuminate\Support\Facades\Route::has(
                        'storefront.products.index'
                    )
                )
                    <a
                        href="{{
                            route('storefront.products.index')
                        }}"
                        class="btn btn-primary"
                    >
                        <i class="fas fa-search me-1"></i>
                        {{ __('Browse Products') }}
                    </a>
                @endif
            </div>
        </div>
    @endif
</div>
@endsection

@once
    @push('styles')
        <style>
            .fw-600 {
                font-weight: 600;
            }

            .fw-700 {
                font-weight: 700;
            }
        </style>
    @endpush
@endonce