108 lines
4.4 KiB
HTML
108 lines
4.4 KiB
HTML
<!doctype html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
<title>剑网三插件管理</title>
|
|
<link rel="icon" href="data:," />
|
|
<link rel="stylesheet" href="./style.css" />
|
|
</head>
|
|
<body>
|
|
<main class="shell">
|
|
<header class="page-header">
|
|
<div>
|
|
<h1>剑网三插件管理</h1>
|
|
<p>管理会话区服绑定、事件订阅状态、区服别名与心法别名。</p>
|
|
</div>
|
|
<button class="button button--secondary" id="refresh" type="button">刷新数据</button>
|
|
</header>
|
|
|
|
<section class="summary" aria-label="数据概览">
|
|
<div class="summary__item">
|
|
<span>已绑定会话</span>
|
|
<strong id="binding-count">—</strong>
|
|
</div>
|
|
<div class="summary__item">
|
|
<span>事件推送会话</span>
|
|
<strong id="subscription-count">—</strong>
|
|
</div>
|
|
<div class="summary__item">
|
|
<span>区服别名</span>
|
|
<strong id="alias-count">—</strong>
|
|
</div>
|
|
<div class="summary__item">
|
|
<span>心法条目</span>
|
|
<strong id="kungfu-count">—</strong>
|
|
</div>
|
|
</section>
|
|
|
|
<nav class="tabs" aria-label="管理分类" role="tablist">
|
|
<button class="tab is-active" type="button" role="tab" aria-selected="true" data-tab="bindings">会话绑定</button>
|
|
<button class="tab" type="button" role="tab" aria-selected="false" data-tab="subscriptions">事件订阅</button>
|
|
<button class="tab" type="button" role="tab" aria-selected="false" data-tab="aliases">区服别名</button>
|
|
<button class="tab" type="button" role="tab" aria-selected="false" data-tab="kungfu">心法别名</button>
|
|
</nav>
|
|
|
|
<section class="panel is-active" id="bindings-panel" role="tabpanel">
|
|
<form class="editor" id="binding-form">
|
|
<label>
|
|
<span>会话 ID</span>
|
|
<input id="binding-session" name="session_id" maxlength="512" placeholder="例如：QQ:GroupMessage:123456" required />
|
|
</label>
|
|
<label>
|
|
<span>绑定区服</span>
|
|
<input id="binding-server" name="server" maxlength="64" list="server-options" placeholder="选择或输入标准区服名/别名" required />
|
|
</label>
|
|
<button class="button button--primary" type="submit">保存绑定</button>
|
|
</form>
|
|
<div class="table-wrap">
|
|
<table>
|
|
<thead><tr><th>会话 ID</th><th>绑定区服</th><th class="actions">操作</th></tr></thead>
|
|
<tbody id="bindings-body"></tbody>
|
|
</table>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="panel" id="subscriptions-panel" role="tabpanel" hidden>
|
|
<div class="section-intro">
|
|
<div><h2>所有会话事件状态</h2><p>总开关和已订阅事件均来自本地订阅表。</p></div>
|
|
</div>
|
|
<div class="table-wrap">
|
|
<table>
|
|
<thead><tr><th>会话 ID</th><th>绑定区服</th><th>总开关</th><th>已订阅事件</th></tr></thead>
|
|
<tbody id="subscriptions-body"></tbody>
|
|
</table>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="panel" id="aliases-panel" role="tabpanel" hidden>
|
|
<div class="section-intro">
|
|
<div><h2>区服别名</h2><p>标准区服名称为只读；点击对应行的“编辑”可修改别名。</p></div>
|
|
</div>
|
|
<div class="table-wrap">
|
|
<table>
|
|
<thead><tr><th>标准区服名</th><th>别名</th><th class="actions">操作</th></tr></thead>
|
|
<tbody id="aliases-body"></tbody>
|
|
</table>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="panel" id="kungfu-panel" role="tabpanel" hidden>
|
|
<div class="section-intro">
|
|
<div><h2>心法别名</h2><p>标准心法名称为只读；点击对应行的“编辑”可修改最多 5 个别名。</p></div>
|
|
</div>
|
|
<div class="table-wrap">
|
|
<table>
|
|
<thead><tr><th>标准心法名</th><th>别名</th><th class="actions">操作</th></tr></thead>
|
|
<tbody id="kungfu-body"></tbody>
|
|
</table>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
|
|
<datalist id="server-options"></datalist>
|
|
<div class="toast" id="toast" role="status" aria-live="polite"></div>
|
|
<script type="module" src="./app.js"></script>
|
|
</body>
|
|
</html>
|