@extends('layouts.exat')
@section('title', 'Reporting')
@section('subtitle', "Vue analytique des avances")

@section('actions')
    <button type="button" onclick="window.print()" class="inline-flex h-9 items-center gap-2 rounded-lg border border-slate-200 px-3 text-sm text-slate-700 hover:bg-slate-50">Imprimer</button>
@endsection

@section('content')
@php
    $fmt = fn ($n) => number_format((float) $n, 0, ',', ' ');
    $maxMois = collect($parMois)->max('montant') ?: 1;
    $maxObjet = $parObjet->max('montant') ?: 1;
    $palette = ['#1E7A46','#0EA5E9','#F59E0B','#6366F1','#EF4444','#14B8A6','#8B5CF6','#64748B','#0891B2','#84CC16'];
@endphp

<form method="GET" class="mb-4 flex flex-wrap items-end gap-2 rounded-xl bg-white p-3 ring-1 ring-slate-200">
    @include('partials._filtre-date')
    <button class="inline-flex h-9 items-center rounded-lg border border-slate-200 px-3 text-sm text-slate-700 hover:bg-slate-50">Filtrer</button>
    @if(request()->hasAny(['periode','date','date_debut','date_fin','semaine','mois','annee']))<a href="{{ route('reporting.index') }}" class="inline-flex h-9 items-center px-2 text-sm text-slate-500 hover:text-slate-700">Réinitialiser</a>@endif
</form>

<div class="mb-4 grid grid-cols-2 gap-3 lg:grid-cols-4">
    <div class="rounded-xl bg-white p-4 ring-1 ring-slate-200"><div class="text-xs text-slate-500">Total demandes</div><div class="text-2xl font-medium text-slate-900">{{ $kpis['total'] }}</div></div>
    <div class="rounded-xl bg-white p-4 ring-1 ring-slate-200"><div class="text-xs text-slate-500">Montant demandé</div><div class="text-2xl font-medium text-slate-900">{{ $fmt($kpis['montant']) }}<span class="ml-1 text-sm text-slate-400">FCFA</span></div></div>
    <div class="rounded-xl bg-white p-4 ring-1 ring-slate-200"><div class="text-xs text-slate-500">Décaissé</div><div class="text-2xl font-medium text-indigo-600">{{ $fmt($kpis['decaisse']) }}<span class="ml-1 text-sm text-slate-400">FCFA</span></div></div>
    <div class="rounded-xl bg-white p-4 ring-1 ring-slate-200"><div class="text-xs text-slate-500">Taux de recouvrement</div><div class="text-2xl font-medium text-emerald-600">{{ number_format($kpis['taux'],1,',',' ') }} %</div><div class="mt-1 text-[11px] text-slate-400">Remboursé : {{ $fmt($kpis['rembourse']) }} FCFA</div></div>
</div>

<div class="grid gap-4 lg:grid-cols-2">
    {{-- Évolution mensuelle --}}
    <section class="rounded-xl bg-white p-5 ring-1 ring-slate-200">
        <h2 class="mb-4 text-sm font-medium text-slate-900">Évolution mensuelle (montants demandés)</h2>
        <svg viewBox="0 0 520 200" class="w-full" preserveAspectRatio="xMidYMid meet">
            @php $i=0; $bw=520/count($parMois); @endphp
            @foreach($parMois as $m)
                @php $h = $m['montant']>0 ? max(3, ($m['montant']/$maxMois)*150) : 0; $x=$i*$bw; @endphp
                <rect x="{{ $x+$bw*0.2 }}" y="{{ 170-$h }}" width="{{ $bw*0.6 }}" height="{{ $h }}" rx="3" fill="#1E7A46"></rect>
                <text x="{{ $x+$bw/2 }}" y="188" text-anchor="middle" font-size="9" fill="#94a3b8">{{ $m['label'] }}</text>
                @php $i++; @endphp
            @endforeach
        </svg>
    </section>

    {{-- Répartition par statut --}}
    <section class="rounded-xl bg-white p-5 ring-1 ring-slate-200">
        <h2 class="mb-4 text-sm font-medium text-slate-900">Répartition par statut</h2>
        <table class="w-full text-sm">
            <tbody>
                @forelse($parStatut as $statut => $d)
                    <tr class="border-b border-slate-50 last:border-0">
                        <td class="py-2"><x-statut-badge :statut="$statut" /></td>
                        <td class="py-2 text-right tabular-nums text-slate-500">{{ $d['n'] }}</td>
                        <td class="py-2 text-right tabular-nums font-medium text-slate-800">{{ $fmt($d['montant']) }} FCFA</td>
                    </tr>
                @empty
                    <tr><td class="py-8 text-center text-sm text-slate-400">Aucune donnée sur la période.</td></tr>
                @endforelse
            </tbody>
        </table>
    </section>

    {{-- Top objets --}}
    <section class="rounded-xl bg-white p-5 ring-1 ring-slate-200 lg:col-span-2">
        <h2 class="mb-4 text-sm font-medium text-slate-900">Top objets (par montant)</h2>
        <div class="space-y-2">
            @forelse($parObjet as $objet => $d)
                @php $w = ($d['montant']/$maxObjet)*100; @endphp
                <div>
                    <div class="mb-0.5 flex items-center justify-between text-xs">
                        <span class="text-slate-600">{{ $objet }}</span>
                        <span class="tabular-nums text-slate-500">{{ $fmt($d['montant']) }} FCFA · {{ $d['n'] }}</span>
                    </div>
                    <div class="h-2 overflow-hidden rounded-full bg-slate-100"><div class="h-full rounded-full bg-emerald-500" style="width: {{ $w }}%"></div></div>
                </div>
            @empty
                <p class="py-6 text-center text-sm text-slate-400">Aucune donnée sur la période.</p>
            @endforelse
        </div>
    </section>
</div>
@endsection