<?php
require_once("../../app/functions.php");
$pag = basename($_SERVER['PHP_SELF']);
gen_plantilla(true, $pag, true, true, 'Grupos', true, true);
?>
<section id="seccion-grupos" class="cristal" <?= (!get_config_usuario($_SESSION['id_usuario'], 'reducir_efectos_movimiento')) ? 'style="view-transition-name: cristal;"' : '' ?>>
    <h1 class="resaltado flex row supercentrado"><span class="animacion-izq-drch">💼</span> Grupos</h1>
    <?php if ($_SESSION['tipo_usuario'] == 'admin'): ?>
        <a href='../forms/grupos' title="Crear un grupo" class="btn-p">
            Crear grupo
        </a>
    <?php endif; ?>
    <label class="flex column gap02"><b>Nombre</b>
        <input type="search" id="buscador" placeholder="Buscar por nombre">
    </label>
    <aside id="cargando"></aside>
    <section id="grupos" class="flex column gap05"></section>
</section>
<style>
#seccion-grupos {
    width: 44rem;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}
@media (max-width: 1024px) {
    #seccion-grupos {
        width: 90%;
    }
}
@media (max-width: 768px) {
    #seccion-grupos {
        width: 100%;
    }
}
</style>
<aside id="showdialog"></aside>
<script>
    window.onload = function() {
        cargar_grupos();
        let nombre = document.getElementById('buscador');
        nombre.addEventListener("keyup", function() {
            cargar_grupos();
        });
    }

    function cargar_grupos() {
        poner_cargando();
        let nombre = document.getElementById('buscador');
        if (nombre && nombre != '') {
            ajax('tables/table_grupos', 'grupos', "nombre=" + nombre.value, ['quitar_cargando()']);
        } else {
            ajax('tables/table_grupos', 'grupos', '', ['quitar_cargando()']);
        }

    }
    <?php if ($_SESSION['tipo_usuario'] == 'admin'): ?>

        function cargar_eliminar_grupo(id) {
            ajax('dialogs/dialog_delete_grupo', 'showdialog', "id=" + id, ['cargar_dialog()']);
        }

        function eliminar_grupo(id) {
            ajax('delete/delete_grupo', 'notificaciones', "id=" + id, ['animacion_y_cierre_dialog()', 'cargar_grupos()']);
        }
    <?php endif; ?>
</script>
<?php footer(true); ?>