From 8007d2f4093ffe03c19cba5b2ed001e2206084e0 Mon Sep 17 00:00:00 2001 From: jalvarado Date: Fri, 23 May 2025 09:57:19 -0600 Subject: [PATCH 01/11] Refactor AdminFormPage and Formulario components to remove unused state and improve form handling; update plantilla data structure to include new fields. --- .../administrador/crear-formulario/page.tsx | 147 +++++++----------- src/containers/formulario.tsx | 25 ++- src/data/plantillas.ts | 16 +- src/types/crear-formulario.d.ts | 1 - 4 files changed, 81 insertions(+), 108 deletions(-) diff --git a/src/app/(admins)/administrador/crear-formulario/page.tsx b/src/app/(admins)/administrador/crear-formulario/page.tsx index ef6b8e8..f1a2dcc 100644 --- a/src/app/(admins)/administrador/crear-formulario/page.tsx +++ b/src/app/(admins)/administrador/crear-formulario/page.tsx @@ -14,14 +14,14 @@ import { SeccionFormulario, } from '@/types/crear-formulario'; import toast from 'react-hot-toast'; +import { useRouter } from 'next/navigation'; export default function AdminFormPage() { + const router = useRouter(); const [nombreFormulario, setNombreFormulario] = useState(''); const [descripcion, setDescripcion] = useState(''); const [secciones, setSecciones] = useState([]); const [paginaActual, setPaginaActual] = useState(1); - const [bannerPreview, setBannerPreview] = useState(null); - const [tipoCuestionario, setTipoCuestionario] = useState(null); const [fechaInicio, setFechaInicio] = useState(null); const [fechaFin, setFechaFin] = useState(null); const [loading, setLoading] = useState(false); @@ -154,7 +154,7 @@ export default function AdminFormPage() { }; const guardarFormulario = async () => { - if (!fechaInicio || !fechaFin || !tipoCuestionario) { + if (!fechaInicio || !fechaFin || !nombreFormulario) { alert('Todos los campos obligatorios deben estar llenos'); return; } @@ -169,22 +169,26 @@ export default function AdminFormPage() { descripcion, fecha_inicio: formatearFecha(fechaInicio, 'inicio'), fecha_fin: formatearFecha(fechaFin, 'fin'), - id_tipo_cuestionario: tipoCuestionario, evento: nombreFormulario, // temporalmente igual al nombre del form secciones, }; - console.log('Formulario a guardar:', formData); - setLoading(true); await toast - .promise(axiosInstance.post('/cuestionario', formData), { - loading: 'Guardando formulario...', - success: 'Formulario guardado exitosamente!', - error: 'Error al guardar el formulario.', - }) + .promise( + axiosInstance.post('/cuestionario', { + ...formData, + id_tipo_cuestionario: 1, + }), + { + loading: 'Guardando formulario...', + success: 'Formulario guardado exitosamente!', + error: 'Error al guardar el formulario.', + } + ) .then((res) => { console.log('Formulario guardado:', res.data); + router.push(`/administrador/formulario/${res.data.id_cuestionario}`); }) .catch((error) => { console.error('Error al guardar el formulario:', error); @@ -194,17 +198,6 @@ export default function AdminFormPage() { }); }; - const handleBannerChange = (e: React.ChangeEvent) => { - const file = e.target.files?.[0] || null; - if (file) { - const reader = new FileReader(); - reader.onload = () => setBannerPreview(reader.result as string); - reader.readAsDataURL(file); - } else { - setBannerPreview(null); - } - }; - const seccionActual = secciones[paginaActual - 1]; return ( @@ -224,14 +217,12 @@ export default function AdminFormPage() { descripcion, fecha_inicio, fecha_fin, - id_tipo_cuestionario, secciones, } = plantilla.datos; setNombreFormulario(nombre_form); setDescripcion(descripcion); setFechaInicio(fecha_inicio.slice(0, 10)); setFechaFin(fecha_fin.slice(0, 10)); - setTipoCuestionario(id_tipo_cuestionario); setSecciones( secciones.map((seccion) => ({ ...seccion, @@ -259,82 +250,52 @@ export default function AdminFormPage() { ))} -
- - + setNombreFormulario(e.target.value)} + placeholder="Ingrese el nombre del formulario" /> - {bannerPreview && ( -
- Ejemplo de banner + +