@extends('layouts.app')
@section('title', 'Ma signature — CABM')
@section('content')
    <h1>Ma signature</h1>
    <div class="split">
        <div>
            <div class="card">
                <h2>Nouveau message</h2>
                <p class="muted">Modèle : {{ $full['template'] ?? 'aucun' }}</p>
                @include('partials.signature-frame', ['html' => $full['html'] ?? '<em>Aucune signature</em>'])
                <h2 style="margin-top:16px">Réponse / transfert</h2>
                @include('partials.signature-frame', ['html' => ($reply['html'] ?? '') !== '' ? $reply['html'] : '<em>Aucune signature</em>'])
            </div>
        </div>

        <form method="post" action="{{ route('portal.update') }}" class="card">
            @csrf @method('PUT')
            <h2>Mes informations</h2>
            @if (! $profile['fields'])
                <p class="muted">Aucun champ n'est modifiable pour le moment. Vos informations viennent de l'annuaire de la collectivité :
                    pour les corriger, contactez le service des ressources humaines ou le support informatique.</p>
            @else
                <p class="muted">Ces valeurs ne modifient que votre signature, pas l'annuaire.</p>
                @foreach ($profile['fields'] as $f)
                    @php
                        $mode = ! $f['overridden'] ? 'directory' : ($f['override'] === '' ? 'hidden' : 'custom');
                        $id = 'f-'.$f['key'];
                    @endphp
                    <fieldset style="border:1px solid var(--line);border-radius:6px;padding:10px 12px;margin:12px 0" data-field>
                        <legend style="font-weight:600;font-size:13px;padding:0 4px">{{ $f['label'] }}</legend>
                        <label style="font-weight:400;margin:4px 0"><input type="radio" name="fields[{{ $f['key'] }}][mode]" value="directory" @checked($mode === 'directory')>
                            Annuaire : <strong>{{ $f['directory_value'] ?: '(vide)' }}</strong></label>
                        <label style="font-weight:400;margin:4px 0"><input type="radio" name="fields[{{ $f['key'] }}][mode]" value="custom" @checked($mode === 'custom')>
                            Valeur personnalisée</label>
                        <input type="text" id="{{ $id }}" name="fields[{{ $f['key'] }}][value]" value="{{ $mode === 'custom' ? $f['override'] : '' }}"
                               maxlength="120" @if ($f['type'] === 'phone') inputmode="tel" placeholder="ex. 06 12 34 56 78" @endif aria-label="{{ $f['label'] }} personnalisé">
                        <label style="font-weight:400;margin:4px 0"><input type="radio" name="fields[{{ $f['key'] }}][mode]" value="hidden" @checked($mode === 'hidden')>
                            Ne pas afficher</label>
                    </fieldset>
                @endforeach
            @endif

            <h2 style="margin-top:16px">En réponse et transfert</h2>
            @php $rv = $profile['reply_variant'] ?? 'default'; $labels = ['short' => 'signature courte', 'full' => 'signature complète', 'none' => 'aucune signature']; @endphp
            @foreach (['default' => 'Réglage par défaut ('.$labels[$profile['reply_variant_default']].')', 'short' => 'Signature courte', 'full' => 'Signature complète', 'none' => 'Aucune signature'] as $value => $label)
                <label style="font-weight:400;margin:4px 0"><input type="radio" name="reply_variant" value="{{ $value }}" @checked($rv === $value)> {{ $label }}</label>
            @endforeach

            <div class="row" style="margin-top:16px"><button class="btn" type="submit">Enregistrer</button></div>
        </form>
    </div>
@endsection

@push('scripts')
<script>
    // Saisir une valeur sélectionne automatiquement « Valeur personnalisée »
    document.querySelectorAll('[data-field] input[type=text]').forEach((input) => {
        input.addEventListener('input', () => {
            const custom = input.closest('[data-field]').querySelector('input[value=custom]');
            if (custom) custom.checked = true;
        });
    });
</script>
@endpush