Creación de todos los HTMLs + Controlador y modelo de empleado funcional

 

Fecha: Lunes 15 de junio de 2026

Hora de inicio: 9:00 a.m.

Hora de finalización: 5:00 p.m.

Tiempo de descanso: 1 hora

Total de horas trabajadas: 7 horas

Objetivo de la sesión

El objetivo de esta sesión fue avanzar con la capa lógica y visual del sistema, principalmente en el módulo de empleados y en las consultas de planilla.

Durante el día trabajé en varios archivos HTML, en el modelo de empleados y en su controlador. La intención era dejar conectadas las vistas con los procedimientos almacenados que ya se habían desarrollado y preparar la navegación correspondiente para administradores y empleados.

Aunque se modificaron bastantes archivos, muchos seguían una estructura similar, por lo que en esta entrada voy a resumir únicamente los aspectos principales.

 

Actividades realizadas

9:00 a.m. - 1:00 p.m.

Creación y organización de las vistas HTML

Durante la mañana trabajé principalmente en las vistas de la aplicación.

Primero preparé base.html, que funciona como plantilla general para las demás páginas. En ella agregué la barra de navegación, los enlaces que se muestran dependiendo del tipo de usuario, los mensajes flash y la opción de regresar a la interfaz de administrador cuando se está impersonando a un empleado.

A partir de esta plantilla desarrollé o completé las vistas relacionadas con empleados:

  • Lista de empleados.
  • Inserción de empleados.
  • Edición de empleados.
  • Confirmación de eliminación.
  • Portal del empleado.
  • Inicio de sesión.

También trabajé en las vistas de planilla semanal y mensual, junto con sus respectivas páginas de detalle de movimientos y deducciones.

Para mostrar la información utilicé Jinja2, especialmente ciclos para recorrer los resultados enviados por Flask y condiciones para mostrar mensajes cuando no existen registros. En la lista de empleados agregué un filtro que puede utilizarse por nombre o cédula. También agregué la selección de una fila mediante JavaScript, para habilitar los botones de editar, eliminar e impersonar al empleado seleccionado.

2:00 p.m. - 4:15 p.m.

Desarrollo del controlador de empleados

Durante la tarde trabajé en controlador_empleado.py, encargado de conectar las solicitudes realizadas desde las páginas HTML con las funciones del modelo.

Se implementaron las rutas necesarias para:

  • Listar empleados.
  • Filtrar empleados por nombre o cédula.
  • Insertar un empleado.
  • Editar un empleado.
  • Eliminar un empleado.

En cada ruta se obtiene la información enviada desde los formularios y se llama a la función correspondiente del modelo.

También se manejan los códigos de resultado retornados por los procedimientos almacenados. Dependiendo del código, el controlador muestra mensajes de éxito o mensajes específicos, por ejemplo cuando ya existe un empleado con la misma cédula o con el mismo nombre.

Para estos mensajes utilicé flash, de manera que pudieran mostrarse desde la plantilla general después de una redirección.

Img. 2: Rutas principales del controlador para listar, insertar, editar y eliminar empleados.

 

4:15 p.m. - 5:00 p.m.

Implementación del modelo y pruebas generales

Finalmente trabajé en modelo_empleado.py.

Este archivo contiene las funciones que se conectan con la base de datos y ejecutan los procedimientos almacenados relacionados con empleados.

Se agregaron funciones para:

  • Insertar empleados.
  • Editar empleados.
  • Eliminar empleados.
  • Listar empleados.
  • Obtener un empleado específico.
  • Listar los puestos disponibles.

Las llamadas se realizaron utilizando parámetros, enviando a cada procedimiento los datos recibidos desde el controlador.

En los procedimientos de inserción, edición y eliminación fue necesario recorrer los resultados mediante nextset(), debido a que los procedimientos pueden retornar varios conjuntos de resultados antes de llegar al resultCode.

Para las consultas, los registros retornados se convierten en diccionarios, lo cual facilita acceder a los datos desde las vistas HTML utilizando el nombre de cada columna.

Img. 3: Funciones del modelo que ejecutan los procedimientos almacenados y procesan sus resultados.

Al final realicé pruebas generales de navegación y comprobé la conexión entre las tres capas:

  1. La vista envía la información mediante el formulario.
  2. El controlador recibe los datos y llama al modelo.
  3. El modelo ejecuta el procedimiento almacenado.
  4. El resultado regresa al controlador.
  5. La vista muestra los datos o el mensaje correspondiente.

 

Resultado de la sesión

Durante esta sesión se avanzó considerablemente en la integración del sistema.

Se desarrollaron varias vistas para los módulos de empleados y planillas, se creó la plantilla general de navegación y se conectó el CRUD de empleados con sus procedimientos almacenados mediante el modelo y el controlador. La mayor parte del tiempo se dedicó a asegurar que los nombres utilizados en los formularios, las rutas del controlador, los parámetros del modelo y los resultados de los procedimientos coincidieran correctamente.

Al finalizar quedó implementada la estructura principal del módulo de empleados y una base visual para las consultas de planilla semanal y mensual.


Referencias

  • Documentación y código de la Tarea 1
  • Documentación y código de la Tarea 2 

 

Comentarios

Entradas más populares de este blog

Creación del repositorio y estructura básica del proyecto