From 5393aa60bec047ca8f508e5748a1c4861d9ad286 Mon Sep 17 00:00:00 2001
From: dongzp <975303544@qq.com>
Date: Tue, 21 Jul 2026 15:16:24 +0800
Subject: [PATCH] =?UTF-8?q?=E5=88=86=E6=97=B6=E5=9B=BE=E6=98=BE=E7=A4=BA?=
 =?UTF-8?q?=E6=9C=80=E6=96=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/baidu/mapQuote.ts          |  3 ++-
 src/components/quote/TradeTape.vue | 34 +++++++++++++++++++++++++++---
 2 files changed, 33 insertions(+), 4 deletions(-)

diff --git a/src/api/baidu/mapQuote.ts b/src/api/baidu/mapQuote.ts
index 608d16f..0c76384 100644
--- a/src/api/baidu/mapQuote.ts
+++ b/src/api/baidu/mapQuote.ts
@@ -50,7 +50,8 @@ function parseIntraday(result: BaiduQuotationResult): IntradayPoint[] {
 }
 
 function parseTrades(result: BaiduQuotationResult): TradeTick[] {
-  return (result.detailinfos ?? []).map((t) => ({
+  // 接口 detailinfos 为旧→新（最新在末尾）；翻转后最新在前，列表顶部展示
+  return [...(result.detailinfos ?? [])].reverse().map((t) => ({
     time: t.formatTime,
     price: toNum(t.price),
     volume: toNum(t.volume),
diff --git a/src/components/quote/TradeTape.vue b/src/components/quote/TradeTape.vue
index 0956173..4931399 100644
--- a/src/components/quote/TradeTape.vue
+++ b/src/components/quote/TradeTape.vue
@@ -7,10 +7,20 @@
       <span>现手</span>
     </div>
     <div class="list">
-      <div v-for="(t, i) in quote.trades" :key="i" class="row">
+      <div v-for="(t, i) in quote.trades" :key="`${t.time}-${t.price}-${t.volume}-${i}`" class="row">
         <span>{{ t.time }}</span>
         <span :class="t.side === 'B' ? 'price-up' : 'price-down'">{{ t.price.toFixed(2) }}</span>
-        <span :class="t.side === 'B' ? 'price-up' : 'price-down'">{{ t.volume }}{{ t.side }}</span>
+        <span class="vol-cell">
+          <span class="vol">{{ t.volume }}</span>
+          <el-tag
+            size="small"
+            effect="light"
+            :type="t.side === 'B' ? 'danger' : 'success'"
+            class="side-tag"
+          >
+            {{ t.side === 'B' ? '买' : '卖' }}
+          </el-tag>
+        </span>
       </div>
     </div>
   </div>
@@ -42,9 +52,10 @@ defineProps<{
 .head,
 .row {
   display: grid;
-  grid-template-columns: 1fr 1fr 1fr;
+  grid-template-columns: 1fr 1fr 1.2fr;
   font-size: 12px;
   line-height: 1.8;
+  align-items: center;
 }
 
 .head {
@@ -61,4 +72,21 @@ defineProps<{
 .row span {
   font-variant-numeric: tabular-nums;
 }
+
+.vol-cell {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+}
+
+.vol {
+  min-width: 2em;
+}
+
+.side-tag {
+  --el-tag-border-radius: 4px;
+  height: 18px;
+  padding: 0 5px;
+  line-height: 16px;
+}
 </style>