- Usuarios: Full CRUD with role selection and client assignment - Umbrales: Form with metric selection and threshold values - ReglasMapeeo: Form with regex patterns and category mapping Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Horux Strategy Platform - Frontend
Frontend con React 18 + TypeScript + Vite para la plataforma de reportes financieros.
Requisitos
- Node.js 18+
- npm o yarn
Instalación
# Instalar dependencias
npm install
# Iniciar servidor de desarrollo
npm run dev
# Build para producción
npm run build
Estructura
src/
├── components/
│ ├── charts/ # Componentes de gráficas (Recharts)
│ │ ├── BarChart.tsx
│ │ └── LineChart.tsx
│ ├── cards/ # Tarjetas KPI y tablas
│ │ ├── KPICard.tsx
│ │ └── MetricTable.tsx
│ ├── forms/ # Formularios
│ │ ├── ClienteForm.tsx
│ │ ├── UploadBalanza.tsx
│ │ └── GenerarReporte.tsx
│ └── layout/ # Layout principal
│ ├── Layout.tsx
│ ├── Sidebar.tsx
│ └── Header.tsx
├── pages/
│ ├── Login.tsx
│ ├── Clientes/ # Gestión de clientes
│ ├── Dashboard/ # Dashboard de reportes
│ ├── PdfView/ # Vista para generación de PDF
│ └── Admin/ # Panel administrativo
├── context/
│ └── AuthContext.tsx # Contexto de autenticación
├── services/
│ └── api.ts # Cliente API
├── types/
│ └── index.ts # Tipos TypeScript
└── hooks/ # Hooks personalizados
Características
- Autenticación con tokens Bearer
- Dashboard interactivo con gráficas Recharts
- Subida de archivos con drag & drop
- Panel administrativo para configuración
- Generación de PDF mediante Browsershot
- Diseño responsivo con Tailwind CSS
Scripts
npm run dev # Desarrollo
npm run build # Build producción
npm run preview # Preview del build
npm run lint # Linting
Configuración
El proxy de desarrollo está configurado en vite.config.ts para redireccionar las llamadas /api/* al backend Laravel en http://localhost:8000.
Credenciales de prueba
- Email: admin@horux360.com
- Password: password
Licencia
Propietario - Horux 360