saikyo-packages-src/saikyo-av-web/assets/web/index.html

183 lines
6.5 KiB
HTML

<!doctype html>
<html lang="ru">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Saikyo Antivirus</title>
<link rel="stylesheet" href="/styles.css" />
</head>
<body>
<div class="app">
<aside class="sidebar">
<div class="brand">
<div class="logo">S</div>
<div>
<div class="brand-title">Saikyo Antivirus</div>
<div class="brand-sub">Local Protection Center</div>
</div>
</div>
<nav class="nav">
<a class="nav-item active" href="#" data-view="dashboard">Dashboard</a>
<a class="nav-item" href="#" data-view="reports">Reports</a>
<a class="nav-item" href="#" data-view="settings">Settings</a>
</nav>
<div class="sidebar-footer">
<div class="pill" id="health-pill">Checking…</div>
<div class="small">127.0.0.1 only</div>
</div>
</aside>
<main class="main">
<header class="topbar">
<div class="topbar-left">
<h1 id="page-title">Dashboard</h1>
<div class="muted" id="page-sub">Обзор состояния и последние отчёты</div>
</div>
<div class="topbar-right">
<button class="btn" id="refresh-btn">Refresh</button>
</div>
</header>
<section class="content">
<div class="view" id="view-dashboard">
<div class="grid">
<div class="card">
<div class="card-title">Status</div>
<div class="card-value" id="status-value"></div>
<div class="card-hint" id="status-hint">waiting for health check</div>
</div>
<div class="card">
<div class="card-title">Reports</div>
<div class="card-value" id="reports-count"></div>
<div class="card-hint">available locally</div>
</div>
<div class="card">
<div class="card-title">Mode</div>
<div class="card-value">Consent</div>
<div class="card-hint">fixes require confirmation</div>
</div>
</div>
<div class="panel">
<div class="panel-head">
<div>
<div class="panel-title">Latest reports</div>
<div class="muted">Click a report to open details</div>
</div>
</div>
<div class="table" id="latest-table"></div>
</div>
</div>
<div class="view hidden" id="view-reports">
<div class="panel">
<div class="panel-head">
<div>
<div class="panel-title">Reports</div>
<div class="muted">Локальные отчёты Saikyo Antivirus</div>
</div>
<div class="panel-actions">
<input class="input" id="filter" placeholder="Filter by text…" />
</div>
</div>
<div class="table" id="reports-table"></div>
</div>
<div class="panel hidden" id="report-details">
<div class="panel-head">
<div>
<div class="panel-title" id="details-title">Report</div>
<div class="muted" id="details-sub"></div>
</div>
<div class="panel-actions">
<button class="btn-secondary" id="close-details">Close</button>
</div>
</div>
<div class="details-grid">
<div class="details-card">
<div class="details-label">Summary</div>
<div class="details-value" id="details-summary"></div>
</div>
<div class="details-card">
<div class="details-label">Severity</div>
<div class="details-badge" id="details-severity">unknown</div>
</div>
<div class="details-card">
<div class="details-label">Created</div>
<div class="details-value" id="details-created"></div>
</div>
</div>
<div class="split">
<div class="panel small-panel">
<div class="panel-head">
<div>
<div class="panel-title">Suggested fixes</div>
<div class="muted">Apply only after confirmation</div>
</div>
</div>
<div id="fixes"></div>
</div>
<div class="panel small-panel">
<div class="panel-head">
<div>
<div class="panel-title">Raw report (JSON)</div>
<div class="muted">Read-only view</div>
</div>
</div>
<pre class="code" id="raw"></pre>
</div>
</div>
</div>
</div>
<div class="view hidden" id="view-settings">
<div class="panel">
<div class="panel-head">
<div>
<div class="panel-title">Settings</div>
<div class="muted">Local UI (no telemetry by default)</div>
</div>
</div>
<div class="settings">
<div class="setting">
<div>
<div class="setting-title">Reports directory</div>
<div class="muted">/var/lib/saikyo-av/reports</div>
</div>
<div class="pill">read</div>
</div>
<div class="setting">
<div>
<div class="setting-title">Network binding</div>
<div class="muted">127.0.0.1:8765</div>
</div>
<div class="pill">local only</div>
</div>
<div class="setting">
<div>
<div class="setting-title">Fix policy</div>
<div class="muted">Always require explicit operator confirmation</div>
</div>
<div class="pill">consent</div>
</div>
</div>
</div>
</div>
</section>
</main>
</div>
<div class="toast" id="toast"></div>
<script src="/app.js"></script>
</body>
</html>