Simplify option close depth display.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
dekun
2026-07-11 09:04:17 +08:00
parent e8a55a0f85
commit 1b31c61aac
3 changed files with 26 additions and 87 deletions
+4 -48
View File
@@ -3608,11 +3608,11 @@ html[data-theme="light"] .options-estimate-row {
}
.options-page-wrap .opt-bid-level {
display: inline-grid;
grid-template-columns: auto auto auto;
grid-template-columns: auto auto;
align-items: center;
gap: 4px;
gap: 5px;
min-height: 24px;
padding: 3px 7px;
padding: 3px 9px;
border: 1px solid rgba(82, 101, 143, 0.55);
border-radius: 999px;
background: rgba(18, 24, 37, 0.72);
@@ -3637,21 +3637,16 @@ html[data-theme="light"] .options-estimate-row {
color: #ffffff;
font-weight: 700;
}
.options-page-wrap .opt-bid-size {
color: #93a2bd;
font-size: 0.66rem;
}
.options-page-wrap .opt-close-preview {
display: flex;
flex-direction: column;
gap: 5px;
align-items: flex-start;
}
.options-page-wrap .opt-close-main {
display: inline-flex;
align-items: baseline;
gap: 4px;
color: #ff7b87;
color: #f2f6ff;
font-size: 0.9rem;
font-weight: 800;
font-variant-numeric: tabular-nums;
@@ -3662,45 +3657,6 @@ html[data-theme="light"] .options-estimate-row {
font-size: 0.62rem;
font-weight: 600;
}
.options-page-wrap .opt-close-sub {
display: flex;
flex-wrap: wrap;
gap: 4px;
align-items: center;
}
.options-page-wrap .opt-close-pill,
.options-page-wrap .opt-close-pnl {
display: inline-flex;
align-items: center;
min-height: 20px;
padding: 2px 6px;
border-radius: 999px;
font-size: 0.64rem;
font-weight: 650;
line-height: 1;
font-variant-numeric: tabular-nums;
}
.options-page-wrap .opt-close-pill--ok {
color: #9fe6c1;
background: rgba(40, 154, 104, 0.16);
border: 1px solid rgba(67, 190, 128, 0.35);
}
.options-page-wrap .opt-close-pill--warn {
color: #ffd0d5;
background: rgba(214, 80, 96, 0.16);
border: 1px solid rgba(233, 104, 118, 0.35);
}
.options-page-wrap .opt-close-pnl {
color: #9aa8c2;
background: rgba(82, 101, 143, 0.18);
border: 1px solid rgba(82, 101, 143, 0.34);
}
.options-page-wrap .opt-close-pnl.is-profit {
color: #8ce9bb;
}
.options-page-wrap .opt-close-pnl.is-loss {
color: #ff97a2;
}
.options-page-wrap .opt-close-rule {
margin-top: 8px;
padding: 0;
+9 -26
View File
@@ -185,16 +185,16 @@
return price + "/" + size;
}
function fmtBidDepth(levels) {
const bids = (levels || []).slice(0, 5);
if (!bids.length) return "—";
return '<div class="opt-bid-depth">' + bids.map(function (x, idx) {
function fmtCloseLevels(preview) {
const levels = ((preview && preview.levels) || []).slice(0, 5);
if (!levels.length) return "—";
return '<div class="opt-bid-depth">' + levels.map(function (x, idx) {
const levelNo = x.level != null ? x.level : idx + 1;
const levelCls = idx === 0 ? " opt-bid-level--best" : "";
return (
'<span class="opt-bid-level' + levelCls + '">' +
'<span class="opt-bid-rank">买' + (idx + 1) + "</span>" +
'<span class="opt-bid-rank">买' + levelNo + "</span>" +
'<span class="opt-bid-price">' + fmt(x.px, 4) + "</span>" +
'<span class="opt-bid-size">' + fmt(x.sz, 0) + "张</span>" +
"</span>"
);
}).join("") + "</div>";
@@ -202,18 +202,10 @@
function fmtClosePreview(preview) {
if (!preview || preview.total_received == null) return "—";
const missing = Number(preview.uncovered_sheets || 0);
const covered = Number(preview.covered_sheets || 0);
const pnl = preview.estimated_pnl;
const pnlCls = pnlClsName(pnl);
return (
'<div class="opt-close-preview">' +
'<div class="opt-close-main">' + fmt(preview.total_received, 4) + '<span>USDC</span></div>' +
'<div class="opt-close-sub">' +
'<span class="opt-close-pill opt-close-pill--ok">覆盖 ' + covered + "张</span>" +
(missing > 0 ? '<span class="opt-close-pill opt-close-pill--warn">缺 ' + missing + "张</span>" : "") +
(pnl != null ? '<span class="opt-close-pnl ' + pnlCls + '">' + (Number(pnl) > 0 ? "+" : "") + fmt(pnl, 4) + "</span>" : "") +
"</div></div>"
"</div>"
);
}
@@ -245,14 +237,6 @@
return "";
}
function pnlClsName(v) {
if (v === null || v === undefined || Number.isNaN(Number(v))) return "";
const n = Number(v);
if (n > 0) return "is-profit";
if (n < 0) return "is-loss";
return "";
}
function estimateExpiryProfit(optType, strike, targetIdx, entryPx, ethAmount) {
if (strike == null || targetIdx == null || entryPx == null || ethAmount == null) return null;
const amt = Number(ethAmount);
@@ -517,7 +501,6 @@
const expMs = p.exp_time_ms != null ? p.exp_time_ms : p.exp_time;
const expAttr = expMs != null && expMs !== "" ? String(expMs) : "";
const closePreview = p.close_preview || {};
const closePreviewCls = pnlCls(closePreview.estimated_pnl);
const closeSheets = p.avail_pos != null && Number(p.avail_pos) > 0 ? p.avail_pos : p.pos;
return (
'<div class="pos-card-head">' +
@@ -538,8 +521,8 @@
'<div class="pos-cell"><span class="pos-label">开仓均价</span><span class="pos-value">' + fmt(p.avg_px, 4) + "</span></div>" +
'<div class="pos-cell"><span class="pos-label">标记价</span><span class="pos-value">' + fmt(p.mark_px, 4) + "</span></div>" +
'<div class="pos-cell"><span class="pos-label">指数价</span><span class="pos-value">' + fmt(p.idx_px, 0) + "</span></div>" +
'<div class="pos-cell opt-pos-cell--depth"><span class="pos-label">买盘深度</span><span class="pos-value">' + fmtBidDepth(p.bid_depth) + "</span></div>" +
'<div class="pos-cell opt-pos-cell--close"><span class="pos-label">按买盘收回</span><span class="pos-value ' + closePreviewCls + '">' + fmtClosePreview(closePreview) + "</span></div>" +
'<div class="pos-cell opt-pos-cell--depth"><span class="pos-label">买盘深度</span><span class="pos-value">' + fmtCloseLevels(closePreview) + "</span></div>" +
'<div class="pos-cell opt-pos-cell--close"><span class="pos-label">按买盘收回</span><span class="pos-value">' + fmtClosePreview(closePreview) + "</span></div>" +
'<div class="pos-cell"><span class="pos-label">到期平衡</span><span class="pos-value">' + fmt(p.expiry_be_px, 0) + "</span></div>" +
'<div class="pos-cell"><span class="pos-label">平掉回本</span><span class="pos-value">' + fmt(p.close_be_px, 0) + "</span></div>" +
'<div class="pos-cell"><span class="pos-label">浮盈亏</span><span class="pos-value ' + uplCls + '">' + fmt(p.upl, 2) + "</span></div>" +
+13 -13
View File
@@ -90,19 +90,19 @@
<div id="opt-pos-live" class="panel-scroll pos-list options-pos-live-pane">
<div class="pos-empty" id="opt-pos-empty">暂无持仓</div>
<div id="opt-pos-cards"></div>
<details class="opt-close-rule">
<summary>多档平仓规则说明</summary>
<div class="opt-close-rule-body">
<p>系统平仓前会重新读取最新买盘,不使用页面缓存。</p>
<ul>
<li>买一数量足够覆盖持仓时,只按买一价提交一笔限价卖单。</li>
<li>买一不够时,先卖买一可覆盖数量;成交后刷新持仓和盘口,再继续用新的最优买盘拆分。</li>
<li>最多尝试 5 次,全程使用限价卖出,并带 <code>reduceOnly</code>,不会主动市价平仓。</li>
<li>盘口不足或订单未成交时会停止后续拆单,并提示剩余张数。</li>
</ul>
</div>
</details>
</div>
<details class="opt-close-rule">
<summary>多档平仓规则说明</summary>
<div class="opt-close-rule-body">
<p>系统平仓前会重新读取最新买盘,不使用页面缓存。</p>
<ul>
<li>买一数量足够覆盖持仓时,只按买一价提交一笔限价卖单。</li>
<li>买一不够时,先卖买一可覆盖数量;成交后刷新持仓和盘口,再继续用新的最优买盘拆分。</li>
<li>最多尝试 5 次,全程使用限价卖出,并带 <code>reduceOnly</code>,不会主动市价平仓。</li>
<li>盘口不足或订单未成交时会停止后续拆单,并提示剩余张数。</li>
</ul>
</div>
</details>
</div>
<div class="options-pos-pane" data-opt-pos-pane="stats" role="tabpanel" aria-labelledby="opt-pos-tab-stats" hidden>
<div class="options-stats-panel">
@@ -212,4 +212,4 @@
</div>
</div>
<script src="/static/options_expiry_countdown.js?v=1"></script>
<script src="/static/options_panel.js?v=22"></script>
<script src="/static/options_panel.js?v=23"></script>