Дмитрий
47 lines
2.2 KiB
HTML
47 lines
2.2 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="ru">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
<title>Дашборд мозга — Лидерра</title>
|
|
<style>
|
|
body { margin:0; height:100vh; display:flex; flex-direction:column; background:#1e1e2e; color:#fdf6e3; font-family:system-ui,sans-serif; overflow:hidden; }
|
|
#tabbar { background:#073642; border-bottom:1px solid #586e75; padding:8px 12px; display:flex; align-items:center; gap:10px; flex-shrink:0; }
|
|
#tabbar button { background:#073642; border:1px solid #586e75; color:#93a1a1; border-radius:5px; padding:5px 12px; font-size:13px; cursor:pointer; }
|
|
#tabbar button.active { background:#0d4a5a; color:#fdf6e3; border-color:#839496; }
|
|
#tabbar button:hover { background:#0d4a5a; color:#fdf6e3; }
|
|
#status { margin-left:auto; font-size:12px; color:#839496; }
|
|
#graph { height:40vh; background:#1e1e2e; flex-shrink:0; border-bottom:1px solid #586e75; }
|
|
#network { background:#1e1e2e; }
|
|
#workarea { flex:1; overflow:auto; padding:16px; }
|
|
.view { display:none; }
|
|
.view.active { display:block; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<header id="tabbar">
|
|
<button data-view="map">Карта</button>
|
|
<button data-view="replay">Разбор</button>
|
|
<button data-view="feed">Лента</button>
|
|
<button data-view="aggregate">Агрегат</button>
|
|
<span id="status"></span>
|
|
</header>
|
|
<section id="graph">
|
|
<div id="network" style="width:100%;height:100%"></div>
|
|
</section>
|
|
<section id="workarea">
|
|
<div class="view" id="view-map">
|
|
<p>Топология мозга: 124 узла, рёбра, 11 размеченных дизайн-конфликтов. Это нулевое состояние холста — без оверлеев.</p>
|
|
<ul id="map-conflicts"></ul>
|
|
</div>
|
|
<div class="view" id="view-replay"></div>
|
|
<div class="view" id="view-feed"></div>
|
|
<div class="view" id="view-aggregate"></div>
|
|
</section>
|
|
|
|
<script src="https://unpkg.com/vis-network@9.1.9/standalone/umd/vis-network.min.js"></script>
|
|
<script src="../automation-graph-data.js"></script>
|
|
<script type="module" src="dashboard.js"></script>
|
|
</body>
|
|
</html>
|