Login + ABM de operadores + audit log con UI

Backend:
- 3 migrations: system_users (citext email único, password_hash, active),
  system_sessions (UUID + expires_at + revoked_at), ALTER audit_log con
  actor_user_id/actor_email/actor_ip/action_path/summary y entity_id NULL.
- src/modules/auth/: usersRepo, sessionsRepo, passwords (bcrypt cost 10),
  auth (login/logout), bootstrap (crea admin desde ADMIN_EMAIL/PASSWORD si
  la tabla está vacía). 4 tests passwords (hash distinto cada vez, verify
  rechaza, longitud mínima 8).
- middleware/requireAuth: lee cookie bot_session, busca sesión activa,
  popula req.user. Whitelist: /styles, /components, /lib, /login, /, /home
  y SPA paths (HTML carga sin auth, el JS gatea con /api/auth/me).
- middleware/auditWriter: registra cada POST/PUT/DELETE 2xx en audit_log
  con req.user, IP, body redactado (passwords/tokens/secrets). Handlers
  pueden enriquecer summary via res.locals.audit.
- routes: /api/auth/{login,logout,me} (cookie httpOnly + DB session),
  /api/system-users (ABM con guards: cant_delete_self, cant_deactivate_self,
  email único, password ≥ 8), /api/audit-log + /api/audit-log/actors.
- src/app.js: orden estricto — webhooks (sin auth) → auth routes (sin auth)
  → /login HTML → static → SPA HTML → requireAuth + auditWriter → API admin.

Bootstrap del primer admin se ejecuta en index.js antes de listen. Usa
ADMIN_EMAIL/ADMIN_PASSWORD/ADMIN_NAME del .env. Si no están seteados y la
tabla está vacía, warn y exit (nadie puede loguearse).

Frontend:
- /login.html + /login.js: form simple, POST a /api/auth/login con
  credentials:include, redirect a ?next=... o /home. Si ya hay sesión
  activa, va directo a /home.
- public/app.js gate: chequea /api/auth/me antes de initRouter; sin sesión
  redirige a /login?next=<path>. window.__USER__ disponible para shell.
- ops-shell: nav agrega "Operadores" + "Actividad". Header derecha muestra
  email del user + botón Salir (POST /api/auth/logout + redirect /login).
- system-users-crud: CRUD lista/form (estilo settings). Crear/editar/
  cambiar password/eliminar. UI muestra badge "Vos" + bloquea eliminarse
  ni desactivarse a uno mismo.
- audit-log: tabla read-only con filtros (actor, entity_type, since,
  search), paginación 50, badges por acción, modal de detalles con
  changes JSON. /api/audit-log/actors pobla el dropdown de operadores.

Smoke E2E: login OK + cookie set, /me 200; logout → /me 401; settings POST
genera fila en audit_log con actor_email + action_path; ABM crea/borra
operadores con guards; intentar borrarse devuelve 400 cant_delete_self.

161/161 tests verde (pre-existentes 157 + 4 passwords nuevos).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

public/components/ops-shell.js

@@ -56,6 +56,11 @@ class OpsShell extends HTMLElement {
         @keyframes pulse { 0%,100% { opacity:1; } 50% { opacity:.4; } }
 
         /* Notification bell */
+        .user-menu { display:flex; align-items:center; gap:8px; padding:4px 4px 4px 10px; border-radius: var(--r-sm); border:1px solid var(--border); }
+        .user-email { font: var(--fw-medium) 12px/1.2 var(--font-sans); color: var(--text); max-width:160px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
+        .logout-btn { background: transparent; border: 1px solid transparent; color: var(--text-muted); padding: 4px 8px; border-radius: var(--r-sm); cursor:pointer; font:var(--fw-medium) 11px/1 var(--font-sans); }
+        .logout-btn:hover { color: var(--err); border-color: var(--err-soft); background: var(--err-soft); }
+
         .notification-bell { position:relative; cursor:pointer; padding: 8px; border-radius: var(--r-sm); transition: background .15s; }
         .notification-bell:hover { background: var(--panel-2); }
         .notification-bell svg { width:18px; height:18px; fill: var(--text-muted); transition:fill .15s; display:block; }
@@ -98,6 +103,8 @@ class OpsShell extends HTMLElement {
             <a class="nav-btn" href="/cantidades" data-view="quantities">Cantidades</a>
             <a class="nav-btn" href="/pedidos" data-view="orders">Pedidos</a>
             <a class="nav-btn" href="/configuracion" data-view="settings">Config</a>
+            <a class="nav-btn" href="/operadores" data-view="operadores">Operadores</a>
+            <a class="nav-btn" href="/actividad" data-view="actividad">Actividad</a>
           </nav>
           <div class="spacer"></div>
           <div class="notification-bell" id="notificationBell" title="Takeovers pendientes">
@@ -105,6 +112,10 @@ class OpsShell extends HTMLElement {
             <span class="badge" id="takeoverBadge" style="display:none;">0</span>
           </div>
           <div class="status disconnected" id="sseStatus"><span class="dot"></span><span class="label">Conectando…</span></div>
+          <div class="user-menu" id="userMenu" title="Sesión">
+            <span class="user-email" id="userEmail">—</span>
+            <button class="logout-btn" id="logoutBtn" type="button">Salir</button>
+          </div>
         </header>
 
         <div id="viewHome" class="view active">
@@ -174,6 +185,18 @@ class OpsShell extends HTMLElement {
             <settings-crud></settings-crud>
           </div>
         </div>
+
+        <div id="viewOperadores" class="view">
+          <div class="layout-crud">
+            <system-users-crud></system-users-crud>
+          </div>
+        </div>
+
+        <div id="viewActividad" class="view">
+          <div class="layout-crud">
+            <audit-log></audit-log>
+          </div>
+        </div>
       </div>
     `;
   }
@@ -187,6 +210,18 @@ class OpsShell extends HTMLElement {
       if (label) label.textContent = s.ok ? "En vivo" : "Reconectando…";
     });
 
+    // User session badge + logout.
+    const user = window.__USER__ || null;
+    const emailEl = this.shadowRoot.getElementById("userEmail");
+    if (emailEl) emailEl.textContent = user?.email || "—";
+    this.shadowRoot.getElementById("logoutBtn")?.addEventListener("click", async () => {
+      try {
+        await fetch("/api/auth/logout", { method: "POST", credentials: "include" });
+      } finally {
+        window.location.replace("/login");
+      }
+    });
+
     // Listen for view switch requests from other components
     this._unsubSwitch = on("ui:switchView", ({ view }) => {
       if (view) this.setView(view, {}, { updateUrl: true });