The administrator role in ESEN has full control over the system. After logging in, the admin can create, edit, disable, and delete extracurricular activities; browse the complete student roster; and generate and export reports. This guide walks through every section of the admin interface in the order you will encounter them.Documentation Index
Fetch the complete documentation index at: https://mintlify.com/rtajio/ESEN/llms.txt
Use this file to discover all available pages before exploring further.
Logging in
Open the application
Load the ESEN app in your browser. The login screen shows the ESEN logo and two role tabs: Administrador and Estudiante.
Select the Administrator tab
Click the Administrador tab in the login card. The Usuario field will auto-fill with
admin01 and Contraseña with admin123 (demo credentials shown in the hint at the bottom of the card).Demo credentials are
admin01 / admin123. These are hardcoded in the demo data array and are not connected to any external authentication service.Panel de control (Dashboard)
The dashboard is the first view after login. It gives a real-time snapshot of activity data.Stat cards
Four cards appear in a responsive grid at the top of the page:| Card | ID | What it counts |
|---|---|---|
| Total actividades | stat-total | Active activities only (activo: true) |
| Participantes | stat-est | Unique participant names across all activities |
| Horas acumuladas | stat-hrs | Sum of horas × participantes.length for active activities |
| Resoluciones | stat-res | Distinct resolution numbers (res field) across all activities |
Recent activities table
Below the cards, a card titled Actividades recientes shows up to the six most recently added activities. Columns are: Actividad, Categoría, Fecha, Horas, and Estado (Active/Inactive badge). A Ver todas button in the card header navigates directly to the Activities view.Actividades (Activities view)
Click Actividades in the left sidebar to open the full activities management table.Activity table columns
| Column | Description |
|---|---|
| Actividad | Activity name in bold, with a truncated description beneath in grey |
| Categoría | Colour-coded badge (see category reference below) |
| Resolución | Resolution number, e.g. RES-2024-001 |
| Fecha | Date formatted as DD/MM/YYYY |
| Horas | Hour count in bold, e.g. 8h |
| Participantes | Count of names in the participants array |
| Acciones | Edit, Toggle, and Delete action buttons |
Filter bar
The filter row sits above the table and contains three controls:- Todas las categorías — a dropdown to filter by a single category (Académico, Deportivo, Cultural, Voluntariado, Liderazgo). Selecting a value immediately re-renders the table.
- Month picker — a
<input type="month">that filters rows wherefechastarts with the selectedYYYY-MMvalue. - Limpiar button — resets both filters and reloads all activities.
Both filters apply simultaneously. Selecting Académico and a month returns only academic activities in that month.
Action buttons
Each row in the Acciones column has three icon buttons:- Edit (pencil icon) — opens the activity modal pre-filled with that row’s data.
- Toggle (eye / eye-off icon) — enables or disables the activity. The icon changes to eye-off when active, and back to eye when inactive. A toast notification confirms the change.
- Delete (trash icon, red) — prompts a confirmation dialog before permanently removing the record.
Registering a new activity
Open the form
Click the green Registrar actividad button in the top-right of the Activities card. The modal titled Registrar actividad opens.
Fill in required fields
Complete the four required fields marked with an asterisk:
- Nombre de la actividad * — free text, e.g. Taller de liderazgo estudiantil
- Categoría * — dropdown: Académico, Deportivo, Cultural, Voluntariado, or Liderazgo
- Horas * — positive integer
- N° de resolución * — resolution number, e.g.
RES-2024-045 - Fecha * — date picker
Fill in optional fields
- Descripción — free-text textarea (3 rows, resizable)
- Participantes (separados por coma) — comma-separated participant names, e.g.
Carlos Mamani, Lucía Torres
Editing an activity
Click the edit icon
In the Acciones column for the target row, click the pencil icon button. The modal opens with the title Modificar actividad and all fields pre-filled with the activity’s current data.
Update fields
Edit any combination of fields. All the same required/optional rules apply as when creating.
Disabling and enabling an activity
Click the eye icon button in the Acciones column for any active activity. Theactivo flag is toggled immediately:
- Active → Inactive: the icon changes to eye-off and the status badge in the dashboard recent-activities table changes from a green Activo badge to a grey Inactivo badge.
- Inactive → Active: the icon reverts to eye and the badge returns to Activo.
Inactive activities are excluded from the Total actividades and Horas acumuladas stat cards on the dashboard, and are hidden from the student-facing activities list.
Deleting an activity
Click the red trash icon button in the Acciones column. A browser confirmation dialog reads:¿Eliminar esta actividad? Esta acción no se puede deshacer.Click OK to confirm. The activity is permanently removed from the in-memory data array, the table refreshes, and a toast reads “Actividad eliminada”. Clicking Cancelar aborts with no changes.
Estudiantes (Students view)
Click Estudiantes in the sidebar to open the student roster.Students table
The table header is Relación de estudiantes and shows five columns:| Column | Description |
|---|---|
| Estudiante | Avatar circle (initials from first two words of name, green background) + full name + DNI in small grey text below |
| Código | Student code, e.g. 2021-0452 |
| Escuela | School/faculty name, e.g. Ingeniería de Sistemas |
| Actividades | Count of activities in which the student’s name appears in the participantes array |
| Horas totales | Green pill showing the sum of horas for all activities containing the student’s name |
Search bar
A search input at the top of the card filters the table in real time as you type. It matches against both the student’s name and code (case-insensitive). Clearing the input restores all students.Reportes (Reports view)
Click Reportes in the sidebar to open the reports view.Hours by category chart
The top-left card Horas por categoría shows a horizontal bar chart. Each of the five categories has a labelled bar whose width is proportional to the total hours across all activities in that category. The exact hour count appears to the right of each bar.General summary
The top-right card Resumen general lists six key statistics in a row-based layout:- Total actividades
- Actividades activas
- Horas totales
- Total participaciones
- Promedio horas / actividad
- Estudiantes registrados
Activity detail table
A full-width card Detalle de actividades shows all activities with columns: Actividad, Categoría, Horas, Participantes, Resolución, and Fecha.Exporting to CSV
Click the Exportar CSV button in the detail table card header. The browser downloads a UTF-8 BOM CSV file namedreporte-actividades-esen.csv with columns: Actividad, Categoría, Horas, Participantes, Resolución, Fecha, Estado. A toast confirms “Reporte exportado correctamente”.