Stable without período in autidoría
This commit is contained in:
@@ -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 = [
|
$last_query = [
|
||||||
'query' => $db->getLastQuery(),
|
'query' => $db->getLastQuery(),
|
||||||
@@ -46,7 +61,7 @@ try {
|
|||||||
echo json_encode([
|
echo json_encode([
|
||||||
'error' => $th->getMessage(),
|
'error' => $th->getMessage(),
|
||||||
'query' => $db->getLastQuery(),
|
'query' => $db->getLastQuery(),
|
||||||
], JSON_UNESCAPED_UNICODE | JSON_PRETTY_PRINT);
|
], JSON_UNESCAPED_UNICODE | JSON_PRETTY_PRINT | JSON_UNESCAPED_SLASHES | JSON_PARTIAL_OUTPUT_ON_ERROR);
|
||||||
exit;
|
exit;
|
||||||
} catch (Exception $th) {
|
} catch (Exception $th) {
|
||||||
http_response_code(500);
|
http_response_code(500);
|
||||||
|
|||||||
116
auditoría.php
116
auditoría.php
@@ -25,8 +25,14 @@
|
|||||||
"Sistema de gestión de checador",
|
"Sistema de gestión de checador",
|
||||||
);
|
);
|
||||||
?>
|
?>
|
||||||
|
|
||||||
<main class="container-fluid px-4 mt-4" id="app" v-cloak @vue:mounted="mounted">
|
<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="">
|
<form action="">
|
||||||
<?php include "import/periodo.php" ?>
|
<?php include "import/periodo.php" ?>
|
||||||
<div class="form-box">
|
<div class="form-box">
|
||||||
@@ -37,12 +43,13 @@
|
|||||||
<div class="datalist-input">Selecciona una facultad</div>
|
<div class="datalist-input">Selecciona una facultad</div>
|
||||||
<span class="ing-buscar icono"></span>
|
<span class="ing-buscar icono"></span>
|
||||||
<ul style="display:none">
|
<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
|
Todas las facultades
|
||||||
</li>
|
</li>
|
||||||
<li class="datalist-option" v-for="facultad in store.facultades.data"
|
<li class="datalist-option" v-for="facultad in store.facultades.data"
|
||||||
:key="facultad.facultad_id" :data-id="facultad.facultad_id"
|
: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 }}
|
(<small> {{facultad.clave_dependencia}} </small>) {{ facultad.facultad_nombre }}
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
@@ -52,7 +59,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="form-group row align-items-center">
|
<div class="form-group row align-items-center">
|
||||||
<label for="switchFecha" class="col-4 col-form-label">
|
<label for="switchFecha" class="col-4 col-form-label">
|
||||||
Fecha
|
{{store.filters.switchFecha ? 'Rango de fechas' : 'Fecha'}}
|
||||||
<!-- switch -->
|
<!-- switch -->
|
||||||
<div class="custom-control custom-switch">
|
<div class="custom-control custom-switch">
|
||||||
<input type="checkbox" class="custom-control-input" id="switchFecha"
|
<input type="checkbox" class="custom-control-input" id="switchFecha"
|
||||||
@@ -86,27 +93,32 @@
|
|||||||
<div class="col-6">
|
<div class="col-6">
|
||||||
<div id="dlBloqueHorarios" class="datalist datalist-select mb-1 w-100">
|
<div id="dlBloqueHorarios" class="datalist datalist-select mb-1 w-100">
|
||||||
<div class="datalist-input">
|
<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>
|
</div>
|
||||||
<span class="ing-buscar icono"></span>
|
<span class="ing-buscar icono"></span>
|
||||||
<ul style="display:none">
|
<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">
|
<li class="datalist-option not-selectable">
|
||||||
Mañana
|
Mañana
|
||||||
</li>
|
</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')"
|
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) }}
|
{{ bloque.hora_inicio.substr(0,5) }} - {{ bloque.hora_fin.substr(0,5) }}
|
||||||
</li>
|
</li>
|
||||||
<li class="datalist-option not-selectable">
|
<li class="datalist-option not-selectable">
|
||||||
Tarde
|
Tarde
|
||||||
</li>
|
</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')"
|
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) }}
|
{{ bloque.hora_inicio.substr(0,5) }} - {{ bloque.hora_fin.substr(0,5) }}
|
||||||
</li>
|
</li>
|
||||||
|
|
||||||
@@ -120,10 +132,10 @@
|
|||||||
<div class="col-6">
|
<div class="col-6">
|
||||||
<div class="form-row justify-content-around align-items-center">
|
<div class="form-row justify-content-around align-items-center">
|
||||||
<input id="profesor" name="profesor" class="form-control col-11 mr-1 px-2"
|
<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"
|
<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>
|
<i class="ing-borrar"></i>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
@@ -137,16 +149,18 @@
|
|||||||
<label for="dlAsistencia" class="col-4 col-form-label">Asistencia</label>
|
<label for="dlAsistencia" class="col-4 col-form-label">Asistencia</label>
|
||||||
<div class="col-6">
|
<div class="col-6">
|
||||||
<div class="form-row justify-content-around align-items-center">
|
<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>
|
<div class="datalist-input" id="estados">Selecciona un estado de asistencia</div>
|
||||||
<span class="ing-buscar icono"></span>
|
<span class="ing-buscar icono"></span>
|
||||||
<ul style="display:none">
|
<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
|
Todos los registros
|
||||||
</li>
|
</li>
|
||||||
<li class="datalist-option" v-for="estado in store.estados.data"
|
<li class="datalist-option" v-for="estado in store.estados.data"
|
||||||
:key="estado.estado_supervisor_id" :data-id="estado.estado_supervisor_id"
|
: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"
|
<span class="badge"
|
||||||
:class="`badge-${store.filters.estados.includes(estado.estado_supervisor_id) ? 'dark' : estado.estado_color}`"><i
|
:class="`badge-${store.filters.estados.includes(estado.estado_supervisor_id) ? 'dark' : estado.estado_color}`"><i
|
||||||
:class="estado.estado_icon"></i> {{estado.nombre}}</span>
|
:class="estado.estado_icon"></i> {{estado.nombre}}</span>
|
||||||
@@ -163,13 +177,18 @@
|
|||||||
<div class="mt-3 d-flex justify-content-center flex-wrap">
|
<div class="mt-3 d-flex justify-content-center flex-wrap">
|
||||||
<!-- botón descargar -->
|
<!-- 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>
|
<i class="ing-descarga"></i>
|
||||||
Descargar reporte
|
Descargar reporte
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</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 -->
|
<!-- refresh -->
|
||||||
<div class="table-responsive">
|
<div class="table-responsive">
|
||||||
@@ -195,7 +214,8 @@
|
|||||||
<tr v-if="registros.relevant.length == 0">
|
<tr v-if="registros.relevant.length == 0">
|
||||||
<td colspan="7" class="text-center">No hay clases en este horario</td>
|
<td colspan="7" class="text-center">No hay clases en este horario</td>
|
||||||
</tr>
|
</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 class="text-center align-middle px-2">{{ registro.registro_fecha_ideal }}
|
||||||
</td>
|
</td>
|
||||||
<td class="text-center align-middle px-2">{{ registro.salon }}</td>
|
<td class="text-center align-middle px-2">{{ registro.salon }}</td>
|
||||||
@@ -214,13 +234,13 @@
|
|||||||
</td>
|
</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">
|
<td class="text-center align-middle px-2">
|
||||||
<div v-if="registro.registro_fecha">
|
<div v-if="registro.registro_fecha">
|
||||||
<div class="col-12">
|
<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>
|
</div>
|
||||||
<div v-else>
|
<div v-else>
|
||||||
@@ -244,7 +264,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="col-12">
|
<div class="col-12">
|
||||||
Hora
|
Hora
|
||||||
<small>{{ registro.registro_fecha_supervisor.slice(11,19) }}</small>
|
<small>{{ registro.registro_fecha_supervisor?.slice(11,19) }}</small>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-12 mt-2">
|
<div class="col-12 mt-2">
|
||||||
<span class="badge" :class="`badge-${registro.estado_color}`">
|
<span class="badge" :class="`badge-${registro.estado_color}`">
|
||||||
@@ -258,7 +278,7 @@
|
|||||||
<div class="col-12 " @click="registros.mostrarComentario(registro.registro_id)"
|
<div class="col-12 " @click="registros.mostrarComentario(registro.registro_id)"
|
||||||
v-if="registro.comentario" style="cursor: pointer;">
|
v-if="registro.comentario" style="cursor: pointer;">
|
||||||
<strong class="badge badge-primary">Observaciones:</strong>
|
<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>
|
25)}}{{registro.comentario.length > 10 ? '...' : ''}}</small>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -277,6 +297,29 @@
|
|||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</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>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
@@ -382,7 +425,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="col-6 text-center" v-else>
|
<div class="col-6 text-center" v-else>
|
||||||
El profesor registró su asistencia a las
|
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>
|
<hr>
|
||||||
<p v-if="!clase_vista.registro_retardo" class="text-center">
|
<p v-if="!clase_vista.registro_retardo" class="text-center">
|
||||||
<span class="badge badge-success"><i class="ing-aceptar"></i></span>
|
<span class="badge badge-success"><i class="ing-aceptar"></i></span>
|
||||||
@@ -408,6 +451,25 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</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">×</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>
|
</main>
|
||||||
<script src="js/jquery.min.js"></script>
|
<script src="js/jquery.min.js"></script>
|
||||||
<script src="js/jquery-ui.js"></script>
|
<script src="js/jquery-ui.js"></script>
|
||||||
|
|||||||
@@ -24,7 +24,7 @@ class Login
|
|||||||
}
|
}
|
||||||
public function print_to_log(string $desc, array $old = null, array $new = null): void
|
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)
|
if ($old)
|
||||||
$desc .= " |#| OLD:" . json_encode($old);
|
$desc .= " |#| OLD:" . json_encode($old);
|
||||||
if ($new)
|
if ($new)
|
||||||
|
|||||||
@@ -60,6 +60,6 @@
|
|||||||
makeRequiredDatalist("#periodo", true);
|
makeRequiredDatalist("#periodo", true);
|
||||||
|
|
||||||
$(document).on('click', '#dlPeriodo ul li:not(.not-selectable)', function () {
|
$(document).on('click', '#dlPeriodo ul li:not(.not-selectable)', function () {
|
||||||
$('#formaPeriodo').submit();
|
$('form#formaPeriodo').submit();
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
432
js/auditoría.js
432
js/auditoría.js
@@ -1,189 +1,247 @@
|
|||||||
import { createApp, reactive } from 'https://unpkg.com/petite-vue?module';
|
import { createApp, reactive } from 'https://unpkg.com/petite-vue?module';
|
||||||
const store = reactive({
|
const store = reactive({
|
||||||
loading: false,
|
loading: false,
|
||||||
current: {
|
current: {
|
||||||
comentario: '',
|
comentario: '',
|
||||||
clase_vista: null,
|
clase_vista: null,
|
||||||
empty: '',
|
empty: '',
|
||||||
},
|
page: 1,
|
||||||
facultades: {
|
maxPages: 10,
|
||||||
data: [],
|
perPage: 10,
|
||||||
async fetch() {
|
modal_state: "Cargando datos...",
|
||||||
this.data = [];
|
},
|
||||||
const res = await fetch('action/action_facultad.php');
|
facultades: {
|
||||||
this.data = await res.json();
|
data: [],
|
||||||
},
|
async fetch() {
|
||||||
},
|
this.data = [];
|
||||||
filters: {
|
const res = await fetch('action/action_facultad.php');
|
||||||
facultad_id: null,
|
this.data = await res.json();
|
||||||
fecha: null,
|
},
|
||||||
fecha_inicio: null,
|
},
|
||||||
fecha_fin: null,
|
filters: {
|
||||||
profesor: null,
|
facultad_id: null,
|
||||||
bloque_horario: null,
|
fecha: null,
|
||||||
estados: [],
|
fecha_inicio: null,
|
||||||
switchFecha: false,
|
fecha_fin: null,
|
||||||
switchFechas() {
|
profesor: null,
|
||||||
$(function () {
|
periodo_id: null,
|
||||||
store.filters.fecha_inicio = store.filters.fecha_fin = store.filters.fecha = null;
|
bloque_horario: null,
|
||||||
$("#fecha, #fecha_inicio, #fecha_fin").datepicker({
|
estados: [],
|
||||||
minDate: -3,
|
switchFecha: false,
|
||||||
maxDate: new Date(),
|
switchFechas() {
|
||||||
dateFormat: "yy-mm-dd",
|
$(function () {
|
||||||
showAnim: "slide",
|
store.filters.fecha_inicio = store.filters.fecha_fin = store.filters.fecha = null;
|
||||||
});
|
$("#fecha, #fecha_inicio, #fecha_fin").datepicker({
|
||||||
const fecha = $("#fecha"), inicio = $("#fecha_inicio"), fin = $("#fecha_fin");
|
minDate: -15,
|
||||||
inicio.on("change", function () {
|
maxDate: new Date(),
|
||||||
store.filters.fecha_inicio = inicio.val();
|
dateFormat: "yy-mm-dd",
|
||||||
fin.datepicker("option", "minDate", inicio.val());
|
showAnim: "slide",
|
||||||
});
|
});
|
||||||
fin.on("change", function () {
|
const fecha = $("#fecha"), inicio = $("#fecha_inicio"), fin = $("#fecha_fin");
|
||||||
store.filters.fecha_fin = fin.val();
|
inicio.on("change", function () {
|
||||||
inicio.datepicker("option", "maxDate", fin.val());
|
store.filters.fecha_inicio = inicio.val();
|
||||||
});
|
fin.datepicker("option", "minDate", inicio.val());
|
||||||
fecha.on("change", function () {
|
});
|
||||||
store.filters.fecha = fecha.val();
|
fin.on("change", function () {
|
||||||
});
|
store.filters.fecha_fin = fin.val();
|
||||||
});
|
inicio.datepicker("option", "maxDate", fin.val());
|
||||||
}
|
});
|
||||||
},
|
fecha.on("change", function () {
|
||||||
estados: {
|
store.filters.fecha = fecha.val();
|
||||||
data: [],
|
});
|
||||||
async fetch() {
|
});
|
||||||
this.data = [];
|
}
|
||||||
const res = await fetch('action/action_estado_supervisor.php');
|
},
|
||||||
this.data = await res.json();
|
estados: {
|
||||||
},
|
data: [],
|
||||||
getEstado(id) {
|
async fetch() {
|
||||||
return this.data.find((estado) => estado.estado_supervisor_id === id);
|
this.data = [];
|
||||||
},
|
const res = await fetch('action/action_estado_supervisor.php');
|
||||||
printEstados() {
|
this.data = await res.json();
|
||||||
if (store.filters.estados.length > 0)
|
},
|
||||||
|
getEstado(id) {
|
||||||
|
return this.data.find((estado) => estado.estado_supervisor_id === id);
|
||||||
|
},
|
||||||
|
printEstados() {
|
||||||
|
if (store.filters.estados.length > 0)
|
||||||
document.querySelector('#estados').innerHTML = store.filters.estados.map((estado) => `<span class="mx-2 badge badge-${store.estados.getEstado(estado).estado_color}">
|
document.querySelector('#estados').innerHTML = store.filters.estados.map((estado) => `<span class="mx-2 badge badge-${store.estados.getEstado(estado).estado_color}">
|
||||||
<i class="${store.estados.getEstado(estado).estado_icon}"></i> ${store.estados.getEstado(estado).nombre}
|
<i class="${store.estados.getEstado(estado).estado_icon}"></i> ${store.estados.getEstado(estado).nombre}
|
||||||
</span>`).join('');
|
</span>`).join('');
|
||||||
else
|
else
|
||||||
document.querySelector('#estados').innerHTML = `Todos los registros`;
|
document.querySelector('#estados').innerHTML = `Todos los registros`;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
bloques_horario: {
|
bloques_horario: {
|
||||||
data: [],
|
data: [],
|
||||||
async fetch() {
|
async fetch() {
|
||||||
this.data = [];
|
this.data = [];
|
||||||
const res = await fetch('action/action_grupo_horario.php');
|
const res = await fetch('action/action_grupo_horario.php');
|
||||||
this.data = await res.json();
|
this.data = await res.json();
|
||||||
if (this.data.every((bloque) => !bloque.selected))
|
if (this.data.every((bloque) => !bloque.selected))
|
||||||
this.data[0].selected = true;
|
this.data[0].selected = true;
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
toggle(arr, element) {
|
toggle(arr, element) {
|
||||||
const newArray = arr.includes(element) ? arr.filter((item) => item !== element) : [...arr, element];
|
const newArray = arr.includes(element) ? arr.filter((item) => item !== element) : [...arr, element];
|
||||||
// if all are selected, then unselect all
|
// if all are selected, then unselect all
|
||||||
if (newArray.length === this.estados.data.length)
|
if (newArray.length === this.estados.data.length) {
|
||||||
return [];
|
setTimeout(() => {
|
||||||
return newArray;
|
document.querySelectorAll('#dlAsistencia>ul>li.selected').forEach(element => element.classList.remove('selected'));
|
||||||
},
|
}, 100);
|
||||||
});
|
return [];
|
||||||
createApp({
|
}
|
||||||
store,
|
return newArray;
|
||||||
get clase_vista() {
|
},
|
||||||
return store.current.clase_vista;
|
});
|
||||||
},
|
$('div.modal#cargando').modal({
|
||||||
registros: {
|
backdrop: 'static',
|
||||||
data: [],
|
keyboard: false,
|
||||||
async fetch() {
|
show: false,
|
||||||
this.loading = true;
|
});
|
||||||
this.data = [];
|
createApp({
|
||||||
const res = await fetch('action/action_auditoria.php');
|
store,
|
||||||
this.data = await res.json();
|
get clase_vista() {
|
||||||
this.loading = false;
|
return store.current.clase_vista;
|
||||||
},
|
},
|
||||||
invertir() {
|
registros: {
|
||||||
this.data = this.data.reverse();
|
data: [],
|
||||||
},
|
async fetch() {
|
||||||
mostrarComentario(registro_id) {
|
// if (!store.filters.facultad_id || !store.filters.periodo_id) return
|
||||||
const registro = this.data.find((registro) => registro.registro_id === registro_id);
|
this.loading = true;
|
||||||
store.current.comentario = registro.comentario;
|
this.data = [];
|
||||||
$('#ver-comentario').modal('show');
|
const params = {
|
||||||
},
|
facultad_id: 19,
|
||||||
get relevant() {
|
periodo_id: 2,
|
||||||
/*
|
};
|
||||||
facultad_id: null,
|
const paramsUrl = new URLSearchParams(params).toString();
|
||||||
fecha: null,
|
const res = await fetch(`action/action_auditoria.php?${paramsUrl}`, {
|
||||||
fecha_inicio: null,
|
method: 'GET',
|
||||||
fecha_fin: null,
|
});
|
||||||
profesor: null,
|
this.data = await res.json();
|
||||||
asistencia: null,
|
this.loading = false;
|
||||||
estado_id: null,
|
},
|
||||||
if one of the filters is null, then it is not relevant
|
invertir() {
|
||||||
|
this.data = this.data.reverse();
|
||||||
*/
|
},
|
||||||
const filters = Object.keys(store.filters).filter((filtro) => store.filters[filtro] || store.filters[filtro]?.length > 0);
|
mostrarComentario(registro_id) {
|
||||||
return this.data.filter((registro) => {
|
const registro = this.data.find((registro) => registro.registro_id === registro_id);
|
||||||
return filters.every((filtro) => {
|
store.current.comentario = registro.comentario;
|
||||||
switch (filtro) {
|
$('#ver-comentario').modal('show');
|
||||||
case 'fecha':
|
},
|
||||||
return registro.registro_fecha_ideal === store.filters[filtro];
|
get relevant() {
|
||||||
case 'fecha_inicio':
|
/*
|
||||||
return registro.registro_fecha_ideal >= store.filters[filtro];
|
facultad_id: null,
|
||||||
case 'fecha_fin':
|
fecha: null,
|
||||||
return registro.registro_fecha_ideal <= store.filters[filtro];
|
fecha_inicio: null,
|
||||||
case 'profesor':
|
fecha_fin: null,
|
||||||
const textoFiltro = store.filters[filtro].toLowerCase();
|
profesor: null,
|
||||||
if (/^\([^)]+\)\s[\s\S]+$/.test(textoFiltro)) {
|
asistencia: null,
|
||||||
const clave = registro.profesor_clave.toLowerCase();
|
estado_id: null,
|
||||||
const filtroClave = textoFiltro.match(/\((.*?)\)/)?.[1];
|
if one of the filters is null, then it is not relevant
|
||||||
console.log(clave, filtroClave);
|
|
||||||
return clave.includes(filtroClave);
|
*/
|
||||||
}
|
const filters = Object.keys(store.filters).filter((filtro) => store.filters[filtro] || store.filters[filtro]?.length > 0);
|
||||||
else {
|
/*
|
||||||
const nombre = registro.profesor_nombre.toLowerCase();
|
store.current
|
||||||
return nombre.includes(textoFiltro);
|
page: 1,
|
||||||
}
|
maxPages: 10,
|
||||||
case 'facultad_id':
|
perPage: 10,
|
||||||
return registro.facultad_id === store.filters[filtro];
|
*/
|
||||||
case 'estados':
|
return this.data.filter((registro) => {
|
||||||
if (store.filters[filtro].length === 0)
|
return filters.every((filtro) => {
|
||||||
return true;
|
switch (filtro) {
|
||||||
return store.filters[filtro].includes(registro.estado_supervisor_id);
|
case 'fecha':
|
||||||
case 'bloque_horario':
|
return registro.registro_fecha_ideal === store.filters[filtro];
|
||||||
const bloque = store.bloques_horario.data.find((bloque) => bloque.id === store.filters[filtro]);
|
case 'fecha_inicio':
|
||||||
return registro.horario_hora <= bloque.hora_fin && registro.horario_fin >= bloque.hora_inicio;
|
return registro.registro_fecha_ideal >= store.filters[filtro];
|
||||||
default:
|
case 'fecha_fin':
|
||||||
return true;
|
return registro.registro_fecha_ideal <= store.filters[filtro];
|
||||||
}
|
case 'profesor':
|
||||||
});
|
const textoFiltro = store.filters[filtro].toLowerCase();
|
||||||
});
|
if (/^\([^)]+\)\s[\s\S]+$/.test(textoFiltro)) {
|
||||||
},
|
const clave = registro.profesor_clave.toLowerCase();
|
||||||
async descargar() {
|
const filtroClave = textoFiltro.match(/\((.*?)\)/)?.[1];
|
||||||
if (this.relevant.length === 0)
|
// console.log(clave, filtroClave);
|
||||||
return;
|
return clave.includes(filtroClave);
|
||||||
const res = await fetch('export/supervisor_excel.php', {
|
}
|
||||||
method: 'POST',
|
else {
|
||||||
headers: {
|
const nombre = registro.profesor_nombre.toLowerCase();
|
||||||
'Content-Type': 'application/json'
|
return nombre.includes(textoFiltro);
|
||||||
},
|
}
|
||||||
body: JSON.stringify(this.relevant)
|
case 'facultad_id':
|
||||||
});
|
return registro.facultad_id === store.filters[filtro];
|
||||||
const blob = await res.blob();
|
case 'estados':
|
||||||
window.saveAs(blob, `auditoria_${new Date().toISOString().slice(0, 10)}.xlsx`);
|
if (store.filters[filtro].length === 0)
|
||||||
}
|
return true;
|
||||||
},
|
return store.filters[filtro].includes(registro.estado_supervisor_id);
|
||||||
get profesores() {
|
case 'bloque_horario':
|
||||||
return this.registros.data.map((registro) => ({
|
const bloque = store.bloques_horario.data.find((bloque) => bloque.id === store.filters[filtro]);
|
||||||
profesor_id: registro.profesor_id,
|
return registro.horario_hora <= bloque.hora_fin && registro.horario_fin >= bloque.hora_inicio;
|
||||||
profesor_nombre: registro.profesor_nombre,
|
default:
|
||||||
profesor_correo: registro.profesor_correo,
|
return true;
|
||||||
profesor_clave: registro.profesor_clave,
|
}
|
||||||
profesor_grado: registro.profesor_grado,
|
});
|
||||||
})).sort((a, b) => a.profesor_nombre.localeCompare(b.profesor_nombre));
|
});
|
||||||
},
|
},
|
||||||
async mounted() {
|
async descargar() {
|
||||||
await this.registros.fetch();
|
store.current.modal_state = 'Generando reporte en Excel...';
|
||||||
await store.facultades.fetch();
|
$('div.modal#cargando').modal('show');
|
||||||
await store.estados.fetch();
|
this.loading = true;
|
||||||
await store.bloques_horario.fetch();
|
if (this.relevant.length === 0)
|
||||||
store.filters.bloque_horario = store.bloques_horario.data.find((bloque) => bloque.selected)?.id;
|
return;
|
||||||
store.filters.switchFechas();
|
try {
|
||||||
}
|
const res = await fetch('export/supervisor_excel.php', {
|
||||||
}).mount('#app');
|
method: 'POST',
|
||||||
|
headers: {
|
||||||
|
'Content-Type': 'application/json'
|
||||||
|
},
|
||||||
|
body: JSON.stringify(this.relevant)
|
||||||
|
});
|
||||||
|
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) => ({
|
||||||
|
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,
|
||||||
|
}))
|
||||||
|
.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.switchFechas();
|
||||||
|
$('div.modal#cargando').modal('hide');
|
||||||
|
}
|
||||||
|
}).mount('#app');
|
||||||
|
|||||||
240
js/client.js
240
js/client.js
@@ -1,120 +1,120 @@
|
|||||||
// @ts-ignore Import module
|
// @ts-ignore Import module
|
||||||
import { createApp, reactive } from 'https://unpkg.com/petite-vue?module';
|
import { createApp, reactive } from 'https://unpkg.com/petite-vue?module';
|
||||||
const webServices = {
|
const webServices = {
|
||||||
getPeriodosV1: async () => {
|
getPeriodosV1: async () => {
|
||||||
try {
|
try {
|
||||||
const response = await fetch('periodos.v1.php');
|
const response = await fetch('periodos.v1.php');
|
||||||
return await response.json();
|
return await response.json();
|
||||||
}
|
}
|
||||||
catch (error) {
|
catch (error) {
|
||||||
console.log(error);
|
console.log(error);
|
||||||
return [];
|
return [];
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
getPeriodosV2: async () => {
|
getPeriodosV2: async () => {
|
||||||
try {
|
try {
|
||||||
const response = await fetch('periodos.v2.php');
|
const response = await fetch('periodos.v2.php');
|
||||||
return await response.json();
|
return await response.json();
|
||||||
}
|
}
|
||||||
catch (error) {
|
catch (error) {
|
||||||
console.log(error);
|
console.log(error);
|
||||||
return [];
|
return [];
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
const store = reactive({
|
const store = reactive({
|
||||||
periodosV1: [],
|
periodosV1: [],
|
||||||
periodosV2: [],
|
periodosV2: [],
|
||||||
errors: [],
|
errors: [],
|
||||||
fechas(idPeriodo) {
|
fechas(idPeriodo) {
|
||||||
const periodo = this.periodosV2.find((periodo) => periodo.IdPeriodo === idPeriodo);
|
const periodo = this.periodosV2.find((periodo) => periodo.IdPeriodo === idPeriodo);
|
||||||
return {
|
return {
|
||||||
inicio: periodo ? periodo.FechaInicio : '',
|
inicio: periodo ? periodo.FechaInicio : '',
|
||||||
fin: periodo ? periodo.FechaFin : ''
|
fin: periodo ? periodo.FechaFin : ''
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
periodov1(idPeriodo) {
|
periodov1(idPeriodo) {
|
||||||
return this.periodosV1.find((periodo) => periodo.IdPeriodo === idPeriodo);
|
return this.periodosV1.find((periodo) => periodo.IdPeriodo === idPeriodo);
|
||||||
},
|
},
|
||||||
periodov2(idPeriodo) {
|
periodov2(idPeriodo) {
|
||||||
return this.periodosV2.filter((periodo) => periodo.IdPeriodo === idPeriodo);
|
return this.periodosV2.filter((periodo) => periodo.IdPeriodo === idPeriodo);
|
||||||
},
|
},
|
||||||
async addPeriodo(periodo) {
|
async addPeriodo(periodo) {
|
||||||
try {
|
try {
|
||||||
const result = await fetch('backend/periodos.php', {
|
const result = await fetch('backend/periodos.php', {
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
body: JSON.stringify({
|
body: JSON.stringify({
|
||||||
...periodo,
|
...periodo,
|
||||||
...this.fechas(periodo.IdPeriodo)
|
...this.fechas(periodo.IdPeriodo)
|
||||||
}),
|
}),
|
||||||
headers: {
|
headers: {
|
||||||
'Content-Type': 'application/json'
|
'Content-Type': 'application/json'
|
||||||
}
|
}
|
||||||
}).then((response) => response.json());
|
}).then((response) => response.json());
|
||||||
if (result.success) {
|
if (result.success) {
|
||||||
this.periodosV1 = this.periodosV1.map((periodoV1) => {
|
this.periodosV1 = this.periodosV1.map((periodoV1) => {
|
||||||
if (periodoV1.IdPeriodo === periodo.IdPeriodo) {
|
if (periodoV1.IdPeriodo === periodo.IdPeriodo) {
|
||||||
periodoV1.in_db = true;
|
periodoV1.in_db = true;
|
||||||
}
|
}
|
||||||
return periodoV1;
|
return periodoV1;
|
||||||
});
|
});
|
||||||
return result;
|
return result;
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
this.errors.push(result.message);
|
this.errors.push(result.message);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
catch (error) {
|
catch (error) {
|
||||||
this.errors.push(error);
|
this.errors.push(error);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
async addCarreras(idPeriodo) {
|
async addCarreras(idPeriodo) {
|
||||||
try {
|
try {
|
||||||
const periodoV1 = this.periodov1(idPeriodo);
|
const periodoV1 = this.periodov1(idPeriodo);
|
||||||
const periodoV2 = this.periodov2(idPeriodo);
|
const periodoV2 = this.periodov2(idPeriodo);
|
||||||
const data = periodoV2.map(({ ClaveCarrera, NombreCarrera }) => ({
|
const data = periodoV2.map(({ ClaveCarrera, NombreCarrera }) => ({
|
||||||
ClaveCarrera: ClaveCarrera,
|
ClaveCarrera: ClaveCarrera,
|
||||||
NombreCarrera: NombreCarrera,
|
NombreCarrera: NombreCarrera,
|
||||||
IdNivel: periodoV1.IdNivel,
|
IdNivel: periodoV1.IdNivel,
|
||||||
}));
|
}));
|
||||||
const result = await fetch('backend/carreras.php', {
|
const result = await fetch('backend/carreras.php', {
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
body: JSON.stringify(data),
|
body: JSON.stringify(data),
|
||||||
headers: {
|
headers: {
|
||||||
'Content-Type': 'application/json'
|
'Content-Type': 'application/json'
|
||||||
}
|
}
|
||||||
}).then((response) => response.json());
|
}).then((response) => response.json());
|
||||||
if (result.success) {
|
if (result.success) {
|
||||||
await webServices.getPeriodosV1().then((periodosV1) => {
|
await webServices.getPeriodosV1().then((periodosV1) => {
|
||||||
this.periodosV1 = periodosV1;
|
this.periodosV1 = periodosV1;
|
||||||
});
|
});
|
||||||
await webServices.getPeriodosV2().then((periodosV2) => {
|
await webServices.getPeriodosV2().then((periodosV2) => {
|
||||||
this.periodosV2 = periodosV2;
|
this.periodosV2 = periodosV2;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
catch (error) {
|
catch (error) {
|
||||||
this.errors.push(error);
|
this.errors.push(error);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
createApp({
|
createApp({
|
||||||
store,
|
store,
|
||||||
info(IdPeriodo) {
|
info(IdPeriodo) {
|
||||||
const periodo = store.periodosV2.find((periodo) => periodo.IdPeriodo === IdPeriodo &&
|
const periodo = store.periodosV2.find((periodo) => periodo.IdPeriodo === IdPeriodo &&
|
||||||
periodo.FechaInicio != '' && periodo.FechaFin != '');
|
periodo.FechaInicio != '' && periodo.FechaFin != '');
|
||||||
return periodo;
|
return periodo;
|
||||||
},
|
},
|
||||||
complete(IdPeriodo) {
|
complete(IdPeriodo) {
|
||||||
const info = this.info(IdPeriodo);
|
const info = this.info(IdPeriodo);
|
||||||
return info !== undefined;
|
return info !== undefined;
|
||||||
},
|
},
|
||||||
mounted: async () => {
|
mounted: async () => {
|
||||||
await webServices.getPeriodosV1().then((periodosV1) => {
|
await webServices.getPeriodosV1().then((periodosV1) => {
|
||||||
store.periodosV1 = periodosV1;
|
store.periodosV1 = periodosV1;
|
||||||
});
|
});
|
||||||
await webServices.getPeriodosV2().then((periodosV2) => {
|
await webServices.getPeriodosV2().then((periodosV2) => {
|
||||||
store.periodosV2 = periodosV2;
|
store.periodosV2 = periodosV2;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}).mount();
|
}).mount();
|
||||||
|
|||||||
@@ -1,135 +1,135 @@
|
|||||||
const compareHours = (hora1, hora2) => {
|
const compareHours = (hora1, hora2) => {
|
||||||
const [h1, m1] = hora1.split(":").map(Number);
|
const [h1, m1] = hora1.split(":").map(Number);
|
||||||
const [h2, m2] = hora2.split(":").map(Number);
|
const [h2, m2] = hora2.split(":").map(Number);
|
||||||
if (h1 !== h2) {
|
if (h1 !== h2) {
|
||||||
return h1 > h2 ? 1 : -1;
|
return h1 > h2 ? 1 : -1;
|
||||||
}
|
}
|
||||||
if (m1 !== m2) {
|
if (m1 !== m2) {
|
||||||
return m1 > m2 ? 1 : -1;
|
return m1 > m2 ? 1 : -1;
|
||||||
}
|
}
|
||||||
return 0;
|
return 0;
|
||||||
};
|
};
|
||||||
let horarios = [];
|
let horarios = [];
|
||||||
const table = document.querySelector("table");
|
const table = document.querySelector("table");
|
||||||
if (!(table instanceof HTMLTableElement)) {
|
if (!(table instanceof HTMLTableElement)) {
|
||||||
triggerMessage("No se ha encontrado la tabla", "Error", "error");
|
triggerMessage("No se ha encontrado la tabla", "Error", "error");
|
||||||
throw new Error("No se ha encontrado la tabla");
|
throw new Error("No se ha encontrado la tabla");
|
||||||
}
|
}
|
||||||
[...Array(16).keys()].map(x => x + 7).forEach(hora => {
|
[...Array(16).keys()].map(x => x + 7).forEach(hora => {
|
||||||
// add 7 rows for each hour
|
// add 7 rows for each hour
|
||||||
[0, 15, 30, 45].map((minute) => `${minute}`.padStart(2, '0')).forEach((minute) => {
|
[0, 15, 30, 45].map((minute) => `${minute}`.padStart(2, '0')).forEach((minute) => {
|
||||||
const tr = document.createElement("tr");
|
const tr = document.createElement("tr");
|
||||||
tr.id = `hora-${hora}:${minute}`;
|
tr.id = `hora-${hora}:${minute}`;
|
||||||
tr.classList.add(hora > 13 ? "tarde" : "mañana");
|
tr.classList.add(hora > 13 ? "tarde" : "mañana");
|
||||||
if (minute == "00") {
|
if (minute == "00") {
|
||||||
const th = document.createElement("th");
|
const th = document.createElement("th");
|
||||||
th.classList.add("text-center");
|
th.classList.add("text-center");
|
||||||
th.scope = "row";
|
th.scope = "row";
|
||||||
th.rowSpan = 4;
|
th.rowSpan = 4;
|
||||||
th.innerText = `${hora}:00`;
|
th.innerText = `${hora}:00`;
|
||||||
th.style.verticalAlign = "middle";
|
th.style.verticalAlign = "middle";
|
||||||
tr.appendChild(th);
|
tr.appendChild(th);
|
||||||
}
|
}
|
||||||
["lunes", "martes", "miércoles", "jueves", "viernes", "sábado"].forEach(día => {
|
["lunes", "martes", "miércoles", "jueves", "viernes", "sábado"].forEach(día => {
|
||||||
const td = document.createElement("td");
|
const td = document.createElement("td");
|
||||||
td.id = `hora-${hora}:${minute}-${día}`;
|
td.id = `hora-${hora}:${minute}-${día}`;
|
||||||
tr.appendChild(td);
|
tr.appendChild(td);
|
||||||
});
|
});
|
||||||
const tbody = document.querySelector("tbody#horario");
|
const tbody = document.querySelector("tbody#horario");
|
||||||
if (!(tbody instanceof HTMLTableSectionElement)) {
|
if (!(tbody instanceof HTMLTableSectionElement)) {
|
||||||
throw new Error("No se ha encontrado el tbody");
|
throw new Error("No se ha encontrado el tbody");
|
||||||
}
|
}
|
||||||
tbody.appendChild(tr);
|
tbody.appendChild(tr);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
const empty_table = table.cloneNode(true);
|
const empty_table = table.cloneNode(true);
|
||||||
document.querySelectorAll('.hidden').forEach((element) => {
|
document.querySelectorAll('.hidden').forEach((element) => {
|
||||||
element.style.display = "none";
|
element.style.display = "none";
|
||||||
});
|
});
|
||||||
// hide the table
|
// hide the table
|
||||||
table.style.display = "none";
|
table.style.display = "none";
|
||||||
function moveHorario(id, día, hora) {
|
function moveHorario(id, día, hora) {
|
||||||
const formData = new FormData();
|
const formData = new FormData();
|
||||||
formData.append("id", id);
|
formData.append("id", id);
|
||||||
formData.append("hora", hora);
|
formData.append("hora", hora);
|
||||||
formData.append("día", día);
|
formData.append("día", día);
|
||||||
fetch("action/action_horario_update.php", {
|
fetch("action/action_horario_update.php", {
|
||||||
method: "POST",
|
method: "POST",
|
||||||
body: formData
|
body: formData
|
||||||
}).then(res => res.json()).then(response => {
|
}).then(res => res.json()).then(response => {
|
||||||
if (response.status == "success") {
|
if (response.status == "success") {
|
||||||
triggerMessage("Horario movido", "Éxito", "success");
|
triggerMessage("Horario movido", "Éxito", "success");
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
triggerMessage(response.message, "Error");
|
triggerMessage(response.message, "Error");
|
||||||
}
|
}
|
||||||
}).then(() => {
|
}).then(() => {
|
||||||
renderHorario();
|
renderHorario();
|
||||||
}).catch(err => {
|
}).catch(err => {
|
||||||
triggerMessage(err, "Error");
|
triggerMessage(err, "Error");
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
function renderHorario() {
|
function renderHorario() {
|
||||||
if (horarios.length == 0) {
|
if (horarios.length == 0) {
|
||||||
triggerMessage("Este profesor hay horarios para mostrar", "Error", "info");
|
triggerMessage("Este profesor hay horarios para mostrar", "Error", "info");
|
||||||
table.style.display = "none";
|
table.style.display = "none";
|
||||||
document.querySelectorAll('.hidden').forEach((element) => element.style.display = "none");
|
document.querySelectorAll('.hidden').forEach((element) => element.style.display = "none");
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
// show the table
|
// show the table
|
||||||
table.style.display = "table";
|
table.style.display = "table";
|
||||||
document.querySelectorAll('.hidden').forEach((element) => element.style.display = "block");
|
document.querySelectorAll('.hidden').forEach((element) => element.style.display = "block");
|
||||||
// clear the table
|
// clear the table
|
||||||
table.innerHTML = empty_table.outerHTML;
|
table.innerHTML = empty_table.outerHTML;
|
||||||
function conflicts(horario1, horario2) {
|
function conflicts(horario1, horario2) {
|
||||||
const { hora: hora_inicio1, hora_final: hora_final1, dia: dia1 } = horario1;
|
const { hora: hora_inicio1, hora_final: hora_final1, dia: dia1 } = horario1;
|
||||||
const { hora: hora_inicio2, hora_final: hora_final2, dia: dia2 } = horario2;
|
const { hora: hora_inicio2, hora_final: hora_final2, dia: dia2 } = horario2;
|
||||||
if (dia1 !== dia2) {
|
if (dia1 !== dia2) {
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
const compareInicios = compareHours(hora_inicio1, hora_inicio2);
|
const compareInicios = compareHours(hora_inicio1, hora_inicio2);
|
||||||
const compareFinales = compareHours(hora_final1, hora_final2);
|
const compareFinales = compareHours(hora_final1, hora_final2);
|
||||||
if (compareInicios >= 0 && compareInicios <= compareFinales ||
|
if (compareInicios >= 0 && compareInicios <= compareFinales ||
|
||||||
compareFinales >= 0 && compareFinales <= -compareInicios) {
|
compareFinales >= 0 && compareFinales <= -compareInicios) {
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
// remove the next 5 cells
|
// remove the next 5 cells
|
||||||
function removeNextCells(horas, minutos, dia, cells = 5) {
|
function removeNextCells(horas, minutos, dia, cells = 5) {
|
||||||
for (let i = 1; i <= cells; i++) {
|
for (let i = 1; i <= cells; i++) {
|
||||||
const minute = minutos + i * 15;
|
const minute = minutos + i * 15;
|
||||||
const nextMinute = (minute % 60).toString().padStart(2, "0");
|
const nextMinute = (minute % 60).toString().padStart(2, "0");
|
||||||
const nextHour = horas + Math.floor(minute / 60);
|
const nextHour = horas + Math.floor(minute / 60);
|
||||||
const cellId = `hora-${nextHour}:${nextMinute}-${dia}`;
|
const cellId = `hora-${nextHour}:${nextMinute}-${dia}`;
|
||||||
const cellElement = document.getElementById(cellId);
|
const cellElement = document.getElementById(cellId);
|
||||||
if (cellElement) {
|
if (cellElement) {
|
||||||
cellElement.remove();
|
cellElement.remove();
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
console.log(`No se ha encontrado la celda ${cellId}`);
|
console.log(`No se ha encontrado la celda ${cellId}`);
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
function newBlock(horario, edit = false) {
|
function newBlock(horario, edit = false) {
|
||||||
function move(horario, cells = 5) {
|
function move(horario, cells = 5) {
|
||||||
const [horas, minutos] = horario.hora.split(":").map(Number);
|
const [horas, minutos] = horario.hora.split(":").map(Number);
|
||||||
const cell = document.getElementById(`hora-${horas}:${minutos.toString().padStart(2, "0")}-${horario.dia}`);
|
const cell = document.getElementById(`hora-${horas}:${minutos.toString().padStart(2, "0")}-${horario.dia}`);
|
||||||
const { top, left } = cell.getBoundingClientRect();
|
const { top, left } = cell.getBoundingClientRect();
|
||||||
const block = document.getElementById(`block-${horario.id}`);
|
const block = document.getElementById(`block-${horario.id}`);
|
||||||
block.style.top = `${top}px`;
|
block.style.top = `${top}px`;
|
||||||
block.style.left = `${left}px`;
|
block.style.left = `${left}px`;
|
||||||
removeNextCells(horas, minutos, horario.dia, cells);
|
removeNextCells(horas, minutos, horario.dia, cells);
|
||||||
}
|
}
|
||||||
const [horas, minutos] = horario.hora.split(":").map(x => parseInt(x));
|
const [horas, minutos] = horario.hora.split(":").map(x => parseInt(x));
|
||||||
const hora = `${horas}:${minutos.toString().padStart(2, "0")}`;
|
const hora = `${horas}:${minutos.toString().padStart(2, "0")}`;
|
||||||
horario.hora = hora;
|
horario.hora = hora;
|
||||||
const cell = document.getElementById(`hora-${horario.hora}-${horario.dia}`);
|
const cell = document.getElementById(`hora-${horario.hora}-${horario.dia}`);
|
||||||
if (!cell)
|
if (!cell)
|
||||||
return;
|
return;
|
||||||
cell.dataset.ids = `${horario.id}`;
|
cell.dataset.ids = `${horario.id}`;
|
||||||
const float_menu = edit ?
|
const float_menu = edit ?
|
||||||
`<div class="menu-flotante p-2" style="opacity: .7;">
|
`<div class="menu-flotante p-2" style="opacity: .7;">
|
||||||
<a class="mx-2" href="#" data-toggle="modal" data-target="#modal-editar">
|
<a class="mx-2" href="#" data-toggle="modal" data-target="#modal-editar">
|
||||||
<i class="ing-editar ing"></i>
|
<i class="ing-editar ing"></i>
|
||||||
@@ -137,9 +137,9 @@ function renderHorario() {
|
|||||||
<a class="mx-2" href="#" data-toggle="modal" data-target="#modal-borrar">
|
<a class="mx-2" href="#" data-toggle="modal" data-target="#modal-borrar">
|
||||||
<i class="ing-basura ing"></i>
|
<i class="ing-basura ing"></i>
|
||||||
</a>
|
</a>
|
||||||
</div>`
|
</div>`
|
||||||
: '';
|
: '';
|
||||||
cell.innerHTML =
|
cell.innerHTML =
|
||||||
`<div style="overflow-y: auto; overflow-x: hidden; height: 100%;" id="block-${horario.id}" class="position-absolute w-100 h-100">
|
`<div style="overflow-y: auto; overflow-x: hidden; height: 100%;" id="block-${horario.id}" class="position-absolute w-100 h-100">
|
||||||
<small class="text-gray">${horario.hora}</small>
|
<small class="text-gray">${horario.hora}</small>
|
||||||
<b class="title">${horario.materia}</b> <br>
|
<b class="title">${horario.materia}</b> <br>
|
||||||
@@ -148,27 +148,27 @@ function renderHorario() {
|
|||||||
${horario.profesores.map((profesor) => ` <span class="ing ing-formacion mx-1"></span>${profesor.grado ?? ''} ${profesor.profesor}`).join("<br>")}
|
${horario.profesores.map((profesor) => ` <span class="ing ing-formacion mx-1"></span>${profesor.grado ?? ''} ${profesor.profesor}`).join("<br>")}
|
||||||
</small>
|
</small>
|
||||||
</div>
|
</div>
|
||||||
${float_menu}`;
|
${float_menu}`;
|
||||||
cell.classList.add("bloque-clase", "position-relative");
|
cell.classList.add("bloque-clase", "position-relative");
|
||||||
cell.rowSpan = horario.bloques;
|
cell.rowSpan = horario.bloques;
|
||||||
// draggable
|
// draggable
|
||||||
cell.draggable = write;
|
cell.draggable = write;
|
||||||
if (horario.bloques > 0) {
|
if (horario.bloques > 0) {
|
||||||
removeNextCells(horas, minutos, horario.dia, horario.bloques - 1);
|
removeNextCells(horas, minutos, horario.dia, horario.bloques - 1);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
function newConflictBlock(horarios, edit = false) {
|
function newConflictBlock(horarios, edit = false) {
|
||||||
const first_horario = horarios[0];
|
const first_horario = horarios[0];
|
||||||
const [horas, minutos] = first_horario.hora.split(":").map(x => parseInt(x));
|
const [horas, minutos] = first_horario.hora.split(":").map(x => parseInt(x));
|
||||||
const hora = `${horas}:${minutos.toString().padStart(2, "0")}`;
|
const hora = `${horas}:${minutos.toString().padStart(2, "0")}`;
|
||||||
const ids = horarios.map(horario => horario.id);
|
const ids = horarios.map(horario => horario.id);
|
||||||
const cell = document.getElementById(`hora-${hora}-${first_horario.dia}`);
|
const cell = document.getElementById(`hora-${hora}-${first_horario.dia}`);
|
||||||
if (cell == null) {
|
if (cell == null) {
|
||||||
console.error(`Error: No se encontró la celda: hora-${hora}-${first_horario.dia}`);
|
console.error(`Error: No se encontró la celda: hora-${hora}-${first_horario.dia}`);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
cell.dataset.ids = ids.join(",");
|
cell.dataset.ids = ids.join(",");
|
||||||
// replace the content of the cell
|
// replace the content of the cell
|
||||||
cell.innerHTML = `
|
cell.innerHTML = `
|
||||||
<small class='text-danger'>
|
<small class='text-danger'>
|
||||||
${hora}
|
${hora}
|
||||||
@@ -183,17 +183,17 @@ function renderHorario() {
|
|||||||
<i class="text-danger">Ver horarios …</i>
|
<i class="text-danger">Ver horarios …</i>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
`;
|
`;
|
||||||
// Add classes and attributes
|
// Add classes and attributes
|
||||||
cell.classList.add("conflict", "bloque-clase");
|
cell.classList.add("conflict", "bloque-clase");
|
||||||
cell.setAttribute("role", "button");
|
cell.setAttribute("role", "button");
|
||||||
// Add event listener for the cell
|
// Add event listener for the cell
|
||||||
cell.addEventListener("click", () => {
|
cell.addEventListener("click", () => {
|
||||||
$("#modal-choose").modal("show");
|
$("#modal-choose").modal("show");
|
||||||
const ids = cell.getAttribute("data-ids").split(",").map(x => parseInt(x));
|
const ids = cell.getAttribute("data-ids").split(",").map(x => parseInt(x));
|
||||||
const tbody = document.querySelector("#modal-choose tbody");
|
const tbody = document.querySelector("#modal-choose tbody");
|
||||||
tbody.innerHTML = "";
|
tbody.innerHTML = "";
|
||||||
horarios.filter(horario => ids.includes(horario.id)).sort((a, b) => compareHours(a.hora, b.hora)).forEach(horario => {
|
horarios.filter(horario => ids.includes(horario.id)).sort((a, b) => compareHours(a.hora, b.hora)).forEach(horario => {
|
||||||
tbody.innerHTML += `
|
tbody.innerHTML += `
|
||||||
<tr data-ids="${horario.id}">
|
<tr data-ids="${horario.id}">
|
||||||
<td><small>${horario.hora.slice(0, -3)}-${horario.hora_final.slice(0, -3)}</small></td>
|
<td><small>${horario.hora.slice(0, -3)}-${horario.hora_final.slice(0, -3)}</small></td>
|
||||||
@@ -214,201 +214,201 @@ function renderHorario() {
|
|||||||
</button>
|
</button>
|
||||||
</td>
|
</td>
|
||||||
` : ""}
|
` : ""}
|
||||||
</tr>`;
|
</tr>`;
|
||||||
});
|
});
|
||||||
document.querySelectorAll(".dismiss-editar").forEach(btn => {
|
document.querySelectorAll(".dismiss-editar").forEach(btn => {
|
||||||
btn.addEventListener("click", () => $("#modal-choose").modal("hide"));
|
btn.addEventListener("click", () => $("#modal-choose").modal("hide"));
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
function getDuration(hora_i, hora_f) {
|
function getDuration(hora_i, hora_f) {
|
||||||
const [horas_i, minutos_i] = hora_i.split(":").map(x => parseInt(x));
|
const [horas_i, minutos_i] = hora_i.split(":").map(x => parseInt(x));
|
||||||
const [horas_f, minutos_f] = hora_f.split(":").map(x => parseInt(x));
|
const [horas_f, minutos_f] = hora_f.split(":").map(x => parseInt(x));
|
||||||
const date_i = new Date(0, 0, 0, horas_i, minutos_i);
|
const date_i = new Date(0, 0, 0, horas_i, minutos_i);
|
||||||
const date_f = new Date(0, 0, 0, horas_f, minutos_f);
|
const date_f = new Date(0, 0, 0, horas_f, minutos_f);
|
||||||
const diffInMilliseconds = date_f.getTime() - date_i.getTime();
|
const diffInMilliseconds = date_f.getTime() - date_i.getTime();
|
||||||
const diffInMinutes = diffInMilliseconds / (1000 * 60);
|
const diffInMinutes = diffInMilliseconds / (1000 * 60);
|
||||||
const diffIn15MinuteIntervals = diffInMinutes / 15;
|
const diffIn15MinuteIntervals = diffInMinutes / 15;
|
||||||
return Math.floor(diffIn15MinuteIntervals);
|
return Math.floor(diffIn15MinuteIntervals);
|
||||||
}
|
}
|
||||||
const maxHoraFinal = horarios.reduce((max, horario) => {
|
const maxHoraFinal = horarios.reduce((max, horario) => {
|
||||||
const [horas, minutos] = horario.hora_final.split(":").map(x => parseInt(x));
|
const [horas, minutos] = horario.hora_final.split(":").map(x => parseInt(x));
|
||||||
const date = new Date(0, 0, 0, horas, minutos);
|
const date = new Date(0, 0, 0, horas, minutos);
|
||||||
return date > max ? date : max;
|
return date > max ? date : max;
|
||||||
}, new Date(0, 0, 0, 0, 0));
|
}, new Date(0, 0, 0, 0, 0));
|
||||||
const horaFinalMax = new Date(0, 0, 0, maxHoraFinal.getHours(), maxHoraFinal.getMinutes());
|
const horaFinalMax = new Date(0, 0, 0, maxHoraFinal.getHours(), maxHoraFinal.getMinutes());
|
||||||
const blocks = getDuration(first_horario.hora, `${horaFinalMax.getHours()}:${horaFinalMax.getMinutes()}`);
|
const blocks = getDuration(first_horario.hora, `${horaFinalMax.getHours()}:${horaFinalMax.getMinutes()}`);
|
||||||
cell.setAttribute("rowSpan", blocks.toString());
|
cell.setAttribute("rowSpan", blocks.toString());
|
||||||
removeNextCells(horas, minutos, first_horario.dia, blocks - 1);
|
removeNextCells(horas, minutos, first_horario.dia, blocks - 1);
|
||||||
}
|
}
|
||||||
const conflictBlocks = horarios.filter((horario, index, arrayHorario) => arrayHorario.filter((_, i) => i != index).some(horario2 => conflicts(horario, horario2)))
|
const conflictBlocks = horarios.filter((horario, index, arrayHorario) => arrayHorario.filter((_, i) => i != index).some(horario2 => conflicts(horario, horario2)))
|
||||||
.sort((a, b) => compareHours(a.hora, b.hora));
|
.sort((a, b) => compareHours(a.hora, b.hora));
|
||||||
const classes = horarios.filter(horario => !conflictBlocks.includes(horario));
|
const classes = horarios.filter(horario => !conflictBlocks.includes(horario));
|
||||||
const conflictBlocksPacked = []; // array of sets
|
const conflictBlocksPacked = []; // array of sets
|
||||||
conflictBlocks.forEach(horario => {
|
conflictBlocks.forEach(horario => {
|
||||||
const setIndex = conflictBlocksPacked.findIndex(set => set.some(horario2 => conflicts(horario, horario2)));
|
const setIndex = conflictBlocksPacked.findIndex(set => set.some(horario2 => conflicts(horario, horario2)));
|
||||||
if (setIndex === -1) {
|
if (setIndex === -1) {
|
||||||
conflictBlocksPacked.push([horario]);
|
conflictBlocksPacked.push([horario]);
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
conflictBlocksPacked[setIndex].push(horario);
|
conflictBlocksPacked[setIndex].push(horario);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
classes.forEach(horario => newBlock(horario, write));
|
classes.forEach(horario => newBlock(horario, write));
|
||||||
conflictBlocksPacked.forEach(horarios => newConflictBlock(horarios, write));
|
conflictBlocksPacked.forEach(horarios => newConflictBlock(horarios, write));
|
||||||
// remove the elements that are not in the limits
|
// remove the elements that are not in the limits
|
||||||
let max_hour = Math.max(...horarios.map(horario => {
|
let max_hour = Math.max(...horarios.map(horario => {
|
||||||
const lastMoment = moment(horario.hora, "HH:mm").add(horario.bloques * 15, "minutes");
|
const lastMoment = moment(horario.hora, "HH:mm").add(horario.bloques * 15, "minutes");
|
||||||
const lastHour = moment(`${lastMoment.hours()}:00`, "HH:mm");
|
const lastHour = moment(`${lastMoment.hours()}:00`, "HH:mm");
|
||||||
const hourInt = parseInt(lastMoment.format("HH"));
|
const hourInt = parseInt(lastMoment.format("HH"));
|
||||||
return lastMoment.isSame(lastHour) ? hourInt - 1 : hourInt;
|
return lastMoment.isSame(lastHour) ? hourInt - 1 : hourInt;
|
||||||
}));
|
}));
|
||||||
let min_hour = Math.min(...horarios.map(horario => parseInt(horario.hora.split(":")[0])));
|
let min_hour = Math.min(...horarios.map(horario => parseInt(horario.hora.split(":")[0])));
|
||||||
document.querySelectorAll("tbody#horario tr").forEach(hora => {
|
document.querySelectorAll("tbody#horario tr").forEach(hora => {
|
||||||
const hora_id = parseInt(hora.id.split("-")[1].split(":")[0]);
|
const hora_id = parseInt(hora.id.split("-")[1].split(":")[0]);
|
||||||
(hora_id < min_hour || hora_id > max_hour) ? hora.remove() : null;
|
(hora_id < min_hour || hora_id > max_hour) ? hora.remove() : null;
|
||||||
});
|
});
|
||||||
// if there is no sábado, remove the column
|
// if there is no sábado, remove the column
|
||||||
if (!horarios.some(horario => horario.dia == "sábado")) {
|
if (!horarios.some(horario => horario.dia == "sábado")) {
|
||||||
document.querySelectorAll("tbody#horario td").forEach(td => {
|
document.querySelectorAll("tbody#horario td").forEach(td => {
|
||||||
if (td.id.split("-")[2] == "sábado") {
|
if (td.id.split("-")[2] == "sábado") {
|
||||||
td.remove();
|
td.remove();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
// remove the header (the last)
|
// remove the header (the last)
|
||||||
document.querySelector("#headers").lastElementChild.remove();
|
document.querySelector("#headers").lastElementChild.remove();
|
||||||
}
|
}
|
||||||
// adjust width
|
// adjust width
|
||||||
const ths = document.querySelectorAll("tr#headers th");
|
const ths = document.querySelectorAll("tr#headers th");
|
||||||
ths.forEach((th, key) => th.style.width = (key == 0) ? "5%" : `${95 / (ths.length - 1)}%`);
|
ths.forEach((th, key) => th.style.width = (key == 0) ? "5%" : `${95 / (ths.length - 1)}%`);
|
||||||
// search item animation
|
// search item animation
|
||||||
const menúFlontantes = document.querySelectorAll(".menu-flotante");
|
const menúFlontantes = document.querySelectorAll(".menu-flotante");
|
||||||
menúFlontantes.forEach((element) => {
|
menúFlontantes.forEach((element) => {
|
||||||
element.classList.add("d-none");
|
element.classList.add("d-none");
|
||||||
element.parentElement.addEventListener("mouseover", () => element.classList.remove("d-none"));
|
element.parentElement.addEventListener("mouseover", () => element.classList.remove("d-none"));
|
||||||
element.parentElement.addEventListener("mouseout", (e) => element.classList.add("d-none"));
|
element.parentElement.addEventListener("mouseout", (e) => element.classList.add("d-none"));
|
||||||
});
|
});
|
||||||
// droppables
|
// droppables
|
||||||
// forall the .bloque-elements add the event listeners for drag and drop
|
// forall the .bloque-elements add the event listeners for drag and drop
|
||||||
document.querySelectorAll(".bloque-clase").forEach(element => {
|
document.querySelectorAll(".bloque-clase").forEach(element => {
|
||||||
function dragStart() {
|
function dragStart() {
|
||||||
this.classList.add("dragging");
|
this.classList.add("dragging");
|
||||||
}
|
}
|
||||||
function dragEnd() {
|
function dragEnd() {
|
||||||
this.classList.remove("dragging");
|
this.classList.remove("dragging");
|
||||||
}
|
}
|
||||||
element.addEventListener("dragstart", dragStart);
|
element.addEventListener("dragstart", dragStart);
|
||||||
element.addEventListener("dragend", dragEnd);
|
element.addEventListener("dragend", dragEnd);
|
||||||
});
|
});
|
||||||
// forall the cells that are not .bloque-clase add the event listeners for drag and drop
|
// forall the cells that are not .bloque-clase add the event listeners for drag and drop
|
||||||
document.querySelectorAll("td:not(.bloque-clase)").forEach(element => {
|
document.querySelectorAll("td:not(.bloque-clase)").forEach(element => {
|
||||||
function dragOver(e) {
|
function dragOver(e) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
this.classList.add("dragging-over");
|
this.classList.add("dragging-over");
|
||||||
}
|
}
|
||||||
function dragLeave() {
|
function dragLeave() {
|
||||||
this.classList.remove("dragging-over");
|
this.classList.remove("dragging-over");
|
||||||
}
|
}
|
||||||
function drop() {
|
function drop() {
|
||||||
this.classList.remove("dragging-over");
|
this.classList.remove("dragging-over");
|
||||||
const dragging = document.querySelector(".dragging");
|
const dragging = document.querySelector(".dragging");
|
||||||
const id = dragging.getAttribute("data-ids");
|
const id = dragging.getAttribute("data-ids");
|
||||||
const hora = this.id.split("-")[1];
|
const hora = this.id.split("-")[1];
|
||||||
const días = ["lunes", "martes", "miércoles", "jueves", "viernes", "sábado"];
|
const días = ["lunes", "martes", "miércoles", "jueves", "viernes", "sábado"];
|
||||||
let día = this.id.split("-")[2];
|
let día = this.id.split("-")[2];
|
||||||
día = días.indexOf(día) + 1;
|
día = días.indexOf(día) + 1;
|
||||||
// rowspan
|
// rowspan
|
||||||
const bloques = parseInt(dragging.getAttribute("rowspan"));
|
const bloques = parseInt(dragging.getAttribute("rowspan"));
|
||||||
const horaMoment = moment(hora, "HH:mm");
|
const horaMoment = moment(hora, "HH:mm");
|
||||||
const horaFin = horaMoment.add(bloques * 15, "minutes");
|
const horaFin = horaMoment.add(bloques * 15, "minutes");
|
||||||
const limit = moment('22:00', 'HH:mm');
|
const limit = moment('22:00', 'HH:mm');
|
||||||
if (horaFin.isAfter(limit)) {
|
if (horaFin.isAfter(limit)) {
|
||||||
triggerMessage("No se puede mover el bloque a esa hora", "Error");
|
triggerMessage("No se puede mover el bloque a esa hora", "Error");
|
||||||
// scroll to the top
|
// scroll to the top
|
||||||
window.scrollTo(0, 0);
|
window.scrollTo(0, 0);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
// get the horario
|
// get the horario
|
||||||
// remove the horario
|
// remove the horario
|
||||||
const bloque = document.querySelector(`.bloque-clase[data-ids="${id}"]`);
|
const bloque = document.querySelector(`.bloque-clase[data-ids="${id}"]`);
|
||||||
// remove all children
|
// remove all children
|
||||||
while (bloque.firstChild) {
|
while (bloque.firstChild) {
|
||||||
bloque.removeChild(bloque.firstChild);
|
bloque.removeChild(bloque.firstChild);
|
||||||
}
|
}
|
||||||
// prepend a loading child
|
// prepend a loading child
|
||||||
const loading = `<div class="spinner-border" role="status" style="width: 3rem; height: 3rem;">
|
const loading = `<div class="spinner-border" role="status" style="width: 3rem; height: 3rem;">
|
||||||
<span class="sr-only">Loading...</span>
|
<span class="sr-only">Loading...</span>
|
||||||
</div>`;
|
</div>`;
|
||||||
bloque.insertAdjacentHTML("afterbegin", loading);
|
bloque.insertAdjacentHTML("afterbegin", loading);
|
||||||
// add style vertical-align: middle
|
// add style vertical-align: middle
|
||||||
bloque.style.verticalAlign = "middle";
|
bloque.style.verticalAlign = "middle";
|
||||||
bloque.classList.add("text-center");
|
bloque.classList.add("text-center");
|
||||||
// remove draggable
|
// remove draggable
|
||||||
bloque.removeAttribute("draggable");
|
bloque.removeAttribute("draggable");
|
||||||
moveHorario(id, día, hora);
|
moveHorario(id, día, hora);
|
||||||
}
|
}
|
||||||
element.addEventListener("dragover", dragOver);
|
element.addEventListener("dragover", dragOver);
|
||||||
element.addEventListener("dragleave", dragLeave);
|
element.addEventListener("dragleave", dragLeave);
|
||||||
element.addEventListener("drop", drop);
|
element.addEventListener("drop", drop);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
const form = document.getElementById('form');
|
const form = document.getElementById('form');
|
||||||
if (!(form instanceof HTMLFormElement)) {
|
if (!(form instanceof HTMLFormElement)) {
|
||||||
triggerMessage('No se ha encontrado el formulario', 'Error', 'danger');
|
triggerMessage('No se ha encontrado el formulario', 'Error', 'danger');
|
||||||
throw new Error("No se ha encontrado el formulario");
|
throw new Error("No se ha encontrado el formulario");
|
||||||
}
|
}
|
||||||
form.querySelector('#clave_profesor').addEventListener('input', function (e) {
|
form.querySelector('#clave_profesor').addEventListener('input', function (e) {
|
||||||
const input = form.querySelector('#clave_profesor');
|
const input = form.querySelector('#clave_profesor');
|
||||||
const option = form.querySelector(`option[value="${input.value}"]`);
|
const option = form.querySelector(`option[value="${input.value}"]`);
|
||||||
if (input.value == "") {
|
if (input.value == "") {
|
||||||
input.classList.remove("is-invalid", "is-valid");
|
input.classList.remove("is-invalid", "is-valid");
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
if (!option) {
|
if (!option) {
|
||||||
input.classList.remove("is-valid");
|
input.classList.remove("is-valid");
|
||||||
input.classList.add("is-invalid");
|
input.classList.add("is-invalid");
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
const profesor_id = form.querySelector('#profesor_id');
|
const profesor_id = form.querySelector('#profesor_id');
|
||||||
profesor_id.value = option.dataset.id;
|
profesor_id.value = option.dataset.id;
|
||||||
input.classList.remove("is-invalid");
|
input.classList.remove("is-invalid");
|
||||||
input.classList.add("is-valid");
|
input.classList.add("is-valid");
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
form.addEventListener('submit', async function (e) {
|
form.addEventListener('submit', async function (e) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
const input = form.querySelector('#clave_profesor');
|
const input = form.querySelector('#clave_profesor');
|
||||||
if (input.classList.contains("is-invalid")) {
|
if (input.classList.contains("is-invalid")) {
|
||||||
triggerMessage('El profesor no se encuentra registrado', 'Error', 'danger');
|
triggerMessage('El profesor no se encuentra registrado', 'Error', 'danger');
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
const formData = new FormData(form);
|
const formData = new FormData(form);
|
||||||
try {
|
try {
|
||||||
const buttons = document.querySelectorAll("button");
|
const buttons = document.querySelectorAll("button");
|
||||||
buttons.forEach(button => {
|
buttons.forEach(button => {
|
||||||
button.disabled = true;
|
button.disabled = true;
|
||||||
button.classList.add("disabled");
|
button.classList.add("disabled");
|
||||||
});
|
});
|
||||||
const response = await fetch('action/action_horario_profesor.php', {
|
const response = await fetch('action/action_horario_profesor.php', {
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
body: formData,
|
body: formData,
|
||||||
});
|
});
|
||||||
const data = await response.json();
|
const data = await response.json();
|
||||||
buttons.forEach(button => {
|
buttons.forEach(button => {
|
||||||
button.disabled = false;
|
button.disabled = false;
|
||||||
button.classList.remove("disabled");
|
button.classList.remove("disabled");
|
||||||
});
|
});
|
||||||
if (data.status == 'success') {
|
if (data.status == 'success') {
|
||||||
horarios = data.data;
|
horarios = data.data;
|
||||||
renderHorario();
|
renderHorario();
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
triggerMessage(data.message, 'Error en la consulta', 'warning');
|
triggerMessage(data.message, 'Error en la consulta', 'warning');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
catch (error) {
|
catch (error) {
|
||||||
triggerMessage('Fallo al consutar los datos ', 'Error', 'danger');
|
triggerMessage('Fallo al consutar los datos ', 'Error', 'danger');
|
||||||
console.log(error);
|
console.log(error);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
const input = form.querySelector('#clave_profesor');
|
const input = form.querySelector('#clave_profesor');
|
||||||
const option = form.querySelector(`option[value="${input.value}"]`);
|
const option = form.querySelector(`option[value="${input.value}"]`);
|
||||||
|
|||||||
@@ -1,178 +1,178 @@
|
|||||||
// Get references to the HTML elements
|
// Get references to the HTML elements
|
||||||
const form = document.getElementById('form');
|
const form = document.getElementById('form');
|
||||||
const steps = Array.from(form.querySelectorAll('.step'));
|
const steps = Array.from(form.querySelectorAll('.step'));
|
||||||
const nextButton = document.getElementById('next-button');
|
const nextButton = document.getElementById('next-button');
|
||||||
const prevButton = document.getElementById('prev-button');
|
const prevButton = document.getElementById('prev-button');
|
||||||
let currentStep = 0;
|
let currentStep = 0;
|
||||||
// #clave_profesor on change => show step 2
|
// #clave_profesor on change => show step 2
|
||||||
const clave_profesor = document.getElementById('clave_profesor');
|
const clave_profesor = document.getElementById('clave_profesor');
|
||||||
const horario_reponer = document.getElementById('horario_reponer');
|
const horario_reponer = document.getElementById('horario_reponer');
|
||||||
const fechas_clase = document.getElementById('fechas_clase');
|
const fechas_clase = document.getElementById('fechas_clase');
|
||||||
const fecha_reponer = $('#fecha_reponer');
|
const fecha_reponer = $('#fecha_reponer');
|
||||||
const hora_reponer = $('#hora_reponer');
|
const hora_reponer = $('#hora_reponer');
|
||||||
const minutos_reponer = $('#minutos_reponer');
|
const minutos_reponer = $('#minutos_reponer');
|
||||||
clave_profesor.addEventListener('change', async () => {
|
clave_profesor.addEventListener('change', async () => {
|
||||||
const step2 = document.getElementById('step-2');
|
const step2 = document.getElementById('step-2');
|
||||||
clave_profesor.disabled = true;
|
clave_profesor.disabled = true;
|
||||||
// get option which value is the same as clave_profesor.value
|
// get option which value is the same as clave_profesor.value
|
||||||
const option = document.querySelector(`option[value="${clave_profesor.value}"]`);
|
const option = document.querySelector(`option[value="${clave_profesor.value}"]`);
|
||||||
// make a form data with #form
|
// make a form data with #form
|
||||||
const profesor_id = document.getElementById('profesor_id');
|
const profesor_id = document.getElementById('profesor_id');
|
||||||
profesor_id.value = option.dataset.id;
|
profesor_id.value = option.dataset.id;
|
||||||
const formData = new FormData(form);
|
const formData = new FormData(form);
|
||||||
const response = await fetch(`./action/action_horario_profesor.php`, {
|
const response = await fetch(`./action/action_horario_profesor.php`, {
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
body: formData
|
body: formData
|
||||||
});
|
});
|
||||||
const data = await response.json();
|
const data = await response.json();
|
||||||
if (data['success'] === false) {
|
if (data['success'] === false) {
|
||||||
const message = "Hubo un error al obtener los horarios del profesor.";
|
const message = "Hubo un error al obtener los horarios del profesor.";
|
||||||
const title = 'Error';
|
const title = 'Error';
|
||||||
const color = 'danger';
|
const color = 'danger';
|
||||||
triggerMessage(message, title, color);
|
triggerMessage(message, title, color);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
const horarios = data.data;
|
const horarios = data.data;
|
||||||
const initial = document.createElement('option');
|
const initial = document.createElement('option');
|
||||||
initial.value = '';
|
initial.value = '';
|
||||||
initial.textContent = 'Seleccione un horario';
|
initial.textContent = 'Seleccione un horario';
|
||||||
initial.selected = true;
|
initial.selected = true;
|
||||||
initial.disabled = true;
|
initial.disabled = true;
|
||||||
horario_reponer.innerHTML = '';
|
horario_reponer.innerHTML = '';
|
||||||
horario_reponer.appendChild(initial);
|
horario_reponer.appendChild(initial);
|
||||||
horarios.forEach((horario) => {
|
horarios.forEach((horario) => {
|
||||||
const dias = ['Lunes', 'Martes', 'Miercoles', 'Jueves', 'Viernes', 'Sabado', 'Domingo'];
|
const dias = ['Lunes', 'Martes', 'Miercoles', 'Jueves', 'Viernes', 'Sabado', 'Domingo'];
|
||||||
const option = document.createElement('option');
|
const option = document.createElement('option');
|
||||||
option.value = `${horario.id}`;
|
option.value = `${horario.id}`;
|
||||||
// materia máx 25 caracteres, if materia.length > 25 then slice(0, 20)
|
// materia máx 25 caracteres, if materia.length > 25 then slice(0, 20)
|
||||||
const max = 25;
|
const max = 25;
|
||||||
option.textContent = `${horario.materia.slice(0, max) + (horario.materia.length > max ? '...' : '')} - Grupo: ${horario.grupo} - ${horario.hora.slice(0, 5)}-${horario.hora_final.slice(0, 5)} - Salon: ${horario.salon} - ${horario.dia}`;
|
option.textContent = `${horario.materia.slice(0, max) + (horario.materia.length > max ? '...' : '')} - Grupo: ${horario.grupo} - ${horario.hora.slice(0, 5)}-${horario.hora_final.slice(0, 5)} - Salon: ${horario.salon} - ${horario.dia}`;
|
||||||
option.dataset.materia = `${horario.materia}`;
|
option.dataset.materia = `${horario.materia}`;
|
||||||
option.dataset.grupo = `${horario.grupo}`;
|
option.dataset.grupo = `${horario.grupo}`;
|
||||||
option.dataset.hora = `${horario.hora.slice(0, 5)}`; // slice(0, 5) => HH:MM
|
option.dataset.hora = `${horario.hora.slice(0, 5)}`; // slice(0, 5) => HH:MM
|
||||||
option.dataset.hora_final = `${horario.hora_final.slice(0, 5)}`;
|
option.dataset.hora_final = `${horario.hora_final.slice(0, 5)}`;
|
||||||
option.dataset.salon = `${horario.salon}`;
|
option.dataset.salon = `${horario.salon}`;
|
||||||
option.dataset.dia = `${horario.dia}`;
|
option.dataset.dia = `${horario.dia}`;
|
||||||
option.dataset.id = `${horario.id}`;
|
option.dataset.id = `${horario.id}`;
|
||||||
horario_reponer.appendChild(option);
|
horario_reponer.appendChild(option);
|
||||||
});
|
});
|
||||||
currentStep = 1;
|
currentStep = 1;
|
||||||
step2.style.display = 'block';
|
step2.style.display = 'block';
|
||||||
prevButton.disabled = false;
|
prevButton.disabled = false;
|
||||||
});
|
});
|
||||||
// disable clave_profesor
|
// disable clave_profesor
|
||||||
// from second step to first step
|
// from second step to first step
|
||||||
prevButton.addEventListener('click', () => {
|
prevButton.addEventListener('click', () => {
|
||||||
const inputs = [clave_profesor, horario_reponer, fechas_clase, fecha_reponer, hora_reponer];
|
const inputs = [clave_profesor, horario_reponer, fechas_clase, fecha_reponer, hora_reponer];
|
||||||
switch (currentStep) {
|
switch (currentStep) {
|
||||||
case 1:
|
case 1:
|
||||||
case 2:
|
case 2:
|
||||||
case 3:
|
case 3:
|
||||||
const step = document.getElementById(`step-${currentStep + 1}`);
|
const step = document.getElementById(`step-${currentStep + 1}`);
|
||||||
step.style.display = 'none';
|
step.style.display = 'none';
|
||||||
inputs[currentStep - 1].disabled = false;
|
inputs[currentStep - 1].disabled = false;
|
||||||
inputs[currentStep - 1].value = '';
|
inputs[currentStep - 1].value = '';
|
||||||
if (--currentStep === 0) {
|
if (--currentStep === 0) {
|
||||||
prevButton.disabled = true;
|
prevButton.disabled = true;
|
||||||
}
|
}
|
||||||
break;
|
break;
|
||||||
case 4:
|
case 4:
|
||||||
const step5 = document.getElementById('step-5');
|
const step5 = document.getElementById('step-5');
|
||||||
step5.style.display = 'none';
|
step5.style.display = 'none';
|
||||||
fecha_reponer.prop('disabled', false);
|
fecha_reponer.prop('disabled', false);
|
||||||
fecha_reponer.val('');
|
fecha_reponer.val('');
|
||||||
hora_reponer.parent().removeClass('disabled');
|
hora_reponer.parent().removeClass('disabled');
|
||||||
hora_reponer.siblings('.datalist-input').text('hh');
|
hora_reponer.siblings('.datalist-input').text('hh');
|
||||||
hora_reponer.val('');
|
hora_reponer.val('');
|
||||||
minutos_reponer.parent().removeClass('disabled');
|
minutos_reponer.parent().removeClass('disabled');
|
||||||
minutos_reponer.siblings('.datalist-input').text('mm');
|
minutos_reponer.siblings('.datalist-input').text('mm');
|
||||||
minutos_reponer.val('');
|
minutos_reponer.val('');
|
||||||
currentStep--;
|
currentStep--;
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
nextButton.disabled = true;
|
nextButton.disabled = true;
|
||||||
});
|
});
|
||||||
// #horario_reponer on change => show step 3
|
// #horario_reponer on change => show step 3
|
||||||
horario_reponer.addEventListener('change', async () => {
|
horario_reponer.addEventListener('change', async () => {
|
||||||
const selected = horario_reponer.querySelector(`option[value="${horario_reponer.value}"]`);
|
const selected = horario_reponer.querySelector(`option[value="${horario_reponer.value}"]`);
|
||||||
horario_reponer.title = `Materia: ${selected.dataset.materia} - Grupo: ${selected.dataset.grupo} - Horario: ${selected.dataset.hora}-${selected.dataset.hora_final} - Salon: ${selected.dataset.salon} - Día: ${selected.dataset.dia}`;
|
horario_reponer.title = `Materia: ${selected.dataset.materia} - Grupo: ${selected.dataset.grupo} - Horario: ${selected.dataset.hora}-${selected.dataset.hora_final} - Salon: ${selected.dataset.salon} - Día: ${selected.dataset.dia}`;
|
||||||
const step3 = document.getElementById('step-3');
|
const step3 = document.getElementById('step-3');
|
||||||
horario_reponer.disabled = true;
|
horario_reponer.disabled = true;
|
||||||
// make a form data with #form
|
// make a form data with #form
|
||||||
const response = await fetch(`./action/action_fechas_clase.php?horario_id=${horario_reponer.value}`, {
|
const response = await fetch(`./action/action_fechas_clase.php?horario_id=${horario_reponer.value}`, {
|
||||||
method: 'GET',
|
method: 'GET',
|
||||||
});
|
});
|
||||||
const data = await response.json();
|
const data = await response.json();
|
||||||
if (data['success'] === false) {
|
if (data['success'] === false) {
|
||||||
const message = "Hubo un error al obtener las fechas de clase.";
|
const message = "Hubo un error al obtener las fechas de clase.";
|
||||||
const title = 'Error';
|
const title = 'Error';
|
||||||
const color = 'danger';
|
const color = 'danger';
|
||||||
triggerMessage(message, title, color);
|
triggerMessage(message, title, color);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
const meses = ['Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio', 'Julio', 'Agosto', 'Septiembre', 'Octubre', 'Noviembre', 'Diciembre'];
|
const meses = ['Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio', 'Julio', 'Agosto', 'Septiembre', 'Octubre', 'Noviembre', 'Diciembre'];
|
||||||
const fechas = data.data;
|
const fechas = data.data;
|
||||||
const initial = document.createElement('option');
|
const initial = document.createElement('option');
|
||||||
initial.value = '';
|
initial.value = '';
|
||||||
initial.textContent = 'Seleccione la fecha de la falta';
|
initial.textContent = 'Seleccione la fecha de la falta';
|
||||||
initial.selected = true;
|
initial.selected = true;
|
||||||
initial.disabled = true;
|
initial.disabled = true;
|
||||||
fechas_clase.innerHTML = '';
|
fechas_clase.innerHTML = '';
|
||||||
fechas_clase.appendChild(initial);
|
fechas_clase.appendChild(initial);
|
||||||
fechas_clase.title = 'Seleccione la fecha de la falta';
|
fechas_clase.title = 'Seleccione la fecha de la falta';
|
||||||
fechas.forEach((fecha) => {
|
fechas.forEach((fecha) => {
|
||||||
const option = document.createElement('option');
|
const option = document.createElement('option');
|
||||||
option.value = `${fecha}`;
|
option.value = `${fecha}`;
|
||||||
option.textContent = `${fecha.dia_mes} de ${meses[fecha.month - 1]} de ${fecha.year}`;
|
option.textContent = `${fecha.dia_mes} de ${meses[fecha.month - 1]} de ${fecha.year}`;
|
||||||
fechas_clase.appendChild(option);
|
fechas_clase.appendChild(option);
|
||||||
});
|
});
|
||||||
step3.style.display = 'block';
|
step3.style.display = 'block';
|
||||||
currentStep = 2;
|
currentStep = 2;
|
||||||
});
|
});
|
||||||
// #fechas_clase on change => show step 4
|
// #fechas_clase on change => show step 4
|
||||||
fechas_clase.addEventListener('change', () => {
|
fechas_clase.addEventListener('change', () => {
|
||||||
const step4 = document.getElementById('step-4');
|
const step4 = document.getElementById('step-4');
|
||||||
step4.style.display = 'block';
|
step4.style.display = 'block';
|
||||||
fechas_clase.disabled = true;
|
fechas_clase.disabled = true;
|
||||||
currentStep = 3;
|
currentStep = 3;
|
||||||
});
|
});
|
||||||
// when both #fecha_reponer and #hora_reponer are selected => show step 5
|
// when both #fecha_reponer and #hora_reponer are selected => show step 5
|
||||||
const lastStep = () => {
|
const lastStep = () => {
|
||||||
// timeout to wait for the value to be set
|
// timeout to wait for the value to be set
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
if (fecha_reponer.val() !== '' && hora_reponer.val() !== '' && minutos_reponer.val() !== '') {
|
if (fecha_reponer.val() !== '' && hora_reponer.val() !== '' && minutos_reponer.val() !== '') {
|
||||||
const step5 = document.getElementById('step-5');
|
const step5 = document.getElementById('step-5');
|
||||||
step5.style.display = 'block';
|
step5.style.display = 'block';
|
||||||
// disable both
|
// disable both
|
||||||
fecha_reponer.prop('disabled', true);
|
fecha_reponer.prop('disabled', true);
|
||||||
hora_reponer.parent().addClass('disabled');
|
hora_reponer.parent().addClass('disabled');
|
||||||
minutos_reponer.parent().addClass('disabled');
|
minutos_reponer.parent().addClass('disabled');
|
||||||
const nextButton = document.getElementById('next-button');
|
const nextButton = document.getElementById('next-button');
|
||||||
// remove property disabled
|
// remove property disabled
|
||||||
nextButton.removeAttribute('disabled');
|
nextButton.removeAttribute('disabled');
|
||||||
currentStep = 4;
|
currentStep = 4;
|
||||||
}
|
}
|
||||||
}, 100);
|
}, 100);
|
||||||
};
|
};
|
||||||
fecha_reponer.on('change', lastStep);
|
fecha_reponer.on('change', lastStep);
|
||||||
// on click on the sibling ul>li of #hora_reponer and #minutos_reponer
|
// on click on the sibling ul>li of #hora_reponer and #minutos_reponer
|
||||||
hora_reponer.siblings('ul').children('li').on('click', lastStep);
|
hora_reponer.siblings('ul').children('li').on('click', lastStep);
|
||||||
minutos_reponer.siblings('ul').children('li').on('click', lastStep);
|
minutos_reponer.siblings('ul').children('li').on('click', lastStep);
|
||||||
// Initialize the form
|
// Initialize the form
|
||||||
hideSteps();
|
hideSteps();
|
||||||
showCurrentStep();
|
showCurrentStep();
|
||||||
function hideSteps() {
|
function hideSteps() {
|
||||||
steps.forEach((step) => {
|
steps.forEach((step) => {
|
||||||
step.style.display = 'none';
|
step.style.display = 'none';
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
function showCurrentStep() {
|
function showCurrentStep() {
|
||||||
steps[currentStep].style.display = 'block';
|
steps[currentStep].style.display = 'block';
|
||||||
prevButton.disabled = currentStep === 0;
|
prevButton.disabled = currentStep === 0;
|
||||||
}
|
}
|
||||||
function handleSubmit(event) {
|
function handleSubmit(event) {
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
// Handle form submission
|
// Handle form submission
|
||||||
// You can access the form data using the FormData API or serialize it manually
|
// You can access the form data using the FormData API or serialize it manually
|
||||||
}
|
}
|
||||||
export {};
|
export {};
|
||||||
|
|||||||
3
log/asistencias_2023_08.log
Normal file
3
log/asistencias_2023_08.log
Normal file
@@ -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
|
||||||
@@ -1,11 +1,13 @@
|
|||||||
<?
|
<?
|
||||||
|
ini_set('display_errors', 1);
|
||||||
|
ini_set('display_startup_errors', 1);
|
||||||
|
error_reporting(E_ALL);
|
||||||
$ruta = "../../";
|
$ruta = "../../";
|
||||||
require_once "$ruta/include/bd_pdo.php";
|
require_once "$ruta/include/bd_pdo.php";
|
||||||
header('Content-Type: application/json');
|
header('Content-Type: application/json');
|
||||||
|
|
||||||
// json data from service\periodos.v1.php (input)
|
// json data from service\periodos.v1.php (input)
|
||||||
$data = json_decode(file_get_contents('php://input'), true);
|
$data = json_decode(file_get_contents('php://input'), true);
|
||||||
|
|
||||||
// check if the input is empty
|
// check if the input is empty
|
||||||
|
|
||||||
if (is_response_empty($data)) {
|
if (is_response_empty($data)) {
|
||||||
@@ -36,14 +38,14 @@ $fin = strtotime($data['fin']);
|
|||||||
try {
|
try {
|
||||||
|
|
||||||
$result = $db->insert('periodo', [
|
$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),
|
'periodo_nombre' => "{$data['NombreNivel']}: {$formatter->format($inicio)} - {$formatter->format($fin)} " . date('Y', $inicio),
|
||||||
'nivel_id' => $data['IdNivel'],
|
'nivel_id' => $data['IdNivel'],
|
||||||
'periodo_fecha_inicio' => $data['inicio'],
|
'periodo_fecha_inicio' => $data['inicio'],
|
||||||
'periodo_fecha_fin' => $data['fin'],
|
'periodo_fecha_fin' => $data['fin'],
|
||||||
'estado_id' => 4,
|
'estado_id' => 4,
|
||||||
'periodo_clave' => $data['NombrePeriodo']
|
'periodo_clave' => $data['NombrePeriodo']
|
||||||
], ['id_reference']);
|
], ['id_periodo_sgu']);
|
||||||
} catch (PDOException $th) {
|
} catch (PDOException $th) {
|
||||||
echo json_encode([
|
echo json_encode([
|
||||||
'success' => false,
|
'success' => false,
|
||||||
|
|||||||
@@ -1,4 +1,8 @@
|
|||||||
<?
|
<?
|
||||||
|
ini_set('display_errors', 1);
|
||||||
|
ini_set('display_startup_errors', 1);
|
||||||
|
error_reporting(E_ALL);
|
||||||
|
|
||||||
$ruta = "../";
|
$ruta = "../";
|
||||||
require_once '../include/bd_pdo.php';
|
require_once '../include/bd_pdo.php';
|
||||||
$curl = curl_init();
|
$curl = curl_init();
|
||||||
@@ -8,7 +12,7 @@ curl_setopt_array($curl, [
|
|||||||
CURLOPT_RETURNTRANSFER => true,
|
CURLOPT_RETURNTRANSFER => true,
|
||||||
CURLOPT_POSTFIELDS => "",
|
CURLOPT_POSTFIELDS => "",
|
||||||
CURLOPT_HTTPHEADER => [
|
CURLOPT_HTTPHEADER => [
|
||||||
"token: f65f921264e4ab135472adb5a946212dd4b995d929294afec31eef192b8de8d6a076648906f70012c9803e5918d0fc99499d7d1fb7c998cc06c7a10eef61f66a",
|
"token: 5b892845736a29b5846073be0a11f0fc87113648aae1e8279830c4bc05f585eba13e0b1b4f0c42a12d694bb8091d23f7564b15f3141768dfa6ed2aa709864986",
|
||||||
"username: SGU_APSA_AUD_ASIST"
|
"username: SGU_APSA_AUD_ASIST"
|
||||||
],
|
],
|
||||||
]);
|
]);
|
||||||
@@ -24,7 +28,7 @@ if ($err)
|
|||||||
$data = json_decode($response, true);
|
$data = json_decode($response, true);
|
||||||
|
|
||||||
$in_db = array_map(function ($item) use ($db) {
|
$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;
|
return $item;
|
||||||
}, $data);
|
}, $data);
|
||||||
|
|
||||||
|
|||||||
@@ -1,4 +1,8 @@
|
|||||||
<?
|
<?
|
||||||
|
ini_set('display_errors', 1);
|
||||||
|
ini_set('display_startup_errors', 1);
|
||||||
|
error_reporting(E_ALL);
|
||||||
|
|
||||||
$ruta = "../";
|
$ruta = "../";
|
||||||
require_once '../include/bd_pdo.php';
|
require_once '../include/bd_pdo.php';
|
||||||
global $db;
|
global $db;
|
||||||
@@ -10,7 +14,7 @@ curl_setopt_array($curl, [
|
|||||||
CURLOPT_RETURNTRANSFER => true,
|
CURLOPT_RETURNTRANSFER => true,
|
||||||
CURLOPT_POSTFIELDS => "",
|
CURLOPT_POSTFIELDS => "",
|
||||||
CURLOPT_HTTPHEADER => [
|
CURLOPT_HTTPHEADER => [
|
||||||
"token: f65f921264e4ab135472adb5a946212dd4b995d929294afec31eef192b8de8d6a076648906f70012c9803e5918d0fc99499d7d1fb7c998cc06c7a10eef61f66a",
|
"token: 5b892845736a29b5846073be0a11f0fc87113648aae1e8279830c4bc05f585eba13e0b1b4f0c42a12d694bb8091d23f7564b15f3141768dfa6ed2aa709864986",
|
||||||
"username: SGU_APSA_AUD_ASIST"
|
"username: SGU_APSA_AUD_ASIST"
|
||||||
],
|
],
|
||||||
]);
|
]);
|
||||||
@@ -28,7 +32,7 @@ $json = json_decode($response, true);
|
|||||||
|
|
||||||
$selectedData = array_map(function ($item) use ($db) {
|
$selectedData = array_map(function ($item) use ($db) {
|
||||||
$item['in_db'] = $db->where('carrera_nombre', $item['NombreCarrera'], 'ILIKE')->has('carrera');
|
$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;
|
return $item;
|
||||||
}, $json);
|
}, $json);
|
||||||
|
|
||||||
|
|||||||
@@ -115,7 +115,7 @@
|
|||||||
</button>
|
</button>
|
||||||
|
|
||||||
<h3 class="text-white font-weight-bold text-uppercase text-center">
|
<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>
|
</h3>
|
||||||
|
|
||||||
<button class="btn btn-info"
|
<button class="btn btn-info"
|
||||||
@@ -165,7 +165,7 @@
|
|||||||
<tr v-if="clases.length == 0">
|
<tr v-if="clases.length == 0">
|
||||||
<td colspan="6" class="text-center">No hay clases en este horario</td>
|
<td colspan="6" class="text-center">No hay clases en este horario</td>
|
||||||
</tr>
|
</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">{{ clase.salon }}</td>
|
||||||
<td class="text-center align-middle">
|
<td class="text-center align-middle">
|
||||||
<div class="col-12">
|
<div class="col-12">
|
||||||
@@ -173,8 +173,8 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="col-12">
|
<div class="col-12">
|
||||||
<button type="button" class="btn btn-outline-dark btn-sm"
|
<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>
|
Ver detalle <i class="ing-ojo"></i>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
@@ -182,12 +182,12 @@
|
|||||||
|
|
||||||
</td>
|
</td>
|
||||||
<td class="text-center align-middle">
|
<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>
|
||||||
<td class="text-center align-middle text-nowrap">
|
<td class="text-center align-middle text-nowrap">
|
||||||
<!-- data-toggle="button" -->
|
<!-- data-toggle="button" -->
|
||||||
<button class="btn text-center mx-2" v-for="estado in estados" :key="estado.id"
|
<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}`]"
|
:class="[{'active': estado.id === clase.estado_supervisor_id}, `btn-outline-${estado.color}`]"
|
||||||
:aria-pressed="estado.id === clase.estado_supervisor_id">
|
:aria-pressed="estado.id === clase.estado_supervisor_id">
|
||||||
<i :class="estado.icon"></i>
|
<i :class="estado.icon"></i>
|
||||||
@@ -226,7 +226,7 @@
|
|||||||
v-for="horario in store.bloquesHorario.data" :key="horario.id"
|
v-for="horario in store.bloquesHorario.data" :key="horario.id"
|
||||||
@click="store.bloquesHorario.selected = store.bloquesHorario.data.indexOf(horario)">
|
@click="store.bloquesHorario.selected = store.bloquesHorario.data.indexOf(horario)">
|
||||||
<div class="d-flex w-100 justify-content-between">
|
<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>
|
}}</h5>
|
||||||
</div>
|
</div>
|
||||||
</a>
|
</a>
|
||||||
@@ -415,7 +415,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="col-6 text-center" v-else>
|
<div class="col-6 text-center" v-else>
|
||||||
El profesor registró su asistencia a las
|
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>
|
<hr>
|
||||||
<p v-if="!clase_vista.registro_retardo" class="text-center">
|
<p v-if="!clase_vista.registro_retardo" class="text-center">
|
||||||
<span class="badge badge-success"><i class="ing-aceptar"></i></span>
|
<span class="badge badge-success"><i class="ing-aceptar"></i></span>
|
||||||
@@ -440,7 +440,17 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</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">×</span>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<!-- cuerpo del modal -->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
<?php
|
<?php
|
||||||
@@ -481,7 +491,6 @@
|
|||||||
data: [],
|
data: [],
|
||||||
push_message(message, silent = false) {
|
push_message(message, silent = false) {
|
||||||
if (silent) {
|
if (silent) {
|
||||||
console.log(message);
|
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
// go to the top
|
// 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 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 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));
|
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];
|
this.rutas.data = [...notLasts, ...finals, ...lasts];
|
||||||
},
|
},
|
||||||
// clases
|
// clases
|
||||||
@@ -533,9 +541,9 @@
|
|||||||
},
|
},
|
||||||
|
|
||||||
// estado
|
// 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 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;
|
clase.estado_supervisor_id = estadoId;
|
||||||
|
|
||||||
try {
|
try {
|
||||||
@@ -588,12 +596,15 @@
|
|||||||
const ruta = store.rutas.data.find(ruta => ruta.salon_id == this.rutas.selected);
|
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);
|
const clase = ruta.horarios.find(clase => clase.horario_id == this.editor.id);
|
||||||
clase.comentario = this.editor.texto;
|
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() {
|
limpiarComentario() {
|
||||||
this.editor.texto = "";
|
this.editor.texto = "";
|
||||||
},
|
},
|
||||||
profesor_selected: null,
|
profesor_selected: {
|
||||||
|
horario_id: null,
|
||||||
|
profesor_id: null,
|
||||||
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
$(document).ready(function () {
|
$(document).ready(function () {
|
||||||
@@ -632,7 +643,6 @@
|
|||||||
},
|
},
|
||||||
get clases() {
|
get clases() {
|
||||||
const clases = store.rutas.data.find(ruta => ruta.salon_id == store.rutas.selected)?.horarios ?? [];
|
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;
|
return clases;
|
||||||
},
|
},
|
||||||
async guardarCambios() {
|
async guardarCambios() {
|
||||||
@@ -641,7 +651,6 @@
|
|||||||
if (!navigator.onLine)
|
if (!navigator.onLine)
|
||||||
throw "No hay conexión a internet";
|
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", {
|
const cambio = await fetch("action/registro_supervisor.php", {
|
||||||
method: "POST",
|
method: "POST",
|
||||||
headers: {
|
headers: {
|
||||||
@@ -681,7 +690,6 @@
|
|||||||
async mounted() {
|
async mounted() {
|
||||||
store.bloquesHorario.data = await fetch('action/action_grupo_horario.php').then(res => res.json());
|
store.bloquesHorario.data = await fetch('action/action_grupo_horario.php').then(res => res.json());
|
||||||
store.bloquesHorario.selected = store.bloquesHorario.data.findIndex(bloque => bloque.selected);
|
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.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.catálogo_rutas.data = await fetch('action/rutas.php').then(res => res.json());
|
||||||
this.loading = false;
|
this.loading = false;
|
||||||
@@ -725,7 +733,7 @@
|
|||||||
|
|
||||||
},
|
},
|
||||||
get clase_vista() {
|
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')
|
}).mount('#app')
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
103
ts/auditoría.ts
103
ts/auditoría.ts
@@ -70,6 +70,10 @@ const store = reactive({
|
|||||||
comentario: '',
|
comentario: '',
|
||||||
clase_vista: null,
|
clase_vista: null,
|
||||||
empty: '',
|
empty: '',
|
||||||
|
page: 1,
|
||||||
|
maxPages: 10,
|
||||||
|
perPage: 10,
|
||||||
|
modal_state: "Cargando datos...",
|
||||||
},
|
},
|
||||||
facultades: {
|
facultades: {
|
||||||
data: [] as Facultad[],
|
data: [] as Facultad[],
|
||||||
@@ -85,6 +89,7 @@ const store = reactive({
|
|||||||
fecha_inicio: null,
|
fecha_inicio: null,
|
||||||
fecha_fin: null,
|
fecha_fin: null,
|
||||||
profesor: null,
|
profesor: null,
|
||||||
|
periodo_id: null,
|
||||||
bloque_horario: null,
|
bloque_horario: null,
|
||||||
estados: [],
|
estados: [],
|
||||||
|
|
||||||
@@ -94,7 +99,7 @@ const store = reactive({
|
|||||||
store.filters.fecha_inicio = store.filters.fecha_fin = store.filters.fecha = null
|
store.filters.fecha_inicio = store.filters.fecha_fin = store.filters.fecha = null
|
||||||
|
|
||||||
$("#fecha, #fecha_inicio, #fecha_fin").datepicker({
|
$("#fecha, #fecha_inicio, #fecha_fin").datepicker({
|
||||||
minDate: -3,
|
minDate: -15,
|
||||||
maxDate: new Date(),
|
maxDate: new Date(),
|
||||||
dateFormat: "yy-mm-dd",
|
dateFormat: "yy-mm-dd",
|
||||||
showAnim: "slide",
|
showAnim: "slide",
|
||||||
@@ -150,7 +155,12 @@ const store = reactive({
|
|||||||
toggle(arr: any, element: any) {
|
toggle(arr: any, element: any) {
|
||||||
const newArray = arr.includes(element) ? arr.filter((item: any) => item !== element) : [...arr, element]
|
const newArray = arr.includes(element) ? arr.filter((item: any) => item !== element) : [...arr, element]
|
||||||
// if all are selected, then unselect all
|
// 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
|
return newArray
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
@@ -166,7 +176,11 @@ type Profesor = {
|
|||||||
profesor_clave: string;
|
profesor_clave: string;
|
||||||
profesor_grado: string;
|
profesor_grado: string;
|
||||||
}
|
}
|
||||||
|
$('div.modal#cargando').modal({
|
||||||
|
backdrop: 'static',
|
||||||
|
keyboard: false,
|
||||||
|
show: false,
|
||||||
|
})
|
||||||
createApp({
|
createApp({
|
||||||
store,
|
store,
|
||||||
get clase_vista() {
|
get clase_vista() {
|
||||||
@@ -175,9 +189,17 @@ createApp({
|
|||||||
registros: {
|
registros: {
|
||||||
data: [] as Registro[],
|
data: [] as Registro[],
|
||||||
async fetch() {
|
async fetch() {
|
||||||
|
// if (!store.filters.facultad_id || !store.filters.periodo_id) return
|
||||||
this.loading = true
|
this.loading = true
|
||||||
this.data = [] as Registro[]
|
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.data = await res.json()
|
||||||
this.loading = false
|
this.loading = false
|
||||||
},
|
},
|
||||||
@@ -203,9 +225,15 @@ createApp({
|
|||||||
|
|
||||||
*/
|
*/
|
||||||
const filters = Object.keys(store.filters).filter((filtro) => store.filters[filtro] || store.filters[filtro]?.length > 0)
|
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 this.data.filter((registro: Registro) => {
|
||||||
return filters.every((filtro) => {
|
return filters.every((filtro) => {
|
||||||
|
|
||||||
switch (filtro) {
|
switch (filtro) {
|
||||||
case 'fecha':
|
case 'fecha':
|
||||||
return registro.registro_fecha_ideal === store.filters[filtro];
|
return registro.registro_fecha_ideal === store.filters[filtro];
|
||||||
@@ -218,7 +246,7 @@ createApp({
|
|||||||
if (/^\([^)]+\)\s[\s\S]+$/.test(textoFiltro)) {
|
if (/^\([^)]+\)\s[\s\S]+$/.test(textoFiltro)) {
|
||||||
const clave = registro.profesor_clave.toLowerCase();
|
const clave = registro.profesor_clave.toLowerCase();
|
||||||
const filtroClave = textoFiltro.match(/\((.*?)\)/)?.[1];
|
const filtroClave = textoFiltro.match(/\((.*?)\)/)?.[1];
|
||||||
console.log(clave, filtroClave);
|
// console.log(clave, filtroClave);
|
||||||
return clave.includes(filtroClave);
|
return clave.includes(filtroClave);
|
||||||
} else {
|
} else {
|
||||||
const nombre = registro.profesor_nombre.toLowerCase();
|
const nombre = registro.profesor_nombre.toLowerCase();
|
||||||
@@ -238,40 +266,67 @@ createApp({
|
|||||||
})
|
})
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
|
||||||
async descargar() {
|
async descargar() {
|
||||||
|
store.current.modal_state = 'Generando reporte en Excel...'
|
||||||
|
$('div.modal#cargando').modal('show');
|
||||||
|
this.loading = true;
|
||||||
if (this.relevant.length === 0) return;
|
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() {
|
get profesores() {
|
||||||
return this.registros.data.map((registro: Registro) => (
|
return this.registros.data
|
||||||
{
|
.map((registro: Registro) => ({
|
||||||
profesor_id: registro.profesor_id,
|
profesor_id: registro.profesor_id,
|
||||||
profesor_nombre: registro.profesor_nombre,
|
profesor_nombre: registro.profesor_nombre,
|
||||||
profesor_correo: registro.profesor_correo,
|
profesor_correo: registro.profesor_correo,
|
||||||
profesor_clave: registro.profesor_clave,
|
profesor_clave: registro.profesor_clave,
|
||||||
profesor_grado: registro.profesor_grado,
|
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() {
|
async mounted() {
|
||||||
|
$('div.modal#cargando').modal('show');
|
||||||
|
|
||||||
await this.registros.fetch()
|
await this.registros.fetch()
|
||||||
await store.facultades.fetch()
|
await store.facultades.fetch()
|
||||||
await store.estados.fetch()
|
await store.estados.fetch()
|
||||||
await store.bloques_horario.fetch()
|
await store.bloques_horario.fetch()
|
||||||
|
|
||||||
store.filters.bloque_horario = store.bloques_horario.data.find((bloque: Bloque_Horario) => bloque.selected)?.id
|
|
||||||
store.filters.switchFechas()
|
store.filters.switchFechas()
|
||||||
|
$('div.modal#cargando').modal('hide');
|
||||||
}
|
}
|
||||||
}).mount('#app')
|
}).mount('#app')
|
||||||
|
|||||||
Reference in New Issue
Block a user