50 👤 DASHBOARD del CLIENTE: Vista Mi Cuenta, Menú y Listado de Pedidos Frontend | Laravel 12
Duración: 14 min¡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].
Lecciones
Apoya este proyecto
Si te gusta nuestro contenido, ¡apóyanos con una donación!
Donar por Airtm Donar por Binance¡Gracias por tu apoyo! ❤️