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

Show selected state on OO money filters and recommend buttons.

Browse Source 
Muted idle chips, cyan checkmark when active so 平/虚 and 推荐跨式/双虚 are obvious after click.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
dekun
2026-08-06 09:17:07 +08:00
parent baf928d064
commit 2181c81aba
5 changed files with 67 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/common/static/hedge_plan.js
+24
View File
@@ -24,6 +24,7 @@
underlying: root.getAttribute("data-default-underly") || "ETH", underlying: root.getAttribute("data-default-underly") || "ETH",
moneyFilter: "itm", // 永期锁定:实值+平值 moneyFilter: "itm", // 永期锁定:实值+平值
ooMoneyFilter: "atm_otm", // 期期锁定:平值+虚值 ooMoneyFilter: "atm_otm", // 期期锁定:平值+虚值
ooRecommend: null, // atm_straddle | double_otm | null
chain: null, chain: null,
selected: null, selected: null,
legA: null, legA: null,
@@ -245,10 +246,24 @@
document.querySelectorAll(".hp-money-btn").forEach(function (b) { document.querySelectorAll(".hp-money-btn").forEach(function (b) {
const on = b.getAttribute("data-money") === state.moneyFilter; const on = b.getAttribute("data-money") === state.moneyFilter;
b.classList.toggle("active", on); b.classList.toggle("active", on);
b.classList.toggle("is-selected", on);
b.setAttribute("aria-pressed", on ? "true" : "false");
}); });
document.querySelectorAll(".hp-oo-money-btn").forEach(function (b) { document.querySelectorAll(".hp-oo-money-btn").forEach(function (b) {
const on = b.getAttribute("data-oo-money") === state.ooMoneyFilter; const on = b.getAttribute("data-oo-money") === state.ooMoneyFilter;
b.classList.toggle("active", on); b.classList.toggle("active", on);
b.classList.toggle("is-selected", on);
b.setAttribute("aria-pressed", on ? "true" : "false");
});
}
function syncOoRecommendUI() {
const cur = state.ooRecommend || "";
document.querySelectorAll(".hp-oo-recommend-btn").forEach(function (b) {
const on = (b.getAttribute("data-oo-rec") || "") === cur;
b.classList.toggle("active", on);
b.classList.toggle("is-selected", on);
b.setAttribute("aria-pressed", on ? "true" : "false");
}); });
} }
@@ -1003,6 +1018,8 @@
state.legA = c; state.legA = c;
state.legB = null; state.legB = null;
} }
state.ooRecommend = null;
syncOoRecommendUI();
renderOoLegs(); renderOoLegs();
}); });
}); });
@@ -1091,6 +1108,8 @@
state.selected = null; state.selected = null;
state.legA = null; state.legA = null;
state.legB = null; state.legB = null;
state.ooRecommend = null;
syncOoRecommendUI();
if ($("hp-entry")) $("hp-entry").value = ""; if ($("hp-entry")) $("hp-entry").value = "";
if ($("hp-contracts")) $("hp-contracts").value = ""; if ($("hp-contracts")) $("hp-contracts").value = "";
if ($("hp-tp")) $("hp-tp").value = ""; if ($("hp-tp")) $("hp-tp").value = "";
@@ -1348,6 +1367,8 @@
} }
state.legA = pair.call; state.legA = pair.call;
state.legB = pair.put; state.legB = pair.put;
state.ooRecommend = "atm_straddle";
syncOoRecommendUI();
renderOoLegs(); renderOoLegs();
autoFillOoSheets(); autoFillOoSheets();
updateOoPremiumLine(); updateOoPremiumLine();
@@ -1362,6 +1383,8 @@
} }
state.legA = pair.call; state.legA = pair.call;
state.legB = pair.put; state.legB = pair.put;
state.ooRecommend = "double_otm";
syncOoRecommendUI();
renderOoLegs(); renderOoLegs();
autoFillOoSheets(); autoFillOoSheets();
updateOoPremiumLine(); updateOoPremiumLine();
@@ -2052,6 +2075,7 @@
syncTabUI(); syncTabUI();
syncUnderlyingUI(); syncUnderlyingUI();
syncMoneyUI(); syncMoneyUI();
syncOoRecommendUI();
syncPoDirUI(); syncPoDirUI();
syncOoSizeModeUI(); syncOoSizeModeUI();
syncOoCloseModeUI(); syncOoCloseModeUI();
lib/common/static/instance_theme.css
+35 -8
View File
@@ -3643,7 +3643,9 @@ html[data-theme="light"] .opt-be-dist-down {
} }
.hedge-plan-page-wrap .hp-uly-btn, .hedge-plan-page-wrap .hp-uly-btn,
.hedge-plan-page-wrap .hp-uly-btn-oo, .hedge-plan-page-wrap .hp-uly-btn-oo,
.hedge-plan-page-wrap .hp-money-btn { .hedge-plan-page-wrap .hp-money-btn,
.hedge-plan-page-wrap .hp-oo-money-btn,
.hedge-plan-page-wrap .hp-oo-recommend-btn {
min-width: 52px; min-width: 52px;
font-weight: 600; font-weight: 600;
border: 1px solid rgba(255, 255, 255, 0.14); border: 1px solid rgba(255, 255, 255, 0.14);
@@ -3652,11 +3654,29 @@ html[data-theme="light"] .opt-be-dist-down {
} }
.hedge-plan-page-wrap .hp-uly-btn.active, .hedge-plan-page-wrap .hp-uly-btn.active,
.hedge-plan-page-wrap .hp-uly-btn-oo.active, .hedge-plan-page-wrap .hp-uly-btn-oo.active,
.hedge-plan-page-wrap .hp-money-btn.active { .hedge-plan-page-wrap .hp-money-btn.active,
color: #0b1220; .hedge-plan-page-wrap .hp-oo-money-btn.is-selected,
background: linear-gradient(180deg, #ffffff 0%, #9ec0ff 100%); .hedge-plan-page-wrap .hp-oo-money-btn.active,
border-color: #fff; .hedge-plan-page-wrap .hp-oo-recommend-btn.is-selected,
box-shadow: 0 0 0 2px rgba(100, 160, 255, 0.5); .hedge-plan-page-wrap .hp-oo-recommend-btn.active {
border-color: var(--accent, #00d4ff);
color: var(--text, #fff);
background: rgba(0, 212, 255, 0.16);
box-shadow: inset 0 0 0 1px rgba(0, 212, 255, 0.35);
font-weight: 700;
}
.hedge-plan-page-wrap .hp-oo-money-btn .hp-oo-check,
.hedge-plan-page-wrap .hp-oo-recommend-btn .hp-oo-check {
display: none;
margin-right: 4px;
font-weight: 700;
}
.hedge-plan-page-wrap .hp-oo-money-btn.is-selected .hp-oo-check,
.hedge-plan-page-wrap .hp-oo-money-btn.active .hp-oo-check,
.hedge-plan-page-wrap .hp-oo-recommend-btn.is-selected .hp-oo-check,
.hedge-plan-page-wrap .hp-oo-recommend-btn.active .hp-oo-check {
display: inline;
color: var(--accent, #00d4ff);
} }
.hedge-plan-page-wrap .hp-money-hint { .hedge-plan-page-wrap .hp-money-hint {
font-size: 0.68rem; font-size: 0.68rem;
@@ -3676,7 +3696,9 @@ html[data-theme="light"] .opt-be-dist-down {
min-height: 26px; min-height: 26px;
} }
.hedge-plan-page-wrap .hp-opt-toolbar .btn-secondary, .hedge-plan-page-wrap .hp-opt-toolbar .btn-secondary,
.hedge-plan-page-wrap .hp-opt-toolbar .hp-money-btn { .hedge-plan-page-wrap .hp-opt-toolbar .hp-money-btn,
.hedge-plan-page-wrap .hp-oo-money-btn,
.hedge-plan-page-wrap .hp-oo-recommend-btn {
padding: 3px 8px; padding: 3px 8px;
min-height: 26px; min-height: 26px;
font-size: 0.72rem; font-size: 0.72rem;
@@ -3907,10 +3929,15 @@ html[data-theme="light"] .hedge-plan-page-wrap .hp-tab.active {
} }
html[data-theme="light"] .hedge-plan-page-wrap .hp-uly-btn.active, html[data-theme="light"] .hedge-plan-page-wrap .hp-uly-btn.active,
html[data-theme="light"] .hedge-plan-page-wrap .hp-uly-btn-oo.active, html[data-theme="light"] .hedge-plan-page-wrap .hp-uly-btn-oo.active,
html[data-theme="light"] .hedge-plan-page-wrap .hp-money-btn.active { html[data-theme="light"] .hedge-plan-page-wrap .hp-money-btn.active,
html[data-theme="light"] .hedge-plan-page-wrap .hp-oo-money-btn.is-selected,
html[data-theme="light"] .hedge-plan-page-wrap .hp-oo-money-btn.active,
html[data-theme="light"] .hedge-plan-page-wrap .hp-oo-recommend-btn.is-selected,
html[data-theme="light"] .hedge-plan-page-wrap .hp-oo-recommend-btn.active {
color: #0b1220; color: #0b1220;
background: linear-gradient(180deg, #ffffff 0%, #b9d2ff 100%); background: linear-gradient(180deg, #ffffff 0%, #b9d2ff 100%);
border-color: #2f6fed; border-color: #2f6fed;
box-shadow: 0 0 0 2px rgba(47, 111, 237, 0.25);
} }
html[data-theme="light"] .hedge-plan-page-wrap .hp-placeholder { html[data-theme="light"] .hedge-plan-page-wrap .hp-placeholder {
border-color: rgba(15, 23, 42, 0.18); border-color: rgba(15, 23, 42, 0.18);
lib/hedge_plan/templates/hedge_plan_panel.html
+6 -6
View File
@@ -185,11 +185,11 @@
<h2>期权 T 型报价</h2> <h2>期权 T 型报价</h2>
<div class="form-row"> <div class="form-row">
<select id="hp-oo-exp-select"><option value="">选择到期日</option></select> <select id="hp-oo-exp-select"><option value="">选择到期日</option></select>
<button type="button" class="btn-secondary hp-oo-money-btn active" data-oo-money="atm_otm" title="平值+虚值">平/虚</button> <button type="button" class="btn-secondary hp-oo-money-btn is-selected active" data-oo-money="atm_otm" title="平值+虚值" aria-pressed="true"><span class="hp-oo-check" aria-hidden="true">✓</span>平/虚</button>
<button type="button" class="btn-secondary hp-oo-money-btn" data-oo-money="atm" title="仅平值">仅平值</button> <button type="button" class="btn-secondary hp-oo-money-btn" data-oo-money="atm" title="仅平值" aria-pressed="false"><span class="hp-oo-check" aria-hidden="true">✓</span>仅平值</button>
<button type="button" class="btn-secondary hp-oo-money-btn" data-oo-money="otm" title="仅虚值">仅虚值</button> <button type="button" class="btn-secondary hp-oo-money-btn" data-oo-money="otm" title="仅虚值" aria-pressed="false"><span class="hp-oo-check" aria-hidden="true">✓</span>仅虚值</button>
<button type="button" class="btn-secondary" id="hp-oo-recommend-atm" title="最近平值 Call+Put">推荐跨式</button> <button type="button" class="btn-secondary hp-oo-recommend-btn" id="hp-oo-recommend-atm" data-oo-rec="atm_straddle" title="最近平值 Call+Put" aria-pressed="false"><span class="hp-oo-check" aria-hidden="true">✓</span>推荐跨式</button>
<button type="button" class="btn-secondary" id="hp-oo-recommend-otm" title="最近虚值 Call+Put">推荐双虚</button> <button type="button" class="btn-secondary hp-oo-recommend-btn" id="hp-oo-recommend-otm" data-oo-rec="double_otm" title="最近虚值 Call+Put" aria-pressed="false"><span class="hp-oo-check" aria-hidden="true">✓</span>推荐双虚</button>
<button type="button" class="btn-secondary" id="hp-oo-load-chain">刷新链</button> <button type="button" class="btn-secondary" id="hp-oo-load-chain">刷新链</button>
</div> </div>
<div class="options-strike-table-wrap options-strike-table-wrap--t"> <div class="options-strike-table-wrap options-strike-table-wrap--t">
@@ -327,4 +327,4 @@
</div> </div>
</div> </div>
</div> </div>
<script src="/static/hedge_plan.js?v=34"></script> <script src="/static/hedge_plan.js?v=35"></script>
lib/instance/templates/embed_shell.html
+1 -1
View File
@@ -8,7 +8,7 @@
<link rel="stylesheet" href="/static/instance_theme_early.css?v=4"> <link rel="stylesheet" href="/static/instance_theme_early.css?v=4">
<link rel="stylesheet" href="/static/account_risk_badge.css?v=4"> <link rel="stylesheet" href="/static/account_risk_badge.css?v=4">
<link rel="stylesheet" href="/static/instance_page.css?v=13"> <link rel="stylesheet" href="/static/instance_page.css?v=13">
<link rel="stylesheet" href="/static/instance_theme.css?v=112"> <link rel="stylesheet" href="/static/instance_theme.css?v=113">
<script src="/static/account_risk_badge.js?v=4"></script> <script src="/static/account_risk_badge.js?v=4"></script>
<script src="/static/open_submit_gate.js?v=1"></script> <script src="/static/open_submit_gate.js?v=1"></script>
<meta name="theme-color" content="#0b0d14"> <meta name="theme-color" content="#0b0d14">
lib/instance/templates/index.html
+1 -1
View File
@@ -19,7 +19,7 @@
<link rel="manifest" href="/static/icons/manifest.webmanifest"> <link rel="manifest" href="/static/icons/manifest.webmanifest">
<title>{{ pwa_app_name }}</title> <title>{{ pwa_app_name }}</title>
<link rel="stylesheet" href="/static/instance_page.css?v=13"> <link rel="stylesheet" href="/static/instance_page.css?v=13">
<link rel="stylesheet" href="/static/instance_theme.css?v=112"> <link rel="stylesheet" href="/static/instance_theme.css?v=113">
</head> </head>
<body <body