Pinada · Lab · Software de gestión / PMS

Cómo se construyó Pinada

Así funciona un panel de gestión hecho a medida: todo lo que se ve nace de una única fuente de datos — las reservas — y cada vista es una proyección de ella. El plano SVG del camping (60 estancias en 6 zonas, con piscina, recepción y viales recreados a partir del plano real) colorea cada parcela según su estado derivado: libre, ocupada, llegada o salida de hoy, mantenimiento o incidencia. El planning inferior tipo Gantt es la misma información en el eje del tiempo: arrastra una reserva y el mapa, los KPIs de ocupación, ADR e ingresos y el panel de detalle se recalculan al instante, porque nada está pintado a mano. Búsqueda global por huésped o parcela, zoom y arrastre sobre el plano, check-in y check-out con confirmación, y widgets de meteo, procedencia y canal de venta. La complejidad técnica está en esa sincronización — mapa, planning, panel y métricas leyendo el mismo estado — resuelta aquí sin frameworks ni librerías: JavaScript y SVG a pelo.

Es una demo técnica, no una plantilla vendible tal cual: un adelanto de lo que podemos construir a medida cuando un proyecto necesita algo más que una web de catálogo. Si te interesa algo parecido para tu producto, hablamos.

Qué demuestra

• Plano SVG interactivo del camping con zoom, arrastre y 60 estancias en 6 zonas
• Estados derivados de las reservas: libre, ocupada, llegada/salida de hoy, mantenimiento e incidencia
• Planning tipo Gantt (7/14/30 días) con zonas plegables y ocupación por día
• Arrastrar una reserva en el planning recalcula mapa, KPIs y panel al instante
• KPIs calculados en vivo: ocupación con tendencia 7 días, llegadas/salidas, ingresos, ADR e incidencias
• Panel de detalle con huésped, canal, saldo, historial y acciones (check-in, check-out, nota…)
• Búsqueda global por huésped o estancia con resultados en vivo
• Widgets en SVG propio: meteo a 5 días, donut de procedencia y canales de venta
• Fotos de las estancias generadas con IA (Higgsfield) y optimizadas a ~60 KB
• Responsive: en móvil se reorganiza en pestañas Mapa / Planning / Resumen