# Diagrama UML - Plataforma INNOVATECH (Semillero)

Documento tecnico de arquitectura funcional: casos de uso, clases e interacciones entre Usuario, Frontend Angular, Backend Express y Base de Datos PostgreSQL.

Frontend: Angular 21 Backend: Express + Node.js DB: PostgreSQL Fecha: 2026-02-15

## 1) UML de Casos de Uso

Actor principal: Usuario. Actor con permisos ampliados: Administrador (carga CSV y actualizacion intensiva).

## 2) UML de Clases (Aplicacion + Datos)

Las clases de dominio visibles en frontend son `Producto` y `Registro`. El backend concentra logica de consulta, paginacion y proceso ETL (CSV -> tablas relacionales).

## 3) UML de Interacciones (Secuencia)

## 4) Puentes entre Frontend, Backend, Archivos y APIs

Flujo | Frontend (archivo/metodo) | API | Backend (archivo/logica) | Datos involucrados
--- | --- | --- | --- | ---
Consulta de productos | `semillero/src/app/app.ts` metodo `load()` con `endpoint='productos'` | `GET /api/productos?q=&limit=&offset=` | `backend/server.js` ruta `app.get('/api/productos')`, SQL filtrado + paginacion | Tabla `productos`
Consulta de registros | `semillero/src/app/app.ts` metodo `load()` con `endpoint='registros'` | `GET /api/registros?q=&limit=&offset=` | `backend/server.js` ruta `app.get('/api/registros')`, LEFT JOIN con actores/productos | Tablas `registros_sanitarios`, `productos`, `actores`
Importacion CSV | `semillero/src/app/app.ts` metodo `uploadCsv()` con `FormData(file)` | `POST /api/registros/import` | `backend/server.js` multer + csv-parse + upserts por lotes | Inserta/actualiza `actores`, `productos`, `registros_sanitarios`
Proxy de desarrollo | `semillero/proxy.conf.json` redirige `/api` a backend local | `/api -> http://localhost:3000` | Permite que Angular (`4200`) consuma Express (`3000`) sin CORS local | Canal de integracion FE/BE

Modelo de datos formal definido en `backend/comando.sql`. Endpoints y proceso ETL definidos en `backend/server.js`. La UI que consume estas APIs esta en `semillero/src/app/app.ts` y `semillero/src/app/app.html`.