<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>xiaoo-daemon dashboard</title>
<link rel="stylesheet" href="/style.css" />
</head>
<body>
<header class="topbar">
<div class="brand">
<span class="logo">◆</span>
<h1>xiaoo-daemon dashboard</h1>
</div>
<div class="meta">
<span id="server-time" class="muted">--</span>
<span class="dot" id="status-dot" data-state="loading"></span>
<span id="status-text" class="muted">connecting…</span>
</div>
</header>
<main>
<section class="cards" id="overview-cards">
<article class="card">
<div class="card-title">Sessions</div>
<div class="card-value" id="sessions-total">--</div>
<ul class="card-breakdown" id="sessions-breakdown"></ul>
</article>
<article class="card">
<div class="card-title">Sandboxes</div>
<div class="card-value" id="sandboxes-total">--</div>
<ul class="card-breakdown" id="sandboxes-breakdown"></ul>
</article>
<article class="card">
<div class="card-title">Sessions without sandbox</div>
<div class="card-value" id="sessions-no-sandbox">--</div>
<p class="card-hint muted">idle/running but not bound to a backend</p>
</article>
<article class="card">
<div class="card-title">Orphan sandboxes</div>
<div class="card-value" id="orphan-sandboxes">--</div>
<p class="card-hint muted">live backend, no session attached</p>
</article>
</section>
<section class="block">
<div class="block-head">
<h2>Sessions</h2>
<span class="muted" id="sessions-count">0</span>
</div>
<div class="table-wrap">
<table id="sessions-table">
<thead>
<tr>
<th>session_id</th>
<th>status</th>
<th>agent</th>
<th>model</th>
<th>channel</th>
<th>conversation</th>
<th>backend_id</th>
<th>backend state</th>
<th>updated</th>
</tr>
</thead>
<tbody id="sessions-tbody">
<tr><td colspan="9" class="empty">loading…</td></tr>
</tbody>
</table>
</div>
</section>
<section class="block">
<div class="block-head">
<h2>Sandboxes</h2>
<span class="muted" id="sandboxes-count">0</span>
</div>
<div class="table-wrap">
<table id="sandboxes-table">
<thead>
<tr>
<th>backend_id</th>
<th>provider</th>
<th>state</th>
<th>workspace_root</th>
<th>endpoint</th>
<th>session_ids</th>
<th>expires</th>
</tr>
</thead>
<tbody id="sandboxes-tbody">
<tr><td colspan="7" class="empty">loading…</td></tr>
</tbody>
</table>
</div>
</section>
</main>
<footer class="muted small">
Auto-refresh every 5s. Read-only view — no actions available.
</footer>
<script src="/app.js"></script>
</body>
</html>
