<?php
error_reporting(E_ALL & ~E_NOTICE);
ini_set("display_errors", 1);

require_once 'class/c_login.php';

$user = Login::get_user();

$user->access('reporte_de_asistencias');
if (in_array($user->acceso, ['n']))
    die(header('Location: main.php?error=1'));

$user->print_to_log('Consultar asistencia');
# Select carreras from facultad
$fs_carrera = queryAll(
    "SELECT * FROM FS_CARRERA(:facultad)",
    array(
        ":facultad" => $user->facultad["facultad_id"]
    )
);

$fs_periodo = queryAll(
    "SELECT * FROM FS_PERIODO(:periodo, :nivel, :estado)",
    array(
        ":periodo" => null,
        ":nivel" => null,
        ":estado" => 1,
    )
);

extract($_POST);
$retardos = query("SELECT FS_HAS_RETARDO(:facultad) r", [":facultad" => $user->facultad["facultad_id"]])['r'];
?>

<!DOCTYPE html>
<html lang="en">

<head>
    <title>Reporte asistencias | <?= $user->facultad['facultad'] ?? 'General' ?></title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <?php include_once "import/html_css_files.php"; ?>
</head>

<body style="display: block;">
    <?php
    include("import/html_header.php");
    html_header("Reporte asistencias | " . ($user->facultad["facultad"] ?? "General"), "Sistema de gestión de checador");
    ?>
    <main class="container content marco content-margin">
        <section id="message"></section>
        <!-- Ajax form -->
        <!-- Select periodo -->
        <?php include_once 'import/html_forms_asistencia.php'; ?>
        <!-- Space -->
        <div class="row">
            <div class="col-12">
                <hr>
            </div>
        </div>

        <!-- Table  template_table_asistencia -->

        <div id="table-asistencia" class="table-responsive"></div>
        <?php
        include_once 'include/constantes.php';
        ?>
        <template id="asistencias">
            <p class="text-right">

                <button class="btn btn-outline-secondary " id="btn-excel-asistencia" title="Exportar a Excel">
                    <?php echo $ICO["descargar"]; ?></i> Exportar
                </button>
            </p>

            <table class="table table-striped table-hover table-white table-sm">
                <!-- Table primary -->

                <thead class="thead-dark">
                    <tr>
                        <th id="order-cve" style="cursor: pointer;" onclick="asistenciasOrderby('cve')">Clave</th>
                        <th id="order-name" style="cursor: pointer;" onclick="asistenciasOrderby('name')">Nombre</th>
                        <!-- Column small width -->
                        <th id="order-absence" style="cursor: pointer;" onclick="asistenciasOrderby('absence')">
                            <span>Total clases</span>
                        </th>
                        <th>
                        </th>
                    </tr>
                </thead>
                <tbody id="table-registros" class="text-center">
                    <!-- Ajax table -->

                </tbody>
            </table>
        </template>
        <div class="d-none" id="hidden-forms"></div>

        <?php include_once "import/html_scroll.php"; ?>
    </main>
    <?php
    require_once("import/html_footer.php");
    ?>

    <script src="js/bootstrap/popper.min.js"></script>
    <script src="js/bootstrap/bootstrap.min.js"></script>
    <script src="js/fetchlib.js"></script>
    <script src="js/barra.js"></script>
    <script>
        var asistencias = [];
        var order = {
            by: "",
            order: false
        };
        $(document).ready(function() {
            var errores = 0;

            // Vista profesor
            $("#form-asistencia").keydown(function(event) {
                if (event.keyCode == 13) {
                    event.preventDefault();
                    $("#btn-buscar").click();

                    return false;
                }
            });

            $(document).on("click", "#btn-excel-asistencia", function() {
                // send asistencias to page
                var form = document.createElement("form");
                form.setAttribute("method", "post");
                form.setAttribute("action", "action/action_asistencias_excel.php");
                form.setAttribute("target", "_blank");

                var hiddenField = document.createElement("input");
                hiddenField.setAttribute("type", "hidden");
                hiddenField.setAttribute("name", "asistencias");
                hiddenField.setAttribute("value", JSON.stringify(asistencias));
                form.appendChild(hiddenField);

                document.body.appendChild(form);
                form.submit();
            })
        });

        function validateDateRange(fecha_inicial, fecha_final) {
            var fecha_inicial = new Date(fecha_inicial);
            var fecha_final = new Date(fecha_final);

            return fecha_inicial <= fecha_final;
        }

        function fillTable() {
            $("#table-asistencia").empty();
            // add filter
            if (asistencias.length == 0) {
                triggerMessage("No se encontraron resultados", "Sin resultados", "warning");
                return;
            } else if (asistencias.error != undefined) {
                triggerMessage(asistencias.error, "Error en los datos");
                return;
            }
            var template = $("template#asistencias");
            // append the template to the div#table-asistencia
            $("#table-asistencia").append(template.html());
            // fill the table
            for (var i = 0; i < asistencias.length; i++) {
                var row = asistencias[i];
                var tr =
                    `<tr id="${row.profesor_id}">
                                <td>${row.profesor_clave}</td>
                                <td>${row.profesor_nombre}</td>
                                <td class="px-4 py-2" id="barra-${row.profesor_id}">${barra(row, <?= $retardos ? "true" : "false" ?>)}</td>
                                <td>
                                    <a href="#" id="profesor-${row.profesor_id}">
                                        <?php echo $ICO['ojo']; ?>
                                    </a>
                                </td>
                            </tr>`;
                $("#table-asistencia table tbody").append(tr);
            }

            if (retardo)
                $(".retardos-h").show();
            else
                $(".retardos-h").hide();
        }

        function asistenciasOrderby(by) {
            switch (by) {
                case "cve":
                    asistencias.sort((a, b) => (a.cve > b.cve) ? 1 : -1);
                    break;
                case "name":
                    asistencias.sort((a, b) => (a.name > b.name) ? 1 : -1);
                    break;
                case "absence":
                    asistencias.sort((a, b) => (a.absence > b.absence) ? 1 : -1);
                    break;
            }
            fillTable();

            // icon <i id="caret" class="ing-caret ing-fw"></i>
            var column = $("#order-" + by)

            if (order.by != by)
                order.order = false;

            if (order.order)
                column.append("<i id='caret' class='ing-caret ing-fw'></i>");
            else
                column.append("<i id='caret' class='ing-caret ing-fw ing-rotate-180'></i>");

            order.by = by;
            order.order = !order.order;


            $("#caret").toggleClass("ing-rotate-180");

            // remove caret from other columns
            $("#order-cve, #order-name, #order-absence").not("#order-" + by).find("#caret").remove();
        }

        $("#asistencia").on("submit", async function(e) {
            e.preventDefault();
            // validar que los datalist esten seleccionados
            if (!validateDatalist("#periodo") || !validateDatalist("#filter_facultad")) {
                triggerMessage("Por favor, seleccione una opción de cada lista desplegable", "Error en los datos");
                return;
            }

            // suspender el boton
            $("#btn-buscar").prop("disabled", true);
            $("#btn-buscar").html("Buscando...");
            $formData = new FormData();
            $formData.append("periodo", $("#periodo").val());
            $formData.append("facultad", <?= $user->facultad['facultad_id'] ?>);
            $formData.append("carrera", $("#filter_carrera").val());
            $formData.append("clave", $("#filterClave").val().replace(/[a-zA-Z]{2}/, '').replace(/^0+/, ''));
            $formData.append("nombre", $("#filterNombre").val());
            $formData.append("fecha_inicial", $("#fecha_inicial").val());
            $formData.append("fecha_final", $("#fecha_final").val());

            const data = await fetch("action/action_asistencias.php", {
                method: "POST",
                body: $formData,
            });

            const dataJson = await data.json();
            
            if (dataJson.error) {
                triggerMessage(data.error, "Error en los datos");
                return;
            }
            
            retardo = dataJson.retardo.retardo;
            asistencias = dataJson.reporte;

            fillTable();

            $("#btn-buscar").prop("disabled", false);
            $("#btn-buscar").html(`<?= $ICO['buscar'] ?> Buscar asistencias`);
        });
        // function to put it into a loading state

        $(document).on("click", "a[id^='profesor-']", function(e) {
            // loading state
            e.preventDefault();
            // spinner
            $(this).html(
            `
            <div class="spinner-border spinner-border-sm text-primary" role="status">
                <span class="sr-only">Cargando...</span>
            </div>
            `)
            // disable all the other links
            $("a[id^='profesor-']").not(this).prop("disabled", true);

            // Make a form to send the data
            submit("vista_profesor.php", {
                id: $(this).attr("id").replace("profesor-", ""),
                periodo: <?= $user->periodo_id ?>,
                facultad: <?= $user->facultad['facultad_id'] ?>,
                carrera: $('#filter_carrera').val(),
                clave: $('#filterClave').val().replace(/[a-zA-Z]{2}/, ''),
                nombre: $('#filterNombre').val(),
                fecha_inicial: $('#fecha_inicial').val(),
                fecha_final: $('#fecha_final').val()
            });
        });

        <?php if (!empty($_POST)) { ?>
            $('#asistencia').submit();
        <?php } ?>
    </script>
</body>

</html>