2

src/views/contract/index.vue

@@ -299,6 +299,7 @@ export default {
             if(val.price){
                 delete contractList.price
             }
+        console.log(contractList, 'co-activeContract----------------')
         return contractList;
     },
     isLogin() {

src/views/exchange/make-deal.vue

@@ -58,10 +58,10 @@
         </el-tooltip>
 
     </div>
-    <div class="px-4 py-2 heading">
+    <div class="px-4 py-2 heading" style="border: 1px solid #e5e5e5;margin-bottom:10px;">
         <div class="coin-change d-flex align-items-center py-2 pl-4 heading justify-content-between">
           <div class="d-flex align-items-center">
-            <div
+            <!-- <div
               class="price px-3 border-right"
               :class="{
                 decreace: activeContract.increase < 0,
@@ -71,38 +71,37 @@
               <span class="current">{{ activeContract.price }}$</span>
               &nbsp;
               <span class="zf">{{ activeContract.increaseStr }}</span>
-            </div>
+            </div> -->
             <!-- 币种价值数据 -->
             <div class="d-flex fn-12">
-              <div class="item px-2">
-                <div class="title mb-1 text-secondary">
-                  24h {{ $t("contract.h7") }}
-                </div>
-                <div>
-                   {{ activeContract.high }}
+                <div class="title mb-1 text-secondary px-2">
+                  <!-- 24h {{ $t("contract.h7") }} -->
+                  24h {{ $t("option.zf") }}
                 </div>
+                <div class="px-3" :class="{
+                    decreace: activeContract.increase < 0,
+                    increase: activeContract.increase >= 0
+                    }">
+                   <!-- {{ activeContract.high }} -->
+                   {{ activeContract.increaseStr }}
                 </div>
-              <div class="item px-2">
-                <div class="title mb-1 text-secondary">
+                <div class="title mb-1 text-secondary px-2">
                     24h {{ $t("contract.h8") }}
                 </div>
-                <div>
+                <div class="px-3">
                     {{ activeContract.low }}
                 </div>
-              </div>
-              <div class="item px-2">
-                <div class="title mb-1 text-secondary">
+                <div class="title mb-1 text-secondary px-2">
                   24h {{ $t("contract.h9") }}
 				  (USDT)
                 </div>
-                <div>
+                <div class="decreace px-3">
                   {{ activeContract.vol }}
                 </div>
             </div>
           </div>
         </div>
     </div>
-    </div>
     <!-- 生成K线图 -->
     <k-line :symbol="symbol" :socket="socket" :priceDecimals="priceDecimals"></k-line>
 
@@ -321,6 +320,7 @@
 <script>
 import Exchange from "@/api/exchange";
 import Market from "@/api/market";
+import Socket from "@/api/server/Socket.js";
 import {
     Message,
     Loading
@@ -383,6 +383,8 @@ export default {
             //
             buyPercentIndex: null,
             sellPercentIndex: null,
+            activeContract:{},
+            ws: new Socket(this.Globals.Server.Path.WS1),
         }
     },
 
@@ -429,9 +431,6 @@ export default {
         lang() {
             let browser_Lang = navigator.language.includes('zh') ? 'zh' : 'en';
             return localStorage.lang || browser_Lang;
-        },
-        activeContract(){
-            return {}
         }
     },
 
@@ -754,12 +753,46 @@ export default {
             // 返回验证结果
             return flag;
         },
-
+        getSwapMarketList(){
+            let msg = "swapMarketList";
+            this.ws.send({
+                cmd: "sub",
+                msg: msg
+            });
+            this.ws.on("message", res => {
+                let { data, sub,cmd } = res;
+                if (sub == msg) {
+                    if( data.symbol=='BTC' )(data.price).toFixed(1)
+                    let listA = data;
+                    let listB = listA
+                    .map(item => item.marketInfoList)
+                    .flat()
+                    .find(item => {
+                        return item.pair_name.replace('/', '').toLowerCase() == this.symbol
+                    });
+                    this.activeContract = listB || {};
+                    console.log(this.symbol, this.activeContract, 'ex-activeContract----------------')
+                }else if (cmd == "ping") {
+                this.ws.send({
+                    cmd: "pong"
+                });
+                }
+            });
+            this.ws.on('close',()=>{
+                this.ws= new Socket(this.Globals.Server.Path.WS1),
+                console.log('链接关闭');
+                this.wsOpen();
+            })
+        }
     },
 
     created() {
         this.getCoinInfo()
         this.reset();
+        this.ws.on("open", () => {
+            this.getSwapMarketList();
+        });
+        // this.getSwapMarketList();
     },
 
 }