j1ack 3 years ago
parent
commit
c3a06698e9
  1. 28
      components/positionList/positionList.vue
  2. 216
      package-lock.json
  3. 90
      pages/markets/trade.vue

28
components/positionList/positionList.vue

@ -5,21 +5,21 @@
<view class="num">{{ i18n.Number }}</view>
</view>
<view class="sell">
<view class="item" v-for="(item, index) in sellList" :key="index" @click="depthClick(item)">
<text class="price">47823.00</text>
<text class="num">{{ item }}</text>
<view class="item" v-for="(item, index) in bboList.sell" :key="index" @click="depthClick(item)">
<text class="price">{{ item.price }}</text>
<text class="num">{{ item.total }}</text>
<view class="sellbg" :style="`width: ${20 * index}%;`"></view>
</view>
</view>
<view class="currentPriceBody" @click="depthClick(item)">
<view class="currentPrice">34985.93</view>
<view class="transition">$28767.23</view>
<view class="currentPrice">{{marketDetail.close}}</view>
<view class="transition">${{marketDetail.close*marketDetail.usdRate}}</view>
</view>
<view class="buy">
<view class="item" v-for="(item, index) in buyList" :key="index" @click="depthClick(item)">
<text class="price">47823.00</text>
<text class="num">{{ item }}</text>
<view class="item" v-for="(item, index) in bboList.buy" :key="index" @click="depthClick(item)">
<text class="price">{{ item.price }}</text>
<text class="num">{{ item.total }}</text>
<view class="buybg" :style="`width: ${20 * index}%;`"></view>
</view>
</view>
@ -30,14 +30,22 @@
<script>
export default {
props: {
item: Object
item: Object,
marketDetail: {
type: Object,
default: () => {}
},
bboList:{
type: Object,
default: () => {}
}
},
data() {
return {
popoverVisible: false,
depthValue: 1,
sellList: 9,
buyList: 6,
buyList: 10,
}
},
computed: {

216
package-lock.json

@ -1,8 +1,222 @@
{
"name": "samehome",
"version": "1.0.0",
"lockfileVersion": 1,
"lockfileVersion": 2,
"requires": true,
"packages": {
"": {
"name": "samehome",
"version": "1.0.0",
"license": "ISC",
"dependencies": {
"axios": "^0.27.2",
"echarts": "^5.3.3",
"js-md5": "^0.7.3",
"uview-ui": "^2.0.33",
"vue-i18n": "^9.2.2"
}
},
"node_modules/@intlify/core-base": {
"version": "9.2.2",
"resolved": "https://registry.npmmirror.com/@intlify/core-base/-/core-base-9.2.2.tgz",
"integrity": "sha512-JjUpQtNfn+joMbrXvpR4hTF8iJQ2sEFzzK3KIESOx+f+uwIjgw20igOyaIdhfsVVBCds8ZM64MoeNSx+PHQMkA==",
"dependencies": {
"@intlify/devtools-if": "9.2.2",
"@intlify/message-compiler": "9.2.2",
"@intlify/shared": "9.2.2",
"@intlify/vue-devtools": "9.2.2"
},
"engines": {
"node": ">= 14"
}
},
"node_modules/@intlify/devtools-if": {
"version": "9.2.2",
"resolved": "https://registry.npmmirror.com/@intlify/devtools-if/-/devtools-if-9.2.2.tgz",
"integrity": "sha512-4ttr/FNO29w+kBbU7HZ/U0Lzuh2cRDhP8UlWOtV9ERcjHzuyXVZmjyleESK6eVP60tGC9QtQW9yZE+JeRhDHkg==",
"dependencies": {
"@intlify/shared": "9.2.2"
},
"engines": {
"node": ">= 14"
}
},
"node_modules/@intlify/message-compiler": {
"version": "9.2.2",
"resolved": "https://registry.npmmirror.com/@intlify/message-compiler/-/message-compiler-9.2.2.tgz",
"integrity": "sha512-IUrQW7byAKN2fMBe8z6sK6riG1pue95e5jfokn8hA5Q3Bqy4MBJ5lJAofUsawQJYHeoPJ7svMDyBaVJ4d0GTtA==",
"dependencies": {
"@intlify/shared": "9.2.2",
"source-map": "0.6.1"
},
"engines": {
"node": ">= 14"
}
},
"node_modules/@intlify/shared": {
"version": "9.2.2",
"resolved": "https://registry.npmmirror.com/@intlify/shared/-/shared-9.2.2.tgz",
"integrity": "sha512-wRwTpsslgZS5HNyM7uDQYZtxnbI12aGiBZURX3BTR9RFIKKRWpllTsgzHWvj3HKm3Y2Sh5LPC1r0PDCKEhVn9Q==",
"engines": {
"node": ">= 14"
}
},
"node_modules/@intlify/vue-devtools": {
"version": "9.2.2",
"resolved": "https://registry.npmmirror.com/@intlify/vue-devtools/-/vue-devtools-9.2.2.tgz",
"integrity": "sha512-+dUyqyCHWHb/UcvY1MlIpO87munedm3Gn6E9WWYdWrMuYLcoIoOEVDWSS8xSwtlPU+kA+MEQTP6Q1iI/ocusJg==",
"dependencies": {
"@intlify/core-base": "9.2.2",
"@intlify/shared": "9.2.2"
},
"engines": {
"node": ">= 14"
}
},
"node_modules/@vue/devtools-api": {
"version": "6.2.1",
"resolved": "https://registry.npmmirror.com/@vue/devtools-api/-/devtools-api-6.2.1.tgz",
"integrity": "sha512-OEgAMeQXvCoJ+1x8WyQuVZzFo0wcyCmUR3baRVLmKBo1LmYZWMlRiXlux5jd0fqVJu6PfDbOrZItVqUEzLobeQ=="
},
"node_modules/asynckit": {
"version": "0.4.0",
"resolved": "https://registry.npmmirror.com/asynckit/-/asynckit-0.4.0.tgz",
"integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q=="
},
"node_modules/axios": {
"version": "0.27.2",
"resolved": "https://registry.npmmirror.com/axios/-/axios-0.27.2.tgz",
"integrity": "sha512-t+yRIyySRTp/wua5xEr+z1q60QmLq8ABsS5O9Me1AsE5dfKqgnCFzwiCZZ/cGNd1lq4/7akDWMxdhVlucjmnOQ==",
"dependencies": {
"follow-redirects": "^1.14.9",
"form-data": "^4.0.0"
}
},
"node_modules/combined-stream": {
"version": "1.0.8",
"resolved": "https://registry.npmmirror.com/combined-stream/-/combined-stream-1.0.8.tgz",
"integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
"dependencies": {
"delayed-stream": "~1.0.0"
},
"engines": {
"node": ">= 0.8"
}
},
"node_modules/delayed-stream": {
"version": "1.0.0",
"resolved": "https://registry.npmmirror.com/delayed-stream/-/delayed-stream-1.0.0.tgz",
"integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==",
"engines": {
"node": ">=0.4.0"
}
},
"node_modules/echarts": {
"version": "5.3.3",
"resolved": "https://registry.npmmirror.com/echarts/-/echarts-5.3.3.tgz",
"integrity": "sha512-BRw2serInRwO5SIwRviZ6Xgm5Lb7irgz+sLiFMmy/HOaf4SQ+7oYqxKzRHAKp4xHQ05AuHw1xvoQWJjDQq/FGw==",
"dependencies": {
"tslib": "2.3.0",
"zrender": "5.3.2"
}
},
"node_modules/follow-redirects": {
"version": "1.15.1",
"resolved": "https://registry.npmmirror.com/follow-redirects/-/follow-redirects-1.15.1.tgz",
"integrity": "sha512-yLAMQs+k0b2m7cVxpS1VKJVvoz7SS9Td1zss3XRwXj+ZDH00RJgnuLx7E44wx02kQLrdM3aOOy+FpzS7+8OizA==",
"engines": {
"node": ">=4.0"
},
"peerDependenciesMeta": {
"debug": {
"optional": true
}
}
},
"node_modules/form-data": {
"version": "4.0.0",
"resolved": "https://registry.npmmirror.com/form-data/-/form-data-4.0.0.tgz",
"integrity": "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==",
"dependencies": {
"asynckit": "^0.4.0",
"combined-stream": "^1.0.8",
"mime-types": "^2.1.12"
},
"engines": {
"node": ">= 6"
}
},
"node_modules/js-md5": {
"version": "0.7.3",
"resolved": "https://registry.npmmirror.com/js-md5/-/js-md5-0.7.3.tgz",
"integrity": "sha512-ZC41vPSTLKGwIRjqDh8DfXoCrdQIyBgspJVPXHBGu4nZlAEvG3nf+jO9avM9RmLiGakg7vz974ms99nEV0tmTQ=="
},
"node_modules/mime-db": {
"version": "1.52.0",
"resolved": "https://registry.npmmirror.com/mime-db/-/mime-db-1.52.0.tgz",
"integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
"engines": {
"node": ">= 0.6"
}
},
"node_modules/mime-types": {
"version": "2.1.35",
"resolved": "https://registry.npmmirror.com/mime-types/-/mime-types-2.1.35.tgz",
"integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
"dependencies": {
"mime-db": "1.52.0"
},
"engines": {
"node": ">= 0.6"
}
},
"node_modules/source-map": {
"version": "0.6.1",
"resolved": "https://registry.npmmirror.com/source-map/-/source-map-0.6.1.tgz",
"integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/tslib": {
"version": "2.3.0",
"resolved": "https://registry.npmmirror.com/tslib/-/tslib-2.3.0.tgz",
"integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg=="
},
"node_modules/uview-ui": {
"version": "2.0.33",
"resolved": "https://registry.npmmirror.com/uview-ui/-/uview-ui-2.0.33.tgz",
"integrity": "sha512-M3NsLFAY0z95NGMnTCDUR/TvJb6a/UYZzi1km5Gi6TkBCaoHdbmtQymkc1C4eszeoQOrpEIhit/2V47UglzHRw==",
"engines": {
"HBuilderX": "^3.1.0"
}
},
"node_modules/vue-i18n": {
"version": "9.2.2",
"resolved": "https://registry.npmmirror.com/vue-i18n/-/vue-i18n-9.2.2.tgz",
"integrity": "sha512-yswpwtj89rTBhegUAv9Mu37LNznyu3NpyLQmozF3i1hYOhwpG8RjcjIFIIfnu+2MDZJGSZPXaKWvnQA71Yv9TQ==",
"dependencies": {
"@intlify/core-base": "9.2.2",
"@intlify/shared": "9.2.2",
"@intlify/vue-devtools": "9.2.2",
"@vue/devtools-api": "^6.2.1"
},
"engines": {
"node": ">= 14"
},
"peerDependencies": {
"vue": "^3.0.0"
}
},
"node_modules/zrender": {
"version": "5.3.2",
"resolved": "https://registry.npmmirror.com/zrender/-/zrender-5.3.2.tgz",
"integrity": "sha512-8IiYdfwHj2rx0UeIGZGGU4WEVSDEdeVCaIg/fomejg1Xu6OifAL1GVzIPHg2D+MyUkbNgPWji90t0a8IDk+39w==",
"dependencies": {
"tslib": "2.3.0"
}
}
},
"dependencies": {
"@intlify/core-base": {
"version": "9.2.2",

90
pages/markets/trade.vue

@ -10,7 +10,7 @@
<transaction></transaction>
</view>
<view class="positionSide">
<positionList v-on:depthChange="depthChange"></positionList>
<positionList v-on:depthChange="depthChange" :marketDetail="marketDetail" :bboList="bboList"></positionList>
</view>
</view>
<view class="orderList">
@ -56,8 +56,9 @@
symbolList: [],
symbol: null,
marketDetail:null,
bboList:[],
tradeList:[]
bboList:{},
tradeList:{},
webSocketChannel:{}
};
},
computed: {
@ -66,22 +67,24 @@
},
},
onLoad() {
this.getSymbolGroup();
this.initWebSocket();
this.symbol=uni.getStorageSync('symbol');
if(this.symbol!=null){
this.getMarketDetail(this.symbol.symbol)
this.getBboList(this.symbol.symbol);
this.getTradeList(this.symbol.symbol);
this.getMarketDetail()
this.getBboList();
this.getTradeList();
}
this.getSymbolGroup();
this.initWebSocket();
},
onShow() {
console.log(11111, uni.getStorageSync('symbol'));
},
methods: {
getTradeList(symbol){
getTradeList(){
const tradeList = this.$api.tradeList({
"symbol": symbol
"symbol": this.symbol.symbol
});
tradeList.then(res => {
this.tradeList = res
@ -96,9 +99,9 @@
})
})
},
getBboList(symbol){
getBboList(){
const bboList = this.$api.bboList({
"symbol": symbol
"symbol": this.symbol.symbol
});
bboList.then(res => {
this.bboList = res
@ -113,9 +116,9 @@
})
})
},
getMarketDetail(symbol){
getMarketDetail(){
const marketDetail = this.$api.marketDetail({
"symbol": symbol
"symbol": this.symbol.symbol
});
marketDetail.then(res => {
this.marketDetail = res
@ -164,11 +167,22 @@
if (data.channel === 'conn') {
that.websockId = data.data
that.subpairsgroup();
that.subpairsgroup()
that.subbbo()
that.subtrade()
that.submarketDetail()
} else if (data.channel === 'market.pairsgroup') {
that.symbolList = data.data.USDT;
}else if (data.channel === 'market.pairsgroup') {
that.symbolList = data.data.USDT;
}else if (data.channel === that.webSocketChannel.bbo) {
that.bboList = data.data;
}else if (data.channel === that.webSocketChannel.bbo) {
that.bboList = data.data;
}else if(data.channel === that.webSocketChannel.trade){
that.tradeList=data.data;
}else if(data.channel === that.webSocketChannel.detail){
that.marketDetail=data.data;
}
});
},
@ -176,6 +190,35 @@
subpairsgroup(){
this.subWebSocket('pairsgroup',['market.pairsgroup'])
},
//
unsubpairsgroup(){
this.unsubWebSocket('pairsgroup',['market.pairsgroup'])
},
subbbo(){
this.webSocketChannel.bbo='market.'+this.symbol.symbol+".bbo";
this.subWebSocket('bbo',[this.webSocketChannel.bbo])
},
unsubbbo(){
this.unsubWebSocket('bbo',[this.webSocketChannel.bbo])
},
subtrade(){
this.webSocketChannel.trade='market.'+this.symbol.symbol+".trade";
this.subWebSocket('trade',[this.webSocketChannel.trade])
},
unsubtrade(){
this.unsubWebSocket('trade',[this.webSocketChannel.trade])
},
submarketDetail(){
this.webSocketChannel.detail='market.'+this.symbol.symbol+".detail";
this.subWebSocket('detail',[this.webSocketChannel.detail])
},
unsubmarketDetail(){
this.unsubWebSocket('detail',[this.webSocketChannel.detail])
},
subWebSocket(type,channel) {
const data = {
event: 'sub',
@ -218,7 +261,18 @@
*/
switchTo(item) {
this.popupShow = false;
this.symbol=item;
this.unsubbbo()
this.unsubtrade()
this.unsubmarketDetail()
this.symbol=item;
uni.setStorageSync('symbol',this.symbol);
this.getMarketDetail()
this.getBboList();
this.getTradeList();
this.subbbo()
this.subtrade()
this.submarketDetail()
}
},

Loading…
Cancel
Save