-
+
{competencias.map((comp) => (
))}
-
-
-
);
-}
\ No newline at end of file
+}
+
+export default CrearDiplomaDialog;
diff --git a/diplomas/src/components/dialogs/vistaPreviaDiplomaDialog.jsx b/diplomas/src/components/dialogs/vistaPreviaDiplomaDialog.jsx
new file mode 100644
index 0000000..41ff331
--- /dev/null
+++ b/diplomas/src/components/dialogs/vistaPreviaDiplomaDialog.jsx
@@ -0,0 +1,113 @@
+import React, { useState } from "react";
+import {
+ Dialog,
+ DialogContent,
+ DialogHeader,
+ DialogTitle,
+} from "@/components/ui/dialog";
+import Diploma from "@/components/Diploma";
+import { PDFDownloadLink, PDFViewer } from "@react-pdf/renderer";
+import { Button } from "../ui/button";
+
+function VistaPreviaDiplomaDialog({
+ open,
+ onOpenChange,
+ alumno,
+ competencias,
+ fecha,
+ competenciasAcreditadas,
+}) {
+ const [mostrarVistaPrevia, setMostrarVistaPrevia] = useState(false);
+
+ if (!alumno) return null;
+
+ const competenciasMostradas =
+ Array.isArray(competenciasAcreditadas) && competenciasAcreditadas.length > 0
+ ? competencias.filter((comp) => competenciasAcreditadas.includes(comp.id))
+ : [];
+
+ const competenciasParaPDF =
+ Array.isArray(competenciasMostradas) && competenciasMostradas.length > 0
+ ? competenciasMostradas
+ : [];
+
+ return (
+
+
Diploma
+
+ Alumno: {alumno.nombre}
+
+
+ Curso: {alumno.curso?.nombre || "Sin curso"}
+
+
+
Competencias Acreditadas:
+
+ {competenciasMostradas.map((comp) => (
+ - {comp.descripcion}
+ ))}
+
+
+
+ Fecha: {fecha || new Date().toLocaleDateString()}
+
+
+
+ }
+ fileName={`Diploma_${alumno.nombre}.pdf`}
+ >
+ {({ loading }) =>
+ loading ? (
+
+ ) : (
+
+ )
+ }
+
+
+
+
+ {/* Vista previa del PDF */}
+ {mostrarVistaPrevia && (
+
+
+
+
+
+
+ )}
+
+ );
+}
+
+export default VistaPreviaDiplomaDialog;
diff --git a/diplomas/src/pages/diplomasVista.jsx b/diplomas/src/pages/diplomasVista.jsx
index 7b7a901..6f2cd19 100644
--- a/diplomas/src/pages/diplomasVista.jsx
+++ b/diplomas/src/pages/diplomasVista.jsx
@@ -2,8 +2,9 @@ import React, { useEffect, useState } from "react";
import Layout from "@/components/layout/Layout";
import { supabaseClient } from "@/utils/supabase";
import { Button } from "@/components/ui/button";
-import CrearDiplomaDialog from "./crearDiplomaDialog"; // Importa tu dialog
-import VistaPreviaDiplomaDialog from "./vistaPreviaDiplomaDialog";
+import CrearDiplomaDialog from "@/components/dialogs/crearDiplomaDialog";
+import VistaPreviaDiplomaDialog from "@/components/dialogs/vistaPreviaDiplomaDialog";
+import { Dialog, DialogContent } from "@/components/ui/dialog";
export default function DiplomasVista() {
const [alumnos, setAlumnos] = useState([]);
@@ -32,7 +33,7 @@ export default function DiplomasVista() {
if (!open) {
setAlumnoSeleccionado(null);
setCompetencias([]);
- setCompetenciasAcreditadas([]); // limpiar al cerrar
+ setCompetenciasAcreditadas([]);
setFecha("");
}
};
@@ -59,7 +60,9 @@ export default function DiplomasVista() {
{alumno.nombre} |
{alumno.correo} |
{alumno.telefono} |
-
{alumno.curso?.nombre || "Sin curso"} |
+
+ {alumno.curso?.nombre || "Sin curso"}
+ |
|