{{-- resources/views/reports/sales.blade.php --}}
@extends('layouts.app')

@section('title','Sales Report — BlueBando v3')

@section('content')
@php
    $currency = config('bluebando.currency','TZS');
@endphp

<div style="margin-bottom:16px">
    <h1 style="margin:0 0 4px;font-size:24px;letter-spacing:.2px">Sales Report</h1>
    <div class="muted">Muhtasari wa mauzo ya vocha kulingana na siku.</div>
</div>

{{-- Filters --}}
<div class="card" style="margin-bottom:16px">
    <div class="card-body">
        <form method="GET" action="{{ url('/reports/sales') }}">
            <div class="row g-3">
                {{-- Router filter --}}
                <div class="col-md-4">
                    <label class="form-label">Router</label>
                    <select name="router_id" class="form-select" onchange="this.form.submit()">
                        <option value="">— Routers Zote —</option>
                        @foreach($routers as $r)
                            <option value="{{ $r->id }}"
                                {{ (string)$routerId === (string)$r->id ? 'selected' : '' }}>
                                {{ $r->name }}
                            </option>
                        @endforeach
                    </select>
                </div>

                {{-- From date --}}
                <div class="col-md-3">
                    <label class="form-label">Kuanzia tarehe</label>
                    <input type="date" name="from" value="{{ $from }}" class="form-control" onchange="this.form.submit()">
                </div>

                {{-- To date --}}
                <div class="col-md-3">
                    <label class="form-label">Mpaka tarehe</label>
                    <input type="date" name="to" value="{{ $to }}" class="form-control" onchange="this.form.submit()">
                </div>

                <div class="col-md-2 d-flex align-items-end">
                    <button type="submit" class="btn btn-primary w-100">
                        Tafuta
                    </button>
                </div>
            </div>
        </form>
    </div>
</div>

{{-- Summary cards --}}
<div class="row g-3" style="margin-bottom:16px">
    <div class="col-md-4">
        <div class="card">
            <div class="card-body d-flex justify-content-between align-items-center">
                <div>
                    <div class="text-muted small">Jumla ya Mauzo</div>
                    <div style="font-size:1.4rem;font-weight:600">
                        {{ number_format($summary['total_amount'] ?? 0) }} {{ $currency }}
                    </div>
                </div>
                <div class="text-muted">
                    <i class="bi bi-cash-stack" style="font-size:1.8rem"></i>
                </div>
            </div>
        </div>
    </div>
    <div class="col-md-4">
        <div class="card">
            <div class="card-body d-flex justify-content-between align-items-center">
                <div>
                    <div class="text-muted small">Idadi ya Orders</div>
                    <div style="font-size:1.4rem;font-weight:600">
                        {{ number_format($summary['total_orders'] ?? 0) }}
                    </div>
                </div>
                <div class="text-muted">
                    <i class="bi bi-receipt-cutoff" style="font-size:1.8rem"></i>
                </div>
            </div>
        </div>
    </div>
    <div class="col-md-4">
        @php
            $avg = ($summary['total_orders'] ?? 0) > 0
                ? ($summary['total_amount'] ?? 0) / $summary['total_orders']
                : 0;
        @endphp
        <div class="card">
            <div class="card-body d-flex justify-content-between align-items-center">
                <div>
                    <div class="text-muted small">Wastani kwa Order</div>
                    <div style="font-size:1.4rem;font-weight:600">
                        {{ number_format($avg, 0) }} {{ $currency }}
                    </div>
                </div>
                <div class="text-muted">
                    <i class="bi bi-graph-up" style="font-size:1.8rem"></i>
                </div>
            </div>
        </div>
    </div>
</div>

{{-- Table --}}
<div class="card">
    <div class="card-body">
        <div class="d-flex justify-content-between align-items-center mb-2">
            <strong>Muhtasari wa siku ({{ $currency }})</strong>
            <span class="text-muted small">
                @if($from || $to)
                    @if($from) kuanzia {{ $from }} @endif
                    @if($to) hadi {{ $to }} @endif
                @else
                    Siku za hivi karibuni
                @endif
            </span>
        </div>

        @if($rows->count())
            <div class="table-responsive">
                <table class="table table-sm align-middle">
                    <thead>
                        <tr>
                            <th>Tarehe</th>
                            <th class="text-end">Idadi ya Orders</th>
                            <th class="text-end">Jumla ya Mauzo ({{ $currency }})</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach($rows as $row)
                            <tr>
                                <td>
                                    {{ \Illuminate\Support\Carbon::parse($row->sale_date)->format('Y-m-d') }}
                                </td>
                                <td class="text-end">{{ number_format($row->total_orders) }}</td>
                                <td class="text-end">{{ number_format($row->total_amount) }}</td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>

            <div class="mt-2">
                {{ $rows->links() }}
            </div>
        @else
            <div class="text-muted">
                Hakuna mauzo kwenye vigezo ulivyochagua.
            </div>
        @endif
    </div>
</div>
@endsection