<?php
require_once("../../app/functions.php");
if (comprobar_override(str_replace($_SERVER['DOCUMENT_ROOT'], '', __FILE__)))
    exit;
$pag = basename($_SERVER['PHP_SELF']);
gen_plantilla(true, $pag, true, true, "Historial Horas Sistema", true, true);

if ($_SESSION['tipo_usuario'] != 'admin') {
    crear_notificacion("error", "No tienes acceso a esta página");
    header("Location: /views/tables/fichajes");
    exit;
}
?>

<section class="cristal" <?= (!get_config_usuario($_SESSION['id_usuario'], 'reducir_efectos_movimiento')) ? 'style="view-transition-name: cristal;"' : '' ?>>
    <h1 class="resaltado textocentrado">Historial de horas agregadas por el sistema</h1>
    
    <section class="flex row supercentrado gap1 wrap" style="margin-bottom: 1rem;">
        <label class="flex column">
            Empleado
            <input type="text" id="nombre" placeholder="Nombre o apellidos">
        </label>
        <label class="flex column">
            Desde
            <input type="date" id="fecha_inicio" value="<?= date('Y-m-01') ?>">
        </label>
        <label class="flex column">
            Hasta
            <input type="date" id="fecha_fin" value="<?= date('Y-m-t') ?>">
        </label>

        <button onclick="limpiar()" class="btn-s rojo" style="margin-top: auto;">Limpiar</button>
    </section>

    <section id="cargando"></section>
    <section id="tabla-historial">
        <!-- AJAX content -->
    </section>
</section>

<script>
    window.onload = function() {
        document.getElementById('fecha_inicio').value = '<?= date('Y-m-01') ?>';
        document.getElementById('fecha_fin').value = '<?= date('Y-m-t') ?>';
        cargar_historial();
        
        let inputs = ['nombre', 'fecha_inicio', 'fecha_fin'];
        inputs.forEach(id => {
            document.getElementById(id).addEventListener('keyup', cargar_historial);
            document.getElementById(id).addEventListener('change', cargar_historial);
        });
    };

    function cargar_historial() {
        poner_cargando();
        let nombre = document.getElementById('nombre').value;
        let fecha_inicio = document.getElementById('fecha_inicio').value;
        let fecha_fin = document.getElementById('fecha_fin').value;
        
        let params = `nombre=${encodeURIComponent(nombre)}&fecha_inicio=${fecha_inicio}&fecha_fin=${fecha_fin}`;
        
        ajax('tables/table_historial_horas_acumuladas_cron', 'tabla-historial', params, ['quitar_cargando()']);
    }

    function limpiar() {
        document.getElementById('nombre').value = '';
        document.getElementById('fecha_inicio').value = '';
        document.getElementById('fecha_fin').value = '';
        cargar_historial();
    }
</script>

<?php footer(true); ?>
