样式调整

src/assets/styles/mixin.less

@@ -1926,7 +1926,7 @@ input:-internal-autofill-selected {
                 font-size: 16px;
                 color: @m-grey1;
                 .position(absolute, auto, 16px, 0, auto);
-                line-height: 36px;
+                line-height: 28px;
                 z-index: 2;
             }
         }
@@ -2474,3 +2474,7 @@ input:-internal-autofill-selected {
 .ant-select-tree-dropdown .ant-select-tree li .ant-select-tree-node-content-wrapper.ant-select-tree-node-selected {
      background: transparent !important;
  }
+ // 数字最右侧上下箭头不显示
+.ant-input-number-handler-wrap {
+    display: none
+}

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

@@ -1,72 +1,69 @@
 <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="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 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="inlineBar">
+                    <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="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>
+                <div class="inlineBar">
+                    <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>
+            </div>
+            <BtnList :btnList="btnListData" :record="selectedRow" @click="openComponent" />
         </div>
-        <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" />
+        <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">
@@ -166,10 +163,17 @@ export default defineComponent({
     .flex;
     flex-direction: column;
     height: 32px;
+    .inlineBar {
+        display: inline-flex;
+    }
     .greenBar,
     .redBar {
         height: 16px;
         line-height: 16px;
     }
 }
+.buy-sell-market .buy-sell-market-title div {
+    align-self: flex-start;
+    align-items: flex-start;
+}
 </style>