huangbin hace 4 años
padre
commit
61b3e6cdea

+ 63 - 60
src/views/market/spot_trade/spot_trade_reference_market/components/container/index.vue

@@ -1,68 +1,71 @@
 <template>
-    <!-- 买卖大厅 -->
-    <div class="buy-sell-market">
-        <div class="buy-sell-market-title">
-            <a class="backIcon" @click="cancelAction">
-                <LeftOutlined />
-            </a>
-            <div class="titleBtn">
-                <div class="name">{{ selectedRow.goodscode }} {{ selectedRow.goodsname }}</div>
-                <div class="arrowRightIcon"></div>
+  <!-- 买卖大厅 -->
+  <div class="buy-sell-market">
+    <div class="buy-sell-market-title">
+      <a class="backIcon"
+         @click="cancelAction">
+        <LeftOutlined />
+      </a>
+      <div class="titleBtn">
+        <div class="name">{{ selectedRow.goodscode }} {{ selectedRow.goodsname }}</div>
+        <div class="arrowRightIcon"></div>
+      </div>
+      <div class="inlineBar">
+        <div class="valNums bdf1 ml10">
+          <!-- 最新价 -->
+          <div class="firstNum start"
+               :class="handleQuotePriceColor(selectedRow.last, selectedRow.presettle)">
+            {{ selectedRow.last }}</div>
+          <div class="lastNum start">
+            <!-- 涨跌值 -->
+            <div :class="handleQuotePriceColor(selectedRow.last, selectedRow.presettle)">
+              {{ quoteChange(selectedRow, selectedRow.decimalplace) }}</div>
+            <!-- 涨跌幅 -->
+            <div class="ml20"
+                 :class="handleQuotePriceColor(selectedRow.last, selectedRow.presettle)">
+              {{ quoteAmplituOfVibration(selectedRow, selectedRow.decimalplace) }}</div>
+          </div>
+        </div>
+        <div class="priceBar ml20">
+          <div class="inlineBar start">
+            <div class="greenBar green">
+              <div class="numBlock ml15">
+                <div class="first">卖价</div>
+                <div class="last"
+                     :class="handleQuotePriceColor(selectedRow.ask, selectedRow.presettle)">
+                  {{ selectedRow.ask }}</div>
+              </div>
+              <div class="numBlock">
+                <div class="first">卖量</div>
+                <div class="last">{{ selectedRow.askvolume }}</div>
+              </div>
             </div>
-            <div class="inlineBar">
-                <div class="valNums bdf1 ml10">
-                    <!-- 最新价 -->
-                    <div class="firstNum start" :class="handleQuotePriceColor(selectedRow.last, selectedRow.presettle)"> {{ selectedRow.last }}</div>
-                    <div class="lastNum start">
-                        <!-- 涨跌值 -->
-                        <div :class="handleQuotePriceColor(selectedRow.last, selectedRow.presettle)"> {{ quoteChange(selectedRow, selectedRow.decimalplace) }}</div>
-                        <!-- 涨跌幅 -->
-                        <div class="ml20" :class="handleQuotePriceColor(selectedRow.last, selectedRow.presettle)"> {{ quoteAmplituOfVibration(selectedRow, selectedRow.decimalplace) }}</div>
-                    </div>
-                </div>
-                <div class="priceBar ml20">
-                    <div class="inlineBar start">
-                        <div class="greenBar green">
-                            <div class="numBlock ml15">
-                                <div class="first">卖价</div>
-                                <div class="last" :class="handleQuotePriceColor(selectedRow.ask, selectedRow.presettle)"> {{ selectedRow.ask }}</div>
-                            </div>
-                            <div class="numBlock">
-                                <div class="first">卖量</div>
-                                <div class="last">{{ selectedRow.askvolume }}</div>
-                            </div>
-                        </div>
-                        <div class="greenBar green">
-                            <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 start">
-                        <div class="redBar red1">
-                            <div class="numBlock">
-                                <div class="first">买价</div>
-                                <div class="last" :class="handleQuotePriceColor(selectedRow.bid, selectedRow.presettle)"> {{ selectedRow.bid }}</div>
-                            </div>
-                            <div class="numBlock">
-                                <div class="first">买量</div>
-                                <div class="last">{{ selectedRow.bidvolume }}</div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
+          </div>
+          <div class="inlineBar start">
+            <div class="redBar red1">
+              <div class="numBlock">
+                <div class="first">买价</div>
+                <div class="last"
+                     :class="handleQuotePriceColor(selectedRow.bid, selectedRow.presettle)">
+                  {{ selectedRow.bid }}</div>
+              </div>
+              <div class="numBlock">
+                <div class="first">买量</div>
+                <div class="last">{{ selectedRow.bidvolume }}</div>
+              </div>
             </div>
+          </div>
         </div>
-        <!-- 交易图表 -->
-        <Chart v-if="showComponentsId === ComponentType.chart" @update="changeComponent" :selectedRow="selectedRow" />
-        <!-- 成交明细 -->
-        <StockExchange :selectedRow="selectedRow" v-if="showComponentsId === ComponentType.tradeDetail" />
+      </div>
     </div>
+    <!-- 交易图表 -->
+    <Chart v-if="showComponentsId === ComponentType.chart"
+           @update="changeComponent"
+           :selectedRow="selectedRow" />
+    <!-- 成交明细 -->
+    <StockExchange :selectedRow="selectedRow"
+                   v-if="showComponentsId === ComponentType.tradeDetail" />
+  </div>
 </template>
 
 <script lang="ts">