<%@ Page Title="" Language="vb" AutoEventWireup="false" MasterPageFile="~/Site.master" CodeBehind="VAAPBCpers.aspx.vb" Inherits="WebIntranet.VAAPBCpers" %>

<asp:Content ID="Content1" ContentPlaceHolderID="Content" runat="server">
    <div class="row pag">
        <div class="col-3" id="navLateral">
            <ul>
                <%--<li id='intPicadaBL' runat="server" class='obtListLat'><a onclick="redirigir()" href="intPicada.aspx">Introducir picada</a></li>--%>
                <li id='intPicadaPersBL' runat="server" class='obtListLat'><a onclick="redirigir()" href="intPicadaPersonal.aspx">Introducir picada a personal</a></li>
                <li id='Li1' runat="server" class='obtListLat'><a onclick="redirigir()" href="AnularPicadas.aspx">Anular picada a personal</a></li>
                <li id='informPicadasBL' class='obtListLat'><a onclick="redirigir()" href="listPicadas.aspx">Informe de listado de picadas</a></li>
                <li id='informIncidenciasBL' class='obtListLat'><a onclick="redirigir()" href="listSolicitudesComunicaciones.aspx">Informe de permisos y comunicaciones</a></li>
                <%--<li id='bolsaDeHorasBL' runat="server" class='obtListLat'><a onclick="redirigir()" href="/bolsaDeHoras.aspx">Bolsa de horas extraordinarias</a></li>--%>
                <%--<li id='VAAPBCBL' runat="server" class='obtListLat'><a onclick="redirigir()" href="/VAAPBC.aspx">Situación de vacaciones, asuntos particulares y días compensatorios</a></li>--%>
                <li id='VAAPBCBLpers' runat="server" class='obtListLat  listActivo'><a onclick="redirigir()" href="/VAAPBCpers.aspx">Situación de vacaciones, asuntos particulares y días compensatorios</a></li>
                <%--<li id='listIncPic' runat="server" class='obtListLat  listActivo'><a onclick="redirigir()" href="/VAAPBC.aspx">Situación de vacaciones, asuntos particulares y días compensatorios</a></li>--%>
                <li id='resumenIncidenciasEntreFechasBL' class='obtListLat'><a onclick="redirigir()" href="/resumenSolicitudesComunicacionesEntreFechas.aspx">Resumen de permisos y comunicaciones entre fechas</a></li>
                <li id='estIncPicBL' class='obtListLat'><a onclick="redirigir()" href="/estadoInciPicada.aspx">Estado de incidencias y picadas</a></li>
            </ul>
        </div>
        <div id="VAAPBC" class="col">

            <p class="tituloMobile">Situación de vacaciones, asuntos particulares y días compensatorios</p>
            <div class="migasDePan">
                <ul>
                    <li class="migaActiva">/ Control Horario</li>
                    <li onclick="MostrarPagina('VAAPBC','ControlHorario','VAAPBCBL')" class="migaActiva">/ Situación de vacaciones, asuntos particulares y días compensatorios </li>
                </ul>
            </div>
            <div class="row justify-content-center intAnyoNominas">
                <input id="inpAnyoVAAPBC" style="margin-inline: 10px;" type="text" maxlength="4" minlength="4" placeholder="introduce el año" runat="server" />
                <input type="button" style="margin-inline: 10px;" class="btnAzul btnAlargado" onclick="ListaVAAPBC()" value="Buscar" />
            </div>
            <div id="mensajeVAAPBC" runat="server"></div>
            <div id="tablaVAAPBC" class="cajaTabla"></div>




        </div>
    </div>
    <script>
        function ListaVAAPBC() {

            var html = ""
            var inpAnyo = $('#inpAnyoVAAPBC').val()
            $("#divLoading").css("display", "flex")
            $.ajax({
                type: "post",
                url: "/VAAPBCpers.aspx/VacacionesAsuntos",
                data: '{"anyo":"' + inpAnyo + '"}',
                async: true,
                contentType: "application/json; charset=utf-8",
                //dataType: "json",
                success: function (result) {
                    if (result.d != "") {
                        var tablaVAAPBC = JSON.parse(result.d.Result)

                        if (tablaVAAPBC.Resultado == "0") {
                            $('#mensajeVAAPBC').html("")
                            var html = ""
                            html += '<div id="accordion" class="accordion">'
                            var cont = 0
                            for (var i = 0; i < tablaVAAPBC.DiasVAB.length; i++) {
                                var per = tablaVAAPBC.DiasVAB[i]
                                html += '<div class="card">' +
                                    '<div class="justify-content-between align-items-center" id="headingT' + cont.toString() + '">' +
                                    '<h5 class="mb-0">' +
                                    '<button type="button" style="width:100%" class="btn btn-link row d-flex" data-toggle="collapse" data-target="#collapseT' + cont.toString() + '" aria-expanded="false" aria-controls="collapse' + cont.toString() + '">' +
                                    '<div class="col-2 d-flex" style="flex-direction:column; align-items:start;justify-content: space-around;">' +
                                    '<i class="fa-solid fa-chevron-down"></i>' +
                                    '<p style="margin:0;text-align:start; color:black;font-size:13px">' + per.Nombre.split(",")[0] + '</br>' + per.Nombre.split(",")[1] + '</p>' +
                                    '</div>' +
                                    '<div class="col-10 row">' +
                                    '<div class="col-4 celdaH"><p>Vacaciones</p></div>' +
                                    '<div class="col-4 celdaH"><p>Asuntos Propios</p></div>' +
                                    '<div class="col-4 celdaH"><p>Días Compensatorios</p></div>' +
                                    '<div class="col-1 celdaH p-0"><p style="font-size:9px; margin-bottom:0">T. Permitido</p></div>' +
                                    '<div class="col-1 celdaH p-0"><p style="font-size:9px; margin-bottom:0">T. Disfrutado</p></div>' +
                                    '<div class="col-2 celdaH p-0"><p style="font-size:9px; margin-bottom:0">Diferencia</p></div>' +
                                    '<div class="col-1 celdaH p-0"><p style="font-size:9px; margin-bottom:0">T. Permitido</p></div>' +
                                    '<div class="col-1 celdaH p-0"><p style="font-size:9px; margin-bottom:0">T. Disfrutado</p></div>' +
                                    '<div class="col-2 celdaH p-0"><p style="font-size:9px; margin-bottom:0">Diferencia</p></div>' +
                                    '<div class="col-1 celdaH p-0"><p style="font-size:9px; margin-bottom:0">T. Permitido</p></div>' +
                                    '<div class="col-1 celdaH p-0"><p style="font-size:9px; margin-bottom:0">T. Disfrutado</p></div>' +
                                    '<div class="col-2 celdaH p-0"><p style="font-size:9px; margin-bottom:0">Diferencia</p></div>' +
                                    '<div class="col-1 celdaD"><p>' + per.TotPerVa.toString() + '</p></div>' +
                                    '<div class="col-1 celdaD"><p>' + per.TotDisVa.toString() + '</p></div>' +
                                    '<div class="col-2 celdaD"><p>' + per.TotDifVa.toString() + '</p></div>' +
                                    '<div class="col-1 celdaD"><p>' + per.TotPerAp.toString() + '</p></div>' +
                                    '<div class="col-1 celdaD"><p>' + per.TotDisAp.toString() + '</p></div>' +
                                    '<div class="col-2 celdaD"><p>' + per.TotDifAp.toString() + '</p></div>' +
                                    '<div class="col-1 celdaD"><p>' + per.TotPerBc.toString() + '</p></div>' +
                                    '<div class="col-1 celdaD"><p>' + per.TotDisBc.toString() + '</p></div>' +
                                    '<div class="col-2 celdaD"><p>' + per.TotDifBc.toString() + '</p></div>' +
                                    '</div>' +
                                    '</button>' +
                                    '</h5>' +
                                    '</div>'
                                if (per.ListadoVaApBc.length == 0) {
                                    html += '<div id="collapseT' + cont.toString() + '" class="collapse" aria-labelledby="headingT' + cont.toString() + '" data-parent="#accordion">' +
                                        '<div class="card-body">Sin datos para mostrar</div></div>'
                                }
                                else {
                                    html += '<div id="collapseT' + cont.toString() + '" style="padding-inline:12px" class="collapse row" aria-labelledby="headingT' + cont.toString() + '" data-parent="#accordion">'
                                    html += "<div class='col-2'></div><div class='col-10'>"
                                    html += "<table class='tablaPicadas tblVAAPBC' style='max-heigth:700px; overflow:auto; width:100%'><col style='width:12%'><col style='width:12%'><col style='width:10%'><col style='width:60%'>" +
                                        '<tr><th>Fecha inicio</th><th>Fecha final</th><th>Total de días</th><th>Descripción</th></tr>'
                                    /*<th>Mañana</th><th>Tarde</th><col style='width:5%'><col style='width:5%'>*/
                                    for (var x = 0; x < per.ListadoVaApBc.length; x++) {
                                        var diPer = per.ListadoVaApBc[x]
                                        html += "<tr><td style='text-align:end'>" + fechaString(diPer.Fecha) +
                                            "</td><td style='text-align:end'>" + fechaString(diPer.FechaFin) +
                                            "</td><td style='text-align:end'>" + diPer.NumDias.toString() +
                                            "</td><td style='text-align:start'>" + diPer.Descripcion +
                                            "</td></tr>"
                                        //"</td><td style='text-align:center'>" + diPer.HorasManana +
                                        //"</td><td style='text-align:center'>" + diPer.HorasTarde +
                                    }

                                    html += "</table class='tablaPicadas tblVAAPBC'>"
                                    html += "</div></div>"
                                }

                                html += '</div>'
                                cont += 1
                            }

                            html += '</div>'
                            document.getElementById('tablaVAAPBC').innerHTML = html
                            $("#divLoading").css("display", "none")
                        }

                    }
                    else {
                        $("#divLoading").css("display", "none")
                        $('#mensajeVAAPBC').html("<p>ESTE AÑO NO CONTIENE DATOS</p>")
                        $('#tablaVAAPBC').css('display', 'none')
                        document.getElementById('tablaVAAPBC').innerHTML = ""
                    }
                },
                error: function (result) {

                    $("#divLoading").css("display", "none")
                    alert('error occured');
                    alert(result.responseText);
                },
            });
        }
        function fechaString(fecha) {
            var str = fecha.substring(8, 10) + "/" + fecha.substring(5, 7) + "/" + fecha.substring(0, 4)
            return str
        }
    </script>
</asp:Content>
