theme color update

src/views/market/spot_trade/spot_trade_order_transaction/components/buy-sell-market/index.vue

@@ -1,59 +1,55 @@
 <template>
-  <!-- 买卖大厅 -->
-  <div class="buy-sell-market">
-    <div class="buy-sell-market-title">
-      <a class="backIcon"
-         @click="cancel">
-        <LeftOutlined />
-      </a>
-      <div class="titleBtn">
-        <div class="name">{{selectedRow.goodscode}} {{selectedRow.goodsname}}</div>
-        <div class="arrowRightIcon"></div>
-      </div>
-      <div class="green bdf1 ml20"
-           @click="changeMarketOrDetail">
-        <div class="numBlock ml15">
-          <div class="first">卖价</div>
-          <div class="last">{{selectedRow.sellprice}}</div>
+    <!-- 买卖大厅 -->
+    <div class="buy-sell-market">
+        <div class="buy-sell-market-title">
+            <a class="backIcon" @click="cancel">
+                <LeftOutlined />
+            </a>
+            <div class="titleBtn">
+                <div class="name">{{selectedRow.goodscode}} {{selectedRow.goodsname}}</div>
+                <div class="arrowRightIcon"></div>
+            </div>
+            <div class="priceBar bdf1 ml20">
+                <div class="greenBar green" @click="changeMarketOrDetail">
+                    <div class="numBlock ml15">
+                        <div class="first">卖价</div>
+                        <div class="last">{{selectedRow.sellprice}}</div>
+                    </div>
+                    <div class="numBlock">
+                        <div class="first">卖量</div>
+                        <div class="last">{{selectedRow.sellqty}}</div>
+                    </div>
+                </div>
+                <div class="redBar red">
+                    <div class="numBlock">
+                        <div class="first">买价</div>
+                        <div class="last">{{selectedRow.buyprice}}</div>
+                    </div>
+                    <div class="numBlock">
+                        <div class="first">买量</div>
+                        <div class="last">{{selectedRow.buyqty}}</div>
+                    </div>
+                </div>
+            </div>
+            <BtnList :btnList="btnListData" :record="selectedRow" @click="openComponent" />
         </div>
-        <div class="numBlock">
-          <div class="first">卖量</div>
-          <div class="last">{{selectedRow.sellqty}}</div>
-        </div>
-      </div>
-      <div class="red ml35">
-        <div class="numBlock">
-          <div class="first">买价</div>
-          <div class="last">{{selectedRow.buyprice}}</div>
-        </div>
-        <div class="numBlock">
-          <div class="first">买量</div>
-          <div class="last">{{selectedRow.buyqty}}</div>
-        </div>
-      </div>
-      <BtnList :btnList="btnListData"
-               :record="selectedRow"
-               @click="openComponent" />
+        <a-row class="buySellHall" v-if="showMarketOrDetail">
+            <a-col :span="12">
+                <Sell ref="sellRef" :parantSelectedRow="deliverGoods" />
+            </a-col>
+            <a-col :span="12">
+                <Buy ref="buyRef" :parantSelectedRow="deliverGoods" />
+            </a-col>
+        </a-row>
+        <StockExchange :deliverGoods="deliverGoods" v-else />
+        <component
+            :is="componentId"
+            v-if="componentId"
+            :selectedRow="deliverGoods"
+            :parantSelectedRow="deliverGoods"
+            @cancel="closeComponent"
+        ></component>
     </div>
-    <a-row class="buySellHall"
-           v-if="showMarketOrDetail">
-      <a-col :span="12">
-        <Sell ref="sellRef"
-              :parantSelectedRow="deliverGoods" />
-      </a-col>
-      <a-col :span="12">
-        <Buy ref="buyRef"
-             :parantSelectedRow="deliverGoods" />
-      </a-col>
-    </a-row>
-    <StockExchange :deliverGoods="deliverGoods"
-                   v-else />
-    <component :is="componentId"
-               v-if="componentId"
-               :selectedRow="deliverGoods"
-               :parantSelectedRow="deliverGoods"
-               @cancel="closeComponent"></component>
-  </div>
 </template>
 
 <script lang="ts">
@@ -149,4 +145,14 @@ export default defineComponent({
 });
 </script>
 <style lang="less">
+.priceBar {
+    .flex;
+    flex-direction: column;
+    height: 32px;
+    .greenBar,
+    .redBar {
+        height: 16px;
+        line-height: 16px;
+    }
+}
 </style>