增加导航栏

onchain_scout_gate/static/app.js

@@ -737,13 +737,17 @@ function wireKeyMonitorSegGroup(groupId, hiddenInputId, onChange) {
 
 function initKeyMonitorSegGroups() {
   wireKeyMonitorSegGroup("keyMonitorTypeSeg", "keyMonitorTypeInput");
-  wireKeyMonitorSegGroup("keyDirectionSeg", "keyDirectionInput");
-  wireKeyMonitorSegGroup("keySlTpModeSeg", "keySlTpModeInput", syncKeySlTpFields);
+}
+
+function setKeyMonitorActiveCount(n) {
+  const el = document.getElementById("keyMonitorActiveCount");
+  if (el) el.textContent = String(n);
 }
 
 function renderKeyMonitorActiveList(rows) {
   const target = document.getElementById("keyMonitorActive");
   if (!target) return;
+  setKeyMonitorActiveCount(rows.length);
   target.innerHTML = "";
   if (!rows.length) {
     target.innerHTML = '<div class="matrix-dim">暂无监控中的关键位</div>';
@@ -836,6 +840,8 @@ async function addKeyMonitor() {
 
 function wireKeyMonitorPanel() {
   initKeyMonitorSegGroups();
+  const modeSel = document.getElementById("keySlTpModeInput");
+  if (modeSel) modeSel.addEventListener("change", syncKeySlTpFields);
   syncKeySlTpFields();
   const addBtn = document.getElementById("keyAddBtn");
   if (addBtn) addBtn.addEventListener("click", addKeyMonitor);

onchain_scout_gate/static/style.css

@@ -1298,6 +1298,26 @@ pre {
     flex-shrink: 0;
 }
 
+.key-monitor-active-head {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    margin-bottom: 8px;
+}
+
+.key-monitor-count {
+    font-size: 10px;
+    padding: 2px 8px;
+    min-width: 1.5rem;
+    text-align: center;
+}
+
+.key-monitor-active-list {
+    max-height: calc(8 * 52px + 7 * 8px);
+    overflow-y: auto;
+    -webkit-overflow-scrolling: touch;
+}
+
 .key-monitor-row {
     display: flex;
     align-items: center;
@@ -1781,6 +1801,10 @@ body.matrix-theme {
         font-size: 8px;
     }
 
+    .key-monitor-active-list {
+        max-height: calc(8 * 48px + 7 * 8px);
+    }
+
     .matrix-grid {
         grid-template-columns: 1fr;
     }

onchain_scout_gate/templates/dashboard.html

@@ -141,18 +141,17 @@
                         <button type="button" class="matrix-seg-btn" data-value="收敛突破">收敛</button>
                     </div>
                     <input type="hidden" id="keyMonitorTypeInput" value="箱体突破" />
-                    <div class="matrix-seg-group" id="keyDirectionSeg" aria-label="方向">
-                        <button type="button" class="matrix-seg-btn" data-value="long">做多</button>
-                        <button type="button" class="matrix-seg-btn" data-value="short">做空</button>
-                    </div>
-                    <input type="hidden" id="keyDirectionInput" value="" />
+                    <select id="keyDirectionInput" class="matrix-input key-monitor-field">
+                        <option value="">方向</option>
+                        <option value="long">做多</option>
+                        <option value="short">做空</option>
+                    </select>
                     <input id="keyUpperInput" class="matrix-input key-monitor-field" type="number" step="any" placeholder="上沿/阻力" />
                     <input id="keyLowerInput" class="matrix-input key-monitor-field" type="number" step="any" placeholder="下沿/支撑" />
-                    <div class="matrix-seg-group" id="keySlTpModeSeg" aria-label="突破方案">
-                        <button type="button" class="matrix-seg-btn is-active" data-value="standard">标准</button>
-                        <button type="button" class="matrix-seg-btn" data-value="trend_manual">趋势</button>
-                    </div>
-                    <input type="hidden" id="keySlTpModeInput" value="standard" />
+                    <select id="keySlTpModeInput" class="matrix-input key-monitor-field" title="止盈止损方案">
+                        <option value="standard">标准突破</option>
+                        <option value="trend_manual">趋势突破</option>
+                    </select>
                     <input id="keyManualTpInput" class="matrix-input key-monitor-field key-monitor-tp" type="number" step="any" placeholder="趋势止盈价" style="display:none" />
                     <label class="matrix-hint key-monitor-check" style="display:inline-flex;align-items:center;gap:4px">
                         <input id="keyBreakevenInput" type="checkbox" /> 移动保本
@@ -162,8 +161,11 @@
                 <p id="keyMonitorSaveMsg" class="matrix-msg"></p>
                 <div class="matrix-two-col" style="margin-top:12px">
                     <div>
-                        <h3 class="matrix-hint" style="margin-bottom:8px">监控中</h3>
-                        <div id="keyMonitorActive" class="matrix-list"></div>
+                        <div class="key-monitor-active-head">
+                            <h3 class="matrix-hint" style="margin:0">监控中</h3>
+                            <span id="keyMonitorActiveCount" class="matrix-chip key-monitor-count">0</span>
+                        </div>
+                        <div id="keyMonitorActive" class="matrix-list key-monitor-active-list"></div>
                     </div>
                     <div>
                         <div style="display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px">