Zonix Admin Analytics Ui

Patrón visual:

• Fondo surface (claro u oscuro según tema).
• Ícono a la izquierda (ej. money, shopping_bag, timer).
• Valor grande (ej. \$1,250.00).
• Subtítulo pequeño (“Ventas últimos 7 días”).

4. Gráficos

Tipos recomendados:

• Línea o área: ventas por día.
• Barras: órdenes por estado, top productos, top comercios.

Buenas prácticas:

• Limitar cantidad de puntos (máx. 30).
• Mostrar leyenda clara.
• Permitir tap en barra o punto para ver detalle (tooltip).

5. Tablas de Detalle

Usos comunes:

• Lista de órdenes con columnas: ID, comercio, total, estado, fecha.
• Top productos: nombre, categoría, cantidad vendida, ingreso.
• Comercios: nombre, ventas, comisión, estado.

Recomendaciones:

• Paginación en frontend alineada con backend (ver zonix-analytics § 2).
• Ordenamiento por columnas clave (fecha, total, estado).

6. Estados de Carga

• Loading:
  • Shimmer en cards y barras placeholder.
• Sin datos:
  • Mensaje “No hay datos para este rango de fechas” + sugerir cambiar filtro.
• Error:
  • Banner rojo o SnackBar con texto corto + botón "Reintentar".

7. Cross-references

• Consultas de analytics: zonix-analytics (backend).
• Pagos y montos: zonix-payments § 5.
• Estados de orden: zonix-order-lifecycle § 1-2.