Flujo completo del comensal¶
Esta página recorre, paso a paso, todo lo que vive el comensal desde que escanea el QR de su mesa hasta que pide la cuenta. Te sirve para capacitar a tu personal, resolver dudas de clientes en la mesa y entender qué pasa "del otro lado" cuando llega un pedido autónomo.
El recorrido completo es:
- Escanear el QR de la mesa → se crea la sesión automáticamente.
- Validar la ubicación por GPS (solo si la mesa y la sucursal lo exigen).
- Navegar el menú digital: búsqueda, categorías, ordenamiento.
- Personalizar el platillo (término, modificadores, guarniciones, notas) — ver Personalización de platillos.
- Revisar el carrito y enviar el pedido a cocina.
- Seguir el estado del pedido en tiempo real, platillo por platillo.
- Llamar al mesero o pedir la cuenta desde el botón "Mesero" siempre visible.
El "cascarón" de todas las pantallas¶
Todas las páginas del menú QR comparten el mismo marco visual, optimizado para celular:
Barra superior¶
- Botón "Volver" (flecha): aparece solo en el detalle de producto y en el carrito; regresa al catálogo. En las demás pantallas se muestra el ícono de QR del sistema.
- Título de la página según dónde esté el comensal: "Menú", "Carrito", "Mis Pedidos", "Detalle", "Verificar Ubicación" o el nombre de la sucursal.
- Subtítulo "Mesa N": el número de la mesa de la sesión activa.
- Punto de conexión (a la derecha): verde = "Conectado" (las actualizaciones en tiempo real están funcionando); rojo = "Sin conexión".
Barra inferior de navegación¶
Visible solo cuando hay sesión activa con permiso de ordenar:
| Botón | Ícono | Qué hace |
|---|---|---|
| Menú | Cuadrícula | Abre el catálogo de platillos. |
| Carrito | Carrito | Abre el carrito; muestra un badge con el número de artículos cuando no está vacío. |
| Pedidos | Reloj | Abre el seguimiento de pedidos ("Mis Pedidos"). |
| Mesero | Campana | Abre el modal de "Llamar Mesero" (no navega a otra página). |
Notificaciones en tiempo real¶
Sin refrescar la página, el comensal ve y oye:
- Pedido confirmado → toast verde "Pedido #N confirmado" + sonido de confirmación.
- Platillo listo → toast "[Producto] está listo" + sonido.
- Varios platillos listos a la vez → toast "N platillos listos" + sonido + vibración del teléfono.
- Mesero en camino → toast informativo "El mesero va en camino" (respuesta a una llamada).
- Sesión finalizada (por el mesero/admin o fin de servicio) → toast con el motivo; se borra la sesión local y se saca al comensal del menú.
- Notificaciones generales del restaurante (información, éxito, aviso o error).
Los toasts se descartan solos a los 4 segundos.
Persistencia de la sesión y del carrito¶
Cerrar el navegador no pierde nada
La sesión y el carrito se guardan en el navegador del comensal (localStorage). Si cierra y reabre la página, la sesión y el carrito se restauran automáticamente y se revalidan contra el servidor. Si la sesión ya no es válida, se limpia y se le pide volver a escanear el QR.
Si ocurre un error inesperado en pantalla, aparece un mensaje "Algo salió mal" con botón Reintentar.
Paso 1 — Escanear el QR de la mesa¶
Al escanear el QR, el comensal llega a la página de aterrizaje del menú. No tiene que hacer nada: la sesión se crea automáticamente, sin cuenta ni contraseña (entra como invitado).
Lo que ve en pantalla:
- Cargando: spinner con el texto "Conectando con tu mesa...".
- Éxito: palomita verde con "Redirigiendo...". Se guarda la sesión, se conecta el canal en tiempo real y se le lleva:
- a Verificar ubicación, si la mesa exige validación GPS, o
- directo al catálogo, si no se requiere validación.
- Error: ícono de alerta con el título "No se pudo iniciar", el motivo del rechazo y botón Reintentar. Los motivos posibles (QR inválido, sin turno activo, mesa no iniciada, sin orden activa, comanda desactivada, límite de comensales) están detallados en la portada del Menú QR.
Datos que se registran al crear la sesión
Por auditoría, el sistema guarda la IP, el dispositivo, la plataforma y el navegador del comensal. Toda esta información es consultable después en el detalle de la sesión.
Tipos y duración de la sesión¶
- Tipos de sesión: Invitado (el flujo normal por QR), Cliente Registrado y Cliente App.
- Duración: la define la configuración de la mesa (por defecto 3 horas). Al vencer, la sesión expira y hay que escanear el QR de nuevo.
- Multi-comensal: varias personas de la misma mesa pueden escanear el mismo QR y tener sesiones propias, hasta el límite configurado en la mesa.
Pantalla "Sesión no disponible"¶
Si el comensal entra al menú sin sesión válida (expiró, fue cerrada o nunca existió), cae en una pantalla informativa con un ícono grande de escaneo QR, el título "Sesión no disponible" y el mensaje: "Tu sesión ha expirado o no se encontró una sesión activa. Escanea nuevamente el código QR de tu mesa para continuar."
- Si en realidad sí tiene sesión activa con permiso de ordenar, se le redirige solo al catálogo.
- Si tiene sesión pero le falta validar ubicación, se le redirige a la validación.
- Esta pantalla no tiene botones: la única salida es volver a escanear el QR físico de la mesa.
Paso 2 — Validación de ubicación (GPS)¶
¿Por qué existe?¶
Es una medida antifraude: confirma que quien ordena está físicamente dentro del restaurante, y no alguien que fotografió el QR y ordena desde fuera. Solo se pide cuando tanto la mesa como la sucursal tienen activada la opción "Requiere Validación de Ubicación". La validación compara la distancia GPS del comensal contra el radio en metros configurado en la sucursal (la "geocerca").
Qué ve el comensal (5 estados)¶
- Solicitar: ícono de pin de mapa, título "Verificar ubicación", texto explicativo ("Para ordenar necesitamos confirmar que estás en el restaurante. Permite el acceso a tu ubicación.") y botón "Permitir ubicación" (muestra spinner y "Obteniendo ubicación..." mientras trabaja).
- Validando: spinner con "Verificando tu ubicación...".
- Exitosa: palomita verde, "Ubicación verificada", "Ya puedes ordenar desde tu mesa." → redirige al catálogo tras 1.5 segundos. La sesión pasa a estado Activa y se habilita el permiso de ordenar.
- Fallida: tache rojo, "Verificación fallida", el motivo (por ejemplo "Tu ubicación está a Xm del restaurante"), un contador de "Intentos restantes: N" y botón "Intentar de nuevo". Si se agotan los intentos, muestra: "Solicita ayuda a tu mesero para que habilite tu mesa." (sin botón).
- Error de GPS: ícono ámbar, "Ubicación no disponible", el error del navegador (permiso denegado, GPS apagado…) y botón Reintentar.
Reglas¶
- Máximo 3 intentos de validación por sesión; cada intento queda registrado.
- Si la sesión ya estaba validada, entrar de nuevo a esta pantalla redirige automáticamente al catálogo.
Qué hacer si la validación falla
- El comensal debe aceptar el permiso de ubicación del navegador; si lo niega, verá "Ubicación no disponible". Puede reactivarlo en los ajustes del navegador y tocar Reintentar.
- En locales con mala señal GPS (interiores, sótanos), la validación puede fallar aunque el cliente sí esté en el restaurante. En ese caso, el mesero o gerente puede desactivar la validación de esa mesa o tomar el pedido de forma tradicional.
- Si se agotaron los 3 intentos, la sesión ya no puede validarse sola: el personal debe intervenir.
Paso 3 — Navegar el catálogo¶
El menú digital muestra los platillos disponibles de la sucursal, con estas herramientas:
- Buscador ("Buscar platillos..."): busca mientras se escribe (con una pequeña espera de 0.4 s) y tiene botón X para limpiar la búsqueda.
- Chips de categorías desplazables horizontalmente: el chip "Todos" más un chip por categoría con su conteo de productos (por ejemplo "Cortes (12)"). El chip activo se resalta; tocar uno filtra la lista al instante.
- Selector "Ordenar:" con las opciones Más pedidos (por defecto), Nombre, Precio ↑, Precio ↓ y Nuevos.
- Cuadrícula de tarjetas de producto, cada una con:
- Foto del platillo (o ícono de imagen si no tiene foto).
- Badges sobre la foto:
Nuevo,Popular,Chef(recomendado del chef),Picante. - Nombre, precio y, si aplica, tiempo estimado de preparación ("~N min").
- Botón "Cargar más" al final: paginación de 20 en 20, con spinner mientras carga.
- Estados especiales: "No se encontraron platillos" (búsqueda sin resultados) y mensaje de error con botón Reintentar.
Tocar una tarjeta abre el detalle del producto, donde el comensal lo personaliza antes de agregarlo — ver Personalización de platillos.
Precios de comedor
Los precios que ve el comensal en el menú QR son los de comedor y pueden diferir de otros canales de venta.
Paso 4 — Carrito y envío del pedido¶
En el carrito el comensal revisa lo elegido, ajusta cantidades y envía el pedido.
Elementos del carrito¶
- Carrito vacío: ícono de carrito, texto "Tu carrito está vacío" y botón "Ver menú".
- Lista de artículos, cada renglón con:
- Foto miniatura y nombre del producto.
- Extras seleccionados como texto: término de carne, modificadores y guarniciones.
- Notas del artículo (en cursiva).
- Control de cantidad − / +: si la cantidad baja a 0, el artículo se elimina del carrito.
- Precio total del renglón (precio con extras × cantidad).
- Botón de bote de basura para eliminar el artículo directamente.
- "Notas del pedido": cuadro de texto para indicaciones generales de todo el pedido ("Indicaciones generales para tu pedido...").
- Resumen: renglón "Subtotal (N items)" y renglón Total.
- Botón fijo "Enviar Pedido — $Total".
- Zona de mensaje de error en rojo si el envío falla.
Envío con confirmación en dos pasos¶
- El comensal toca Enviar Pedido.
- Aparece la pregunta "¿Confirmar envío del pedido?" con botones Cancelar y Confirmar (este último muestra spinner mientras envía). Esto evita envíos accidentales.
- Si sale bien: el carrito se vacía, aparece el toast verde "Pedido enviado a cocina" y se navega automáticamente a Mis Pedidos.
- Si falla: se muestra el motivo (por ejemplo, límite de productos excedido o sesión no activa) y el comensal puede corregir y reintentar.
Reglas del envío¶
Límites del pedido
- Máximo 10 artículos distintos por pedido (configurable por sesión). Si se excede, el envío se rechaza con el mensaje correspondiente.
- El gasto acumulado de la sesión se incrementa con cada pedido; si el administrador configuró un límite de gasto, se controla contra ese tope.
- Se pueden enviar varios pedidos en la misma sesión (rondas): cada uno se numera #1, #2, #3…
- El carrito persiste aunque se cierre el navegador, mientras la sesión siga viva.
¿Y la confirmación por mesero?¶
Al enviarse el pedido, se generan las comandas por área de preparación y la orden de la mesa pasa a "En Preparación". El mesero asignado recibe al instante la notificación "Nuevo pedido autónomo en mesa X" con el número de productos y el total.
Envío directo a cocina por defecto
En la operación actual el pedido se envía directo a cocina sin confirmación previa del mesero. La confirmación por mesero existe como opción del flujo (estados EsperandoConfirmacion → Confirmado/Rechazado), pero está desactivada por defecto.
Paso 5 — Seguimiento del pedido en vivo ("Mis Pedidos")¶
Esta pantalla es el "tablero" del comensal: ve el avance de su comida en tiempo real y el total de su cuenta.
Qué muestra¶
- Encabezado de la orden: etiqueta "Orden" con el folio y un badge con el estado global de la orden.
- Una tarjeta por cada pedido enviado, con:
- "Pedido #N", hora de envío y tiempo estimado ("~N min") si existe.
- Badge de estado del pedido.
- Lista de artículos: miniatura, nombre, cantidad ("xN"), tiempo estimado por platillo y badge de estado individual por platillo.
- Tarjeta de totales: Subtotal, IVA y Total.
- Botón "Ordenar más" → regresa al catálogo.
- Estado vacío: "Aún no tienes pedidos" con botón "Ver menú".
Estados que ve el comensal¶
| Estado | Significado | Qué sigue |
|---|---|---|
| Pendiente (gris/ámbar) | Pedido registrado, aún no procesado en cocina. | En Cocina |
| En Cocina (azul) | La comanda ya llegó a cocina. | Preparando |
| Preparando (azul) | El platillo se está cocinando. | Listo |
| Listo (verde) | El platillo salió de cocina; el mesero lo llevará a la mesa. | Entregado |
| Entregado (gris) | Ya está en la mesa. | — (estado final) |
El estado de la orden completa también se muestra con badge: Activa, Servida, Pendiente de Pago, Pagada, Cancelada o Completada.
Comportamiento en tiempo real¶
- Los cambios de estado llegan solos, sin refrescar: por platillo, por pedido y de la orden completa (el estado de cada pedido se recalcula a partir de sus platillos).
- Cuando un platillo pasa a Listo: toast + sonido (y vibración si son varios a la vez).
- Como respaldo por si se pierde la conexión, la página se refresca sola cada 15 segundos.
Pre-cuenta en vivo
Esta pantalla funciona como una pre-cuenta: el Total incluye el IVA de todo lo pedido en la sesión, así el comensal sabe cuánto lleva gastado antes de pedir la cuenta.
Llamar al mesero¶
El botón Mesero (campana) de la barra inferior abre una hoja deslizante con estas opciones:
| Opción | Tipo de llamada | Mensaje de confirmación |
|---|---|---|
| "Necesito atención" | General | "Mesero notificado, viene en camino" |
| "Pedir la cuenta" | PedirCuenta | "Cuenta solicitada, el mesero viene en camino" |
| "Otra solicitud" | OtroServicio | "Solicitud enviada al mesero" |
| Cancelar | — | Cierra el modal sin enviar nada. |
La opción "Otra solicitud" abre un cuadro de texto (máximo 500 caracteres) para escribir la petición, con botones Enviar (deshabilitado si el texto está vacío) y Volver.
Si el envío falla, el comensal ve el toast de error "No se pudo contactar al mesero. Intenta de nuevo." o "Error de conexión."
Tipos de llamada que maneja el sistema¶
Los tres primeros los genera el comensal desde esta interfaz; el resto se generan en otros flujos del sistema:
- General — atención en la mesa.
- PedirCuenta — solicitud de cuenta.
- OtroServicio — solicitud de texto libre.
- SolicitarAyuda, PedirAgua, Queja, PlatillosListos — generados en otros flujos.
Estados de una llamada¶
| Estado | Significado | Qué sigue |
|---|---|---|
| Pendiente | La llamada se registró y espera al mesero. | Vista |
| Vista | El mesero ya la vio. | EnCamino |
| EnCamino | El mesero va hacia la mesa (el comensal recibe el toast "El mesero va en camino"). | Atendida |
| Atendida | La solicitud fue resuelta. | — (estado final) |
| Cancelada | La llamada se canceló (por ejemplo, al expirar la sesión). | — (estado final) |
El tiempo de respuesta se mide
El sistema registra el tiempo de respuesta en segundos de cada llamada. Puedes consultarlo por sesión en el detalle de sesiones para medir la calidad de tu servicio.
Pedir la cuenta¶
- El comensal toca Mesero → "Pedir la cuenta" en la barra inferior.
- Se envía una llamada de tipo PedirCuenta y el comensal ve el toast "Cuenta solicitada, el mesero viene en camino".
- El mesero recibe la solicitud y acude a la mesa.
El pago no se hace desde el teléfono
El menú QR no cobra directamente: el pago se realiza con el mesero o en caja. La pantalla "Mis Pedidos" sirve como pre-cuenta con IVA incluido, pero el cierre y cobro de la orden se gestiona en los módulos de mesero y operación.
Practica el flujo completo en el demo
En https://demo.consul.rest (usuarios admin / gerente / mesero1, contraseña Demo123!) puedes iniciar una mesa como mesero, escanear/abrir la URL del QR como comensal y seguir todo el recorrido: pedido, notificaciones en vivo y llamada al mesero.