import {Vista} from '../vista.js';
/**
* Contiene la vista de gestión mensual de secretaría.
*/
export class VistaGestionMensual extends Vista {
/**
* Constructor de la clase.
* @param {ControladorSecretaria} controlador Controlador de la vista.
* @param {HTMLDivElement} div Div de HTML en el que se desplegará la vista.
*/
constructor(controlador, div) {
super(controlador, div);
this.usuarios = null;
this.incidencias = null;
this.btnMesAnterior = this.div.getElementsByClassName('btn-prev')[0];
this.btnMesSiguiente = this.div.getElementsByClassName('btn-next')[0];
this.tabla = this.div.querySelector('#tablaGestionMensual');
this.thead = this.div.getElementsByTagName('thead')[0];
this.tbody = this.div.getElementsByTagName('tbody')[0];
this.mesActual = this.obtenerMes();
this.btnMesAnterior.addEventListener('click', this.mesAnterior.bind(this));
this.btnMesSiguiente.addEventListener('click', this.mesSiguiente.bind(this));
this.mes = document.getElementById('mes');
}
/**
* Refrescar/iniciar listado.
*/
inicializar() {
this.controlador.obtenerUsuariosMensual(this.mesActual);
this.mes.textContent = this.obtenerMesActualEnLetras(this.mesActual)
}
/**
* Devuelve el nombre del mes pasado.
* @param {integer} mes Mes en forma numerica
* @returns El mes en español correspondiente a la posicion
*/
obtenerMesActualEnLetras(mes) {
const meses = [
"Enero", "Febrero", "Marzo",
"Abril", "Mayo", "Junio",
"Julio", "Agosto", "Septiembre",
"Octubre", "Noviembre", "Diciembre"
];
let mesIndex = mes - 1;
let mesEnLetras = meses[mesIndex];
return mesEnLetras;
}
/**
* Obtener listado de usuarios que van al comedor, y cargar incidencias.
* @param {Array} usuarios Array con los apuntados del día actual.
*/
cargarIncidencias(usuarios) {
this.usuarios = usuarios;
if (this.usuarios) this.controlador.obtenerIncidenciasMensual(this.mesActual);
else this.iniciarTabla();
}
/**
* Obtener incidencias y empezar a generar la tabla.
* @param {Array} incidencias Incidencias de los usuarios del mes actual.
*/
cargarListado(incidencias) {
this.incidencias = incidencias;
this.iniciarTabla();
}
/**
* Generar tabla por partes.
*/
iniciarTabla() {
this.crearEncabezado();
this.crearCuerpo();
}
/**
* Crear cabecera tabla.
*/
crearEncabezado() {
this.thead.innerHTML = '';
if (this.usuarios) {
// Segundo tr
let trInfo = document.createElement('tr');
let thUsuarios = document.createElement('th');
thUsuarios.textContent = 'Usuarios';
let thTipo = document.createElement('th');
thTipo.textContent = 'Tipo de usuario';
let thNumeroMenus = document.createElement('th');
thNumeroMenus.textContent = 'Nº de menús';
let thIncidencias = document.createElement('th');
thIncidencias.textContent = 'Incidencias';
trInfo.appendChild(thUsuarios);
trInfo.appendChild(thTipo);
trInfo.appendChild(thNumeroMenus)
trInfo.appendChild(thIncidencias);
this.thead.appendChild(trInfo);
}
}
/**
* Generar cuerpo de la tabla.
*/
crearCuerpo() {
this.tbody.innerHTML = '';
if (this.usuarios){
for (const usuario of this.usuarios) {
let tr = document.createElement('tr');
let tdNombre = document.createElement('td');
tdNombre.textContent = usuario.nombre + " " + usuario.apellidos;
if(tdNombre.textContent.length > 40){
tdNombre.textContent = usuario.nombre + "(...)";
tdNombre.setAttribute('title', usuario.nombre + " " + usuario.apellidos)
}
let tdCurso = document.createElement('td');
tdCurso.textContent = this.obtenerTipo(usuario.correo);
let tdNumeroMenus = document.createElement('td');
tdNumeroMenus.textContent = usuario.numeroMenus
let tdIncidencia = document.createElement('td');
tdIncidencia.classList.add('small-cell');
let textarea = document.createElement('textarea');
textarea.setAttribute('rows', '1');
textarea.disabled = true;
if (this.incidencias) {
for (const incidencia of this.incidencias) {
if (incidencia.idPersona == usuario.id && incidencia.incidencias)
textarea.value = incidencia.incidencias;
}
}
tdIncidencia.appendChild(textarea);
tr.appendChild(tdNombre);
tr.appendChild(tdCurso);
tr.appendChild(tdNumeroMenus)
tr.appendChild(tdIncidencia);
this.tbody.appendChild(tr);
}
}
else {
let tr = document.createElement('tr');
let tdSinUsuarios = document.createElement('td');
tdSinUsuarios.setAttribute('colspan', '4')
tdSinUsuarios.textContent = "No existen registros";
tr.appendChild(tdSinUsuarios);
this.tbody.appendChild(tr)
}
}
/**
* Devuelve el tipo de cuenta que tiene el usuario.
* @param {String} correo Correo del usuario.
* @returns {String} Tipo de cuenta.
*/
obtenerTipo(correo) {
if (!correo) {
return 'Hijo';
}
if (correo.includes('@alumnado.fundacionloyola.net')) {
return 'Alumnado';
}
if (correo.includes('@fundacionloyola.es')) {
return 'Personal';
}
}
/**
* Devuelve el mes en texto.
* @returns {String} String del mes.
*/
obtenerMes() {
let fecha = new Date();
let mes = fecha.getMonth() + 1;
return mes;
}
/**
* Retroceder un mes.
*/
mesAnterior() {
this.mesActual = this.mesActual - 1 ;
if (this.mesActual < 1) {
this.mesActual = 12
}
this.inicializar();
}
/**
* Avanzar un mes.
*/
mesSiguiente() {
this.mesActual = this.mesActual + 1;
if (this.mesActual > 12) {
this.mesActual = 1
}
this.inicializar();
}
mostrar(ver) {
super.mostrar(ver);
if (ver) this.inicializar(); // Al volver a mostrar la vista, refrescar listado.
}
}