Refactor code structure for improved readability and maintainability
This commit is contained in:
@@ -320,14 +320,28 @@ export default function FormularioEditor({
|
||||
<Select
|
||||
label="Tipo de pregunta"
|
||||
value={pregunta.tipo}
|
||||
onChange={(e) =>
|
||||
onChange={(e) => {
|
||||
const nuevoTipo = e.target.value as TipoPregunta;
|
||||
handleUpdatePregunta(
|
||||
seccionIdx,
|
||||
preguntaIdx,
|
||||
'tipo',
|
||||
e.target.value
|
||||
)
|
||||
}
|
||||
nuevoTipo
|
||||
);
|
||||
|
||||
// Si cambia a un tipo cerrado y no tiene opciones, agregar opciones por defecto
|
||||
if (
|
||||
(nuevoTipo === 'Cerrada' || nuevoTipo === 'Multiple') &&
|
||||
(!pregunta.opciones || pregunta.opciones.length === 0)
|
||||
) {
|
||||
handleUpdatePregunta(
|
||||
seccionIdx,
|
||||
preguntaIdx,
|
||||
'opciones',
|
||||
[{ valor: '' }, { valor: '' }]
|
||||
);
|
||||
}
|
||||
}}
|
||||
options={tipoPreguntaOpciones.map((tipo) => ({
|
||||
label: tipo,
|
||||
value: tipo,
|
||||
@@ -384,14 +398,16 @@ export default function FormularioEditor({
|
||||
{(pregunta.tipo === 'Cerrada' ||
|
||||
pregunta.tipo === 'Multiple') && (
|
||||
<div className="mb-2">
|
||||
<label className="form-label">Opciones</label>
|
||||
{(pregunta.opciones || []).map((op, opIdx) => (
|
||||
<SimpleInput
|
||||
key={opIdx}
|
||||
value={op.valor}
|
||||
onChange={(e) => {
|
||||
<div className="d-flex justify-content-between align-items-center mb-2">
|
||||
<label className="form-label mb-0">Opciones</label>
|
||||
<Button
|
||||
variant="success"
|
||||
size="sm"
|
||||
icon="plus"
|
||||
outline
|
||||
onClick={() => {
|
||||
const nuevasOpciones = [...(pregunta.opciones || [])];
|
||||
nuevasOpciones[opIdx].valor = e.target.value;
|
||||
nuevasOpciones.push({ valor: '' });
|
||||
handleUpdatePregunta(
|
||||
seccionIdx,
|
||||
preguntaIdx,
|
||||
@@ -399,9 +415,61 @@ export default function FormularioEditor({
|
||||
nuevasOpciones
|
||||
);
|
||||
}}
|
||||
placeholder={`Opción ${opIdx + 1}`}
|
||||
/>
|
||||
>
|
||||
Agregar opción
|
||||
</Button>
|
||||
</div>
|
||||
{(pregunta.opciones || []).map((op, opIdx) => (
|
||||
<div key={opIdx} className="d-flex align-items-center mb-2">
|
||||
<SimpleInput
|
||||
value={op.valor}
|
||||
onChange={(e) => {
|
||||
const nuevasOpciones = [...(pregunta.opciones || [])];
|
||||
nuevasOpciones[opIdx].valor = e.target.value;
|
||||
handleUpdatePregunta(
|
||||
seccionIdx,
|
||||
preguntaIdx,
|
||||
'opciones',
|
||||
nuevasOpciones
|
||||
);
|
||||
}}
|
||||
placeholder={`Opción ${opIdx + 1}`}
|
||||
className={{
|
||||
container: 'me-2 flex-grow-1 mb-0',
|
||||
input: 'form-control',
|
||||
}}
|
||||
/>
|
||||
<Button
|
||||
variant="danger"
|
||||
size="sm"
|
||||
icon="trash"
|
||||
outline
|
||||
onClick={() => {
|
||||
const nuevasOpciones = [...(pregunta.opciones || [])];
|
||||
nuevasOpciones.splice(opIdx, 1);
|
||||
handleUpdatePregunta(
|
||||
seccionIdx,
|
||||
preguntaIdx,
|
||||
'opciones',
|
||||
nuevasOpciones
|
||||
);
|
||||
}}
|
||||
disabled={pregunta.opciones?.length === 1}
|
||||
title={
|
||||
pregunta.opciones?.length === 1
|
||||
? 'Una pregunta cerrada debe tener al menos una opción'
|
||||
: 'Eliminar opción'
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
))}
|
||||
{(!pregunta.opciones || pregunta.opciones.length === 0) && (
|
||||
<div className="text-muted small">
|
||||
<i className="bi bi-info-circle me-1"></i>
|
||||
Esta pregunta cerrada no tiene opciones. Agrega al menos
|
||||
una opción.
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
@@ -144,7 +144,11 @@ export default function FormularioRegistro({
|
||||
// ------------------------
|
||||
useEffect(() => {
|
||||
if (!cuentaInfo) {
|
||||
if (preguntas) {
|
||||
if (data?.cuestionario.secciones) {
|
||||
const preguntas = data.cuestionario.secciones.flatMap((seccion) =>
|
||||
seccion.preguntas.map((pregunta) => pregunta.pregunta)
|
||||
);
|
||||
|
||||
const idsPrefetch = preguntas
|
||||
.filter((pregunta) =>
|
||||
[
|
||||
@@ -171,7 +175,11 @@ export default function FormularioRegistro({
|
||||
|
||||
const nuevasRespuestas: RespuestaFormulario = {};
|
||||
|
||||
if (preguntas) {
|
||||
if (data?.cuestionario.secciones) {
|
||||
const preguntas = data.cuestionario.secciones.flatMap((seccion) =>
|
||||
seccion.preguntas.map((pregunta) => pregunta.pregunta)
|
||||
);
|
||||
|
||||
for (const pregunta of preguntas) {
|
||||
const id = pregunta.id_pregunta;
|
||||
switch (pregunta.validacion) {
|
||||
@@ -209,7 +217,7 @@ export default function FormularioRegistro({
|
||||
...nuevasRespuestas,
|
||||
}));
|
||||
}
|
||||
}, [cuentaInfo]);
|
||||
}, [cuentaInfo, data?.cuestionario.secciones]);
|
||||
|
||||
// ------------------------
|
||||
// Funciones auxiliares
|
||||
@@ -329,6 +337,7 @@ export default function FormularioRegistro({
|
||||
// Condición para mostrar el formulario
|
||||
// ------------------------
|
||||
const mostrarFormularioRestante =
|
||||
!preguntaComunidad || // Si no hay pregunta de comunidad, mostrar el formulario
|
||||
(isComunidad &&
|
||||
confirmativeOption.some((opt) =>
|
||||
isComunidad.label?.toLowerCase().includes(opt.toLowerCase())
|
||||
@@ -480,11 +489,12 @@ export default function FormularioRegistro({
|
||||
respuestas[`${pregunta.pregunta.id_pregunta}`];
|
||||
|
||||
if (
|
||||
confirmativeOption.includes(isComunidad?.label) &&
|
||||
cuentaInfo &&
|
||||
(!preguntaComunidad ||
|
||||
(confirmativeOption.includes(isComunidad?.label || '') &&
|
||||
cuentaInfo)) &&
|
||||
respuestaActual === undefined // solo si no ha respondido
|
||||
) {
|
||||
if (pregunta.pregunta.validacion === 'genero') {
|
||||
if (pregunta.pregunta.validacion === 'genero' && cuentaInfo) {
|
||||
const generoTexto =
|
||||
cuentaInfo.genero === 'M' ? 'Masculino' : 'Femenino';
|
||||
|
||||
|
||||
Reference in New Issue
Block a user