paad/js/periodos.js

import { createApp } from 'https://unpkg.com/petite-vue?module';
const app = createApp({
    carreras: [],
    niveles: [],
    message: {},
    async setNivel(carrera, nivel) {
        if (carrera.nivel_id === nivel.nivel_id) {
            return;
        }
        carrera.nivel_id = nivel.nivel_id;
        carrera.nivel_nombre = nivel.nivel_nombre;
        await fetch('action/carrera.php', {
            method: 'PUT',
            body: JSON.stringify({
                carrera_id: carrera.carrera_id,
                nivel_id: nivel.nivel_id
            })
        })
            .then(res => res.json())
            .then(res => {
            this.message.title = "Actualización";
            this.message.text = res.error ?? res.success;
            this.message.type = res.error ? 'danger' : 'success';
            this.message.timestamp = new Date().toLocaleTimeString();
        });
    },
    async mounted() {
        this.carreras = await fetch('action/carrera.php').then(res => res.json());
        this.niveles = await fetch('action/nivel.php').then(res => res.json());
        // group by facultad_id
        const carreras = this.carreras.reduce((acc, cur) => {
            const { facultad_nombre } = cur;
            if (!acc[facultad_nombre]) {
                acc[facultad_nombre] = [];
            }
            acc[facultad_nombre].push(cur);
            return acc;
        }, {});
        this.carreras = Object.entries(carreras).map(([facultad_nombre, carreras]) => ({
            facultad_nombre: facultad_nombre,
            carreras
        }));
    }
}).mount('#app');