nis2-agile/public/login.html
DevEnv nis2-agile e4f9e9179e [FEAT] Allineamento NIS2 ↔ TRPG (Fasi 1-5): SSO + Sessions + Reset + Impersonate + Branding
Implementazione completa del progetto allineamento alla suite Evix (TRPG/lg231),
basato sul doc canonico docs/GAP_TRPG_NIS2_ALIGNMENT.md (5 fasi, 18 gap).

Version 1.0.0 → 1.5.0

Fase 1 — SSO Federation (v1.1.0)
- Migration 015_sso_columns: users.sso_identity_id + password_version
- application/services/SsoHelper.php (client SSO dual-mode, cURL nativo, zero deps)
- AuthController::login() + changePassword() conditional SSO (SSO_MODE=local default)

Fase 2 — Multi-device Sessions (v1.2.0)
- Migration 016_active_sessions: tabella + refresh_tokens.session_jti
- BaseController::requireAuth() verifica jti + last_activity throttle + parseDeviceLabel
- login() genera jti, logout/changePassword revoca selettiva
- GET/DELETE /auth/sessions[/{id}]
- UI settings.html tab Sicurezza con lista device + revoca

Fase 3 — Password Reset + Tenant Switcher (v1.3.0)
- Migration 017_password_reset_tokens (TTL 30min, single-use)
- POST /auth/forgot-password (risposta opaca) + reset-password
- Pagine forgot-password.html + reset-password.html (con strength bar)
- EmailService::sendPasswordReset
- POST /auth/switchContext con rotazione JWT + organization_id claim
- Dropdown tenant in sidebar esposto a tutti gli utenti con ≥2 org

Fase 4 — Impersonate + Preferences + Versioning UI (v1.4.0)
- POST /auth/impersonate (super_admin o consulente stesso firm, TTL 1h, audit)
- Migration 018_user_preferences: users.theme/timezone/notif_email/notif_inapp
- GET/PUT /auth/preferences
- Sidebar footer mostra versione + changelog modal su click

Fase 5 — Branding white-label + Auth-gate (v1.5.0)
- Migration 019_firm_branding (logo/colori/brand_name per consulting firm)
- BrandingController GET /branding/current (auth opzionale) + PUT
- common.js auto-applica CSS variables al boot
- public/js/auth-gate.js (gate password client-side per docs riservati, da TRPG)

Skip motivati:
- G15 demo login: simulator esistenti coprono
- G18 refactor controllers: rinviato (~5gg, valore tecnico solo)

Cron sync SSO: AgileHub Ticket #220 aperto a team AGILEHUB per estendere
sso-password-sync.sh al DB nis2_agile_db. Prerequisito per switch SSO_MODE=dual.

Backup files: tutti i file modificati hanno .bak.pre-{fase}-{ts} sia in DEV
sia in /var/www/nis2-agile/.backups/ su Hetzner (rollback ready).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-29 13:18:35 +02:00

145 lines
6.5 KiB
HTML

<!DOCTYPE html>
<html lang="it">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Accedi - NIS2 Agile</title>
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
<style>
.pw-wrap { position: relative; }
.pw-wrap .form-input { padding-right: 42px; }
.pw-toggle {
position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
background: none; border: none; cursor: pointer;
color: #9CA3AF; font-size: 15px; padding: 0; transition: color .2s;
}
.pw-toggle:hover { color: var(--color-primary, #2563eb); }
.forgot-link {
display: block; text-align: center; margin-top: 10px;
font-size: .78rem; color: #6B7280; text-decoration: none; transition: color .2s;
}
.forgot-link:hover { color: var(--color-primary, #2563eb); }
.auth-terms {
margin-top: 14px; padding-top: 14px;
border-top: 1px solid var(--border-color, #e5e7eb);
text-align: center; font-size: .72rem; color: #9CA3AF; line-height: 1.8;
}
.auth-terms a { color: #6B7280; text-decoration: underline; }
</style>
</head>
<body>
<div class="auth-page">
<div class="auth-card">
<div class="auth-header">
<div class="auth-logo">
<div class="auth-logo-icon">
<svg viewBox="0 0 24 24" fill="currentColor">
<path d="M12 1L3 5v6c0 5.55 3.84 10.74 9 12 5.16-1.26 9-6.45 9-12V5l-9-4zm0 2.18l7 3.12v4.7c0 4.83-3.23 9.36-7 10.57-3.77-1.21-7-5.74-7-10.57V6.3l7-3.12z"/>
<path d="M10 12.5l-2-2-1.41 1.41L10 15.32l5.41-5.41L14 8.5l-4 4z"/>
</svg>
</div>
<span class="auth-logo-text">NIS2 <span>Agile</span></span>
</div>
<p class="auth-subtitle">Piattaforma di compliance NIS2</p>
</div>
<div class="auth-body">
<div class="auth-error" id="login-error"></div>
<form id="login-form" novalidate>
<div class="form-group">
<label class="form-label" for="email">Indirizzo Email</label>
<input type="email" id="email" name="email" class="form-input"
placeholder="nome@azienda.it" autocomplete="email" required>
</div>
<div class="form-group">
<label class="form-label" for="password">Password</label>
<div class="pw-wrap">
<input type="password" id="password" name="password" class="form-input"
placeholder="La tua password" autocomplete="current-password" required>
<button type="button" class="pw-toggle" id="pw-toggle" tabindex="-1"
onclick="(function(){var i=document.getElementById('password'),b=document.getElementById('pw-toggle');if(i.type==='password'){i.type='text';b.innerHTML='<i class=\'fas fa-eye-slash\'></i>';}else{i.type='password';b.innerHTML='<i class=\'fas fa-eye\'></i>';}})()" aria-label="Mostra/nascondi password">
<i class="fas fa-eye"></i>
</button>
</div>
</div>
<button type="submit" class="btn btn-primary btn-lg w-full" id="login-btn">
Accedi
</button>
<a href="forgot-password.html" class="forgot-link">
Password dimenticata?
</a>
</form>
</div>
<div class="auth-footer">
<p>Non hai un account? <a href="register.html">Registrati</a></p>
<div class="auth-terms">
Accedendo accetti i nostri
<a href="https://agentai.agile.software/terms" target="_blank">Termini di Servizio</a>
e la <a href="https://agentai.agile.software/privacy" target="_blank">Privacy Policy</a>
</div>
</div>
</div>
</div>
<script src="js/api.js"></script>
<script src="js/common.js"></script>
<script>
// Se gia' autenticato, vai alla dashboard
if (api.isAuthenticated()) {
window.location.href = 'dashboard.html';
}
const form = document.getElementById('login-form');
const errorEl = document.getElementById('login-error');
const loginBtn = document.getElementById('login-btn');
form.addEventListener('submit', async (e) => {
e.preventDefault();
errorEl.classList.remove('visible');
const email = document.getElementById('email').value.trim();
const password = document.getElementById('password').value;
if (!email || !password) {
errorEl.textContent = 'Inserisci email e password.';
errorEl.classList.add('visible');
return;
}
loginBtn.disabled = true;
loginBtn.textContent = 'Accesso in corso...';
try {
const result = await api.login(email, password);
if (result.success) {
const isConsultant = result.data.user && result.data.user.role === 'consultant';
const hasOrgs = result.data.organizations && result.data.organizations.length > 0;
if (!hasOrgs) {
window.location.href = 'onboarding.html';
} else if (isConsultant) {
window.location.href = 'companies.html';
} else {
window.location.href = 'dashboard.html';
}
} else {
errorEl.textContent = result.message || 'Credenziali non valide.';
errorEl.classList.add('visible');
}
} catch (err) {
errorEl.textContent = 'Errore di connessione al server.';
errorEl.classList.add('visible');
} finally {
loginBtn.disabled = false;
loginBtn.textContent = 'Accedi';
}
});
</script>
</body>
</html>