cambios

src/app/(admins)/staff/page.tsx

@@ -18,24 +18,32 @@ export default function Page() {
   const [enableScan, setEnableScan] = useState(true);
   const [statusMessage, setStatusMessage] = useState('');
 
-  const handleScan = (rawValue: string) => {
+  const [participante, setParticipante] = useState('');
+
+  const handleScan = async (rawValue: string) => {
     if (!enableScan) return;
 
     try {
       const data = JSON.parse(rawValue);
       if (data.id_participante && data.id_evento) {
-        setScannedData({
-          id_participante: data.id_participante,
-          id_evento: data.id_evento,
-        });
-        setEnableScan(false);
-        setShowModal(true);
+        try {
+          const response = await axiosInstance.get(
+            `/participante-evento/${data.id_participante}/${data.id_evento}`
+          );
+
+          console.log(response.data);
+        } catch (err) {
+          console.warn('Participante no registrado en el evento:', err);
+          setStatusMessage(
+            '❌ El participante no está registrado en este evento.'
+          );
+        }
       } else {
-        setStatusMessage('El QR no contiene los campos requeridos');
+        setStatusMessage('⚠️ El QR no contiene los campos requeridos');
       }
     } catch (err) {
       console.error('QR malformado:', err);
-      setStatusMessage('Error al leer el QR: formato inválido');
+      setStatusMessage('❌ Error al leer el QR: formato inválido');
     }
   };
 

src/components/input.tsx

@@ -53,18 +53,18 @@ export default function Input(props: InputProps) {
           {label}
         </label>
       )}
-      <div className='input-group'>
+      <div className="input-group">
         <input
           id={inputId}
           name={name}
           type={inputType}
-          className={`form-control bg-white ${className?.input || ''}`}
+          className={`form-control ${className?.input || ''}`}
           {...rest}
         />
         {isPassword && (
           <button
-            type='button'
-            className='btn btn-light border'
+            type="button"
+            className="btn btn-light border"
             onClick={togglePasswordVisibility}
             aria-label={
               showPassword ? 'Ocultar contraseña' : 'Mostrar contraseña'

src/containers/formulario.tsx

@@ -9,6 +9,15 @@ import { validarRespuesta } from '@/utils/validador';
 import toast from 'react-hot-toast';
 import axiosInstance from '@/utils/api-config';
 import { useRouter } from 'next/navigation';
+import { getAxiosError } from '@/utils/errors-utils';
+
+interface DatosAlumno {
+  id_ncuenta: number;
+  nombre: string;
+  apellidos: string;
+  carrera: string;
+  genero: 'M' | 'F';
+}
 
 export default function Formulario({
   id_formulario,
@@ -24,6 +33,7 @@ export default function Formulario({
     nombre: string;
     apellidos: string;
     correo: string;
+    genero: 'M' | 'F';
   }>(null);
   const [respuestas, setRespuestas] = useState<Record<string, string>>({});
   const [isSubmitting, setIsSubmitting] = useState(false); // New state for submission
@@ -34,16 +44,71 @@ export default function Formulario({
 
   useEffect(() => {
     if (esDeFES && cuenta.length === 9) {
-      fetch(`/datos/alumnos/${cuenta}`)
-        .then((res) => res.json())
-        .then((data) => setDatosAuto(data))
-        .catch((err) => {
-          console.error('Error al obtener datos del alumno:', err);
+      (async () => {
+        try {
           setDatosAuto(null);
-        });
+          const { data } = await axiosInstance.get<DatosAlumno>(
+            `/alumnos/${cuenta}`
+          );
+          console.log('Datos del alumno:', data);
+          if (data) {
+            setDatosAuto({
+              nombre: data.nombre.toString(),
+              apellidos: data.apellidos.toString(),
+              correo: data.id_ncuenta + '@pcpuma.acatlan.unam.mx',
+              genero: data.genero,
+            });
+          }
+        } catch (err) {
+          const msg = getAxiosError(err);
+          toast.error(msg.message);
+          setDatosAuto(null);
+        }
+      })();
     }
   }, [cuenta, esDeFES]);
 
+  useEffect(() => {
+    if (esDeFES && datosAuto) {
+      const nuevasRespuestas: Record<string, string> = {};
+
+      secciones.forEach((seccion) => {
+        seccion.preguntas.forEach(({ pregunta }) => {
+          const id = pregunta.id_pregunta;
+
+          if (pregunta.validacion === 'nombre') {
+            nuevasRespuestas[`pregunta_${id}`] = pregunta.pregunta
+              .toLowerCase()
+              .includes('apellido')
+              ? datosAuto.apellidos.toString()
+              : datosAuto.nombre.toString();
+          }
+
+          if (pregunta.validacion === 'correo') {
+            nuevasRespuestas[`pregunta_${id}`] = datosAuto.correo;
+          }
+
+          if (pregunta.validacion === 'cuenta_alumno') {
+            nuevasRespuestas[`pregunta_${id}`] = cuenta;
+          }
+
+          if (
+            pregunta.pregunta
+              .toLowerCase()
+              .includes('institución de procedencia')
+          ) {
+            nuevasRespuestas[`pregunta_${id}`] = 'FES Acatlán';
+          }
+        });
+      });
+
+      setRespuestas((prev) => ({
+        ...prev,
+        ...nuevasRespuestas,
+      }));
+    }
+  }, [datosAuto, esDeFES, cuenta, secciones]);
+
   // Encuentra preguntas por texto o validación
   const todasPreguntas = secciones.flatMap((s) =>
     s.preguntas.map((p) => p.pregunta)
@@ -123,6 +188,7 @@ export default function Formulario({
   const validarRespuestasObligatorias = (): boolean => {
     const faltantes: number[] = [];
     const errores: { id: number; mensaje: string }[] = [];
+    console.log(secciones);
     console.log('Validando respuestas:', respuestas);
 
     secciones.forEach((seccion) => {
@@ -132,6 +198,14 @@ export default function Formulario({
         const tipo = pregunta.tipo_pregunta.tipo_pregunta;
         const validacion = pregunta.validacion;
 
+        console.log('Validando pregunta:', pregunta.pregunta);
+        console.table({
+          id,
+          valor,
+          tipo,
+          validacion,
+        });
+
         const respondida =
           (tipo === 'Abierta' &&
             typeof valor === 'string' &&
@@ -183,19 +257,16 @@ export default function Formulario({
             }))}
             selectedValue={respuestaFES ? Number(respuestaFES) : undefined}
             onChange={(opt) => {
-              const idSeleccionado = opt.value;
-              const opcionSeleccionada = preguntaFES.opciones.find(
-                (o) => o.id_opcion === idSeleccionado
-              );
+              const id = opt.value;
+              const value = opt?.label ?? '';
 
-              const valorTexto = opcionSeleccionada?.opcion.opcion ?? '';
-              setEsDeFES(valorTexto === 'Si'); // Se actualiza esDeFES con el texto
+              setEsDeFES(value === 'Si'); // Se actualiza esDeFES con el texto
               setCuenta('');
               setDatosAuto(null);
 
               actualizarRespuesta(
                 `pregunta_${preguntaFES.id_pregunta}`,
-                String(idSeleccionado)
+                String(id)
               );
             }}
           />
@@ -209,6 +280,7 @@ export default function Formulario({
           label={preguntaCuenta.pregunta}
           name={`pregunta_${preguntaCuenta.id_pregunta}`}
           value={cuenta}
+          maxLength={10}
           onChange={(e) => {
             const value = e.target.value;
             setCuenta(value);
@@ -238,34 +310,70 @@ export default function Formulario({
                 defaultValue = datosAuto.correo;
                 disabled = true;
               }
+              if (p.validacion === 'cuenta_alumno') {
+                defaultValue = cuenta;
+                disabled = true;
+              }
+              if (
+                p.pregunta.toLowerCase().includes('institución de procedencia')
+              ) {
+                defaultValue = 'FES Acatlán';
+                disabled = true;
+              }
             }
 
             return (
-              <Input
-                key={p.id_pregunta}
-                label={p.pregunta}
-                name={`pregunta_${p.id_pregunta}`}
-                defaultValue={defaultValue}
-                disabled={disabled}
-                onChange={(e) =>
-                  actualizarRespuesta(
-                    `pregunta_${p.id_pregunta}`,
-                    e.target.value
-                  )
-                }
-              />
+              <React.Fragment key={p.id_pregunta}>
+                <Input
+                  label={p.pregunta}
+                  name={`pregunta_${p.id_pregunta}`}
+                  defaultValue={defaultValue}
+                  disabled={disabled}
+                  onChange={(e) =>
+                    actualizarRespuesta(
+                      `pregunta_${p.id_pregunta}`,
+                      e.target.value
+                    )
+                  }
+                />
+                {p.validacion === 'correo' && (
+                  <div className="alert alert-info">
+                    Este es el correo donde enviaremos la validación de registro{' '}
+                  </div>
+                )}
+              </React.Fragment>
             );
           }
 
           if (p.tipo_pregunta.tipo_pregunta === 'Cerrada') {
-            const opciones: RadioOption<number>[] = p.opciones.map(
-              (op) => ({
-                label: op.opcion.opcion,
-                value: op.id_opcion,
-              })
-            );
+            const opciones: RadioOption<number>[] = p.opciones.map((op) => ({
+              label: op.opcion.opcion,
+              value: op.id_opcion,
+            }));
 
-            const respuestaActual = respuestas[`pregunta_${p.id_pregunta}`];
+            let respuestaActual = respuestas[`pregunta_${p.id_pregunta}`];
+
+            // Si es de FES y hay datos automáticos, intentar preseleccionar género
+            if (
+              esDeFES &&
+              datosAuto &&
+              !respuestaActual &&
+              p.pregunta.toLowerCase().includes('género')
+            ) {
+              const generoTexto =
+                datosAuto.genero === 'M' ? 'Masculino' : 'Femenino';
+              const opcionGenero = p.opciones.find(
+                (op) =>
+                  op.opcion.opcion.toLowerCase() === generoTexto.toLowerCase()
+              );
+              if (opcionGenero) {
+                respuestaActual = String(opcionGenero.id_opcion);
+                actualizarRespuesta(
+                  `pregunta_${p.id_pregunta}`,
+                  String(respuestaActual)
+                );
+              }
+            }
 
             return (
               <div key={p.id_pregunta}>
@@ -275,7 +383,7 @@ export default function Formulario({
                   options={opciones}
                   selectedValue={
                     respuestaActual ? Number(respuestaActual) : undefined
-                  } // ✅ Aquí se fija la opción
+                  }
                   onChange={(opt) =>
                     actualizarRespuesta(
                       `pregunta_${p.id_pregunta}`,

src/data/plantillas.ts

@@ -32,13 +32,6 @@ export const plantillasDisponibles: Plantilla[] = [
               opciones: [{ valor: 'Si' }, { valor: 'No' }],
               obligatoria: true,
             },
-            {
-              titulo: 'Correo electrónico',
-              tipo: 'Abierta',
-              obligatoria: true,
-              limite: 250,
-              validacion: 'correo',
-            },
             {
               titulo: 'Numero de cuenta',
               tipo: 'Abierta',
@@ -46,6 +39,13 @@ export const plantillasDisponibles: Plantilla[] = [
               limite: 250,
               validacion: 'cuenta_alumno',
             },
+            {
+              titulo: 'Correo electrónico',
+              tipo: 'Abierta',
+              obligatoria: true,
+              limite: 250,
+              validacion: 'correo',
+            },
             {
               titulo: 'Nombre(s)',
               tipo: 'Abierta',

src/styles/sass/bootstrap.scss

@@ -120,4 +120,8 @@ ul.list-unstyled li {
 
 .cursor-pointer {
   cursor: pointer;
-}
+}
+
+input {
+  --bs-body-bg: #fff;
+}

src/types/system.d.ts

@@ -0,0 +1,14 @@
+interface User {
+  id_usuario: number;
+  id_tipo_usuario: number;
+  tipo_usuario: string;
+  nombre: string;
+  cuenta?: string;
+  carrera?: string;
+}
+
+interface ErrorState {
+  status: boolean;
+  message: string;
+  code: number;
+}

src/utils/errors-utils.ts

@@ -0,0 +1,38 @@
+import { AxiosError } from 'axios';
+
+export const getAxiosError = (error: unknown): ErrorState => {
+  console.error('AXIOS ERROR', error);
+
+  if (error instanceof AxiosError) {
+    if (error.response?.data?.message) {
+      if (error.response.data.message === 'Internal server error') {
+        return {
+          code: 500,
+          message:
+            'Ocurrió un error inesperado, por favor intenta de nuevo más tarde',
+          status: true,
+        };
+      }
+
+      return {
+        code: error.response.status,
+        message: error.response.data.message,
+        status: true,
+      };
+    }
+
+    if (error.message === 'Network Error') {
+      return {
+        code: 0,
+        message: 'Error de conexión, por favor verifica tu conexión a internet',
+        status: true,
+      };
+    }
+  }
+
+  return {
+    code: 0,
+    message: 'Ocurrió un error inesperado',
+    status: true,
+  };
+};

src/utils/validador.ts

@@ -20,18 +20,18 @@ export class ValidadorCorreo extends Validador {
     if (!valor) {
       return {
         valido: false,
-        mensaje: 'El correo electrónico es requerido'
+        mensaje: 'El correo electrónico es requerido',
       };
     }
 
     // Expresión regular para validar correos
     // Valida el formato básico de correos: usuario@dominio.extensión
     const regex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
-    
+
     if (!regex.test(valor)) {
       return {
         valido: false,
-        mensaje: 'El formato del correo electrónico no es válido'
+        mensaje: 'El formato del correo electrónico no es válido',
       };
     }
 
@@ -39,18 +39,19 @@ export class ValidadorCorreo extends Validador {
     if (this.validarDominioInstitucional) {
       const dominios = ['acatlan.unam.mx', 'unam.mx', 'comunidad.unam.mx'];
       const dominio = valor.split('@')[1];
-      
+
       if (!dominios.includes(dominio)) {
         return {
           valido: false,
-          mensaje: 'Debe ser un correo institucional (@acatlan.unam.mx, @unam.mx, @comunidad.unam.mx)'
+          mensaje:
+            'Debe ser un correo institucional (@acatlan.unam.mx, @unam.mx, @comunidad.unam.mx)',
         };
       }
     }
 
     return {
       valido: true,
-      mensaje: 'Correo electrónico válido'
+      mensaje: 'Correo electrónico válido',
     };
   }
 
@@ -66,32 +67,32 @@ export class ValidadorTelefono extends Validador {
     if (!valor) {
       return {
         valido: false,
-        mensaje: 'El número telefónico es requerido'
+        mensaje: 'El número telefónico es requerido',
       };
     }
 
     // Eliminar espacios, guiones y paréntesis para la validación
     const numeroLimpio = valor.replace(/[\s\-()]/g, '');
-    
+
     // Verificar que solo contenga dígitos
     if (!/^\d+$/.test(numeroLimpio)) {
       return {
         valido: false,
-        mensaje: 'El número telefónico solo debe contener dígitos'
+        mensaje: 'El número telefónico solo debe contener dígitos',
       };
     }
-    
+
     // Verificar longitud (para México, 10 dígitos)
     if (numeroLimpio.length !== 10) {
       return {
         valido: false,
-        mensaje: 'El número telefónico debe tener 10 dígitos'
+        mensaje: 'El número telefónico debe tener 10 dígitos',
       };
     }
 
     return {
       valido: true,
-      mensaje: 'Número telefónico válido'
+      mensaje: 'Número telefónico válido',
     };
   }
 }
@@ -99,10 +100,13 @@ export class ValidadorTelefono extends Validador {
 // Clase para validar nombres
 export class ValidadorNombre extends Validador {
   validar(valor: string): ResultadoValidacion {
+    const regex = new RegExp(
+      '/^[A-Za-zÁÉÍÓÚáéíóúÑñ]+(?: [A-Za-zÁÉÍÓÚáéíóúÑñ]+)*$/'
+    );
     if (!valor) {
       return {
         valido: false,
-        mensaje: 'El nombre es requerido'
+        mensaje: 'El nombre es requerido',
       };
     }
 
@@ -110,21 +114,21 @@ export class ValidadorNombre extends Validador {
     if (valor.trim().length < 2) {
       return {
         valido: false,
-        mensaje: 'El nombre debe tener al menos 2 caracteres'
+        mensaje: 'El nombre debe tener al menos 2 caracteres',
       };
     }
 
     // Verificar que solo contenga letras y espacios
-    if (!/^[a-zA-ZáéíóúÁÉÍÓÚñÑüÜ\\s]+$/.test(valor)) {
+    if (regex.test(valor)) {
       return {
         valido: false,
-        mensaje: 'El nombre solo debe contener letras y espacios'
+        mensaje: 'El nombre solo debe contener letras y espacios',
       };
     }
 
     return {
       valido: true,
-      mensaje: 'Nombre válido'
+      mensaje: 'Nombre válido',
     };
   }
 }
@@ -142,7 +146,7 @@ export class ValidadorEntero extends Validador {
     if (!valor) {
       return {
         valido: false,
-        mensaje: 'El valor numérico es requerido'
+        mensaje: 'El valor numérico es requerido',
       };
     }
 
@@ -150,23 +154,23 @@ export class ValidadorEntero extends Validador {
     if (!/^-?\d+$/.test(valor)) {
       return {
         valido: false,
-        mensaje: 'El valor debe ser un número entero'
+        mensaje: 'El valor debe ser un número entero',
       };
     }
 
     const numero = parseInt(valor, 10);
-    
+
     // Verificar rango
     if (numero < this.min || numero > this.max) {
       return {
         valido: false,
-        mensaje: `El valor debe estar entre ${this.min} y ${this.max}`
+        mensaje: `El valor debe estar entre ${this.min} y ${this.max}`,
       };
     }
 
     return {
       valido: true,
-      mensaje: 'Número entero válido'
+      mensaje: 'Número entero válido',
     };
   }
 }
@@ -185,7 +189,7 @@ export class ValidadorDecimal extends Validador {
     if (!valor) {
       return {
         valido: false,
-        mensaje: 'El valor numérico es requerido'
+        mensaje: 'El valor numérico es requerido',
       };
     }
 
@@ -193,17 +197,17 @@ export class ValidadorDecimal extends Validador {
     if (!/^-?\d+(\.\d+)?$/.test(valor)) {
       return {
         valido: false,
-        mensaje: 'El valor debe ser un número decimal válido'
+        mensaje: 'El valor debe ser un número decimal válido',
       };
     }
 
     const numero = parseFloat(valor);
-    
+
     // Verificar rango
     if (numero < this.min || numero > this.max) {
       return {
         valido: false,
-        mensaje: `El valor debe estar entre ${this.min} y ${this.max}`
+        mensaje: `El valor debe estar entre ${this.min} y ${this.max}`,
       };
     }
 
@@ -212,13 +216,13 @@ export class ValidadorDecimal extends Validador {
     if (partes.length > 1 && partes[1].length > this.decimales) {
       return {
         valido: false,
-        mensaje: `El valor debe tener máximo ${this.decimales} decimales`
+        mensaje: `El valor debe tener máximo ${this.decimales} decimales`,
       };
     }
 
     return {
       valido: true,
-      mensaje: 'Número decimal válido'
+      mensaje: 'Número decimal válido',
     };
   }
 }
@@ -229,7 +233,7 @@ export class ValidadorCuentaAlumno extends Validador {
     if (!valor) {
       return {
         valido: false,
-        mensaje: 'La cuenta de alumno es requerida'
+        mensaje: 'La cuenta de alumno es requerida',
       };
     }
 
@@ -237,13 +241,14 @@ export class ValidadorCuentaAlumno extends Validador {
     if (!/^\d{9}$/.test(valor)) {
       return {
         valido: false,
-        mensaje: 'La cuenta de alumno debe tener exactamente 9 dígitos numéricos'
+        mensaje:
+          'La cuenta de alumno debe tener exactamente 9 dígitos numéricos',
       };
     }
 
     return {
       valido: true,
-      mensaje: 'Cuenta de alumno válida'
+      mensaje: 'Cuenta de alumno válida',
     };
   }
 }
@@ -273,15 +278,18 @@ export class FabricaValidadores {
 }
 
 // Función auxiliar para validar respuestas basada en el tipo de validación
-export function validarRespuesta(respuesta: string, tipoValidacion: string): ResultadoValidacion {
+export function validarRespuesta(
+  respuesta: string,
+  tipoValidacion: string
+): ResultadoValidacion {
   const validador = FabricaValidadores.crear(tipoValidacion);
-  
+
   if (!validador) {
     return {
       valido: true, // Si no hay validador, consideramos válida la respuesta
-      mensaje: 'No se requiere validación específica'
+      mensaje: 'No se requiere validación específica',
     };
   }
-  
+
   return validador.validar(respuesta);
-}
+}