dekun/crypto_okx_hub
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

工作台左侧客户端支持折叠，带鱼屏两侧留边。

Browse Source 
折叠状态本地记住；总览/工作台内容限宽居中。

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
dekun
2026-10-01 12:01:36 +08:00
parent 1ddd941511
commit ad6eef3873
2 changed files with 130 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
templates/desk.html
+39 -7
View File
@@ -1,31 +1,63 @@
{% extends "base.html" %}
{% block title %}工作台 · 期权中控{% endblock %}
{% block body %}
<section class="desk">
<aside class="desk-side">
<h2>客户端</h2>
<section class="desk" id="desk-root">
<aside class="desk-side" id="desk-side">
<div class="desk-side-head">
<h2 class="desk-side-title">客户端</h2>
<button type="button" class="desk-side-toggle" id="desk-side-toggle" title="折叠/展开" aria-label="折叠客户端列表">‹</button>
</div>
<ul class="desk-list">
{% for inst in instances %}
<li class="{% if current and current.id == inst.id %}active{% endif %}">
<a href="/desk?id={{ inst.id }}">{{ inst.name }}</a>
<li class="{% if current and current.id == inst.id %}active{% endif %}" title="{{ inst.name }}">
<a href="/desk?id={{ inst.id }}">
<span class="desk-list-name">{{ inst.name }}</span>
</a>
</li>
{% else %}
<li class="muted">无启用实例</li>
<li class="muted desk-list-empty">无启用实例</li>
{% endfor %}
</ul>
</aside>
<div class="desk-main">
{% if current and open_url %}
<div class="desk-toolbar">
<button type="button" class="desk-side-toggle desk-side-toggle--bar" id="desk-side-toggle-bar" title="展开客户端列表" aria-label="展开客户端列表">›</button>
<strong>{{ current.name }}</strong>
<span class="muted">{{ current.base_url }}</span>
<a class="btn" href="{{ open_url }}" target="_blank" rel="noopener">新标签打开</a>
<a class="btn" href="/" >回总览</a>
<a class="btn" href="/">回总览</a>
</div>
<iframe class="desk-frame" src="{{ open_url }}" title="{{ current.name }}"></iframe>
{% else %}
<div class="desk-toolbar">
<button type="button" class="desk-side-toggle desk-side-toggle--bar" id="desk-side-toggle-bar" title="展开客户端列表" aria-label="展开客户端列表">›</button>
</div>
<div class="empty">请从左侧选择客户端,或到「实例」添加公网 crypto_okx.</div>
{% endif %}
</div>
</section>
{% endblock %}
{% block scripts %}
<script>
(function () {
var KEY = "hub_desk_side_collapsed";
var root = document.getElementById("desk-root");
if (!root) return;
function apply(collapsed) {
root.classList.toggle("is-side-collapsed", !!collapsed);
try { localStorage.setItem(KEY, collapsed ? "1" : "0"); } catch (e) {}
}
function toggle() {
apply(!root.classList.contains("is-side-collapsed"));
}
var btn = document.getElementById("desk-side-toggle");
var bar = document.getElementById("desk-side-toggle-bar");
if (btn) btn.addEventListener("click", toggle);
if (bar) bar.addEventListener("click", toggle);
var saved = false;
try { saved = localStorage.getItem(KEY) === "1"; } catch (e) {}
apply(saved);
})();
</script>
{% endblock %}