<x-filament-panels::page>
    {{ $this->form }}

    <h2 class="text-base font-semibold text-gray-900 dark:text-gray-100 mt-6">
        {{ __('dberp.resources.sales_analysis.section_summary') }}
    </h2>
    <div class="mt-3 grid gap-3 sm:grid-cols-2 lg:grid-cols-4 xl:grid-cols-5">
        @foreach ([
            ['k' => 'order_count', 'label' => __('dberp.resources.sales_analysis.card_order_count')],
            ['k' => 'final_amount', 'label' => __('dberp.resources.sales_analysis.card_final_amount')],
            ['k' => 'receivable_amount', 'label' => __('dberp.resources.sales_analysis.card_receivable')],
            ['k' => 'received_amount', 'label' => __('dberp.resources.sales_analysis.card_received')],
            ['k' => 'unreceived_amount', 'label' => __('dberp.resources.sales_analysis.card_unreceived')],
            ['k' => 'total_quantity', 'label' => __('dberp.resources.sales_analysis.card_total_qty')],
            ['k' => 'confirmed_order_count', 'label' => __('dberp.resources.sales_analysis.card_confirmed')],
            ['k' => 'partial_shipped_order_count', 'label' => __('dberp.resources.sales_analysis.card_partial_ship')],
            ['k' => 'fully_shipped_order_count', 'label' => __('dberp.resources.sales_analysis.card_full_ship')],
        ] as $card)
            <div class="rounded-xl border border-gray-200 bg-white p-3 shadow-sm dark:border-gray-700 dark:bg-gray-900">
                <div class="text-xs text-gray-500 dark:text-gray-400">{{ $card['label'] }}</div>
                <div class="mt-1 text-lg font-semibold text-gray-900 dark:text-gray-100">
                    {{ $this->dberpFormatReportScalar($card['k'], $this->summary[$card['k']] ?? null) }}
                </div>
            </div>
        @endforeach
    </div>

    <h2 class="text-base font-semibold text-gray-900 dark:text-gray-100 mt-8">
        {{ __('dberp.resources.sales_analysis.section_trend') }}
    </h2>
    <div class="mt-3 overflow-hidden rounded-xl border border-gray-200 bg-white shadow-sm dark:border-gray-700 dark:bg-gray-900">
        <div class="overflow-x-auto">
            <table class="min-w-full divide-y divide-gray-200 text-sm dark:divide-gray-700">
                <thead class="bg-gray-50 text-left text-gray-600 dark:bg-gray-800 dark:text-gray-300">
                    <tr>
                        <th class="px-4 py-2 font-medium">{{ __('dberp.resources.sales_analysis.trend_date') }}</th>
                        <th class="px-4 py-2 font-medium">{{ __('dberp.resources.sales_analysis.trend_orders') }}</th>
                        <th class="px-4 py-2 font-medium">{{ __('dberp.resources.sales_analysis.trend_amount') }}</th>
                    </tr>
                </thead>
                <tbody class="divide-y divide-gray-100 dark:divide-gray-800">
                    @forelse ($this->trend as $row)
                        <tr>
                            <td class="px-4 py-2">{{ $row['date'] }}</td>
                            <td class="px-4 py-2">{{ $row['order_count'] }}</td>
                            <td class="px-4 py-2">{{ $this->dberpFormatReportScalar('amount', $row['amount'] ?? null) }}</td>
                        </tr>
                    @empty
                        <tr>
                            <td colspan="3" class="px-4 py-6 text-center text-gray-500">{{ __('dberp.resources.sales_analysis.empty_trend') }}</td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>
    </div>

    <div class="mt-8 grid gap-6 lg:grid-cols-2">
        <div>
            <h2 class="text-base font-semibold text-gray-900 dark:text-gray-100">
                {{ __('dberp.resources.sales_analysis.section_customer') }}
            </h2>
            <div class="mt-3 overflow-hidden rounded-xl border border-gray-200 bg-white shadow-sm dark:border-gray-700 dark:bg-gray-900">
                <table class="min-w-full divide-y divide-gray-200 text-sm dark:divide-gray-700">
                    <thead class="bg-gray-50 text-left text-gray-600 dark:bg-gray-800 dark:text-gray-300">
                        <tr>
                            <th class="px-3 py-2 font-medium">{{ __('dberp.resources.sales_analysis.col_name') }}</th>
                            <th class="px-3 py-2 font-medium">{{ __('dberp.resources.sales_analysis.col_amount') }}</th>
                            <th class="px-3 py-2 font-medium">{{ __('dberp.resources.sales_analysis.col_orders') }}</th>
                        </tr>
                    </thead>
                    <tbody class="divide-y divide-gray-100 dark:divide-gray-800">
                        @forelse ($this->topCustomers as $row)
                            <tr>
                                <td class="px-3 py-2">{{ $row['name'] }}</td>
                                <td class="px-3 py-2">{{ $this->dberpFormatReportScalar('amount', $row['amount'] ?? null) }}</td>
                                <td class="px-3 py-2">{{ $row['order_count'] }}</td>
                            </tr>
                        @empty
                            <tr>
                                <td colspan="3" class="px-3 py-4 text-center text-gray-500">{{ __('dberp.resources.sales_analysis.empty_structure') }}</td>
                            </tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
        </div>
        <div>
            <h2 class="text-base font-semibold text-gray-900 dark:text-gray-100">
                {{ __('dberp.resources.sales_analysis.section_product') }}
            </h2>
            <div class="mt-3 overflow-hidden rounded-xl border border-gray-200 bg-white shadow-sm dark:border-gray-700 dark:bg-gray-900">
                <table class="min-w-full divide-y divide-gray-200 text-sm dark:divide-gray-700">
                    <thead class="bg-gray-50 text-left text-gray-600 dark:bg-gray-800 dark:text-gray-300">
                        <tr>
                            <th class="px-3 py-2 font-medium">{{ __('dberp.resources.sales_analysis.col_name') }}</th>
                            <th class="px-3 py-2 font-medium">{{ __('dberp.resources.sales_analysis.col_amount') }}</th>
                            <th class="px-3 py-2 font-medium">{{ __('dberp.resources.sales_analysis.col_qty') }}</th>
                        </tr>
                    </thead>
                    <tbody class="divide-y divide-gray-100 dark:divide-gray-800">
                        @forelse ($this->topProducts as $row)
                            <tr>
                                <td class="px-3 py-2">{{ $row['name'] }}</td>
                                <td class="px-3 py-2">{{ $this->dberpFormatReportScalar('amount', $row['amount'] ?? null) }}</td>
                                <td class="px-3 py-2">{{ $this->dberpFormatReportScalar('quantity', $row['quantity'] ?? null) }}</td>
                            </tr>
                        @empty
                            <tr>
                                <td colspan="3" class="px-3 py-4 text-center text-gray-500">{{ __('dberp.resources.sales_analysis.empty_structure') }}</td>
                            </tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</x-filament-panels::page>
