@extends('restaurant.layout')
@section('title', 'ربحية الوجبات')
@php
    $n = fn ($v) => number_format((float) $v, 2);
    $t = $totals;
    $maxProfit = max(1, collect($rows)->max('profit') ?? 1);
@endphp

@section('content')
<div class="hero">
    <div><h2>💰 ربحية الوجبات</h2>
        <p>الفترة: {{ $from }} → {{ $to }} · {{ $branchName }} · المبيعات − تكلفة التحضير = الربح</p></div>
</div>

<div class="card no-print">
    <form method="get" class="filters">
        <div><label>من تاريخ</label><input type="date" name="from" value="{{ $from }}" class="inp"></div>
        <div><label>إلى تاريخ</label><input type="date" name="to" value="{{ $to }}" class="inp"></div>
        <div><label>الفرع</label><select name="branch_id" class="inp"><option value="">كل الفروع</option>@foreach($branches as $b)<option value="{{ $b->id }}" @selected($branchId == $b->id)>{{ $b->name }}</option>@endforeach</select></div>
        <div style="flex:0"><button class="btn navy">عرض التقرير</button></div>
        <div style="flex:0"><a class="btn ghost" href="{{ route('restaurant.reports.profitability') }}">هذا الشهر</a></div>
    </form>
</div>

@if($missingCostCount > 0)
<div class="alert" style="background:var(--warning-soft, #fff3cd);border:1px solid var(--warning, #ffc107);color:#7a5b00">
    ⚠️ يوجد {{ $missingCostCount }} صنف/حجم مباع بدون تكلفة تحضير مُسجّلة، فالربح المحتسب له غير دقيق (يظهر كأن الربح = كامل سعر البيع).
    من فضلك أضف تكلفة التحضير من <a href="{{ route('restaurant.meals.index') }}">قائمة الوجبات</a> → تعديل الوجبة → لكل حجم.
</div>
@endif

<div class="grid g4" style="margin-bottom:14px">
    <div class="stat"><div class="lbl">عدد القطع المباعة</div><div class="val">{{ $t['qty'] }}</div></div>
    <div class="stat"><div class="lbl">إجمالي المبيعات (بدون ضريبة)</div><div class="val num text-blue">{{ $n($t['revenue']) }}</div></div>
    <div class="stat" style="border-color:var(--red)"><div class="lbl">إجمالي تكلفة التحضير</div><div class="val num text-red">{{ $n($t['cost']) }}</div></div>
    <div class="stat hl"><div class="lbl">صافي الربح</div><div class="val num text-green">{{ $n($t['profit']) }}</div><div class="sub">هامش الربح {{ $t['margin'] }}%</div></div>
</div>

<div class="card">
    <div class="card-title">ربحية كل وجبة/حجم خلال الفترة</div>
    <div class="tbl-wrap"><table class="tbl">
        <thead><tr>
            <th>الوجبة</th><th>الحجم</th><th>الكمية المباعة</th><th>تكلفة الحجم</th>
            <th>إجمالي المبيعات</th><th>إجمالي التكلفة</th><th>الربح</th><th>هامش الربح</th>
        </tr></thead>
        <tbody>
        @forelse($rows as $r)
            <tr>
                <td class="fw">{{ $r['name'] }}</td>
                <td>{{ $r['size'] ?: '—' }}</td>
                <td class="num">{{ $r['qty'] }}</td>
                <td class="num {{ $r['has_cost'] ? '' : 'text-red' }}">
                    {{ $r['has_cost'] ? $n($r['unit_cost']) : 'غير محددة' }}
                </td>
                <td class="num">{{ $n($r['revenue']) }}</td>
                <td class="num text-red">{{ $n($r['cost']) }}</td>
                <td class="num fw {{ $r['profit'] < 0 ? 'text-red' : 'text-green' }}">{{ $n($r['profit']) }}</td>
                <td class="num">
                    {{ $r['margin'] }}%
                    <div class="bar" style="margin-top:4px;max-width:100px"><i style="width:{{ max(0, min(100, round($r['profit'] / $maxProfit * 100))) }}%"></i></div>
                </td>
            </tr>
        @empty
            <tr><td colspan="8" class="empty">لا توجد مبيعات وجبات في هذه الفترة</td></tr>
        @endforelse
        </tbody>
        @if(count($rows))
        <tfoot>
            <tr>
                <td colspan="2">الإجمالي</td>
                <td class="num">{{ $t['qty'] }}</td>
                <td></td>
                <td class="num">{{ $n($t['revenue']) }}</td>
                <td class="num">{{ $n($t['cost']) }}</td>
                <td class="num fw">{{ $n($t['profit']) }}</td>
                <td class="num">{{ $t['margin'] }}%</td>
            </tr>
        </tfoot>
        @endif
    </table></div>
</div>

@if(count($rows))
<div class="card no-print">
    <div class="card-title">أعلى الوجبات ربحًا</div>
    <div style="padding:10px"><canvas id="mealsProfitChart" height="110"></canvas></div>
</div>
@endif
@endsection

@push('scripts')
<script src="{{ asset('assets/plugins/chart.js/Chart.bundle.min.js') }}"></script>
<script>
document.addEventListener('DOMContentLoaded', function () {
    var canvas = document.getElementById('mealsProfitChart');
    if (!canvas || typeof Chart === 'undefined') return;

    var topRows = @json(collect($rows)->sortByDesc('profit')->take(8)->values());

    new Chart(canvas.getContext('2d'), {
        type: 'bar',
        data: {
            labels: topRows.map(function (r) { return r.name + (r.size ? ' (' + r.size + ')' : ''); }),
            datasets: [{
                label: 'الربح',
                data: topRows.map(function (r) { return r.profit; }),
                backgroundColor: '#22c55e'
            }]
        },
        options: {
            legend: { display: false },
            scales: { yAxes: [{ ticks: { beginAtZero: true } }] }
        }
    });
});
</script>
@endpush