From 78c44fdeab1846bdcdd4fca6cfe7134a79cdfcd2 Mon Sep 17 00:00:00 2001 From: dekun Date: Fri, 17 Jul 2026 11:24:41 +0800 Subject: [PATCH] Fix funds overview clipping on 1920x1080. Make the funds stage scrollable, give the equity chart a fixed height so date labels fit, and stop truncating account cards without a scrollbar. Co-authored-by: Cursor --- manual_trading_hub/static/app.css | 44 ++++++++++++++-------------- manual_trading_hub/static/funds.js | 35 ++++++++++++++-------- manual_trading_hub/static/index.html | 4 +-- 3 files changed, 47 insertions(+), 36 deletions(-) diff --git a/manual_trading_hub/static/app.css b/manual_trading_hub/static/app.css index a109acb..efefe74 100644 --- a/manual_trading_hub/static/app.css +++ b/manual_trading_hub/static/app.css @@ -10223,15 +10223,19 @@ html[data-theme="light"] .hub-logs-card-hint { min-height: 0; display: flex; flex-direction: column; + overflow: hidden; } + /* 内容超出时在此滚动,避免 1080 裁切曲线日期/分户卡片且无滚动条 */ body.hub-page-funds:not(.hub-phone) .funds-stage-inner { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; - padding: 8px 12px 10px; - overflow: hidden; + padding: 8px 12px 16px; + overflow-x: hidden; + overflow-y: auto; + overscroll-behavior: contain; } body.hub-page-funds:not(.hub-phone) .funds-head { @@ -10270,18 +10274,23 @@ html[data-theme="light"] .hub-logs-card-hint { } body.hub-page-funds:not(.hub-phone) .funds-chart-panel { - flex: 1 1 0; - min-height: 280px; + flex: 0 0 auto; + height: min(420px, 46vh); + min-height: 300px; max-height: none; - margin-bottom: 8px; + margin-bottom: 10px; display: flex; flex-direction: column; + overflow: hidden; } body.hub-page-funds:not(.hub-phone) .funds-chart-host { flex: 1 1 auto; height: auto; - min-height: 260px; + min-height: 0; + /* 给 Lightweight Charts 时间轴留出空间,避免日期被裁切 */ + padding-bottom: 2px; + box-sizing: border-box; } body.hub-page-funds:not(.hub-phone) .funds-section-head { @@ -10290,13 +10299,11 @@ html[data-theme="light"] .hub-logs-card-hint { } body.hub-page-funds:not(.hub-phone) .funds-accounts { - flex: 0 1 auto; - min-height: 0; - max-height: min(260px, 28vh); - overflow-x: hidden; - overflow-y: auto; + flex: 0 0 auto; + max-height: none; + overflow: visible; gap: 8px; - padding: 0 2px 4px 0; + padding: 0 0 8px; } body.hub-page-funds:not(.hub-phone) .funds-ac-card { @@ -10305,7 +10312,7 @@ html[data-theme="light"] .hub-logs-card-hint { } } -/* 1920×1080 一类矮屏:再压紧上方 KPI,把高度让给资金曲线 */ +/* 1920×1080:略压 KPI,曲线固定高度,分户完整可见可滚到底 */ @media (min-width: 1600px) and (min-height: 900px) and (max-height: 1100px) { body.hub-page-funds:not(.hub-phone) .funds-head { margin-bottom: 2px !important; @@ -10331,14 +10338,7 @@ html[data-theme="light"] .hub-logs-card-hint { } body.hub-page-funds:not(.hub-phone) .funds-chart-panel { - min-height: 320px; - } - - body.hub-page-funds:not(.hub-phone) .funds-chart-host { - min-height: 300px; - } - - body.hub-page-funds:not(.hub-phone) .funds-accounts { - max-height: min(220px, 24vh); + height: 360px; + min-height: 360px; } } diff --git a/manual_trading_hub/static/funds.js b/manual_trading_hub/static/funds.js index cd1286f..a0e1f87 100644 --- a/manual_trading_hub/static/funds.js +++ b/manual_trading_hub/static/funds.js @@ -114,13 +114,25 @@ function createAreaChart(host) { const p = chartPalette(); const c = LightweightCharts.createChart(host, { - layout: { background: { color: p.bg }, textColor: p.text }, + layout: { + background: { color: p.bg }, + textColor: p.text, + fontSize: 11, + }, grid: { vertLines: { color: p.border, visible: true }, horzLines: { color: p.border, visible: true }, }, - rightPriceScale: { borderColor: p.border }, - timeScale: { borderColor: p.border, timeVisible: true }, + rightPriceScale: { + borderColor: p.border, + scaleMargins: { top: 0.08, bottom: 0.08 }, + }, + timeScale: { + borderColor: p.border, + timeVisible: true, + fixLeftEdge: true, + fixRightEdge: true, + }, crosshair: { mode: LightweightCharts.CrosshairMode.Normal }, handleScroll: { mouseWheel: true, pressedMouseMove: true }, handleScale: { axisPressedMouseMove: true, mouseWheel: true, pinch: true }, @@ -132,17 +144,16 @@ lineWidth: 2, priceFormat: { type: "price", precision: 2, minMove: 0.01 }, }); + function syncSize() { + if (!c || !host) return; + const w = Math.max(host.clientWidth || 0, 1); + const h = Math.max(host.clientHeight || 0, 200); + c.applyOptions({ width: w, height: h }); + } new ResizeObserver(function () { - if (c && host) { - const w = Math.max(host.clientWidth || 0, 1); - const h = Math.max(host.clientHeight || 0, 1); - c.applyOptions({ width: w, height: h }); - } + syncSize(); }).observe(host); - c.applyOptions({ - width: Math.max(host.clientWidth || 0, 1), - height: Math.max(host.clientHeight || 0, 200), - }); + syncSize(); return { chart: c, series: s }; } diff --git a/manual_trading_hub/static/index.html b/manual_trading_hub/static/index.html index 1a364c9..074ba85 100644 --- a/manual_trading_hub/static/index.html +++ b/manual_trading_hub/static/index.html @@ -15,7 +15,7 @@ - + @@ -1312,7 +1312,7 @@ - +