@extends('layouts.app')

@section('content')
<div class="max-w-7xl mx-auto px-4 py-8">
    <h1 class="text-3xl font-bold mb-6 text-gray-800">Toutes les Commandes</h1>

    <div class="bg-white shadow rounded-lg overflow-hidden">
        <table class="min-w-full leading-normal">
            <thead class="bg-gray-50">
                <tr>
                    <th class="px-5 py-3 border-b-2 border-gray-200 text-left text-xs font-semibold text-gray-600 uppercase">ID</th>
                    <th class="px-5 py-3 border-b-2 border-gray-200 text-left text-xs font-semibold text-gray-600 uppercase">Date</th>
                    <th class="px-5 py-3 border-b-2 border-gray-200 text-left text-xs font-semibold text-gray-600 uppercase">Client</th>
                    <th class="px-5 py-3 border-b-2 border-gray-200 text-left text-xs font-semibold text-gray-600 uppercase">Montant</th>
                    <th class="px-5 py-3 border-b-2 border-gray-200 text-left text-xs font-semibold text-gray-600 uppercase">Paiement</th>
                    <th class="px-5 py-3 border-b-2 border-gray-200 text-left text-xs font-semibold text-gray-600 uppercase">Statut</th>
                    <th class="px-5 py-3 border-b-2 border-gray-200"></th>
                </tr>
            </thead>
            <tbody>
                @foreach($orders as $order)
                <tr>
                    <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm font-bold">
                        #{{ $order->id }}
                    </td>
                    <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                        {{ $order->created_at->format('d/m/Y') }}
                    </td>
                    <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                        {{ $order->customer_name }}
                    </td>
                    <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm font-bold">
                        {{ number_format($order->total_price, 2) }} €
                    </td>

                    <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                        @if($order->payment_status == 'paye')
                            <span class="text-green-600 font-bold bg-green-100 px-2 py-1 rounded-full text-xs">
                                <i class="fas fa-check-circle"></i> Payé
                            </span>
                        @elseif($order->payment_status == 'rembourse' || $order->payment_status == 'remboursé')
                            <span class="text-red-600 font-bold bg-red-100 px-2 py-1 rounded-full text-xs">
                                <i class="fas fa-undo"></i> Remboursé
                            </span>
                        @else
                            <span class="text-orange-500 font-bold bg-orange-100 px-2 py-1 rounded-full text-xs">
                                <i class="fas fa-clock"></i> En attente
                            </span>
                        @endif
                    </td>

                    <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm">
                        <span class="px-2 py-1 font-semibold leading-tight text-gray-700 bg-gray-100 rounded-full">
                            {{ ucfirst($order->status) }}
                        </span>
                    </td>
                    <td class="px-5 py-5 border-b border-gray-200 bg-white text-sm text-right">
                        <a href="{{ route('admin.orders.show', $order->id) }}" class="text-blue-600 hover:text-blue-900 font-bold">Gérer</a>
                    </td>
                </tr>
                @endforeach
            </tbody>
        </table>

        <div class="p-4">
            {{ $orders->links() }}
        </div>
    </div>
</div>
@endsection