@extends('layouts.horizontal', ['title' => 'Nuevo Módulo'])

@section('content')
<div class="container-fluid">

@include('layouts.partials.page-title', [
    'subtitle' => 'Seguridad',
    'title' => 'Nuevo Módulo'
])

<div class="card">
    <div class="card-body">

        @if ($errors->any())
            <div class="alert alert-danger">
                <ul class="mb-0">
                    @foreach ($errors->all() as $error)
                        <li>{{ $error }}</li>
                    @endforeach
                </ul>
            </div>
        @endif

        <form method="POST" action="{{ route('modulos.store') }}">
            @csrf

            <div class="row g-3">

                {{-- NOMBRE --}}
                <div class="col-md-4">
                    <label class="form-label">Nombre</label>
                    <input name="nombre"
                           class="form-control"
                           value="{{ old('nombre') }}"
                           required>
                </div>

                {{-- SLUG --}}
                <div class="col-md-4">
                    <label class="form-label">Slug</label>
                    <input name="slug"
                           class="form-control"
                           value="{{ old('slug') }}"
                           placeholder="ej: pacientes, citas"
                           required>
                </div>

                {{-- TIPO --}}
                <div class="col-md-4">
                    <label class="form-label">Tipo de Módulo</label>
                    <select name="tipo" class="form-select" required>
                        <option value="basico">Básico</option>
                        <option value="crud" selected>CRUD</option>
                        <option value="extra">Extra</option>
                        <option value="flujo">Flujo</option>
                    </select>
                </div>

                {{-- ORDEN --}}
                <div class="col-md-2">
                    <label class="form-label">Orden</label>
                    <input type="number"
                           name="orden"
                           class="form-control"
                           value="{{ old('orden', 0) }}">
                </div>

                {{-- ACTIVO --}}
                <div class="col-md-2 d-flex align-items-end">
                    <div class="form-check">
                        <input class="form-check-input"
                               type="checkbox"
                               name="activo"
                               {{ old('activo', true) ? 'checked' : '' }}>
                        <label class="form-check-label">
                            Activo
                        </label>
                    </div>
                </div>

                {{-- PADRE --}}
                <div class="col-md-6">
                    <label class="form-label">Módulo Padre</label>
                    <select name="parent_id" class="form-select">
                        <option value="">— Módulo Principal —</option>

                        @isset($modulosPadre)
                            @foreach($modulosPadre as $padre)
                                <option value="{{ $padre->id }}"
                                    {{ old('parent_id') == $padre->id ? 'selected' : '' }}>
                                    {{ $padre->nombre }}
                                </option>
                            @endforeach
                        @endisset
                    </select>
                </div>

            </div>

            <div class="text-end mt-4">
                <button class="btn btn-primary">
                    Guardar Módulo
                </button>
            </div>

        </form>
    </div>
</div>

</div>
@endsection