Stable without período in autidoría

action/action_auditoria.php

@@ -22,12 +22,27 @@ try {
             }
         });
 
-        $data = $db->query("SELECT *, horario_view.facultad_id, horario_view.periodo_id FROM registro
+        $data = $db->query(
-                            JOIN horario_view USING (horario_id)
+            "WITH horarios AS (
-                            LEFT JOIN estado_supervisor USING (estado_supervisor_id)
+                SELECT * FROM horario_view WHERE (periodo_id, facultad_id) = (:periodo_id, :facultad_id)
-                            LEFT JOIN profesor USING (profesor_id)
+            ),
-                            LEFT JOIN usuario ON usuario.usuario_id = registro.supervisor_id
+            fechas AS (
-                            ORDER BY registro_fecha_ideal DESC, horario_hora ASC, registro_fecha_supervisor ASC");
+                SELECT fechas_clase(h.horario_id) as registro_fecha_ideal, h.horario_id  
+                FROM horarios h
+            )
+            SELECT estado_supervisor.*, usuario.*, registro.*, profesor.*, horarios.*, fechas.*
+            FROM horarios
+            JOIN fechas using (horario_id)
+            JOIN horario_profesor using (horario_id)
+            JOIN profesor using (profesor_id)
+            LEFT JOIN registro USING (horario_id, registro_fecha_ideal, profesor_id)
+            left join estado_supervisor using (estado_supervisor_id)
+            LEFT JOIN USUARIO ON USUARIO.usuario_id = REGISTRO.supervisor_id",
+            [
+                ':periodo_id' => $_GET['periodo_id'],
+                ':facultad_id' => $_GET['facultad_id'],
+            ]
+        );
 
         $last_query = [
             'query' => $db->getLastQuery(),
@@ -46,7 +61,7 @@ try {
     echo json_encode([
         'error' => $th->getMessage(),
         'query' => $db->getLastQuery(),
-    ], JSON_UNESCAPED_UNICODE | JSON_PRETTY_PRINT);
+    ], JSON_UNESCAPED_UNICODE | JSON_PRETTY_PRINT | JSON_UNESCAPED_SLASHES | JSON_PARTIAL_OUTPUT_ON_ERROR);
     exit;
 } catch (Exception $th) {
     http_response_code(500);

auditoría.php

@@ -25,8 +25,14 @@
         "Sistema de gestión de checador",
     );
     ?>
-
     <main class="container-fluid px-4 mt-4" id="app" v-cloak @vue:mounted="mounted">
+        <!--         <div class="alert alert-success" role="alert">
+            <h4 class="alert-heading">Well done!</h4>
+            <p>Aww yeah, you successfully read this important alert message. This example text is going to run a bit
+                longer so that you can see how spacing within an alert works with this kind of content.</p>
+            <hr>
+            <p class="mb-0">Whenever you need to, be sure to use margin utilities to keep things nice and tidy.</p>
+        </div> -->
         <form action="">
             <?php include "import/periodo.php" ?>
             <div class="form-box">
@@ -37,12 +43,13 @@
                             <div class="datalist-input">Selecciona una facultad</div>
                             <span class="ing-buscar icono"></span>
                             <ul style="display:none">
-                                <li class="datalist-option" data-id="0" @click="store.filters.facultad_id = null;">
+                                <li class="datalist-option" data-id="0"
+                                    @click="store.filters.facultad_id = null; store.current.page = 1;">
                                     Todas las facultades
                                 </li>
                                 <li class="datalist-option" v-for="facultad in store.facultades.data"
                                     :key="facultad.facultad_id" :data-id="facultad.facultad_id"
-                                    @click="store.filters.facultad_id = facultad.facultad_id">
+                                    @click="store.filters.facultad_id = facultad.facultad_id; store.current.page = 1;">
                                     (<small> {{facultad.clave_dependencia}} </small>) {{ facultad.facultad_nombre }}
                                 </li>
                             </ul>
@@ -52,7 +59,7 @@
                 </div>
                 <div class="form-group row align-items-center">
                     <label for="switchFecha" class="col-4 col-form-label">
-                        Fecha
+                        {{store.filters.switchFecha ? 'Rango de fechas' : 'Fecha'}}
                         <!-- switch -->
                         <div class="custom-control custom-switch">
                             <input type="checkbox" class="custom-control-input" id="switchFecha"
@@ -86,27 +93,32 @@
                     <div class="col-6">
                         <div id="dlBloqueHorarios" class="datalist datalist-select mb-1 w-100">
                             <div class="datalist-input">
-                                {{ store.bloques_horario.data.find(bloque => bloque.selected).hora_inicio.substr(0,5)
+                                Seleccione un bloque horario
-                                }} -
-                                {{ store.bloques_horario.data.find(bloque => bloque.selected).hora_fin.substr(0,5) }}
                             </div>
                             <span class="ing-buscar icono"></span>
                             <ul style="display:none">
+                                <li class="datalist-option" data-id="0"
+                                    @click="store.filters.bloque_horario = null; store.current.page = 1;">
+                                    Todos los bloques horarios
+                                </li>
+                                </li>
                                 <li class="datalist-option not-selectable">
                                     Mañana
                                 </li>
 
-                                <li class="datalist-option" :class="{selected: bloque.selected}"
+                                <li class="datalist-option"
                                     v-for="bloque in store.bloques_horario.data.filter(bloque => bloque.hora_inicio < '13:00:00')"
-                                    :key="bloque.id" :data-id="bloque.id" @click="store.filters.bloque_horario = bloque.id">
+                                    :key="bloque.id" :data-id="bloque.id"
+                                    @click="store.filters.bloque_horario = bloque.id ; store.current.page = 1;">
                                     {{ bloque.hora_inicio.substr(0,5) }} - {{ bloque.hora_fin.substr(0,5) }}
                                 </li>
                                 <li class="datalist-option not-selectable">
                                     Tarde
                                 </li>
-                                <li class="datalist-option" :class="{selected: bloque.selected}"
+                                <li class="datalist-option"
                                     v-for="bloque in store.bloques_horario.data.filter(bloque => bloque.hora_inicio >= '13:00:00')"
-                                    :key="bloque.id" :data-id="bloque.id" @click="store.filters.bloque_horario = bloque.id">
+                                    :key="bloque.id" :data-id="bloque.id"
+                                    @click="store.filters.bloque_horario = bloque.id ; store.current.page = 1;">
                                     {{ bloque.hora_inicio.substr(0,5) }} - {{ bloque.hora_fin.substr(0,5) }}
                                 </li>
 
@@ -120,10 +132,10 @@
                     <div class="col-6">
                         <div class="form-row justify-content-around align-items-center">
                             <input id="profesor" name="profesor" class="form-control col-11 mr-1 px-2"
-                                placeholder="Seleccione una profesor" list="dlProfesor"
+                                placeholder="Seleccione una profesor" list="dlProfesor" v-model="store.filters.profesor"
-                                v-model="store.filters.profesor">
+                                @input="store.current.page = 1">
                             <button type="button" class="btn btn-info btn-sm form-control col ml-auto"
-                                @click="store.filters.profesor = null">
+                                @click="store.filters.profesor = null; store.current.page = 1;">
                                 <i class="ing-borrar"></i>
                             </button>
                         </div>
@@ -137,16 +149,18 @@
                     <label for="dlAsistencia" class="col-4 col-form-label">Asistencia</label>
                     <div class="col-6">
                         <div class="form-row justify-content-around align-items-center">
-                            <div id="dlAsitencia" class="datalist datalist-select mb-1 w-100">
+                            <div id="dlAsistencia" class="datalist datalist-select mb-1 w-100">
                                 <div class="datalist-input" id="estados">Selecciona un estado de asistencia</div>
                                 <span class="ing-buscar icono"></span>
                                 <ul style="display:none">
-                                    <li class="datalist-option" data-id="0" @click="store.filters.estados = [];">
+                                    <li class="datalist-option" data-id="0"
+                                        @click="store.filters.estados = []; store.current.page = 1;">
                                         Todos los registros
                                     </li>
                                     <li class="datalist-option" v-for="estado in store.estados.data"
                                         :key="estado.estado_supervisor_id" :data-id="estado.estado_supervisor_id"
-                                        @click="store.filters.estados = store.toggle(store.filters.estados, estado.estado_supervisor_id); ; setTimeout(store.estados.printEstados, 0);">
+                                        @click="store.filters.estados = store.toggle(store.filters.estados, estado.estado_supervisor_id); setTimeout(store.estados.printEstados, 0); store.current.page = 1;"
+                                        :class="{'selected': store.filters.estados.includes(estado.estado_supervisor_id)}">
                                         <span class="badge"
                                             :class="`badge-${store.filters.estados.includes(estado.estado_supervisor_id) ? 'dark' : estado.estado_color}`"><i
                                                 :class="estado.estado_icon"></i> {{estado.nombre}}</span>
@@ -163,13 +177,18 @@
         <div class="mt-3 d-flex justify-content-center flex-wrap">
             <!-- botón descargar -->
 
-            <div class="btn-group my-3" v-if="registros.relevant.length">
+            <div class="btn-group my-3" v-if="registros.relevant.length > 0">
-                <button type="button" class="btn btn-info mr-3" @click="registros.descargar"
+                <button type="button" class="btn btn-info mr-3" @click="registros.descargar">
-                    :disabled="!registros.relevant.length">
                     <i class="ing-descarga"></i>
                     Descargar reporte
                 </button>
             </div>
+            <div v-else-if="registros.loading && registros.relevant.length > 0">
+                <div class="spinner-border" role="status">
+                    <span class="sr-only">Loading...</span>
+                </div>
+                Generando reporte...
+            </div>
 
             <!-- refresh -->
             <div class="table-responsive">
@@ -195,7 +214,8 @@
                         <tr v-if="registros.relevant.length == 0">
                             <td colspan="7" class="text-center">No hay clases en este horario</td>
                         </tr>
-                        <tr v-for="registro in registros.relevant" :key="registro.registro_id">
+                        <tr v-for="registro in registros.relevant?.slice((store.current.page - 1) * store.current.perPage, store.current.page * store.current.perPage)"
+                            :key="`${registro.registro_id}-${registro.registro_fecha_ideal}-${registro.horario_id}-${registro.profesor_id}-${registro.salon_id}`">
                             <td class="text-center align-middle px-2">{{ registro.registro_fecha_ideal }}
                             </td>
                             <td class="text-center align-middle px-2">{{ registro.salon }}</td>
@@ -214,13 +234,13 @@
                             </td>
 
 
-                            <td class="text-center align-middle px-2">{{ registro.horario_hora.slice(0,5) }} - {{
+                            <td class="text-center align-middle px-2">{{ registro.horario_hora?.slice(0,5) }} - {{
-                                registro.horario_fin.slice(0,5) }}</td>
+                                registro.horario_fin?.slice(0,5) }}</td>
                             <!--  -->
                             <td class="text-center align-middle px-2">
                                 <div v-if="registro.registro_fecha">
                                     <div class="col-12">
-                                        Registro <small>{{ registro.registro_fecha.slice(11,16) }}</small>
+                                        Registro <small>{{ registro.registro_fecha?.slice(11,16) }}</small>
                                     </div>
                                 </div>
                                 <div v-else>
@@ -244,7 +264,7 @@
                                         </div>
                                         <div class="col-12">
                                             Hora
-                                            <small>{{ registro.registro_fecha_supervisor.slice(11,19) }}</small>
+                                            <small>{{ registro.registro_fecha_supervisor?.slice(11,19) }}</small>
                                         </div>
                                         <div class="col-12 mt-2">
                                             <span class="badge" :class="`badge-${registro.estado_color}`">
@@ -258,7 +278,7 @@
                                     <div class="col-12 " @click="registros.mostrarComentario(registro.registro_id)"
                                         v-if="registro.comentario" style="cursor: pointer;">
                                         <strong class="badge badge-primary">Observaciones:</strong>
-                                        <small class="text-truncate">{{registro.comentario.slice(0,
+                                        <small class="text-truncate">{{registro.comentario?.slice(0,
                                             25)}}{{registro.comentario.length > 10 ? '...' : ''}}</small>
                                     </div>
                                 </div>
@@ -277,6 +297,29 @@
                     </tbody>
                 </table>
             </div>
+
+            <!-- page -->
+            <nav class="mt-3" v-if="registros.relevant.length > 0">
+                <ul class="pagination justify-content-center">
+                    <li class="page-item" :class="{'disabled': store.current.page == 1}"
+                        @click="store.current.page == 1 ? '' : store.current.page--" :disabled="store.current.page == 1"
+                        :title="`Página ${store.current.page} de ${registros.pages}`">
+                        <a class="page-link" style="cursor: pointer;">Anterior</a>
+                    </li>
+                    <li class="page-item"
+                        v-for="page in [...Array(registros.pages).keys()].map(x => ++x).slice(store.current.page - 3 > 0 ? store.current.page - 3 : 0, store.current.page + 2 < registros.pages ? store.current.page + 2 : registros.pages)"
+                        :class="{'active': store.current.page == page}" @click="store.current.page = page"
+                        :title="`Página ${store.current.page} de ${registros.pages}`">
+                        <a class="page-link" style="cursor: pointer;">{{ page }}</a>
+                    </li>
+                    <li class="page-item" :class="{'disabled': store.current.page == registros.pages}"
+                        :disabled="store.current.page == registros.pages"
+                        @click="store.current.page += store.current.page == registros.pages ? 0 : 1"
+                        :title="`Página ${store.current.page} de ${registros.pages}`">
+                        <a class="page-link" style="cursor: pointer;">Siguiente</a>
+                    </li>
+                </ul>
+            </nav>
         </div>
 
 
@@ -382,7 +425,7 @@
                                         </div>
                                         <div class="col-6 text-center" v-else>
                                             El profesor registró su asistencia a las
-                                            <code>{{clase_vista.registro_fecha.slice(11, 16)}}</code>
+                                            <code>{{clase_vista.registro_fecha?.slice(11, 16)}}</code>
                                             <hr>
                                             <p v-if="!clase_vista.registro_retardo" class="text-center">
                                                 <span class="badge badge-success"><i class="ing-aceptar"></i></span>
@@ -408,6 +451,25 @@
                 </div>
             </div>
         </div>
+        <div class="modal" tabindex="-1" id="cargando">
+            <div class="modal-dialog modal-dialog-centered modal-xl">
+                <div class="modal-content">
+                    <div class="modal-header">
+                        <h2 class="modal-title">{{store.current.modal_state}}</h2>
+                        <button type="button" class="close text-white" data-dismiss="modal" aria-label="Close">
+                            <span aria-hidden="true">&times;</span>
+                        </button>
+                    </div>
+                    <div class="modal-body container">
+                        <div class="row">
+                            <div class="col-12 text-center">
+                                <span class="spinner-border spinner-border-lg"></span>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
     </main>
     <script src="js/jquery.min.js"></script>
     <script src="js/jquery-ui.js"></script>

class/c_login.php

@@ -24,7 +24,7 @@ class Login
     }
     public function print_to_log(string $desc, array $old = null, array $new = null): void
     {
-        $log = new classes\LogAsistencias($_ENV["RUTA_RAIZ"]);
+        $log = new classes\LogAsistencias();
         if ($old)
             $desc .= " |#| OLD:" . json_encode($old);
         if ($new)

import/periodo.php

@@ -60,6 +60,6 @@
     makeRequiredDatalist("#periodo", true);
 
     $(document).on('click', '#dlPeriodo ul li:not(.not-selectable)', function () {
-        $('#formaPeriodo').submit();
+        $('form#formaPeriodo').submit();
     });
 </script>

js/auditoría.js

@@ -5,6 +5,10 @@ const store = reactive({
         comentario: '',
         clase_vista: null,
         empty: '',
+        page: 1,
+        maxPages: 10,
+        perPage: 10,
+        modal_state: "Cargando datos...",
     },
     facultades: {
         data: [],
@@ -20,6 +24,7 @@ const store = reactive({
         fecha_inicio: null,
         fecha_fin: null,
         profesor: null,
+        periodo_id: null,
         bloque_horario: null,
         estados: [],
         switchFecha: false,
@@ -27,7 +32,7 @@ const store = reactive({
             $(function () {
                 store.filters.fecha_inicio = store.filters.fecha_fin = store.filters.fecha = null;
                 $("#fecha, #fecha_inicio, #fecha_fin").datepicker({
-                    minDate: -3,
+                    minDate: -15,
                     maxDate: new Date(),
                     dateFormat: "yy-mm-dd",
                     showAnim: "slide",
@@ -79,11 +84,20 @@ const store = reactive({
     toggle(arr, element) {
         const newArray = arr.includes(element) ? arr.filter((item) => item !== element) : [...arr, element];
         // if all are selected, then unselect all
-        if (newArray.length === this.estados.data.length)
+        if (newArray.length === this.estados.data.length) {
+            setTimeout(() => {
+                document.querySelectorAll('#dlAsistencia>ul>li.selected').forEach(element => element.classList.remove('selected'));
+            }, 100);
             return [];
+        }
         return newArray;
     },
 });
+$('div.modal#cargando').modal({
+    backdrop: 'static',
+    keyboard: false,
+    show: false,
+});
 createApp({
     store,
     get clase_vista() {
@@ -92,9 +106,17 @@ createApp({
     registros: {
         data: [],
         async fetch() {
+            // if (!store.filters.facultad_id || !store.filters.periodo_id) return
             this.loading = true;
             this.data = [];
-            const res = await fetch('action/action_auditoria.php');
+            const params = {
+                facultad_id: 19,
+                periodo_id: 2,
+            };
+            const paramsUrl = new URLSearchParams(params).toString();
+            const res = await fetch(`action/action_auditoria.php?${paramsUrl}`, {
+                method: 'GET',
+            });
             this.data = await res.json();
             this.loading = false;
         },
@@ -119,6 +141,12 @@ createApp({
     
             */
             const filters = Object.keys(store.filters).filter((filtro) => store.filters[filtro] || store.filters[filtro]?.length > 0);
+            /*
+                store.current
+                    page: 1,
+                    maxPages: 10,
+                    perPage: 10,
+            */
             return this.data.filter((registro) => {
                 return filters.every((filtro) => {
                     switch (filtro) {
@@ -133,7 +161,7 @@ createApp({
                             if (/^\([^)]+\)\s[\s\S]+$/.test(textoFiltro)) {
                                 const clave = registro.profesor_clave.toLowerCase();
                                 const filtroClave = textoFiltro.match(/\((.*?)\)/)?.[1];
-                                console.log(clave, filtroClave);
+                                // console.log(clave, filtroClave);
                                 return clave.includes(filtroClave);
                             }
                             else {
@@ -156,34 +184,64 @@ createApp({
             });
         },
         async descargar() {
+            store.current.modal_state = 'Generando reporte en Excel...';
+            $('div.modal#cargando').modal('show');
+            this.loading = true;
             if (this.relevant.length === 0)
                 return;
-            const res = await fetch('export/supervisor_excel.php', {
+            try {
-                method: 'POST',
+                const res = await fetch('export/supervisor_excel.php', {
-                headers: {
+                    method: 'POST',
-                    'Content-Type': 'application/json'
+                    headers: {
-                },
+                        'Content-Type': 'application/json'
-                body: JSON.stringify(this.relevant)
+                    },
-            });
+                    body: JSON.stringify(this.relevant)
-            const blob = await res.blob();
+                });
-            window.saveAs(blob, `auditoria_${new Date().toISOString().slice(0, 10)}.xlsx`);
+                const blob = await res.blob();
+                window.saveAs(blob, `auditoria_${new Date().toISOString().slice(0, 10)}.xlsx`);
+            }
+            catch (error) {
+                if (error.response && error.response.status === 413) {
+                    alert('Your request is too large! Please reduce the data size and try again.');
+                }
+                else {
+                    alert('An error occurred: ' + error.message);
+                }
+            }
+            finally {
+                $('#cargando').modal('hide');
+                this.loading = false;
+            }
+        },
+        loading: false,
+        get pages() {
+            return Math.ceil(this.relevant.length / store.current.perPage);
         }
     },
     get profesores() {
-        return this.registros.data.map((registro) => ({
+        return this.registros.data
+            .map((registro) => ({
             profesor_id: registro.profesor_id,
             profesor_nombre: registro.profesor_nombre,
             profesor_correo: registro.profesor_correo,
             profesor_clave: registro.profesor_clave,
             profesor_grado: registro.profesor_grado,
-        })).sort((a, b) => a.profesor_nombre.localeCompare(b.profesor_nombre));
+        }))
+            .reduce((acc, current) => {
+            if (!acc.some(item => item.profesor_id === current.profesor_id)) {
+                acc.push(current);
+            }
+            return acc;
+        }, [])
+            .sort((a, b) => a.profesor_nombre.localeCompare(b.profesor_nombre));
     },
     async mounted() {
+        $('div.modal#cargando').modal('show');
         await this.registros.fetch();
         await store.facultades.fetch();
         await store.estados.fetch();
         await store.bloques_horario.fetch();
-        store.filters.bloque_horario = store.bloques_horario.data.find((bloque) => bloque.selected)?.id;
         store.filters.switchFechas();
+        $('div.modal#cargando').modal('hide');
     }
 }).mount('#app');

log/asistencias_2023_08.log

@@ -0,0 +1,3 @@
+2023-08-09 12:21:46||2||Permisos||Alejandro Lara
+2023-08-09 12:21:49||2||Permisos||Alejandro Lara
+2023-08-09 12:21:54||2||Avisos||Alejandro Lara

service/backend/periodos.php

@@ -1,11 +1,13 @@
 <?
+ini_set('display_errors', 1);
+ini_set('display_startup_errors', 1);
+error_reporting(E_ALL);
 $ruta = "../../";
 require_once "$ruta/include/bd_pdo.php";
 header('Content-Type: application/json');
 
 // json data from service\periodos.v1.php (input)
 $data = json_decode(file_get_contents('php://input'), true);
-
 // check if the input is empty
 
 if (is_response_empty($data)) {
@@ -36,14 +38,14 @@ $fin = strtotime($data['fin']);
 try {
 
     $result = $db->insert('periodo', [
-        'id_reference' => $data['IdPeriodo'],
+        'id_periodo_sgu' => $data['IdPeriodo'],
         'periodo_nombre' => "{$data['NombreNivel']}: {$formatter->format($inicio)} - {$formatter->format($fin)} " . date('Y', $inicio),
         'nivel_id' => $data['IdNivel'],
         'periodo_fecha_inicio' => $data['inicio'],
         'periodo_fecha_fin' => $data['fin'],
         'estado_id' => 4,
         'periodo_clave' => $data['NombrePeriodo']
-    ], ['id_reference']);
+    ], ['id_periodo_sgu']);
 } catch (PDOException $th) {
     echo json_encode([
         'success' => false,

service/periodos.v1.php

@@ -1,4 +1,8 @@
 <?
+ini_set('display_errors', 1);
+ini_set('display_startup_errors', 1);
+error_reporting(E_ALL);
+
 $ruta = "../";
 require_once '../include/bd_pdo.php';
 $curl = curl_init();
@@ -8,7 +12,7 @@ curl_setopt_array($curl, [
     CURLOPT_RETURNTRANSFER => true,
     CURLOPT_POSTFIELDS => "",
     CURLOPT_HTTPHEADER => [
-        "token: f65f921264e4ab135472adb5a946212dd4b995d929294afec31eef192b8de8d6a076648906f70012c9803e5918d0fc99499d7d1fb7c998cc06c7a10eef61f66a",
+        "token: 5b892845736a29b5846073be0a11f0fc87113648aae1e8279830c4bc05f585eba13e0b1b4f0c42a12d694bb8091d23f7564b15f3141768dfa6ed2aa709864986",
         "username: SGU_APSA_AUD_ASIST"
     ],
 ]);
@@ -24,7 +28,7 @@ if ($err)
 $data = json_decode($response, true);
 
 $in_db = array_map(function ($item) use ($db) {
-    $item['in_db'] = $db->where('id_reference', $item['IdPeriodo'])->has('periodo');
+    $item['in_db'] = $db->where('id_periodo_sgu', $item['IdPeriodo'])->has('periodo');
     return $item;
 }, $data);
 

service/periodos.v2.php

@@ -1,4 +1,8 @@
 <?
+ini_set('display_errors', 1);
+ini_set('display_startup_errors', 1);
+error_reporting(E_ALL);
+
 $ruta = "../";
 require_once '../include/bd_pdo.php';
 global $db;
@@ -10,7 +14,7 @@ curl_setopt_array($curl, [
     CURLOPT_RETURNTRANSFER => true,
     CURLOPT_POSTFIELDS => "",
     CURLOPT_HTTPHEADER => [
-        "token: f65f921264e4ab135472adb5a946212dd4b995d929294afec31eef192b8de8d6a076648906f70012c9803e5918d0fc99499d7d1fb7c998cc06c7a10eef61f66a",
+        "token: 5b892845736a29b5846073be0a11f0fc87113648aae1e8279830c4bc05f585eba13e0b1b4f0c42a12d694bb8091d23f7564b15f3141768dfa6ed2aa709864986",
         "username: SGU_APSA_AUD_ASIST"
     ],
 ]);
@@ -28,7 +32,7 @@ $json = json_decode($response, true);
 
 $selectedData = array_map(function ($item) use ($db) {
     $item['in_db'] = $db->where('carrera_nombre', $item['NombreCarrera'], 'ILIKE')->has('carrera');
-    $item['linked'] = $db->where('id_referencia', $item['ClaveCarrera'], 'ILIKE')->has('carrera');
+    $item['linked'] = $db->where('clave_carrera', $item['ClaveCarrera'], 'ILIKE')->has('carrera');
     return $item;
 }, $json);
 

supervisor.php

@@ -115,7 +115,7 @@
                     </button>
 
                     <h3 class="text-white font-weight-bold text-uppercase text-center">
-                        {{ store.hora_inicio.slice(0, 5) }} - {{ store.hora_fin.slice(0, 5) }}
+                        {{ store.hora_inicio?.slice(0, 5) }} - {{ store.hora_fin?.slice(0, 5) }}
                     </h3>
 
                     <button class="btn btn-info"
@@ -165,7 +165,7 @@
                             <tr v-if="clases.length == 0">
                                 <td colspan="6" class="text-center">No hay clases en este horario</td>
                             </tr>
-                            <tr v-for="clase in clases" :key="clase.horario_id">
+                            <tr v-for="clase in clases" :key="`${clase.horario_id}-${clase.profesor_id}`">
                                 <td class="text-center align-middle">{{ clase.salon }}</td>
                                 <td class="text-center align-middle">
                                     <div class="col-12">
@@ -173,8 +173,8 @@
                                     </div>
                                     <div class="col-12">
                                         <button type="button" class="btn btn-outline-dark btn-sm"
-                                            @click="store.profesor_selected = clase.horario_id" data-toggle="modal"
+                                            @click="store.profesor_selected.horario_id = clase.horario_id; store.profesor_selected.profesor_id = clase.profesor_id"
-                                            data-target="#ver-detalle">
+                                            data-toggle="modal" data-target="#ver-detalle">
                                             Ver detalle <i class="ing-ojo"></i>
                                         </button>
                                     </div>
@@ -182,12 +182,12 @@
 
                                 </td>
                                 <td class="text-center align-middle">
-                                    {{ clase.horario_hora.slice(0, 5) }} - {{ clase.horario_fin.slice(0, 5) }}
+                                    {{ clase.horario_hora?.slice(0, 5) }} - {{ clase.horario_fin?.slice(0, 5) }}
                                 </td>
                                 <td class="text-center align-middle text-nowrap">
                                     <!-- data-toggle="button" -->
                                     <button class="btn text-center mx-2" v-for="estado in estados" :key="estado.id"
-                                        @click="store.cambiarEstado(clase.horario_id, estado.id === clase.estado_supervisor_id ? null : estado.id)"
+                                        @click="store.cambiarEstado(clase.horario_id, clase.profesor_id, estado.id === clase.estado_supervisor_id ? null : estado.id)"
                                         :class="[{'active': estado.id === clase.estado_supervisor_id}, `btn-outline-${estado.color}`]"
                                         :aria-pressed="estado.id === clase.estado_supervisor_id">
                                         <i :class="estado.icon"></i>
@@ -226,7 +226,7 @@
                             v-for="horario in store.bloquesHorario.data" :key="horario.id"
                             @click="store.bloquesHorario.selected = store.bloquesHorario.data.indexOf(horario)">
                             <div class="d-flex w-100 justify-content-between">
-                                <h5 class="mb-1">{{ horario.hora_inicio.slice(0, 5) }} - {{horario.hora_fin.slice(0, 5)
+                                <h5 class="mb-1">{{ horario.hora_inicio?.slice(0, 5) }} - {{horario.hora_fin?.slice(0, 5)
                                     }}</h5>
                             </div>
                         </a>
@@ -415,7 +415,7 @@
                                         </div>
                                         <div class="col-6 text-center" v-else>
                                             El profesor registró su asistencia a las
-                                            <code>{{clase_vista.registro_fecha.slice(11, 16)}}</code>
+                                            <code>{{clase_vista.registro_fecha?.slice(11, 16)}}</code>
                                             <hr>
                                             <p v-if="!clase_vista.registro_retardo" class="text-center">
                                                 <span class="badge badge-success"><i class="ing-aceptar"></i></span>
@@ -440,7 +440,17 @@
                     </div>
                 </div>
             </div>
-        </div>
+            <div class="modal-dialog modal-dialog-centered modal-xl" v-else>
+                <div class="modal-content">
+                    <div class="modal-header">
+                        <h2 class="modal-title">Error al cargar la clase</h2>
+                        <button type="button" class="close text-white" data-dismiss="modal" aria-label="Close">
+                            <span aria-hidden="true">&times;</span>
+                        </button>
+                    </div>
+                    <!-- cuerpo del modal -->
+                </div>
+            </div>
         </div>
     </main>
     <?php
@@ -481,7 +491,6 @@
             data: [],
             push_message(message, silent = false) {
                 if (silent) {
-                    console.log(message);
                     return
                 }
                 // go to the top
@@ -524,7 +533,6 @@
                 const finals = this.rutas.data.filter(ruta => ruta.horarios.length > 0 && ruta.horarios.every(horario => horario.estado_supervisor_id));
                 const lasts = this.rutas.data.filter(ruta => ruta.horarios.length == 0);
                 const notLasts = this.rutas.data.filter(ruta => ruta.horarios.some(horario => !horario.estado_supervisor_id));
-                // console.log("finals", finals, "lasts", lasts, "notLasts", notLasts)
                 this.rutas.data = [...notLasts, ...finals, ...lasts];
             },
             // clases
@@ -533,9 +541,9 @@
             },
 
             // estado
-            async cambiarEstado(horario_id, estadoId) {
+            async cambiarEstado(horario_id, profesor_id, estadoId) {
                 const ruta = store.rutas.data.find(ruta => ruta.salon_id == this.rutas.selected);
-                const clase = ruta.horarios.find(clase => clase.horario_id == horario_id);
+                const clase = ruta.horarios.find(clase => clase.horario_id == horario_id && clase.profesor_id == profesor_id);
                 clase.estado_supervisor_id = estadoId;
 
                 try {
@@ -588,12 +596,15 @@
                 const ruta = store.rutas.data.find(ruta => ruta.salon_id == this.rutas.selected);
                 const clase = ruta.horarios.find(clase => clase.horario_id == this.editor.id);
                 clase.comentario = this.editor.texto;
-                store.cambiarEstado(clase.horario_id, clase.estado_supervisor_id);
+                store.cambiarEstado(clase.horario_id, clase.profesor_id, clase.estado_supervisor_id);
             },
             limpiarComentario() {
                 this.editor.texto = "";
             },
-            profesor_selected: null,
+            profesor_selected: {
+                horario_id: null,
+                profesor_id: null,
+            },
         });
 
         $(document).ready(function () {
@@ -632,7 +643,6 @@
             },
             get clases() {
                 const clases = store.rutas.data.find(ruta => ruta.salon_id == store.rutas.selected)?.horarios ?? [];
-                // console.log("All clases", JSON.parse(JSON.stringify(clases)), "Selected: ", store.rutas.selected);
                 return clases;
             },
             async guardarCambios() {
@@ -641,7 +651,6 @@
                     if (!navigator.onLine)
                         throw "No hay conexión a internet";
 
-                    console.log(store.rutas.data.map(ruta => ruta.horarios).flat(1).filter(clase => clase.pendiente));
                     const cambio = await fetch("action/registro_supervisor.php", {
                         method: "POST",
                         headers: {
@@ -681,7 +690,6 @@
             async mounted() {
                 store.bloquesHorario.data = await fetch('action/action_grupo_horario.php').then(res => res.json());
                 store.bloquesHorario.selected = store.bloquesHorario.data.findIndex(bloque => bloque.selected);
-                // console.log(store.bloquesHorario.selected);
                 this.header = (store.bloquesHorario.selected == -1) ? "Seleccione un horario" : "Seleccione una ruta";
                 this.catálogo_rutas.data = await fetch('action/rutas.php').then(res => res.json());
                 this.loading = false;
@@ -725,7 +733,7 @@
 
             },
             get clase_vista() {
-                return this.clases.find(clase => clase.horario_id == store.profesor_selected) ?? false;
+                return this.clases.find(clase => clase.horario_id == store.profesor_selected.horario_id && clase.profesor_id == store.profesor_selected.profesor_id) ?? false;
             },
         }).mount('#app')
     </script>

ts/auditoría.ts

@@ -70,6 +70,10 @@ const store = reactive({
         comentario: '',
         clase_vista: null,
         empty: '',
+        page: 1,
+        maxPages: 10,
+        perPage: 10,
+        modal_state: "Cargando datos...",
     },
     facultades: {
         data: [] as Facultad[],
@@ -85,6 +89,7 @@ const store = reactive({
         fecha_inicio: null,
         fecha_fin: null,
         profesor: null,
+        periodo_id: null,
         bloque_horario: null,
         estados: [],
 
@@ -94,7 +99,7 @@ const store = reactive({
                 store.filters.fecha_inicio = store.filters.fecha_fin = store.filters.fecha = null
 
                 $("#fecha, #fecha_inicio, #fecha_fin").datepicker({
-                    minDate: -3,
+                    minDate: -15,
                     maxDate: new Date(),
                     dateFormat: "yy-mm-dd",
                     showAnim: "slide",
@@ -150,7 +155,12 @@ const store = reactive({
     toggle(arr: any, element: any) {
         const newArray = arr.includes(element) ? arr.filter((item: any) => item !== element) : [...arr, element]
         // if all are selected, then unselect all
-        if (newArray.length === this.estados.data.length) return []
+        if (newArray.length === this.estados.data.length) {
+            setTimeout(() => {
+                document.querySelectorAll('#dlAsistencia>ul>li.selected')!.forEach(element => element.classList.remove('selected'));
+            }, 100)
+            return []
+        }
         return newArray
     },
 })
@@ -166,7 +176,11 @@ type Profesor = {
     profesor_clave: string;
     profesor_grado: string;
 }
-
+$('div.modal#cargando').modal({
+    backdrop: 'static',
+    keyboard: false,
+    show: false,
+})
 createApp({
     store,
     get clase_vista() {
@@ -175,9 +189,17 @@ createApp({
     registros: {
         data: [] as Registro[],
         async fetch() {
+            // if (!store.filters.facultad_id || !store.filters.periodo_id) return
             this.loading = true
             this.data = [] as Registro[]
-            const res = await fetch('action/action_auditoria.php')
+            const params = {
+                facultad_id: 19,
+                periodo_id: 2,
+            }
+            const paramsUrl = new URLSearchParams(params as any).toString()
+            const res = await fetch(`action/action_auditoria.php?${paramsUrl}`, {
+                method: 'GET',
+            })
             this.data = await res.json()
             this.loading = false
         },
@@ -203,6 +225,12 @@ createApp({
     
             */
             const filters = Object.keys(store.filters).filter((filtro) => store.filters[filtro] || store.filters[filtro]?.length > 0)
+            /*
+                store.current
+                    page: 1,
+                    maxPages: 10,
+                    perPage: 10,
+            */
             return this.data.filter((registro: Registro) => {
                 return filters.every((filtro) => {
 
@@ -218,7 +246,7 @@ createApp({
                             if (/^\([^)]+\)\s[\s\S]+$/.test(textoFiltro)) {
                                 const clave = registro.profesor_clave.toLowerCase();
                                 const filtroClave = textoFiltro.match(/\((.*?)\)/)?.[1];
-                                console.log(clave, filtroClave);
+                                // console.log(clave, filtroClave);
                                 return clave.includes(filtroClave);
                             } else {
                                 const nombre = registro.profesor_nombre.toLowerCase();
@@ -238,40 +266,67 @@ createApp({
                 })
             })
         },
-
         async descargar() {
+            store.current.modal_state = 'Generando reporte en Excel...'
+            $('div.modal#cargando').modal('show');
+            this.loading = true;
             if (this.relevant.length === 0) return;
-            const res = await fetch('export/supervisor_excel.php', {
+            try {
-                method: 'POST',
+                const res = await fetch('export/supervisor_excel.php', {
-                headers: {
+                    method: 'POST',
-                    'Content-Type': 'application/json'
+                    headers: {
-                },
+                        'Content-Type': 'application/json'
-                body: JSON.stringify(this.relevant)
+                    },
-            });
+                    body: JSON.stringify(this.relevant)
-            const blob = await res.blob();
+                });
-            (window as any).saveAs(blob, `auditoria_${new Date().toISOString().slice(0, 10)}.xlsx`);
+                const blob = await res.blob();
+                (window as any).saveAs(blob, `auditoria_${new Date().toISOString().slice(0, 10)}.xlsx`);
+
+            } catch (error) {
+                if (error.response && error.response.status === 413) {
+                    alert('Your request is too large! Please reduce the data size and try again.');
+                } else {
+                    alert('An error occurred: ' + error.message);
+                }
+            }
+            finally {
+                $('#cargando').modal('hide');
+                this.loading = false;
+            }
+        },
+        loading: false,
+        get pages() {
+            return Math.ceil(this.relevant.length / store.current.perPage)
         }
     },
     get profesores() {
-        return this.registros.data.map((registro: Registro) => (
+        return this.registros.data
-            {
+            .map((registro: Registro) => ({
                 profesor_id: registro.profesor_id,
                 profesor_nombre: registro.profesor_nombre,
                 profesor_correo: registro.profesor_correo,
                 profesor_clave: registro.profesor_clave,
                 profesor_grado: registro.profesor_grado,
-            }
+            }))
-        )).sort((a: Profesor, b: Profesor) =>
+            .reduce((acc: Profesor[], current: Profesor) => {
-            a.profesor_nombre.localeCompare(b.profesor_nombre)
+                if (!acc.some(item => item.profesor_id === current.profesor_id)) {
-        )
+                    acc.push(current);
+                }
+                return acc;
+            }, [])
+            .sort((a: Profesor, b: Profesor) =>
+                a.profesor_nombre.localeCompare(b.profesor_nombre)
+            );
+
     },
     async mounted() {
+        $('div.modal#cargando').modal('show');
+        
         await this.registros.fetch()
         await store.facultades.fetch()
         await store.estados.fetch()
         await store.bloques_horario.fetch()
-
-        store.filters.bloque_horario = store.bloques_horario.data.find((bloque: Bloque_Horario) => bloque.selected)?.id
         store.filters.switchFechas()
+        $('div.modal#cargando').modal('hide');
     }
 }).mount('#app')