import { createApp } from 'https://unpkg.com/petite-vue?module'; 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; // 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');