@extends('layouts.app', ['title' => 'لوحة التحكم'])

@section('content')
    <div class="page-header page-header-glass">
        <div>
            <h1 class="page-title">لوحة التحكم التنفيذية</h1>
            <p class="muted">نظرة شاملة على الأداء المالي، التحصيل، الضرائب، وجودة البيانات.</p>
        </div>
        <div class="actions">
            <a href="{{ route('trips.create') }}" class="btn btn-primary">رحلة جديدة</a>
            <a href="{{ route('reports.overview') }}" class="btn btn-secondary">عرض التقارير</a>
            <a href="{{ route('exports.trips', request()->query()) }}" class="btn btn-success">تصدير البيانات</a>
        </div>
    </div>

    <div class="card kpi-hero-card">
        <div class="kpi-hero-grid">
            <div class="kpi-hero-metric">
                <div class="kpi-title">مؤشر الصحة التشغيلية</div>
                <div class="kpi-big">{{ number_format($score, 1) }}%</div>
                <div class="kpi-sub">مبني على هامش الربح + التحصيل - مشاكل البيانات</div>
            </div>
            <div class="kpi-hero-metric">
                <div class="kpi-title">هامش الربح</div>
                <div class="kpi-big">{{ number_format($marginPercent, 1) }}%</div>
                <div class="kpi-sub">{{ number_format((float)($totals->total_profit ?? 0), 2) }} / {{ number_format((float)($totals->total_revenue ?? 0), 2) }}</div>
            </div>
            <div class="kpi-hero-metric">
                <div class="kpi-title">معدل التحصيل</div>
                <div class="kpi-big">{{ number_format($collectionRatePercent, 1) }}%</div>
                <div class="kpi-sub">{{ number_format((float)($collectionKpis->paid_amount ?? 0), 2) }} من {{ number_format((float)($collectionKpis->billed_amount ?? 0), 2) }}</div>
            </div>
            <div class="kpi-hero-metric">
                <div class="kpi-title">أفضل شركة</div>
                <div class="kpi-big kpi-big-small">{{ $bestCompany?->company_name ?? 'لا يوجد' }}</div>
                <div class="kpi-sub">صافي الربح: {{ number_format((float)($bestCompany->total_net_profit ?? 0), 2) }}</div>
            </div>
        </div>

        @if($comparison['has_range'])
            <div class="kpi-chips-row">
                <div class="kpi-chip">تغير الربح: {{ $comparison['profit_growth'] === null ? 'جديد' : number_format($comparison['profit_growth'], 1).'%' }}</div>
                <div class="kpi-chip">تغير الإيراد: {{ $comparison['revenue_growth'] === null ? 'جديد' : number_format($comparison['revenue_growth'], 1).'%' }}</div>
                <div class="kpi-chip">تغير عدد الرحلات: {{ $comparison['trips_growth'] === null ? 'جديد' : number_format($comparison['trips_growth'], 1).'%' }}</div>
            </div>
        @endif
    </div>

    <div class="card">
        <form method="GET" action="{{ route('dashboard') }}" class="filters-form">
            <div class="form-group">
                <label>بحث</label>
                <input type="text" name="search" value="{{ $filters['search'] ?? '' }}" placeholder="السائق، الشركة، المصنع...">
            </div>
            <div class="form-group">
                <label>السائق</label>
                <select name="driver_id">
                    <option value="">كل السائقين</option>
                    @foreach($drivers as $driver)
                        <option value="{{ $driver->id }}" @selected(($filters['driver_id'] ?? '') == $driver->id)>{{ $driver->name }}</option>
                    @endforeach
                </select>
            </div>
            <div class="form-group">
                <label>الشركة</label>
                <select name="company_name">
                    <option value="">كل الشركات</option>
                    @foreach($companies as $company)
                        <option value="{{ $company }}" @selected(($filters['company_name'] ?? '') === $company)>{{ $company }}</option>
                    @endforeach
                </select>
            </div>
            <div class="form-group">
                <label>نوع النقل</label>
                <select name="transport_type">
                    <option value="">كل الأنواع</option>
                    @foreach($transportTypes as $transportType)
                        <option value="{{ $transportType }}" @selected(($filters['transport_type'] ?? '') === $transportType)>{{ $transportType }}</option>
                    @endforeach
                </select>
            </div>
            <div class="form-group">
                <label>فلتر التاريخ</label>
                <select name="date_filter">
                    <option value="">كل الفترات</option>
                    <option value="today" @selected(($filters['date_filter'] ?? '') === 'today')>اليوم</option>
                    <option value="month" @selected(($filters['date_filter'] ?? '') === 'month')>هذا الشهر</option>
                    <option value="custom" @selected(($filters['date_filter'] ?? '') === 'custom')>فترة مخصصة</option>
                </select>
            </div>
            <div class="actions">
                <button class="btn btn-primary" type="submit">تطبيق</button>
                <a class="btn btn-secondary" href="{{ route('dashboard') }}">إعادة تعيين</a>
            </div>
            <div class="form-group">
                <label>من</label>
                <input type="date" name="date_from" value="{{ $filters['date_from'] ?? '' }}">
            </div>
            <div class="form-group">
                <label>إلى</label>
                <input type="date" name="date_to" value="{{ $filters['date_to'] ?? '' }}">
            </div>
        </form>
    </div>

    <div class="kpi-grid">
        <div class="kpi-card"><div class="kpi-title">إجمالي الإيراد</div><div class="kpi-value">{{ number_format((float)($totals->total_revenue ?? 0), 2) }}</div></div>
        <div class="kpi-card"><div class="kpi-title">إجمالي التكلفة</div><div class="kpi-value">{{ number_format((float)($totals->total_cost ?? 0), 2) }}</div></div>
        <div class="kpi-card"><div class="kpi-title">إجمالي الربح</div><div class="kpi-value">{{ number_format((float)($totals->total_profit ?? 0), 2) }}</div></div>
        <div class="kpi-card"><div class="kpi-title">صافي الربح بعد الضريبة</div><div class="kpi-value">{{ number_format((float)($taxKpis->net_profit_after_tax ?? 0), 2) }}</div></div>
        <div class="kpi-card"><div class="kpi-title">متوسط قيمة الرحلة</div><div class="kpi-value">{{ number_format((float)($opsKpis->avg_ticket ?? 0), 2) }}</div></div>
        <div class="kpi-card"><div class="kpi-title">متوسط ربح الرحلة</div><div class="kpi-value">{{ number_format((float)($opsKpis->avg_profit_per_trip ?? 0), 2) }}</div></div>
        <div class="kpi-card"><div class="kpi-title">إجمالي الرحلات</div><div class="kpi-value">{{ number_format((float)($totals->total_trips ?? 0)) }}</div></div>
        <div class="kpi-card"><div class="kpi-title">إجمالي الكمية</div><div class="kpi-value">{{ number_format((float)($totals->total_quantity ?? 0), 2) }}</div></div>
        <div class="kpi-card"><div class="kpi-title">رحلات رابحة</div><div class="kpi-value">{{ number_format((float)($opsKpis->profitable_trips ?? 0)) }}</div></div>
        <div class="kpi-card"><div class="kpi-title">رحلات خاسرة</div><div class="kpi-value">{{ number_format((float)($opsKpis->loss_trips ?? 0)) }}</div></div>
        <div class="kpi-card"><div class="kpi-title">ضريبة السعر</div><div class="kpi-value">{{ number_format((float)($taxKpis->total_tax ?? 0), 2) }}</div></div>
        <div class="kpi-card"><div class="kpi-title">خصم 1%</div><div class="kpi-value">{{ number_format((float)($taxKpis->total_one_percent ?? 0), 2) }}</div></div>
        <div class="kpi-card"><div class="kpi-title">المحصل</div><div class="kpi-value">{{ number_format((float)($collectionKpis->paid_amount ?? 0), 2) }}</div></div>
        <div class="kpi-card"><div class="kpi-title">تحت التحصيل</div><div class="kpi-value">{{ number_format((float)($collectionKpis->checks_under_collection ?? 0), 2) }}</div></div>
        <div class="kpi-card"><div class="kpi-title">رصيد مستحق</div><div class="kpi-value">{{ number_format((float)($collectionKpis->outstanding_amount ?? 0), 2) }}</div></div>
        <div class="kpi-card"><div class="kpi-title">نواقص بيانات</div><div class="kpi-value">{{ number_format((float)(($qualityKpis->missing_invoice_date ?? 0) + ($qualityKpis->missing_receipt_date ?? 0) + ($qualityKpis->missing_tax_invoice ?? 0))) }}</div></div>
    </div>

    <div class="grid grid-2">
        <div class="card card-elevated">
            <h3 class="section-title">تطور الربح عبر الوقت</h3>
            <canvas id="profitChart" class="chart-box"></canvas>
        </div>

        <div class="card card-elevated">
            <h3 class="section-title">أبرز الأسماء</h3>
            <div class="insight-list">
                <div class="insight-item">
                    <span class="insight-label">أفضل سائق</span>
                    <span class="insight-value">{{ $bestDriver?->driver?->name ?? 'لا يوجد' }}</span>
                    <span class="insight-sub">{{ number_format((float)($bestDriver->total_profit ?? 0), 2) }}</span>
                </div>
                <div class="insight-item">
                    <span class="insight-label">أفضل شركة</span>
                    <span class="insight-value">{{ $bestCompany?->company_name ?? 'لا يوجد' }}</span>
                    <span class="insight-sub">{{ number_format((float)($bestCompany->total_net_profit ?? 0), 2) }}</span>
                </div>
                <div class="insight-item">
                    <span class="insight-label">فواتير بدون تاريخ</span>
                    <span class="insight-value">{{ number_format((float)($qualityKpis->missing_invoice_date ?? 0)) }}</span>
                </div>
                <div class="insight-item">
                    <span class="insight-label">إيصالات بدون تاريخ</span>
                    <span class="insight-value">{{ number_format((float)($qualityKpis->missing_receipt_date ?? 0)) }}</span>
                </div>
            </div>
        </div>
    </div>

    <div class="grid grid-2">
        <div class="card card-elevated">
            <h3 class="section-title">تنبيهات التحصيل (أعلى رصيد مستحق)</h3>
            <div class="table-wrap report-table-wrap">
                <table class="report-table">
                    <thead>
                    <tr>
                        <th>الشركة</th>
                        <th>إجمالي مفوتر</th>
                        <th>الرصيد المستحق</th>
                    </tr>
                    </thead>
                    <tbody>
                    @forelse($riskCompanies as $row)
                        <tr>
                            <td>{{ $row->company_name }}</td>
                            <td>{{ number_format((float)$row->billed_amount, 2) }}</td>
                            <td>{{ number_format((float)$row->outstanding_amount, 2) }}</td>
                        </tr>
                    @empty
                        <tr><td colspan="3">لا توجد أرصدة مستحقة ضمن الفلتر الحالي.</td></tr>
                    @endforelse
                    </tbody>
                </table>
            </div>
        </div>

        <div class="card card-elevated">
            <h3 class="section-title">آخر الرحلات</h3>
            <div class="table-wrap report-table-wrap">
                <table class="report-table">
                    <thead>
                    <tr>
                        <th>التاريخ</th>
                        <th>الشركة</th>
                        <th>المصنع</th>
                        <th>الإيراد</th>
                        <th>الربح</th>
                    </tr>
                    </thead>
                    <tbody>
                    @forelse($latestTrips as $trip)
                        <tr>
                            <td>{{ $trip->created_at?->format('Y-m-d') }}</td>
                            <td>{{ $trip->company_name }}</td>
                            <td>{{ $trip->factory_name ?: '-' }}</td>
                            <td>{{ number_format((float)$trip->total_revenue, 2) }}</td>
                            <td>{{ number_format((float)$trip->profit, 2) }}</td>
                        </tr>
                    @empty
                        <tr><td colspan="5">لا توجد رحلات.</td></tr>
                    @endforelse
                    </tbody>
                </table>
            </div>
        </div>
    </div>

    <div class="grid grid-2">
        <div class="card card-elevated">
            <h3 class="section-title">إحصائيات السائقين</h3>
            <div class="table-wrap report-table-wrap">
                <table class="report-table">
                    <thead>
                    <tr>
                        <th>السائق</th>
                        <th>الرحلات</th>
                        <th>الكمية</th>
                        <th>الإيراد</th>
                        <th>أرباح السائق</th>
                        <th>الربح</th>
                    </tr>
                    </thead>
                    <tbody>
                    @forelse($driverStats as $row)
                        <tr>
                            <td>{{ $row->driver?->name ?? '-' }}</td>
                            <td>{{ number_format((float)$row->total_trips) }}</td>
                            <td>{{ number_format((float)$row->total_quantity, 2) }}</td>
                            <td>{{ number_format((float)$row->total_revenue, 2) }}</td>
                            <td>{{ number_format((float)$row->total_driver_earnings, 2) }}</td>
                            <td>{{ number_format((float)$row->total_profit, 2) }}</td>
                        </tr>
                    @empty
                        <tr><td colspan="6">لا توجد بيانات.</td></tr>
                    @endforelse
                    </tbody>
                </table>
            </div>
        </div>

        <div class="card card-elevated">
            <h3 class="section-title">إحصائيات الشركات</h3>
            <div class="table-wrap report-table-wrap">
                <table class="report-table">
                    <thead>
                    <tr>
                        <th>الشركة</th>
                        <th>عدد العمليات</th>
                        <th>الإيراد</th>
                        <th>الربح</th>
                        <th>المستحق</th>
                    </tr>
                    </thead>
                    <tbody>
                    @forelse($companyStats as $row)
                        <tr>
                            <td>{{ $row->company_name }}</td>
                            <td>{{ number_format((float)$row->total_transactions) }}</td>
                            <td>{{ number_format((float)$row->total_revenue, 2) }}</td>
                            <td>{{ number_format((float)$row->total_profit, 2) }}</td>
                            <td>{{ number_format((float)$row->outstanding_amount, 2) }}</td>
                        </tr>
                    @empty
                        <tr><td colspan="5">لا توجد بيانات.</td></tr>
                    @endforelse
                    </tbody>
                </table>
            </div>
        </div>
    </div>

    <script>
        (() => {
            const labels = @json($chartLabels);
            const values = @json($chartValues);
            const canvas = document.getElementById('profitChart');
            if (!canvas || labels.length === 0) return;

            const ctx = canvas.getContext('2d');
            const ratio = window.devicePixelRatio || 1;
            const width = canvas.clientWidth;
            const height = canvas.clientHeight;
            canvas.width = width * ratio;
            canvas.height = height * ratio;
            ctx.scale(ratio, ratio);

            const padding = 28;
            const maxValue = Math.max(...values, 1);
            const minValue = Math.min(...values, 0);
            const range = maxValue - minValue || 1;

            ctx.clearRect(0, 0, width, height);
            const gradient = ctx.createLinearGradient(0, 0, 0, height);
            gradient.addColorStop(0, 'rgba(14,116,144,0.35)');
            gradient.addColorStop(1, 'rgba(14,116,144,0.02)');

            ctx.beginPath();
            values.forEach((value, index) => {
                const x = padding + (index * ((width - (padding * 2)) / Math.max(values.length - 1, 1)));
                const y = height - padding - (((value - minValue) / range) * (height - (padding * 2)));
                if (index === 0) ctx.moveTo(x, y);
                else ctx.lineTo(x, y);
            });

            ctx.strokeStyle = '#0e7490';
            ctx.lineWidth = 2;
            ctx.stroke();

            ctx.lineTo(width - padding, height - padding);
            ctx.lineTo(padding, height - padding);
            ctx.closePath();
            ctx.fillStyle = gradient;
            ctx.fill();

            values.forEach((value, index) => {
                const x = padding + (index * ((width - (padding * 2)) / Math.max(values.length - 1, 1)));
                const y = height - padding - (((value - minValue) / range) * (height - (padding * 2)));
                ctx.fillStyle = value >= 0 ? '#0f766e' : '#b91c1c';
                ctx.beginPath();
                ctx.arc(x, y, 3, 0, Math.PI * 2);
                ctx.fill();
            });
        })();
    </script>
@endsection