@extends('layouts.site.master')
@section('panel-accounts', true)
@section('content')
    <div class="container">
        <div class="row mx-0 mt-md-5 mt-0 w-100">
            @include('site.panel.sidebar')
            <div class="col-md-9 col-12 p-2">
                <div class="p-2 shadow-sm bg-white main-radius">
                    <div class="p-2 pb-0 mb-3">
                        <a class="font-13 mint-green d-inline-flex align-items-center gap-1 mb-3"
                           href="{{ route('panel.accounts') }}">
                            <i class="bi bi-arrow-right"></i>
                            بازگشت به لیست اکانت‌ها
                        </a>
                        <p class="bold side-title position-relative max-w mb-2">
                            تاریخچه سفارشات اکانت
                        </p>
                        <div class="font-14 dark-gray">
                            سرویس:
                            <span class="semi">{{ $account->service->title ?? '—' }}</span>
                            @if($account->account_identifier)
                                <span class="mx-2 light-gray">|</span>
                                شناسه:
                                <span class="semi" dir="ltr">{{ $account->account_identifier }}</span>
                            @endif
                        </div>
                    </div>
                    <div class="table-responsive p-2 pb-0 order-table">
                        <table class="w-100">
                            <thead>
                            <tr>
                                <th class="text-start p-2 font-13 medium-gray">#</th>
                                <th class="text-center p-2 font-13 medium-gray">نوع خرید</th>
                                <th class="text-center p-2 font-13 medium-gray">مبلغ</th>
                                <th class="text-center p-2 font-13 medium-gray">وضعیت</th>
                                <th class="text-center p-2 font-13 medium-gray">تاریخ</th>
                                <th class="text-end p-2 font-13 medium-gray">فاکتور</th>
                            </tr>
                            </thead>
                            <tbody>
                            @forelse($account->orders as $number => $recentOrder)
                                @php
                                    $statusData = $recentOrder->getStatusData();
                                @endphp
                                <tr class="bg-body">
                                    <td class="p-3 font-13">{{ $recentOrder->convertToPersian($number + 1) }}</td>
                                    <td class="text-center p-3 font-13">{{ $recentOrder->getOrderTypeFarsi() }}</td>
                                    <td class="text-center p-3 font-13">{{ $recentOrder->getFormattedPriceFa() }}</td>
                                    <td class="text-center p-3 font-12 {{ $statusData['class'] }}">
                                        {{ $statusData['label'] }}
                                    </td>
                                    <td class="text-center p-3 font-13">{{ $recentOrder->getJalaliCreatedAtAttribute('Y/m/d') }}</td>
                                    <td class="p-3">
                                        <a class="text-end justify-content-end align-items-center d-flex font-12 mint-green"
                                           href="{{ route('panel.order.factor', $recentOrder->id) }}">
                                            مشاهده
                                            <img width="7" class="ms-1"
                                                 src="{{ asset('assets/site/img/article-more.svg') }}" alt="">
                                        </a>
                                    </td>
                                </tr>
                            @empty
                                <tr>
                                    <td colspan="6" class="text-center p-5">
                                        <p class="font-14 medium-gray mb-0">برای این اکانت هنوز سفارشی ثبت نشده است.</p>
                                    </td>
                                </tr>
                            @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection