diff --git a/diplomas/src/pages/alumnosManual.jsx b/diplomas/src/pages/alumnosManual.jsx
index 8e9d090..51539df 100644
--- a/diplomas/src/pages/alumnosManual.jsx
+++ b/diplomas/src/pages/alumnosManual.jsx
@@ -38,6 +38,7 @@ export default function AlumnosManual() {
defaultValues: {
nombre: "",
correo: "",
+ telefono: "",
cursoSeleccionado: "",
},
});
@@ -64,6 +65,7 @@ export default function AlumnosManual() {
{
nombre: data.nombre,
correo: data.correo,
+ telefono: data.telefono,
nombreCurso: data.cursoSeleccionado, // Guardar el nombre del curso
},
]);
@@ -114,6 +116,19 @@ export default function AlumnosManual() {
</p>
)}
</div>
+ <div className="mb-3">
+ <Input
+ type="text"
+ placeholder="Teléfono"
+ {...register("telefono")}
+ className="w-full px-3 py-2 border border-gray-300 rounded-md"
+ />
+ {errors.telefono && (
+ <p className="text-red-500 text-sm mt-1">
+ {errors.telefono.message}
+ </p>
+ )}
+ </div>
<div className="mb-4">
<Select
onValueChange={(value) => setValue("cursoSeleccionado", value)}
diff --git a/diplomas/src/pages/alumnosVista.jsx b/diplomas/src/pages/alumnosVista.jsx
index f1dad9f..1778a34 100644
--- a/diplomas/src/pages/alumnosVista.jsx
+++ b/diplomas/src/pages/alumnosVista.jsx
@@ -19,12 +19,14 @@ import {
SelectTrigger,
SelectValue,
} from "@/components/ui/select";
+import { set } from "react-hook-form";
export default function AlumnosVista() {
const [alumnos, setAlumnos] = useState([]);
const [alumnoEditando, setAlumnoEditando] = useState(null);
const [nuevoNombre, setNuevoNombre] = useState("");
const [nuevoCorreo, setNuevoCorreo] = useState("");
+ const [nuevoNumero, setNuevoNumero] = useState("");
const [mostrarModal, setMostrarModal] = useState(false);
const [modalMensaje, setModalMensaje] = useState("");
const [nuevoCurso, setNuevoCurso] = useState("");
@@ -49,7 +51,10 @@ export default function AlumnosVista() {
};
const cargarAlumnos = async () => {
- const { data, error } = await supabaseClient.from("alumno").select("*");
+ const { data, error } = await supabaseClient
+ .from("alumno")
+ .select("id, nombre, correo, telefono, curso_id, curso(nombre)")
+ .order("id", { ascending: true });
if (error) {
console.error("Error al cargar alumnos:", error.message);
} else {
@@ -62,7 +67,8 @@ export default function AlumnosVista() {
setAlumnoEditando(alumno.id);
setNuevoNombre(alumno.nombre);
setNuevoCorreo(alumno.correo);
- setNuevoCurso(alumno.nombreCurso);
+ setNuevoNumero(alumno.telefono);
+ setNuevoCurso(alumno.curso_id);
};
// Cancelar edición
@@ -70,6 +76,7 @@ export default function AlumnosVista() {
setAlumnoEditando(null);
setNuevoNombre("");
setNuevoCorreo("");
+ setNuevoNumero("");
setNuevoCurso("");
};
@@ -80,7 +87,8 @@ export default function AlumnosVista() {
.update({
nombre: nuevoNombre,
correo: nuevoCorreo,
- nombreCurso: nuevoCurso,
+ telefono: nuevoNumero,
+ curso_id: nuevoCurso,
})
.eq("id", id);
@@ -127,6 +135,7 @@ export default function AlumnosVista() {
<th className="py-2 border-b">ID</th>
<th className="py-2 border-b">Nombre</th>
<th className="py-2 border-b">Correo</th>
+ <th className="py-2 border-b">Teléfono</th>
<th className="py-2 border-b">Curso</th>
<th className="py-2 border-b">Acciones</th>
</tr>
@@ -152,6 +161,13 @@ export default function AlumnosVista() {
onChange={(e) => setNuevoCorreo(e.target.value)}
/>
</td>
+ <td className="py-2 px-4 border-b">
+ <Input
+ type="text"
+ value={nuevoNumero}
+ onChange={(e) => setNuevoNumero(e.target.value)}
+ />
+ </td>
<td className="py-2 px-4 border-b">
<Select
value={nuevoCurso}
@@ -162,7 +178,7 @@ export default function AlumnosVista() {
</SelectTrigger>
<SelectContent>
{cursos.map((curso) => (
- <SelectItem key={curso.id} value={curso.nombre}>
+ <SelectItem key={curso.id} value={curso.id.toString()}>
{curso.nombre}
</SelectItem>
))}
@@ -189,7 +205,8 @@ export default function AlumnosVista() {
<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.correo}</td>
- <td className="py-2 px-4 border-b">{alumno.nombreCurso}</td>
+ <td className="py-2 px-4 border-b">{alumno.telefono}</td>
+ <td className="py-2 px-4 border-b">{alumno.curso?.nombre || "Sin curso"}</td>
<td className="py-2 px-4 border-b space-x-2">
<Button
className="bg-blue-500 hover:bg-blue-700 text-white font-bold py-1 px-3 rounded"
diff --git a/diplomas/src/pages/cursosVista.jsx b/diplomas/src/pages/cursosVista.jsx
index cc5e1b2..47db636 100644
--- a/diplomas/src/pages/cursosVista.jsx
+++ b/diplomas/src/pages/cursosVista.jsx
@@ -31,11 +31,30 @@ export default function CursosVista() {
}, []);
const cargarCursos = async () => {
- const { data, error } = await supabaseClient.from("curso").select("*");
+ const { data, error } = await supabaseClient
+ .from("curso")
+ .select(`
+ id,
+ nombre,
+ descripcion,
+ horas,
+ curso_competencia (
+ competencia (
+ id,
+ nombre
+ )
+ )
+ `)
+ .order("id", { ascending: true });
if (error) {
console.error("Error al cargar cursos:", error.message);
} else {
- setCursos(data);
+ // Transformar los datos para que las competencias estén directamente en el objeto curso
+ const cursosConCompetencias = data.map((curso) => ({
+ ...curso,
+ competencias: curso.curso_competencia.map((cc) => cc.competencia),
+ }));
+ setCursos(cursosConCompetencias);
}
};
@@ -62,7 +81,7 @@ export default function CursosVista() {
nombre: nuevoNombre,
descripcion: nuevaDescripcion,
horas: nuevaHoras,
- competencias: competenciasGuardadas,
+ //competencias: competenciasGuardadas,
})
.eq("id", id);
@@ -105,6 +124,7 @@ export default function CursosVista() {
<table className="min-w-full bg-white border">
<thead>
<tr className="bg-gray-100">
+ <th className="py-2 border-b">ID</th>
<th className="py-2 border-b">Nombre</th>
<th className="py-2 border-b">Descripción</th>
<th className="py-2 border-b">Horas</th>
@@ -116,6 +136,7 @@ export default function CursosVista() {
{cursos.map((curso) =>
cursoEditando === curso.id ? (
<tr key={curso.id}>
+ <td className="py-2 px-4 border-b text-center">{curso.id}</td>
<td className="py-2 px-4 border-b">
<Input
value={nuevoNombre}
@@ -166,17 +187,19 @@ export default function CursosVista() {
<td className="py-2 px-4 border-b">{curso.descripcion}</td>
<td className="py-2 px-4 border-b">{curso.horas}</td>
<td className="py-2 px-4 border-b">
- {curso.competencias.join(", ")}
+ {Array.isArray(curso.competencias) && curso.competencias.length > 0
+ ? curso.competencias.map((comp) => comp.nombre).join(", ")
+ : "Sin competencias"}
</td>
- <td className="py-2 border-b flex">
+ <td className="py-2 px-4 border-b space-x-2">
<Button
- className="bg-blue-500 hover:bg-blue-700 text-white font-bold py-1 px-3 rounded m-1"
+ className="bg-blue-500 hover:bg-blue-700 text-white font-bold py-1 px-3 rounded"
onClick={() => iniciarEdicion(curso)}
>
Editar
</Button>
<Button
- className="bg-red-500 hover:bg-red-700 text-white font-bold py-1 px-3 rounded m-1"
+ className="bg-red-500 hover:bg-red-700 text-white font-bold py-1 px-3 rounded"
onClick={() => confirmarEliminacion(curso.id)}
>
Eliminar