File "usuariosApp-20260419160211.php"

Full Path: C:/wamp64/www/casos_medicos1/views/usuariosApp-20260419160211.php
File size: 3.52 KB
MIME-type: text/html
Charset: utf-8

 
Open Edit   Advanced Editor   Back 
<!DOCTYPE html>
<html lang="es">

<head>
    <meta charset="utf-8">
    <title>Usuarios</title>

    <!-- Bootstrap -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">

    <!-- Bootstrap Icons -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css">

    <style>
        /* CONTENEDOR */
        .usuarios-box {
            background: #e2e2e2ff;
            border-radius: 12px;
            padding: 25px;
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
            border: 1px solid #e8e8e8;
        }

        /* TÍTULO */
        .usuarios-titulo {
            font-size: 1.6rem;
            font-weight: 600;
            color: #333;
            display: flex;
            align-items: center;
            gap: 8px;
        }

        .usuarios-titulo i {
            color: #0d6efd;
            font-size: 1.5rem;
        }

        /* BOTÓN NUEVO USUARIO */
        .btn-nuevo {
            border-radius: 8px;
            padding: 6px 14px;
        }

        /* TABLA */
        .usuarios-table {
            margin-top: 0px;
            border-radius: 10px;
            overflow: hidden;
            margin-bottom: 0;
        }

        .usuarios-table tbody tr:hover {
            background: #123d94ff;
        }

        /* CELDAS */

        .usuarios-table th {
            padding-top: 10px !important;
            padding-bottom: 10px !important;
            background: #8ddf67ff;
            min-width: 150px;
        }

        /* ICONOS DE PERFIL */
        .perfil-badge {
            padding: 4px 10px;
            border-radius: 20px;
            font-size: 0.75rem;
            font-weight: 600;
        }

        .perfil-admin {
            background: #ffe4e4;
            color: #b40000;
        }

        .perfil-user {
            background: #e4f2ff;
            color: #00488a;
        }
    </style>
</head>

<body class="bg-light">

    <div class="container p-4">

        <h4 class="usuarios-titulo">
            <i class="bi bi-people"></i> Usuarios
        </h4>

        <a href="<?= BASE_URL ?>CrearUsuario/nuevo" class="btn btn-primary btn-sm btn-nuevo mb-3">
            <i class="bi bi-person-plus"></i> Crear Un Nuevo Usuario
        </a>

        <div class="usuarios-box">
            <table class="table table-sm usuarios-table">
                <thead>
                    <tr>
                        <th>Nombre</th>
                        <th>Usuario</th>
                        <th>Perfil</th>
                    </tr>
                </thead>
                <tbody>
                    <?php foreach ($usuarios as $u): ?>
                        <tr>
                            <td><?= htmlspecialchars($u['nombre']) ?></td>
                            <td><?= htmlspecialchars($u['usuario']) ?></td>
                            <td>
                                <?php if ($u['perfil'] == 'Administrador'): ?>
                                    <span class="perfil-badge perfil-admin">Administrador</span>
                                <?php else: ?>
                                    <span class="perfil-badge perfil-user">Usuario</span>
                                <?php endif; ?>
                            </td>
                        </tr>
                    <?php endforeach; ?>
                </tbody>
            </table>
        </div>

    </div>

</body>

</html>