修改合约的实时成交的数据太多

src/views/contract/handicap.vue

@@ -63,12 +63,10 @@
             </div>
           </template>
         </div>
-        <div
-          class="current-nav d-flex align-items-center my-2 py-2" style="background-color: #2e2e2e;"
-        >
-          <div class="w-10/24 d-flex align-items-center">
-            <div class="name fn-12 px-3">{{ $t("contract.g3") }}</div>
-            <div class="num fn-20 increace">
+        <div class="current-nav my-2 py-2" style="background-color: #2e2e2e;">
+          <div style="width: 200px;">
+            <div class="name fn-14 px-3" style="display: inline-block;">{{ $t("contract.g3") }}</div>
+            <div class="num fn-20 increace" style="display: inline-block;">
               {{ newPriceObj.price }}
             </div>
           </div>
@@ -107,7 +105,7 @@
             {{ $t("contract.e1") }}({{ $t("contract.e2") }})
           </div>
         </div>
-        <div class="d-flex fn-14" v-for="(item, idx) in tradeList" :key="idx">
+        <div class="d-flex fn-14" v-for="(item, idx) in tradeList.slice(0,30)" :key="idx">
           <div class="w-10/24">
             {{ parseTime(item.ts, false, "{h}:{i}:{s}") }}
           </div>