@extends('frontend.layouts.master')
@section('content')
    <section class="section border-0 m-0">
        <div class="container-xxl">
            <x-user-panel>
                <div class="row">
                    <div class="col-lg-12 col-md-12 col-sm-12">
                        <div class="card">
                            <div class="card-header py-3 bg-white ">
                                <h3 class="card-title mb-0 text-capitalize">
                                    {{ trans("routes.My Orders") }}
                                </h3>
                            </div>
                            <div class="card-body">
                                <table class="table table-hover table-orders">
                                    <thead>
                                    <tr>
                                        <th>#</th>
                                        <th>{{ trans("routes.Order ID") }}</th>
                                        <th>{{ trans("routes.Payment Status") }}</th>
                                        <th>{{ trans("routes.Delivery Status") }}</th>
                                        <th>{{ trans("routes.Coupon") }}</th>
                                        <th>{{ trans("routes.Shipping") }}</th>
                                        <th>{{ trans("routes.Total") }}</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    @forelse ($orders as $key => $order)
                                        <tr>
                                            <td width="1%">
                                                <a href="{{ route('orders.download-qr', $order->code) }}" target="_blank" data-bs-toggle="tooltip" data-bs-animation="false" data-bs-placement="top" title="" data-bs-original-title="Click to download">
                                                    <img src="{{ asset($order->qrcode??'') }}" alt="" width="70">
                                                </a>
                                            </td>
                                            <td class="text-center" width="5%">
                                                {{ $order->code }}
                                            </td>
                                            <td>
                                            <span class="badge bg-info">
                                                {{ $order->payment->name }}
                                            </span>
                                                <br>
                                                @if($order->payment_status == "paid")
                                                    <span class="badge bg-success">
                                                {{ $order->payment_status }}
                                            </span>
                                                @else
                                                    <span class="badge bg-danger">
                                                {{ $order->payment_status }}
                                            </span>
                                                @endif
                                            </td>
                                            <td>
                                                @if($order->delivery_status == "delivered")
                                                    <span class="badge bg-success">
                                                {{ $order->delivery_status }}
                                            </span>
                                                @else
                                                    <span class="badge bg-danger">
                                                {{ $order->delivery_status }}
                                            </span>
                                                @endif
                                            </td>
                                            <td>
                                                {{ Helper::calculatePrice($order->coupon->discount, $order->currency->getTranslation('code', 'en')) ?? 0 }} {{$order->currency->code}}
                                            </td>
                                            <td>
                                                {{ Helper::calculatePrice($order->shipping_cost, $order->currency->getTranslation('code', 'en')) ?? 0 }} {{$order->currency->code}}
                                            </td>
                                            <td>
                                                {{ Helper::calculatePrice($order->total, $order->currency->getTranslation('code', 'en')) ?? 0 }} {{$order->currency->code}}
                                            </td>
                                        </tr>
                                    @empty
                                        <style>
                                            .table-orders {
                                                display: none;
                                            }

                                        </style>
                                        <div class="row">
                                            <div class="col-12 text-center">
                                                <i class="fa-solid fa-box text-muted text-13"></i>
                                                <p>
                                                    {{ trans('routes.There are no orders') }}
                                                </p>
                                            </div>
                                        </div>
                                    @endforelse
                                    </tbody>
                                    <tfoot>
                                    {{$orders->links()}}
                                    </tfoot>
                                </table>
                            </div>
                        </div>
                    </div>

                </div>
            </x-user-panel>
        </div>
    </section>
@endsection