Files
panel-remate-app/README.md

124 lines
3.5 KiB
Markdown

# Ferco Admin — Panel administrador de remates ganaderos
Frontend React 18 + Vite + TypeScript para gestionar el backend Spring Boot de remates en vivo. Consume la API REST, WebSocket nativo (`/ws/**`) y SSE (`/api/webflux/lotes/stream/*`).
## Requisitos
- [Bun](https://bun.sh) 1.x (o Node.js 18+ con `npm`)
## Instalación
Con Bun (recomendado en este repo):
```bash
bun install
```
Con npm:
```bash
npm install
```
## Variables de entorno
Copie `.env.example` a `.env`:
| Variable | Descripción |
|----------|-------------|
| `VITE_API_URL` | URL base del backend **sin** barra final. Ej: `https://testapp.digitaltelecom.net`. Si está **vacía**, las peticiones usan el mismo origen (recomendado en dev con el proxy de Vite). |
## Desarrollo
```bash
bun run dev
# o: npm run dev
```
Abre [http://localhost:5173](http://localhost:5173).
Sin `VITE_API_URL`, Vite hace proxy de `/api`, `/auth`, `/contador` y `/ws` hacia `https://testapp.digitaltelecom.net` (configurable en `vite.config.ts`).
## Producción
```bash
bun run build
bun run preview
# o: npm run build && npm run preview
```
Despliegue: sirva la carpeta `dist/` en el mismo dominio que la API o configure CORS en el backend.
## Docker
Imagen multi-etapa: **Bun** compila el frontend y **nginx** sirve los estáticos.
```bash
# Con docker compose (recomendado)
docker compose up -d --build
# Panel en http://localhost:8080
```
Variables en `docker-compose.yml` o en un `.env` junto al compose:
| Variable | Default | Descripción |
|----------|---------|-------------|
| `VITE_API_URL` | `https://testapp.digitaltelecom.net` | URL del backend (se embebe en el build) |
| `APP_PORT` | `8080` | Puerto expuesto en el host |
Build manual:
```bash
docker build \
--build-arg VITE_API_URL=https://testapp.digitaltelecom.net \
-t ferco-admin:latest .
docker run -d -p 8080:80 --name ferco-admin ferco-admin:latest
```
> **Nota:** `VITE_API_URL` se define en **tiempo de build**. Si cambia la API, reconstruya la imagen (`docker compose up -d --build`).
## Autenticación
- Login: `POST /api/usuarios/login` (email + contraseña).
- Token JWT en `localStorage` (`ferco_admin_token`).
- Rutas del panel protegidas; `401` cierra sesión y redirige a `/login`.
- Solo usuarios **aprobados** (`confirmed: true`) pueden entrar.
## Módulos
| Ruta | Función |
|------|---------|
| `/` | Dashboard con totales y accesos rápidos |
| `/usuarios` | Listado, aprobación de pendientes, edición, eliminación |
| `/cabanas` | CRUD cabañas |
| `/remates` | CRUD remates, finalizar remate, indicador WS eventos |
| `/lotes` | CRUD lotes, suscripción SSE opcional por lote |
| `/pujas` | Listado, filtros, informes por remate |
| `/en-vivo` | Sala operador: contador WS/REST, reset, corregir, FIN_REMATE, pujas en vivo |
| `/historial` | `GET /api/HistorialPujas` |
## Tiempo real
- **Contador:** `wss://…/ws/puja/{remateId}/{loteId}` + REST `/contador/*`
- **Eventos remate:** `wss://…/ws/eventos/{remateId}` → mensaje `FIN_REMATE`
- **SSE lotes:** `GET /api/webflux/lotes/stream/{loteId}` con header `Authorization: Bearer …`
## Estructura
```
src/
api/ Cliente HTTP y endpoints
auth/ AuthContext, PrivateRoute
hooks/ useWebSocket, useContador, useEventosRemate, useLoteSSE
pages/ Pantallas del panel
components/ Layout, Sidebar, DataTable, Modal, etc.
types/ Interfaces TypeScript
utils/ URLs, fechas
```
## Backend de referencia
Producción: `https://testapp.digitaltelecom.net`