luyisha 3 years ago
parent
commit
366201227d
  1. 2
      src/components/KLine.vue
  2. 3
      src/views/exchange/book-trades.vue
  3. 66
      src/views/exchange/index.vue
  4. 51
      src/views/exchange/make-deal.vue

2
src/components/KLine.vue

@ -24,7 +24,7 @@ export default {
data() { data() {
return { return {
model: null, // model: null, //
interval: "1D" // []TVresolution interval: "15" // [字符串格式]和TV的resolution同步//
}; };
}, },

3
src/views/exchange/book-trades.vue

@ -1,5 +1,5 @@
<template> <template>
<div class="col-md-3" style="margin-left: -15px;"> <div class="col-md-4" style="margin-left: -15px;">
<div style="display: flex;flex-direction: column;align-items: end;height: 100%;"> <div style="display: flex;flex-direction: column;align-items: end;height: 100%;">
<div class="order-book mb15" style="width: 95%;background-color: #fff;"> <div class="order-book mb15" style="width: 95%;background-color: #fff;">
<h2 class="heading">{{ $t("exchange.order-book") }}</h2> <h2 class="heading">{{ $t("exchange.order-book") }}</h2>
@ -14,7 +14,6 @@
<th class="w-33 text-right">{{ $t("exchange.total") }}({{pair.from}})</th> <th class="w-33 text-right">{{ $t("exchange.total") }}({{pair.from}})</th>
</tr> </tr>
</thead> </thead>
<tbody class="sell-orders" v-if="symbol!='gitpusdt'"> <tbody class="sell-orders" v-if="symbol!='gitpusdt'">
<div class="order-item" v-for="item in sellList" :key="item.id"> <div class="order-item" v-for="item in sellList" :key="item.id">
<el-progress class="progress" type="line" :stroke-width="39" :percentage="getValue(item.amount)" :show-text="false" color="rgba(216,43,43,0.15)" define-back-color="#222e3d"> <el-progress class="progress" type="line" :stroke-width="39" :percentage="getValue(item.amount)" :show-text="false" color="rgba(216,43,43,0.15)" define-back-color="#222e3d">

66
src/views/exchange/index.vue

@ -10,7 +10,7 @@
<div class="container-fluid no-fluid" style="background-color: #f5f5f5;padding: 15px 15px;"> <div class="container-fluid no-fluid" style="background-color: #f5f5f5;padding: 15px 15px;">
<div class="row sm-gutters"> <div class="row sm-gutters">
<div class="col-md-9" style="padding-right:0px!important;margin-right: 15px;"> <div class="col-md-8" style="padding-right:0px!important;margin-right: 15px;">
<div class="row"> <div class="row">
<div class="col-md-12" style="padding-right: 0px!important;"> <div class="col-md-12" style="padding-right: 0px!important;">
<div class="px-4 py-3 heading"> <div class="px-4 py-3 heading">
@ -274,7 +274,6 @@ export default {
// //
$route( /*newRouter, oldRouter*/ ) { $route( /*newRouter, oldRouter*/ ) {
this.addSub(); this.addSub();
// market // market
@ -315,9 +314,6 @@ export default {
}, { }, {
cmd: 'sub', cmd: 'sub',
msg: `tradeList_${this.symbol}` msg: `tradeList_${this.symbol}`
}, {
cmd: 'sub',
msg: `swapMarketList`
}]); }]);
}, },
@ -337,9 +333,6 @@ export default {
}, { }, {
cmd: 'unsub', cmd: 'unsub',
msg: `tradeList_${symbol}` msg: `tradeList_${symbol}`
}, {
cmd: 'sub',
msg: `swapMarketList`
}]); }]);
}, },
@ -497,7 +490,6 @@ export default {
this.initMarket(); this.initMarket();
// id // id
if (this.symbol) this.addSub(); if (this.symbol) this.addSub();
// this.getSwapMarketList();
}) })
this.ws.on("message", (response) => { this.ws.on("message", (response) => {
@ -517,7 +509,7 @@ export default {
switch (sub) { switch (sub) {
case "exchangeMarketList": case "exchangeMarketList":
console.log(data,'----000---') // console.log(data,'----000---')
this.marketList = data; this.marketList = data;
// console.log(this.marketList[0].marketInfoList[0].close, '0000------------') // console.log(this.marketList[0].marketInfoList[0].close, '0000------------')
@ -527,22 +519,23 @@ export default {
this.findMarketBySymbol(); this.findMarketBySymbol();
} }
//
this.activeContract = data this.activeContract = data
.map(item => item.marketInfoList) .map(item => item.marketInfoList)
.flat() .flat()
.find(item => { .find(item => {
return item.pair_name.replace('/', '').toLowerCase() == this.symbol return item.pair_name.replace('/', '').toLowerCase() == this.symbol
}); });
console.log(this.activeContract, this.activeContract.close, '122222--------', this.symbol+'symbol') // console.log(this.activeContract, this.activeContract.close, '122222--------', this.symbol+'symbol')
break; break;
case `buyList_${this.symbol}`: case `buyList_${this.symbol}`:
// console.log(data, '--------');
this.buyList = data; this.buyList = data;
break; break;
case `sellList_${this.symbol}`: case `sellList_${this.symbol}`:
// console.log(data, '--------');
this.sellList = data; this.sellList = data;
break; break;
@ -556,19 +549,7 @@ export default {
this.newTrade = _.nth(this.trade); this.newTrade = _.nth(this.trade);
if (this.newTrade && this.newTrade.buy_user_id === this.userInfo.user_id || this.newTrade.sell_user_id == this.userInfo.user_id) this.update(); if (this.newTrade && this.newTrade.buy_user_id === this.userInfo.user_id || this.newTrade.sell_user_id == this.userInfo.user_id) this.update();
break; break;
case `swapMarketList`:
//
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----------------')
break;
} }
}); });
@ -585,38 +566,7 @@ export default {
}); });
}, },
getSwapMarketList(){
let msg = "swapMarketList";
this.ws.send({
cmd: "sub",
msg: msg
});
this.ws.on("message", res => {
let { data, sub,cmd } = res;
console.log(data, sub,cmd, '000000000000000')
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() { created() {

51
src/views/exchange/make-deal.vue

@ -363,7 +363,7 @@ export default {
if (!this.isMarket) { if (!this.isMarket) {
return Math.multiple(this.buyorder.entrust_price, this.buyorder.amount); return Math.multiple(this.buyorder.entrust_price, this.buyorder.amount);
} else { } else {
return this.cacheTotal; return this.cacheTotal===0?'':this.cacheTotal;
} }
}, },
set(val) { set(val) {
@ -378,7 +378,9 @@ export default {
sellTotal: { sellTotal: {
get() { get() {
return Math.multiple(this.sellorder.entrust_price, this.sellorder.amount); let num = Math.multiple(this.sellorder.entrust_price, this.sellorder.amount);
// num = this.dealZero(num);
return num;
} }
}, },
@ -541,8 +543,8 @@ export default {
this.sellorder.trigger_price = Math.omitTo(price, this.priceDecimals); this.sellorder.trigger_price = Math.omitTo(price, this.priceDecimals);
// //
this.buyorder.amount = 0; this.buyorder.amount = '';
this.sellorder.amount = 0; this.sellorder.amount = '';
// totalset // totalset
// this.buyTotal = 0; // this.buyTotal = 0;
@ -709,6 +711,14 @@ export default {
return flag; return flag;
}, },
// 0
dealZero(numVal){
if(numVal===0){
return '';
}else{
return numVal;
}
}
}, },
created() { created() {
@ -720,22 +730,6 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.buyPercentActive {
a:link {
font-weight: bold;
background: #26a69a;
color: #fff;
}
}
.sellPercentActive {
a:link {
font-weight: bold;
background: #ef5350;
color: #fff;
}
}
.input-group-text { .input-group-text {
width: 68px; width: 68px;
@include flexible(row, center, center); @include flexible(row, center, center);
@ -771,7 +765,22 @@ export default {
.market-trade .input-group-text{ .market-trade .input-group-text{
background-color: #f5f5f5; background-color: #f5f5f5;
} }
.sellPercentActive a:link, .market-trade-sell .market-trade-list li a:hover{ .buyPercentActive {
a:link {
font-weight: bold;
// background: #F7D558;
}
}
.sellPercentActive {
a:link {
font-weight: bold;
// background: #ef5350;
}
}
.sellPercentActive a:link,
.market-trade-sell .market-trade-list li a:hover,
.buyPercentActive a:link,
.market-trade-buy .market-trade-list li a:hover{
background-color: #F7D558; background-color: #F7D558;
color: #fff!important; color: #fff!important;
} }

Loading…
Cancel
Save