$_meta) { $groupedProducts[$category] = []; } foreach ($products as $product) { $groupedProducts[$product['category']][] = $product; } $groupedProducts = array_filter($groupedProducts, static fn (array $items): bool => $items !== []); $cartSummary = pos_cart_summary(); $recentSales = pos_recent_sales(8); $metrics = pos_today_metrics(); $lowStockCount = pos_low_stock_count(); $lowStockProducts = pos_low_stock_products(6); $cssVersion = file_exists(__DIR__ . '/assets/css/custom.css') ? (string)filemtime(__DIR__ . '/assets/css/custom.css') : (string)time(); $jsVersion = file_exists(__DIR__ . '/assets/js/main.js') ? (string)filemtime(__DIR__ . '/assets/js/main.js') : (string)time(); $flashClassMap = [ 'success' => 'text-bg-success', 'danger' => 'text-bg-danger', 'warning' => 'text-bg-warning', 'secondary' => 'text-bg-secondary', 'info' => 'text-bg-primary', ]; $toLower = static function (string $value): string { if (function_exists('mb_strtolower')) { return mb_strtolower($value, 'UTF-8'); } return strtolower($value); }; ?> <?= htmlspecialchars($pageTitle) ?>
Diseño limpio, alto contraste, flujo corto

Vende en tres pasos y con menos errores.

Catálogo por categorías, canasta siempre visible, recibos claros y alertas de stock bajo. Este primer MVP está listo para conectar con NestJS más adelante sin cambiar la experiencia de caja.

1 Selecciona

Elige una categoría con botones grandes y visibles.

2 Agrega

Presiona “Agregar” una sola vez para llevarlo a la canasta.

3 Confirma

Registra la venta y genera un recibo simple al instante.

Iniciar sesión Ver estado del sistema
Qué incluye esta entrega

Primer flujo real

  • Login con roles Admin y Cajero
  • Productos agrupados por categoría
  • Canasta con total y anulación rápida
  • Registro de venta con recibo
  • Lista de ventas recientes
  • Control de stock con alertas
Escalable: la UI queda lista para mover autenticación, productos y ventas a endpoints de NestJS en una siguiente iteración.
Acceso rápido con PIN

Entrar al punto de venta

Usa un código corto y un PIN de cuatro dígitos. Esto es ideal para una caja con operadores frecuentes.

Accesos de prueba

Roles listos para probar

Autocompleta el formulario con un toque
$demoUser): ?>
Admin

Ajusta stock y supervisa alertas críticas.

Cajero

Vende rápido sin entrar a pantallas complejas.

Recibos

Consulta la venta al detalle con un clic.

Caja activa

Hola, .

Usa el flujo corto: categoría, agregar a canasta y confirmar venta. Todo lo esencial está visible en la misma pantalla.

1. Elegir categoría 2. Agregar productos 3. Registrar venta
Ventas hoy Operaciones registradas hoy
Total vendido Acumulado del día
Alertas Productos con stock bajo
0): ?>
Atención visible

Hay productos con stock por debajo del umbral.

Esto ayuda a evitar ventas fallidas y a reponer inventario a tiempo.

Revisar stock
Historial

Ventas recientes

Cada venta queda guardada con total, fecha y enlace al recibo.

Ver último recibo
Todavía no hay ventas registradas.

Cuando confirmes una venta aparecerá aquí automáticamente.

Recibo Fecha Cajero Items Total
Ver detalle
Administración

Control de stock

Ajusta inventario con botones directos y alertas visibles cuando la cantidad sea crítica.

Solo admin
Producto Categoría Stock actual Umbral Acciones
Bajo
Avisos visibles

Stock que requiere apoyo del administrador

Como cajero puedes ver qué productos están por acabarse para pedir reposición.

Lectura
Todo el stock está dentro del nivel esperado.

No hay alertas activas por ahora.

Actual: · Umbral: