Update all project documentation to reflect current state
Rewrite README.md, DOCUMENTATION.md, ESTADO_ACTUAL.md and CAMBIOS_SESION.md to accurately document the full-stack architecture, all modules, API endpoints, JWT auth, database schema, and features added in February 2026. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
598
README.md
598
README.md
@@ -1,23 +1,55 @@
|
||||
# Water Project - Sistema de Gestion de Recursos Hidricos (GRH)
|
||||
# GRH - Sistema de Gestion de Recursos Hidricos
|
||||
|
||||
Sistema de gestion y monitoreo de infraestructura hidrica desarrollado con React, TypeScript y Vite.
|
||||
Sistema full-stack de gestion y monitoreo de infraestructura hidrica. Permite administrar medidores de agua, concentradores, proyectos, consumo, lecturas y conectarse con sistemas IoT (LoRaWAN / The Things Stack).
|
||||
|
||||
---
|
||||
|
||||
## Descripcion General
|
||||
|
||||
El **Sistema de Gestion de Recursos Hidricos (GRH)** es una aplicacion web frontend disenada para el monitoreo, administracion y control de infraestructura de toma de agua. Permite gestionar medidores, concentradores, proyectos, usuarios y roles a traves de una interfaz moderna y responsiva.
|
||||
El **Sistema GRH** es una aplicacion web completa para organismos operadores de agua (CESPT Tijuana, Tecate, Mexicali, etc.) que incluye:
|
||||
|
||||
### Caracteristicas Principales
|
||||
|
||||
- **Dashboard interactivo** con KPIs, alertas e historial de actividades
|
||||
- **Gestion de Medidores (Tomas de Agua)** - CRUD completo con filtros por proyecto
|
||||
- **Dashboard interactivo** con KPIs, graficos y alertas
|
||||
- **Gestion de Medidores** - CRUD completo con carga masiva Excel/CSV
|
||||
- **Gestion de Concentradores** - Configuracion de gateways LoRa/LoRaWAN
|
||||
- **Gestion de Proyectos** - Administracion de proyectos de infraestructura
|
||||
- **Gestion de Usuarios y Roles** - Control de acceso al sistema
|
||||
- **Consumo y Lecturas** - Seguimiento historico de lecturas con filtros y exportacion
|
||||
- **Analytics** - Mapa de medidores, reportes y metricas del servidor
|
||||
- **Conectores** - Integracion con SH-Meters, XMeters y The Things Stack
|
||||
- **Usuarios y Roles** - Control de acceso basado en roles (ADMIN, OPERATOR, VIEWER)
|
||||
- **Auditoria** - Registro completo de actividad del sistema
|
||||
- **Notificaciones** - Alertas en tiempo real (flujo negativo, etc.)
|
||||
- **Tema claro/oscuro** - Personalizacion de la interfaz
|
||||
- **Diseno responsive** - Compatible con desktop, tablet y movil
|
||||
|
||||
---
|
||||
|
||||
## Arquitectura
|
||||
|
||||
```
|
||||
┌─────────────────────────────────────────────────────────────┐
|
||||
│ FRONTEND (React SPA) │
|
||||
│ http://localhost:5173 │
|
||||
│ React 18 + TypeScript + Vite + Tailwind CSS + MUI │
|
||||
└──────────────────────────┬──────────────────────────────────┘
|
||||
│ REST API (JWT)
|
||||
▼
|
||||
┌─────────────────────────────────────────────────────────────┐
|
||||
│ BACKEND (Express API) │
|
||||
│ http://localhost:3000 │
|
||||
│ Express + TypeScript + Zod + Winston + node-cron │
|
||||
└──────────────────────────┬──────────────────────────────────┘
|
||||
│
|
||||
▼
|
||||
┌─────────────────────────────────────────────────────────────┐
|
||||
│ PostgreSQL │
|
||||
│ 10 tablas + 2 vistas + triggers + indices │
|
||||
└─────────────────────────────────────────────────────────────┘
|
||||
```
|
||||
|
||||
Adicionalmente existe un **Upload Panel** (`upload-panel/`) como aplicacion separada para carga masiva de datos via CSV.
|
||||
|
||||
---
|
||||
|
||||
## Stack Tecnologico
|
||||
|
||||
### Frontend
|
||||
@@ -27,13 +59,26 @@ El **Sistema de Gestion de Recursos Hidricos (GRH)** es una aplicacion web front
|
||||
| TypeScript | 5.2.2 | Type safety |
|
||||
| Vite | 5.2.0 | Build tool y dev server |
|
||||
| Tailwind CSS | 4.1.18 | Estilos utility-first |
|
||||
| Material-UI | 7.3.6 | Componentes UI |
|
||||
| Material-UI (MUI) | 7.3.6 | Componentes UI |
|
||||
| MUI X Data Grid | 8.21.0 | Tablas de datos avanzadas |
|
||||
| Recharts | 3.6.0 | Visualizacion de datos |
|
||||
| Leaflet / React-Leaflet | 1.9.4 / 4.2.1 | Mapas interactivos |
|
||||
| Lucide React | 0.559.0 | Iconos SVG |
|
||||
|
||||
### Herramientas de Desarrollo
|
||||
- **ESLint** - Linting de codigo
|
||||
- **TypeScript ESLint** - Analisis estatico
|
||||
### Backend
|
||||
| Tecnologia | Version | Proposito |
|
||||
|------------|---------|-----------|
|
||||
| Express.js | 4.18.2 | Framework HTTP |
|
||||
| TypeScript | 5.3.3 | Type safety |
|
||||
| PostgreSQL (pg) | 8.11.3 | Driver de base de datos |
|
||||
| JWT (jsonwebtoken) | 9.0.2 | Autenticacion con tokens |
|
||||
| Bcrypt | 5.1.1 | Hash de contrasenas |
|
||||
| Zod | 3.22.4 | Validacion de datos |
|
||||
| Helmet | 7.1.0 | Headers de seguridad |
|
||||
| Winston | 3.11.0 | Logging |
|
||||
| Multer | 2.0.2 | Subida de archivos |
|
||||
| XLSX | 0.18.5 | Parseo de archivos Excel |
|
||||
| node-cron | 3.0.3 | Tareas programadas |
|
||||
|
||||
---
|
||||
|
||||
@@ -42,334 +87,357 @@ El **Sistema de Gestion de Recursos Hidricos (GRH)** es una aplicacion web front
|
||||
### Prerrequisitos
|
||||
|
||||
- Node.js >= 18.x
|
||||
- npm >= 9.x o yarn >= 1.22
|
||||
- npm >= 9.x
|
||||
- PostgreSQL >= 14.x
|
||||
|
||||
### Pasos de Instalacion
|
||||
### 1. Clonar el repositorio
|
||||
|
||||
1. **Clonar el repositorio**
|
||||
```bash
|
||||
git clone <url-del-repositorio>
|
||||
cd water-project
|
||||
git clone https://git.consultoria-as.com/consultoria-as/GRH.git
|
||||
cd GRH
|
||||
```
|
||||
|
||||
2. **Instalar dependencias**
|
||||
### 2. Configurar la base de datos
|
||||
|
||||
```bash
|
||||
# Crear la base de datos
|
||||
createdb water_project
|
||||
|
||||
# Ejecutar el schema principal
|
||||
psql -d water_project -f water-api/sql/schema.sql
|
||||
|
||||
# Ejecutar migraciones adicionales
|
||||
psql -d water_project -f water-api/sql/add_audit_logs.sql
|
||||
psql -d water_project -f water-api/sql/add_notifications.sql
|
||||
psql -d water_project -f water-api/sql/add_meter_extended_fields.sql
|
||||
psql -d water_project -f water-api/sql/create_meter_types.sql
|
||||
psql -d water_project -f water-api/sql/add_meter_project_relation.sql
|
||||
psql -d water_project -f water-api/sql/add_user_project_relation.sql
|
||||
```
|
||||
|
||||
### 3. Configurar el backend
|
||||
|
||||
```bash
|
||||
cd water-api
|
||||
cp .env.example .env
|
||||
# Editar .env con las credenciales de PostgreSQL y secretos JWT
|
||||
npm install
|
||||
```
|
||||
|
||||
3. **Configurar variables de entorno**
|
||||
### 4. Configurar el frontend
|
||||
|
||||
```bash
|
||||
cd ..
|
||||
cp .env.example .env
|
||||
# Editar .env con la URL del backend
|
||||
npm install
|
||||
```
|
||||
|
||||
Editar el archivo `.env`:
|
||||
```env
|
||||
VITE_API_BASE_URL=https://tu-api-url.com
|
||||
VITE_API_TOKEN=tu-token-de-api
|
||||
```
|
||||
### 5. Iniciar en desarrollo
|
||||
|
||||
4. **Iniciar servidor de desarrollo**
|
||||
```bash
|
||||
# Terminal 1 - Backend
|
||||
cd water-api
|
||||
npm run dev
|
||||
|
||||
# Terminal 2 - Frontend
|
||||
cd ..
|
||||
npm run dev
|
||||
```
|
||||
|
||||
La aplicacion estara disponible en `http://localhost:5173`
|
||||
El frontend estara disponible en `http://localhost:5173` y el backend en `http://localhost:3000`.
|
||||
|
||||
---
|
||||
|
||||
## Variables de Entorno
|
||||
|
||||
### Frontend (`.env`)
|
||||
| Variable | Descripcion | Ejemplo |
|
||||
|----------|-------------|---------|
|
||||
| `VITE_API_BASE_URL` | URL base del backend | `http://localhost:3000` |
|
||||
|
||||
### Backend (`water-api/.env`)
|
||||
| Variable | Descripcion | Ejemplo |
|
||||
|----------|-------------|---------|
|
||||
| `PORT` | Puerto del servidor | `3000` |
|
||||
| `NODE_ENV` | Entorno | `development` |
|
||||
| `DB_HOST` | Host de PostgreSQL | `localhost` |
|
||||
| `DB_PORT` | Puerto de PostgreSQL | `5432` |
|
||||
| `DB_NAME` | Nombre de la base de datos | `water_project` |
|
||||
| `DB_USER` | Usuario de PostgreSQL | `postgres` |
|
||||
| `DB_PASSWORD` | Contrasena de PostgreSQL | `your_password` |
|
||||
| `JWT_ACCESS_SECRET` | Secreto para access tokens | `random_string` |
|
||||
| `JWT_REFRESH_SECRET` | Secreto para refresh tokens | `random_string` |
|
||||
| `JWT_ACCESS_EXPIRES` | Expiracion access token | `15m` |
|
||||
| `JWT_REFRESH_EXPIRES` | Expiracion refresh token | `7d` |
|
||||
| `CORS_ORIGIN` | Origenes permitidos | `http://localhost:5173` |
|
||||
| `TTS_ENABLED` | Habilitar The Things Stack | `false` |
|
||||
| `TTS_BASE_URL` | URL de TTS | `https://...` |
|
||||
| `TTS_WEBHOOK_SECRET` | Secreto para webhooks TTS | `random_string` |
|
||||
|
||||
---
|
||||
|
||||
## Scripts Disponibles
|
||||
|
||||
### Frontend
|
||||
| Comando | Descripcion |
|
||||
|---------|-------------|
|
||||
| `npm run dev` | Inicia el servidor de desarrollo |
|
||||
| `npm run build` | Compila TypeScript y genera build de produccion |
|
||||
| `npm run preview` | Previsualiza el build de produccion |
|
||||
| `npm run lint` | Ejecuta ESLint en el codigo |
|
||||
| `npm run dev` | Servidor de desarrollo (puerto 5173) |
|
||||
| `npm run build` | Compilar TypeScript + build de produccion |
|
||||
| `npm run preview` | Previsualizar build de produccion |
|
||||
| `npm run lint` | Ejecutar ESLint |
|
||||
|
||||
### Backend (`water-api/`)
|
||||
| Comando | Descripcion |
|
||||
|---------|-------------|
|
||||
| `npm run dev` | Servidor de desarrollo con hot-reload |
|
||||
| `npm run build` | Compilar TypeScript |
|
||||
| `npm run start` | Ejecutar build compilado |
|
||||
| `npm run watch` | Desarrollo con nodemon |
|
||||
|
||||
### Upload Panel (`upload-panel/`)
|
||||
| Comando | Descripcion |
|
||||
|---------|-------------|
|
||||
| `npm run dev` | Servidor de desarrollo |
|
||||
| `npm run build` | Build de produccion |
|
||||
|
||||
---
|
||||
|
||||
## Estructura del Proyecto
|
||||
|
||||
```
|
||||
water-project/
|
||||
├── public/ # Assets estaticos
|
||||
│ └── grhWatermark.jpg
|
||||
│
|
||||
├── src/
|
||||
│ ├── api/ # Capa de comunicacion con API
|
||||
│ │ ├── me.ts # Endpoints de perfil
|
||||
│ │ ├── meters.ts # CRUD de medidores
|
||||
│ │ ├── concentrators.ts # CRUD de concentradores
|
||||
│ │ └── projects.ts # CRUD de proyectos
|
||||
GRH/
|
||||
├── src/ # Frontend React SPA
|
||||
│ ├── api/ # Cliente API (14 modulos)
|
||||
│ │ ├── client.ts # Cliente HTTP con JWT y refresh automatico
|
||||
│ │ ├── auth.ts # Autenticacion y gestion de tokens
|
||||
│ │ ├── meters.ts # CRUD de medidores
|
||||
│ │ ├── readings.ts # Lecturas de consumo
|
||||
│ │ ├── projects.ts # Proyectos
|
||||
│ │ ├── concentrators.ts # Concentradores
|
||||
│ │ ├── users.ts # Usuarios
|
||||
│ │ ├── roles.ts # Roles
|
||||
│ │ ├── analytics.ts # Analytics y metricas
|
||||
│ │ ├── notifications.ts # Notificaciones
|
||||
│ │ ├── audit.ts # Auditoria
|
||||
│ │ ├── me.ts # Perfil de usuario
|
||||
│ │ ├── meterTypes.ts # Tipos de medidor
|
||||
│ │ └── types.ts # Tipos compartidos
|
||||
│ │
|
||||
│ ├── components/
|
||||
│ │ ├── layout/ # Componentes de layout
|
||||
│ │ │ ├── Sidebar.tsx # Menu lateral
|
||||
│ │ │ ├── TopMenu.tsx # Barra superior
|
||||
│ │ │ └── common/ # Componentes reutilizables
|
||||
│ │ │ ├── ProfileModal.tsx
|
||||
│ │ │ ├── ConfirmModal.tsx
|
||||
│ │ │ └── Watermark.tsx
|
||||
│ │ └── SettingsModals.tsx
|
||||
│ ├── components/ # Componentes reutilizables
|
||||
│ │ ├── layout/
|
||||
│ │ │ ├── Sidebar.tsx # Menu lateral (colapsable, pin)
|
||||
│ │ │ ├── TopMenu.tsx # Barra superior con breadcrumb
|
||||
│ │ │ └── common/
|
||||
│ │ │ ├── ProfileModal.tsx # Editar perfil y avatar
|
||||
│ │ │ ├── ConfirmModal.tsx # Confirmacion de acciones
|
||||
│ │ │ ├── Watermark.tsx # Marca de agua GRH
|
||||
│ │ │ └── ProjectBadge.tsx # Badge de proyecto
|
||||
│ │ ├── SettingsModals.tsx # Configuracion de tema/UI
|
||||
│ │ └── NotificationDropdown.tsx # Panel de notificaciones
|
||||
│ │
|
||||
│ ├── pages/ # Paginas principales
|
||||
│ │ ├── Home.tsx # Dashboard
|
||||
│ │ ├── LoginPage.tsx # Login
|
||||
│ │ ├── UsersPage.tsx # Gestion de usuarios
|
||||
│ │ ├── RolesPage.tsx # Gestion de roles
|
||||
│ ├── pages/
|
||||
│ │ ├── Home.tsx # Dashboard con KPIs y graficos
|
||||
│ │ ├── LoginPage.tsx # Inicio de sesion
|
||||
│ │ ├── UsersPage.tsx # Gestion de usuarios
|
||||
│ │ ├── RolesPage.tsx # Gestion de roles
|
||||
│ │ ├── AuditoriaPage.tsx # Visor de logs de auditoria
|
||||
│ │ ├── projects/
|
||||
│ │ │ └── ProjectsPage.tsx
|
||||
│ │ ├── meters/ # Modulo de medidores
|
||||
│ │ ├── meters/ # Modulo de medidores
|
||||
│ │ │ ├── MeterPage.tsx
|
||||
│ │ │ ├── useMeters.ts # Hook personalizado
|
||||
│ │ │ ├── MetersTable.tsx
|
||||
│ │ │ ├── MetersModal.tsx
|
||||
│ │ │ └── MetersSidebar.tsx
|
||||
│ │ └── concentrators/ # Modulo de concentradores
|
||||
│ │ ├── ConcentratorsPage.tsx
|
||||
│ │ ├── useConcentrators.ts
|
||||
│ │ ├── ConcentratorsTable.tsx
|
||||
│ │ ├── ConcentratorsModal.tsx
|
||||
│ │ └── ConcentratorsSidebar.tsx
|
||||
│ │ │ ├── MetersSidebar.tsx
|
||||
│ │ │ ├── MetersBulkUploadModal.tsx
|
||||
│ │ │ └── useMeters.ts
|
||||
│ │ ├── concentrators/ # Modulo de concentradores
|
||||
│ │ │ ├── ConcentratorsPage.tsx
|
||||
│ │ │ ├── ConcentratorsTable.tsx
|
||||
│ │ │ ├── ConcentratorsModal.tsx
|
||||
│ │ │ ├── ConcentratorsSidebar.tsx
|
||||
│ │ │ └── useConcentrators.ts
|
||||
│ │ ├── consumption/ # Modulo de consumo
|
||||
│ │ │ ├── ConsumptionPage.tsx
|
||||
│ │ │ └── ReadingsBulkUploadModal.tsx
|
||||
│ │ ├── analytics/ # Modulo de analytics
|
||||
│ │ │ ├── AnalyticsMapPage.tsx
|
||||
│ │ │ ├── AnalyticsReportsPage.tsx
|
||||
│ │ │ ├── AnalyticsServerPage.tsx
|
||||
│ │ │ └── MapComponents.tsx
|
||||
│ │ └── conectores/ # Conectores externos
|
||||
│ │ ├── SHMetersPage.tsx
|
||||
│ │ ├── XMetersPage.tsx
|
||||
│ │ └── TTSPage.tsx
|
||||
│ │
|
||||
│ ├── assets/
|
||||
│ │ └── images/
|
||||
│ │
|
||||
│ ├── App.tsx # Componente raiz
|
||||
│ ├── main.tsx # Punto de entrada
|
||||
│ └── index.css # Estilos globales
|
||||
│ ├── hooks/
|
||||
│ │ └── useNotifications.ts
|
||||
│ ├── App.tsx # Componente raiz (routing + auth)
|
||||
│ ├── main.tsx # Punto de entrada React
|
||||
│ └── index.css # Estilos globales (Tailwind)
|
||||
│
|
||||
├── index.html
|
||||
├── package.json
|
||||
├── tsconfig.json
|
||||
├── vite.config.ts
|
||||
└── .env.example
|
||||
├── water-api/ # Backend Express API
|
||||
│ ├── src/
|
||||
│ │ ├── index.ts # Setup del servidor Express
|
||||
│ │ ├── config/
|
||||
│ │ │ ├── index.ts # Carga de configuracion
|
||||
│ │ │ └── database.ts # Pool de conexiones PostgreSQL
|
||||
│ │ ├── routes/ # 17 archivos de rutas
|
||||
│ │ ├── controllers/ # Controladores REST
|
||||
│ │ ├── services/ # Logica de negocio (18 modulos)
|
||||
│ │ ├── middleware/
|
||||
│ │ │ ├── auth.middleware.ts # Verificacion JWT
|
||||
│ │ │ ├── audit.middleware.ts # Logging de actividad
|
||||
│ │ │ └── ttsWebhook.middleware.ts
|
||||
│ │ ├── validators/ # Validacion con Zod
|
||||
│ │ ├── utils/
|
||||
│ │ │ ├── jwt.ts # Generacion/verificacion de tokens
|
||||
│ │ │ ├── password.ts # Wrappers de bcrypt
|
||||
│ │ │ └── logger.ts # Configuracion Winston
|
||||
│ │ ├── jobs/
|
||||
│ │ │ └── negativeFlowDetection.ts # Tarea programada
|
||||
│ │ └── types/ # Interfaces TypeScript
|
||||
│ │
|
||||
│ ├── sql/ # Schema y migraciones
|
||||
│ │ ├── schema.sql # Schema principal (10 tablas + 2 vistas)
|
||||
│ │ ├── add_audit_logs.sql
|
||||
│ │ ├── add_notifications.sql
|
||||
│ │ ├── add_meter_extended_fields.sql
|
||||
│ │ ├── create_meter_types.sql
|
||||
│ │ ├── add_meter_project_relation.sql
|
||||
│ │ └── add_user_project_relation.sql
|
||||
│ │
|
||||
│ ├── package.json
|
||||
│ ├── tsconfig.json
|
||||
│ └── .env.example
|
||||
│
|
||||
├── upload-panel/ # App separada para carga CSV
|
||||
│ ├── src/
|
||||
│ │ ├── App.tsx
|
||||
│ │ ├── components/
|
||||
│ │ │ ├── MetersUpload.tsx
|
||||
│ │ │ ├── ReadingsUpload.tsx
|
||||
│ │ │ ├── FileDropzone.tsx
|
||||
│ │ │ └── ResultsDisplay.tsx
|
||||
│ │ └── api/upload.ts
|
||||
│ ├── package.json
|
||||
│ └── vite.config.ts
|
||||
│
|
||||
├── package.json # Dependencias frontend
|
||||
├── vite.config.ts # Configuracion Vite
|
||||
├── tsconfig.json # Configuracion TypeScript
|
||||
├── index.html # HTML de entrada
|
||||
├── DOCUMENTATION.md # Documentacion tecnica
|
||||
├── ESTADO_ACTUAL.md # Estado actual del proyecto
|
||||
└── CAMBIOS_SESION.md # Historial de cambios
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Modulos Funcionales
|
||||
## Base de Datos
|
||||
|
||||
### 1. Dashboard (Home)
|
||||
### Jerarquia de datos
|
||||
```
|
||||
Projects → Concentrators → Meters → Readings
|
||||
→ Gateways → Devices ↗
|
||||
```
|
||||
|
||||
El dashboard principal ofrece:
|
||||
- Selector de organismos operadores (CESPT TIJUANA, TECATE, MEXICALI)
|
||||
- Grafico de barras: "Numero de Medidores por Proyecto"
|
||||
- Tarjetas de acceso rapido: Tomas, Alertas, Mantenimiento, Reportes
|
||||
- Historial reciente de actividades
|
||||
- Panel de ultimas alertas
|
||||
### Tablas principales
|
||||
|
||||
### 2. Gestion de Medidores
|
||||
| Tabla | Descripcion |
|
||||
|-------|-------------|
|
||||
| `roles` | Roles del sistema (ADMIN, OPERATOR, VIEWER) con permisos JSONB |
|
||||
| `users` | Usuarios con email, password hash, rol y estado |
|
||||
| `projects` | Proyectos de infraestructura hidrica |
|
||||
| `concentrators` | Concentradores de datos vinculados a proyectos |
|
||||
| `gateways` | Gateways LoRaWAN con integracion TTS |
|
||||
| `devices` | Dispositivos LoRaWAN (sensores/transmisores) |
|
||||
| `meters` | Medidores de agua con ubicacion y ultima lectura |
|
||||
| `meter_readings` | Historial de lecturas con bateria y senal |
|
||||
| `tts_uplink_logs` | Logs de mensajes uplink de The Things Stack |
|
||||
| `refresh_tokens` | Tokens de refresco JWT para sesiones |
|
||||
|
||||
Modulo completo para administrar medidores/tomas de agua:
|
||||
|
||||
**Funcionalidades:**
|
||||
- Listado con busqueda y filtros
|
||||
- Filtrado por proyecto
|
||||
- Tipos de toma: GENERAL, LORA, LORAWAN, GRANDES
|
||||
- CRUD completo (Crear, Leer, Actualizar, Eliminar)
|
||||
|
||||
**Campos principales:**
|
||||
- Area, Numero de cuenta, Usuario, Direccion
|
||||
- Serial del medidor, Nombre, Estado
|
||||
- Tipo de protocolo, Particion DMA
|
||||
- Configuracion de dispositivo (Device EUI, AppKey, etc.)
|
||||
|
||||
### 3. Gestion de Concentradores
|
||||
|
||||
Administracion de concentradores y gateways:
|
||||
|
||||
**Funcionalidades:**
|
||||
- Listado con filtros por proyecto
|
||||
- Configuracion de Gateway (ID, EUI, Nombre)
|
||||
- Seleccion de ubicacion de antena (Indoor/Outdoor)
|
||||
- CRUD completo
|
||||
|
||||
### 4. Gestion de Proyectos
|
||||
|
||||
Administracion de proyectos de infraestructura:
|
||||
- Tabla con busqueda integrada
|
||||
- Estados: ACTIVE/INACTIVE
|
||||
- Informacion de operador y tiempos
|
||||
|
||||
### 5. Gestion de Usuarios
|
||||
|
||||
Control de usuarios del sistema:
|
||||
- Listado de usuarios
|
||||
- Asignacion de roles
|
||||
- Estados: ACTIVE/INACTIVE
|
||||
|
||||
### 6. Gestion de Roles
|
||||
|
||||
Administracion de roles de acceso:
|
||||
- Roles predefinidos: SUPER_ADMIN, USER
|
||||
- Descripcion de permisos
|
||||
### Vistas
|
||||
- `meter_stats_by_project` - Estadisticas agregadas de medidores por proyecto
|
||||
- `device_status_summary` - Resumen de estados de dispositivos por proyecto
|
||||
|
||||
---
|
||||
|
||||
## API y Comunicacion
|
||||
## API Endpoints
|
||||
|
||||
### Configuracion
|
||||
Todos los endpoints estan bajo el prefijo `/api/`. La mayoria requieren autenticacion JWT.
|
||||
|
||||
La aplicacion se conecta a una API REST externa. Configurar en `.env`:
|
||||
|
||||
```env
|
||||
VITE_API_BASE_URL=https://tu-api.com
|
||||
VITE_API_TOKEN=tu-token
|
||||
```
|
||||
|
||||
### Endpoints Principales
|
||||
|
||||
| Recurso | Endpoint Base |
|
||||
|---------|---------------|
|
||||
| Medidores | `/api/v3/data/.../m4hzpnopjkppaav/records` |
|
||||
| Concentradores | `/api/v3/data/.../mheif1vdgnyt8x2/records` |
|
||||
| Proyectos | `/api/v3/data/.../m9882vn3xb31e29/records` |
|
||||
|
||||
### Estructura de Respuesta
|
||||
|
||||
```typescript
|
||||
interface ApiResponse<T> {
|
||||
records: Array<{
|
||||
id: string;
|
||||
fields: T;
|
||||
}>;
|
||||
next?: string;
|
||||
prev?: string;
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Modelos de Datos
|
||||
|
||||
### Meter (Medidor)
|
||||
|
||||
```typescript
|
||||
interface Meter {
|
||||
id: string;
|
||||
createdAt: string;
|
||||
updatedAt: string;
|
||||
areaName: string;
|
||||
accountNumber: string | null;
|
||||
userName: string | null;
|
||||
userAddress: string | null;
|
||||
meterSerialNumber: string;
|
||||
meterName: string;
|
||||
meterStatus: string;
|
||||
protocolType: string;
|
||||
priceNo: string | null;
|
||||
priceName: string | null;
|
||||
dmaPartition: string | null;
|
||||
supplyTypes: string;
|
||||
deviceId: string;
|
||||
deviceName: string;
|
||||
deviceType: string;
|
||||
usageAnalysisType: string;
|
||||
installedTime: string;
|
||||
}
|
||||
```
|
||||
|
||||
### Concentrator
|
||||
|
||||
```typescript
|
||||
interface Concentrator {
|
||||
id: string;
|
||||
"Area Name": string;
|
||||
"Device S/N": string;
|
||||
"Device Name": string;
|
||||
"Device Time": string;
|
||||
"Device Status": string;
|
||||
"Operator": string;
|
||||
"Installed Time": string;
|
||||
"Communication Time": string;
|
||||
"Instruction Manual": string;
|
||||
}
|
||||
```
|
||||
|
||||
### Project
|
||||
|
||||
```typescript
|
||||
interface Project {
|
||||
id: string;
|
||||
areaName: string;
|
||||
deviceSN: string;
|
||||
deviceName: string;
|
||||
deviceType: string;
|
||||
deviceStatus: "ACTIVE" | "INACTIVE";
|
||||
operator: string;
|
||||
installedTime: string;
|
||||
communicationTime: string;
|
||||
}
|
||||
```
|
||||
| Grupo | Prefijo | Descripcion |
|
||||
|-------|---------|-------------|
|
||||
| Auth | `/api/auth` | Login, refresh, logout, perfil |
|
||||
| Projects | `/api/projects` | CRUD de proyectos + estadisticas |
|
||||
| Meters | `/api/meters` | CRUD de medidores + lecturas |
|
||||
| Meter Types | `/api/meter-types` | Tipos de medidor |
|
||||
| Concentrators | `/api/concentrators` | CRUD de concentradores |
|
||||
| Gateways | `/api/gateways` | CRUD de gateways + dispositivos |
|
||||
| Devices | `/api/devices` | CRUD de dispositivos LoRaWAN |
|
||||
| Users | `/api/users` | Gestion de usuarios (admin) |
|
||||
| Roles | `/api/roles` | Gestion de roles |
|
||||
| Readings | `/api/readings` | Lecturas y resumen de consumo |
|
||||
| Notifications | `/api/notifications` | Notificaciones del usuario |
|
||||
| Audit | `/api/audit-logs` | Logs de auditoria (admin) |
|
||||
| Bulk Upload | `/api/bulk-upload` | Carga masiva Excel |
|
||||
| CSV Upload | `/api/csv-upload` | Carga masiva CSV |
|
||||
| TTS Webhooks | `/api/webhooks/tts` | Webhooks The Things Stack |
|
||||
| System | `/api/system` | Metricas y salud del servidor (admin) |
|
||||
|
||||
---
|
||||
|
||||
## Autenticacion
|
||||
|
||||
### Flujo de Login
|
||||
El sistema usa **JWT con refresh tokens**:
|
||||
|
||||
1. Usuario ingresa credenciales
|
||||
2. Validacion del checkbox "No soy un robot"
|
||||
3. Token almacenado en `localStorage` (`grh_auth`)
|
||||
4. Redireccion al Dashboard
|
||||
1. El usuario envia email/password a `POST /api/auth/login`
|
||||
2. El backend valida credenciales con bcrypt y genera:
|
||||
- **Access token** (15 minutos)
|
||||
- **Refresh token** (7 dias)
|
||||
3. Los tokens se almacenan en `localStorage`
|
||||
4. El cliente HTTP envia el access token en `Authorization: Bearer <token>`
|
||||
5. Al expirar, el cliente automaticamente llama a `POST /api/auth/refresh`
|
||||
|
||||
### Almacenamiento
|
||||
|
||||
```javascript
|
||||
// localStorage keys
|
||||
grh_auth: { token: string, ts: number }
|
||||
water_project_settings_v1: { theme: string, compactMode: boolean }
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Configuracion de Temas
|
||||
|
||||
El sistema soporta tres modos de tema:
|
||||
- **Sistema** - Detecta preferencia del OS
|
||||
- **Claro** - Tema light
|
||||
- **Oscuro** - Tema dark
|
||||
|
||||
Configuracion persistida en `localStorage` bajo `water_project_settings_v1`.
|
||||
### Roles y permisos
|
||||
| Rol | Descripcion |
|
||||
|-----|-------------|
|
||||
| `ADMIN` | Acceso completo al sistema |
|
||||
| `OPERATOR` | Gestiona proyectos, dispositivos, medidores (sin configuracion del sistema) |
|
||||
| `VIEWER` | Solo lectura de datos y reportes |
|
||||
|
||||
---
|
||||
|
||||
## Despliegue
|
||||
|
||||
### Build de Produccion
|
||||
### Build de produccion
|
||||
|
||||
```bash
|
||||
npm run build
|
||||
# Frontend
|
||||
npm run build # Genera dist/
|
||||
|
||||
# Backend
|
||||
cd water-api
|
||||
npm run build # Genera dist/
|
||||
npm run start # Ejecuta el build
|
||||
```
|
||||
|
||||
Los archivos compilados se generan en la carpeta `dist/`.
|
||||
|
||||
### Configuracion de Vite
|
||||
|
||||
El servidor de desarrollo esta configurado para:
|
||||
- Puerto: 5173
|
||||
- Host: habilitado para acceso remoto
|
||||
- Hosts permitidos: localhost, 127.0.0.1, dominios personalizados
|
||||
### URLs de produccion
|
||||
- **Frontend:** `https://sistema.gestionrecursoshidricos.com`
|
||||
- **Backend:** `https://api.gestionrecursoshidricos.com`
|
||||
|
||||
---
|
||||
|
||||
## Contribucion
|
||||
## Repositorios
|
||||
|
||||
1. Fork del repositorio
|
||||
2. Crear rama feature (`git checkout -b feature/nueva-funcionalidad`)
|
||||
3. Commit de cambios (`git commit -m 'Agregar nueva funcionalidad'`)
|
||||
4. Push a la rama (`git push origin feature/nueva-funcionalidad`)
|
||||
5. Crear Pull Request
|
||||
| Remote | URL |
|
||||
|--------|-----|
|
||||
| Gitea | `https://git.consultoria-as.com/consultoria-as/GRH` |
|
||||
| GitHub | `git@github.com:luanngel/water-project.git` |
|
||||
|
||||
---
|
||||
|
||||
## Licencia
|
||||
|
||||
Este proyecto es privado y pertenece a GRH - Gestion de Recursos Hidricos.
|
||||
|
||||
---
|
||||
|
||||
## Contacto
|
||||
|
||||
Para soporte o consultas sobre el sistema, contactar al equipo de desarrollo.
|
||||
Este proyecto es privado y pertenece a GRH - Gestion de Recursos Hidricos / Consultoria AS.
|
||||
|
||||
Reference in New Issue
Block a user