diff --git a/frontend/console.html b/frontend/console.html index 939070f..53d0884 100644 --- a/frontend/console.html +++ b/frontend/console.html @@ -614,11 +614,62 @@ margin-bottom: 12px; } + .workspace-panel { + margin-top: 18px; + } + + .workspace-head { + display: flex; + justify-content: space-between; + align-items: center; + gap: 16px; + margin-bottom: 14px; + } + + .workspace-tabs { + display: flex; + flex-wrap: wrap; + gap: 8px; + } + + .workspace-tab { + appearance: none; + border: 1px solid rgba(255,255,255,0.08); + background: rgba(255,255,255,0.03); + color: var(--muted); + cursor: pointer; + border-radius: 999px; + padding: 9px 12px; + font-size: 11px; + font-family: "IBM Plex Mono", monospace; + text-transform: uppercase; + letter-spacing: 0.06em; + transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease; + } + + .workspace-tab.active { + color: var(--cold); + border-color: rgba(126, 200, 255, 0.28); + background: rgba(126, 200, 255, 0.12); + } + + .tab-pane { + display: none; + } + + .tab-pane.active { + display: block; + } + .stream-list { display: grid; gap: 10px; } + .workspace-stream { + min-height: 240px; + } + .event-list { display: grid; gap: 10px; @@ -1271,38 +1322,6 @@
-
-
-
-
Coordination Layer
-

信号与执行协同

-
把 Agent 状态和最近决策合并观察，减少来回切换
-
-
-
-
-
-
Agent Layer
-

Crypto Agent 状态

-
最近信号、平台停机、执行层状态
-
-
-
正在读取 Agent 状态...
-
-
-
-
-
Decision Layer
-

最近决策预览

-
最近一轮各平台准备执行的动作
-
-
-
正在读取决策预览...
-
-
-
-
-
@@ -1319,73 +1338,111 @@
-
-
-
-
-
-
Market Layer
-

最近信号流

-
数据库最新信号与等级/置信度
-
-
-
-
正在读取信号...
-
-
+
+
+
+
Workspace Layer
+

交易工作区

+
次级明细放进 tab，保留一个干净的管理视角
+
+
+ + + +
-
-
-
-
-
Execution Layer
-

执行事件流

-
最近执行结果、未执行原因、平台异常
+
+
+
+
+
Agent Layer
+

Crypto Agent 状态

+
最近信号、平台停机、执行层状态
+
+
+
正在读取 Agent 状态...
-
- - - - - +
+
+
Decision Layer
+

最近决策预览

+
最近一轮各平台准备执行的动作
+
+
+
正在读取决策预览...
+
-
-
正在读取执行事件...
-
-
+
+
+ +
+
+
Market Layer
+

最近信号流

+
数据库最新信号与等级、置信度、时间分布
+
+
+
正在读取信号...
+
+
+ +
+
+
Execution Layer
+

执行事件流

+
最近执行结果、未执行原因、平台异常
+
+
+ + + + + +
+
+
正在读取执行事件...
+
-
-
-
-
-
Position Layer
-

统一持仓视图

-
三端持仓合并，优先看风险与盈亏
-
+
+
+
+
Asset Layer
+

资产与挂单

+
统一持仓和统一挂单改为切换查看，减少表格同时占屏
+
+
+ + +
+
+ +
+
+
Position Layer
+

统一持仓视图

+
三端持仓合并，优先看风险与盈亏
正在整理跨平台持仓...
-
+
-
-
-
-
Order Layer
-

统一挂单视图

-
入场单、保护单、资金占用一屏观察
-
+
+
+
Order Layer
+

统一挂单视图

+
入场单、保护单、资金占用一屏观察
正在整理跨平台挂单...
-
+
@@ -1464,6 +1521,24 @@ el.innerHTML = `
${message}
`; } + function initTabs() { + document.querySelectorAll('[data-tab-group]').forEach((groupEl) => { + const group = groupEl.getAttribute('data-tab-group'); + const buttons = groupEl.querySelectorAll('[data-tab]'); + buttons.forEach((button) => { + button.addEventListener('click', () => { + const target = button.getAttribute('data-target'); + buttons.forEach((item) => { + item.classList.toggle('active', item === button); + }); + document.querySelectorAll(`[data-tab-pane="${group}"]`).forEach((pane) => { + pane.classList.toggle('active', pane.id === target); + }); + }); + }); + }); + } + function toneClassForHealth(status) { if (['error', 'failed', 'stopped'].includes(String(status || '').toLowerCase())) return 'danger'; if (['warning', 'halted', 'idle'].includes(String(status || '').toLowerCase())) return 'warn'; @@ -2088,6 +2163,7 @@ }); }); + initTabs(); applyAutoRefreshState(); loadConsole();