@extends('pro.layout')
@php
    use App\Support\Content;
    use App\Support\Taxonomy;
    $jours = ['Lundi', 'Mardi', 'Mercredi', 'Jeudi', 'Vendredi', 'Samedi', 'Dimanche'];
    $tousServices = config('services_pro');
    $servicesActifs = old('services', $business?->services ?? []);
    $horaires = old('horaires', $business?->horaires ?? []);
@endphp

@section('pro')
    <form method="post" action="{{ url('/pro/fiche') }}" enctype="multipart/form-data" class="stack"
          data-deposit="{{ url('/data/arborescence.json') }}">
        @csrf

        <div class="panel">
            <div class="panel-head"><h2 style="font-size:1.1rem">Identité de l'établissement</h2></div>

            <select data-sel="rubrique" hidden><option value="annuaire" selected>Annuaire</option></select>
            <input type="hidden" name="category_path" data-category-path value="{{ old('category_path', $business?->category_path) }}">

            <div class="stack">
                <div class="grid grid-2" style="gap:14px">
                    <div class="field-group">
                        <label class="label" for="name">Nom commercial</label>
                        <input class="input @error('name') is-invalid @enderror" id="name" name="name"
                               value="{{ old('name', $business?->name) }}" required>
                        @error('name')<span class="field-error">{{ $message }}</span>@enderror
                    </div>
                    <div class="field-group">
                        <label class="label" for="siret">SIRET <span class="hint">(facultatif)</span></label>
                        <input class="input @error('siret') is-invalid @enderror" id="siret" name="siret"
                               maxlength="14" inputmode="numeric" value="{{ old('siret', $business?->siret) }}">
                        <span class="hint">Renseigné, il déclenche la vérification du badge « Professionnel vérifié ».</span>
                        @error('siret')<span class="field-error">{{ $message }}</span>@enderror
                    </div>
                </div>

                <div class="grid grid-4" style="gap:14px">
                    <div class="field-group">
                        <label class="label">Univers</label>
                        <select class="select @error('category_path') is-invalid @enderror" data-sel="univers"><option>Chargement…</option></select>
                    </div>
                    <div class="field-group">
                        <label class="label">Catégorie</label>
                        <select class="select" data-sel="categorie" disabled><option>—</option></select>
                    </div>
                    <div class="field-group">
                        <label class="label">Sous-catégorie</label>
                        <select class="select" data-sel="sous" disabled><option>—</option></select>
                    </div>
                    <div class="field-group">
                        <label class="label">Activité retenue</label>
                        <input class="input" data-category-label readonly value="—" tabindex="-1">
                    </div>
                </div>
                @error('category_path')<span class="field-error">{{ $message }}</span>@enderror

                <div class="field-group">
                    <label class="label" for="description">Présentation</label>
                    <textarea class="textarea @error('description') is-invalid @enderror" id="description" name="description"
                              rows="6" required>{{ old('description', $business?->description) }}</textarea>
                    <span class="hint">Ce texte apparaît en tête de votre fiche publique.</span>
                    @error('description')<span class="field-error">{{ $message }}</span>@enderror
                </div>
            </div>
        </div>

        <div class="panel">
            <div class="panel-head"><h2 style="font-size:1.1rem">Coordonnées</h2></div>

            <div class="grid grid-2" style="gap:14px">
                <div class="field-group">
                    <label class="label" for="adresse">Adresse</label>
                    <input class="input" id="adresse" name="adresse" value="{{ old('adresse', $business?->adresse) }}">
                </div>
                <div class="field-group">
                    <label class="label" for="ville">Ville</label>
                    <div class="input-icon">
                        <x-icon name="pin"/>
                        <input class="input @error('ville') is-invalid @enderror" id="ville" name="ville"
                               list="liste-villes" value="{{ old('ville', $business?->ville ?? auth()->user()->ville) }}" required>
                    </div>
                    <datalist id="liste-villes">
                        @foreach(Content::villes() as [$v, $c])<option value="{{ $v }}">{{ $c }}</option>@endforeach
                    </datalist>
                    @error('ville')<span class="field-error">{{ $message }}</span>@enderror
                </div>
                <div class="field-group">
                    <label class="label" for="cp">Code postal</label>
                    <input class="input @error('cp') is-invalid @enderror" id="cp" name="cp" maxlength="12"
                           value="{{ old('cp', $business?->cp ?? auth()->user()->cp) }}" required>
                    @error('cp')<span class="field-error">{{ $message }}</span>@enderror
                </div>
                <x-pays-select :value="old('pays', $business?->pays ?? auth()->user()->pays)"
                               hint="Hors de France, la fiche sort des filtres par département." />
                <div class="field-group">
                    <label class="label" for="tel">Téléphone</label>
                    <div class="input-icon">
                        <x-icon name="phone"/>
                        <input class="input" id="tel" name="tel" value="{{ old('tel', $business?->tel) }}">
                    </div>
                </div>
                <div class="field-group">
                    <label class="label" for="email">E-mail public</label>
                    <div class="input-icon">
                        <x-icon name="mail"/>
                        <input class="input @error('email') is-invalid @enderror" id="email" type="email"
                               name="email" value="{{ old('email', $business?->email) }}">
                    </div>
                    @error('email')<span class="field-error">{{ $message }}</span>@enderror
                </div>
                <div class="field-group">
                    <label class="label" for="site">Site web</label>
                    <div class="input-icon">
                        <x-icon name="globe"/>
                        <input class="input" id="site" name="site" value="{{ old('site', $business?->site) }}"
                               placeholder="www.mon-site.fr">
                    </div>
                </div>
            </div>
        </div>

        <div class="panel">
            <div class="panel-head"><h2 style="font-size:1.1rem">Horaires d'ouverture</h2></div>
            <p class="small muted" style="margin:0 0 14px">
                Format libre, par exemple <code>9h00 – 12h30 · 14h00 – 19h00</code>. Laissez vide ou écrivez « Fermé ».
            </p>

            <div class="stack">
                @foreach($jours as $jour)
                    <div class="row-center" style="gap:12px">
                        <label class="label" style="width:110px;margin:0" for="h-{{ $jour }}">{{ $jour }}</label>
                        <input class="input" id="h-{{ $jour }}" name="horaires[{{ $jour }}]" style="flex:1"
                               value="{{ $horaires[$jour] ?? '' }}" placeholder="Fermé">
                    </div>
                @endforeach
            </div>
        </div>

        <div class="panel">
            <div class="panel-head"><h2 style="font-size:1.1rem">Services proposés</h2></div>
            <div class="grid grid-3" style="gap:8px">
                @foreach($tousServices as $service)
                    <label class="check">
                        <input type="checkbox" name="services[]" value="{{ $service }}"
                               @checked(in_array($service, (array) $servicesActifs, true))>
                        {{ $service }}
                    </label>
                @endforeach
            </div>
        </div>

        <div class="panel">
            <div class="panel-head"><h2 style="font-size:1.1rem">Photos</h2></div>

            <x-photo-uploader :photos="$business?->images" :max="12"
                              titre="Logo, devanture, intérieur, réalisations…"
                              aide="JPG, PNG ou WebP · 12 photos maximum · 8 Mo par fichier"/>

            @error('photos')<span class="field-error">{{ $message }}</span>@enderror
            @error('photos.*')<span class="field-error">{{ $message }}</span>@enderror
        </div>

        <div>
            <button class="btn btn-primary btn-lg" type="submit">
                <x-icon name="check"/> {{ $business ? 'Enregistrer ma fiche' : 'Publier ma fiche' }}
            </button>
        </div>
    </form>
@endsection