paad/js/periodos.js

import { createApp } from 'https://unpkg.com/petite-vue?module';
const app = createApp({
    periodos: [],
    niveles: [],
    messages: [],
    addMessage(title, text, type) {
        this.messages.push({ title, text, type, timestamp: new Date() });
    },
    async sendRequest(action, periodo_id, data) {
        const response = await fetch('action/periodos.php', {
            method: 'PUT',
            headers: {
                'Content-Type': 'application/json'
            },
            body: JSON.stringify({
                action: action,
                periodo_id: periodo_id,
                ...data
            })
        });
        return await response.json();
    },
    async changeNivel(periodo, nivel_id) {
        if (periodo.nivel_id === nivel_id)
            return;
        const result = await this.sendRequest('changeNivel', periodo.periodo_id, { nivel_id: nivel_id });
        if (result.success) {
            this.addMessage('Nivel cambiado', `El nivel del periodo ${periodo.periodo_nombre} ha sido cambiado a ${this.niveles.find((nivel) => nivel.nivel_id === nivel_id)?.nivel_nombre}`, 'success');
            periodo.nivel_id = nivel_id;
            periodo.nivel = this.niveles.find((nivel) => nivel.nivel_id === nivel_id)?.nivel_nombre || '';
        }
        else {
            this.addMessage('Error al cambiar nivel', `No se pudo cambiar el nivel del periodo ${periodo.periodo_nombre}`, 'danger');
        }
    },
    async changeFechaInicio(periodo, fecha_inicio) {
        const result = await this.sendRequest('changeFechaInicio', periodo.periodo_id, { periodo_fecha_inicio: fecha_inicio });
        if (result.success) {
            this.addMessage('Fecha de inicio cambiada', `La fecha de inicio del periodo ${periodo.periodo_nombre} ha sido cambiada a ${fecha_inicio}`, 'success');
            periodo.periodo_fecha_inicio = fecha_inicio;
        }
        else {
            this.addMessage('Error al cambiar fecha de inicio', `No se pudo cambiar la fecha de inicio del periodo ${periodo.periodo_nombre}`, 'danger');
        }
    },
    async changeFechaFin(periodo, fecha_fin) {
        const result = await this.sendRequest('changeFechaFin', periodo.periodo_id, { periodo_fecha_fin: fecha_fin });
        if (result.success) {
            this.addMessage('Fecha de fin cambiada', `La fecha de fin del periodo ${periodo.periodo_nombre} ha sido cambiada a ${fecha_fin}`, 'success');
            periodo.periodo_fecha_fin = fecha_fin;
        }
        else {
            this.addMessage('Error al cambiar fecha de fin', `No se pudo cambiar la fecha de fin del periodo ${periodo.periodo_nombre}`, 'danger');
        }
    },
    async updatePeriodo(periodo) {
        const result = await this.sendRequest('updatePeriodo', periodo.periodo_id, {
            periodo_nombre: periodo.periodo_nombre,
            id_periodo_sgu: periodo.id_periodo_sgu,
            periodo_clave: periodo.periodo_clave,
        });
        if (result.success) {
            this.addMessage('Periodo actualizado', `El periodo ${periodo.periodo_nombre} ha sido actualizado`, 'success');
        }
        else {
            this.addMessage('Error al actualizar periodo', `No se pudo actualizar el periodo ${periodo.periodo_nombre}`, 'danger');
        }
    },
    async createPeriodo(newPeriodo) {
        if (newPeriodo.periodo_nombre === null || newPeriodo.nivel_id === null || newPeriodo.periodo_fecha_inicio === null || newPeriodo.periodo_fecha_fin === null) {
            this.addMessage('Error al crear periodo', `No se pudo crear el periodo ${newPeriodo.periodo_nombre}`, 'danger');
            return;
        }
        const result = await fetch('action/periodos.php', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
            },
            body: JSON.stringify(newPeriodo)
        }).then(res => res.json());
        if (result.success) {
            this.addMessage('Periodo creado', `El periodo ${newPeriodo.periodo_nombre} ha sido creado`, 'success');
            this.periodos;
            Object.keys(newPeriodo).forEach(key => newPeriodo[key] = null);
            newPeriodo.nivel_id = '';
            this.periodos = await fetch('action/periodos.php').then(res => res.json());
        }
        else {
            this.addMessage('Error al crear periodo', `No se pudo crear el periodo ${newPeriodo.periodo_nombre}`, 'danger');
        }
    },
    async deletePeriodo(periodo) {
        const response = await fetch('action/periodos.php', {
            method: 'DELETE',
            headers: {
                'Content-Type': 'application/json'
            },
            body: JSON.stringify({
                periodo_id: periodo.periodo_id,
            })
        });
        const result = await response.json();
        if (result.success) {
            this.addMessage('Periodo eliminado', `El periodo ${periodo.periodo_nombre} ha sido eliminado`, 'success');
            this.periodos = this.periodos.filter((p) => p.periodo_id !== periodo.periodo_id);
        }
        else {
            this.addMessage('Error al eliminar periodo', `No se pudo eliminar el periodo ${periodo.periodo_nombre}`, 'danger');
        }
    },
    async mounted() {
        this.periodos = await fetch('action/periodos.php').then(res => res.json());
        this.niveles = await fetch('action/nivel.php').then(res => res.json());
    }
}).mount('#app');