127 lines
4.9 KiB
HTML
127 lines
4.9 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="es">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Administración — CarritoIA</title>
|
|
<link rel="stylesheet" href="{{ url_for('static', filename='css/style.css') }}">
|
|
<style>
|
|
.admin-wrap { max-width: 800px; margin: 0 auto; }
|
|
.admin-section {
|
|
background: var(--bg-card);
|
|
border: 1px solid var(--border);
|
|
border-radius: .7rem;
|
|
padding: 1.25rem 1.5rem;
|
|
margin-bottom: 1.5rem;
|
|
}
|
|
.admin-section h2 { margin: 0 0 1rem; font-size: 1rem;
|
|
border-bottom: 1px solid var(--border); padding-bottom: .6rem; }
|
|
table { width: 100%; border-collapse: collapse; font-size: .88rem; }
|
|
th { text-align: left; padding: .5rem .75rem;
|
|
font-size: .75rem; text-transform: uppercase; letter-spacing: .04em;
|
|
color: var(--text-muted); border-bottom: 1px solid var(--border); }
|
|
td { padding: .6rem .75rem; border-bottom: 1px solid var(--border); vertical-align: middle; }
|
|
tr:last-child td { border-bottom: none; }
|
|
.badge-admin { background:#1a2e42; color:#58a6ff;
|
|
font-size:.7rem; padding:.15rem .5rem; border-radius:1rem; }
|
|
label { display:block; font-size:.82rem; color:var(--text-muted); margin:.65rem 0 .2rem; }
|
|
input[type=text], input[type=password] {
|
|
width:100%; padding:.5rem .7rem;
|
|
background:var(--bg-input); border:1px solid var(--border);
|
|
border-radius:.45rem; color:var(--text); font-size:.88rem;
|
|
}
|
|
input:focus { outline:none; border-color:var(--primary); }
|
|
.form-row { display:flex; gap:.75rem; }
|
|
.form-row > * { flex:1; }
|
|
.check-row { display:flex; align-items:center; gap:.5rem; margin-top:.6rem; font-size:.85rem; }
|
|
.check-row input[type=checkbox] { width:auto; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<div style="display:flex; align-items:center; justify-content:space-between; margin-bottom:1.25rem;">
|
|
<h1 style="margin:0;">⚙️ Administración</h1>
|
|
<div style="display:flex; align-items:center; gap:.75rem;">
|
|
<a href="/" class="btn btn-secondary btn-sm">← Inicio</a>
|
|
<span style="font-size:.85rem; color:var(--text-muted);">{{ nombre }}</span>
|
|
<a href="/logout" class="btn btn-secondary btn-sm">Salir</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="admin-wrap">
|
|
|
|
{% if request.args.get('error') %}
|
|
<div class="alert" style="margin-bottom:1rem;">{{ request.args.get('error') }}</div>
|
|
{% endif %}
|
|
|
|
<!-- Lista de usuarios -->
|
|
<div class="admin-section">
|
|
<h2>Usuarios registrados ({{ usuarios|length }})</h2>
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>Usuario</th>
|
|
<th>Nombre</th>
|
|
<th>Tickets</th>
|
|
<th></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for u in usuarios %}
|
|
<tr>
|
|
<td>
|
|
{{ u.usuario }}
|
|
{% if u.admin %}<span class="badge-admin">admin</span>{% endif %}
|
|
</td>
|
|
<td>{{ u.nombre }}</td>
|
|
<td>{{ u.n_tickets }}</td>
|
|
<td style="text-align:right;">
|
|
{% if u.usuario != session['usuario'] %}
|
|
<form method="post" action="/admin/eliminar"
|
|
onsubmit="return confirm('¿Eliminar a {{ u.usuario }} y todos sus datos?')">
|
|
<input type="hidden" name="usuario" value="{{ u.usuario }}">
|
|
<button type="submit" class="btn btn-secondary btn-sm"
|
|
style="color:#f85149; border-color:#f85149;">
|
|
Eliminar
|
|
</button>
|
|
</form>
|
|
{% else %}
|
|
<span style="font-size:.75rem; color:var(--text-muted);">(tú)</span>
|
|
{% endif %}
|
|
</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<!-- Crear usuario -->
|
|
<div class="admin-section">
|
|
<h2>Crear nuevo usuario</h2>
|
|
<form method="post" action="/admin/crear">
|
|
<div class="form-row">
|
|
<div>
|
|
<label>Usuario <span style="font-size:.75rem;">(letras/números, min. 3)</span></label>
|
|
<input name="usuario" type="text" placeholder="usuario123" required>
|
|
</div>
|
|
<div>
|
|
<label>Nombre visible</label>
|
|
<input name="nombre" type="text" placeholder="Nombre Apellido" required>
|
|
</div>
|
|
</div>
|
|
<label>Contraseña <span style="font-size:.75rem;">(min. 6 caracteres)</span></label>
|
|
<input name="password" type="password" placeholder="••••••••" required>
|
|
<div class="check-row" style="margin-top:.75rem;">
|
|
<input type="checkbox" id="es_admin" name="es_admin">
|
|
<label for="es_admin" style="margin:0; color:var(--text);">Dar permisos de administrador</label>
|
|
</div>
|
|
<button type="submit" class="btn btn-primary btn-sm" style="margin-top:1rem;">
|
|
Crear usuario
|
|
</button>
|
|
</form>
|
|
</div>
|
|
|
|
</div><!-- /admin-wrap -->
|
|
</body>
|
|
</html>
|