@extends("admin.layout.layout")
@section("styles")
    @php
        $titulo = "Matricula $matricula->id";
        $modulo = "Matricula $matricula->id";
        $vista="Revisar";
    @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="row">
        <div class="card card-stretch col-md-12 mb-5">
            @if($matricula->tipo_estado_id==3)
                <h1 class="text-center text-danger">DENEGADA por {{$matricula->deniega->nombre_completo}}</h1>
                <h3 class="text-center text-danger">Justificación: {{$matricula->justificacion}} </h3>
            @endif
                <div class="card-header {{$matricula->tipo_estado_id==2?"bg-success":" bg-danger"}}">
                    <div class="d-flex justify-content-between align-items-center">
                        <h4 class="card-title">Matricula # {{$matricula->id}}</h4>
                        <div>
                            <a href="{{route('admin::estudiante.matriculas', $matricula->estudiante->id)}}">
                                <button class="btn btn-sm btn-dark">
                                    <i class="fas fa-backspace pe-2"></i> Volver
                                </button>
                            </a>
                            <a target="_blank" href="{{route('admin::matricula.pdf', $matricula->codigo)}}" class="mx-2">
                                <button class="btn btn-light-danger btn-sm">Comprobante</button>
                            </a>
                            <a target="_blank"  href="{{route('admin::matricula.constancia', $matricula->codigo)}}" class="mx-2">
                                <button class="btn btn-light-primary btn-sm">Constancia</button>
                            </a>
                        </div>
                    </div>
                </div>
            <div class="card-body">
                <table class="table table-striped">
                    <tr>
                        <td><b>Fecha:</b> {{date("d-m-Y H:i",strtotime($matricula->fecha))}}</td>
                        <td><b>Satélite:</b> {{$matricula->satelite->satelite}}</td>
                        <td><b>Grupo:</b> {{$matricula->grupo->grupo}} <button class="btn btn-warning btn-icon btn-sm" id="btnCambiarGrupo"> <i class="fas fa-pen"></i></button></td>

                    </tr>
                    @if($matricula->tipo_estado_id==2)
                        <tr>
                            <td><b>Funcionario VB:</b> {{$matricula->user->nombre_completo}}</td>
                            <td><b>Fecha VB:</b> {{date("d-m-Y H:i",strtotime($matricula->fecha_vb))}}</td>
                            <td><b>Grado:</b>
                                <select class="form-select form-select-sm" id="grado_matricula" name="grado_matricula" required>
                                    <option value="">-</option>
                                    @foreach($grados as $grado)
                                        <option value="{{$grado->id}}" {{$grado->id==$matricula->grado_id?"selected":""}}>{{$grado->grado}}</option>
                                    @endforeach
                                </select>
                            </td>
                        </tr>
                    @endif
                </table>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="card card-stretch col-md-12">
            <div class="card-header">
                <h4 class="card-title"><i class="fas fa-user pe-2 text-success"></i>Estudiante</h4>
            </div>
            <div class="card-body">
                <table class="table table-striped">
                    <tr>
                        <td><b>Nombre:</b> {{$matricula->estudiante->nombre}}</td>
                        <td><b>Primer Apellido:</b> {{$matricula->estudiante->primer_apellido}}</td>
                        <td><b>Segundo Apellido:</b> {{$matricula->estudiante->segundo_apellido}}</td>
                    </tr>
                    <tr>
                        <td><b>{{$matricula->estudiante->tipo_identificacion->tipo_identificacion}}:</b> {{$matricula->estudiante->identificacion}}</td>
                        <td><b>Nacionalidad:</b> {{$matricula->estudiante->tipo_nacionalidad->tipo_nacionalidad}}</td>
                        <td><b>Sexo:</b> {{$matricula->estudiante->tipo_sexo->tipo_sexo}}</td>
                    </tr>
                    <tr>
                        <td><b>Fecha de nacimiento:</b> {{date("d-m-Y",strtotime($matricula->estudiante->nacimiento))}}</td>
                        <td><b>Celular:</b> {{$matricula->estudiante->celular}}</td>
                        <td><b>Teléfono:</b> {{$matricula->estudiante->telefono}}</td>
                    </tr>
                    <tr>
                        <td><b>Ruta:</b> {{$matricula->estudiante->ruta->ruta}}</td>
                        <td><b>Primer curso:</b> {{$matricula->estudiante->primer_curso_lectivo}}</td>
                    </tr>
                    <tr>
                        <td colspan="3"><b>Correo:</b> {{$matricula->estudiante->correo}}</td>
                    </tr>

                    <tr>
                        <td colspan="3"><b>Dirección:</b> {{$matricula->estudiante->direccion}}</td>
                    </tr>


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

        <div class="card card-stretch col-md-9 mt-2">
            <div class="card-header">
                <h4 class="card-title">
                    <i class="fas fa-books pe-2 text-success"></i>
                    Materias</h4>

                <div class="card-toolbar">
                    <button type="button" class="btn btn-sm btn-success" id="agregarMateria">Agregar modulo</button>
                </div>
            </div>
            <div class="card-body">
                <table class="table table-hover">
                    <thead>
                    <tr>
                        <th><b>Modulo</b></th>
                        <th><b>Grado</b></th>
                        <th><b>Asignatura</b></th>
                        <th><b>Creditos</b></th>
                        <th></th>
                    </tr>
                    </thead>
                    <tbody>
                    @foreach($modulos_m as $modulo_m)
                        <tr>
                            <td>{{$modulo_m->modulo->modulo}}</td>
                            <td>{{$modulo_m->modulo->asignatura->asignatura}}</td>
                            <td>{{$modulo_m->modulo->grado->grado}}</td>
                            <td>{{$modulo_m->modulo->creditos}}</td>
                            <td>
                                <button type="button" class="btn btn-danger btn-sm borrarModulo" value="{{$modulo_m->id}}"><i class="fas fa-trash" title="Eliminar"></i></button>
                            </td>
                        </tr>
                    @endforeach
                    <tr>
                        <td colspan="2"></td>
                        <td><b>Total créditos:</b></td>
                        <td><b>{{$matricula->total_creditos}}</b></td>
                    </tr>
                    </tbody>
                </table>
            </div>
        </div>



        <div class="card card-stretch col-md-3 mt-2">
            <div class="card-header">
                <h4 class="card-title">
                    <i class="fas fa-folder pe-2 text-success"></i>
                    Documentos</h4>

                <div class="card-toolbar">
                    <button class="btn btn-sm btn-success">Agregar documento</button>
                </div>
            </div>
            <div class="card-body">
                <table class="table table-hover">
                    <thead>
                    <tr>
                        <th><b>Requisito</b></th>
                        <th><b>Documento</b></th>
                        <th></th>
                    </tr>
                    </thead>
                    <tbody>
                    @foreach($media as $archivo)
                        <tr>
                            <td>{{$archivo->requisito}}</td>
                            <td>
                                <a href="{{ route('admin::matricula.ver.media', ['uuid' => $archivo->media->uuid]) }}" target="_blank">
                                    {{ $archivo->media->uuid }}
                                </a>
                            </td>
                            <td>
                                {{--                                <button type="button" class="btn btn-danger btn-sm " value="{{$materia->id}}"><i class="fas fa-trash" title="Eliminar"></i></button>--}}
                            </td>
                        </tr>
                    @endforeach
                    </tbody>
                </table>
            </div>
        </div>




        <div class="card card-stretch col-md-12 mt-5">
            <div class="card-body">
                <div class="d-flex justify-content-between">
                    @if($matricula->tipo_estado_id!=3)
                        <div class="text-start">
                            <button class="btn btn-danger btn-sm mx-5 denegar"> <i class="fas fa-close"></i> Denegar</button>
                        </div>
                    @endif
                    @if($matricula->tipo_estado_id==3 ||  $matricula->tipo_estado_id==1)
                        <div class="text-center">
                            <button class="btn btn-success  mx-5 vistoBueno"> <i class="fas fa-thumbs-up"></i> Dar visto bueno</button>
                        </div>
                    @endif
                </div>
            </div>
        </div>

    </div>

    <div class="modal fade" id="modalGrupo" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Cambiar de grupo </h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <div class="mb-3">
                        <label for="satelite_id" class="form-label">Satélite</label>
                        <select name="satelite_id" id="satelite_id" class="form-select form-select-sm">
                            @foreach($satelites as $satelite)
                                <option value="{{$satelite->id}}" {{$satelite->id==$matricula->satelite_id?"selected":""}}>{{$satelite->satelite}}</option>)
                            @endforeach
                        </select>
                    </div>
                    <div class="mb-3">
                        <label for="grupo_actual" class="form-label">Grupo actual</label>
                        <input type="text" class="form-control" id="grupo_actual" name="grupo_actual" value="{{$matricula->grupo->grupo}}" disabled>
                    </div>
                    <div class="mb-3">
                        <label for="notas" class="form-label">Notas</label>
                        <input type="text" class="form-control" id="notas" name="notas" placeholder="Razón del cambio">
                    </div>
                    <div class="mb-3">
                        <label class="form-label">Grupos disponibles</label>
                        <table class="table table-hover" id="tblGrupos">
                            <thead>
                            <tr>
                                <th><b>Grupo</b></th>
                                <th><b>Cupo</b></th>
                                <th><b>Disponible</b></th>
                            </tr>
                            </thead>
                            <tbody></tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>


    <div class="modal fade" id="modalAgregarModulo" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Agregar modulo a la matricula</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <form action="{{route("admin::matricula.agregar.modulo",$matricula->id)}}" method="post" id="frmAgregarModulo">
                    @csrf
                    <div class="modal-body">
                        <div class="mb-3">
                            <div class="row">
                                <div class="col-md-12">
                                    <label class="form-label required" for="nivel_id">Grado</label>
                                    <select name="grado_id" id="grado_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($grados as $grado)
                                            <option value="{{$grado->id}}">{{$grado->grado}}</option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="col-md-12">
                                    <label class="form-label required" for="asignatura_id">Asignatura</label>
                                    <select name="asignatura_id" id="asignatura_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($asignaturas as $asignatura)
                                            <option value="{{$asignatura->id}}">{{$asignatura->asignatura}}</option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="col-md-12 mt-5">
                                    <label class="form-label required" for="materia_id">Modulo</label>
                                    <select name="modulo_id" id="modulo_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>
                    </div>
                    <div class="modal-footer">
                        <button type="submit" class="btn btn-sm btn-success"> Agregar modulo</button>
                    </div>
                </form>

            </div>
        </div>
    </div>
        @endsection

        @section("scripts")
            <script>
                $( document ).ready(function() {
                    $('.vistoBueno').click(function() {
                        let grado_matricula=$("#grado_matricula").val();
                        if(grado_matricula==""){
                            Swal.fire({title: 'Debe seleccionar un grado', icon: 'error', confirmButtonColor: '#b0051b',});
                            return;
                        }
                        // Mostrar un cuadro de diálogo modal personalizado
                        Swal.fire({
                            title: '¿Está seguro de dar el visto bueno?',
                            icon: 'question',
                            showCancelButton: true,
                            confirmButtonColor: '#01591a',
                            cancelButtonColor: '#a1a1a1',
                            cancelButtonText: 'Cancelar',
                            confirmButtonText: 'Sí, dar visto bueno'
                        }).then((result) => {
                            if (result.isConfirmed) {
                                let url="{{route("admin::matricula.vb", $matricula->id)}}";
                                let ajax=$.ajax({
                                    url: url,
                                    type: 'POST',
                                    dataType:"json",
                                    headers: {
                                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                                    },
                                });
                                ajax.done(function(response) {
                                    location.reload();
                                });
                                ajax.fail(function(error) {
                                    console.error('Error en la solicitud AJAX', error);
                                });
                            }
                        });
                    });

                    $('.denegar').click(function() {
                        // Mostrar un cuadro de diálogo modal personalizado
                        Swal.fire({
                            title: '¿Está seguro de denegar la matricula?',
                            icon: 'error',
                            showCancelButton: true,
                            confirmButtonColor: '#b0051b',
                            cancelButtonColor: '#a1a1a1',
                            cancelButtonText: 'Cancelar',
                            confirmButtonText: 'Sí, denegar',
                            input: 'text',
                            inputLabel: 'Justificación',
                            inputPlaceholder: 'Escribe una justificación...',
                            allowOutsideClick: () => !Swal.isLoading()
                        }).then((result) => {
                            if (result.isConfirmed) {
                                let justificacion = result.value;
                                let url="{{route("admin::matricula.denegar", $matricula->id)}}";
                                let ajax=$.ajax({
                                    url: url,
                                    type: 'POST',
                                    dataType:"json",
                                    data:{"justificacion":justificacion},
                                    headers: {
                                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                                    },
                                });
                                ajax.done(function(response) {
                                    location.reload();
                                });
                                ajax.fail(function(error) {
                                    console.error('Error en la solicitud AJAX', error);
                                });
                            }
                        });
                    });

                    $('#btnCambiarGrupo').click(function() {
                        cargarGrupos();
                        $("#modalGrupo").modal({backdrop: 'static', keyboard: false}).modal('show');
                    });

                    $('#satelite_id').on('change', function() {
                        cargarGrupos();
                    });
                });

                $(document).on("click", ".nuevoGrupo", function() {
                    let grupo_id= $(this).data("value");
                    let grupo= $(this).data("grupo");
                    let disponible= $(this).data("disponible");
                    let notas= $("#notas").val();
                    Swal.fire({
                        title: '¿Está seguro de hacer el cambio de grupo?',
                        icon: 'question',
                        showCancelButton: true,
                        confirmButtonColor: '#01591a',
                        cancelButtonColor: '#a1a1a1',
                        cancelButtonText: 'Cancelar',
                        confirmButtonText: 'Sí, cambiar a '+grupo,
                    }).then((result) => {
                        if (result.isConfirmed) {
                            let url="{{route("admin::matricula.cambiar.grupo", $matricula->id)}}";
                            let ajax=$.ajax({
                                url: url,
                                type: 'POST',
                                dataType:"json",
                                data:{"grupo_id":grupo_id,"notas":notas},
                                headers: {
                                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                                },
                            });
                            ajax.done(function(response) {
                                location.reload();
                            });
                            ajax.fail(function(error) {
                                console.error('Error en la solicitud AJAX', error);
                            });
                        }
                    });

                });

                function cargarGrupos(){
                    $("#tblGrupos tbody").html("");
                    let grupo_excepcion= "{{$matricula->grupo_id}}";
                    let satelite_id= $("#satelite_id").val();

                    let url="{{route("admin::grupos.porCicloSatelite", ["ciclo"=>":ciclo","satelite"=>":satelite"])}}".replace(":ciclo", "{{$matricula->grupo->ciclo_id}}").replace(":satelite", satelite_id);
                    let ajax=$.ajax({
                        url: url,
                        dataType:"json",
                        data:{"grupo_excepcion":grupo_excepcion},
                        headers: {
                            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                        },
                    });
                    ajax.done(function(response) {
                        $.each(response, function(i, e) {
                            $("#tblGrupos tbody").append('<tr>' +
                                '<td>'+e.grupo+'</td>' +
                                '<td>'+e.cupo+'</td>' +
                                '<td>'+e.disponible+'</td>' +
                                '<td>' + (e.disponible > 0 ? '<button class="btn btn-sm btn-warning nuevoGrupo" data-value="'+e.id+'" data-disponible="'+e.disponible+'" data-grupo="'+e.grupo+'">Cambiar</button>' : '') + '</td>' +
                                '</tr>'

                            )
                        });
                    });
                }

                $(document).on("click", "#agregarMateria", function() {
                    $("#modalAgregarModulo").modal({backdrop: 'static', keyboard: false}).modal('show');
                });
                $(document).on("change", "#grado_id, #asignatura_id", function() {
                    let grado_id=$("#grado_id").val();
                    let asignatura_id=$("#asignatura_id").val();

                    if(grado_id=="" || asignatura_id==""){
                        return;
                    }

                    let url="{{route("admin::modulos.grado.asignatura",["grado"=>":grado", "asignatura"=>":asignatura"])}}".replace(":grado", grado_id).replace(":asignatura", asignatura_id);
                    $("#modulo_id").empty();
                    let ajax=$.ajax({
                        url: url,
                        dataType:"json",
                        headers: {
                            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                        },
                    });
                    ajax.done(function(response) {
                        $.each(response, function(i, e) {
                            $("#modulo_id").append('<option value="' + e.id + '">' + e.modulo + '</option>');
                        });
                    });
                });

                $(document).on('submit', '#frmAgregarModulo', function(e) {
                    e.preventDefault()

                    let ajax=$.ajax({
                        type: "POST",
                        url: this.action,
                        dataType: "json",
                        method: "post",
                        data: $(this).serialize(),
                    })
                    ajax.done(function(response) {
                        location.reload();
                    });
                });

                $(document).on("click", ".borrarModulo", function() {
                    let matricula_modulo_id=$(this).val();

                    Swal.fire({
                        title: '¿Está seguro de eliminar este modulo?',
                        icon: 'question',
                        showCancelButton: true,
                        confirmButtonColor: '#860404',
                        cancelButtonColor: '#a1a1a1',
                        cancelButtonText: 'Cancelar',
                        confirmButtonText: 'Sí, Eliminar',
                    }).then((result) => {
                        if (result.isConfirmed) {
                            let url="{{route("admin::matricula.borrar.modulo",":matriculaModulo")}}";
                            url = url.replace(":matriculaModulo", matricula_modulo_id);
                            let ajax=$.ajax({
                                url: url,
                                dataType:"json",
                                method:"post",
                                headers: {
                                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                                },
                            });
                            ajax.done(function(response) {
                                location.reload();
                            });
                        }
                    })
                });

                $(document).on("change", "#grado_matricula", function() {
                    let grado_id=$(this).val();
                    if  (grado_id==""){
                        return;
                    }
                    let matricula_id="{{$matricula->id}}";
                    let url="{{route("admin::matricula.setGrado",":matricula")}}";
                    url = url.replace(":matricula", matricula_id);
                    let ajax=$.ajax({
                        url: url,
                        type: 'POST',
                        dataType:"json",
                        data:{"grado_id":grado_id},
                        headers: {
                            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                        },
                    });
                    ajax.done(function(response) {
                        location.reload();
                    });
                });



            </script>
@endsection