@extends('admin.layouts.index', ['without_card' => true])

@section('content')
    @php        
        $operationCards = [
            ['title' => 'متوسط زمن الاستجابة', 'value' => $statistics['operation']['avg_response_time'], 'icon' => 'i-Clock'],
            ['title' => 'معدل إنجاز العمليات', 'value' => $statistics['operation']['completion_rate'].'%', 'icon' => 'i-Yes'],
            ['title' => 'متوسط مدة التوصيل', 'value' => $statistics['operation']['avg_delivery_duration'], 'icon' => 'i-Scooter'],
            ['title' => 'عدد العملاء الذين تم خدمتهم', 'value' => number_format($statistics['operation']['served_customers']), 'icon' => 'i-Add-User'],
            ['title' => 'الطلبات المكتملة/المغلقة', 'value' => number_format($statistics['operation']['closed_orders']), 'icon' => 'i-Checkout-Basket'],
            ['title' => 'الطلبات المرفوضة أو الملغاة', 'value' => number_format($statistics['operation']['failed_orders']), 'icon' => 'i-Close'],
            ['title' => 'معدل تحويل الطلبات', 'value' => $statistics['operation']['conversion_rate'].'%', 'icon' => 'i-Line-Chart'],
            ['title' => 'نجاح تهيئة العملاء الجدد', 'value' => $statistics['operation']['onboarding_success_rate'].'%', 'icon' => 'i-Checked-User'],
        ];

        $customerCards = [
            ['title' => 'عدد شكاوى العملاء', 'value' => number_format($statistics['customer']['complaints']), 'icon' => 'i-Speach-Bubble-3'],
            ['title' => 'معدل الاحتفاظ بالعملاء', 'value' => $statistics['customer']['retention_rate'].'%', 'icon' => 'i-Repeat-3'],
            ['title' => 'متوسط قيمة سلة العميل', 'value' => number_format($statistics['customer']['avg_basket'], 2).' ر.س', 'icon' => 'i-Shopping-Cart'],
            ['title' => 'نسبة طلبات الموظفين', 'value' => $statistics['customer']['employee_orders_rate'].'%', 'icon' => 'i-Business-ManWoman'],
            ['title' => 'نسبة طلبات نزلاء الفنادق', 'value' => $statistics['customer']['hotel_guest_orders_rate'].'%', 'icon' => 'i-Hotel'],
        ];

        $financialCards = [
            ['title' => 'إجمالي الإيرادات المحققة', 'value' => number_format($statistics['financial']['total_revenue'], 2).' ر.س', 'icon' => 'i-Financial'],
            ['title' => 'إيرادات الخدمات الرقمية', 'value' => number_format($statistics['financial']['digital_services_revenue'], 2).' ر.س', 'icon' => 'i-Money-2'],
            ['title' => 'تكلفة التشغيل لكل معاملة', 'value' => number_format($statistics['financial']['operation_cost_per_transaction'], 2).' ر.س', 'icon' => 'i-Receipt-4'],
        ];
    @endphp

    <script>
        window.adminHomeCharts = @json($statistics['charts']);
    </script>

    {{-- <div class="card mb-4">
        <div class="card-body">
            <form class="row align-items-end" method="GET" action="{{ route('admin.home') }}">
                <div class="col-lg-4 col-md-6 col-12 form-group mb-lg-0">
                    <label>تاريخ البداية</label>
                    <input type="text" name="start_date" class="form-control flatpickr ltr" value="{{ $filters['start_date']->format('Y-m-d') }}">
                </div>
                <div class="col-lg-4 col-md-6 col-12 form-group mb-lg-0">
                    <label>تاريخ النهاية</label>
                    <input type="text" name="end_date" class="form-control flatpickr ltr" value="{{ $filters['end_date']->format('Y-m-d') }}">
                </div>
                <div class="col-lg-4 col-12 form-group mb-0">
                    <button class="btn btn-primary">
                        <i class="i-Filter-2"></i>
                        عرض النتائج
                    </button>
                    <a href="{{ route('admin.home') }}" class="btn btn-outline-secondary">
                        <i class="i-Restore-Window"></i>
                        إعادة ضبط
                    </a>
                </div>
            </form>
        </div>
    </div>

    <h4 class="mb-3">أداء التشغيل</h4>
    <div class="row mb-4 justify-content-center">
        @foreach ($operationCards as $card)
            <div class="col-xl-3 col-lg-4 col-md-6 col-12 mb-3">
                <div class="card card-icon-bg card-icon-bg-dark o-hidden h-100 text-center">
                    <div class="card-body">
                        <i class="{{ $card['icon'] }}"></i>
                        <div class="content">
                            <p class="text-muted mt-2 mb-0">{{ $card['title'] }}</p>
                            <p class="text-primary text-24 line-height-1 mb-2">{{ $card['value'] }}</p>
                        </div>
                    </div>
                </div>
            </div>
        @endforeach
    </div>

    <div class="row mb-4">
        <div class="col-lg-6 mb-4">
            <div class="card h-100">
                <div class="card-body">
                    <h5 class="mb-3">حالة الطلبات</h5>
                    <canvas id="admin-orders-status-chart" height="220"></canvas>
                </div>
            </div>
        </div>
        <div class="col-lg-6 mb-4">
            <div class="card h-100">
                <div class="card-body">
                    <h5 class="mb-3">الأقسام حسب عدد الطلبات</h5>
                    <canvas id="admin-sections-chart" height="220"></canvas>
                </div>
            </div>
        </div>
    </div>

    <div class="row mb-4">
        <div class="col-lg-6 mb-4">
            <div class="card h-100">
                <div class="card-body">
                    <h5 class="mb-3">قنوات الطلب</h5>
                    <div class="row mb-3">
                        <div class="col-6">
                            <p class="text-muted mb-1">الطلب الذاتي (اطلب واستلم)</p>
                            <h4 class="text-primary">{{ $statistics['channels']['self_orders_rate'] }}%</h4>
                        </div>
                        <div class="col-6">
                            <p class="text-muted mb-1">طلبات التوصيل</p>
                            <h4 class="text-primary">{{ $statistics['channels']['delivery_orders_rate'] }}%</h4>
                        </div>
                    </div>
                    <canvas id="admin-channels-chart" height="220"></canvas>
                </div>
            </div>
        </div>
        <div class="col-lg-6 mb-4">
            <div class="card h-100">
                <div class="card-body">
                    <h5 class="mb-3">المدفوعات</h5>
                    <div class="row mb-3">
                        <div class="col-6">
                            <p class="text-muted mb-1">الدفع الإلكتروني</p>
                            <h4 class="text-primary">{{ $statistics['payments']['e_payment_rate'] }}%</h4>
                        </div>
                        <div class="col-6">
                            <p class="text-muted mb-1">الدفع النقدي (الكاش)</p>
                            <h4 class="text-primary">{{ $statistics['payments']['cash_rate'] }}%</h4>
                        </div>
                    </div>
                    <canvas id="admin-payments-chart" height="220"></canvas>
                </div>
            </div>
        </div>
    </div>

    <h4 class="mb-3">تجربة العملاء</h4>
    <div class="row mb-4 justify-content-center">
        @foreach ($customerCards as $card)
            <div class="col-xl-3 col-lg-4 col-md-6 col-12 mb-3">
                <div class="card card-icon-bg card-icon-bg-dark o-hidden h-100 text-center">
                    <div class="card-body">
                        <i class="{{ $card['icon'] }}"></i>
                        <div class="content">
                            <p class="text-muted mt-2 mb-0">{{ $card['title'] }}</p>
                            <p class="text-primary text-24 line-height-1 mb-2">{{ $card['value'] }}</p>
                        </div>
                    </div>
                </div>
            </div>
        @endforeach
    </div>

    <h4 class="mb-3">الأداء المالي</h4>
    <div class="row mb-4 justify-content-center">
        @foreach ($financialCards as $card)
            <div class="col-lg-4 col-md-6 col-12 mb-3">
                <div class="card card-icon-bg card-icon-bg-dark o-hidden h-100 text-center">
                    <div class="card-body">
                        <i class="{{ $card['icon'] }}"></i>
                        <div class="content">
                            <p class="text-muted mt-2 mb-0">{{ $card['title'] }}</p>
                            <p class="text-primary text-24 line-height-1 mb-2">{{ $card['value'] }}</p>
                        </div>
                    </div>
                </div>
            </div>
        @endforeach
    </div>

    <div class="row mb-4">
        <div class="col-lg-6 mb-4">
            <div class="card h-100">
                <div class="card-body">
                    <h4 class="mb-3">أداء مندوبي التوصيل</h4>
                    <div class="table-responsive">
                        <table class="table table-striped table-hover mb-0">
                            <thead>
                                <tr>
                                    <th>المندوب</th>
                                    <th>عمليات التوصيل المنجزة</th>
                                    <th>الإنتاجية</th>
                                    <th>متوسط مدة التوصيل</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse ($statistics['captains'] as $captain)
                                    <tr>
                                        <td>{{ $captain['name'] }}</td>
                                        <td>{{ number_format($captain['completed_deliveries']) }}</td>
                                        <td>{{ number_format($captain['productivity']) }}</td>
                                        <td>{{ $captain['avg_delivery_duration'] }}</td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="4" class="text-center text-muted">لا توجد بيانات خلال الفترة المحددة</td>
                                    </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-6 mb-4">
            <div class="card h-100">
                <div class="card-body">
                    <h4 class="mb-3">أداء المطاعم والمقاهي والمتاجر</h4>
                    <div class="table-responsive">
                        <table class="table table-striped table-hover mb-0">
                            <thead>
                                <tr>
                                    <th>الجهة</th>
                                    <th>مكتملة</th>
                                    <th>مرفوضة/ملغاة</th>
                                    <th>التحويل</th>
                                    <th>POS</th>
                                    <th>الأعلى طلبًا</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse ($statistics['stores'] as $store)
                                    <tr>
                                        <td>{{ $store['title'] }}</td>
                                        <td>{{ number_format($store['completed_orders']) }}</td>
                                        <td>{{ number_format($store['failed_orders']) }}</td>
                                        <td>{{ $store['conversion_rate'] }}%</td>
                                        <td>{{ number_format($store['pos_orders']) }}</td>
                                        <td>{{ number_format($store['total_orders']) }}</td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="6" class="text-center text-muted">لا توجد بيانات خلال الفترة المحددة</td>
                                    </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div> --}}

@endsection