@extends('layouts.app')

@section('content')

<div class="container mt-4">

    <h3 class="mb-3">My Orders</h3>

    <div class="table-responsive">
        <table class="table table-striped align-middle">

            <thead>
                <tr>
                    <th>ID</th>
                    <th>Order No</th>
                    <th>Products</th>
                    <th>Date</th>
                    <th>Total</th>
                    <th>Status</th>
                    <th>Invoice</th>
                </tr>
            </thead>

            <tbody>

            @forelse($orders as $order)
                <tr>

                    <td>{{ $loop->iteration }}</td>

                    <td>#{{ $order->order_no }}</td>

                    {{-- PRODUCTS --}}
                    <td>
                        @foreach($order->items as $item)
                            <div style="display:flex; align-items:center; gap:8px; margin-bottom:6px;">

                                {{-- IMAGE --}}
                                {{-- @if($item->product && $item->product->image)
                                    <img src="{{ asset('storage/'.$item->product->image) }}"
                                         width="40" height="40"
                                         style="border-radius:6px; object-fit:cover;">
                                @else
                                    <img src="{{ asset('no-image.png') }}"
                                         width="40" height="40">
                                @endif --}}

                                {{-- NAME + QTY --}}
                                <span style="font-size:13px;">
                                    {{ $item->product_name }}
                                    <small class="text-muted">x{{ $item->quantity }}</small>
                                </span>

                            </div>
                        @endforeach
                    </td>

                    <td>{{ $order->created_at->format('d M Y') }}</td>

                    <td>₹{{ number_format($order->total_amount, 2) }}</td>

                    {{-- STATUS --}}
                    <td>
                        @if($order->order_status === 'DELIVERED')
                            <span class="badge bg-success"style="color:white;">Delivered</span>
                        @elseif($order->order_status === 'PLACED')
                            <span class="badge bg-primary"style="color:white;">Placed</span>
                        @else
                            <span class="badge bg-secondary"style="color:white;">{{ $order->order_status }}</span>
                        @endif
                    </td>

                    {{-- INVOICE --}}
                    <td>
                       <a href="{{ route('user.invoice.pdf', $order->id) }}"
                           class="btn btn-sm btn-primary"
                           target="_blank">
                            View
                        </a>
                    </td>

                </tr>
            @empty
                <tr>
                    <td colspan="7" class="text-center">No Orders Found</td>
                </tr>
            @endforelse

            </tbody>

        </table>
    </div>

</div>

@endsection