225 lines
12 KiB
PHP
225 lines
12 KiB
PHP
<?php
|
|
require_once 'class/c_login.php';
|
|
$user = Login::get_user();
|
|
|
|
$user->access();
|
|
if (in_array($user->acceso, ['n']))
|
|
die(header('Location: main.php?error=1'));
|
|
|
|
$user->print_to_log('Consultar horario');
|
|
|
|
$write = $user->admin || in_array($user->acceso, ['r']);
|
|
?>
|
|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<title>Consultar horario |
|
|
<?= $user->facultad['facultad'] ?>
|
|
</title>
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="content-type" content="text/plain; charset=UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
|
<?php include_once "import/html_css_files.php"; ?>
|
|
<script src="js/jquery.min.js"></script>
|
|
<script src="js/bootstrap/bootstrap.min.js"></script>
|
|
<style>
|
|
[v-cloak] {
|
|
display: none;
|
|
}
|
|
</style>
|
|
</head>
|
|
<!-- -->
|
|
|
|
<body style="display: block;">
|
|
<?php
|
|
include('include/constantes.php');
|
|
include("import/html_header.php");
|
|
html_header("Consultar horario", "Sistema de gestión de checador");
|
|
?>
|
|
<main class="container px-4 mt-4 h-100" id="app" v-cloak @vue:mounted="mounted" style="min-height: 60vh;"
|
|
v-scope="">
|
|
<section id="message"></section>
|
|
<nav>
|
|
<div class="nav nav-tabs" id="nav-tab" role="tablist">
|
|
<button class="nav-link active" id="nav-home-tab" data-toggle="tab" data-target="#nav-home"
|
|
type="button" role="tab" aria-controls="nav-home" aria-selected="true" @click="horarios.data = []">
|
|
Horario por profesor
|
|
</button>
|
|
<button class="nav-link" id="nav-profile-tab" data-toggle="tab" data-target="#nav-profile" type="button"
|
|
role="tab" aria-controls="nav-profile" aria-selected="false" @click="horarios.data = []">
|
|
Horario por grupo
|
|
</button>
|
|
</div>
|
|
</nav>
|
|
<div class="tab-content" id="nav-tabContent">
|
|
<div class="tab-pane fade show active" id="nav-home" role="tabpanel" aria-labelledby="nav-home-tab">
|
|
<div class="form-box">
|
|
<div class="form-group row">
|
|
<label for="profesor" class="col-4 col-form-label">Seleccionar profesor</label>
|
|
<div class="col-6">
|
|
<div class="form-row justify-content-around align-items-center">
|
|
<input id="profesor" name="profesor" class="form-control col-11 mr-1 px-2"
|
|
placeholder="Seleccione un profesor" list="dlProfesor" v-model="profesores.search"
|
|
@input="horarios.fetch(null)">
|
|
<button type="button" class="btn btn-outline-danger btn-sm form-control col ml-auto"
|
|
@click="profesores.search = null; horarios.data = []">
|
|
<i class="ing-borrar"></i>
|
|
</button>
|
|
</div>
|
|
<datalist id="dlProfesor">
|
|
<option v-for="profesor in profesores.data" :key="profesor.profesor_id"
|
|
:value="`(${profesor.profesor_clave}) ${profesor.profesor_nombre}`">
|
|
</datalist>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="tab-pane fade" id="nav-profile" role="tabpanel" aria-labelledby="nav-profile-tab"
|
|
v-scope="{facultad_id: null, carrera_id: null, grupo: null}">
|
|
<?
|
|
require('import/periodo.php');
|
|
?>
|
|
<div class="form-box" v-show="facultades.data.every(facultad => facultad.carreras.length > 0)">
|
|
<div class="form-group row">
|
|
<label for="carrera_id" class="col-4 col-form-label">Carrera</label>
|
|
<div class="col-6">
|
|
<div id="dlCarreras" class="datalist datalist-select mb-1 w-100">
|
|
<div class="datalist-input">
|
|
Selecciona una carrera
|
|
</div>
|
|
<span class="icono ing-buscar"></span>
|
|
<ul style="display:none">
|
|
<div v-for="facultad in facultades.data">
|
|
<li class="not-selectable">
|
|
{{ facultad.facultad_nombre }}
|
|
</li>
|
|
<li v-for="carrera in facultad.carreras" :key="carrera.carrera_id"
|
|
@click="carrera_id = carrera.carrera_id; facultad_id = facultad.facultad_id; grupo = null">
|
|
{{ carrera.carrera_nombre }}
|
|
</li>
|
|
</div>
|
|
</ul>
|
|
<input type="hidden" id="carrera_id" name="id">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="form-box" v-if="carrera_id">
|
|
<div class="form-group row">
|
|
<label for="grupo" class="col-4 col-form-label">Grupo</label>
|
|
<div class="col-6">
|
|
<div id="dlGrupo" class="datalist datalist-select mb-1 w-100">
|
|
<div class="datalist-input">
|
|
Selecciona un grupo
|
|
</div>
|
|
<span class="icono ing-buscar"></span>
|
|
<ul style="display:none">
|
|
<li v-for="grupo in facultades.data.find(facultad => facultad.facultad_id === facultad_id).carreras.find(carrera => carrera.carrera_id === carrera_id).grupos"
|
|
@click="grupo = grupo; horarios.fetch(grupo, carrera_id)">
|
|
{{ grupo }}
|
|
</li>
|
|
</ul>
|
|
<input type="hidden" id="grupo" name="grupo">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<hr>
|
|
<div id="btn-excel-horario" class="mb-2 float-right hidden" v-if="horarios.data.length > 0">
|
|
<button class="btn btn-outline-secondary " title="Imprimir PDF" @click="
|
|
// hide all not the table
|
|
Array.from(document.body.children).forEach(child => {
|
|
if (child.id !== 'app') {
|
|
child.classList.add('d-none');
|
|
}
|
|
// hide this button
|
|
document.getElementById('btn-excel-horario').classList.add('d-none');
|
|
});
|
|
|
|
window.print()
|
|
|
|
// show all
|
|
Array.from(document.body.children).forEach(child => {
|
|
child.classList.remove('d-none');
|
|
});
|
|
// show this button
|
|
document.getElementById('btn-excel-horario').classList.remove('d-none');
|
|
|
|
">
|
|
<span class="ing-descarga ing-fw"></span> Exportar
|
|
</button>
|
|
</div>
|
|
<div class="table-responsive" v-if="horarios.data.length > 0">
|
|
<table class="table table-bordered table-sm table-responsive-sm" id="table-horario">
|
|
<thead class="thead-dark">
|
|
<tr id="headers">
|
|
<th scope="col" class="text-center">Hora</th>
|
|
<th scope="col" class="text-center">Lunes</th>
|
|
<th scope="col" class="text-center">Martes</th>
|
|
<th scope="col" class="text-center">Miércoles</th>
|
|
<th scope="col" class="text-center">Jueves</th>
|
|
<th scope="col" class="text-center">Viernes</th>
|
|
<th scope="col" class="text-center" v-if="horarios.structure?.sábado">Sábado</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="horario">
|
|
<tr v-for="{ hour, block } in horarios.blocks" style="height: 2em;">
|
|
<th v-if="block === 0" rowspan="4" scope="row" class="text-center align-middle"
|
|
style="width: 6%;">
|
|
{{ hour.toString().padStart(2, '0') }}:{{ block === 0 ? '00' :
|
|
block.toString().padStart(2,'0') }}
|
|
</th>
|
|
|
|
<td :rowspan="horarios.getHorarioData(hour, block, día)?.bloques ?? 1"
|
|
v-for="día in [...Array(horarios.structure?.sábado ? 6 : 5).keys()].map(i => i + 1).filter(día => !horarios.isOccupied(hour, block, día))"
|
|
:key="`${hour}-${block}-${día}`"
|
|
:class="horarios.getHorarioData(hour, block, día) ? 'bg-light' : ''"
|
|
class="align-middle h-100"
|
|
:style="`width: ${(100 - 6) / (horarios.structure?.sábado ? 6 : 5)}%;`">
|
|
<!-- Content Container -->
|
|
<div class="overflow-auto" :style="`max-height: ${horarios.getHorarioData(hour, block, día)?.bloques * 2}em;
|
|
min-height: 2em;
|
|
`">
|
|
<div v-if="horarios.getHorarioData(hour, block, día)" class="text-center">
|
|
<small class="font-weight-bolder font-weight-lighter text-muted">
|
|
{{horarios.getHorarioData(hour, block, día)?.facultad}}
|
|
</small>
|
|
<br>
|
|
<div class="my-2">
|
|
<small class="text-muted">
|
|
{{horarios.getHorarioData(hour, block, día)?.horario_hora.slice(0, 5)}}
|
|
</small>
|
|
<b style="line-height: 80%;">
|
|
{{horarios.getHorarioData(hour, block, día)?.materia}}
|
|
</b>
|
|
</div>
|
|
<small class="text-muted">
|
|
{{horarios.getHorarioData(hour, block, día)?.carrera}}
|
|
</small>
|
|
<br>
|
|
<span>Salón: </span>
|
|
<small class="font-weight-lighter text-muted">
|
|
{{horarios.getHorarioData(hour, block, día)?.salon}}
|
|
</small>
|
|
</div>
|
|
<div v-else> </div>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</main>
|
|
</body>
|
|
<? require_once "import/html_footer.php" ?>
|
|
<script src="js/scrollables.js"></script>
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/2.0.5/FileSaver.min.js"></script>
|
|
<script src="js/horario.js" type="module" defer></script>
|
|
|
|
</html>
|