@extends('admin.layouts.master')
@section('title', 'قمع المبيعات')

@push('styles')
<style>
.funnel-stage { padding: 20px; text-align: center; color: white; margin-bottom:4px; border-radius:8px; position:relative; }
.funnel-stage h3 { margin:0; font-size: 2rem; }
.funnel-stage .label { font-size: 0.95rem; opacity: 0.9; }
.conv-rate { background:rgba(255,255,255,0.25); padding:3px 12px; border-radius:20px; font-size:0.85rem; display:inline-block; margin-top:8px; }
</style>
@endpush

@section('page-header')
@include('admin.reports._header', [
    'title' => 'قمع المبيعات (Sales Funnel)',
    'subtitle' => 'رحلة العميل من الاستفسار الأول حتى التحصيل النهائي',
    'icon' => 'ti-filter',
    'color' => 'info',
])
@endsection

@section('content')
@include('admin.reports._filters', ['from'=>$from, 'to'=>$to, 'showCompare'=>false])

<div class="alert alert-info mb-3">
    <i class="ti ti-info-circle ms-1"></i>
    <strong>قيمة هذا التقرير:</strong>
    يوضح رحلة العميل من الاستفسار الأول حتى استلام النقدية. كل تسريب يكلف المصنع مالاً وفرصاً ضائعة.
</div>

<div class="row">
    <div class="col-lg-7">
        <div class="card"><div class="card-body">
            <h3>مراحل قمع المبيعات</h3>

            <div class="funnel-stage" style="background:#0d6efd;width:100%">
                <div class="label">عروض أسعار صادرة</div>
                <h3>{{ $totalQuotations }}</h3>
            </div>
            <div class="text-center my-1"><i class="ti ti-chevron-down fs-2 text-muted"></i>
                <span class="badge bg-primary-lt">معدل الإرسال: {{ $conversionRates['quote_to_sent'] }}%</span>
            </div>

            <div class="funnel-stage" style="background:#0dcaf0;width:90%;margin:auto">
                <div class="label">عروض مرسلة للعميل</div>
                <h3>{{ $sentQuotations }}</h3>
            </div>
            <div class="text-center my-1"><i class="ti ti-chevron-down fs-2 text-muted"></i>
                <span class="badge bg-info-lt">معدل الموافقة: {{ $conversionRates['sent_to_approved'] }}%</span>
            </div>

            <div class="funnel-stage" style="background:#198754;width:80%;margin:auto">
                <div class="label">عروض موافق عليها</div>
                <h3>{{ $approvedQuotations }}</h3>
            </div>
            <div class="text-center my-1"><i class="ti ti-chevron-down fs-2 text-muted"></i>
                <span class="badge bg-success-lt">معدل التحويل لطلب: {{ $conversionRates['quote_to_order'] }}%</span>
            </div>

            <div class="funnel-stage" style="background:#fd7e14;width:70%;margin:auto">
                <div class="label">طلبات منفذة</div>
                <h3>{{ $producedOrders }}</h3>
            </div>
            <div class="text-center my-1"><i class="ti ti-chevron-down fs-2 text-muted"></i>
                <span class="badge bg-warning-lt">معدل التسليم: {{ $conversionRates['order_to_delivered'] }}%</span>
            </div>

            <div class="funnel-stage" style="background:#6f42c1;width:60%;margin:auto">
                <div class="label">طلبات مسلَّمة</div>
                <h3>{{ $deliveredOrders }}</h3>
            </div>
            <div class="text-center my-1"><i class="ti ti-chevron-down fs-2 text-muted"></i>
                <span class="badge bg-purple-lt">معدل الفواتير المدفوعة: {{ $conversionRates['invoice_to_paid'] }}%</span>
            </div>

            <div class="funnel-stage" style="background:#dc3545;width:50%;margin:auto">
                <div class="label">فواتير مدفوعة بالكامل</div>
                <h3>{{ $paidInvoices }} / {{ $totalInvoices }}</h3>
            </div>
        </div></div>
    </div>

    <div class="col-lg-5">
        <div class="card mb-3"><div class="card-body">
            <h3>المؤشرات المالية</h3>
            <div class="row text-center">
                <div class="col-6 mb-3"><div class="text-muted">قيمة الفواتير</div>
                    <h2 class="text-primary">{{ number_format($invoiceValue, 0) }}</h2>
                </div>
                <div class="col-6 mb-3"><div class="text-muted">المُحصَّل</div>
                    <h2 class="text-success">{{ number_format($collectedValue, 0) }}</h2>
                </div>
                <div class="col-12"><div class="text-muted">معدل التحصيل</div>
                    <h1 class="@if($conversionRates['collection_rate'] >= 80) text-success @elseif($conversionRates['collection_rate'] >= 60) text-warning @else text-danger @endif">
                        {{ $conversionRates['collection_rate'] }}%
                    </h1>
                </div>
            </div>
        </div></div>

        <div class="card"><div class="card-body">
            <h3>توصيات</h3>
            <ul class="small">
                @if($conversionRates['sent_to_approved'] < 40)
                    <li class="text-danger">⚠️ معدل الموافقة على عروض الأسعار <strong>منخفض ({{ $conversionRates['sent_to_approved'] }}%)</strong> - راجع الأسعار أو طريقة العرض.</li>
                @endif
                @if($conversionRates['order_to_delivered'] < 70)
                    <li class="text-warning">⚠️ معدل تسليم الطلبات <strong>{{ $conversionRates['order_to_delivered'] }}%</strong> - فيه طلبات معلقة تحتاج متابعة.</li>
                @endif
                @if($conversionRates['collection_rate'] < 70)
                    <li class="text-danger">⚠️ معدل التحصيل ضعيف - راجع سياسة الائتمان والمتابعة.</li>
                @endif
                @if($conversionRates['sent_to_approved'] >= 60 && $conversionRates['collection_rate'] >= 80)
                    <li class="text-success">✅ المؤشرات ممتازة! الأداء فوق المتوسط.</li>
                @endif
            </ul>
        </div></div>
    </div>
</div>

<div class="card mt-3">
    <div class="card-header"><h3 class="card-title">ربحية الأنواع</h3></div>
    <div class="table-responsive">
        <table class="table card-table table-vcenter">
            <thead><tr><th>نوع الطباعة</th><th class="text-center">طلبات</th><th class="text-center">وحدات</th><th class="text-end">المبيعات</th><th class="text-end">التكلفة</th><th class="text-end">الربح</th><th class="text-center">الهامش</th></tr></thead>
            <tbody>
                @foreach($byType as $t)
                <tr>
                    <td><strong>{{ $t['type'] }}</strong></td>
                    <td class="text-center">{{ $t['orders'] }}</td>
                    <td class="text-center">{{ number_format($t['units']) }}</td>
                    <td class="text-end text-success">{{ number_format($t['revenue'], 2) }}</td>
                    <td class="text-end">{{ number_format($t['cost'], 2) }}</td>
                    <td class="text-end fw-bold @if($t['profit'] >= 0) text-success @else text-danger @endif">{{ number_format($t['profit'], 2) }}</td>
                    <td class="text-center"><span class="badge bg-{{ $t['margin'] >= 25 ? 'success' : ($t['margin'] >= 10 ? 'warning' : 'danger') }}">{{ $t['margin'] }}%</span></td>
                </tr>
                @endforeach
            </tbody>
        </table>
    </div>
</div>
@endsection