@extends('compte.layout')
@php use App\Support\Content; use App\Support\Taxonomy; @endphp

@section('compte')
    <div class="panel">
        <div class="panel-head"><h2 style="font-size:1.1rem">Créer une alerte</h2></div>

        <form method="post" action="{{ url('/compte/alertes') }}" class="stack">
            @csrf
            <div class="grid grid-2" style="gap:14px">
                <div class="field-group">
                    <label class="label" for="label">Nom de l'alerte</label>
                    <input class="input @error('label') is-invalid @enderror" id="label" name="label"
                           value="{{ old('label') }}" placeholder="Ex. : Appartement 3 pièces à Lille" required>
                    @error('label')<span class="field-error">{{ $message }}</span>@enderror
                </div>
                <div class="field-group">
                    <label class="label" for="rubrique">Rubrique</label>
                    <select class="select" id="rubrique" name="rubrique">
                        @foreach(Taxonomy::rubriques() as $cle => $r)
                            <option value="{{ $cle }}" @selected(old('rubrique', 'annonces') === $cle)>{{ $r['label'] }}</option>
                        @endforeach
                    </select>
                </div>
                <div class="field-group">
                    <label class="label" for="q">Mots-clés</label>
                    <input class="input" id="q" name="q" value="{{ old('q') }}" placeholder="vélo électrique">
                </div>
                <div class="field-group">
                    <label class="label" for="ville">Ville</label>
                    <div class="input-icon">
                        <x-icon name="pin"/>
                        <input class="input" id="ville" name="ville" list="liste-villes" value="{{ old('ville') }}">
                    </div>
                    <datalist id="liste-villes">
                        @foreach(Content::villes() as [$v, $c])<option value="{{ $v }}">{{ $c }}</option>@endforeach
                    </datalist>
                </div>
                <div class="field-group">
                    <label class="label" for="min">Prix minimum (€)</label>
                    <input class="input" id="min" type="number" name="min" min="0" step="1" value="{{ old('min') }}">
                </div>
                <div class="field-group">
                    <label class="label" for="max">Prix maximum (€)</label>
                    <input class="input @error('max') is-invalid @enderror" id="max" type="number" name="max" min="0" step="1" value="{{ old('max') }}">
                    @error('max')<span class="field-error">{{ $message }}</span>@enderror
                </div>
                <div class="field-group">
                    <label class="label" for="frequency">Fréquence des e-mails</label>
                    <select class="select" id="frequency" name="frequency">
                        @foreach(['instantanee' => 'Dès qu\'une annonce correspond', 'quotidienne' => 'Un résumé par jour', 'hebdomadaire' => 'Un résumé par semaine'] as $v => $l)
                            <option value="{{ $v }}" @selected(old('frequency', 'quotidienne') === $v)>{{ $l }}</option>
                        @endforeach
                    </select>
                </div>
            </div>

            <div><button class="btn btn-primary" type="submit"><x-icon name="bell"/> Créer l'alerte</button></div>
        </form>
    </div>

    <div class="panel">
        <div class="panel-head">
            <h2 style="font-size:1.1rem">Mes alertes <span class="muted" style="font-weight:500">({{ $alertes->count() }})</span></h2>
        </div>

        @forelse($alertes as $alerte)
            <div class="switch-row" style="align-items:flex-start">
                <div style="min-width:0">
                    <strong class="small" style="color:var(--ink-900)">{{ $alerte->label }}</strong>
                    <p class="tiny muted" style="margin:2px 0 0">
                        {{ ucfirst($alerte->rubrique) }}
                        @if($alerte->q) · « {{ $alerte->q }} »@endif
                        @if($alerte->ville) · {{ $alerte->ville }}@endif
                        @if($alerte->min || $alerte->max)
                            · {{ $alerte->min ? number_format($alerte->min / 100, 0, ',', ' ').' €' : '0 €' }}
                            – {{ $alerte->max ? number_format($alerte->max / 100, 0, ',', ' ').' €' : '∞' }}
                        @endif
                        · {{ ucfirst($alerte->frequency) }}
                    </p>
                </div>

                <div class="row-center" style="gap:6px">
                    @if(($nouveautes[$alerte->id] ?? 0) > 0)
                        <a href="{{ $alerte->url }}" class="badge badge-orange">{{ $nouveautes[$alerte->id] }} nouvelles</a>
                    @else
                        <a href="{{ $alerte->url }}" class="badge badge-soft">Voir</a>
                    @endif

                    <form method="post" action="{{ url('/compte/alertes/'.$alerte->id.'/bascule') }}">
                        @csrf @method('put')
                        <button class="btn btn-ghost btn-icon btn-sm" title="{{ $alerte->active ? 'Mettre en pause' : 'Réactiver' }}">
                            <x-icon :name="$alerte->active ? 'bell' : 'minus'"/>
                        </button>
                    </form>

                    <form method="post" action="{{ url('/compte/alertes/'.$alerte->id) }}"
                          onsubmit="return confirm('Supprimer cette alerte ?')">
                        @csrf @method('delete')
                        <button class="btn btn-ghost btn-icon btn-sm" title="Supprimer"><x-icon name="trash"/></button>
                    </form>
                </div>
            </div>
        @empty
            <p class="muted small" style="margin:0">Aucune alerte pour l'instant.</p>
        @endforelse
    </div>
@endsection