@extends('layouts.app')

@section('titre', 'Arrêt '.($dossier?->numero ?? ''))

@section('contenu')
    @php
        $nom = match (true) {
            $dossier === null => null,
            $estEncombrant => $dossier->demandeur_nom ?: 'Enlèvement sur voirie',
            $estCollecte => $dossier->donateur_prenom.' '.$dossier->donateur_nom,
            default => $dossier->client_prenom.' '.$dossier->client_nom,
        };
        $adresseComplete = $dossier
            ? trim($dossier->adresse.', '.$dossier->code_postal.' '.$dossier->commune)
            : null;
        $cloture = $intervention->cloture_at !== null;
    @endphp

    <a href="{{ route('tournee-du-jour') }}" class="mb-3 inline-block text-sm text-slate-500 hover:underline">
        &larr; Retour à la tournée
    </a>

    <div class="carte">
        <p class="text-sm text-slate-500">
            Arrêt {{ $intervention->ordre + 1 }} &middot; {{ $dossier?->numero }}
            &middot; {{ $estEncombrant ? 'Encombrants' : ($estCollecte ? 'Collecte' : 'Livraison') }}
        </p>
        <h1 class="mt-1 text-xl font-semibold">{{ $nom }}</h1>
        <p class="mt-2">
            {{ $dossier?->adresse }}@if ($dossier?->complement), {{ $dossier->complement }}@endif<br>
            {{ $dossier?->code_postal }} {{ $dossier?->commune }}
        </p>

        <div class="mt-4 flex flex-wrap gap-2">
            @if ($dossier?->telephone)
                <a href="tel:{{ $dossier->telephone }}" class="bouton-principal">
                    Appeler {{ $dossier->telephone }}
                </a>
            @endif
            @if ($adresseComplete)
                <a href="https://www.google.com/maps/dir/?api=1&destination={{ urlencode($adresseComplete) }}"
                   target="_blank" rel="noopener" class="bouton-secondaire">Itinéraire</a>
            @endif
        </div>
    </div>

    @if ($estEncombrant)
        <div class="carte mt-4">
            <h2 class="mb-2 font-semibold">Ce qui est annoncé</h2>
            @forelse ($dossier?->objetsAnnonces() ?? [] as $objet)
                <p class="text-sm text-slate-700">{{ $objet }}</p>
            @empty
                <p class="text-sm text-slate-500">Rien n'a été précisé par la collectivité.</p>
            @endforelse
            @if ($dossier?->observation)
                <p class="mt-2 text-sm text-slate-700">
                    Observation de la feuille : {{ $dossier->observation }}
                </p>
            @endif
            @if ($dossier?->creneau)
                <p class="mt-2 text-sm text-slate-600">Créneau annoncé : {{ $dossier->creneau }}</p>
            @endif
            @if ($dossier?->adresseDouteuse())
                <p class="mt-2 rounded-lg bg-amber-50 px-3 py-2 text-sm text-amber-900">
                    Cette adresse n'a pas été retrouvée avec certitude. Si vous ne la trouvez pas,
                    signalez-le plutôt que de tourner.
                </p>
            @endif
        </div>
    @else
    <div class="carte mt-4">
        <h2 class="mb-2 font-semibold">Accès</h2>
        <ul class="space-y-1 text-sm text-slate-700">
            <li>{{ $dossier?->logement_type ? ucfirst($dossier->logement_type) : 'Type de logement non précisé' }}@if ($dossier?->etage), étage {{ $dossier->etage }}@endif</li>
            <li>
                @if (! $dossier?->ascenseur_present)
                    Pas d'ascenseur
                @elseif ($dossier->ascenseur_utilisable_meuble)
                    Ascenseur, le meuble y passe
                @else
                    Ascenseur présent, mais le meuble n'y passe pas
                @endif
            </li>
            @if ($dossier?->escaliers)<li>Escaliers : {{ $dossier->escaliers }}</li>@endif
            @if ($dossier?->passages_etroits)<li>Passages étroits signalés</li>@endif
            @if ($dossier?->stationnement)<li>Stationnement : {{ $dossier->stationnement }}</li>@endif
            @if ($dossier?->distance_portage_m)<li>Portage sur {{ $dossier->distance_portage_m }} m</li>@endif
            @if ($dossier?->demontage_necessaire)<li>Démontage annoncé</li>@endif
            @if (! $estCollecte && $dossier?->prestation)
                <li>Prestation : {{ \App\Models\Tarif::PRESTATIONS[$dossier->prestation] }}</li>
            @endif
            @if ($dossier?->acces_observations)<li>{{ $dossier->acces_observations }}</li>@endif
        </ul>
    </div>
    @endif

    {{-- Le chargement ne concerne que les livraisons : une collecte se charge
         chez le donateur, et un encombrant se ramasse sur le trottoir. --}}
    @if ($type === 'livraison' && $dossier && ! $cloture)
        <form method="POST" action="{{ route('interventions.chargement', $intervention) }}"
              class="carte mt-4 space-y-3">
            @csrf
            <h2 class="font-semibold">Chargement</h2>
            <p class="text-sm text-slate-500">
                À cocher au dépôt, avant de partir. C'est ce qui évite qu'un camion parte sans un meuble.
            </p>

            @foreach ($dossier->objets as $objet)
                <label class="flex items-start gap-3 border-b border-slate-100 py-2 last:border-0">
                    <input type="checkbox" name="charges[]" value="{{ $objet->id }}" @checked($objet->charge)
                           class="mt-1 size-5 rounded border-slate-300 text-marque-600 focus:ring-marque-600">
                    <span>
                        <span class="font-medium">{{ $objet->description }}</span>
                        <span class="text-sm text-slate-500">&times; {{ $objet->quantite }}</span>
                        @if ($objet->fragile || $objet->remontage_demande)
                            <span class="block text-sm text-amber-700">
                                @if ($objet->fragile) fragile @endif
                                @if ($objet->remontage_demande) &middot; remontage demandé @endif
                            </span>
                        @endif
                        @if ($objet->emplacement ?? false)
                            <span class="block text-sm text-slate-500">{{ $objet->emplacement }}</span>
                        @endif
                    </span>
                </label>
            @endforeach

            @if ($dossier->emplacement_stockage || $dossier->nb_colis)
                <p class="text-sm text-slate-600">
                    {{ $dossier->emplacement_stockage }}
                    @if ($dossier->nb_colis) &middot; {{ $dossier->nb_colis }} pièce(s) ou colis @endif
                </p>
            @endif

            <button type="submit" class="bouton-secondaire">Enregistrer le chargement</button>
        </form>
    @endif

    @if ($cloture)
        <div class="carte mt-4 border-accent-300 bg-accent-50">
            <h2 class="mb-2 font-semibold text-accent-900">Arrêt clôturé</h2>
            <p class="text-sm text-accent-900">
                Le {{ $intervention->cloture_at->translatedFormat('j F Y à H\hi') }}.
                @if ($intervention->signataire_nom)
                    Signé par {{ $intervention->signataire_nom }}.
                @elseif ($intervention->signature_impossible_motif)
                    Sans signature : {{ $intervention->signature_impossible_motif }}
                @endif
            </p>
            @if ($intervention->signature_chemin)
                <img src="{{ route('interventions.signature.image', $intervention) }}"
                     alt="Signature de {{ $intervention->signataire_nom }}"
                     class="mt-3 h-24 rounded-lg border border-accent-300 bg-white">
            @endif
            <p class="mt-3 text-sm text-accent-900">
                Le bon a été figé tel qu'il a été présenté. Il ne se réécrit plus : une correction
                s'ajoute à côté et reste identifiable.
            </p>
        </div>

        @if ($intervention->corrections->isNotEmpty())
            <div class="carte mt-4">
                <h2 class="mb-2 font-semibold">Corrections apportées après signature</h2>
                <ul class="space-y-2 text-sm text-slate-700">
                    @foreach ($intervention->corrections as $correction)
                        <li>
                            {{ $correction->correction }}
                            <span class="block text-slate-500">
                                {{ $correction->manager->name }},
                                le {{ $correction->created_at->translatedFormat('j F Y à H\hi') }}
                            </span>
                        </li>
                    @endforeach
                </ul>
            </div>
        @endif
    @endif

    @php
        $objets = match (true) {
            $dossier === null, $estEncombrant => collect(),
            $estCollecte => $dossier->objets->where('decision', 'retenu'),
            default => $dossier->objets,
        };
        $colonne = $estCollecte ? 'quantite_collectee' : 'quantite_livree';
    @endphp

    <form method="POST" action="{{ route('interventions.resultat', $intervention) }}"
          enctype="multipart/form-data" class="carte mt-4 space-y-4">
        @csrf

        @unless ($estEncombrant)
            <h2 class="font-semibold">{{ $estCollecte ? 'Objets à collecter' : 'Meubles à livrer' }}</h2>
        @endunless
        @if ($estCollecte)
            <p class="text-sm text-slate-500">
                Seuls les objets retenus lors de l'examen des photos figurent ici. Si un objet
                diffère de ce qui était annoncé, notez-le dans le commentaire.
            </p>
        @endif

        @unless ($estEncombrant)
        @forelse ($objets as $objet)
            <div class="border-b border-slate-100 py-3 last:border-0">
                <p class="font-medium">
                    {{ $estCollecte ? trim($objet->type.' '.($objet->description ?? '')) : $objet->description }}
                    <span class="text-sm font-normal text-slate-500">prévu &times; {{ $objet->quantite }}</span>
                </p>
                @if ($objet->photos->isNotEmpty())
                    <div class="mt-2 flex flex-wrap gap-2">
                        @foreach ($objet->photos as $photo)
                            <img src="{{ route('photos.montrer', $photo) }}" alt=""
                                 class="size-24 rounded-lg object-cover">
                        @endforeach
                    </div>
                @endif
                <label class="mt-2 block sm:max-w-40">
                    <span class="etiquette">{{ $estCollecte ? 'Réellement chargé' : 'Réellement livré' }}</span>
                    <input type="number" name="quantites[{{ $objet->id }}]" min="0" max="999"
                           value="{{ $objet->{$colonne} ?? $objet->quantite }}"
                           @disabled($cloture) class="champ">
                </label>
            </div>
        @empty
            <p class="text-sm text-slate-500">Aucun objet rattaché à cet arrêt.</p>
        @endforelse
        @endunless

        <h2 class="pt-2 font-semibold">Résultat</h2>
        <fieldset>
            <legend class="sr-only">Comment s'est passée l'intervention</legend>
            @foreach ($resultats as $valeur => $libelle)
                <label class="mb-2 flex items-center gap-2">
                    <input type="radio" name="resultat" value="{{ $valeur }}"
                           @checked($intervention->resultat === $valeur) @disabled($cloture) required
                           class="size-4 border-slate-300 text-marque-600 focus:ring-marque-600">
                    {{ $libelle }}
                </label>
            @endforeach
        </fieldset>

        <label><span class="etiquette">Problème rencontré</span>
            <textarea name="probleme" rows="2" @disabled($cloture)
                      class="champ">{{ $intervention->probleme }}</textarea>
            <span class="mt-1 block text-sm text-slate-500">
                Ce qui est écrit ici remonte dans les alertes des managers.
            </span>
        </label>

        <label><span class="etiquette">Commentaire</span>
            <textarea name="commentaire" rows="2" @disabled($cloture)
                      class="champ">{{ $intervention->commentaire }}</textarea></label>

        @unless ($cloture)
            <label><span class="etiquette">Photos prises sur place</span>
                <input type="file" name="photos[]" accept="image/*" capture="environment" multiple
                       class="champ"></label>

            <label class="sm:max-w-xs"><span class="etiquette">Votre prénom</span>
                <input name="operateur_prenom" value="{{ $intervention->operateur_prenom }}"
                       placeholder="Qui saisit ce résultat" class="champ"></label>

            <button type="submit" class="bouton-secondaire">Enregistrer le résultat</button>
        @endunless
    </form>

    @if ($intervention->photos->isNotEmpty())
        <div class="carte mt-4">
            <h2 class="mb-2 font-semibold">Photos prises sur place</h2>
            <div class="flex flex-wrap gap-2">
                @foreach ($intervention->photos as $photo)
                    <img src="{{ route('photos.montrer', $photo) }}" alt=""
                         class="size-28 rounded-lg object-cover">
                @endforeach
            </div>
        </div>
    @endif

    @unless ($cloture)
        <div class="carte mt-4 space-y-4">
            <h2 class="font-semibold">{{ $estEncombrant ? 'Signature' : 'Signature du client' }}</h2>
            <p class="text-sm text-slate-500">
                @if ($estEncombrant)
                    Sur voirie, il n'y a souvent personne à faire signer. Utilisez alors
                    « la signature est impossible » plus bas : l'arrêt se clôt quand même.
                @else
                    Présentez le récapitulatif ci-dessus au client, puis faites signer au doigt.
                @endif
                La signature clôt l'arrêt : le bon est alors figé et ne se réécrit plus.
            </p>

            <form method="POST" action="{{ route('interventions.signature', $intervention) }}"
                  class="space-y-3" data-signature>
                @csrf
                <label class="sm:max-w-xs"><span class="etiquette">Nom du signataire</span>
                    <input name="signataire_nom" required class="champ"></label>

                <div>
                    <span class="etiquette">Signature</span>
                    <canvas data-zone-signature
                            class="h-44 w-full touch-none rounded-lg border border-slate-300 bg-white"></canvas>
                    <input type="hidden" name="signature" data-champ-signature>
                    <div class="mt-2 flex items-center gap-3">
                        <button type="button" class="bouton-secondaire" data-effacer-signature>Effacer</button>
                        <span class="text-sm text-slate-500" data-etat-signature>Signez dans le cadre.</span>
                    </div>
                </div>

                <button type="submit" class="bouton-principal w-full sm:w-auto">
                    Valider la signature et clôturer
                </button>
            </form>

            <details class="border-t border-slate-100 pt-3">
                <summary class="cursor-pointer text-sm font-medium text-slate-700">
                    La signature est impossible ou refusée
                </summary>
                <form method="POST" action="{{ route('interventions.sans-signature', $intervention) }}"
                      class="mt-3 space-y-3">
                    @csrf
                    <label><span class="etiquette">Motif</span>
                        <input name="signature_impossible_motif" required
                               placeholder="Client parti, téléphone hors service, refus de signer"
                               class="champ"></label>
                    <p class="text-sm text-slate-500">
                        L'arrêt sera clôturé sans signature, et les managers en seront informés.
                    </p>
                    <button type="submit" class="bouton-secondaire">Clôturer sans signature</button>
                </form>
            </details>
        </div>
    @endunless
@endsection