From f85c3a35df24d3e966b1616df8773fb8f5b306f8 Mon Sep 17 00:00:00 2001 From: miguel Date: Thu, 19 Jun 2025 18:35:15 -0600 Subject: [PATCH] feat: enhance event forms with date formatting and registration link updates; add utility for local date formatting --- src/components/evento-card.tsx | 10 +- src/containers/create-evento.tsx | 13 ++- src/containers/create-formulario.tsx | 4 +- .../formulario/formulario-registro.tsx | 46 ++++++-- src/containers/pages/formulario-page.tsx | 22 +++- src/data/plantillas.ts | 14 ++- src/utils/date-utils.ts | 102 ++++++++++++++++++ 7 files changed, 184 insertions(+), 27 deletions(-) diff --git a/src/components/evento-card.tsx b/src/components/evento-card.tsx index 90b9e4b..08ad834 100644 --- a/src/components/evento-card.tsx +++ b/src/components/evento-card.tsx @@ -62,13 +62,15 @@ export default function EventoCard({
- {cuestionario.nombre_form} + Regístrate
))} diff --git a/src/containers/create-evento.tsx b/src/containers/create-evento.tsx index a2b4a3f..239d987 100644 --- a/src/containers/create-evento.tsx +++ b/src/containers/create-evento.tsx @@ -3,6 +3,7 @@ import ImageUploader from '@/components/banner-uploader'; import Input from '@/components/input'; import Select from '@/components/select'; import { CreateEventoType } from '@/types/create-evento'; +import { formatDateLocal } from '@/utils/date-utils'; import { commands } from '@uiw/react-md-editor'; import dynamic from 'next/dynamic'; import React from 'react'; @@ -72,9 +73,9 @@ export default function CreateEvento({
handleChange('fecha_inicio', new Date(e.target.value)) } @@ -84,10 +85,12 @@ export default function CreateEvento({
handleChange('fecha_fin', new Date(e.target.value))} + value={formatDateLocal(evento.fecha_fin)} + onChange={(e) => + handleChange('fecha_fin', new Date(e.target.value)) + } />
diff --git a/src/containers/create-formulario.tsx b/src/containers/create-formulario.tsx index 154ad6b..d7ba936 100644 --- a/src/containers/create-formulario.tsx +++ b/src/containers/create-formulario.tsx @@ -159,7 +159,7 @@ export default function FormularioEditor({ formulario, onChange }: Props) {
actualizarCampo('fecha_inicio', e.target.value)} /> @@ -167,7 +167,7 @@ export default function FormularioEditor({ formulario, onChange }: Props) {
actualizarCampo('fecha_fin', e.target.value)} /> diff --git a/src/containers/formulario/formulario-registro.tsx b/src/containers/formulario/formulario-registro.tsx index 272de5e..4eb1d81 100644 --- a/src/containers/formulario/formulario-registro.tsx +++ b/src/containers/formulario/formulario-registro.tsx @@ -11,6 +11,15 @@ import toast from 'react-hot-toast'; import { useRouter } from 'next/navigation'; import { getAxiosError } from '@/utils/errors-utils'; +export type UsuarioDataResponse = { + cuenta: string | null; + nombre: string | null; + apellidos: string | null; + carrera: string | null; + genero: string | null; + rfc?: string | null; // Solo para trabajadores +}; + type UsuarioData = { nombre: string; // alumno o trabajador apellidos: string; // alumno o trabajador @@ -79,7 +88,8 @@ export default function FormularioRegistro({ const puedeBuscar = cuenta && typeof cuenta === 'string' && - ((esCuentaAlumno && cuenta.length === 9) || (esCuentaTrabajador && cuenta.length === 5)); + ((esCuentaAlumno && cuenta.length === 9) || + (esCuentaTrabajador && cuenta.length === 10)); const fetchCuentaInfo = async () => { try { @@ -87,14 +97,20 @@ export default function FormularioRegistro({ ? `/alumnos/${cuenta}` : `/trabajadores/${cuenta}`; - const res = await axiosInstance.get(endpoint); + const res = await axiosInstance.get(endpoint); + console.log('Datos de cuenta obtenidos:', res.data); setCuentaInfo({ - nombre: res.data.nombre, - apellidos: res.data.apellidos, - correo: '', - genero: res.data.genero, - carrera: res.data.carrera ? res.data.carrera : '', + nombre: res.data.nombre ? res.data.nombre : '', + apellidos: res.data.apellidos ? res.data.apellidos : '', + correo: res.data.cuenta + ? `${res.data.cuenta}@pcpuma.acatlan.unam.mx` + : '', + genero: + res.data.genero === 'M' || res.data.genero === 'F' + ? res.data.genero + : 'M', + carrera: res.data.carrera ? res.data.carrera : '', }); // Usar datos fake para pruebas /* setCuentaInfo({ @@ -197,6 +213,7 @@ export default function FormularioRegistro({ }; const handleOnSubmit = async () => { + console.log('Enviando respuestas:', respuestas); setIsSending(true); if (!data?.cuestionario.id_cuestionario) { alert('No se ha cargado correctamente el formulario'); @@ -217,13 +234,22 @@ export default function FormularioRegistro({ respuestas[pregunta.id_pregunta] === null ); + const preguntaCorreo = preguntasObligatorias.find( + (pregunta) => + pregunta.validacion === 'correo' || + pregunta.validacion === 'correo_institucional' + ); + if (faltantes.length > 0) { toast.error('Por favor responde todas las preguntas obligatorias.'); return; } // Buscar un posible correo en las respuestas si no hay cuentaInfo - let correo = cuentaInfo?.correo; + let correo = cuentaInfo?.correo === respuestas[preguntaCorreo?.id_pregunta ?? ''] + ? cuentaInfo?.correo + : respuestas[preguntaCorreo?.id_pregunta ?? '']; + if (!correo) { // Buscar en las respuestas una que parezca correo const correoRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; @@ -245,8 +271,6 @@ export default function FormularioRegistro({ })), }; - console.log('Payload para enviar:', payload); - try { const res = await axiosInstance.post( '/cuestionario-respondido/submit', @@ -473,7 +497,7 @@ export default function FormularioRegistro({ diff --git a/src/containers/pages/formulario-page.tsx b/src/containers/pages/formulario-page.tsx index 9bea240..8ff7d93 100644 --- a/src/containers/pages/formulario-page.tsx +++ b/src/containers/pages/formulario-page.tsx @@ -1,10 +1,11 @@ -'use client' +'use client'; import MarkdownRenderer from '@/components/markdown-render'; import { useGetApi } from '@/hooks/use-get-api'; import Image from 'next/image'; import React from 'react'; import FormularioRegistro from '../formulario/formulario-registro'; import { GetEventoWithCuestionario } from '@/types/evento'; +import { formatFecha } from '@/utils/date-utils'; export default function FormularioPage({ id_evento, @@ -38,6 +39,25 @@ export default function FormularioPage({ {data?.descripcion_evento && ( )} + + {data?.fecha_fin && data?.fecha_inicio && ( + <> +

Horario:

+

+ + {formatFecha(data.fecha_inicio!, { + horas: true, + minutos: true, + })}{' '} + al{' '} + {formatFecha(data.fecha_fin!, { + horas: true, + minutos: true, + })} +

+ + )} + {data && ( n.toString().padStart(2, '0'); + const yyyy = date.getFullYear(); + const MM = pad(date.getMonth() + 1); + const dd = pad(date.getDate()); + const hh = pad(date.getHours()); + const mm = pad(date.getMinutes()); + + return `${yyyy}-${MM}-${dd}T${hh}:${mm}`; +}