@extends('layout.app')

@section('content')
<div class="app-content main-content">
    <div class="side-app main-container">
        <div class="page-header d-xl-flex d-block">
            <div class="page-leftheader">
                <div class="page-title"> Orders </div>
            </div>
        </div>
        <div class="container">
            <div class="row">
                <div class="col">
                    <div class="row row-sm">
                        <div class="col-lg-12">
                            @include('includes.alerts')
                            <div class="card">
                                <div class="card-header d-flex align-items-center justify-content-between">
                                    <h3 class="card-title mb-0">Orders Data Table</h3>
                                    <div class="d-flex align-items-center gap-2">
                                        <form method="GET" action="{{ route('orders.index') }}" class="d-flex align-items-center gap-2">
                                            <select name="status" class="form-select" style="width: 150px;">
                                                <option value="">All Status</option>
                                                @foreach ($statuses as $statusKey)
                                                <option value="{{ $statusKey }}" {{ request('status') == $statusKey ? 'selected' : '' }}>{{ ucfirst(str_replace('_', ' ', $statusKey)) }}</option>
                                                @endforeach
                                            </select>
                                            <input type="date" name="date_from" class="form-control" style="width: 150px;" value="{{ request('date_from') }}" placeholder="Date From">
                                            <input type="date" name="date_to" class="form-control" style="width: 150px;" value="{{ request('date_to') }}" placeholder="Date To">
                                            <button type="submit" class="btn btn-primary">Filter</button>
                                        </form>
                                    </div>
                                </div>
                                <div class="card-body">
                                    <div class="table-responsive">
                                        <table class="table table-bordered text-nowrap border-bottom">
                                            <thead>
                                                <tr>
                                                    <th>Order ID</th>
                                                    <th>Customer</th>
                                                    <th>Address</th>
                                                    <th>Status</th>
                                                    <th>Payment Method</th>
                                                    <th>Total</th>
                                                    <th>Delivery Date</th>
                                                    <th>Created At</th>
                                                    <th>Actions</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                @forelse ($orders as $order)
                                                <tr>
                                                    <td>#{{ $order->id }}</td>
                                                    <td>
                                                        {{ $order->customer?->name ?? '-' }}<br>
                                                        <small class="text-muted">{{ $order->customer?->phone ?? '' }}</small>
                                                    </td>
                                                    <td>{{ $order->address?->title ?? '-' }}</td>
                                                    <td>
                                                        <span class="badge bg-{{ [
                                                            'pending' => 'warning',
                                                            'confirmed' => 'info',
                                                            'preparing' => 'orange',
                                                            'on_the_way' => 'purple',
                                                            'delivered' => 'success',
                                                            'cancelled' => 'danger',
                                                        ][$order->status] ?? 'secondary' }}">{{ ucfirst(str_replace('_', ' ', $order->status)) }}</span>
                                                    </td>
                                                    <td>{{ ucfirst($order->payment_method) }}</td>
                                                    <td>${{ number_format($order->total, 2) }}</td>
                                                    <td>{{ $order->delivery_date ? \Carbon\Carbon::parse($order->delivery_date)->format('Y-m-d') : '-' }}</td>
                                                    <td>{{ $order->created_at->format('Y-m-d') }}</td>
                                                    <td>
                                                        <a class="btn btn-info" href="{{ route('orders.show', $order->id) }}">
                                                            <i class="feather feather-eye"></i>
                                                        </a>
                                                    </td>
                                                </tr>
                                                @empty
                                                <tr>
                                                    <td colspan="9" class="text-center text-muted">No orders found.</td>
                                                </tr>
                                                @endforelse
                                            </tbody>
                                        </table>
                                    </div>
                                    {{ $orders->links() }}
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection