Refresh env UI on trade-mode change; hide hedge review tabs in options mode.

Co-authored-by: Cursor <cursoragent@cursor.com>

lib/common/static/instance_settings_prefs.js

@@ -311,7 +311,9 @@
     const panelsWrap = document.createElement("div");
     panelsWrap.className = "env-config-panels";
     panelsWrap.id = "env-config-grid";
+    let modeSectionIdx = 0;
     groups.forEach((group, idx) => {
+      if ((group.title || "").indexOf("期权/对冲模式") >= 0) modeSectionIdx = idx;
       const label = document.createElement("label");
       label.className = "env-tab-btn";
       label.htmlFor = "env-sec-" + idx;
@@ -328,16 +330,47 @@
         panel.appendChild(hint);
       }
       const grid = document.createElement("div");
-      grid.className = "env-form-grid";
+      grid.className = "env-config-grid";
       (group.fields || []).forEach((field) => grid.appendChild(renderEnvFieldRow(field)));
       panel.appendChild(grid);
       panelsWrap.appendChild(panel);
     });
     body.appendChild(tabBar);
     body.appendChild(panelsWrap);
+    body.dataset.envModeSectionIdx = String(modeSectionIdx);
+    bindTradeModeAutoRefresh(body);
     return body;
   }
 
+  function bindTradeModeAutoRefresh(body) {
+    const modeSel = body.querySelector('.env-field-input[data-env-key="OKX_TRADE_MODE"]');
+    if (!modeSel || modeSel.dataset.modeRefreshBound === "1") return;
+    modeSel.dataset.modeRefreshBound = "1";
+    modeSel.addEventListener("change", async () => {
+      const status = document.getElementById("env-config-status");
+      const nextMode = modeSel.value;
+      setStatus(status, "切换交易模式并刷新配置…");
+      try {
+        await fetchJson("/api/settings/env", {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify({ values: { OKX_TRADE_MODE: nextMode } }),
+        });
+        await loadEnvConfig(true);
+        const page = envConfigRoot() || document.querySelector(".env-config-page");
+        const newBody = page && page.querySelector("#env-config-body");
+        const idx = newBody && newBody.dataset.envModeSectionIdx;
+        if (idx != null) {
+          const radio = document.getElementById("env-sec-" + idx);
+          if (radio) radio.checked = true;
+        }
+        setStatus(status, "交易模式已切换为当前选项,配置区已刷新");
+      } catch (e) {
+        setStatus(status, e.message || "切换失败", true);
+      }
+    });
+  }
+
   async function loadEnvConfig(force) {
     const root = envConfigRoot();
     const body = root && root.querySelector("#env-config-body");
@@ -395,10 +428,10 @@
         setStatus(status, "已保存,正在重启实例…");
         await restartInstance();
         setStatus(status, "保存并重启完成");
-        await loadEnvConfig();
+        await loadEnvConfig(true);
       } else {
         setStatus(status, "已保存(即时生效项已应用)");
-        await loadEnvConfig();
+        await loadEnvConfig(true);
       }
     } catch (e) {
       setStatus(status, e.message || "保存失败", true);
@@ -501,6 +534,9 @@
     bindEvents();
     loadDisplayPrefsForm(false);
     loadEnvConfig(false);
+    const root = envConfigRoot();
+    const body = root && root.querySelector("#env-config-body");
+    if (body) bindTradeModeAutoRefresh(body);
     if (global.__INSTANCE_DISPLAY__) applyDisplayToNav(global.__INSTANCE_DISPLAY__);
   }
 

lib/common/static/options_review.js

@@ -248,8 +248,22 @@
     return "持平";
   }
 
+  function tradeModeFromDom() {
+    var tabs = document.querySelector(".or-tabs");
+    return (tabs && tabs.getAttribute("data-okx-trade-mode")) || "options";
+  }
+
+  function defaultSourceForMode(mode) {
+    if (mode === "options_options") return "options_options";
+    if (mode === "perp_options") return "perp_options";
+    return "option_spot";
+  }
+
   function setActiveTab(source) {
-    activeSource = source || "option_spot";
+    var mode = tradeModeFromDom();
+    var allowed = defaultSourceForMode(mode);
+    activeSource = source || allowed;
+    if (activeSource !== allowed) activeSource = allowed;
     tradesPage = 0;
     reviewedPage = 0;
     document.querySelectorAll(".or-tab").forEach(function (btn) {
@@ -1312,7 +1326,7 @@
     hideJournalForm();
     hideDetail();
     hardenSearchAutofill();
-    setActiveTab("option_spot");
+    setActiveTab(defaultSourceForMode(tradeModeFromDom()));
   }
 
   function hardenSearchAutofill() {

lib/instance/templates/embed_shell.html

@@ -166,7 +166,7 @@ const ORDER_ENTRY_MODEL_CODE_TO_CATEGORY = {{ entry_model_code_to_category | toj
 <script>
 window.__INSTANCE_DISPLAY__ = {{ display | tojson }};
 </script>
-<script src="/static/instance_settings_prefs.js?v=16"></script>
+<script src="/static/instance_settings_prefs.js?v=17"></script>
 <script src="/static/instance_live.js?v=6"></script>
 <script src="/static/instance_embed.js?v=30"></script>
 <script src="/static/instance_mobile_nav.js?v=2"></script>

lib/instance/templates/env_config_panel.html

@@ -16,7 +16,11 @@
     </div>
 
     {% if env_config_groups %}
-    <div class="env-config-body card" data-env-ssr="1" id="env-config-body">
+    {% set ns = namespace(mode_idx=0) %}
+    {% for group in env_config_groups %}
+      {% if '期权/对冲模式' in (group.title or '') %}{% set ns.mode_idx = loop.index0 %}{% endif %}
+    {% endfor %}
+    <div class="env-config-body card" data-env-ssr="1" id="env-config-body" data-env-mode-section-idx="{{ ns.mode_idx }}">
         {% for group in env_config_groups %}
         <input type="radio" name="env-section" id="env-sec-{{ loop.index0 }}" class="env-tab-radio"{% if loop.first %} checked{% endif %}>
         {% endfor %}

lib/instance/templates/index.html

@@ -1983,6 +1983,6 @@ document.addEventListener("DOMContentLoaded", function () {
 });
 {% endif %}
 </script>
-<script src="/static/instance_settings_prefs.js?v=15"></script>
+<script src="/static/instance_settings_prefs.js?v=17"></script>
 </body>
 </html>

lib/options/templates/options_review_panel.html

@@ -185,10 +185,16 @@
 
     {# Tab + 筛选:放在各内容卡片上方,全局作用于下方列表/统计 #}
     <div class="or-toolbar">
-        <div class="or-tabs" role="tablist" aria-label="复盘分类">
+        <div class="or-tabs" role="tablist" aria-label="复盘分类" data-okx-trade-mode="{{ okx_trade_mode|default('options') }}">
+            {% if okx_trade_mode|default('options') == 'options' %}
             <button type="button" class="or-tab active" data-source="option_spot" role="tab">期权交易记录</button>
-            <button type="button" class="or-tab" data-source="options_options" role="tab">期期对冲记录</button>
+            {% elif okx_trade_mode == 'options_options' %}
-            <button type="button" class="or-tab" data-source="perp_options" role="tab">永期对冲记录</button>
+            <button type="button" class="or-tab active" data-source="options_options" role="tab">期期对冲记录</button>
+            {% elif okx_trade_mode == 'perp_options' %}
+            <button type="button" class="or-tab active" data-source="perp_options" role="tab">永期对冲记录</button>
+            {% else %}
+            <button type="button" class="or-tab active" data-source="option_spot" role="tab">期权交易记录</button>
+            {% endif %}
         </div>
         <div class="or-filters">
             <select id="or-filter-uly" autocomplete="off">
@@ -208,9 +214,11 @@
                    data-lpignore="true" data-1p-ignore="true" data-form-type="other" readonly>
             <input type="datetime-local" id="or-filter-from" title="平仓起" autocomplete="off">
             <input type="datetime-local" id="or-filter-to" title="平仓止" autocomplete="off">
+            {% if okx_trade_mode|default('options') == 'options' %}
             <label class="muted">
                 <input type="checkbox" id="or-include-hedge-legs"> 含已归属对冲的期权腿
             </label>
+            {% endif %}
         </div>
     </div>
 
@@ -408,4 +416,4 @@
     </section>
 </div>
 
-<script src="/static/options_review.js?v=22"></script>
+<script src="/static/options_review.js?v=23"></script>