监控区持仓合约点击跳转行情区

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
dekun
2026-06-02 12:29:08 +08:00
parent 054cf01b7a
commit 1f13638732
4 changed files with 91 additions and 9 deletions
+25
View File
@@ -2060,6 +2060,31 @@ body.login-page {
margin-right: 4px;
}
.sym-link {
background: none;
border: none;
padding: 0;
margin: 0;
font: inherit;
color: var(--accent);
cursor: pointer;
text-align: left;
text-decoration: underline;
text-underline-offset: 2px;
}
.sym-link:hover {
color: #00ff9d;
}
.pos-symbol-link {
display: inline;
}
.pos-symbol-link strong {
font-weight: inherit;
}
.market-price-tag {
position: absolute;
right: 0;
+48 -6
View File
@@ -491,7 +491,47 @@
}
}
function normalizeMarketSymbol(raw) {
let s = (raw || "").trim().toUpperCase();
if (!s) return "";
if (s.includes(":")) {
const base = s.split(":")[0];
if (base.includes("/")) return base;
}
return s;
}
function resolveExchangeKey(exchangeId) {
const row = (lastMonitorRows || []).find((r) => String(r.id) === String(exchangeId));
return (row && (row.key || row.id)) || exchangeId;
}
function openMarketForPosition(exchangeId, symbol, exchangeKey) {
const exKey = exchangeKey || resolveExchangeKey(exchangeId);
const sym = normalizeMarketSymbol(symbol);
if (!exKey || !sym) {
showToast("无法打开行情:缺少交易所或合约", true);
return;
}
if (expandedExchangeId) {
closeExchangeFullscreen();
}
const qs = new URLSearchParams({ exchange_key: exKey, symbol: sym });
history.pushState({}, "", "/market?" + qs.toString());
setActiveNav();
if (window.hubMarketChart && window.hubMarketChart.openWith) {
window.hubMarketChart.openWith(exKey, sym);
}
}
function bindMonitorInteractions(box) {
box.querySelectorAll(".btn-open-market").forEach((btn) => {
btn.onclick = (ev) => {
ev.preventDefault();
ev.stopPropagation();
openMarketForPosition(btn.dataset.exId, btn.dataset.symbol, btn.dataset.exKey);
};
});
box.querySelectorAll(".btn-open-instance").forEach((btn) => {
btn.onclick = (ev) => {
ev.preventDefault();
@@ -662,8 +702,9 @@
return row("止损", sl) + row("止盈", tp);
}
function renderLivePositionCard(exchangeId, pos, monitorOrder) {
function renderLivePositionCard(exchangeId, exchangeKey, pos, monitorOrder) {
const symbol = pos.symbol || "";
const exKeyAttr = esc(exchangeKey || exchangeId || "").replace(/"/g, "&quot;");
const side = (pos.side || "long").toLowerCase();
const sideCn = sideDirLabel(side);
const sideCls = sideDirCls(side) || "side-long";
@@ -706,7 +747,7 @@
return `<div class="pos-card hub-pos-card">
<div class="pos-card-head">
<div class="pos-card-symbol">
<strong>${esc(symbol)}</strong>
<button type="button" class="btn-open-market sym-link pos-symbol-link" data-ex-id="${esc(exchangeId)}" data-ex-key="${exKeyAttr}" data-symbol="${symAttr}" title="打开行情区"><strong>${esc(symbol)}</strong></button>
<span class="pos-side-badge ${sideCls}">${sideCn}</span>
</div>
<div class="pos-head-actions">
@@ -807,8 +848,9 @@
.join("");
}
function renderPositionBlock(exchangeId, x) {
function renderPositionBlock(exchangeId, exchangeKey, x) {
const symAttr = esc(x.symbol || "").replace(/"/g, "&quot;");
const exKeyAttr = esc(exchangeKey || exchangeId || "").replace(/"/g, "&quot;");
const sideAttr = esc((x.side || "").toLowerCase()).replace(/"/g, "&quot;");
const contractsAttr = esc(String(x.contracts != null ? x.contracts : "")).replace(/"/g, "&quot;");
const cond = condOrdersFromPosition(x);
@@ -820,7 +862,7 @@
<div class="table-scroll">
<table class="data-table"><thead><tr><th>合约</th><th>方向</th><th>张数</th><th>浮盈</th><th>操作</th></tr></thead><tbody>
<tr>
<td>${esc(x.symbol)}</td>
<td><button type="button" class="btn-open-market sym-link" data-ex-id="${esc(exchangeId)}" data-ex-key="${exKeyAttr}" data-symbol="${symAttr}" title="打开行情区">${esc(x.symbol)}</button></td>
<td class="${sideDirCls(x.side)}">${renderDirectionHtml(x.side)}</td>
<td>${fmt(x.contracts, 4)}</td>
<td class="${pnlCls(x.unrealized_pnl)}">${fmt(x.unrealized_pnl, 2)}</td>
@@ -844,7 +886,7 @@
</div>`;
inner += `<div class="section-title">交易所持仓 · ${pos.length} 仓</div>`;
if (pos.length) {
inner += pos.map((p) => renderPositionBlock(row.id, p)).join("");
inner += pos.map((p) => renderPositionBlock(row.id, row.key || row.id, p)).join("");
} else {
inner += '<div class="empty-hint">无持仓</div>';
}
@@ -937,7 +979,7 @@
html += `<div class="hub-pos-list ${posListCls}" data-pos-count="${posCount}">`;
if (posCount) {
pos.forEach((p) => {
html += renderLivePositionCard(row.id, p, findMonitorOrder(orders, p.symbol, p.side));
html += renderLivePositionCard(row.id, row.key || row.id, p, findMonitorOrder(orders, p.symbol, p.side));
});
} else {
html += '<div class="pos-empty">暂无持仓</div>';
+15
View File
@@ -628,11 +628,26 @@
marketInited = true;
await loadMeta();
bind();
} else {
readQuery();
}
startAutoRefresh();
await loadChart(false);
startPriceTagTimer();
},
openWith: async function (exKey, sym, tf) {
if (!marketInited) {
await this.init();
}
if (elExchange && exKey) elExchange.value = exKey;
if (elSymbol && sym) elSymbol.value = String(sym).trim().toUpperCase();
if (tf && elTf) elTf.value = tf;
lastViewKey = "";
updateExchangeDisplay();
startAutoRefresh();
await loadChart(false);
startPriceTagTimer();
},
reload: function (force) {
loadChart(!!force);
},
+3 -3
View File
@@ -8,7 +8,7 @@
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&family=Orbitron:wght@500;600;700&display=swap" rel="stylesheet" media="print" onload="this.media='all'" />
<noscript><link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&family=Orbitron:wght@500;600;700&display=swap" rel="stylesheet" /></noscript>
<link rel="stylesheet" href="/assets/app.css?v=20260528-hub-market6" />
<link rel="stylesheet" href="/assets/app.css?v=20260528-hub-pos-market" />
</head>
<body>
<div class="app-bg" aria-hidden="true"></div>
@@ -193,7 +193,7 @@
<div id="toast"></div>
<script src="https://unpkg.com/lightweight-charts@4.2.0/dist/lightweight-charts.standalone.production.js"></script>
<script src="/assets/chart.js?v=20260528-hub-market13"></script>
<script src="/assets/app.js?v=20260528-hub-market13"></script>
<script src="/assets/chart.js?v=20260528-hub-pos-market"></script>
<script src="/assets/app.js?v=20260528-hub-pos-market"></script>
</body>
</html>