<div x-data="{ showOrder: @entangle('showOrder') }">
    <div class="d-flex">
        <h2 class="h5 text-uppercase mb-4">{{__('Orders')}}</h2>
    </div>

    <div class="my-4">
        <div class="table-responsive">
            <table class="table table-content " >
                <thead>
                    <tr>
                        <th>{{__('Order Id')}}</th>
                        <th>{{__('Total')}}</th>
                        <th>{{__("Status")}}</th>
                        <th>{{__("Date")}}</th>
                        <th class="col-2"></th>
                    </tr>
                </thead>
                <tbody>
                @forelse($orders as $odr)
                    <tr wire:key="{{ $odr->id }}">

                        <td>{{ $odr->ref_id }}</td>
                        <td>{{ format_amount($odr->total,$odr->currency())}}</td>
                        <td>{!! $odr->status->badge_label ?? "/" !!}</td>
                        <td>{{ format_date($odr->created_at)}}</td>
                        <td class="text-right">
                            <button type="button" wire:click="displayOrder('{{ $odr->id }}')"
                                    x-on:click="showOrder = true" class="btn btn-link text-infox">
                                <i class="fa fa-eye"></i>
                            </button>
                        </td>
                    </tr>
                @empty
                    <tr>
                        <td colspan="5">
                            <p class="text-center">{{__("No orders found.")}}</p>
                        </td>
                    </tr>
                @endforelse
                </tbody>
            </table>
        </div>
        @if($order)
            <div x-show="showOrder" x-on:click.away="showOrder = false" class="border rounded shadow p-4">
                <div class="table-responsive mb-4">
                    <table class="table">
                        <thead class="bg-light">
                        <tr>
                            <th class="border-0" scope="col"><strong class="text-small text-uppercase">{{__("Product")}}</strong></th>
                            <th class="border-0" scope="col"><strong class="text-small text-uppercase">{{__("Price")}}</strong></th>
                            <th class="border-0" scope="col"><strong class="text-small text-uppercase">{{__('Quantity')}}</strong></th>
                            <th class="border-0" scope="col"><strong class="text-small text-uppercase">{{__("Total")}}</strong></th>
                        </tr>
                        </thead>
                        <tbody>
                        @forelse($order->products as $product)
                            <tr>
                                <td>{{ $product->name }}</td>
                                <td>{{ format_amount($product->price,$order->currency()) }}</td>
                                <td>{{ format_amount($product->pivot->quantity) }}</td>
                                <td>{{ format_amount( $product->pivot->amount,$order->currency()) }}</td>
                            </tr>
                        @empty
                        @endforelse

                        <tr>
                            <td colspan="3" class="text-right"><strong>{{__("Subtotal")}}</strong></td>
                            <td>{{format_amount($order->subtotal,$order->currency()) }}</td>
                        </tr>
                        @if(!is_null($order->discount_code))
                            <tr>
                                <td colspan="3" class="text-right"><strong>{{__("Discount")}} (<small>{{ $order->discount_code }}</small>)</strong></td>
                                <td>{{format_amount($order->discount,$order->currency()) }}</td>
                            </tr>
                        @endif
                        <tr>
                            <td colspan="3" class="text-right"><strong>{{__("Tax")}}</strong></td>
                            <td>{{format_amount($order->tax,$order->currency()) }}</td>
                        </tr>
                        <tr>
                            <td colspan="3" class="text-right"><strong>{{__("Shipping")}}</strong></td>
                            <td>{{format_amount($order->shipping,$order->currency()) }}</td>
                        </tr>
                        <tr>
                            <td colspan="3" class="text-right"><strong>{{__("Total")}}</strong></td>
                            <td>{{format_amount($order->total,$order->currency()) }}</td>
                        </tr>
                        </tbody>
                    </table>

                </div>

                <h2 class="h5 text-uppercase">{{__('Payments')}}</h2>
                <div class="table-responsive mb-4">
                    <table class="table">
                        <thead class="bg-light">
                            <tr>
                                <th class="border-0" scope="col"><strong class="text-small text-uppercase">{{__("Method")}}</strong></th>
                                <th class="border-0" scope="col"><strong class="text-small text-uppercase">{{__("Reference")}}</strong></th>
                                <th class="border-0" scope="col"><strong class="text-small text-uppercase">{{__("Amount Paid")}}</strong></th>
                                <th class="border-0" scope="col"><strong class="text-small text-uppercase">{{__("Amount Used")}}</strong></th>
                                <th class="border-0" scope="col"><strong class="text-small text-uppercase">{{__("Paid At")}}</strong></th>
                            </tr>
                        </thead>
                        <tbody>
                        @forelse($order->paymentUsages as $usage)
                            <tr class="{{ ($usage->rejected) ? "table-danger" : "" }}">
                                <td>{{ $usage->payment->method->name }}</td>
                                <td>{{ $usage->payment->provider_reference }}</td>
                                <td>{{ format_amount($usage->payment->paid_amount,$order->currency()) }}</td>
                                <td>{{ format_amount($usage->amount_used,$order->currency()) }}</td>
                                <td>{{ format_date($usage->payment->created_at) }}</td>
                            </tr>
                        @empty
                            <tr>
                                <td colspan="4">{{__("No payments in this order.")}}</td>
                            </tr>
                        @endforelse
                    </table>
                </div>

                @if($order->statusChanges)
                    <div class="14">
                        <h2 class="h5 text-uppercase">{{__('Process')}}</h2>
                        <div class="table-responsive mb-4">
                            <table class="table">
                                <thead class="bg-light">
                                    <tr>
                                        <th class="border-0" scope="col"><strong class="text-small text-uppercase">{{__("Status")}}</strong></th>
                                        <th class="border-0" scope="col"><strong class="text-small text-uppercase">{{__("At")}}</strong></th>
                                        <th></th>
                                    </tr>
                                </thead>

                                <tbody>
                                    @foreach($order->statusChanges as $change)
                                        <tr >
                                            <td>{!! $change->status->badge_dot ?? "" !!}</td>
                                            <td>{{ format_date($change->created_at, __("Y-m-d H:i:s")) }}</td>
{{--                                            <td>--}}
{{--                                                @if ($loop->last--}}
{{--                                                      && $change->status_code == \App\Models\Statuses\Status::REFUNDED_ORDER)--}}
{{--                                                      && now()->addDays(5)->diffInDays(format_date($change->created_at)) != 0)--}}
{{--                                                    <button type="button" wire:click="requestReturnOrder('{{ $order->id }}')" class="btn btn-link text-right">--}}
{{--                                                        {{__("Return Order")}}--}}
{{--                                                    </button><br>--}}
{{--                                                    <small class="text-danger">{{__("you can return this order in :time days",['time' => 4 - $transaction->created_at->diffInDays()])}}</small>--}}
{{--                                                @endif--}}
{{--                                            </td>--}}
                                        </tr>
                                    @endforeach
                                </tbody>
                            </table>

                        </div>
                    </div>
                @endif
            </div>
        @endif
    </div>
</div>
