diff --git a/cosiap_frontend/src/components/common/utility/RenderElemento.jsx b/cosiap_frontend/src/components/common/utility/RenderElemento.jsx
index e6b4abeae40cf6e2c054f50c5211c76b9094851a..6e9c491f2d2d6a9524f8ea5f59e716baaa792bb6 100644
--- a/cosiap_frontend/src/components/common/utility/RenderElemento.jsx
+++ b/cosiap_frontend/src/components/common/utility/RenderElemento.jsx
@@ -2,7 +2,7 @@ import '@/components/modalidades/Modalidad.css'
import api from "@/api";
export const renderElemento = (seccionId, elemento, handleInputChange, handleCheckboxChange) => {
- const { tipo, opciones, id, nombre, formato } = elemento;
+ const { tipo, opciones, id, nombre, formato, obligatorio } = elemento;
const handleChange = (e) => {
const valor = e.target.value;
@@ -12,96 +12,92 @@ export const renderElemento = (seccionId, elemento, handleInputChange, handleChe
const handleDownload = async (elemento, formato) => {
try {
- // Realiza la petición al backend para obtener el archivo
const response = await api.formatos.getById(formato, {
- responseType: 'blob', // Esto asegura que obtengas los datos como un archivo binario
+ responseType: 'blob',
});
- // Verifica si el tipo de contenido es correcto
const contentType = response.headers['content-type'];
- console.log('Content Type:', contentType); // Para depuración
+ console.log('Content Type:', contentType);
if (contentType !== 'application/vnd.openxmlformats-officedocument.wordprocessingml.document') {
throw new Error('Tipo de archivo inesperado');
}
- // Crea un Blob a partir de los datos recibidos
const blob = new Blob([response.data], { type: contentType });
-
- // Crea un URL para el archivo descargado
const url = window.URL.createObjectURL(blob);
- // Crea un enlace temporal
const link = document.createElement('a');
link.href = url;
- link.setAttribute('download', `${elemento.nombre}_formato.docx`); // Cambia a .docx
+ link.setAttribute('download', `${elemento.nombre}_formato.docx`);
- // Añadir el enlace al cuerpo del documento para que sea visible en el navegador
document.body.appendChild(link);
-
- // En lugar de hacer clic en el enlace, solo configuramos el enlace
link.dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true, view: window }));
-
- // Dejar el enlace en el DOM para que sea visible
- // document.body.removeChild(link); // No eliminar el enlace si deseas que la descarga sea visible
-
- // Revoca el URL del blob para liberar memoria
window.URL.revokeObjectURL(url);
} catch (error) {
console.error('Error al descargar el formato:', error);
}
};
+ const renderInput = (inputElement, obligatorio) => (
+ <>
+ {inputElement}
+ {obligatorio && *obligatorio}
+ >
+ );
switch (tipo) {
case "texto_corto":
- return (
+ return renderInput(
+ />,
+ obligatorio
);
case "texto_parrafo":
- return (
+ return renderInput(
+ />,
+ obligatorio
);
case "numerico":
- return (
+ return renderInput(
+ />,
+ obligatorio
);
case "opcion_multiple":
case "desplegable":
- return (
- ,
+ obligatorio
);
case "casillas":
- return (
+ return renderInput(
{Object.keys(opciones).map((opcionId) => (
))}
-
+ ,
+ obligatorio
);
- case "documento":
- return (
+ case "documento":
+ return renderInput(
handleInputChange(seccionId, id, e.target.files[0])}
/>
- {formato && (
+ {formato && (
)}
-
+ ,
+ obligatorio
);
case "fecha":
- return (
+ return renderInput(
+ />,
+ obligatorio
);
case "hora":
- return (
+ return renderInput(
+ />,
+ obligatorio
);
case "separador":
- return (
-
- );
+ return
;
default:
return null;
}
diff --git a/cosiap_frontend/src/components/modalidades/CrearModalidad.css b/cosiap_frontend/src/components/modalidades/CrearModalidad.css
index 4d82bf35efd6896ae3057cb67018eaac57d1c744..f6215d75a878ad342983a86c496b34d441816ac5 100644
--- a/cosiap_frontend/src/components/modalidades/CrearModalidad.css
+++ b/cosiap_frontend/src/components/modalidades/CrearModalidad.css
@@ -258,7 +258,7 @@ input[type="checkbox"] {
padding: 8px; /* Ajusta el padding para que sea igual en todos los elementos */
height: auto; /* Permite que los elementos ajusten su altura automáticamente */
font-size: 15px; /* Asegura que todos tengan el mismo tamaño de fuente */
- font-style:oblique;
+ font-style:normal;
}
.form-row input {
diff --git a/cosiap_frontend/src/components/modalidades/CrearModalidad.jsx b/cosiap_frontend/src/components/modalidades/CrearModalidad.jsx
index e07f781b94515fc87b8468033f199036b5c25f00..47bcaa8077df8b2ed5188156121cd3dd3b1ac480 100644
--- a/cosiap_frontend/src/components/modalidades/CrearModalidad.jsx
+++ b/cosiap_frontend/src/components/modalidades/CrearModalidad.jsx
@@ -149,7 +149,7 @@ const CreateModalidad = () => {
// 4. Creamos los elementos y los asociamos a las secciones
for (const [sectionIndex, section] of sections.entries()){
const elementPromises = section.elements.map(element =>
- api.dynamicForms.elementos.post({nombre: element.name, tipo: element.type, formato: element.formato})
+ api.dynamicForms.elementos.post({nombre: element.name, tipo: element.type, obligatorio:element.obligatorio, formato: element.formato})
);
const elementosResponses = await Promise.all(elementPromises);
const elementIds = elementosResponses.map(res => res.data.data.id);
@@ -377,7 +377,7 @@ const CreateModalidad = () => {
-
+
{element.type === 'documento' && (
@@ -394,6 +394,15 @@ const CreateModalidad = () => {
)}
+
+
+ updateElement(sectionIndex, elementIndex, 'obligatorio', e.target.checked)}
+ />
+
{['opcion_multiple', 'desplegable', 'casillas'].includes(element.type) && (
<>
Opciones:
diff --git a/cosiap_frontend/src/components/modalidades/EditarModalidad.jsx b/cosiap_frontend/src/components/modalidades/EditarModalidad.jsx
index ecc95981f038b6e541aa345eecb4a0962a644951..c4564738ffb916513868cedb8dc302e96f50c264 100644
--- a/cosiap_frontend/src/components/modalidades/EditarModalidad.jsx
+++ b/cosiap_frontend/src/components/modalidades/EditarModalidad.jsx
@@ -27,6 +27,7 @@ const EditModalidad = () => {
const [selectedSectionId, setSelectedSectionId] = useState(null);
const [isAddingElement, setIsAddingElement] = useState(false);
const [newOptionName, setNewOptionName] = useState('');
+ const [newElemetObligatorio, setNewElementObligatorio] = useState(false);
const [selectedElementId, setSelectedElementId] = useState(null);
const [isAddingOption, setIsAddingOption] = useState(false);
// hooks para el manejo de las alertas
@@ -414,6 +415,7 @@ const EditModalidad = () => {
return api.dynamicForms.elementos.update(element.id, {
nombre: element.nombre,
tipo: element.tipo,
+ obligatorio:element.obligatorio,
formato: element.formato
});
});
@@ -566,6 +568,7 @@ const EditModalidad = () => {
{/* Input para agregar nueva sección */}
{isAddingSection && (
+
{
Sección {sectionIndex + 1}
+
{
{isAddingElement && selectedSectionId === section.id && (
+
setNewElementName(e.target.value)}
placeholder="Nombre del nuevo elemento"
/>
- Tipo:
+
setNewElementType(e.target.value)}
@@ -643,6 +648,15 @@ const EditModalidad = () => {
+
+
+ setNewElementObligatorio(e.target.checked)}
+ />
+
{newElementType === 'documento' && (
@@ -674,6 +688,7 @@ const EditModalidad = () => {
Elemento {elementIndex + 1}
+
+
updateElement(section.id, element.id, 'tipo', e.target.value)}
@@ -727,8 +743,18 @@ const EditModalidad = () => {
+
+
+ updateElement(section.id, element.id, 'obligatorio', e.target.checked)}
+ />
+
{isAddingOption && selectedElementId === element.id && (
+
{
Opción {optionIndex +1}