@extends('layout.qr')
@section('header')
@section('content')
<style>
    .centered {
        display: flex;
        align-items: center;
        justify-content: center;
    }
</style>

<div class="content text-center" style="margin-left:50px; margin-right:50px;">
    <div class="card border-dark ">
        <div class="card-header">
            Gestionar Procesos de Capacitación
        </div>
        <div class="card-body">
            <h4 class="mb-3">Procesos Activos</h4>
            <form action="updateLibro" method="post" id="form_cap">
                @csrf
                <select class="slc_capacitacion" id="select_capa" name="paquete_sel" onchange="getContenidoPrograma();">
                        <option value="">Seleccione un Programa</option>
                    @foreach($cap as $c)
                        <option value="{{$c->id}}">{{$c->nombre_paquete}}</option>
                    @endforeach
                </select>
                <br><br>
                <div id="contenedor_contenido" style="display: none;">
                    <h5>Capacitación / Evaluación Asociados</h5>
                    <select class="slc_contenido mt-3" id="contenido_programa" name="contenido_programa" onchange="getAlumnos();">
                      
                    </select>
                    <br><br>
                </div>
                <div id="contenedorAlumnos">
                    
                </div>
            </form>
        </div>
    </div>
</div>

@section('script')
@if (\Session::has('success'))
<script>
    Swal.fire({
    position: 'center',
    icon: 'success',
    title: 'Libro Actualizado',
    showConfirmButton: false,
    timer: 1500
    })
</script>
@elseif(\Session::has('sin_registro'))
<script>
    Swal.fire({
    position: 'center',
    icon: 'info',
    title: 'Debe ingresar participantes al Programa',
    showConfirmButton: false,
    timer: 1500
    })
</script>
@endif
<script>
    $('.slc_capacitacion').select2({width: '100%'});
    $('.slc_contenido').select2({width: '100%'});

    function getContenidoPrograma(){
    $.ajax({                        
            url: "getContenidoPrograma",
            type: "post",
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            },
            dataType:"json",
            data: {
                'id_paquete':$("#select_capa").val(),
            },
            beforeSend:function(){
                $("#contenido_programa").html("");
            },
            success: function(data)
            {    
                $("#contenedor_contenido").css('display','block');
                $(data).each(function( index ) {
                    $("#contenido_programa").append('\
                        <option value="'+data[index]['id']+'">'+data[index]['nombre']+'</option>\
                    ');
                });
            },
            error:function(data){
                console.log(data);
            }
        });
    }

    function getAlumnos(){
        if($("#select_capa").val() == ''){
            Swal.fire({
            position: 'center',
            icon: 'info',
            title: 'Seleccione un programa',
            showConfirmButton: false,
            timer: 1500
            })
        }
        else{
            $.ajax({                        
                url: "getAlumnosAsociados",
                type: "post",
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                dataType:"html",
                data: {
                    'id_paquete':$("#select_capa").val(),
                    'id_ev_cap':$("#contenido_programa").val(),
                },
                beforeSend:function(){
                    $("#contenedorAlumnos").html("");
                },
                success: function(data)
                {    
                    $("#contenedorAlumnos").html(data);
                },
                error:function(data){
                    console.log(data);
                }
            });
        }
    }
    function cerrarPrograma(){

        Swal.fire({
        title: '¿Desea cerrar el proceso:  '+$("#select_capa option:selected").text()+'?',
        text: "",
        icon: 'warning',
        showCancelButton: true,
        confirmButtonColor: '#3085d6',
        cancelButtonColor: '#d33',
        confirmButtonText: 'Cerrar'
        }).then((result) => {
        if (result.isConfirmed) {

 
            $.ajax({                        
                url: "cerrarPrograma",
                type: "post",
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                data: {
                    'id':$("#select_capa").val(),
                },
                beforeSend:function(){
                },
                success: function(data)
                {
                    Swal.fire({
                    position: 'center',
                    icon: 'success',
                    title: 'Programa cerrado Correctamente',
                    showConfirmButton: false,
                    timer: 1500
                    }).then((result)=>{
                        location.reload();
                    })
                },
                error:function(data){
                    console.log(data);
                }
            });
        }
        })
    }
</script>
@endsection
@endsection