@extends('admin.layout')

@section('title', __('Produits à rattacher'))

{{-- Les produits de digiKam restés en libellé (« store coffre 136 », « 660cl »),
     rattachés au catalogue une fois par libellé et par type : toutes leurs
     photos suivent (App\Services\Photos\RattachementsModeles). Gestes sur
     place (js/sur-place.js) : la zone `produits` est remplacée après chaque
     envoi, le champ de choix travaille par délégation
     (js/phototheque-produits.js). --}}

@section('content')

    <div class="pagetitle d-flex flex-wrap align-items-end gap-2">
        <div>
            <h1>@yield('title')</h1>
            <nav>
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="{{ route('photos.index') }}">{{ __('Photothèque') }}</a></li>
                    <li class="breadcrumb-item active">@yield('title')</li>
                </ol>
            </nav>
        </div>
    </div>

    <div data-zone="messages">
        @if (session('success'))
            <div class="alert alert-success">{{ session('success') }}</div>
        @endif
        @if (session('error'))
            <div class="alert alert-danger">{{ session('error') }}</div>
        @endif
        @if ($errors->any())
            <div class="alert alert-danger">{{ $errors->first() }}</div>
        @endif
    </div>

    <section class="section phototheque-produits" data-zone="produits">
        <div class="card">
            <div class="card-body pt-3">
                <p class="mb-3">
                    {{ trans_choice(':n libellé de digiKam ne se retrouve pas au catalogue.|:n libellés de digiKam ne se retrouvent pas au catalogue.', $total, ['n' => $total]) }}
                    {{ __('Choisissez son modèle, sa variation ou sa catégorie : toutes ses photos le suivent, et il apparaît dans les filtres de la photothèque. Ce qui n\'est rien de cela devient une étiquette, ou s\'efface quand le type suffit.') }}
                </p>

                {{-- Le nombre est celui des libellés : ce qu'il reste à traiter. --}}
                @if ($total > 0)
                    <nav class="d-flex flex-wrap gap-1 mb-3" aria-label="{{ __('Filtrer par type') }}">
                        <a href="{{ route('photos.produits') }}" class="btn btn-sm {{ $filtre === null ? 'btn-primary' : 'btn-outline-secondary' }}"
                            @if ($filtre === null) aria-current="true" @endif>{{ __('Tous') }} · {{ $total }}</a>
                        @foreach ($filtres as $choix)
                            <a href="{{ route('photos.produits', ['type' => $choix['cle']]) }}" class="btn btn-sm {{ $filtre === $choix['cle'] ? 'btn-primary' : 'btn-outline-secondary' }}"
                                @if ($filtre === $choix['cle']) aria-current="true" @endif>{{ $choix['nom'] }} · {{ $choix['n'] }}</a>
                        @endforeach
                    </nav>
                @endif

                @if ($lignes->isEmpty())
                    <p class="mb-0">{{ $total > 0 ? __('Plus rien à rattacher sous ce type.') : __('Tout est rattaché.') }}</p>
                @else
                    {{-- Pas de .table-responsive : son débordement couperait le
                         menu du champ et celui de « Pas un modèle ». Sur un
                         téléphone, chaque ligne se replie en carte (phototheque.css). --}}
                    <table class="table align-middle phototheque-produits-table no-cards">
                            <thead>
                                <tr>
                                    <th scope="col" class="phototheque-produits-vignette"><span class="visually-hidden">{{ __('Photo') }}</span></th>
                                    <th scope="col">{{ __('Libellé de digiKam') }}</th>
                                    <th scope="col" class="text-end">{{ __('Photos') }}</th>
                                    <th scope="col">{{ __('Modèle du catalogue') }}</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach ($lignes as $ligne)
                                    @php
                                        $type = $ligne['type'] ? \Illuminate\Support\Str::ucfirst(mb_strtolower($ligne['type']->nom)) : null;
                                        $nommer = trim(($type ? $type . ' ' : '') . '« ' . $ligne['libelle'] . ' »');
                                        $etiquette = \App\Services\Photos\RattachementsModeles::etiquetteDe($ligne['libelle']);
                                    @endphp
                                    {{-- L'ancre du lien « Rattacher » du panneau d'une photo. --}}
                                    <tr id="produit-{{ md5($ligne['type_id'] . '|' . $ligne['libelle']) }}">
                                        <td class="phototheque-produits-vignette">
                                            @if ($vignette = $ligne['photo']?->vignetteUrl())
                                                {{-- En grand, à la suite des autres lignes (js/visionneuse.js) ;
                                                     le nombre de photos mène à la photothèque. --}}
                                                <a href="{{ asset('storage/' . $ligne['photo']->affichee()?->url) }}" data-visionneuse="produits"
                                                    @if ($ligne['photo']->video) data-video @endif
                                                    data-legende="{{ $nommer }}" title="{{ __('Voir en grand') }}">
                                                    <img src="{{ $vignette }}" alt="" loading="lazy">
                                                </a>
                                            @endif
                                        </td>
                                        <td>
                                            <span class="fw-semibold">{{ $ligne['libelle'] }}</span>
                                            <span class="d-block small">{{ $type ?? __('sans type') }}</span>
                                        </td>
                                        <td class="text-end text-nowrap">
                                            <a href="{{ route('photos.index', ['q' => $ligne['libelle']]) }}" title="{{ __('Voir ces photos') }}">{{ number_format($ligne['n'], 0, ',', ' ') }}</a>
                                        </td>
                                        <td>
                                            <form method="POST" action="{{ route('photos.produits.rattacher') }}" class="d-flex flex-column gap-1"
                                                data-rattacher-produit
                                                data-question-modele="{{ trans_choice('Rattacher :n photo :quoi à :modele ?|Rattacher les :n photos :quoi à :modele ?', $ligne['n'], ['n' => $ligne['n'], 'quoi' => $nommer]) }}"
                                                data-question-etiquette="{{ trans_choice('Changer :quoi en étiquette « :etiquette » sur :n photo ?|Changer :quoi en étiquette « :etiquette » sur :n photos ?', $ligne['n'], ['n' => $ligne['n'], 'quoi' => $nommer, 'etiquette' => $etiquette]) }}"
                                                data-question-type="{{ trans_choice('Retirer :quoi de :n photo ? Le type suffit.|Retirer :quoi de :n photos ? Le type suffit.', $ligne['n'], ['n' => $ligne['n'], 'quoi' => $nommer]) }}">
                                                @csrf
                                                <input type="hidden" name="type_id" value="{{ $ligne['type_id'] }}">
                                                <input type="hidden" name="libelle" value="{{ $ligne['libelle'] }}">
                                                <input type="hidden" name="cible" data-produit-cible>
                                                <div class="d-flex flex-wrap gap-1 align-items-start">
                                                    <div class="form-control form-control-sm phototheque-saisie flex-grow-1" data-produit-choix>
                                                        <label class="visually-hidden" for="produit-{{ $loop->index }}">{{ __('Modèle, variation ou catégorie pour « :l »', ['l' => $ligne['libelle']]) }}</label>
                                                        <input type="text" id="produit-{{ $loop->index }}" data-produit-champ autocomplete="off" placeholder="{{ __('B-111, CLA-196, Portes…') }}">
                                                        <ul class="dc-menu" hidden></ul>
                                                    </div>
                                                    <button type="submit" name="geste" value="modele" class="btn btn-sm btn-primary">{{ __('Rattacher') }}</button>
                                                    <div class="btn-group">
                                                        <button type="button" class="btn btn-sm btn-outline-secondary dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
                                                            {{ __('Pas un modèle') }}
                                                        </button>
                                                        <ul class="dropdown-menu dropdown-menu-end">
                                                            <li><button type="submit" name="geste" value="etiquette" class="dropdown-item">{{ __('En faire l\'étiquette « :e »', ['e' => $etiquette]) }}</button></li>
                                                            @if ($type)
                                                                <li><button type="submit" name="geste" value="type" class="dropdown-item">{{ __('Le retirer, « :t » suffit', ['t' => $type]) }}</button></li>
                                                            @endif
                                                        </ul>
                                                    </div>
                                                </div>
                                                @if ($ligne['propositions'])
                                                    <div class="d-flex flex-wrap align-items-center gap-1 small">
                                                        {{ __('Au catalogue :') }}
                                                        @foreach ($ligne['propositions'] as $proposition)
                                                            <button type="button" class="btn btn-sm btn-outline-primary py-0" data-produit-proposer="{{ $proposition['v'] }}" data-nom="{{ $proposition['nom'] }}">{{ $proposition['nom'] }}</button>
                                                        @endforeach
                                                    </div>
                                                @endif
                                            </form>
                                        </td>
                                    </tr>
                                @endforeach
                            </tbody>
                    </table>
                @endif
            </div>
        </div>

        @if ($faits)
            <div class="card">
                <div class="card-body pt-3">
                    <h2 class="h5">{{ __('Déjà rattachés') }}</h2>
                    <p class="small mb-2">{{ __('Retenus hors de la base : ils sont refaits à chaque reconstruction de la photothèque. « Défaire » remet le libellé sur ses photos.') }}</p>
                    <ul class="list-unstyled d-flex flex-column gap-1 mb-0">
                        @foreach ($faits as $fait)
                            @php $quoi = trim(($fait['type'] !== '' ? \Illuminate\Support\Str::ucfirst($fait['type']) . ' ' : '') . '« ' . $fait['libelle'] . ' »'); @endphp
                            <li class="d-flex flex-wrap align-items-center gap-2">
                                <span class="me-auto">
                                    {{ $quoi }} <i class="bi bi-arrow-right" aria-hidden="true"></i> <span class="fw-semibold">{{ $fait['nom'] }}</span>
                                </span>
                                <form method="POST" action="{{ route('photos.produits.defaire') }}">
                                    @csrf
                                    <input type="hidden" name="cle" value="{{ $fait['cle'] }}">
                                    <button type="submit" class="btn btn-sm btn-outline-secondary"
                                        onclick="return confirm(this.dataset.question)"
                                        data-question="{{ __('Défaire :quoi → :nom ? Ses photos repassent en libellé.', ['quoi' => $quoi, 'nom' => $fait['nom']]) }}">
                                        {{ __('Défaire') }}
                                    </button>
                                </form>
                            </li>
                        @endforeach
                    </ul>
                </div>
            </div>
        @endif
    </section>

    {{-- Le catalogue entier, que le champ de chaque ligne propose
         (js/phototheque-produits.js) : une fois pour la page, hors de la zone. --}}
    <script>
        window.AC_CATALOGUE_MODELES = @json($catalogue);
    </script>

@endsection

@push('head')
    {{-- Le menu du champ est celui des étiquettes et des découpes. --}}
    <link rel="stylesheet" href="@assetV('css/commandes/decoupes-choix.css')">
    <link rel="stylesheet" href="@assetV('css/phototheque.css')">
@endpush

@push('scripts')
    <script src="@assetV('js/phototheque-produits.js')"></script>
@endpush