Responsables: Josep y Alexander
Go to file
Алекс 7c3b05f2da feat: UI/UX — dashboard, terceros, fact. proveedores y presentación
Dashboard:
- Sección renombrada a "Últimos movimientos", ordena por fecha de actividad
- Badges V/C con tooltip Venta/Compra
- Importes negativos y pendientes en rojo, pagados en verde
- Tabla "Últimas facturas emitidas": quita columna Pendiente, colores en Total,
  Vencimiento en rojo/ámbar si vencida o próxima

Terceros (antes Clientes):
- Renombrado en sidebar, búsqueda y mensajes
- Campo Tipo (Cliente/Proveedor/Ambos) en formulario de creación y en tabla
- Modal de detalle muestra "Información del Tercero"

Fact. Proveedores:
- Crear factura convertido a página completa (mismo estilo que Facturas)
- Detalle convertido a modal appended en body con backdrop correcto
- Líneas con total calculado en tiempo real
- Guard de race condition en openDetail/refreshDetail
- Clic en C del widget navega y abre detalle directamente

InvoiceModal:
- Totales con highlight verde (pagado) o rojo (pendiente) según estado

CSS:
- create-invoice.css: flex/overflow scoped a .create-invoice-page
- dashboard.css: pendientes en rojo (era ámbar), especificidad db-total
- modal.css: sup-modal-backdrop/box, total-row--highlight

Presentación:
- Slides Reveal.js del frontend en presentacion/index.html

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-29 16:34:58 +02:00
presentacion feat: UI/UX — dashboard, terceros, fact. proveedores y presentación 2026-05-29 16:34:58 +02:00
public Enhance styles across various components 2026-05-14 19:02:04 +02:00
src feat: UI/UX — dashboard, terceros, fact. proveedores y presentación 2026-05-29 16:34:58 +02:00
.env ajustes pedidos por juanjo 2026-05-24 23:56:50 +02:00
.gitignore un manejador de pages 2026-01-23 19:53:37 +01:00
README.md ajustes pedidos por juanjo 2026-05-24 23:56:50 +02:00
ajustesDeJuanjo.txt ajustes pedidos por juanjo 2026-05-24 23:56:50 +02:00
index.html Enhance styles across various components 2026-05-14 19:02:04 +02:00
package.json ajustes pedidos por juanjo 2026-05-24 23:56:50 +02:00
pnpm-lock.yaml ajustes pedidos por juanjo 2026-05-24 23:56:50 +02:00
pnpm-workspace.yaml chore: add pnpm-workspace.yaml to configure build allowances for specific packages 2026-05-14 18:23:18 +02:00
vite.config.js feat: módulo banco, acciones masivas facturas, resumen trimestral IVA, colores importes y mejoras UI 2026-05-15 21:50:10 +02:00

README.md

doli-front

SPA (Single Page Application) para la gestión empresarial integrada con Dolibarr.
Desarrollada en Vanilla JS con Vite 7, sin frameworks frontend.

Tecnologías

  • Vanilla JS con ES Modules
  • Vite 7 — bundler y servidor de desarrollo
  • Chart.js — gráficas del dashboard
  • @huggingface/transformers — asistente de voz (Whisper, ejecución local en el navegador)

Requisitos

  • Node.js 18+
  • pnpm

Instalación y desarrollo

pnpm install
pnpm dev        # http://localhost:5173

Build de producción

pnpm build      # genera la carpeta dist/
pnpm preview    # previsualización del build

Configuración

Crea un archivo .env en la raíz del proyecto:

VITE_API_BASE_URL=http://localhost:5001

Por defecto apunta al BFF en localhost:5001.

Páginas disponibles

Ruta hash Página Descripción
#/ Dashboard Métricas generales y gráficas
#/facturas Facturas Facturas de clientes: crear, editar, anular
#/facturas-proveedores Facturas proveedores CRUD completo, líneas, pagos y cambio de estado
#/clientes Clientes Listado y gestión de clientes
#/contacts Contactos Listado y gestión de contactos
#/banco Banco Movimientos bancarios
#/settings Configuración Tema, sesión JWT, webhook y registro VeriFactu

Estructura del proyecto

doli-front/
├── src/
│   ├── main.js              # punto de entrada
│   ├── router.js            # router hash-based
│   ├── pages/               # una página por módulo de negocio
│   │   ├── pagesRegistry.js # registro central de rutas
│   │   ├── DashboardPage.js
│   │   ├── Facturas.js
│   │   ├── FacturasProveedores.js
│   │   ├── ClientesPage.js
│   │   ├── ContactsPage.js
│   │   ├── BancoPage.js
│   │   └── SettingsPage.js
│   ├── services/            # clientes HTTP por entidad
│   │   ├── apiClient.js     # fetch base con JWT automático
│   │   ├── auth.js
│   │   ├── invoices.js
│   │   ├── supplierInvoices.js
│   │   ├── clients.js
│   │   ├── contacts.js
│   │   ├── verifactu.js
│   │   └── ...
│   ├── components/          # componentes reutilizables
│   │   ├── Sidebar.js
│   │   ├── InvoiceModal.js
│   │   ├── VoiceAssistant.js
│   │   └── ...
│   └── styles/              # CSS modular
├── index.html
└── vite.config.js

Arquitectura

La aplicación sigue un patrón de SPA con router hash sin dependencias de framework:

  1. main.js inicializa el router y monta el layout principal (sidebar + área de contenido).
  2. router.js escucha cambios en window.location.hash y renderiza la página correspondiente.
  3. Cada página es una función que devuelve un HTMLElement con toda su lógica encapsulada.
  4. services/apiClient.js centraliza todas las llamadas HTTP, adjunta el token JWT y gestiona errores 401.

Credenciales de acceso (desarrollo)

  • Usuario: admin
  • Contraseña: 12345678

Estas son las credenciales del BFF/Dolibarr por defecto.