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

ui: show Top20 rank sheet below toolbar instead of over chart

Browse Source 
Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
dekun
2026-06-08 16:11:11 +08:00
parent 4c55932906
commit 5fb4a10638
3 changed files with 68 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files
manual_trading_hub/static/chart.js
+27 -29
View File
@@ -91,9 +91,8 @@
const elSymbol = document.getElementById("market-symbol");
const elVolRankMeta = document.getElementById("market-vol-rank-meta");
const elVolRankList = document.getElementById("market-vol-rank-list");
const elVolRankDetails = document.getElementById("market-vol-rank");
const elVolRankPanel =
elVolRankDetails && elVolRankDetails.querySelector(".market-vol-rank-panel");
const elVolRankBtn = document.getElementById("market-vol-rank-btn");
const elVolRankSheet = document.getElementById("market-vol-rank-sheet");
const elTf = document.getElementById("market-timeframe");
const elRefresh = document.getElementById("market-refresh");
const elStatus = document.getElementById("market-status");
@@ -2618,30 +2617,31 @@
void postChartUnwatch();
}
function positionVolRankPanel() {
if (!elVolRankDetails || !elVolRankPanel || !elVolRankDetails.open) return;
const summary = elVolRankDetails.querySelector("summary");
if (!summary) return;
const rect = summary.getBoundingClientRect();
const panelW = elVolRankPanel.offsetWidth || 300;
let left = rect.right - panelW;
left = Math.max(8, Math.min(left, window.innerWidth - panelW - 8));
const top = rect.bottom + 4;
const maxH = Math.min(420, window.innerHeight - top - 12);
elVolRankPanel.style.left = left + "px";
elVolRankPanel.style.top = top + "px";
elVolRankPanel.style.maxHeight = Math.max(180, maxH) + "px";
function setVolRankSheetOpen(open) {
const on = !!open;
if (elVolRankSheet) {
elVolRankSheet.classList.toggle("hidden", !on);
elVolRankSheet.setAttribute("aria-hidden", on ? "false" : "true");
}
if (elVolRankBtn) {
elVolRankBtn.classList.toggle("is-active", on);
elVolRankBtn.setAttribute("aria-expanded", on ? "true" : "false");
}
if (on) void loadVolumeRank();
}
function bindVolRankPanel() {
if (!elVolRankDetails) return;
elVolRankDetails.addEventListener("toggle", function () {
if (elVolRankDetails.open) {
requestAnimationFrame(positionVolRankPanel);
}
if (!elVolRankBtn) return;
elVolRankBtn.addEventListener("click", function () {
const open = elVolRankSheet && elVolRankSheet.classList.contains("hidden");
setVolRankSheetOpen(open);
});
document.addEventListener("pointerdown", function (ev) {
if (!elVolRankSheet || elVolRankSheet.classList.contains("hidden")) return;
const t = ev.target;
if (elVolRankSheet.contains(t) || (elVolRankBtn && elVolRankBtn.contains(t))) return;
setVolRankSheetOpen(false);
});
window.addEventListener("resize", positionVolRankPanel);
window.addEventListener("scroll", positionVolRankPanel, true);
}
function renderVolumeRank(data) {
@@ -2696,15 +2696,12 @@
btn.addEventListener("click", function () {
if (!elSymbol || !row.symbol) return;
elSymbol.value = row.symbol;
if (elVolRankDetails) elVolRankDetails.open = false;
setVolRankSheetOpen(false);
loadChart(false);
});
li.appendChild(btn);
elVolRankList.appendChild(li);
});
if (elVolRankDetails && elVolRankDetails.open) {
requestAnimationFrame(positionVolRankPanel);
}
}
async function loadVolumeRank(forceRefresh) {
@@ -2745,7 +2742,6 @@
readQuery();
applyDefaults();
updateExchangeDisplay();
void loadVolumeRank();
}
async function loadChart(force, options) {
@@ -2886,7 +2882,9 @@
updateExchangeDisplay();
syncFsToolbarFromMain();
lastViewKey = "";
void loadVolumeRank();
if (elVolRankSheet && !elVolRankSheet.classList.contains("hidden")) {
void loadVolumeRank();
}
loadChart(false);
});
}