@extends('layouts.exat')
@section('title', 'Rôle : '.$role->name)
@section('subtitle', $nbUtilisateurs.' utilisateur(s)')

@section('content')
<form method="POST" action="{{ route('roles.update', $role) }}" class="mx-auto max-w-2xl">
    @csrf @method('PUT')
    <div class="mb-4"><a href="{{ route('utilisateurs.index', ['onglet' => 'roles']) }}" class="inline-flex rounded-lg p-2 text-slate-500 hover:bg-slate-100" aria-label="Retour"><svg class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke-width="1.8" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M10.5 19.5 3 12m0 0 7.5-7.5M3 12h18"/></svg></a></div>

    <section class="rounded-xl bg-white p-5 ring-1 ring-slate-200">
        <div>
            <label class="mb-1 block text-[11px] text-slate-400">Nom du rôle</label>
            @if($protege)
                <input value="{{ $role->name }}" disabled class="w-full rounded-lg border-slate-200 bg-slate-50 text-sm text-slate-500">
                <p class="mt-1 text-[11px] text-slate-400">Rôle système : le nom ne peut pas être modifié.</p>
            @else
                <input name="name" value="{{ old('name', $role->name) }}" required class="w-full rounded-lg border-slate-200 text-sm" style="text-transform:uppercase">
            @endif
        </div>

        <div class="mt-4 border-t border-slate-100 pt-4">
            <h3 class="mb-1 text-sm font-medium text-slate-900">Accès hérités par module</h3>
            @if($accesVerrouille)
                <p class="mb-3 text-[11px] text-slate-400">Ce rôle dispose d'un <b>accès complet</b> à tous les modules. Ces accès ne sont pas modifiables.</p>
                <div class="divide-y divide-slate-100">
                    @foreach($modules as $m)
                        <div class="flex items-center gap-3 py-2">
                            <div class="flex-1 text-sm text-slate-700">{{ $m->libelle }}</div>
                            <span class="rounded-lg bg-emerald-50 px-3 py-1.5 text-sm font-medium text-emerald-700">Écriture (complet)</span>
                        </div>
                    @endforeach
                </div>
            @else
                <p class="mb-3 text-[11px] text-slate-400">Ces niveaux s'appliquent par défaut à tout utilisateur portant ce rôle (sauf override utilisateur ou restriction de groupe).</p>
                <div class="divide-y divide-slate-100">
                    @foreach($modules as $m)
                        @php $val = $acces[$m->id] ?? 0; @endphp
                        <div class="flex items-center gap-3 py-2">
                            <div class="flex-1 text-sm text-slate-700">{{ $m->libelle }}</div>
                            <select name="acces[{{ $m->id }}]" class="rounded-lg border-slate-200 text-sm">
                                <option value="0" @selected($val == 0)>Aucun</option>
                                <option value="1" @selected($val == 1)>Lecture</option>
                                <option value="2" @selected($val == 2)>Écriture</option>
                            </select>
                        </div>
                    @endforeach
                </div>
            @endif
        </div>

        <div class="mt-4 flex items-center justify-between">
            @unless($protege)
                <button type="button" onclick="document.getElementById('form-suppr-role').submit()" class="text-sm text-red-600 hover:text-red-700">Supprimer ce rôle</button>
            @else
                <span></span>
            @endunless
            <button class="inline-flex h-10 items-center rounded-lg bg-emerald-600 px-4 text-sm font-medium text-white hover:bg-emerald-700">Enregistrer</button>
        </div>
    </section>
</form>

@unless($protege)
    <form id="form-suppr-role" method="POST" action="{{ route('roles.destroy', $role) }}" class="hidden"
          onsubmit="return confirm('Supprimer le rôle {{ $role->name }} ? Les utilisateurs concernés passeront au rôle USER.')">
        @csrf @method('DELETE')
    </form>
@endunless
@endsection