50 👤 DASHBOARD del CLIENTE: Vista Mi Cuenta, Menú y Listado de Pedidos Frontend | Laravel 12

Duración: 14 min
Módulo: ⚙️ Gestión de Órdenes, Perfiles y Características Avanzadas 43-61 Lección 8 de 19

¡Contenido Exclusivo!

Adquiere este curso para tener acceso inmediato a esta y a **todas las lecciones Premium**.

Inscribirse Ahora por $10.00 Acceso instantáneo de por vida y código fuente incluido.

Descripción

Lección 50: 👤 DASHBOARD del CLIENTE | Vista Mi Cuenta, Menú y Listado de Pedidos en Frontend

Esta lección marca un paso crucial para la experiencia del usuario, al crear un área personal dedicada para los clientes, conocida como "Mi Cuenta" o Dashboard del Cliente. Esto soluciona el problema de la redirección incorrecta y provee un espacio elegante para gestionar sus pedidos.

🏠 Configuración del Panel de Cliente (Dashboard)

El enfoque se centra en adaptar una plantilla profesional para que sirva como el centro de gestión para el usuario autenticado:

  • Selección de Plantilla ✨: Se elige y adapta la vista Account de la plantilla (Nice Admin) para crear una interfaz limpia y funcional para la cuenta del cliente [00:53].
  • Integración de la Vista 🖥️: Se reemplaza el contenido estático del archivo dashboard.blade.php con la estructura base de la plantilla de cuenta, asegurando que la apariencia sea elegante [03:04].
  • Menú de Navegación 🧭: Se configura la opción "Mi Perfil" en el menú principal para que redirija al nuevo Dashboard del cliente, corrigiendo la redirección anterior que llevaba al panel de administrador [05:05].

🔢 Métricas Clave y Consultas Relacionales

Para hacer que la vista sea dinámica y personalizada, se realizan consultas específicas en el controlador:

  • Conteo de Pedidos 📊: Se calcula el número total de pedidos realizados por el usuario autenticado. Se consulta el modelo Orden y se filtra con la condición where('usuario_id', Auth::user()->id) para obtener solo las transacciones del cliente actual [08:18].
  • Carga de Configuración ⚙️: Se asegura que la variable de configuración de la tienda ($ajuste) esté disponible en la vista para mantener la coherencia de la marca en el frontend [06:40].
  • Consulta de Pedidos 📦: Se prepara una consulta relacional avanzada para obtener todo el historial de órdenes del cliente. Se utiliza with('usuario', 'detalles') para cargar los detalles del producto y la información del usuario junto con cada orden, preparándola para el listado [12:37].

🖼️ Estructura de la Vista de Pedidos

La vista se simplifica para centrarse inicialmente en el historial de pedidos:

  • Se elimina el contenido estático de otras secciones (métodos de pago, direcciones, etc.) de la plantilla base para dejar solo el contenedor donde se listarán las órdenes [11:57].
  • Se establece una estructura de tarjeta (Card) de ejemplo para mostrar de forma elegante cada orden con su ID, fecha de compra y estado del proceso [12:05].