Fase 1 - Asset Relevance Scoring NIS2 (GV.OC-04): metodologia 0-100 a 6 criteri, AssetScoringService + endpoint scoringGrid/score/relevantSystems + UI assets.html + registro stampabile. Fase 2 - Tassonomia incidenti Determina ACN 164179/2025: IS-1..4 + regime essenziale/importante (Allegati 3/4). Fase 3 - Post-Incident Review (5-Whys) + metriche TTD/TTC/TTR + timestamp di fase. Fase 4 - Mapping NIST CSF 2.0 (43 controlli) reference-only. Fonti certe: registry config/nis2_sources.php + grounding AI (vieta riferimenti inventati) + citazioni help.js + ingest PDF normativi nella KB RAG (scripts/ingest-nis2-sources.php). Migrazioni 020/021/022 (additive idempotenti). Fix VectorService IP Qdrant (drift .5->.3). Analisi concorrenza Evix (docs/EVIX_ANALISI_CONCORRENZA.html, gap-driven). Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
1403 lines
53 KiB
HTML
1403 lines
53 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="it">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Dashboard Gestione Incidenti - NIS2</title>
|
|
<style>
|
|
:root {
|
|
--bg-primary: #0d1117;
|
|
--bg-secondary: #161b22;
|
|
--bg-tertiary: #1c2128;
|
|
--border-color: #30363d;
|
|
--text-primary: #c9d1d9;
|
|
--text-secondary: #8b949e;
|
|
--accent-primary: #58a6ff;
|
|
--accent-secondary: #1f6feb;
|
|
--success: #3fb950;
|
|
--warning: #d29922;
|
|
--danger: #f85149;
|
|
--essential-bg: #fef3c7;
|
|
--essential-text: #92400e;
|
|
--essential-border: #f59e0b;
|
|
}
|
|
|
|
* {
|
|
margin: 0;
|
|
padding: 0;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
body {
|
|
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Noto Sans', Helvetica, Arial, sans-serif;
|
|
background-color: var(--bg-primary);
|
|
color: var(--text-primary);
|
|
line-height: 1.6;
|
|
overflow-y: auto;
|
|
overflow-x: hidden;
|
|
}
|
|
|
|
.container {
|
|
max-width: 1800px;
|
|
margin: 0 auto;
|
|
padding: 20px;
|
|
}
|
|
|
|
/* Header */
|
|
.header {
|
|
background-color: var(--bg-secondary);
|
|
border-bottom: 1px solid var(--border-color);
|
|
padding: 24px 0;
|
|
margin-bottom: 32px;
|
|
position: sticky;
|
|
top: 0;
|
|
z-index: 100;
|
|
}
|
|
|
|
.header-content {
|
|
max-width: 1800px;
|
|
margin: 0 auto;
|
|
padding: 0 20px;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
flex-wrap: wrap;
|
|
gap: 16px;
|
|
}
|
|
|
|
.header-left {
|
|
flex: 1;
|
|
}
|
|
|
|
.header h1 {
|
|
font-size: 24px;
|
|
font-weight: 600;
|
|
color: var(--text-primary);
|
|
margin-bottom: 4px;
|
|
}
|
|
|
|
.breadcrumb {
|
|
font-size: 13px;
|
|
color: var(--text-secondary);
|
|
}
|
|
|
|
.breadcrumb a {
|
|
color: var(--accent-primary);
|
|
text-decoration: none;
|
|
}
|
|
|
|
.breadcrumb a:hover {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.header-right {
|
|
display: flex;
|
|
gap: 12px;
|
|
align-items: center;
|
|
}
|
|
|
|
.subject-badge {
|
|
display: inline-block;
|
|
padding: 8px 16px;
|
|
border-radius: 6px;
|
|
font-size: 12px;
|
|
font-weight: 700;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.5px;
|
|
}
|
|
|
|
.subject-badge.important {
|
|
background-color: rgba(88, 166, 255, 0.2);
|
|
color: var(--accent-primary);
|
|
border: 1px solid var(--accent-primary);
|
|
}
|
|
|
|
.subject-badge.essential {
|
|
background-color: var(--essential-bg);
|
|
color: var(--essential-text);
|
|
border: 1px solid var(--essential-border);
|
|
}
|
|
|
|
.btn {
|
|
padding: 8px 16px;
|
|
background-color: var(--bg-tertiary);
|
|
border: 1px solid var(--border-color);
|
|
border-radius: 6px;
|
|
color: var(--text-primary);
|
|
font-size: 13px;
|
|
font-weight: 500;
|
|
cursor: pointer;
|
|
transition: all 0.2s;
|
|
text-decoration: none;
|
|
display: inline-block;
|
|
}
|
|
|
|
.btn:hover {
|
|
background-color: var(--bg-tertiary);
|
|
border-color: var(--accent-primary);
|
|
color: var(--accent-primary);
|
|
}
|
|
|
|
.btn-primary {
|
|
background-color: var(--accent-primary);
|
|
border-color: var(--accent-primary);
|
|
color: white;
|
|
}
|
|
|
|
.btn-primary:hover {
|
|
background-color: var(--accent-secondary);
|
|
border-color: var(--accent-secondary);
|
|
color: white;
|
|
}
|
|
|
|
.btn-danger {
|
|
background-color: rgba(248, 81, 73, 0.1);
|
|
border-color: var(--danger);
|
|
color: var(--danger);
|
|
}
|
|
|
|
.btn-danger:hover {
|
|
background-color: var(--danger);
|
|
color: white;
|
|
}
|
|
|
|
/* Stats Grid */
|
|
.stats-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
|
|
gap: 16px;
|
|
margin-bottom: 32px;
|
|
}
|
|
|
|
.stat-card {
|
|
background-color: var(--bg-secondary);
|
|
border: 1px solid var(--border-color);
|
|
border-radius: 6px;
|
|
padding: 20px;
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.stat-card::before {
|
|
content: '';
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
height: 3px;
|
|
background: var(--accent-primary);
|
|
}
|
|
|
|
.stat-card.critical::before {
|
|
background: var(--danger);
|
|
}
|
|
|
|
.stat-card.high::before {
|
|
background: var(--warning);
|
|
}
|
|
|
|
.stat-card.success::before {
|
|
background: var(--success);
|
|
}
|
|
|
|
.stat-label {
|
|
font-size: 12px;
|
|
color: var(--text-secondary);
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.5px;
|
|
margin-bottom: 8px;
|
|
}
|
|
|
|
.stat-value {
|
|
font-size: 32px;
|
|
font-weight: 700;
|
|
color: var(--text-primary);
|
|
margin-bottom: 4px;
|
|
}
|
|
|
|
.stat-sublabel {
|
|
font-size: 12px;
|
|
color: var(--text-secondary);
|
|
}
|
|
|
|
/* Alert Box */
|
|
.alert-box {
|
|
background-color: var(--bg-secondary);
|
|
border: 1px solid var(--border-color);
|
|
border-left: 4px solid var(--warning);
|
|
border-radius: 6px;
|
|
padding: 20px;
|
|
margin-bottom: 24px;
|
|
}
|
|
|
|
.alert-box.danger {
|
|
border-left-color: var(--danger);
|
|
}
|
|
|
|
.alert-box.success {
|
|
border-left-color: var(--success);
|
|
}
|
|
|
|
.alert-title {
|
|
font-weight: 600;
|
|
color: var(--text-primary);
|
|
margin-bottom: 8px;
|
|
font-size: 15px;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
}
|
|
|
|
.alert-content {
|
|
font-size: 13px;
|
|
color: var(--text-secondary);
|
|
line-height: 1.6;
|
|
}
|
|
|
|
/* Tabs */
|
|
.tabs {
|
|
display: flex;
|
|
gap: 8px;
|
|
margin-bottom: 24px;
|
|
border-bottom: 1px solid var(--border-color);
|
|
padding-bottom: 0;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.tab {
|
|
padding: 12px 16px;
|
|
background: transparent;
|
|
border: none;
|
|
color: var(--text-secondary);
|
|
cursor: pointer;
|
|
font-size: 14px;
|
|
font-weight: 500;
|
|
border-bottom: 2px solid transparent;
|
|
transition: all 0.2s;
|
|
}
|
|
|
|
.tab:hover {
|
|
color: var(--text-primary);
|
|
background-color: var(--bg-tertiary);
|
|
}
|
|
|
|
.tab.active {
|
|
color: var(--accent-primary);
|
|
border-bottom-color: var(--accent-primary);
|
|
}
|
|
|
|
/* Section */
|
|
.section {
|
|
background-color: var(--bg-secondary);
|
|
border: 1px solid var(--border-color);
|
|
border-radius: 6px;
|
|
padding: 24px;
|
|
margin-bottom: 24px;
|
|
display: none;
|
|
}
|
|
|
|
.section.active {
|
|
display: block;
|
|
}
|
|
|
|
.section-header {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
margin-bottom: 24px;
|
|
padding-bottom: 16px;
|
|
border-bottom: 1px solid var(--border-color);
|
|
flex-wrap: wrap;
|
|
gap: 16px;
|
|
}
|
|
|
|
.section-title {
|
|
font-size: 18px;
|
|
font-weight: 600;
|
|
color: var(--text-primary);
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
}
|
|
|
|
/* Help Icon */
|
|
.help-icon {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 22px;
|
|
height: 22px;
|
|
background-color: rgba(167, 139, 250, 0.2);
|
|
border: 2px solid #a78bfa;
|
|
border-radius: 50%;
|
|
font-size: 13px;
|
|
font-weight: 700;
|
|
color: #a78bfa;
|
|
cursor: help;
|
|
position: relative;
|
|
margin-left: 6px;
|
|
}
|
|
|
|
.help-icon:hover {
|
|
background-color: rgba(167, 139, 250, 0.3);
|
|
color: #c4b5fd;
|
|
border-color: #c4b5fd;
|
|
transform: scale(1.1);
|
|
}
|
|
|
|
.tooltip {
|
|
visibility: hidden;
|
|
position: absolute;
|
|
z-index: 1000;
|
|
background-color: var(--bg-tertiary);
|
|
color: var(--text-primary);
|
|
padding: 12px;
|
|
border-radius: 6px;
|
|
border: 1px solid var(--border-color);
|
|
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
|
|
width: 320px;
|
|
top: 28px;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
font-size: 12px;
|
|
line-height: 1.5;
|
|
opacity: 0;
|
|
transition: opacity 0.2s;
|
|
white-space: normal;
|
|
}
|
|
|
|
.tooltip::before {
|
|
content: '';
|
|
position: absolute;
|
|
top: -6px;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
border-left: 6px solid transparent;
|
|
border-right: 6px solid transparent;
|
|
border-bottom: 6px solid var(--border-color);
|
|
}
|
|
|
|
.tooltip-title {
|
|
color: var(--accent-primary);
|
|
font-weight: 600;
|
|
margin-bottom: 8px;
|
|
font-size: 11px;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.5px;
|
|
}
|
|
|
|
.help-icon:hover .tooltip {
|
|
visibility: visible;
|
|
opacity: 1;
|
|
}
|
|
|
|
/* Filter Bar */
|
|
.filter-bar {
|
|
display: flex;
|
|
gap: 12px;
|
|
margin-bottom: 16px;
|
|
flex-wrap: wrap;
|
|
align-items: center;
|
|
}
|
|
|
|
.filter-group {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
}
|
|
|
|
.filter-label {
|
|
font-size: 13px;
|
|
color: var(--text-secondary);
|
|
font-weight: 500;
|
|
}
|
|
|
|
select, input[type="text"], input[type="search"], input[type="date"] {
|
|
padding: 8px 12px;
|
|
background-color: var(--bg-tertiary);
|
|
border: 1px solid var(--border-color);
|
|
border-radius: 6px;
|
|
color: var(--text-primary);
|
|
font-size: 13px;
|
|
}
|
|
|
|
select:focus, input:focus {
|
|
outline: none;
|
|
border-color: var(--accent-primary);
|
|
}
|
|
|
|
/* Table */
|
|
.table-container {
|
|
overflow-x: auto;
|
|
margin-top: 16px;
|
|
}
|
|
|
|
table {
|
|
width: 100%;
|
|
border-collapse: collapse;
|
|
font-size: 13px;
|
|
}
|
|
|
|
th {
|
|
background-color: var(--bg-tertiary);
|
|
color: var(--text-secondary);
|
|
font-weight: 600;
|
|
text-align: left;
|
|
padding: 12px;
|
|
border: 1px solid var(--border-color);
|
|
text-transform: uppercase;
|
|
font-size: 11px;
|
|
letter-spacing: 0.5px;
|
|
}
|
|
|
|
td {
|
|
padding: 12px;
|
|
border: 1px solid var(--border-color);
|
|
color: var(--text-primary);
|
|
}
|
|
|
|
tr:hover {
|
|
background-color: var(--bg-tertiary);
|
|
}
|
|
|
|
/* Status Badge */
|
|
.status-badge {
|
|
display: inline-block;
|
|
padding: 4px 8px;
|
|
border-radius: 3px;
|
|
font-size: 11px;
|
|
font-weight: 600;
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
.status-rilevato {
|
|
background-color: rgba(88, 166, 255, 0.2);
|
|
color: var(--accent-primary);
|
|
border: 1px solid var(--accent-primary);
|
|
}
|
|
|
|
.status-triage {
|
|
background-color: rgba(210, 153, 34, 0.2);
|
|
color: var(--warning);
|
|
border: 1px solid var(--warning);
|
|
}
|
|
|
|
.status-contenuto {
|
|
background-color: rgba(210, 153, 34, 0.2);
|
|
color: var(--warning);
|
|
border: 1px solid var(--warning);
|
|
}
|
|
|
|
.status-eradicazione {
|
|
background-color: rgba(210, 153, 34, 0.2);
|
|
color: var(--warning);
|
|
border: 1px solid var(--warning);
|
|
}
|
|
|
|
.status-ripristino {
|
|
background-color: rgba(88, 166, 255, 0.2);
|
|
color: var(--accent-primary);
|
|
border: 1px solid var(--accent-primary);
|
|
}
|
|
|
|
.status-chiuso {
|
|
background-color: rgba(63, 185, 80, 0.2);
|
|
color: var(--success);
|
|
border: 1px solid var(--success);
|
|
}
|
|
|
|
.sev-1 {
|
|
color: var(--danger);
|
|
font-weight: 700;
|
|
}
|
|
|
|
.sev-2 {
|
|
color: var(--warning);
|
|
font-weight: 700;
|
|
}
|
|
|
|
.sev-3 {
|
|
color: var(--accent-primary);
|
|
font-weight: 600;
|
|
}
|
|
|
|
.sev-4 {
|
|
color: var(--text-secondary);
|
|
}
|
|
|
|
/* Essential Badge */
|
|
.essential-badge {
|
|
display: inline-block;
|
|
background-color: var(--essential-bg);
|
|
color: var(--essential-text);
|
|
padding: 4px 8px;
|
|
border-radius: 3px;
|
|
font-size: 10px;
|
|
font-weight: 700;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.5px;
|
|
border: 1px solid var(--essential-border);
|
|
margin-left: 8px;
|
|
transform: rotate(-1deg);
|
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
|
|
}
|
|
|
|
/* Quick Actions */
|
|
.quick-actions {
|
|
display: grid;
|
|
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
|
|
gap: 16px;
|
|
margin-bottom: 32px;
|
|
}
|
|
|
|
.quick-action-card {
|
|
background-color: var(--bg-secondary);
|
|
border: 1px solid var(--border-color);
|
|
border-radius: 6px;
|
|
padding: 20px;
|
|
cursor: pointer;
|
|
transition: all 0.2s;
|
|
text-decoration: none;
|
|
display: block;
|
|
}
|
|
|
|
.quick-action-card:hover {
|
|
border-color: var(--accent-primary);
|
|
transform: translateY(-2px);
|
|
box-shadow: 0 4px 12px rgba(88, 166, 255, 0.2);
|
|
}
|
|
|
|
.quick-action-icon {
|
|
font-size: 32px;
|
|
margin-bottom: 12px;
|
|
}
|
|
|
|
.quick-action-title {
|
|
font-size: 16px;
|
|
font-weight: 600;
|
|
color: var(--text-primary);
|
|
margin-bottom: 8px;
|
|
}
|
|
|
|
.quick-action-desc {
|
|
font-size: 13px;
|
|
color: var(--text-secondary);
|
|
line-height: 1.5;
|
|
}
|
|
|
|
/* Timeline */
|
|
.timeline {
|
|
position: relative;
|
|
padding-left: 30px;
|
|
}
|
|
|
|
.timeline::before {
|
|
content: '';
|
|
position: absolute;
|
|
left: 10px;
|
|
top: 0;
|
|
bottom: 0;
|
|
width: 2px;
|
|
background: var(--border-color);
|
|
}
|
|
|
|
.timeline-item {
|
|
position: relative;
|
|
margin-bottom: 24px;
|
|
padding-left: 20px;
|
|
}
|
|
|
|
.timeline-item::before {
|
|
content: '';
|
|
position: absolute;
|
|
left: -24px;
|
|
top: 4px;
|
|
width: 12px;
|
|
height: 12px;
|
|
border-radius: 50%;
|
|
background: var(--accent-primary);
|
|
border: 2px solid var(--bg-secondary);
|
|
}
|
|
|
|
.timeline-time {
|
|
font-size: 12px;
|
|
color: var(--text-secondary);
|
|
margin-bottom: 4px;
|
|
}
|
|
|
|
.timeline-content {
|
|
font-size: 13px;
|
|
color: var(--text-primary);
|
|
}
|
|
|
|
/* Responsive */
|
|
@media (max-width: 768px) {
|
|
.header-content {
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
}
|
|
|
|
.stats-grid {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
|
|
.tabs {
|
|
overflow-x: auto;
|
|
flex-wrap: nowrap;
|
|
}
|
|
|
|
.filter-bar {
|
|
flex-direction: column;
|
|
align-items: stretch;
|
|
}
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="header">
|
|
<div class="header-content">
|
|
<div class="header-left">
|
|
<h1>Gestione Incidenti, Ripristino e Comunicazioni</h1>
|
|
<div class="breadcrumb">
|
|
<a href="dashboard.html">Dashboard NIS2</a> / Org.10 - Gestione Incidenti
|
|
</div>
|
|
</div>
|
|
<div class="header-right">
|
|
<span class="subject-badge" id="subjectBadge">Soggetto Importante</span>
|
|
<button class="btn" onclick="window.location.href='incident-gate.html'">Cambia Tipo</button>
|
|
<button class="btn btn-primary" onclick="window.location.href='incident-new.html'">🚨 Nuovo Incidente</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="container">
|
|
<!-- Alert per incidenti attivi -->
|
|
<div class="alert-box danger" id="activeIncidentsAlert" style="display: none;">
|
|
<div class="alert-title">
|
|
<span>⚠️</span>
|
|
<span id="activeIncidentsCount">2</span> Incidenti Critici Attivi
|
|
</div>
|
|
<div class="alert-content">
|
|
Sono presenti incidenti SEV-1 o SEV-2 in gestione che richiedono attenzione immediata. Verifica lo stato e le azioni richieste.
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Statistics -->
|
|
<div class="stats-grid">
|
|
<div class="stat-card">
|
|
<div class="stat-label">Incidenti Totali</div>
|
|
<div class="stat-value">47</div>
|
|
<div class="stat-sublabel">Ultimi 12 mesi</div>
|
|
</div>
|
|
<div class="stat-card critical">
|
|
<div class="stat-label">Incidenti Attivi</div>
|
|
<div class="stat-value">3</div>
|
|
<div class="stat-sublabel">In gestione ora</div>
|
|
</div>
|
|
<div class="stat-card high">
|
|
<div class="stat-label">Notifiche CSIRT</div>
|
|
<div class="stat-value">12</div>
|
|
<div class="stat-sublabel">Incidenti significativi</div>
|
|
</div>
|
|
<div class="stat-card success">
|
|
<div class="stat-label">TTD Medio</div>
|
|
<div class="stat-value">2.4h</div>
|
|
<div class="stat-sublabel">Time to Detect</div>
|
|
</div>
|
|
<div class="stat-card success">
|
|
<div class="stat-label">TTC Medio</div>
|
|
<div class="stat-value">3.8h</div>
|
|
<div class="stat-sublabel">Time to Contain</div>
|
|
</div>
|
|
<div class="stat-card">
|
|
<div class="stat-label">Conformità Notifiche</div>
|
|
<div class="stat-value">100%</div>
|
|
<div class="stat-sublabel">Entro 24h (preallarme)</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Quick Actions -->
|
|
<div class="quick-actions">
|
|
<a href="incident-new.html" class="quick-action-card">
|
|
<div class="quick-action-icon">🚨</div>
|
|
<div class="quick-action-title">Segnala Incidente</div>
|
|
<div class="quick-action-desc">Apri un nuovo ticket di incidente di sicurezza</div>
|
|
</a>
|
|
|
|
<a href="incident-notification.html" class="quick-action-card">
|
|
<div class="quick-action-icon">📡</div>
|
|
<div class="quick-action-title">Notifiche CSIRT</div>
|
|
<div class="quick-action-desc">Gestisci comunicazioni al CSIRT Italia</div>
|
|
</a>
|
|
|
|
<a href="incident-recovery.html" class="quick-action-card">
|
|
<div class="quick-action-icon">🔄</div>
|
|
<div class="quick-action-title">Ripristino Servizi</div>
|
|
<div class="quick-action-desc">Processi di recovery e validazione</div>
|
|
</a>
|
|
|
|
<a href="incident-pir.html" class="quick-action-card">
|
|
<div class="quick-action-icon">📊</div>
|
|
<div class="quick-action-title">Post-Incident Review</div>
|
|
<div class="quick-action-desc">Lesson learned e miglioramento continuo</div>
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Tabs -->
|
|
<div class="tabs">
|
|
<button class="tab active" onclick="showTab('active')">Incidenti Attivi (3)</button>
|
|
<button class="tab" onclick="showTab('all')">Tutti gli Incidenti</button>
|
|
<button class="tab" onclick="showTab('notified')">Notificati CSIRT (12)</button>
|
|
<button class="tab" onclick="showTab('timeline')">Timeline Recenti</button>
|
|
<button class="tab" onclick="showTab('kpi')">KPI e Metriche</button>
|
|
</div>
|
|
|
|
<!-- Active Incidents Section -->
|
|
<div class="section active" id="section-active">
|
|
<div class="section-header">
|
|
<div class="section-title">
|
|
Incidenti Attivi
|
|
<span class="help-icon">?
|
|
<div class="tooltip">
|
|
<div class="tooltip-title">HELP DELLA SEZIONE</div>
|
|
Incidenti attualmente in gestione (stato: Rilevato, In triage, Contenuto, In eradicazione, In ripristino). Richiede monitoraggio e azioni attive dal team incident response.
|
|
</div>
|
|
</span>
|
|
</div>
|
|
<div>
|
|
<button class="btn" onclick="refreshData()">Aggiorna</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="table-container">
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>Codice</th>
|
|
<th>Data/Ora</th>
|
|
<th>Descrizione</th>
|
|
<th>Severità</th>
|
|
<th>Classificazione</th>
|
|
<th>Stato</th>
|
|
<th>Responsabile</th>
|
|
<th>Notifica CSIRT</th>
|
|
<th>Azioni</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td><strong>INC-2024-047</strong></td>
|
|
<td>2024-03-06 08:15</td>
|
|
<td>Tentativo ransomware bloccato su server ERP</td>
|
|
<td><span class="sev-1">SEV-1</span></td>
|
|
<td>IS-2</td>
|
|
<td><span class="status-badge status-contenuto">Contenuto</span></td>
|
|
<td>CISO</td>
|
|
<td>✅ Preallarme inviato</td>
|
|
<td>
|
|
<button class="btn" onclick="viewIncident('INC-2024-047')">Dettagli</button>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>INC-2024-046</strong></td>
|
|
<td>2024-03-05 14:32</td>
|
|
<td>Accesso non autorizzato account privilegiato</td>
|
|
<td><span class="sev-2">SEV-2</span></td>
|
|
<td>IS-2</td>
|
|
<td><span class="status-badge status-eradicazione">In eradicazione</span></td>
|
|
<td>SOC Lead</td>
|
|
<td>✅ Notifica completa</td>
|
|
<td>
|
|
<button class="btn" onclick="viewIncident('INC-2024-046')">Dettagli</button>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>INC-2024-045</strong></td>
|
|
<td>2024-03-04 10:20</td>
|
|
<td>DDoS su servizio web pubblico</td>
|
|
<td><span class="sev-2">SEV-2</span></td>
|
|
<td>IS-1</td>
|
|
<td><span class="status-badge status-ripristino">In ripristino</span></td>
|
|
<td>Network Manager</td>
|
|
<td>✅ Notifica completa</td>
|
|
<td>
|
|
<button class="btn" onclick="viewIncident('INC-2024-045')">Dettagli</button>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- All Incidents Section -->
|
|
<div class="section" id="section-all">
|
|
<div class="section-header">
|
|
<div class="section-title">
|
|
Tutti gli Incidenti
|
|
<span class="help-icon">?
|
|
<div class="tooltip">
|
|
<div class="tooltip-title">HELP DELLA SEZIONE</div>
|
|
Registro completo di tutti gli incidenti di sicurezza rilevati, inclusi quelli chiusi e in post-analisi. Filtrabili per periodo, severità, classificazione e stato.
|
|
</div>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="filter-bar">
|
|
<div class="filter-group">
|
|
<span class="filter-label">Periodo:</span>
|
|
<input type="date" value="2024-01-01">
|
|
<span>-</span>
|
|
<input type="date" value="2024-03-06">
|
|
</div>
|
|
<div class="filter-group">
|
|
<span class="filter-label">Severità:</span>
|
|
<select>
|
|
<option>Tutte</option>
|
|
<option>SEV-1 Critico</option>
|
|
<option>SEV-2 Alto</option>
|
|
<option>SEV-3 Medio</option>
|
|
<option>SEV-4 Basso</option>
|
|
</select>
|
|
</div>
|
|
<div class="filter-group">
|
|
<span class="filter-label">Classificazione:</span>
|
|
<select>
|
|
<option>Tutte</option>
|
|
<option>IS-1 Impatto servizi</option>
|
|
<option>IS-2 Impatto dati</option>
|
|
<option>IS-3 Impatto supply chain</option>
|
|
<option id="is4Option">IS-4 Ricorrenti</option>
|
|
</select>
|
|
</div>
|
|
<div class="filter-group">
|
|
<span class="filter-label">Stato:</span>
|
|
<select>
|
|
<option>Tutti</option>
|
|
<option>Attivi</option>
|
|
<option>Chiusi</option>
|
|
<option>Post-analisi</option>
|
|
</select>
|
|
</div>
|
|
<div class="filter-group">
|
|
<span class="filter-label">Cerca:</span>
|
|
<input type="search" placeholder="Codice, descrizione...">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="table-container">
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>Codice</th>
|
|
<th>Data/Ora</th>
|
|
<th>Descrizione</th>
|
|
<th>Severità</th>
|
|
<th>Classificazione</th>
|
|
<th>Stato</th>
|
|
<th>TTD</th>
|
|
<th>TTC</th>
|
|
<th>TTR</th>
|
|
<th>Notifica CSIRT</th>
|
|
<th>Azioni</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td><strong>INC-2024-047</strong></td>
|
|
<td>2024-03-06 08:15</td>
|
|
<td>Tentativo ransomware bloccato su server ERP</td>
|
|
<td><span class="sev-1">SEV-1</span></td>
|
|
<td>IS-2</td>
|
|
<td><span class="status-badge status-contenuto">Contenuto</span></td>
|
|
<td>0.5h</td>
|
|
<td>2.2h</td>
|
|
<td>-</td>
|
|
<td>✅ Preallarme</td>
|
|
<td><button class="btn" onclick="viewIncident('INC-2024-047')">Dettagli</button></td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>INC-2024-046</strong></td>
|
|
<td>2024-03-05 14:32</td>
|
|
<td>Accesso non autorizzato account privilegiato</td>
|
|
<td><span class="sev-2">SEV-2</span></td>
|
|
<td>IS-2</td>
|
|
<td><span class="status-badge status-eradicazione">In eradicazione</span></td>
|
|
<td>1.2h</td>
|
|
<td>3.5h</td>
|
|
<td>-</td>
|
|
<td>✅ Completa</td>
|
|
<td><button class="btn" onclick="viewIncident('INC-2024-046')">Dettagli</button></td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>INC-2024-045</strong></td>
|
|
<td>2024-03-04 10:20</td>
|
|
<td>DDoS su servizio web pubblico</td>
|
|
<td><span class="sev-2">SEV-2</span></td>
|
|
<td>IS-1</td>
|
|
<td><span class="status-badge status-ripristino">In ripristino</span></td>
|
|
<td>0.3h</td>
|
|
<td>4.1h</td>
|
|
<td>-</td>
|
|
<td>✅ Completa</td>
|
|
<td><button class="btn" onclick="viewIncident('INC-2024-045')">Dettagli</button></td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>INC-2024-044</strong></td>
|
|
<td>2024-02-28 16:45</td>
|
|
<td>Phishing mirato a utenti amministrativi</td>
|
|
<td><span class="sev-3">SEV-3</span></td>
|
|
<td>Non significativo</td>
|
|
<td><span class="status-badge status-chiuso">Chiuso</span></td>
|
|
<td>2.1h</td>
|
|
<td>5.3h</td>
|
|
<td>8.2h</td>
|
|
<td>❌ Non richiesta</td>
|
|
<td><button class="btn" onclick="viewIncident('INC-2024-044')">Dettagli</button></td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>INC-2024-043</strong></td>
|
|
<td>2024-02-25 09:12</td>
|
|
<td>Malware rilevato su endpoint utente</td>
|
|
<td><span class="sev-4">SEV-4</span></td>
|
|
<td>Non significativo</td>
|
|
<td><span class="status-badge status-chiuso">Chiuso</span></td>
|
|
<td>0.1h</td>
|
|
<td>0.5h</td>
|
|
<td>1.2h</td>
|
|
<td>❌ Non richiesta</td>
|
|
<td><button class="btn" onclick="viewIncident('INC-2024-043')">Dettagli</button></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Notified to CSIRT Section -->
|
|
<div class="section" id="section-notified">
|
|
<div class="section-header">
|
|
<div class="section-title">
|
|
Incidenti Notificati al CSIRT Italia
|
|
<span class="help-icon">?
|
|
<div class="tooltip">
|
|
<div class="tooltip-title">HELP DELLA SEZIONE</div>
|
|
Incidenti significativi per i quali è stata effettuata notifica obbligatoria al CSIRT Italia secondo D.Lgs. 138/2024. Include tracking di preallarme (24h), notifica completa (72h) e relazione finale (1 mese).
|
|
</div>
|
|
</span>
|
|
</div>
|
|
<div>
|
|
<button class="btn" onclick="window.location.href='incident-notification.html'">Nuova Notifica</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="table-container">
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>Codice Incidente</th>
|
|
<th>Data Incidente</th>
|
|
<th>Classificazione</th>
|
|
<th>Preallarme (24h)</th>
|
|
<th>Notifica Completa (72h)</th>
|
|
<th>Relazione Finale (1 mese)</th>
|
|
<th>Stato Conformità</th>
|
|
<th>Azioni</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td><strong>INC-2024-047</strong></td>
|
|
<td>2024-03-06 08:15</td>
|
|
<td>IS-2</td>
|
|
<td>✅ 2024-03-06 14:30<br><span style="color: var(--success); font-size: 11px;">Entro termine</span></td>
|
|
<td>⏳ Scadenza: 2024-03-09 08:15</td>
|
|
<td>⏳ Scadenza: 2024-04-09</td>
|
|
<td><span class="status-badge status-rilevato">In corso</span></td>
|
|
<td>
|
|
<button class="btn" onclick="viewNotification('INC-2024-047')">Gestisci</button>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>INC-2024-046</strong></td>
|
|
<td>2024-03-05 14:32</td>
|
|
<td>IS-2</td>
|
|
<td>✅ 2024-03-06 09:15<br><span style="color: var(--success); font-size: 11px;">Entro termine</span></td>
|
|
<td>✅ 2024-03-07 16:20<br><span style="color: var(--success); font-size: 11px;">Entro termine</span></td>
|
|
<td>⏳ Scadenza: 2024-04-07</td>
|
|
<td><span class="status-badge status-rilevato">In corso</span></td>
|
|
<td>
|
|
<button class="btn" onclick="viewNotification('INC-2024-046')">Gestisci</button>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>INC-2024-045</strong></td>
|
|
<td>2024-03-04 10:20</td>
|
|
<td>IS-1</td>
|
|
<td>✅ 2024-03-04 18:45<br><span style="color: var(--success); font-size: 11px;">Entro termine</span></td>
|
|
<td>✅ 2024-03-06 11:30<br><span style="color: var(--success); font-size: 11px;">Entro termine</span></td>
|
|
<td>⏳ Scadenza: 2024-04-06</td>
|
|
<td><span class="status-badge status-rilevato">In corso</span></td>
|
|
<td>
|
|
<button class="btn" onclick="viewNotification('INC-2024-045')">Gestisci</button>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>INC-2024-038</strong></td>
|
|
<td>2024-02-15 11:30</td>
|
|
<td>IS-1</td>
|
|
<td>✅ 2024-02-15 20:15</td>
|
|
<td>✅ 2024-02-17 09:45</td>
|
|
<td>✅ 2024-03-18 14:00<br><span style="color: var(--success); font-size: 11px;">Completata</span></td>
|
|
<td><span class="status-badge status-chiuso">Completato</span></td>
|
|
<td>
|
|
<button class="btn" onclick="viewNotification('INC-2024-038')">Visualizza</button>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Timeline Section -->
|
|
<div class="section" id="section-timeline">
|
|
<div class="section-header">
|
|
<div class="section-title">
|
|
Timeline Attività Recenti
|
|
<span class="help-icon">?
|
|
<div class="tooltip">
|
|
<div class="tooltip-title">HELP DELLA SEZIONE</div>
|
|
Cronologia delle attività più recenti relative alla gestione incidenti: nuovi incidenti, escalation, notifiche, chiusure, PIR completate.
|
|
</div>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="timeline">
|
|
<div class="timeline-item">
|
|
<div class="timeline-time">2024-03-06 14:30</div>
|
|
<div class="timeline-content">
|
|
<strong>Preallarme CSIRT inviato</strong> per incidente INC-2024-047 (Ransomware)<br>
|
|
<span style="color: var(--text-secondary); font-size: 12px;">Notifica inviata entro 24h come richiesto</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="timeline-item">
|
|
<div class="timeline-time">2024-03-06 10:45</div>
|
|
<div class="timeline-content">
|
|
<strong>Incidente contenuto</strong> - INC-2024-047<br>
|
|
<span style="color: var(--text-secondary); font-size: 12px;">Server isolato, malware bloccato, nessuna crittografia dati</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="timeline-item">
|
|
<div class="timeline-time">2024-03-06 08:15</div>
|
|
<div class="timeline-content">
|
|
<strong>Nuovo incidente SEV-1</strong> - INC-2024-047<br>
|
|
<span style="color: var(--text-secondary); font-size: 12px;">Tentativo ransomware rilevato da EDR su server ERP</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="timeline-item">
|
|
<div class="timeline-time">2024-03-06 09:15</div>
|
|
<div class="timeline-content">
|
|
<strong>Preallarme CSIRT inviato</strong> per incidente INC-2024-046<br>
|
|
<span style="color: var(--text-secondary); font-size: 12px;">Accesso non autorizzato account privilegiato</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="timeline-item">
|
|
<div class="timeline-time">2024-03-05 14:32</div>
|
|
<div class="timeline-content">
|
|
<strong>Nuovo incidente SEV-2</strong> - INC-2024-046<br>
|
|
<span style="color: var(--text-secondary); font-size: 12px;">Rilevato accesso anomalo su account amministratore di dominio</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="timeline-item">
|
|
<div class="timeline-time">2024-03-04 18:45</div>
|
|
<div class="timeline-content">
|
|
<strong>Preallarme CSIRT inviato</strong> per incidente INC-2024-045<br>
|
|
<span style="color: var(--text-secondary); font-size: 12px;">DDoS su servizio web pubblico</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="timeline-item">
|
|
<div class="timeline-time">2024-03-03 15:20</div>
|
|
<div class="timeline-content">
|
|
<strong>Post-Incident Review completata</strong> - INC-2024-042<br>
|
|
<span style="color: var(--text-secondary); font-size: 12px;">Identificate 5 azioni correttive, tutte assegnate</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="timeline-item">
|
|
<div class="timeline-time">2024-03-01 11:00</div>
|
|
<div class="timeline-content">
|
|
<strong>Incidente chiuso</strong> - INC-2024-041<br>
|
|
<span style="color: var(--text-secondary); font-size: 12px;">Ripristino completato, servizi operativi, PIR pianificata</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- KPI Section -->
|
|
<div class="section" id="section-kpi">
|
|
<div class="section-header">
|
|
<div class="section-title">
|
|
KPI e Metriche Org.10
|
|
<span class="help-icon">?
|
|
<div class="tooltip">
|
|
<div class="tooltip-title">HELP DELLA SEZIONE</div>
|
|
Key Performance Indicators per la gestione incidenti secondo procedura Org.10. Monitoraggio trimestrale con target definiti.
|
|
</div>
|
|
</span>
|
|
</div>
|
|
<div>
|
|
<button class="btn" onclick="exportKPI()">Esporta Report</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="stats-grid">
|
|
<div class="stat-card success">
|
|
<div class="stat-label">TTD Medio (Time to Detect)</div>
|
|
<div class="stat-value">2.4h</div>
|
|
<div class="stat-sublabel">Trend: ↓ -15% vs trimestre precedente</div>
|
|
</div>
|
|
|
|
<div class="stat-card success">
|
|
<div class="stat-label">TTC Medio SEV-1 (Time to Contain)</div>
|
|
<div class="stat-value">0.8h</div>
|
|
<div class="stat-sublabel">Target: <1h ✅ Raggiunto
|
|
</div>
|
|
|
|
<div class="stat-card success">
|
|
<div class="stat-label">TTC Medio SEV-2 (Time to Contain)</div>
|
|
<div class="stat-value">3.2h</div>
|
|
<div class="stat-sublabel">Target: <4h ✅ Raggiunto</div>
|
|
</div>
|
|
|
|
<div class="stat-card success">
|
|
<div class="stat-label">TTR Medio (Time to Recover)</div>
|
|
<div class="stat-value">6.5h</div>
|
|
<div class="stat-sublabel">Conforme a RTO dichiarati</div>
|
|
</div>
|
|
|
|
<div class="stat-card success">
|
|
<div class="stat-label">Preallarme CSIRT entro 24h</div>
|
|
<div class="stat-value">100%</div>
|
|
<div class="stat-sublabel">12/12 incidenti significativi</div>
|
|
</div>
|
|
|
|
<div class="stat-card success">
|
|
<div class="stat-label">Notifica Completa entro 72h</div>
|
|
<div class="stat-value">100%</div>
|
|
<div class="stat-sublabel">Target: 100% ✅</div>
|
|
</div>
|
|
|
|
<div class="stat-card success">
|
|
<div class="stat-label">Relazione Finale entro 1 mese</div>
|
|
<div class="stat-value">100%</div>
|
|
<div class="stat-sublabel">9/9 completate nei tempi</div>
|
|
</div>
|
|
|
|
<div class="stat-card success">
|
|
<div class="stat-label">Post-Incident Review completate</div>
|
|
<div class="stat-value">100%</div>
|
|
<div class="stat-sublabel">Entro 2 settimane (SEV-1/2)</div>
|
|
</div>
|
|
|
|
<div class="stat-card success">
|
|
<div class="stat-label">Azioni Correttive chiuse</div>
|
|
<div class="stat-value">94%</div>
|
|
<div class="stat-sublabel">Target: ≥90% ✅</div>
|
|
</div>
|
|
|
|
<div class="stat-card success">
|
|
<div class="stat-label">Incidenti Ricorrenti</div>
|
|
<div class="stat-value">0</div>
|
|
<div class="stat-sublabel">Stessa root cause - Target: 0 ✅</div>
|
|
</div>
|
|
|
|
<div class="stat-card success">
|
|
<div class="stat-label">Esercitazioni Annuali</div>
|
|
<div class="stat-value">2</div>
|
|
<div class="stat-sublabel">Target: ≥1 ✅ Superato</div>
|
|
</div>
|
|
|
|
<div class="stat-card">
|
|
<div class="stat-label">Costo Medio Incidente</div>
|
|
<div class="stat-value">€8.5K</div>
|
|
<div class="stat-sublabel">Diretto + indiretto stimato</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div style="margin-top: 32px;">
|
|
<h3 style="font-size: 16px; font-weight: 600; margin-bottom: 16px;">Distribuzione Incidenti per Severità (Ultimi 12 mesi)</h3>
|
|
<div class="stats-grid" style="grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));">
|
|
<div class="stat-card critical">
|
|
<div class="stat-label">SEV-1 Critico</div>
|
|
<div class="stat-value">4</div>
|
|
<div class="stat-sublabel">8.5% del totale</div>
|
|
</div>
|
|
<div class="stat-card high">
|
|
<div class="stat-label">SEV-2 Alto</div>
|
|
<div class="stat-value">8</div>
|
|
<div class="stat-sublabel">17.0% del totale</div>
|
|
</div>
|
|
<div class="stat-card">
|
|
<div class="stat-label">SEV-3 Medio</div>
|
|
<div class="stat-value">18</div>
|
|
<div class="stat-sublabel">38.3% del totale</div>
|
|
</div>
|
|
<div class="stat-card">
|
|
<div class="stat-label">SEV-4 Basso</div>
|
|
<div class="stat-value">17</div>
|
|
<div class="stat-sublabel">36.2% del totale</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div style="margin-top: 32px;">
|
|
<h3 style="font-size: 16px; font-weight: 600; margin-bottom: 16px;">Distribuzione per Classificazione NIS2</h3>
|
|
<div class="stats-grid" style="grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));">
|
|
<div class="stat-card">
|
|
<div class="stat-label">IS-1 Impatto Servizi</div>
|
|
<div class="stat-value">5</div>
|
|
<div class="stat-sublabel">Notificati al CSIRT</div>
|
|
</div>
|
|
<div class="stat-card">
|
|
<div class="stat-label">IS-2 Impatto Dati</div>
|
|
<div class="stat-value">6</div>
|
|
<div class="stat-sublabel">Notificati al CSIRT</div>
|
|
</div>
|
|
<div class="stat-card">
|
|
<div class="stat-label">IS-3 Impatto Supply Chain</div>
|
|
<div class="stat-value">1</div>
|
|
<div class="stat-sublabel">Notificati al CSIRT</div>
|
|
</div>
|
|
<div class="stat-card" id="is4Card" style="display: none;">
|
|
<div class="stat-label">IS-4 Ricorrenti <span class="essential-badge">ESSENZIALI</span></div>
|
|
<div class="stat-value">0</div>
|
|
<div class="stat-sublabel">Notificati al CSIRT</div>
|
|
</div>
|
|
<div class="stat-card">
|
|
<div class="stat-label">Non Significativi</div>
|
|
<div class="stat-value">35</div>
|
|
<div class="stat-sublabel">Gestione interna</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
// Verifica tipo soggetto e adatta interfaccia
|
|
function checkSubjectType() {
|
|
const subjectType = sessionStorage.getItem('nis2_subject_type');
|
|
|
|
if (!subjectType) {
|
|
window.location.href = 'incident-gate.html';
|
|
return;
|
|
}
|
|
|
|
const badge = document.getElementById('subjectBadge');
|
|
const is4Option = document.getElementById('is4Option');
|
|
const is4Card = document.getElementById('is4Card');
|
|
const activeIncidentsAlert = document.getElementById('activeIncidentsAlert');
|
|
|
|
if (subjectType === 'essential') {
|
|
badge.textContent = 'Soggetto Essenziale';
|
|
badge.classList.remove('important');
|
|
badge.classList.add('essential');
|
|
|
|
// Mostra opzioni IS-4 solo per essenziali
|
|
if (is4Option) is4Option.style.display = 'block';
|
|
if (is4Card) is4Card.style.display = 'block';
|
|
} else {
|
|
badge.textContent = 'Soggetto Importante';
|
|
badge.classList.remove('essential');
|
|
badge.classList.add('important');
|
|
|
|
// Nascondi opzioni IS-4 per importanti
|
|
if (is4Option) is4Option.style.display = 'none';
|
|
if (is4Card) is4Card.style.display = 'none';
|
|
}
|
|
|
|
// Mostra alert se ci sono incidenti attivi
|
|
const activeCount = 3; // Simulato
|
|
if (activeCount > 0) {
|
|
activeIncidentsAlert.style.display = 'block';
|
|
document.getElementById('activeIncidentsCount').textContent = activeCount;
|
|
}
|
|
}
|
|
|
|
function showTab(tabName) {
|
|
// Nascondi tutte le sezioni
|
|
document.querySelectorAll('.section').forEach(section => {
|
|
section.classList.remove('active');
|
|
});
|
|
|
|
// Rimuovi active da tutti i tab
|
|
document.querySelectorAll('.tab').forEach(tab => {
|
|
tab.classList.remove('active');
|
|
});
|
|
|
|
// Mostra la sezione selezionata
|
|
document.getElementById('section-' + tabName).classList.add('active');
|
|
|
|
// Attiva il tab selezionato
|
|
event.target.classList.add('active');
|
|
}
|
|
|
|
function viewIncident(incidentCode) {
|
|
window.location.href = 'incident-detail.html?id=' + incidentCode;
|
|
}
|
|
|
|
function viewNotification(incidentCode) {
|
|
window.location.href = 'incident-notification.html?id=' + incidentCode;
|
|
}
|
|
|
|
function refreshData() {
|
|
alert('Dati aggiornati con successo');
|
|
location.reload();
|
|
}
|
|
|
|
function exportKPI() {
|
|
// Simula export
|
|
const tooltip = document.createElement('div');
|
|
tooltip.style.cssText = `
|
|
position: fixed;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translate(-50%, -50%);
|
|
background: var(--bg-secondary);
|
|
border: 1px solid var(--border-color);
|
|
border-radius: 8px;
|
|
padding: 24px;
|
|
box-shadow: 0 8px 24px rgba(0,0,0,0.5);
|
|
z-index: 10000;
|
|
max-width: 400px;
|
|
`;
|
|
tooltip.innerHTML = `
|
|
<h3 style="margin-bottom: 16px; color: var(--text-primary);">📊 Export Report KPI</h3>
|
|
<p style="color: var(--text-secondary); margin-bottom: 16px; font-size: 13px;">
|
|
Report trimestrale KPI Org.10 - Gestione Incidenti<br>
|
|
Periodo: Q1 2024 (Gen-Mar 2024)
|
|
</p>
|
|
<div style="background: var(--bg-tertiary); padding: 12px; border-radius: 4px; margin-bottom: 16px; font-family: monospace; font-size: 12px;">
|
|
📄 KPI_Report_Q1_2024.xlsx<br>
|
|
📄 KPI_Report_Q1_2024.pdf<br>
|
|
📄 Incident_Log_Q1_2024.csv
|
|
</div>
|
|
<button onclick="this.parentElement.remove()" style="width: 100%; padding: 10px; background: var(--accent-primary); border: none; border-radius: 6px; color: white; font-weight: 600; cursor: pointer;">
|
|
Chiudi
|
|
</button>
|
|
`;
|
|
document.body.appendChild(tooltip);
|
|
}
|
|
|
|
// Inizializza al caricamento
|
|
window.addEventListener('DOMContentLoaded', checkSubjectType);
|
|
</script>
|
|
</body>
|
|
</html>
|