diff --git a/lib/common/static/instance_theme.css b/lib/common/static/instance_theme.css index cf49c12..cef4fcd 100644 --- a/lib/common/static/instance_theme.css +++ b/lib/common/static/instance_theme.css @@ -76,8 +76,22 @@ align-items: stretch; } - .instance-toolbar-filter.list-window-bar { - flex-basis: auto; + .instance-header-toolbar { + flex-direction: column; + align-items: stretch; + gap: 10px; + } + + .instance-header-toolbar-filter { + flex-wrap: wrap; + } + + .instance-header-theme { + align-self: flex-end; + } + + .instance-header-stats { + grid-template-columns: repeat(2, minmax(0, 1fr)); } .stat-strip-inner { @@ -511,14 +525,17 @@ html[data-theme="light"] .theme-toggle-btn.is-active { margin-top: 6px; } -/* ── 顶栏：状态 + 列表筛选 同一行 ── */ -.instance-toolbar-row { +/* ── 统一顶栏面板：状态/筛选 + 统计条 ── */ +.instance-header-panel { + margin-bottom: 12px; + padding: 10px 14px; +} + +.instance-header-toolbar { display: flex; flex-wrap: wrap; align-items: center; - justify-content: space-between; gap: 10px 14px; - margin-bottom: 12px; } .instance-toolbar-status { @@ -529,59 +546,88 @@ html[data-theme="light"] .theme-toggle-btn.is-active { flex: 0 1 auto; } -.instance-toolbar-filter.list-window-bar { - flex: 1 1 320px; - margin-bottom: 0; +.instance-header-toolbar-filter { + display: flex; + flex-wrap: wrap; + align-items: center; + gap: 8px 10px; + flex: 1 1 200px; + min-width: 0; + font-size: 0.82rem; +} + +.instance-header-toolbar-filter label { + display: inline-flex; + align-items: center; + gap: 6px; + color: #9aa; + margin: 0; +} + +.instance-header-theme { + flex: 0 0 auto; + margin-left: auto; } .list-window-label { color: #cfd3ef; + font-size: 0.82rem; + white-space: nowrap; } .list-window-hint { color: #8892b0; - font-size: 0.75rem; + font-size: 0.72rem; + white-space: nowrap; } .list-window-apply { - padding: 6px 12px; + padding: 5px 12px; + font-size: 0.82rem; } -/* ── 单行统计卡 ── */ -.stat-strip { - margin-bottom: 12px; - padding: 10px 14px; -} - -.stat-strip-inner { - display: flex; - flex-wrap: wrap; - gap: 8px 12px; - align-items: stretch; - justify-content: space-between; +.instance-header-stats { + display: grid; + grid-template-columns: repeat(7, minmax(0, 1fr)); + gap: 0; + margin-top: 10px; + padding-top: 10px; + border-top: 1px solid var(--border-soft, #2a3150); } .stat-strip-item { display: flex; flex-direction: column; - align-items: center; + align-items: flex-start; justify-content: center; - min-width: 72px; - flex: 1 1 0; - text-align: center; + min-width: 0; + padding: 0 12px; + border-right: 1px solid var(--border-soft, #2a3150); + text-align: left; +} + +.stat-strip-item:first-child { + padding-left: 0; +} + +.stat-strip-item:last-child { + border-right: none; + padding-right: 0; } .stat-strip-item .label { - font-size: 0.72rem; + font-size: 0.7rem; color: #8892b0; - margin-bottom: 4px; + margin-bottom: 3px; + white-space: nowrap; } .stat-strip-item .value { - font-size: 0.95rem; + font-size: 0.92rem; font-weight: 600; color: #e8ecff; line-height: 1.25; + white-space: nowrap; } .stat-strip-item--pnl .value.pnl-pos { @@ -592,10 +638,61 @@ html[data-theme="light"] .theme-toggle-btn.is-active { color: #ff6b7a; } +@media (max-width: 1100px) { + .instance-header-stats { + grid-template-columns: repeat(4, minmax(0, 1fr)); + row-gap: 10px; + } + + .stat-strip-item { + border-right: none; + padding: 0 8px 0 0; + } + + .stat-strip-item:first-child { + padding-left: 0; + } +} + +/* 旧片段兼容（若仍被引用） */ +.instance-toolbar-row { + display: flex; + flex-wrap: wrap; + align-items: center; + justify-content: space-between; + gap: 10px 14px; + margin-bottom: 12px; +} + +.instance-toolbar-filter.list-window-bar { + flex: 1 1 320px; + margin-bottom: 0; +} + +.stat-strip { + margin-bottom: 12px; + padding: 10px 14px; +} + +.stat-strip-inner { + display: grid; + grid-template-columns: repeat(7, minmax(0, 1fr)); + gap: 0; + align-items: stretch; +} + html[data-theme="light"] .stat-strip-item .value { color: #142232; } +html[data-theme="light"] .instance-header-stats { + border-top-color: #c8d4e0; +} + +html[data-theme="light"] .stat-strip-item { + border-right-color: #d8e2ec; +} + html[data-theme="light"] .list-window-label { color: #1a2838; } diff --git a/lib/instance/templates/embed_shell.html b/lib/instance/templates/embed_shell.html index e32b587..c31ab92 100644 --- a/lib/instance/templates/embed_shell.html +++ b/lib/instance/templates/embed_shell.html @@ -7,7 +7,7 @@ - + {{ exchange_display }} · 加密货币 | 交易监控复盘系统 @@ -41,8 +41,7 @@ {% if initial_tab != 'settings' %} - {% include 'instance_toolbar_row.html' %} - {% include 'instance_stats_strip.html' %} + {% include 'instance_header_panel.html' %} {% endif %} {% if initial_tab != 'settings' and include_transfer_block %} {% include 'instance_top_bar.html' %} diff --git a/lib/instance/templates/index.html b/lib/instance/templates/index.html index e2c594b..11a0d8a 100644 --- a/lib/instance/templates/index.html +++ b/lib/instance/templates/index.html @@ -17,7 +17,7 @@ {{ exchange_display }} · 加密货币 | 交易监控复盘系统 - + {{ msg[0] }}{% endif %}{% endwith %} {% if page != 'settings' %} - {% include 'instance_toolbar_row.html' %} - {% include 'instance_stats_strip.html' %} + {% include 'instance_header_panel.html' %} {% endif %} {% if page != 'settings' %} {% include 'instance_top_bar.html' %} diff --git a/lib/instance/templates/instance_header_panel.html b/lib/instance/templates/instance_header_panel.html new file mode 100644 index 0000000..ae098a8 --- /dev/null +++ b/lib/instance/templates/instance_header_panel.html @@ -0,0 +1,72 @@ +{# 统一顶栏：状态 + 筛选（上）· 统计条（下） #} +
+
+
+
{{ exchange_display }}
+ {% if trade_policy.badge_text %} + {{ trade_policy.badge_text }} + {% endif %} + {% include 'force_close_header_badge.html' %} + {{ risk_status.status_label|default('正常') }} +
+
+ UTC {{ list_window.label }} + + + + + + + 统计切日 {{ stats_bundle.stats_reset_hour|default(reset_hour) }}:00 +
+
+ + +
+
+
+
+
交易所
+
{{ exchange_display }}
+
+
+
总交易
+
{{ total }}
+
+
+
胜率
+
{{ rate }}%
+
+
+
资金账户
+
{% if funding_usdt is not none %}{{ funds_fmt(funding_usdt) }}U{% else %}—{% endif %}
+
+
+
交易日
+
{{ trading_day }}
+
+
+
当日资金
+
{{ funds_fmt(current_capital) }}U
+
+
+
实时盈亏
+
—
+
+
+
diff --git a/lib/instance/templates/instance_stats_strip.html b/lib/instance/templates/instance_stats_strip.html deleted file mode 100644 index 8909361..0000000 --- a/lib/instance/templates/instance_stats_strip.html +++ /dev/null @@ -1,33 +0,0 @@ -{# 单行统计卡：交易所 / 总交易 / 胜率 / 资金 / 交易日 / 当日资金 / 实时盈亏 #} -
-
-
-
交易所
-
{{ exchange_display }}
-
-
-
总交易
-
{{ total }}
-
-
-
胜率
-
{{ rate }}%
-
-
-
资金账户(USDT)
-
{% if funding_usdt is not none %}{{ funds_fmt(funding_usdt) }}U{% else %}—{% endif %}
-
-
-
交易日
-
{{ trading_day }}
-
-
-
当日资金(交易账户)
-
{{ funds_fmt(current_capital) }}U
-
-
-
实时盈亏
-
—
-
-
-
diff --git a/lib/instance/templates/instance_toolbar_row.html b/lib/instance/templates/instance_toolbar_row.html deleted file mode 100644 index 8f6400e..0000000 --- a/lib/instance/templates/instance_toolbar_row.html +++ /dev/null @@ -1,40 +0,0 @@ -{# 状态徽章 + 列表筛选 同一行 #} -
-
-
{{ exchange_display }}
- {% if trade_policy.badge_text %} - {{ trade_policy.badge_text }} - {% endif %} - {% include 'force_close_header_badge.html' %} - {{ risk_status.status_label|default('正常') }} -
- - -
-
-
- 列表筛选（UTC，默认当日）：{{ list_window.label }} - - - - - - - 统计页仍按北京时间 {{ stats_bundle.stats_reset_hour|default(reset_hour) }}:00 切日 -
-