[FEAT] UI V3 — flotta: chrome top-nav + design system su 32 pagine app

Migrazione UI dal V2 (Bootstrap Italia, sidebar) al V3 (top-nav mega-menu
navy/oro, Inter+Lucide self-host) fedele ai mockup docs/mockup Ui/.
- 32 pagine app convertite (incl. admin/*): head Inter+v3.css, chrome
  topnav-v3, contenuti in card V3, dati REALI preservati (id/data-* intatti),
  i18n/help/FAB reali invariati, nessun CDN esterno.
- v3.css: aggiunti widget condivisi (modal/toast/form/btn-variant/spinner/
  progress/tag/badge) + utility (.btn base, .text-muted, .sr-only) + alias
  variabili V2->token V3, così modali/form/toast di common.js funzionano
  ovunque senza style.css.
- maintenance.html: finestra estesa a ~12:15.
- docs/UI_V3_FLEET_BRIEF.md: ricetta operativa della flotta.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
DevEnv nis2-agile
2026-06-27 15:57:35 +02:00
co-authored by Claude Opus 4.8
parent b0fc190704
commit a4150b5389
37 changed files with 4655 additions and 4922 deletions
+44 -33
View File
@@ -2,10 +2,13 @@
<html lang="it">
<head>
<meta charset="UTF-8">
<title>Connettori Discovery - NIS2 Agile</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="/vendor/bootstrap-italia/dist/css/bootstrap-italia.min.css">
<link rel="stylesheet" href="/css/style.css?v=20260618">
<title>Connettori Discovery · NIS2 Agile</title>
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
<!-- UI V3: Inter self-host + design system v3.css (self-host only, nessun CDN esterno). -->
<link rel="stylesheet" href="/vendor/inter/inter.css?v=20260627">
<link rel="stylesheet" href="/css/v3.css?v=20260627">
<!-- style.css resta caricato DOPO v3.css: veste i widget renderizzati via JS
(tabelle/form/modali). Self-hostato (nessun CDN). v3.css governa chrome + shell. -->
<meta name="theme-color" content="#0066CC">
<link rel="manifest" href="/manifest.webmanifest">
<link rel="icon" type="image/png" sizes="32x32" href="/assets/icons/favicon-32.png">
@@ -14,15 +17,24 @@
<script src="/js/pwa.js?v=20260614" defer></script>
</head>
<body>
<div class="app-layout">
<aside class="sidebar" id="sidebar"></aside>
<main class="main-content">
<header class="content-header">
<h1 class="content-title">Connettori Discovery</h1>
<div class="content-header-actions">
<button class="btn btn-primary" id="btn-dc-new">+ Nuovo connettore</button>
</div>
</header>
<!-- Chrome V3 (appbar + mega-menu) iniettata da topnav-v3.js in questo host -->
<div id="topnav"></div>
<main class="wrap">
<nav class="crumb" aria-label="breadcrumb">
<i data-lucide="home" class="ic"></i><a href="dashboard.html">Home</a>
<i data-lucide="chevron-right" class="ic"></i><span>Connettori Discovery</span>
</nav>
<div class="page-head">
<div>
<h1>Connettori Discovery</h1>
<p class="sub">Scansione rete/cloud → auto-popola l'Inventario (asset, dipendenze, flussi ID.AM-03)</p>
</div>
<div class="content-header-actions">
<button class="btn-primary" id="btn-dc-new"><i data-lucide="plus" class="ic"></i>Nuovo connettore</button>
</div>
</div>
<div class="content-body">
<div class="card" style="margin-bottom:16px">
<div class="card-body">
@@ -40,12 +52,12 @@
<div class="card-body">
<div class="form-row" style="display:flex;gap:12px;flex-wrap:wrap">
<div class="form-group" style="flex:1;min-width:200px">
<label>Nome</label>
<input id="dc-name" class="form-control" placeholder="Es. Rete sede Modena" maxlength="120">
<label class="form-label" for="dc-name">Nome</label>
<input id="dc-name" class="form-input" placeholder="Es. Rete sede Modena" maxlength="120">
</div>
<div class="form-group" style="min-width:160px">
<label>Tipo</label>
<select id="dc-type" class="form-control">
<label class="form-label" for="dc-type">Tipo</label>
<select id="dc-type" class="form-select">
<option value="network">Rete (scan IP)</option>
<option value="aws">AWS</option>
<option value="azure">Azure</option>
@@ -56,8 +68,8 @@
</select>
</div>
<div class="form-group" style="min-width:160px">
<label>Schedulazione</label>
<select id="dc-schedule" class="form-control">
<label class="form-label" for="dc-schedule">Schedulazione</label>
<select id="dc-schedule" class="form-select">
<option value="manual">Manuale</option>
<option value="daily">Giornaliera</option>
<option value="hourly">Oraria</option>
@@ -66,12 +78,12 @@
</div>
</div>
<div class="form-group">
<label>Target (CIDR/IP, separati da virgola) — descrittivo / usato dall'agente</label>
<input id="dc-targets" class="form-control" placeholder="192.168.1.0/24, 10.0.0.5">
<label class="form-label" for="dc-targets">Target (CIDR/IP, separati da virgola) — descrittivo / usato dall'agente</label>
<input id="dc-targets" class="form-input" placeholder="192.168.1.0/24, 10.0.0.5">
</div>
<div style="display:flex;gap:8px;margin-top:8px">
<button class="btn btn-primary" id="btn-dc-create">Crea connettore</button>
<button class="btn btn-outline-primary" id="btn-dc-cancel">Annulla</button>
<button class="btn-primary" id="btn-dc-create"><i data-lucide="check" class="ic"></i>Crea connettore</button>
<button class="btn-ghost" id="btn-dc-cancel">Annulla</button>
</div>
</div>
</div>
@@ -82,26 +94,25 @@
</div>
</div>
</div>
</main>
</div>
</main>
<script src="/js/common.js?v=20260624g"></script>
<!-- Scripts V3: api.js → common.js (helper+FAB reali) → Lucide self-host →
topnav-v3.js (chrome, ridefinisce loadSidebar) → i18n → help → pagina -->
<script src="/js/api.js?v=20260625d"></script>
<script src="/vendor/bootstrap-italia/dist/js/bootstrap-italia.bundle.min.js"></script>
<script>
if (window.bootstrap && bootstrap.loadFonts) { bootstrap.loadFonts('/vendor/bootstrap-italia/dist/fonts'); }
</script>
<script src="/js/common-bi.js?v=20260625d"></script>
<script src="/js/common.js?v=20260627v3"></script>
<script src="/vendor/lucide/lucide.min.js"></script>
<script src="/js/topnav-v3.js?v=20260627"></script>
<script src="/js/i18n.js?v=20260631"></script>
<script src="/js/help.js?v=20260625d"></script>
<script src="/js/connettori-discovery.js?v=20260625"></script>
<script src="/js/connettori-discovery.js?v=20260627"></script>
<script>
if (typeof checkAuth === 'function' && !checkAuth()) {
// checkAuth reindirizza a login
} else {
if (typeof loadSidebar === 'function') loadSidebar();
if (typeof loadSidebar === 'function') loadSidebar(); // = loadTopnavV3()
if (typeof I18n !== 'undefined' && I18n.init) I18n.init();
if (typeof HelpSystem !== 'undefined' && HelpSystem.init) HelpSystem.init();
if (window.lucide && lucide.createIcons) { try { lucide.createIcons(); } catch (e) {} }
if (window.DiscoveryUI) DiscoveryUI.init();
}
</script>