PAAD/paad
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Primera iteración de nuevo diseño

Browse Source
This commit is contained in:
Your Name
2025-01-22 16:56:45 -06:00
parent 44e8e3277f
commit 1b1a145478
6 changed files with 231 additions and 173 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
action/action_auditoria_detalle.php
View File

@@ -21,11 +21,12 @@ try {
if ($_SERVER['REQUEST_METHOD'] === 'GET') { if ($_SERVER['REQUEST_METHOD'] === 'GET') {
$data = $db $data = $db
->where('registro_fecha_ideal', $_GET['registro_fecha_ideal'])
->where('horario_id', $_GET['horario_id']) ->where('horario_id', $_GET['horario_id'])
->where('profesor_id', $_GET['profesor_id']) ->where('profesor_id', $_GET['profesor_id'])
->getOne('auditoria_mat'); ->getOne('auditoria_mat');
// Print the JSON file // Print the JSON file
echo json_encode($data); echo json_encode(array_merge($data, ['query' => $db->getLastQuery(), 'get' => $_GET]));
} else { } else {
http_response_code(405); http_response_code(405);
echo json_encode(['error' => 'method not allowed']); echo json_encode(['error' => 'method not allowed']);

221
auditoria.php
View File

@@ -13,6 +13,7 @@
display: none; display: none;
} }
</style> </style>
<link rel="stylesheet" href="css/auditoria-ux.css">
<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>
<script src="js/bootstrap/bootstrap.min.js"></script> <script src="js/bootstrap/bootstrap.min.js"></script>
@@ -266,19 +267,20 @@
<strong>{{ registro.profesor_clave }}</strong> <strong>{{ registro.profesor_clave }}</strong>
{{ registro.profesor_nombre }} {{ registro.profesor_nombre }}
<button type="button" class="ml-3 btn btn-sm btn-outline-primary" <button type="button" class="ml-3 btn btn-sm btn-outline-primary"
@click="store.current.clase_vista = registro; detalle.obtener_detalle(registro.horario_id, registro.profesor_id)" data-toggle="modal" @click="store.current.clase_vista = registro; detalle.obtener_detalle(registro.horario_id, registro.profesor_id, registro.registro_fecha_ideal)"
data-target="#ver-detalle"> data-toggle="modal" data-target="#ver-detalle">
<i class="ing-ojo"></i> detalle <i class="ing-ojo"></i> detalle
</button> </button>
</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_fin?.slice(0,5) }}</td> {{ `${registro.horario_hora?.slice(0,5)} - ${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" :class="registro.color"> <div class="col-12" :class="registro.color">
Registro <small>{{ registro.registro_fecha?.slice(11,19) }}</small> Registro <small>{{ `${registro.registro_fecha?.slice(11,19)}` }}</small>
</div> </div>
</div> </div>
<div v-else> <div v-else>
@@ -298,21 +300,22 @@
<span class="mr-2" :class="`text-${registro.estado_color}`"> <span class="mr-2" :class="`text-${registro.estado_color}`">
<i :class="`${registro.estado_icon} ing-2x`"></i> <i :class="`${registro.estado_icon} ing-2x`"></i>
</span> </span>
<strong v-if="registro.usuario_nombre">{{ registro.usuario_nombre <strong v-if="registro.usuario_nombre">
}}</strong> {{ registro.usuario_nombre }}
</strong>
</div> </div>
<div class="col-12" v-if="registro.registro_fecha_supervisor"> <div class="col-12" v-if="registro.registro_fecha_supervisor">
Hora Hora
<small>{{ registro.registro_fecha_supervisor?.slice(11,19) }}</small> <small>{{ `${registro.registro_fecha_supervisor?.slice(11,19)}` }}</small>
</div> </div>
</div> </div>
<div class="col-12 " <div class="col-12 "
@click="store.registros.mostrarComentario(registro.registro_id)" @click="store.registros.mostrarComentario(registro.registro_id)"
v-if="registro.comentario" style="cursor: pointer;"> v-if="registro.comentario" style="cursor: pointer;">
<strong class="badge border border-primary">Observaciones:</strong> <strong class="badge border border-primary">Observaciones:</strong>
<small <small class="text-truncate">{{`${registro.comentario?.slice(0,25)}
class="text-truncate">{{registro.comentario?.slice(0,25)}}{{registro.comentario.length ${registro.comentario.length
> 10 ? '...' : ''}}</small> > 10 ? '...' : ''}`}}</small>
</div> </div>
</div> </div>
</td> </td>
@@ -388,165 +391,75 @@
<div class="modal" tabindex="-1" id="ver-detalle"> <div class="modal" tabindex="-1" id="ver-detalle">
<div class="modal-dialog modal-dialog-centered modal-xl" v-if="clase_vista"> <div class="modal-dialog modal-dialog-centered modal-xl" v-if="clase_vista">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-body detalle">
<h2 class="modal-title" :data-id="clase_vista.horario_id">Detalle de la clase</h2> <section class="profesor">
<img class="profesor-icon" src="fonts/svg/portrait.svg" alt="profesor">
</div> <div>
<div class="modal-body"> <span class="profesor-nombre">
<div class="container">
<div class="row">
<section class="col-12 col-md-6">
<h4 class="h4">Profesor</h4>
<div class="row">
<div class="col-12">
<strong>Nombre:</strong>
{{clase_vista.profesor_nombre}} {{clase_vista.profesor_nombre}}
</div> </span>
<div class="col-12"> <div class="profesor-datos">
<strong>Correo:</strong> <a :href="`mailto:${clase_vista.profesor_correo}`" class="profesor-correo">
<a :href="`mailto:${clase_vista.profesor_correo}`"><strong>{{ {{clase_vista.profesor_correo}}
detalle.correo }}</strong></a> </a>
</div> <i class="pipe"></i>
<div class="col-12"> <span class="profesor-clave">
<strong>Clave:</strong>
{{clase_vista.profesor_clave}} {{clase_vista.profesor_clave}}
</div> </span>
<div class="col-12">
<strong>Facultad:</strong>
{{ detalle.facultad }}
</div> </div>
</div> </div>
</section> </section>
<section class="col-12 col-md-6">
<h4 class="h4">Clase</h4> <main class="my-5">
<div class="row"> <div class="pp-card" style="grid-row: span 5;">
<div class="col-12"> <div :class="`bg-${clase_vista.estado_color}`" class="text-white pp-card-icon ">
<strong>Materia:</strong> <span>{{clase_vista.nombre}}</span>
{{ detalle.materia }} <i :class="clase_vista.estado_icon" class="mx-3"></i>
</div>
<div class="col-12">
<strong>Carrera:</strong>
{{ detalle.carrera }}
</div>
<div class="col-12">
<strong>Nivel:</strong>
{{ detalle.nivel}}
</div>
<div class="col-12">
<strong>Grupo:</strong>
{{ detalle.horario_grupo }}
</div>
<div class="col-12">
<strong>Horario:</strong>
{{ clase_vista.horario_hora?.slice(0, 5) }} -
{{clase_vista.horario_fin?.slice(0, 5) }}
</div>
<div class="col-12">
<strong>Salón:</strong>
{{ clase_vista.salon }}
</div> </div>
<main>
<span class="supervisor">{{clase_vista.usuario_nombre}}</span>
<span class="supervisor_hora">{{clase_vista.registro_fecha_supervisor}}</span>
<footer>Supervisor</footer>
</main>
</div> </div>
<div class="pp-card" style="grid-row: span 8">
<div class="bg-primary text-white">{{clase_vista.carrera}}</div>
<main>
<span class="materia">{{clase_vista.materia}}</span>
<span class="horario">
<section>
{{clase_vista.horario_hora}}
{{clase_vista.horario_fin}}
</section>
<section>
{{clase_vista.horario_grupo}}
</section> </section>
</div>
<div class="row">
<section class="col-12">
<h4 class="h4 mt-4">Registro</h4>
<div class="row">
<div class="col-md-6 text-center" v-if="!clase_vista.registro_fecha">
<strong><span class="badge border border-dark"><i
class="ing-cancelar"></i></span>
Sin registro del profesor</strong>
</div>
<div class="col-md-6 text-center" v-else>
El profesor registró su asistencia a las
<code>{{clase_vista.registro_fecha?.slice(11, 19)}}</code>
<hr>
<p v-if="!clase_vista.registro_retardo" class="text-center">
<span class="badge border border-success"><i
class="ing-aceptar"></i></span>
A tiempo
</p>
<p v-else class="text-center">
<span class="badge border border-warning"><i
class="ing-retardo"></i></span>
Con retardo
</p>
</div>
<div class="col-md-6 text-center" v-if="clase_vista.registro_justificada">
<strong>
<span class="badge badge-success mr-2">
<i class="ing-finalistas"></i>
</span> </span>
Justificada <span class="salon">{{clase_vista.salon}}</span>
</strong> <footer>{{clase_vista.nivel}}</footer>
<span class="text-muted"> </main>
por
{{clase_vista.justificador_nombre}} de
<strong>{{clase_vista.justificador_rol}}</strong>
<span v-if="clase_vista.justificador_facultad"> de
<strong>{{clase_vista.justificador_facultad}}</strong>
</span>
el día {{clase_vista.registro_fecha_justificacion?.slice(0, 10)}} a
las
{{clase_vista.registro_fecha_justificacion?.slice(11, 16)}}
</span>
<div v-if="clase_vista.justificacion">
<hr>
<p class="text-center">
<strong>Observación:</strong>
{{clase_vista.justificacion}}
</p>
</div> </div>
<div class="pp-card" style="grid-row: span 3">
<div class="bg-warning text-white"
v-if="clase_vista.registro_fecha && clase_vista.registro_retardo">
<span>Con retardo</span>
<i class="ing-retardo"></i>
</div> </div>
<div class="col-md-6 text-center" <div class="bg-success text-white" v-else-if="clase_vista.registro_fecha">
v-else-if="clase_vista.registro_fecha_justificacion"> <span>A tiempo</span>
<strong> <i class="ing-autorizar"></i>
<span class="badge border border-dark"> </div>
<div class="bg-dark text-white" v-else>
Sin registro
<i class="ing-cancelar"></i> <i class="ing-cancelar"></i>
</span>
Sin justificar, <span class="text-muted">
{{clase_vista.justificador_nombre}}
({{clase_vista.justificador_rol}}{{clase_vista.justificador_facultad
? ' de ' + clase_vista.justificador_facultad : ''}})
</span> borró la justificación, el día
{{clase_vista.registro_fecha_justificacion?.slice(0, 10)}} a las
{{clase_vista.registro_fecha_justificacion?.slice(11, 16)}}
</strong>
</div> </div>
<div class="col-md-6 text-center" v-else>
<strong>
<span class="badge border border-dark">
<i class="ing-cancelar"></i>
</span>
Sin justificar
</strong>
</div> </div>
</section>
</main>
<section class="col-12" v-if="clase_vista.reposicion_id"> <footer class="facultad">
<h4 class="h4 mt-4">Reposición</h4> {{clase_vista.facultad}}
</footer>
<div class="row">
<div class="col-12 text-center">
Esta clase se reprogramó para el día
{{ clase_vista.reposicion_fecha }} a las
{{ clase_vista.reposicion_hora?.slice(0, 5) }} -
{{clase_vista.reposicion_hora_fin?.slice(0, 5) }}
</div>
</div>
</section>
</div>
</div>
</div>
<div class="modal-footer">
<!-- botón aceptar -->
<button type="button" class="btn btn-outline-primary" data-dismiss="modal">
<i class="ing-aceptar"></i>
Aceptar
</button>
</div> </div>
</div> </div>
</div> </div>

139
css/auditoria-ux.css Normal file
View File

@@ -0,0 +1,139 @@
@font-face {
font-family: 'La Salle Display Regular';
src: url('../fonts/indivisaFont/woff/IndivisaDisplaySans-Regular.woff');
font-weight: normal;
}
@font-face {
font-family: 'La Salle Display Heavy';
src: url('../fonts/indivisaFont/woff/IndivisaDisplaySans-Heavy.woff');
font-weight: normal;
}
.detalle {
padding: 2rem;
padding-inline: 8rem;
}
.profesor {
display: flex;
gap: 2rem;
align-items: center;
}
.profesor-icon {
height: 6rem;
fill: #001d68;
}
.profesor-nombre {
font-size: 2rem;
font-weight: 900;
font-family: 'La Salle Display Regular';
color: black;
}
.profesor-clave {
font-weight: 900;
font-size: 1.2rem;
font-family: 'La Salle Display Regular';
}
.profesor-datos {
display: flex;
align-items: center;
gap: .75rem;
color: #969696;
}
.profesor-datos .profesor-correo {
font-style: italic;
text-decoration: underline;
color: #969696;
}
.profesor-datos .profesor-correo:hover {
color: #3f3f3f;
transition-timing-function: ease-in;
transition-duration: .2s;
}
.pipe::after {
content: '';
width: .1rem;
height: 1.4rem;
display: block;
background-color: #969696;
}
.detalle main {
display: grid;
gap: 2rem;
grid-template-columns: repeat(2, 1fr);
}
.pp-card {
display: flex;
flex-direction: column;
justify-content: space-between;
}
.pp-card-icon {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
.pp-card div {
border-start-start-radius: 1rem;
border-start-end-radius: 1rem;
padding-inline: 1.5rem;
padding-block: .5rem;
font-family: 'La Salle Display Heavy';
font-size: 1.2rem;
}
.pp-card main {
background-color: #e1e1e1;
height: 100%;
border-end-start-radius: 1rem;
border-end-end-radius: 1rem;
position: relative;
}
.pp-card footer {
font-style: italic;
color: #969696;
position: absolute;
bottom: 0;
right: 0;
margin: 1rem;
}
.pp-card:not(:has(main)) {
div {
display: flex;
align-items: center;
justify-content: space-around;
height: 100%;
border-end-start-radius: 1rem;
border-end-end-radius: 1rem;
font-size: 1.5rem;
}
}
.facultad {
font-family: 'La Salle Display Heavy';
font-size: 1.4rem;
color: #e1e1e1;
position: absolute;
bottom: 0;
right: 0;
margin: 1rem;
}

6
export/supervisor_excel.php
View File

@@ -48,16 +48,16 @@ $data = $db->query(
(auditoria->>'estado_supervisor_id')::integer as estado_id, (auditoria->>'estado_supervisor_id')::integer as estado_id,
auditoria->>'registro_retardo' as registro_retardo auditoria->>'registro_retardo' as registro_retardo
FROM last_auditoria FROM last_auditoria
JOIN BLOQUE_HORARIO ON ((auditoria->>'horario_hora')::TIME, (auditoria->>'horario_fin')::TIME) OVERLAPS (HORA_INICIO, HORA_FIN) -- JOIN BLOQUE_HORARIO ON ((auditoria->>'horario_hora')::TIME, (auditoria->>'horario_fin')::TIME) OVERLAPS (HORA_INICIO, HORA_FIN)
WHERE USUARIO_ID = :usuario_id WHERE USUARIO_ID = :usuario_id
AND auditoria->>'facultad_id' = COALESCE(:facultad_id, auditoria->>'facultad_id') AND auditoria->>'facultad_id' = COALESCE(:facultad_id, auditoria->>'facultad_id')
AND auditoria->>'profesor_clave' = COALESCE(:profesor_clave, auditoria->>'profesor_clave') AND auditoria->>'profesor_clave' = COALESCE(:profesor_clave, auditoria->>'profesor_clave')
AND BLOQUE_HORARIO.ID = COALESCE(:bloque_horario_id, BLOQUE_HORARIO.ID)", --AND BLOQUE_HORARIO.ID = COALESCE(:bloque_horario_id, BLOQUE_HORARIO.ID)",
[ [
'usuario_id' => $user->user['id'], 'usuario_id' => $user->user['id'],
'facultad_id' => $params['facultad_id'], 'facultad_id' => $params['facultad_id'],
'profesor_clave' => $profesor_clave, 'profesor_clave' => $profesor_clave,
'bloque_horario_id' => $params['bloque_horario'] /* 'bloque_horario_id' => $params['bloque_horario'] */
] ]
); );

2
fonts/svg/portrait.svg Normal file
View File

@@ -0,0 +1,2 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" id="Bold" viewBox="0 0 24 24" width="512" height="512"><path d="M18.5,0H5.5A5.506,5.506,0,0,0,0,5.5v13A5.506,5.506,0,0,0,5.5,24h13A5.506,5.506,0,0,0,24,18.5V5.5A5.506,5.506,0,0,0,18.5,0ZM21,18.5A2.5,2.5,0,0,1,18.5,21H18V20A6,6,0,0,0,6,20v1H5.5A2.5,2.5,0,0,1,3,18.5V5.5A2.5,2.5,0,0,1,5.5,3h13A2.5,2.5,0,0,1,21,5.5Z" fill="#001d68"/><circle cx="12" cy="8.5" r="3.5" fill="#001d68"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 466 B

7
js/auditoría.js
View File

@@ -337,12 +337,12 @@ const detalle = reactive({
this.horario_grupo = null this.horario_grupo = null
}, },
async obtener_detalle(horario_id, profesor_id) { async obtener_detalle(horario_id, profesor_id, registro_fecha_ideal) {
detalle.reset(); detalle.reset();
$('div.modal#cargando').modal('show'); $('div.modal#cargando').modal('show');
try { try {
const resultado = await (await fetch(`action/action_auditoria_detalle.php?${new URLSearchParams({ horario_id, profesor_id })}`)).json(); const resultado = await (await fetch(`action/action_auditoria_detalle.php?${new URLSearchParams({ horario_id, profesor_id, registro_fecha_ideal })}`)).json();
this.correo = resultado.profesor_correo; this.correo = resultado.profesor_correo;
this.facultad = resultado.facultad; this.facultad = resultado.facultad;
@@ -350,6 +350,9 @@ const detalle = reactive({
this.carrera = resultado.carrera; this.carrera = resultado.carrera;
this.nivel = resultado.nivel; this.nivel = resultado.nivel;
this.horario_grupo = resultado.horario_grupo; this.horario_grupo = resultado.horario_grupo;
this.registro_fecha =
store.current.clase_vista = resultado
} }
catch (error) { catch (error) {
console.log('Error:', error) console.log('Error:', error)