@extends('layouts.dashboard')

@section('content')
@php
/**
 * Operation Analytics → Sales: what the restaurant took, how it arrived and who
 * handled it — money over time, tenders, order channels, the money clock, and
 * the discounts given away against them.
 *
 * @var array $kpis        headline metrics: ['value', 'spark', 'meta'] per card
 * @var array $revChart @var array $revMeta @var array $tenderChart @var array $tenderMeta
 * @var array $sourceChart @var array $sourceMeta @var array $modeChart @var array $modeMeta
 * @var array $discChart @var array $discMeta @var array $heatChart @var array $heatMeta
 * @var array $mixRows @var array $mixPager @var array $byStaff @var array $staffPager
 * @var array $discRows @var array $discPager
 * @var int $rangeDays @var array $rangeLinks
 */
@endphp
@php /* .qm-d2: the dashboard density standard (app.css §35) */
@endphp
<div class="qm-d2">
<div class="qm-ops-head">
    <div>
        <h2 class="qm-snap-section-title mb-1"><span class="qm-snap-title-bar" aria-hidden="true"></span>{{ t_raw('dashboard.sec.snapshot') }}</h2>
        <p class="qm-ops-sub mb-0">{{ t_raw('vendor.analytics.subtitle_sales') }}</p>
    </div>
    @php /* Period picker and download are one right-aligned action group: the file IS the window
             currently selected, so it belongs beside the control that selects it. The wrapper is
             copied from vendor/staff-analytics.php, the other analytics head that pairs a period
             picker with a button — app.css §.qm-ops-head > .d-flex already lays that shape out at
             every width. The button itself carries the icon and label every other list export uses. */
@endphp
    <div class="d-flex align-items-center gap-2">
        <div class="qm-period" role="group" aria-label="{{ t_raw('common.reporting_period') }}">
            @foreach ($rangeLinks['options'] as $val => $text)
@php $on = ((string) $val === $rangeLinks['selected']); @endphp
            <a class="qm-period-btn{{ $on ? ' is-active' : '' }}" href="?range={{ (string) $val }}" aria-current="{{ $on ? 'true' : 'false' }}">{{ $text }}</a>
            @endforeach
        </div>
        <a class="qm-btn qm-btn-outline qm-btn-sm" href="{{ url('/vendor/analytics/sales?range=' . rawurlencode((string) $rangeLinks['selected']) . '&export=csv') }}"><i class="fas fa-file-csv me-1" aria-hidden="true"></i> {{ t_raw('common.export_csv') }}</a>
    </div>
</div>

<div class="qm-kpi-grid">
    @partial('kpi-card', ['variant' => 'panel', 'accent' => 'green', 'icon' => 'fa-coins', 'label' => t_raw('common.revenue'),
        'value' => money($kpis['revenue']['value']), 'spark' => $kpis['revenue']['spark'], 'meta' => $kpis['revenue']['meta']])
    @partial('kpi-card', ['variant' => 'panel', 'accent' => 'blue', 'icon' => 'fa-receipt', 'label' => t_raw('common.paid_orders'),
        'value' => number_format($kpis['paid']['value']), 'spark' => $kpis['paid']['spark'], 'meta' => $kpis['paid']['meta']])
    @partial('kpi-card', ['variant' => 'panel', 'accent' => 'violet', 'icon' => 'fa-chart-line', 'label' => t_raw('common.average_order'),
        'value' => money($kpis['aov']['value']), 'spark' => $kpis['aov']['spark'], 'meta' => $kpis['aov']['meta']])
    @partial('kpi-card', ['variant' => 'panel', 'accent' => 'blue', 'icon' => 'fa-shopping-basket', 'label' => t_raw('vendor.analytics.kpi_items_per_order'),
        'value' => number_format($kpis['ipt']['value'], 1), 'spark' => $kpis['ipt']['spark'], 'meta' => $kpis['ipt']['meta']])
    @php /* Spend per head is only meaningful once the covers were keyed in at the
       till; with none recorded the card shows an em-dash rather than a guess. */
@endphp
    @partial('kpi-card', ['variant' => 'panel', 'accent' => 'teal', 'icon' => 'fa-user-friends', 'label' => t_raw('vendor.analytics.kpi_spend_per_head'),
        'value' => $kpis['perHead']['value'] !== null ? money($kpis['perHead']['value']) : '—',
        'spark' => $kpis['perHead']['spark'], 'meta' => $kpis['perHead']['meta']])
    @partial('kpi-card', ['variant' => 'panel', 'accent' => 'amber', 'icon' => 'fa-tags', 'label' => t_raw('vendor.analytics.kpi_discounts_given'),
        'value' => money($kpis['discounts']['value']), 'spark' => $kpis['discounts']['spark'], 'meta' => $kpis['discounts']['meta']])
    @partial('kpi-card', ['variant' => 'panel', 'accent' => 'orange', 'icon' => 'fa-hand-holding-usd', 'label' => t_raw('vendor.analytics.kpi_tips'),
        'value' => money($kpis['tips']['value']), 'spark' => $kpis['tips']['spark'], 'meta' => $kpis['tips']['meta']])
    @partial('kpi-card', ['variant' => 'panel', 'accent' => 'slate', 'icon' => 'fa-undo', 'label' => t_raw('common.refunded'),
        'value' => money($kpis['refunds']['value']), 'spark' => $kpis['refunds']['spark'], 'meta' => $kpis['refunds']['meta']])
</div>

<h2 class="qm-snap-section-title"><span class="qm-snap-title-bar" aria-hidden="true"></span>{{ t_raw('dashboard.sec.trends') }}</h2>
<div class="qm-charts-grid">
    <div class="qm-chart-card qm-chart-col-8">
        @partial('chart-card', ['heading' => t_raw('vendor.analytics.chart_revenue_over_time'), 'sub' => t_raw('vendor.analytics.chart_revenue_over_time_caption'), 'cfg' => $revChart, 'meta' => $revMeta, 'accent' => 'green', 'opts' => ['id' => 'revChart', 'url' => route('vendor.chart-series', ['chart' => 'salesRevenue']), 'selected' => $rangeLinks['selected'], 'options' => $rangeLinks['options'], 'control' => 'compact']])
    </div>
    <div class="qm-chart-card qm-chart-col-4">
        @partial('chart-card', ['heading' => t_raw('vendor.dashboard.chart_tender_title'), 'sub' => t_raw('vendor.analytics.chart_net_of_refunds_sub'), 'cfg' => $tenderChart, 'meta' => $tenderMeta, 'icon' => 'fa-chart-pie', 'accent' => 'blue'])
    </div>
</div>

<div class="qm-charts-grid">
    <div class="qm-chart-card qm-chart-col-4">
        @partial('chart-card', ['heading' => t_raw('vendor.analytics.chart_order_channels'), 'sub' => t_raw('vendor.analytics.chart_order_channels_sub'), 'cfg' => $sourceChart, 'meta' => $sourceMeta, 'icon' => 'fa-chart-pie', 'accent' => 'violet'])
    </div>
    <div class="qm-chart-card qm-chart-col-4">
        @partial('chart-card', ['heading' => t_raw('vendor.analytics.heading_service_modes'), 'sub' => t_raw('vendor.analytics.chart_service_modes_sub'), 'cfg' => $modeChart, 'meta' => $modeMeta, 'icon' => 'fa-chart-pie', 'accent' => 'teal'])
    </div>
    <div class="qm-chart-card qm-chart-col-4">
        @partial('chart-card', ['heading' => t_raw('vendor.analytics.chart_discount_sources'), 'sub' => t_raw('vendor.analytics.chart_discount_sources_sub'), 'cfg' => $discChart, 'meta' => $discMeta, 'icon' => 'fa-chart-bar', 'accent' => 'amber', 'opts' => ['id' => 'salesDiscChart', 'url' => route('vendor.chart-series', ['chart' => 'salesDisc']), 'selected' => $rangeLinks['selected'], 'options' => $rangeLinks['options'], 'control' => 'compact']])
    </div>
</div>

<div class="qm-charts-grid">
    <div class="qm-chart-card qm-chart-col-12">
        @partial('chart-card', ['heading' => t_raw('vendor.analytics.chart_money_clock'), 'sub' => t_raw('vendor.analytics.chart_money_clock_sub'), 'cfg' => $heatChart, 'meta' => $heatMeta, 'icon' => 'fa-th', 'accent' => 'rose'])
    </div>
</div>

<h2 class="qm-snap-section-title"><span class="qm-snap-title-bar" aria-hidden="true"></span>{{ t_raw('dashboard.sec.breakdown') }}</h2>
<div class="qm-card">
    <h2 class="qm-card-title-ico"><span class="qm-head-chip qm-head-chip--violet"><i class="fas fa-truck" aria-hidden="true"></i></span>{{ t_raw('vendor.analytics.heading_channel_mix') }}</h2>
    <div class="table-responsive">
    <table class="qm-table" data-sortable>
        <caption class="visually-hidden">{{ t_raw('vendor.analytics.caption_channel_mix') }}</caption>
        <thead><tr>
            <th data-sort="text">{{ t_raw('vendor.analytics.col_channel') }}</th>
            <th data-sort="text">{{ t_raw('admin.analytics_sales.col_mode') }}</th>
            <th data-sort="number">{{ t_raw('common.orders') }}</th>
            <th data-sort="number">{{ t_raw('vendor.analytics.kpi_covers') }}</th>
            <th data-sort="number">{{ t_raw('common.collected') }}</th>
            <th data-sort="number">{{ t_raw('common.average_order') }}</th>
            <th data-sort="number" class="text-end">{{ t_raw('vendor.analytics.col_per_head') }}</th>
        </tr></thead>
        <tbody>
            @if ($mixRows)
            @foreach ($mixRows as $m)
            <tr>
                <td><strong>{{ $m['source_label'] }}</strong></td>
                <td><strong>{{ $m['mode_label'] }}</strong></td>
                <td>{{ number_format($m['orders']) }}</td>
                <td class="qm-cell-body">{!! $m['covers'] > 0 ? number_format($m['covers']) : dash() !!}</td>
                <td>{{ money($m['revenue']) }}</td>
                <td>{!! $m['orders'] > 0 ? money($m['revenue'] / $m['orders']) : dash() !!}</td>
                <td class="text-end">{!! $m['covers'] > 0 ? money($m['revenue'] / $m['covers']) : dash() !!}</td>
            </tr>
            @endforeach
            @else
            @partial('table-empty', ['colspan' => 7, 'icon' => 'fa-chart-bar', 'msg' => t_raw('vendor.analytics.empty_no_orders_period')])
            @endif
        </tbody>
    </table>
    </div>
    @partial('table-toolbar', ['pager' => $mixPager, 'base' => '/vendor/analytics/sales'])
</div>

<div class="qm-card">
    <h2 class="qm-card-title-ico"><span class="qm-head-chip qm-head-chip--green"><i class="fas fa-cash-register" aria-hidden="true"></i></span>{{ t_raw('vendor.analytics.heading_who_took_money') }}</h2>
    <p class="qm-hint mb-3">{{ t_raw('vendor.analytics.hint_who_took_money') }}</p>
    <div class="table-responsive">
    <table class="qm-table" data-sortable>
        <caption class="visually-hidden">{{ t_raw('vendor.analytics.caption_who_took_money') }}</caption>
        <thead><tr>
            <th data-sort="text">{{ t_raw('vendor.analytics.col_taken_by') }}</th>
            <th data-sort="number">{{ t_raw('vendor.analytics.col_payments_taken') }}</th>
            <th data-sort="number">{{ t_raw('common.refunded') }}</th>
            <th data-sort="number">{{ t_raw('vendor.analytics.col_net_collected') }}</th>
            <th data-sort="date" class="text-end">{{ t_raw('vendor.analytics.col_last_taken') }}</th>
        </tr></thead>
        <tbody>
            @if ($byStaff)
            @foreach ($byStaff as $s)
@php $named = ($s['uid'] !== null && ($s['name'] ?? '') !== ''); @endphp
            <tr>
                <td>
                    @if ($named)
                    <div class="qm-tbl-id">
                        {!! brandmark_html($s['avatar'] ?? null, (string) $s['name'], 'md', 'qm-brandmark--round') !!}
                        <div class="qm-tbl-id-text">
                            <strong>{{ (string) $s['name'] }}</strong>
                            @if (!empty($s['role']))<span class="qm-cell-body">{{ role_label((string) $s['role']) }}</span>@endif
                        </div>
                    </div>
                    @else
                    @php /* Online gateway captures carry no till operator - nobody handled them. */
@endphp
                    <span class="qm-cell-body">{{ t_raw('vendor.analytics.taken_online') }}</span>
                    @endif
                </td>
                <td>{{ number_format((int) $s['taken']) }}</td>
                <td class="qm-cell-body">{!! (int) $s['refunded'] > 0 ? number_format((int) $s['refunded']) : dash() !!}</td>
                <td><strong>{{ money($s['net']) }}</strong></td>
                <td class="qm-cell-body text-end">{!! fmt_datetime($s['last_at']) !!}</td>
            </tr>
            @endforeach
            @else
            @partial('table-empty', ['colspan' => 5, 'icon' => 'fa-cash-register', 'msg' => t_raw('vendor.analytics.empty_no_payments_period')])
            @endif
        </tbody>
    </table>
    </div>
    @partial('table-toolbar', ['pager' => $staffPager, 'base' => '/vendor/analytics/sales', 'showPager' => false])
</div>

<div class="qm-card">
    <h2 class="qm-card-title-ico"><span class="qm-head-chip qm-head-chip--amber"><i class="fas fa-tags" aria-hidden="true"></i></span>{{ t_raw('vendor.analytics.heading_discounts_given') }}</h2>
    <div class="table-responsive">
    <table class="qm-table" data-sortable>
        <caption class="visually-hidden">{{ t_raw('vendor.analytics.caption_discounts_given') }}</caption>
        <thead><tr>
            <th data-sort="text">{{ t_raw('vendor.analytics.col_discount_source') }}</th>
            <th data-sort="text">{{ t_raw('common.type') }}</th>
            <th data-sort="number">{{ t_raw('common.orders') }}</th>
            <th data-sort="number">{{ t_raw('common.discount') }}</th>
            <th data-sort="number" class="text-end">{{ t_raw('vendor.analytics.col_avg_per_order') }}</th>
        </tr></thead>
        <tbody>
            @if ($discRows)
            @foreach ($discRows as $d)
            <tr>
                <td><strong>{{ $d['label'] }}</strong></td>
                <td data-sort-value="{{ $d['kind'] }}">
                    @if ($d['kind'] === 'coupon')<span class="qm-pill qm-pill-green">{{ t_raw('vendor.analytics.discount_kind_coupon') }}</span>
                    @elseif ($d['kind'] === 'manual')<span class="qm-pill qm-pill-amber">{{ t_raw('vendor.analytics.discount_kind_manual') }}</span>
                    @elseif ($d['kind'] === 'loyalty')<span class="qm-pill qm-pill-violet">{{ t_raw('vendor.analytics.discount_kind_loyalty') }}</span>
                    @else<span class="qm-pill qm-pill-grey">{{ t_raw('common.other') }}</span>@endif
                </td>
                <td>{{ number_format($d['orders']) }}</td>
                <td><strong>{{ money($d['amount']) }}</strong></td>
                <td class="qm-cell-body text-end">{!! $d['orders'] > 0 ? money($d['amount'] / $d['orders']) : dash() !!}</td>
            </tr>
            @endforeach
            @else
            @partial('table-empty', ['colspan' => 5, 'icon' => 'fa-tags', 'msg' => t_raw('vendor.analytics.empty_no_discounts')])
            @endif
        </tbody>
    </table>
    </div>
    @partial('table-toolbar', ['pager' => $discPager, 'base' => '/vendor/analytics/sales', 'showPager' => false])
</div>

</div>@php /* /.qm-d2 */
@endphp
@endsection