增加导航栏

onchain_scout_gate/static/app.js

@@ -721,24 +721,6 @@ function syncKeySlTpFields() {
   if (tpEl) tpEl.style.display = mode === "trend_manual" ? "" : "none";
 }
 
-function wireKeyMonitorSegGroup(groupId, hiddenInputId, onChange) {
-  const group = document.getElementById(groupId);
-  const hidden = document.getElementById(hiddenInputId);
-  if (!group || !hidden) return;
-  group.addEventListener("click", (ev) => {
-    const btn = ev.target.closest && ev.target.closest(".matrix-seg-btn");
-    if (!btn) return;
-    group.querySelectorAll(".matrix-seg-btn").forEach((b) => b.classList.remove("is-active"));
-    btn.classList.add("is-active");
-    hidden.value = btn.getAttribute("data-value") || "";
-    if (onChange) onChange();
-  });
-}
-
-function initKeyMonitorSegGroups() {
-  wireKeyMonitorSegGroup("keyMonitorTypeSeg", "keyMonitorTypeInput");
-}
-
 function setKeyMonitorActiveCount(n) {
   const el = document.getElementById("keyMonitorActiveCount");
   if (el) el.textContent = String(n);
@@ -839,7 +821,6 @@ async function addKeyMonitor() {
 }
 
 function wireKeyMonitorPanel() {
-  initKeyMonitorSegGroups();
   const modeSel = document.getElementById("keySlTpModeInput");
   if (modeSel) modeSel.addEventListener("change", syncKeySlTpFields);
   syncKeySlTpFields();

onchain_scout_gate/static/style.css

@@ -1298,11 +1298,31 @@ pre {
     flex-shrink: 0;
 }
 
-.key-monitor-active-head {
+.key-monitor-cols {
+    align-items: start;
+}
+
+.key-monitor-col-head {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 8px;
+    margin-bottom: 8px;
+    min-height: 28px;
+}
+
+.key-monitor-col-head-main {
     display: flex;
     align-items: center;
     gap: 8px;
-    margin-bottom: 8px;
+}
+
+.key-monitor-export {
+    flex-shrink: 0;
+    text-decoration: none;
+    font-size: 0.75rem;
+    padding: 4px 8px;
+    min-height: auto;
 }
 
 .key-monitor-count {
@@ -1312,12 +1332,17 @@ pre {
     text-align: center;
 }
 
-.key-monitor-active-list {
+.key-monitor-scroll-list {
     max-height: calc(8 * 52px + 7 * 8px);
     overflow-y: auto;
     -webkit-overflow-scrolling: touch;
 }
 
+.key-monitor-scroll-list > .item {
+    min-height: 52px;
+    box-sizing: border-box;
+}
+
 .key-monitor-row {
     display: flex;
     align-items: center;
@@ -1801,10 +1826,14 @@ body.matrix-theme {
         font-size: 8px;
     }
 
-    .key-monitor-active-list {
+    .key-monitor-scroll-list {
         max-height: calc(8 * 48px + 7 * 8px);
     }
 
+    .key-monitor-scroll-list > .item {
+        min-height: 48px;
+    }
+
     .matrix-grid {
         grid-template-columns: 1fr;
     }