@extends("admin.layout.layout")
@section("styles")
    @php
        $titulo = "Matriculas";
        $modulo = "Matriculas";
        $vista="Denegadas";
    @endphp
    <title>{{getenv("APP_NAME")}} | {{$titulo }} {{$vista}}</title>
    <link href="assets/plugins/custom/datatables/datatables.bundle.css" rel="stylesheet" type="text/css" />

    <style>
        #tabla thead th {
            font-weight: bold;
        }
    </style>

@endsection

@section("contenido")
    <div class="d-flex mx-3">
        <div class="form-group">
            <label for="seccion_id" >Sección</label>
            <select class="form-select form-select-sm" id="seccion_id" name="seccion_id">
                @foreach($secciones as $seccion)
                    <option value="{{$seccion->id}}">{{$seccion->seccion}}</option>

                @endforeach
            </select>
        </div>

    </div>    <div class="row gx-5 gx-xl-10">
        <div class="card mt-1">
            <div class="card-body my-0">
                <div class="row">
                    <div class="col-md-12">
                        <table id="tabla" class="table table-hover"></table>
                    </div>
                </div>
            </div>
        </div>

    </div>
@endsection

@section("scripts")
    <script src="assets/plugins/custom/datatables/datatables.bundle.js"></script>

    <script>
        let tabla;
        let url_dt="{{route('admin::matriculas.denegadas.dataTable',"1")}}";
        $( document ).ready(function() {
            tabla= $('#tabla').DataTable({
                dom:
                    "<'row'<'col-sm-6 text-left'f><'col-sm-6 text-right'B>>" +
                    "<'row'<'col-sm-12'tr>>" +
                    "<'row'<'col-sm-12 col-md-5'i><'col-sm-12 col-md-7 dataTables_pager'lp>>",

                buttons: [
                    'excelHtml5',
                    'pdfHtml5',
                ],
                responsive: true,
                fixedHeader: true,
                pageLength : 25,
                processing: true,
                language: { url: "//cdn.datatables.net/plug-ins/1.10.22/i18n/Spanish.json" },
                ajax: {
                    url: url_dt,
                    type: 'GET',
                    dataType: 'json',
                },
                order: [[4,"asc"],[5,"asc"],[6,"asc"]],
                columns: [
                    {title:"#", data: 'id', },
                    {title:"Fecha", data: 'fecha', render: data => data ? new Date(data).toISOString().slice(0, 10) : '' },
                    {title:"Tipo identificación", data: 'estudiante.tipo_identificacion.tipo_identificacion', },
                    {title:"Identificación", data: 'estudiante.identificacion', },
                    {title:"Primer apellido", data: 'estudiante.primer_apellido', },
                    {title:"Segundo apellido", data: 'estudiante.segundo_apellido', },
                    {title:"Nombre", data: 'estudiante.nombre', responsivePriority: 1 },
                    {title:"Sección", data: 'seccion.seccion', },
                    {title:"Celular", data: 'estudiante.celular', },
                    {title:"Acciones", data: null, responsivePriority: 2,
                        render: function (data, type, row) {
                            return'<a class="btn btn-primary btn-sm" href="' + "{{ route('admin::matricula.revisar',':id') }}".replace(':id', data.id) + '">Revisar</a>';
                        }
                    },
                ],
            });

            $('#seccion_id').on('change', function () {
                let id = $(this).val();
                let url_dt="{{route('admin::matriculas.denegadas.dataTable',":id")}}";
                url_dt=url_dt.replace(":id",id);
                tabla.ajax.url(url_dt).load();
            });
        });
    </script>
@endsection