import { createApp } from 'https://unpkg.com/petite-vue?module';

// añade una ventana de confirmación al intentar cambiar de página
const app = createApp({
    message: null,
    puestos: [],
    carreras: [],
    materias: [],
    usuarios: [],
    async nuevoPuesto(nuevoPuesto) {
        try {
            const res = await fetch('action/puesto.php', {
                method: 'POST',
                body: JSON.stringify({
                    puesto_nombre: nuevoPuesto
                })
            });
            const data = await res.json();
            this.puestos.push(data);
            // order by puesto.nombre
            this.puestos.sort((a, b) => a.nombre.localeCompare(b.nombre));
        }
        catch (error) {
            alert(`Error: ${error}`);
        }
    },
    to_delete: null,
    async eliminarPuesto(puesto_id) {
        try {
            const res = await fetch('action/puesto.php', {
                method: 'DELETE',
                body: JSON.stringify({
                    puesto_id
                })
            });
            const data = await res.json();
            this.message = data.msg;
            // after 3 seconds, remove the message
            setTimeout(() => {
                this.message = null;
            }, 3000);
            this.puestos = this.puestos.filter((p) => p.puesto_id !== puesto_id);
            // order by puesto.nombre
            this.puestos.sort((a, b) => a.nombre.localeCompare(b.nombre));
        }
        catch (error) {
            alert(`Error: ${error}`);
        }
    },
    async actualizarPuesto(puesto_id, materias, usuario_id) {
        try {
            const res = await fetch('action/puesto.php', {
                method: 'PUT',
                body: JSON.stringify({
                    puesto_id,
                    materias: materias.map(m => m.materia_id),
                    usuario_id
                })
            });
            const data = await res.json();
            this.message = data.msg;

            modificado = false;
            // after 3 seconds, remove the message
            setTimeout(() => {
                this.message = null;
            }, 3000);
        }
        catch (error) {
            alert(`Error: ${error}`);
        }
    },
    async mounted() {
        this.puestos = await fetch('action/puesto.php').then(res => res.json());
        this.carreras = await fetch('action/action_carreras.php').then(res => res.json());
        this.materias = await fetch('action/action_materias.php').then(res => res.json());
        this.usuarios = await fetch('action/usuarios.php').then(res => res.json());
    }
}).mount('#app');
