144 lines
8.8 KiB
PHP
144 lines
8.8 KiB
PHP
<?php
|
|
require_once 'config/database.php';
|
|
require_once 'includes/header.php';
|
|
|
|
requireRole(['superadmin', 'admin']);
|
|
|
|
try {
|
|
$stmt = $db->query("SELECT * FROM users ORDER BY created_at DESC");
|
|
$users = $stmt->fetchAll();
|
|
} catch (PDOException $e) {
|
|
$error = "Error al cargar los usuarios.";
|
|
}
|
|
?>
|
|
|
|
<div class="mb-8 flex justify-between items-end animate-fade-in">
|
|
<div>
|
|
<h1 class="text-3xl font-bold text-slate-800 tracking-tight">Gestión de Usuarios</h1>
|
|
<p class="text-slate-500 mt-2">Administra el acceso al sistema de Consultoría Jurídica.</p>
|
|
</div>
|
|
<button onclick="document.getElementById('modal-add-user').classList.remove('hidden')" class="bg-primary hover:bg-slate-800 text-white px-6 py-2.5 rounded-xl font-bold text-sm tracking-wider uppercase transition-all shadow-lg hover:shadow-xl hover:-translate-y-0.5 flex items-center gap-2">
|
|
<i class="fas fa-plus"></i> Nuevo Usuario
|
|
</button>
|
|
</div>
|
|
|
|
<?php if (isset($_SESSION['success'])): ?>
|
|
<div class="bg-emerald-50 border-l-4 border-emerald-500 p-4 mb-6 rounded-r-lg shadow-sm">
|
|
<p class="text-sm text-emerald-700 font-medium"><?= htmlspecialchars($_SESSION['success']); unset($_SESSION['success']); ?></p>
|
|
</div>
|
|
<?php endif; ?>
|
|
<?php if (isset($_SESSION['error'])): ?>
|
|
<div class="bg-red-50 border-l-4 border-red-500 p-4 mb-6 rounded-r-lg shadow-sm">
|
|
<p class="text-sm text-red-700 font-medium"><?= htmlspecialchars($_SESSION['error']); unset($_SESSION['error']); ?></p>
|
|
</div>
|
|
<?php endif; ?>
|
|
|
|
<div class="bg-white rounded-2xl shadow-sm border border-slate-100 overflow-hidden animate-fade-in-delayed">
|
|
<div class="overflow-x-auto">
|
|
<table class="w-full text-left border-collapse">
|
|
<thead>
|
|
<tr>
|
|
<th class="px-6 py-4 text-xs font-bold text-slate-500 uppercase tracking-wider bg-slate-50">Nombre / Usuario</th>
|
|
<th class="px-6 py-4 text-xs font-bold text-slate-500 uppercase tracking-wider bg-slate-50">Rol de Acceso</th>
|
|
<th class="px-6 py-4 text-xs font-bold text-slate-500 uppercase tracking-wider bg-slate-50">Fecha Creación</th>
|
|
<th class="px-6 py-4 text-xs font-bold text-slate-500 uppercase tracking-wider bg-slate-50 text-right">Acciones</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody class="divide-y divide-slate-100">
|
|
<?php foreach($users as $u): ?>
|
|
<tr class="hover:bg-slate-50 transition-colors">
|
|
<td class="px-6 py-4">
|
|
<div class="flex items-center gap-3">
|
|
<div class="w-10 h-10 rounded-full bg-slate-100 border border-slate-200 flex items-center justify-center text-slate-500 font-bold shadow-inner">
|
|
<?= strtoupper(substr($u['name'], 0, 1)) ?>
|
|
</div>
|
|
<div>
|
|
<p class="text-sm font-bold text-slate-800"><?= htmlspecialchars($u['name']) ?></p>
|
|
<p class="text-xs text-slate-500 mt-0.5 font-medium">@<?= htmlspecialchars($u['username']) ?></p>
|
|
</div>
|
|
</div>
|
|
</td>
|
|
<td class="px-6 py-4">
|
|
<?php
|
|
$roleClasses = [
|
|
'superadmin' => 'bg-purple-100 text-purple-800 border-purple-200',
|
|
'admin' => 'bg-blue-100 text-blue-800 border-blue-200',
|
|
'supervisor' => 'bg-amber-100 text-amber-800 border-amber-200',
|
|
'user' => 'bg-slate-100 text-slate-800 border-slate-200'
|
|
];
|
|
$roleLabels = [
|
|
'superadmin' => 'Super Admin',
|
|
'admin' => 'Administrador',
|
|
'supervisor' => 'Supervisor',
|
|
'user' => 'Usuario Normal'
|
|
];
|
|
$class = $roleClasses[$u['role']] ?? 'bg-gray-100';
|
|
$label = $roleLabels[$u['role']] ?? $u['role'];
|
|
?>
|
|
<span class="px-3 py-1 rounded-full text-[10px] font-bold border <?= $class ?> uppercase tracking-wider shadow-sm">
|
|
<?= $label ?>
|
|
</span>
|
|
</td>
|
|
<td class="px-6 py-4 text-sm text-slate-600 font-medium">
|
|
<?= date('d/m/Y', strtotime($u['created_at'])) ?>
|
|
</td>
|
|
<td class="px-6 py-4 text-right">
|
|
<?php if($_SESSION['user_id'] != $u['id'] && (hasRole('superadmin') || (hasRole('admin') && $u['role'] != 'superadmin'))): ?>
|
|
<button class="text-slate-400 hover:text-red-600 transition-colors" title="Eliminar (No implementado en esta demo)">
|
|
<i class="fas fa-trash-alt"></i>
|
|
</button>
|
|
<?php endif; ?>
|
|
</td>
|
|
</tr>
|
|
<?php endforeach; ?>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Modal Nuevo Usuario -->
|
|
<div id="modal-add-user" class="fixed inset-0 z-50 hidden">
|
|
<div class="absolute inset-0 bg-slate-900/60 backdrop-blur-sm transition-opacity" onclick="document.getElementById('modal-add-user').classList.add('hidden')"></div>
|
|
<div class="flex items-center justify-center min-h-screen px-4">
|
|
<div class="bg-white rounded-2xl shadow-2xl border border-slate-100 w-full max-w-md relative z-10 animate-fade-in">
|
|
<div class="px-6 py-4 border-b border-slate-100 flex justify-between items-center bg-slate-50 rounded-t-2xl">
|
|
<h3 class="text-lg font-bold text-slate-800">Registrar Nuevo Usuario</h3>
|
|
<button onclick="document.getElementById('modal-add-user').classList.add('hidden')" class="text-slate-400 hover:text-slate-600 transition-colors">
|
|
<i class="fas fa-times"></i>
|
|
</button>
|
|
</div>
|
|
<form action="actions/user_create.php" method="POST" class="p-6 space-y-4">
|
|
<div>
|
|
<label class="block text-xs font-bold text-slate-600 uppercase tracking-wider mb-2">Nombre Completo</label>
|
|
<input type="text" name="name" required class="w-full px-4 py-3 border border-slate-300 rounded-xl focus:ring-accent focus:border-accent bg-slate-50 text-sm font-medium shadow-inner transition-colors">
|
|
</div>
|
|
<div>
|
|
<label class="block text-xs font-bold text-slate-600 uppercase tracking-wider mb-2">Nombre de Usuario</label>
|
|
<input type="text" name="username" required class="w-full px-4 py-3 border border-slate-300 rounded-xl focus:ring-accent focus:border-accent bg-slate-50 text-sm font-medium shadow-inner transition-colors">
|
|
</div>
|
|
<div>
|
|
<label class="block text-xs font-bold text-slate-600 uppercase tracking-wider mb-2">Contraseña</label>
|
|
<input type="password" name="password" required class="w-full px-4 py-3 border border-slate-300 rounded-xl focus:ring-accent focus:border-accent bg-slate-50 text-sm font-medium shadow-inner transition-colors">
|
|
</div>
|
|
<div>
|
|
<label class="block text-xs font-bold text-slate-600 uppercase tracking-wider mb-2">Rol del Sistema</label>
|
|
<select name="role" required class="w-full px-4 py-3 border border-slate-300 rounded-xl focus:ring-accent focus:border-accent bg-slate-50 text-sm font-medium shadow-inner transition-colors">
|
|
<option value="user">Usuario Normal</option>
|
|
<option value="supervisor">Supervisor</option>
|
|
<?php if(hasRole('superadmin')): ?>
|
|
<option value="admin">Administrador</option>
|
|
<option value="superadmin">Super Administrador</option>
|
|
<?php endif; ?>
|
|
</select>
|
|
</div>
|
|
<div class="pt-4 flex gap-3">
|
|
<button type="button" onclick="document.getElementById('modal-add-user').classList.add('hidden')" class="flex-1 px-4 py-3 border border-slate-300 text-slate-700 font-bold text-sm uppercase tracking-wider rounded-xl hover:bg-slate-50 transition-colors">Cancelar</button>
|
|
<button type="submit" class="flex-1 px-4 py-3 bg-primary hover:bg-slate-800 text-white font-bold text-sm uppercase tracking-wider rounded-xl transition-all shadow-md">Guardar</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<?php require_once 'includes/footer.php'; ?>
|