feat: refactor cargarAlumnos function and add eliminarAlumno functionality in AlumnosVista
This commit is contained in:
parent
d5140cbec2
commit
9f86e069bb
diplomas/src/pages
|
@ -105,6 +105,22 @@ export default function AlumnosManual() {
|
||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
{/* Modal */}
|
||||||
|
<Dialog open={mostrarModal} onOpenChange={setMostrarModal}>
|
||||||
|
<DialogContent>
|
||||||
|
<DialogHeader>
|
||||||
|
<DialogTitle className="text-black">
|
||||||
|
Resultado de la operación
|
||||||
|
</DialogTitle>
|
||||||
|
<DialogDescription>{modalMensaje}</DialogDescription>
|
||||||
|
</DialogHeader>
|
||||||
|
<DialogFooter>
|
||||||
|
<Button onClick={() => setMostrarModal(false)}>Cerrar</Button>
|
||||||
|
</DialogFooter>
|
||||||
|
</DialogContent>
|
||||||
|
</Dialog>
|
||||||
</Layout>
|
</Layout>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
@ -22,17 +22,18 @@ export default function AlumnosVista() {
|
||||||
const [modalMensaje, setModalMensaje] = useState("");
|
const [modalMensaje, setModalMensaje] = useState("");
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const cargarAlumnos = async () => {
|
|
||||||
const { data, error } = await supabaseClient.from("alumno").select("*");
|
|
||||||
if (error) {
|
|
||||||
console.error("Error al cargar alumnos:", error.message);
|
|
||||||
} else {
|
|
||||||
setAlumnos(data);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
cargarAlumnos();
|
cargarAlumnos();
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
|
const cargarAlumnos = async () => {
|
||||||
|
const { data, error } = await supabaseClient.from("alumno").select("*");
|
||||||
|
if (error) {
|
||||||
|
console.error("Error al cargar alumnos:", error.message);
|
||||||
|
} else {
|
||||||
|
setAlumnos(data);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
// Iniciar edición
|
// Iniciar edición
|
||||||
const iniciarEdicion = (alumno) => {
|
const iniciarEdicion = (alumno) => {
|
||||||
setAlumnoEditando(alumno.id);
|
setAlumnoEditando(alumno.id);
|
||||||
|
@ -62,14 +63,25 @@ export default function AlumnosVista() {
|
||||||
setModalMensaje("Error al actualizar el alumno");
|
setModalMensaje("Error al actualizar el alumno");
|
||||||
} else {
|
} else {
|
||||||
setModalMensaje("Alumno actualizado exitosamente");
|
setModalMensaje("Alumno actualizado exitosamente");
|
||||||
// Recargar alumnos
|
await cargarAlumnos();
|
||||||
const { data } = await supabaseClient.from("alumno").select("*");
|
|
||||||
setAlumnos(data);
|
|
||||||
cancelarEdicion();
|
cancelarEdicion();
|
||||||
}
|
}
|
||||||
setMostrarModal(true);
|
setMostrarModal(true);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// Eliminar alumno
|
||||||
|
const eliminarAlumno = async (id) => {
|
||||||
|
const { error } = await supabaseClient.from("alumno").delete().eq("id", id);
|
||||||
|
if (error) {
|
||||||
|
console.error("Error eliminando alumno:", error.message);
|
||||||
|
setModalMensaje("Error al eliminar el alumno");
|
||||||
|
} else {
|
||||||
|
setModalMensaje("Alumno eliminado exitosamente");
|
||||||
|
await cargarAlumnos();
|
||||||
|
}
|
||||||
|
setMostrarModal(true);
|
||||||
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Layout>
|
<Layout>
|
||||||
<div className="w-[80vw] pt-10 flex flex-col items-center text-black">
|
<div className="w-[80vw] pt-10 flex flex-col items-center text-black">
|
||||||
|
@ -78,7 +90,7 @@ export default function AlumnosVista() {
|
||||||
</h1>
|
</h1>
|
||||||
<table className="min-w-full bg-white border">
|
<table className="min-w-full bg-white border">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr className="bg-gray-100">
|
||||||
<th className="py-2 border-b">ID</th>
|
<th className="py-2 border-b">ID</th>
|
||||||
<th className="py-2 border-b">Nombre</th>
|
<th className="py-2 border-b">Nombre</th>
|
||||||
<th className="py-2 border-b">Correo</th>
|
<th className="py-2 border-b">Correo</th>
|
||||||
|
@ -97,7 +109,6 @@ export default function AlumnosVista() {
|
||||||
type="text"
|
type="text"
|
||||||
value={nuevoNombre}
|
value={nuevoNombre}
|
||||||
onChange={(e) => setNuevoNombre(e.target.value)}
|
onChange={(e) => setNuevoNombre(e.target.value)}
|
||||||
className="border rounded px-2 py-1 w-full"
|
|
||||||
/>
|
/>
|
||||||
</td>
|
</td>
|
||||||
<td className="py-2 px-4 border-b">
|
<td className="py-2 px-4 border-b">
|
||||||
|
@ -105,7 +116,6 @@ export default function AlumnosVista() {
|
||||||
type="email"
|
type="email"
|
||||||
value={nuevoCorreo}
|
value={nuevoCorreo}
|
||||||
onChange={(e) => setNuevoCorreo(e.target.value)}
|
onChange={(e) => setNuevoCorreo(e.target.value)}
|
||||||
className="border rounded px-2 py-1 w-full"
|
|
||||||
/>
|
/>
|
||||||
</td>
|
</td>
|
||||||
<td className="py-2 px-4 border-b flex justify-center">
|
<td className="py-2 px-4 border-b flex justify-center">
|
||||||
|
@ -128,13 +138,20 @@ export default function AlumnosVista() {
|
||||||
<td className="py-2 px-4 border-b">{alumno.id}</td>
|
<td className="py-2 px-4 border-b">{alumno.id}</td>
|
||||||
<td className="py-2 px-4 border-b">{alumno.nombre}</td>
|
<td className="py-2 px-4 border-b">{alumno.nombre}</td>
|
||||||
<td className="py-2 px-4 border-b">{alumno.correo}</td>
|
<td className="py-2 px-4 border-b">{alumno.correo}</td>
|
||||||
<td className="py-2 px-4 border-b">
|
<td className="py-2 px-4 border-b space-x-2">
|
||||||
<Button
|
<Button
|
||||||
className="bg-blue-500 hover:bg-blue-700 text-white font-bold py-1 px-3 rounded"
|
className="bg-blue-500 hover:bg-blue-700 text-white font-bold py-1 px-3 rounded"
|
||||||
onClick={() => iniciarEdicion(alumno)}
|
onClick={() => iniciarEdicion(alumno)}
|
||||||
>
|
>
|
||||||
Editar
|
Editar
|
||||||
</Button>
|
</Button>
|
||||||
|
|
||||||
|
<Button
|
||||||
|
className="bg-red-500 hover:bg-red-700 text-white font-bold py-1 px-3 rounded"
|
||||||
|
onClick={() => eliminarAlumno(alumno.id)}
|
||||||
|
>
|
||||||
|
Eliminar
|
||||||
|
</Button>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
)
|
)
|
||||||
|
|
|
@ -153,6 +153,13 @@ export default function CursosVista() {
|
||||||
>
|
>
|
||||||
Editar
|
Editar
|
||||||
</Button>
|
</Button>
|
||||||
|
|
||||||
|
<Button
|
||||||
|
className="bg-red-500 hover:bg-red-700 text-white font-bold py-1 px-3 rounded"
|
||||||
|
|
||||||
|
>
|
||||||
|
Eliminar
|
||||||
|
</Button>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
)
|
)
|
||||||
|
|
Loading…
Reference in New Issue