@extends("admin.layout.layout")
@section("styles")
    @php
        $titulo = "Matricula";
        $modulo = "Matricula";
        $vista="Matricular ahora";
    @endphp
    <title>{{getenv("APP_NAME")}} | {{$titulo }} {{$vista}}</title>
    <style>
        .custom-checkbox:disabled {
            opacity: 1; /* Restaurar la opacidad normal */
            cursor: not-allowed; /* Cambiar el cursor a 'not-allowed' */
        }
    </style>
@endsection

@section("contenido")
    <!--begin::Row-->
    @include("estudiante.perfil.components.header")

    <div class="row g-5">
        <form action="{{route("admin::matricula.insertar",["estudiante"=>$estudiante])}}" method="post" id="frm_matricula" enctype="multipart/form-data" >
            @csrf
            <div class="card mb-5">
                <div class="card-header">
                    <h3 class="card-title">
                    <span class="fw-bolder text-gray-800 fs-6 ml-4">
                        <span class="badge badge-circle badge-warning ">1 </span>
                        Escoge el nivel a matricular</span>
                    </h3>
                </div>
                <div class="card-body pb-0">
                    <div class="row">
                        <div class="col-md-3">
                            <label class="form-label required" for="curso_lectivo_id">Curso lectivo</label>
                            <select name="curso_lectivo_id" id="curso_lectivo_id" class="form-select form-select-lg mt-1" data-control="select2" data-placeholder="Seleccione..." data-allow-clear="false" data-hide-search="true" required>
                                @foreach($cursos_lectivos as $curso_lectivo)
                                    <option value="{{$curso_lectivo->id}}">{{$curso_lectivo->curso_lectivo}}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-md-3">
                            <label class="form-label required" for="nivel_id">Nivel a matricular</label>
                            <select name="nivel_id" id="nivel_id" class="form-select form-select-lg mt-1" data-control="select2" data-placeholder="Seleccione..." data-allow-clear="false" data-hide-search="true" required>
                                <option value="">-</option>
                                @foreach($niveles as $nivel)
                                    <option value="{{$nivel->id}}">{{$nivel->nivel}}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-md-2">
                            <label class="form-label required" for="plan_nacional">Plan nacional</label>
                            <select name="plan_nacional" id="plan_nacional" class="form-select form-select-lg mt-1" data-control="select2" data-placeholder="Seleccione..." data-allow-clear="false" data-hide-search="true" required>
                                <option value="0">NO</option>
                                <option value="1">SI</option>
                            </select>
                        </div>
                        <div class="col-md-3">
                            <label class="form-label required" for="seccion_id">Sección</label>
                            <select name="seccion_id" id="seccion_id" class="form-select form-select-lg mt-1" data-control="select2" data-placeholder="Seleccione..." data-allow-clear="false" required>
                                <option value="">-</option>
                            </select>
                        </div>
                    </div>
                    <div class="row mt-3 ">
                        <div class="col-md-4">
                            <table class="table table-condensed table-sm" id="tablaMaterias">
                                <thead>
                                <tr>
                                    <th width="5px"><b>Matricular</b></th>
                                    <th><b>Nivel</b></th>
                                    <th><b>Materia</b></th>
                                </tr>
                                </thead>
                                <tbody>

                                </tbody>
                            </table>
                        </div>
                    </div>

                    <div class="row mt-3 divEscogencia">
                        <div class="col-md-6">
                            <h4>Idioma</h4>
                            <table class="table table-condensed table-sm" id="tablaIdiomas">
                                <thead>
                                <tr>
                                    <th width="5px"><b>Matricular</b></th>
                                    <th><b>Materia</b></th>
                                </tr>
                                </thead>
                                <tbody>

                                </tbody>
                            </table>
                        </div>
                        <div class="col-md-6">
                            <h4>Tecnología</h4>
                            <table class="table table-condensed table-sm" id="tablaTecnologia">
                                <thead>
                                <tr>
                                    <th width="5px"><b>Matricular</b></th>
                                    <th><b>Materia</b></th>
                                </tr>
                                </thead>
                                <tbody>

                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
            <div class="card mb-5">
                <div class="card-header">
                    <h3 class="card-title">
                    <span class="fw-bolder text-gray-800 fs-6 ml-4">
                        <span class="badge badge-circle badge-warning ">3 </span>
                        Otra información
                    </span>
                    </h3>
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="col-md-6">
                            <label for="procedencia">¿Procede de otro colegio? o ¿De qué escuela para matricular de sétimo?.</label>
                            <input type="text" name="procedencia" id="procedencia" class="form-control">
                        </div>
                        <div class="col-md-12 mt-3  ">
                            <label for="observaciones">Observaciones</label>
                            <textarea type="text" name="observaciones" id="observaciones" class="form-control"></textarea>
                        </div>
                    </div>
                </div>
            </div>


            <div class="card mb-5">
                <div class="card-body">
                    <div class="form-check form-check-success mt-5">
                        <input class="form-check-input custom-checkbox acepto"  id="check_entiendo"  name="check_entiendo" type="checkbox" required >
                        <label for="check_entiendo"> <b>He revisado todos los antecedentes</b>
                        </label>
                    </div>
                    <div class="form-check form-check-success mt-5">
                        <input class="form-check-input custom-checkbox acepto"  id="check_acepto"  name="check_acepto" type="checkbox" required>
                        <label for="check_acepto"> <b>Presenta copia y original de todos los documentos adjuntados en este formulario digital.</b>
                        </label>
                    </div>

                    <div class="row mt-10">
                        <div class="d-flex justify-content-center my-5">
                            <button type="submit" id="btn_submit" class="btn btn-primary">Generar matricula</button>
                        </div>
                    </div>
                </div>
            </div>
        </form>
    </div>
@endsection

@section("scripts")
    <script> window.url_get = "{{ route('admin::nivel.materias.get',["nivel"=>":nivel_id", "curso_lectivo"=>":curso_lectivo_id"]) }}";</script>

    @vite(['resources/js/materias-nivel/getAdmin.js'])
    @vite(['resources/js/matriculas/insertar.js'])

@endsection