@extends('backend.layouts.customer-horizontal')
@section('title','Orders')
@section('content')
    <div class="container-fluid">

        <div class="row">
            <div class="col-xl-12">

                <div class="table-responsive">
                    <table class="table mb-0">

                        <thead class="table-dark">
                        <tr>
                            <th>#</th>
                            <th>Order Id</th>
                            <th>Product Name</th>
                            <th>Date</th>
                            <th>Amount</th>
                            <th>Order Status</th>
                            <th>Expected Delivery</th>
                            <th>Payment Status</th>
                            <th>Actions</th>
                        </tr>
                        </thead>
                        <tbody>
                        @foreach($orderDetails as $orderDetail)
                            <tr>
                                <th scope="row">{{ $orderDetails->firstItem() + $loop->index }}</th>
                                <td>{{ $orderDetail->order->code }}</td>
                                <td>
                                    <a href="{{ route('product', $orderDetail->product->slug) }}">{{ $orderDetail->product->name }}</a>
                                </td>
                                <td>{{ $orderDetail->order->order_date->format('d-m-Y H:i') }}</td>
                                <td>{{ $orderDetail->price }}</td>
                                <td><span
                                        class="{{ $orderDetail->delivery_status_color }}">
                                        {{ ucwords($orderDetail->delivery_status ?? 'Confirmed' ) }}
                                    </span></td>
                                <td>@fat</td>
                                <td>{{ $orderDetail->payment_status }}</td>
                                <td>
                                    <div class="btn-group btn-group-sm" role="group" aria-label="Basic example">
                                        <a href="#" class="btn btn-outline-info tip" data-bs-toggle="tooltip"
                                           title="Order Detail"><i class="fa fa-info"></i></a>
                                        <a href="#" class="btn btn-outline-danger" data-bs-toggle="tooltip"
                                           title="Cancel"><i
                                                class="fa fa-window-close"></i></a>
                                        <a href="#" class="btn btn-outline-secondary" data-bs-toggle="tooltip"
                                           title="Track Order"><i
                                                class="fa fa-thumbtack"></i></a>
                                        <a href="#" class="btn btn-outline-warning" data-bs-toggle="tooltip"
                                           title="Download Invoice"><i
                                                class="fa fa-cloud-download-alt"></i></a>
                                    </div>
                                </td>
                            </tr>
                        @endforeach
                        </tbody>

                    </table>

                </div>
                <div class="col-xl-12 mt-3 text-right">
                    {{ $orderDetails->links() }}
                </div>
            </div>

        </div>

    </div>
@endsection