Este contenido esta restringido para usuarios registrados y con un perfil específico. Si dispone de uno, pulsa en "acceder" para poder verlo.
Acceder
Categoría: MiGlop.es
Documentación App Frontend
Bienvenido a la documentación completa del proyecto Miglop.es V2 Frontend.
📚 Índice de Documentación
Para Empezar
-
- Resumen general del proyecto
- Stack tecnológico
- Arquitectura básica
- Variables de entorno
- Scripts disponibles
- 👉 EMPIEZA AQUÍ
-
- Guía completa para nuevos desarrolladores
- Setup del entorno
- Primera tarea
- Workflow de Git
- 👉 LEE ESTO SI ERES NUEVO EN EL PROYECTO
Arquitectura y Estructura
-
- Estructura de carpetas detallada
- Organización de componentes
- Layouts y vistas
- Stores y servicios
- Convenciones de nomenclatura
-
- Patrones de componentes Vue 3
- Composition API
- Props y Events
- Composables
- DevExtreme y Element Plus
- Mejores prácticas
Tecnologías y Herramientas
-
02-LIBRARIES-AND-DEPENDENCIES.md
- Todas las librerías usadas
- Configuración de cada librería
- Versiones y actualizaciones
- Gestión de dependencias
-
- ApiService
- JwtService
- Cómo hacer llamadas a la API
- Manejo de errores
- Ejemplos de uso
- Abort Controllers
Operaciones y Mantenimiento
-
- Estrategia de despliegue
- Entornos (develop, staging, production)
- Scripts de build
- CI/CD
- Configuración de servidores
- Troubleshooting
-
09-UNUSED-COMPONENTS-ANALYSIS.md
- Análisis de componentes no utilizados
- Recomendaciones de limpieza
- Proceso de eliminación segura
- ⚠️ REVISAR ANTES DE ELIMINAR COMPONENTES
🎯 Guías por Rol
Para Nuevos Desarrolladores
Lectura recomendada en orden:
- 00-PROJECT-OVERVIEW.md – 30 min
- 08-ONBOARDING-GUIDE.md – 1 hora
- 01-PROJECT-STRUCTURE.md – 1 hora
- 04-COMPONENT-PATTERNS.md – 1 hora
- 03-API-COMMUNICATION.md – 30 min
Total: ~4 horas de lectura
Para Desarrolladores Existentes
Para añadir nuevas features:
Para debugging:
- 03-API-COMMUNICATION.md – Sección Troubleshooting
- 07-DEPLOYMENT.md – Sección Troubleshooting
Para deploys:
Para Tech Leads
Para revisión de arquitectura:
Para limpieza de código:
Para onboarding de equipo:
Para DevOps
Para configuración de CI/CD:
- 07-DEPLOYMENT.md
- 00-PROJECT-OVERVIEW.md – Scripts
🔍 Búsqueda Rápida
¿Cómo hacer…?
| Pregunta | Documento | Sección |
|---|---|---|
| ¿Cómo crear un componente? | 04-COMPONENT-PATTERNS.md | Estructura de Componentes |
| ¿Cómo llamar a la API? | 03-API-COMMUNICATION.md | ApiService |
| ¿Cómo usar un store? | 04-COMPONENT-PATTERNS.md | Composables |
| ¿Cómo hacer deploy? | 07-DEPLOYMENT.md | Proceso de Despliegue |
| ¿Qué librerías usar para X? | 02-LIBRARIES-AND-DEPENDENCIES.md | Por categoría |
| ¿Dónde está el componente Y? | 01-PROJECT-STRUCTURE.md | Carpeta src/components |
| ¿Cómo configurar el entorno? | 08-ONBOARDING-GUIDE.md | Configuración Inicial |
¿Qué es…?
| Concepto | Documento | Sección |
|---|---|---|
| ApiService | 03-API-COMMUNICATION.md | ApiService |
| Pinia Stores | 04-COMPONENT-PATTERNS.md | Composables |
| DevExtreme | 02-LIBRARIES-AND-DEPENDENCIES.md | UI Component Libraries |
| Router Guards | 01-PROJECT-STRUCTURE.md | src/router |
| Build Scripts | 00-PROJECT-OVERVIEW.md | Scripts Disponibles |
📊 Estado de la Documentación
| Documento | Estado | Última Actualización |
|---|---|---|
| 00-PROJECT-OVERVIEW.md | ✅ Completo | 20/10/2025 |
| 01-PROJECT-STRUCTURE.md | ✅ Completo | 20/10/2025 |
| 02-LIBRARIES-AND-DEPENDENCIES.md | ✅ Completo | 20/10/2025 |
| 03-API-COMMUNICATION.md | ✅ Completo | 20/10/2025 |
| 04-COMPONENT-PATTERNS.md | ✅ Completo | 20/10/2025 |
| 07-DEPLOYMENT.md | ✅ Completo | 20/10/2025 |
| 08-ONBOARDING-GUIDE.md | ✅ Completo | 20/10/2025 |
| 09-UNUSED-COMPONENTS-ANALYSIS.md | ✅ Completo | 20/10/2025 |
🤝 Contribuir a la Documentación
Esta documentación es un documento vivo. Si encuentras:
- Información desactualizada
- Errores o inexactitudes
- Secciones que faltan
- Oportunidades de mejora
Por favor, actualiza la documentación:
- Edita el archivo markdown correspondiente
- Haz commit con mensaje descriptivo:
docs: actualizar [sección] - Crea Pull Request
📧 Contacto
Para preguntas sobre la documentación o el proyecto:
- Tech Lead: [Nombre/Email]
- Maintainer de Docs: [Nombre/Email]
- Canal de Slack/Teams: #frontend-dev
Generado: 20/10/2025 Versión: 1.0.0 Proyecto: Miglop.es V2 Frontend Stack: Vue 3 + TypeScript + Vite
Activar modo Debug WordPress + Incidencia Pide&Paga
Este contenido esta restringido para usuarios registrados y con un perfil específico. Si dispone de uno, pulsa en "acceder" para poder verlo.
Acceder
Estructura Proyecto glop-articulos Miglop.es
Este contenido esta restringido para usuarios registrados y con un perfil específico. Si dispone de uno, pulsa en "acceder" para poder verlo.
Acceder
Realizar pruebas de resolución de incidencias en instalación de Staging API Glop
Este contenido esta restringido para usuarios registrados y con un perfil específico. Si dispone de uno, pulsa en "acceder" para poder verlo.
Acceder
Migración de la API Rest de Miglop.es a App.glop.es
Este contenido esta restringido para usuarios registrados y con un perfil específico. Si dispone de uno, pulsa en "acceder" para poder verlo.
Acceder
Manual Creación de Sitios App.glop.es
Para empezar deberemos iniciar sesión en App.glop.es con un perfil SuperAdministrador.
Una vez dentro en el apartado Admin Sitios podremos agregar un nuevo Sitio.
Primero tendremos que elegir el nombre del sitio, el correo del administrador de este y la contraseña.
Seguidamente tendremos que seleccionar los planes que se le aplicarán a la subscripción del sitio.
Y finalmente introduciremos la licencia correspondiente al sitio.
Una vez creado el sitio, el correo electrónico anteriormente indicado recibirá un correo con el aviso de la creación del nuevo sitio en App.glop.es y otro con el enlace de cobro de la subscripción asignada.
Ya realizado el cobro, el sitio aparecerá como activo.
Además se podrá marcar el sitio según su tipo de suscripción, si es de tipo Saas o renting en cuyos casos podrán acceder a una sección limitada de la plataforma.
Revisión de localizaciones Ordatic
Este contenido esta restringido para usuarios registrados y con un perfil específico. Si dispone de uno, pulsa en "acceder" para poder verlo.
Acceder
Documentación sobre la pestaña Informes App.Glop.es
Tenemos dos tipos de Informes, de Ventas y de Compras.
En ambos tipos de informes podremos aplicar diferentes filtros.
TERMINALES: Filtrar datos según los terminales.
RANGOS: ver datos de ayer/hoy, de la ultima semana, del ultimo mes o del ultimo año.
FECHAS: modificar el rango, si lo tenemos en ayer /hoy seleccionar un dia, si lo tenemos en semana seleccionar la semana, si lo tenemos en mes seleccionar el mes y si lo tenemos en año seleccionar el año.
CONFIGURACION DE INFORMES: Los informes son configurables desde el perfil de cada usuario. Se pueden activar/desactivar ciertos informes y modificar la forma de visualización. También podremos configurar la comparativa, el refresco automático, el envío de informes, las opciones de zona y los bordes de los informes.
AJUSTES INFORMES VENTAS
AJUSTES INFORMES COMPRAS
AJUSTES DE LOS INFORMES
Documentación sobre la pestaña Agenda App.Glop.es
A nivel de licencia hay que añadir el check de «Reservas» y tener activo el módulo Cloud
Esta pestaña sólo estará visible para los administradores de sitios y usuarios de sitios siempre que tengan el módulo contratado.
Visión general
La hora a partir de la cual se muestran las reservas es configurable desde el apartado agenda de las configuraciones.
Botón nueva reserva
Al pulsar sobre este botón abriremos la pantalla para crear una nueva reserva
Botón filtros
Al pulsar sobre este botón abriremos la pantalla para poder aplicar diferentes filtros, los empleados y espacios disponibles para filtrar tan solo aparecerán si tienen ya una reserva asociada a ellos.
Dentro de esta vista podremos aplicar los filtros que deseemos o quitarlos de una forma facil pulsando el boton quitar filtros.
Calendario
Desde aquí podremos navegar entre los diferentes días/semanas/meses según la vista que tengamos seleccionada y visualizar las diferentes reservas.
Vistas día/semana/mes/agenda
Desde esta opción podremos seleccionar el tipo de vista entre ver por día/semana/mes o la vista agenda que también es semanal.
VISTA NUEVA RESERVA
Desde esta vista podremos crear una nueva reserva.
Desplegable estados; desde este desplegable podremos crear la reserva como confirmada, completada y cancelada. Confirmada será cuando la creamos, completada cuando ya esté cobrada y anulada cuando se anule la reserva. La edición de las reservas solo será posible en caso de estar confirmada. Al cobrar la reserva desde el TPV cambiara de estado a Completado.
Terminal: Podremos seleccionar a que terminal va cada una de las reservas, hay dos posibilidades o que el usuario tenga un terminal por defecto y ya lo tengamos seleccionado, o que por lo contrario no tenga uno por defecto y tengamos que elegir el terminal de cada una de las reservas.
Notas: Notas de la reserva, aqui podremos indicar cualquier nota que consideremos oportuna para que vaya asociada a la reserva.
Hora inicio: hora a la que empezará la reserva, podremos seleccionar la que consideremos oportuna.
Duración: duración del servicio, nos indica el tiempo que va a durar el servicio, en caso de no tener tiempo asignado inicialmente será 0. Tenga o no tenga tiempo predefinido se podrá modificar la duración. En el apartado de configuraciones podremos configurar el tiempo máximo que puede durar un servicio.
Servicio: Seleccionaremos el servicio.
Espacio: Seleccionaremos el espacio al que se asigna el servicio. Según la configuración del servicio podremos crear la reserva sin espacio
Empleado: Seleccionaremos el empleado al que se asigna el servicio. Según la configuración del servicio podremos crear la reserva sin empleado.
Cliente: Seleccionaremos un cliente de los ya creados o en caso de no estar creado lo podremos crear pulsando sobre nuevo cliente.
Icono papelea: Al pulsar sobre el eliminaremos el servicio asociado a la reserva.
+ Servicio: añadir mas servicios a la reserva.
Guardar: guardará la reserva.
Cancelar: cancelará la creación de la reserva.
VIDEO CREACION RESERVA
VIDEO EDICION RESERVA
VIDEO APLICACION FILTROS
VIDEO ELIMINACIÓN RESERVA
VIDEO RESERVA APARECE EN GLOP Y LA GESTIONAMOS
Tras crear la reserva la podremos ver en Glop y gestionarla.
VIDEO CONFIGURACIÓN DESDE GLOP
En este video podremos observar donde se encuentra el mantenimiento de espacios, como asignar a un empleado para que pueda realizar servicios y como asignar a un articulo (servicio) que es un servicio, los espacios, los empleados y la duración predeterminada del servicio.
Lo primero que podemos ver en el video es como se accede al mantenimiento de espacios, donde podremos crear, modificar y borrar. Estos espacios son los que después podrán ir asociados a un servicio.
Tras esto accedemos al mantenimiento de empleados, donde podemos ver como activar a los empleados si pueden realizar servicios o no. Para asignar un empleado a un servicio tiene que tener la opción de realiza servicios activa.
Por último accedemos a la configuración del artículo (servicio), donde activamos la opción de Es Servicio y donde configuraremos el tiempo predeterminado, los empleados y los espacios asociados. Los campos requiere empleado y requiere espacio los utilizaremos para que a la hora de crear la reserva nos pida asociar empleado y espacio obligatoriamente o nos permita crear la reserva sin alguno o ninguno de estos dos campos.