From 10506d97cece6715ee97ef425e6afa7cef5f6cf8 Mon Sep 17 00:00:00 2001 From: Santiago Montoya Date: Wed, 18 Dec 2024 12:54:03 -0500 Subject: [PATCH] styles: frontend admin view adjustments --- src/front/js/component/leftMenuAdmin.js | 403 +++++++++++++----------- src/front/js/store/flux.js | 5 + src/front/styles/components.css | 4 + 3 files changed, 233 insertions(+), 179 deletions(-) diff --git a/src/front/js/component/leftMenuAdmin.js b/src/front/js/component/leftMenuAdmin.js index 2183b47dd2..920f693d87 100644 --- a/src/front/js/component/leftMenuAdmin.js +++ b/src/front/js/component/leftMenuAdmin.js @@ -26,7 +26,8 @@ const FormCommon = ({ type }) => { description: '', classroomName: '', subjectName: '', - subjectDescription: '' + subjectDescription: '', + representante_id: '' }); useEffect(() => { @@ -34,6 +35,7 @@ const FormCommon = ({ type }) => { if (type === 'student') { actions.getCourses(); + actions.setAllUsers(); } if (type === 'updateStudents') { actions.setStudents(); @@ -81,9 +83,9 @@ const FormCommon = ({ type }) => { await actions.studentsOperations('POST', { "nombre": formBody.name, "apellido": formBody.lastName, - "direccion": formBody.address, - "fecha_nacimiento": formBody.date, - "grado_id": formBody.grado_id + "fecha_nacimiento": new Date(formBody.date), + "grado_id": formBody.grado_id, + "representante_id": formBody.representante_id }) } if (type === 'teacher') { @@ -174,182 +176,221 @@ const FormCommon = ({ type }) => {

{`Registrar ${type === 'student' ? 'estudiante nuevo' : type === 'teacher' ? 'profesor nuevo' : type === 'updateStudents' ? 'actualización de estudiantes' : type === 'updateTeachers' ? 'actualización de profesores' : type === 'addClassroom' ? 'grado nuevo' : type === 'addSubject' ? 'materia nueva' : type === 'assignSubject' ? 'asignación de materia' : type === 'authorizeUser' ? 'autorización de usuario' : ''}`}

{/* Formulario con elementos comunes para crear profesor y estudiante */} - {(type === 'student' || type === 'teacher') &&
- - -
} - {(type === 'student' || type === 'teacher') &&
- - -
} - {(type === 'student' || type === 'teacher') &&
- - -
} - {type === 'student' &&
-
-

- -
-
- - + {(type === 'student' || type === 'teacher') && +
+
+ + +
+
+ + +
+
} + + + {type === 'student' &&
+
+
+

+ +
+
+ + +
+
+ + +
-
} - {(type === 'student' || type === 'teacher') &&
- - -
} +
} {/* Elementos específicos del formuario para crear profesor */} - {type === 'teacher' && ( -
- - -
- )} - {type === 'teacher' && ( -
- - + { + type === 'teacher' && ( +
+ + +
+ ) + } + { + type === 'teacher' && ( +
+ + +
+ ) + } + + { + (type === 'teacher' || type === 'teacher') &&
+ +
- )} - {type === 'teacher' && ( -
- - + } + + { + (type === 'teacher' || type === 'teacher') &&
+ +
- )} + } + + { + type === 'teacher' && ( +
+ + +
+ ) + } {/* Vista para editar estudiantes */} - {type === 'updateStudents' && ( -
- - - - - - - - - - - - {store.estudiantes.map(student => ( - - - - - - + + ))} + +
NombreApellidoGradoFecha de nacimientoEditar/Eliminar
{student.nombre}{student.apellido}{student.grado.nombre}{student.fecha_nacimiento} - + { + type === 'updateStudents' && ( +
+ + + + + + + + + + + + {store.estudiantes.map(student => ( + + + + + + - - ))} - -
NombreApellidoGradoFecha de nacimientoEditar/Eliminar
{student.nombre}{student.apellido}{student.grado.nombre}{student.fecha_nacimiento} + + + - - -
-
- )} +
+
+ ) + } {/* Vista para editar profesores */} - {type === 'updateTeachers' && ( -
- - - - - - - - - - - - - - {store.profesores.map(profesor => ( - - - - - - - - + + ))} + +
NombreApellidoEmailTeléfonoDirecciónDescripciónEditar/Eliminar
{profesor.nombre}{profesor.apellido}{profesor.email}{profesor.telefono}{profesor.direccion}{profesor.descripcion} - + { + type === 'updateTeachers' && ( +
+ + + + + + + + + + + + + + {store.profesores.map(profesor => ( + + + + + + + + - - ))} - -
NombreApellidoEmailTeléfonoDirecciónDescripciónEditar/Eliminar
{profesor.nombre}{profesor.apellido}{profesor.email}{profesor.telefono}{profesor.direccion}{profesor.descripcion} + + + - - -
-
- )} +
+
+ ) + } {/* Formulario para añadir grados */} - {type === "addClassroom" && ( -
- - handleChange(e)} /> -
- )} + { + type === "addClassroom" && ( +
+ + handleChange(e)} /> +
+ ) + } {/* Formulario para añadir materias */} - {type === "addSubject" && ( + { + type === "addSubject" && ( - < div className="mb-3"> - -
- + + {store.grados.map(grado => + - )} - + )} + +
-
- ) + ) } { @@ -367,44 +408,48 @@ const FormCommon = ({ type }) => { {/* Formulario para asignar materias a profesores */} - {type === "assignSubject" && ( -
-
- -
- + { + type === "assignSubject" && ( +
+
+ +
+ +
-
-
- -
- +
+ +
+ +
-
- )} + ) + } {/* Formulario para autorizar usuarios */} - {type === "authorizeUser" && ( -
-
- - + { + type === "authorizeUser" && ( +
+
+ + +
-
- )} + ) + }
diff --git a/src/front/js/store/flux.js b/src/front/js/store/flux.js index 0f911fbde2..555ec97f02 100755 --- a/src/front/js/store/flux.js +++ b/src/front/js/store/flux.js @@ -128,6 +128,11 @@ const getState = ({ getStore, getActions, setStore }) => { }, userOperations: async (method, body = '', id = '') => { return getActions().crudOperation('user/auth', method, { id, body, bluePrint: 'admin' }) + }, allUsersOperations: async (method, body = '', id = '') => { + return getActions().crudOperation('users', method, { id, body, bluePrint: 'admin' }) + }, setAllUsers: async () => { + const response = await getActions().allUsersOperations('GET') + setStore({ usuarios: response }) }, setUsers: async () => { const response = await getActions().userOperations('GET') setStore({ usuarios: response }) diff --git a/src/front/styles/components.css b/src/front/styles/components.css index 87b353a2b3..d781c118fd 100644 --- a/src/front/styles/components.css +++ b/src/front/styles/components.css @@ -433,4 +433,8 @@ width: 100%; height: auto; padding: 2rem; +} + +.react-datepicker-wrapper { + width: 100% !important; } \ No newline at end of file