70 Login personalizado en el Sistema de Reserva de Citas Medicas con LARAVEL(PHP-MySql) FullStack
Duración: 10 min
Módulo: ⏰ Horarios y Lógica de Disponibilidad
Lección 11 de
11
Descripción
🎨🔒 Lección 70: Implementación de un Login Personalizado para el Sistema
Esta lección se enfoca en personalizar la vista de Inicio de Sesión (login.blade.php) de Laravel, reemplazando la interfaz genérica con un diseño que se integre al estilo visual de la nueva plantilla pública (AdminLTE).
⚙️ 1. Reemplazo de la Vista de Login
Para lograr una interfaz más profesional y coherente, se reutiliza una plantilla de AdminLTE.
- Plantilla Base: Se selecciona un modelo de login predefinido de la plantilla AdminLTE [00:45].
- Migración de Código: El contenido HTML de la plantilla de AdminLTE se copia y se pega en el archivo login.blade.php de Laravel, eliminando el diseño anterior [01:21].
- Reintegración de Funcionalidad: Los campos del formulario de la plantilla se ajustan para utilizar las etiquetas y las directivas de Blade del formulario de login original de Laravel (para campos como email y password) [02:48].
🖼️ 2. Estilización y Diseño de la Vista
Se aplican estilos para que la página de login coincida con la plantilla web principal.
- Fondo Personalizado: Se aplica la imagen de fondo utilizada en la plantilla principal a la etiqueta <body> de la vista de login mediante CSS en línea [03:36].
- Se utilizan propiedades CSS como background-repeat: no-repeat, background-size: 100% 100vh y background-attachment: fixed para asegurar que la imagen cubra toda la pantalla de forma estática [00:04:09 - 00:04:46].
- Ajustes de Layout:
- Se añade la marca "Sis Medical" y el título "Inicio de Sesión" a la interfaz [04:52].
- Se utiliza form-group y la clase col-md-12 en los campos de correo electrónico y contraseña para que ocupen todo el ancho y se vean más limpios [00:07:19 - 00:07:44].
- Los textos y etiquetas se traducen al español (ej. "correo electrónico" y "contraseña") [07:53].
- El botón de ingreso se extiende usando la clase btn-block [08:53].
🔑 3. Verificación de Funcionamiento
- Prueba Final: Se verifica que, a pesar de los cambios de diseño, la funcionalidad de ingreso y el cierre de sesión se mantengan operativos y lleven al usuario al panel de administración [09:30].
Siguiente Paso: La próxima lección se centrará en aplicar un diseño personalizado similar a la vista de Registro de Usuarios.
Lecciones
⚙️ Inicio y Estructura Base
👤 CRUD de Usuarios y UX Avanzada
Lección 2. 10 Listado de usuarios del controllador a la vista en el SISTEMA (PHP y MySql)FullStack
9 min
Lección 3. 11 Diseño de tabla con BOOTSTRAP en la vista en el SISTEMA (PHP y MySql) FullStack
12 min
Lección 6. 14 Registro y validación de datos para USUARIOS en el SISTEMA (PHP y MySql)FullStack
16 min
👩💼 Módulo de Secretarias
🤒 Gestión de Pacientes
Lección 4. 38 Como llamar desde un seeder a un factory de pacientes en LARAVEL(PHP-MySql) FullStack
14 min
Lección 8. 42 Show Pacientes en el sistema de reservas de citas medicas LARAVEL(PHP-MySql) FullStack
12 min
Lección 9. 43 EDIT Pacientes en el sistema de reservas de citas medicas LARAVEL(PHP-MySql) FullStack
14 min
🏥 Infraestructura: Consultorios y Doctores
⏰ Horarios y Lógica de Disponibilidad
Lección 1. 60 Calendario de Atención de Doctores en el sistema con LARAVEL(PHP-MySql) FullStack
14 min
Lección 10. 69 Plantilla Web para el sistema de reserva de citas con LARAVEL(PHP-MySql) FullStack
13 min
🔑 Seguridad, Roles y Permisos
Lección 6. 76 Identificando el ROL de cada Usuario en el Sistema con LARAVEL(PHP-MySql) FullStack
11 min
Lección 8. 78 Mostrar el Menú según los Roles y Permisos en Sistema con LARAVEL(PHP-MySql) FullStack
7 min
Lección 9. 79 Acceso No Autorizado con Roles y Permisos en Sistema con LARAVEL(PHP-MySql) FullStack
14 min
Lección 12. 82 Cargar Horario en la página principal en Sistema con LARAVEL(PHP-MySql) FullStack
16 min
Lección 13. 83 Redirigir a ADMIN desde Login y Register en Sistema con LARAVEL(PHP-MySql) FullStack
12 min
🗓️ Reserva de Citas y FullCalendar
Lección 2. 87 Formulario para Registrar Citas Medicas del Sistema con LARAVEL(PHP-MySql) FullStack
18 min
Lección 3. 88 Guardar Cita Medica en la Base de Datos de Sistema con LARAVEL(PHP-MySql) FullStack
15 min
Lección 9. 94 Cargar Reservas de Citas Medicas con AJAX del Sistema con LARAVEL(PHP-MySql) FullStack
20 min
📝 Historial Clínico, Configuraciones y Reportes
Lección 17. 116 Modificación del Historial Clínico del Sistema con LARAVEL(PHP-MySql) FullStack
15 min
Lección 19. 118 Reporte Impreso del Historial Clínico del Sistema con LARAVEL(PHP-MySql) FullStack
17 min
Lección 20. 119 Buscar Pacientes del Historial Clínico del Sistema con LARAVEL(PHP-MySql) FullStack
17 min
Lección 21. 120 Buscar Pacientes del Historial Clínico del Sistema con LARAVEL(PHP-MySql) FullStack
12 min
💵 Pagos, Impresión y Cierre
Apoya este proyecto
Si te gusta nuestro contenido, ¡apóyanos con una donación!
Donar por Airtm Donar por Binance¡Gracias por tu apoyo! ❤️