行情区：现价标签移入右侧10根留白区，倒计时在现价下方

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

manual_trading_hub/static/app.css

@@ -1996,13 +1996,7 @@ body.login-page {
   flex: 1;
   min-width: 0;
   height: 100%;
-}
-
-.market-price-gutter {
-  flex: 0 0 72px;
   position: relative;
-  border-left: 1px solid var(--border-soft);
-  background: #0a1018;
 }
 
 .market-exchange-badge {
@@ -2068,18 +2062,17 @@ body.login-page {
 
 .market-price-tag {
   position: absolute;
-  left: 4px;
+  z-index: 5;
-  right: 4px;
-  z-index: 2;
   pointer-events: none;
-  padding: 4px 6px;
+  padding: 4px 8px;
   border-radius: 4px;
   font-family: var(--font);
   font-size: 0.72rem;
   font-weight: 600;
-  line-height: 1.2;
+  line-height: 1.25;
   text-align: center;
-  transform: translateY(-50%);
+  transform: translate(-50%, -50%);
+  min-width: 68px;
   box-shadow: 0 1px 6px rgba(0, 0, 0, 0.35);
 }
 
@@ -2102,19 +2095,20 @@ body.login-page {
 }
 
 .market-price-tag-time {
-  margin-top: 2px;
+  margin-top: 3px;
   font-size: 0.68rem;
   font-weight: 500;
   font-variant-numeric: tabular-nums;
+  line-height: 1;
   opacity: 0.95;
 }
 
 .market-price-auto {
   position: absolute;
-  left: 6px;
+  right: 8px;
-  right: 6px;
   bottom: 10px;
-  z-index: 2;
+  z-index: 5;
+  width: auto;
   padding: 4px 8px;
   font-size: 0.68rem;
   font-family: var(--font);

manual_trading_hub/static/chart.js

@@ -4,7 +4,7 @@
 (function () {
   const AUTO_REFRESH_MS = 5000;
   const DEFAULT_VISIBLE_BARS = 200;
-  const RIGHT_OFFSET_BARS = 12;
+  const RIGHT_OFFSET_BARS = 10;
   const TF_MS = {
     "1m": 60_000,
     "5m": 5 * 60_000,
@@ -24,7 +24,6 @@
   const elStatus = document.getElementById("market-status");
   const elUpdated = document.getElementById("market-updated");
   const elBarCountdown = document.getElementById("market-bar-countdown");
-  const elPriceGutter = document.querySelector(".market-price-gutter");
   const elO = document.getElementById("mkt-o");
   const elH = document.getElementById("mkt-h");
   const elL = document.getElementById("mkt-l");
@@ -197,6 +196,35 @@
     if (elBarCountdown) elBarCountdown.textContent = "距收盘 " + cd;
   }
 
+  function priceTagX() {
+    if (!chart || !lastCandles.length) return null;
+    const bar = latestCandle();
+    if (!bar) return null;
+    const ts = chart.timeScale();
+    const spacing = ts.barSpacing();
+    const hostW = chartHost.clientWidth || 0;
+    let x = null;
+    try {
+      const lastIdx = lastCandles.length - 1;
+      const lastX = ts.logicalToCoordinate(lastIdx);
+      if (lastX != null && Number.isFinite(lastX)) {
+        x = lastX + (RIGHT_OFFSET_BARS * spacing) / 2;
+      }
+    } catch (e) {}
+    if (x == null) {
+      try {
+        const tx = ts.timeToCoordinate(bar.time);
+        if (tx != null && Number.isFinite(tx)) {
+          x = tx + (RIGHT_OFFSET_BARS * spacing) / 2;
+        }
+      } catch (e2) {}
+    }
+    if (x == null && hostW > 0 && spacing > 0) {
+      x = hostW - (RIGHT_OFFSET_BARS * spacing) / 2;
+    }
+    return x;
+  }
+
   function updatePriceTag() {
     if (!elPriceTag || !candleSeries || !chart) return;
     tickLiveClock();
@@ -212,8 +240,10 @@
     } catch (e) {
       y = null;
     }
-    const hostH = (elPriceGutter && elPriceGutter.clientHeight) || chartHost.clientHeight || 0;
+    const x = priceTagX();
-    if (y == null || y < 8 || y > hostH - 8) {
+    const hostH = chartHost.clientHeight || 0;
+    const hostW = chartHost.clientWidth || 0;
+    if (y == null || x == null || y < 8 || y > hostH - 8 || x < 8 || x > hostW - 8) {
       elPriceTag.classList.add("hidden");
       elPriceTag.setAttribute("aria-hidden", "true");
       return;
@@ -222,6 +252,7 @@
     elPriceTag.classList.remove("hidden", "is-up", "is-down");
     elPriceTag.classList.add(up ? "is-up" : "is-down");
     elPriceTag.setAttribute("aria-hidden", "false");
+    elPriceTag.style.left = x + "px";
     elPriceTag.style.top = y + "px";
     if (elPriceTagValue) elPriceTagValue.textContent = fmtPrice(bar.close);
   }

manual_trading_hub/static/index.html

@@ -116,7 +116,6 @@
         <div class="market-chart-body">
           <div id="market-exchange-badge" class="market-exchange-badge" aria-hidden="true"></div>
           <div id="market-chart" class="market-chart-host"></div>
-          <div class="market-price-gutter">
           <div id="market-price-tag" class="market-price-tag hidden" aria-hidden="true">
             <div id="market-price-tag-value" class="market-price-tag-value"></div>
             <div id="market-price-tag-time" class="market-price-tag-time"></div>
@@ -125,7 +124,6 @@
         </div>
       </div>
     </div>
-    </div>
 
     <div id="instance-frame-shell" class="instance-frame-shell hidden" aria-hidden="true">
       <div class="instance-frame-toolbar">
@@ -192,7 +190,7 @@
 
   <div id="toast"></div>
   <script src="https://unpkg.com/lightweight-charts@4.2.0/dist/lightweight-charts.standalone.production.js"></script>
-  <script src="/assets/chart.js?v=20260528-hub-market8"></script>
+  <script src="/assets/chart.js?v=20260528-hub-market9"></script>
-  <script src="/assets/app.js?v=20260528-hub-market8"></script>
+  <script src="/assets/app.js?v=20260528-hub-market9"></script>
 </body>
 </html>