Lección: 26 LISTADO de los USUARIOS desde la BASE DE DATOS en el SISTEMA VETERINARIO(PHP y MySql)FullStack

26 LISTADO de los USUARIOS desde la BASE DE DATOS en el SISTEMA VETERINARIO(PHP y MySql)FullStack

Duración: 18 min

Módulo: 👤 CRUD Completo de Usuarios (Gestión de Datos) Lección 1 de 12

Descripción

🎬 Lección 26: Listado de Usuarios desde la Base de Datos 💾

El objetivo es crear una tabla visualmente atractiva y funcional que muestre todos los registros de la tabla tb_usuarios.

1. Diseño de la Vista (View) 🖼️

El instructor comienza a trabajar en la vista de listado (admin/usuarios/index.php), utilizando componentes de la plantilla AdminLTE y Bootstrap para el diseño:

Contenedor Principal: Se utiliza un Card de AdminLTE para encapsular el listado, dándole un título (Usuarios Registrados). [02:48]
Estructura de la Tabla: Se define la tabla (<table>) utilizando las siguientes clases de Bootstrap para estilizado y funcionalidad: [06:43]
- table-responsive: Para asegurar la adaptabilidad móvil.
- table-bordered: Para añadir bordes a las celdas.
- table-hover: Para resaltar filas al pasar el cursor.

2. Controlador y Consulta SQL 🔍

Se crea un controlador específico (app/controllers/usuarios/listado_usuarios.php) para manejar la lógica de negocio y la conexión con la base de datos:

Consulta: Se ejecuta una consulta simple para obtener todos los campos de todos los usuarios registrados: [10:20]
SQL
SELECT * FROM tb_usuarios
Resultado: El controlador utiliza PDO para ejecutar esta consulta y almacenar el resultado (la lista de usuarios) en un array o variable que será accesible desde la vista. [10:41]

3. Despliegue de Datos (Foreach) 🔄

En el cuerpo de la tabla (<tbody>), se incluye el controlador y se utiliza un bucle foreach de PHP para iterar sobre la lista de usuarios. Dentro del bucle, se imprime cada fila (<tr>) y sus celdas (<td>) extrayendo los datos de la base: [11:58]

Cabecera de Columna	Campo de la Base de Datos
N°	ID_usuario [13:47]
Nombre Completo	nombre_completo [14:03]
Email	email [14:18]
Cargo	cargo [14:21]

4. Acciones de Usuario ⚙️

Se añade la columna "Acciones" al final de la tabla, la cual contendrá botones para interactuar con cada registro individual: [16:08]

Acción	Icono	Color (Clase Bootstrap)	Propósito
Ver	👀	btn-info (Azul)	Mostrar información detallada del usuario.
Editar	✏️	btn-success (Verde)	Modificar los datos del usuario.
Eliminar	🗑️	btn-danger (Rojo)	Eliminar el registro de la base de datos.

Próximo Paso: El siguiente video se enfocará en crear la vista de creación de usuarios (create.php) para insertar nuevos registros a través del formulario, y no de forma manual en la base de datos. [18:05]

Hilari Web