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

STD

Browse Source
This commit is contained in:
Alejandro Rosales
2023-10-12 16:29:39 +00:00
parent 6390bbb766
commit 2e00fbec20
13 changed files with 633 additions and 941 deletions
Download Patch File Download Diff File Expand all files Collapse all files

220
periodos.php Normal file
View File

@@ -0,0 +1,220 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Auditoría asistencial</title>
<?php
include 'import/html_css_files.php';
?>
<link rel="stylesheet" type="text/css" href="https://unpkg.com/trix@2.0.0/dist/trix.css">
<style>
[v-cloak] {
display: none;
}
</style>
<script src="js/jquery.min.js"></script>
<script src="js/jquery-ui.js"></script>
<script src="js/bootstrap/bootstrap.min.js"></script>
</head>
<body>
<?
$redirect = $_SERVER['PHP_SELF'];
include "import/html_header.php";
global $user;
html_header("Periodos", "Sistema de gestión de checador");
?>
<main class="container-fluid px-4 my-4" id="app" v-cloak @vue:mounted="mounted" style="min-height: 70vh;">
<section class="row mt-4">
<div class="col-12 position-relative">
<!-- Loop for messages -->
<div class="toast show shadow-sm mb-3 bg-white"
style="position: fixed; top: 15%; right: 1%; max-width: 300px;" role="alert" aria-live="assertive"
aria-atomic="true"
@vue:mounted="$('.toast').toast({delay: 5000}).toast('show').on('hidden.bs.toast', () => { message.text = '' })"
v-if="message.text">
<div class="toast-header">
<strong class="mr-auto text-primary text-uppercase text-center w-100 px-4">
{{ message.title }}
</strong>
<small class="text-muted">{{ message.timestamp }}</small>
<button type="button" class="ml-2 mb-1 close" data-dismiss="toast" aria-label="Close"
@click="message.text = ''">
<span aria-hidden="true">
<i class="fas fa-times"></i>
</span>
</button>
</div>
<div class="toast-body">
<div :class="message.type == 'success' ? 'text-success' : 'text-danger'"><i
:class="message.type == 'success' ? 'fas fa-check-circle' : 'fas fa-times-circle'"></i>
{{ message.text }}
</div>
</div>
</div>
</div>
</section>
<div class="container">
<div class="d-flex flex-wrap justify-content-around">
<div class="accordion col-8 mb-4" id="puestos"
v-scope="{selected_carrera_id: -1, current_materia: null, current_encargado: null}"
v-if="puestos.length">
<div class="card" v-for="(puesto, index) in puestos" :key="puesto.puesto_id">
<div class="card-header bg-primary" :id="`puesto-${puesto.nombre}`">
<h2 class="mb-0">
<button class="btn btn-link btn-block text-left text-light" type="button"
data-toggle="collapse" :data-target="`#puesto-${puesto.puesto_id}`" aria-expanded="true"
:aria-controls="`puesto-${puesto.puesto_id}`">
{{puesto.nombre}}
<button type="button" class="btn btn-outline-danger float-right"
data-target="#eliminar-puesto" data-toggle="modal" @click="to_delete = puesto">
<span class="icono ing-basura"></span>
</button>
</button>
</h2>
</div>
<div :id="`puesto-${puesto.puesto_id}`" class="collapse" :class="{'show': index == 0}"
:aria-labelledby="`puesto-${puesto.nombre}`" data-parent="#puestos">
<div class="card-body">
<!-- Encargado -->
<div class="form-row justify-content-around align-items-center mb-2">
<label :for="`encargado-${puesto.puesto_id}`" class="col-3">
Encargado del área
</label>
<div id="encargados" class="datalist datalist-select mb-1 col-9">
<div class="datalist-input" v-if="puesto.encargado">
({{puesto.encargado.usuario_clave}}) {{ puesto.encargado.usuario_nombre }}
</div>
<div class="datalist-input" v-else>
Selecciona un encargado
</div>
<span class="icono ing-buscar"></span>
<ul style="display:none">
<li class="datalist-option" v-for="usuario in usuarios"
:key="usuario.usuario_id" :data-id="usuario.usuario_id"
style=" white-space: nowrap;" @click="puesto.encargado = usuario"
:class="{'selected': puesto.encargado?.usuario_id == usuario.usuario_id}">
(<small> {{usuario.usuario_clave}} </small>) {{ usuario.usuario_nombre }}
</li>
</ul>
<input type="hidden" id="encargado_id" name="id">
</div>
</div>
<hr>
<div class="form-row justify-content-around align-items-center mb-2"
v-show="carreras.length">
<label :for="`carrera-${puesto.puesto_id}`" class="col-3">
Carrera
</label>
<div id="dlCarreras" class="datalist datalist-select mb-1 col-9">
<div class="datalist-input">
Selecciona una carrera
</div>
<span class="icono ing-buscar"></span>
<ul style="display:none">
<li class="datalist-option" data-id="0" @click="selected_carrera_id = 0">
Todas las carreras
</li>
<li class="datalist-option" v-for="carrera in carreras"
:key="carrera.carrera_id" :data-id="carrera.carrera_id"
style=" white-space: nowrap;"
@click="selected_carrera_id = carrera.carrera_id">
(<small> {{carrera.clave_carrera}} </small>) {{ carrera.carrera_nombre }}
</li>
</ul>
<input type="hidden" id="carrera_id" name="id">
</div>
</div>
<div class="form-row justify-content-around align-items-center"
v-scope="{to_add_materia: null}">
<label :for="`materias-${puesto.puesto_id}`" class="col-3">
Materias
</label>
<input name="materia" placeholder="Seleccione una materia" list="datalist-materias"
class="form-control col-9 " v-model="current_materia" @input="to_add_materia = materias.find(m => current_materia == `${m.clave_materia} - ${m.materia_nombre}`);
if (to_add_materia) {
if (puesto.materias.find(p => p.materia_id == to_add_materia.materia_id)) {
console.log('La materia ya está asignada');
current_materia = null;
return;
}
puesto.materias.push(to_add_materia);
materias.splice(materias.indexOf(to_add_materia), 1);
current_materia = null;
}" :disabled="selected_carrera_id == -1" v-model="current_materia"
:id="`materias-${puesto.puesto_id}`" autocomplete="off">
</div>
<datalist id="datalist-materias">
<option
v-for="materia in materias.filter(m => selected_carrera_id == 0 || m.carrera_id == selected_carrera_id).filter(m => !puesto.materias.find(p => p.materia_id == m.materia_id))"
:value="`${materia.clave_materia} - ${materia.materia_nombre}`">
</datalist>
<hr>
<fieldset class="container d-flex flex-column justify-content-center align-items-center">
<legend>Materias Asignadas <span
class="badge badge-secondary">{{puesto.materias.length}}</span></legend>
<ul class="list-group overflow-auto col-10" v-if="puesto.materias.length"
style="max-height: 200px; overflow-y: auto;">
<li class="list-group-item list-group-item-action"
v-for="materia in puesto.materias" :key="materia.materia_id"
@click="puesto.materias.splice(puesto.materias.indexOf(materia), 1); materias.push(materia)"
style="cursor: pointer;">
<div class="d-flex justify-content-center">
<div class="col-2 text-center">
<span class="icono ing-borrar text-danger"></span>
</div>
<div class="col-10 text-left">
{{materia.clave_materia}} - {{materia.materia_nombre}}
</div>
</div>
</li>
</ul>
<div class="alert alert-light" role="alert" v-else>
No hay materias asignadas
</div>
</fieldset>
</div>
<div class="card-footer text-muted">
<!-- scroll to top -->
<button type="button" class="btn btn-outline-primary btn-lg btn-block"
@click="actualizarPuesto(puesto.puesto_id, puesto.materias, puesto.encargado?.usuario_id)"
onclick="window.scrollTo(0, 0);">
{{ puesto.encargado ? 'Guardar cambios' : 'Guardar sin encargado' }}
</button>
</div>
</div>
</div>
</div>
<div v-else>
<div class="alert alert-dark" role="alert">
No hay puestos registrados
</div>
</div>
</div>
</div>
</main>
<?
include "import/html_footer.php"; ?>
<script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js"
integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"
integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.min.js"
integrity="sha384-+sLIOodYLS7CIrQpBjl+C7nPvqq+FbNUBDunl/OZv93DB7Ln/533i8e/mZXLi/P+"
crossorigin="anonymous"></script>
<script src="js/datalist.js"></script>
<script src="js/periodos.js?<?= rand(0, 2) ?>" type="module"></script>
<script src="js/scrollables.js"></script>
</body>
</html>