优化合约部分

main.js

@@ -12,16 +12,22 @@ import ZH from './utils/language/zh_TW.js'
 import VI from './utils/language/vi_VN.js'
 
 import api from './utils/api.js'
+import constant from './utils/constant.js'
+import websocket from './utils/websocket.js'
 Vue.prototype.$api = api
+Vue.prototype.$constant = constant
+Vue.prototype.$websocket = websocket
 // 自定义底部导航栏
 import tabBar from 'components/tabBar/tabBar.vue'
 Vue.component('tab-bar', tabBar)
-window.wx = {} 
+ 
 Vue.use(uView);
 uni.$u.config.unit = 'rpx'
 
 Vue.use(VueI18n);
-
+// #ifdef  H5
+window.wx = {}
+// #endif
 const i18n = new VueI18n({
   locale: store.state.language,  // 默认选择的语言
   // locale: 'en_US', // 默认选择的语言

pages/markets/index.vue

@@ -8,13 +8,15 @@
 		</view>
 		<!-- 列表 -->
 		<view class="coinList">
-            <view class="coin" v-for="(item, index) in 20" :key="index" @click="goto(item)">
+			<view class="coin" v-for="(item, index) in symbolList" :key="index" @click="goto(item)">
 				<view class="icon">
-                    <u-icon name="../../static/maskets/bye.png" size="40rpx" width="40rpx"></u-icon>
+					<u-icon :name="BASE_URL+item.coinSymbol+'.png'" size="40rpx" width="40rpx"></u-icon>
+				</view>
+				<view class="name">{{item.pair}}</view>
+				<view class="price">{{ item.price}}</view>
+				<view class="priceChange" :class="{ 'down': item.percent< 0 }">
+					{{item.percent>=0?'+'+item.percent:item.percent}}%
 				</view>
-                <view class="name">BTC/USDT</view>
-                <view class="price">{{ 5145 * index * index * index }}</view>
-                <view class="priceChange" :class="{ 'down': index % 2 === 0 }">500.30%</view>
 			</view>
 		</view>
 		<!-- tabBar -->
@@ -27,16 +29,25 @@ export default {
 		name: 'markets',
 		data() {
 			return {
-
+				BASE_URL: '',
+				symbolList: [],
+				websock: null,
+				websockId: null
 			}
 		},
 		onLoad() {
-
+			this.BASE_URL = this.$constant.BASE_URL + '/coins/';
+			this.getSymbolGroup();
+			this.initWebSocket()
 		},
 		onShow() {
 			
 		},
 		onHide() {
+			this.unsubWebSocket();
+		},
+		onUnload() {
+			this.unsubWebSocket();
 		},
 		computed: {
 			i18n() {
@@ -44,17 +55,76 @@ export default {
 			}
 		},
 		methods: {
+			getSymbolGroup() {
+				const symbolGroup = this.$api.symbolGroup({
+					"model": "contract"
+				});
+				symbolGroup.then(res => {
+						this.symbolList = res.USDT
+
+					})
+					.catch(e => {
+						console.log(e)
+						uni.showToast({
+							title: e,
+							icon: 'none',
+							duration: 2500
+						})
+					})
+				
+
+
+			},
+			subWebSocket() {
+				const data = {
+					event: 'sub',
+					type: 'pairsgroup',
+					id: this.websockId,
+					channel: ["market.pairsgroup"]
+				};
+				
+				this.websock.webSocketSendMsg(data)
+				console.log("websocket发送", data);
+			},
+			unsubWebSocket() {
+				const data = {
+					event: 'un_sub',
+					type: 'pairsgroup',
+					id: this.websockId,
+					channel: ["market.pairsgroup"]
+				};
+				this.websock.webSocketSendMsg(data)
+
+			},
+			initWebSocket() {
+
+				
+				this.websock = new this.$websocket(this.$constant.WSSURL) // xxx 表示接口地址URL
+
+				
+				var that = this
+				this.websock.getWebSocketMsg(data => {
+					console.log(data, 1111)
+					if (data.channel === 'conn') {
+						that.websockId = data.data
+						that.subWebSocket();
+					} else if (data.channel === 'market.pairsgroup') {
+						that.symbolList = data.data.USDT;
+					}
+				});
+			},
+
 			/**
 			 * 跳转
 			 */
 			goto(data) {
+				uni.setStorageSync('symbol', data);
 				uni.navigateTo({
 					url: '/pages/markets/trade',
 				});
 			},
 		}
 	}
-
 </script>
 
 <style lang="scss" scoped>

pages/markets/kLine.vue

@@ -343,6 +343,7 @@
 								left: '50rpx',
 								right: '10rpx',
 								height: '60%',
+								
 								backgroundColor: 'transparent',
 							},
 							{

pages/markets/trade.vue

@@ -2,7 +2,7 @@
 	<view class="main">
 		<!-- nav -->
 		<navigation :showBack="false">
-            <view class="leftMenuBtn" @click="popupShow = true">{{ 'BTC/USDT' }}</view>
+			<view class="leftMenuBtn" @click="popupShow = true">{{symbol.pair}}</view>
 			<view slot="right" class="right" @click="goto('kLine')"></view>
 		</navigation>
 		<view class="content">
@@ -30,10 +30,12 @@
 				<view class="coinList">
 					<scroll-view scroll-y="true" style="height: 86vh;" scroll-with-animation="true"
 						@touchmove.stop.prevent="">
-                        <view class="coin" v-for="(item, index) in 20" :key="index" @click="switchTo(item)">
+						<view class="coin" v-for="(item, index) in symbolList" :key="index" @click="switchTo(item)">
-                            <view class="name">BTC/USDT</view>
+							<view class="name">{{item.pair}}</view>
-                            <view class="price">{{ 5145 * index * index * index }}</view>
+							<view class="price">{{ item.price}}</view>
-                            <view class="priceChange" :class="{ 'down': index % 2 === 0 }">500.30%</view>
+							<view class="priceChange" :class="{ 'down': item.percent< 0 }">
+								{{item.percent>=0?'+'+item.percent:item.percent}}%
+							</view>
 						</view>
 					</scroll-view>
 
@@ -51,6 +53,11 @@ export default {
 		data() {
 			return {
 				popupShow: false,
+				symbolList: [],
+				symbol: null,
+				marketDetail:null,
+				bboList:[],
+				tradeList:[]
 			};
 		},
 		computed: {
@@ -59,9 +66,137 @@ export default {
 			},
 		},
 		onLoad() {
+			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.getSymbolGroup();
+			this.initWebSocket();
+		},
+		onShow() {
+			console.log(11111, uni.getStorageSync('symbol'));
 		},
-    onShow() { },
 		methods: {
+			getTradeList(symbol){
+				const tradeList = this.$api.tradeList({
+					"symbol": symbol
+				});
+				tradeList.then(res => {
+						this.tradeList = res
+				
+					})
+					.catch(e => {
+						console.log(e)
+						uni.showToast({
+							title: e,
+							icon: 'none',
+							duration: 2500
+						})
+					})
+			},
+			getBboList(symbol){
+				const bboList = this.$api.bboList({
+					"symbol": symbol
+				});
+				bboList.then(res => {
+						this.bboList = res
+				
+					})
+					.catch(e => {
+						console.log(e)
+						uni.showToast({
+							title: e,
+							icon: 'none',
+							duration: 2500
+						})
+					})
+			},
+			getMarketDetail(symbol){
+				const marketDetail = this.$api.marketDetail({
+					"symbol": symbol
+				});
+				marketDetail.then(res => {
+						this.marketDetail = res
+				
+					})
+					.catch(e => {
+						console.log(e)
+						uni.showToast({
+							title: e,
+							icon: 'none',
+							duration: 2500
+						})
+					})
+			},
+			getSymbolGroup() {
+				const symbolGroup = this.$api.symbolGroup({
+					"model": "contract"
+				});
+				symbolGroup.then(res => {
+						this.symbolList = res.USDT
+						if(this.symbol==null){
+							this.symbol=this.symbolList[0]
+						}
+
+					})
+					.catch(e => {
+						console.log(e)
+						uni.showToast({
+							title: e,
+							icon: 'none',
+							duration: 2500
+						})
+					})
+
+
+
+			},
+			initWebSocket() {
+			
+				
+				this.websock = new this.$websocket(this.$constant.WSSURL) // xxx 表示接口地址URL
+			
+				
+				var that = this
+				this.websock.getWebSocketMsg(data => {
+					
+					if (data.channel === 'conn') {
+						that.websockId = data.data
+						that.subpairsgroup();
+					} else if (data.channel === 'market.pairsgroup') {
+						that.symbolList = data.data.USDT;
+					}else if (data.channel === 'market.pairsgroup') {
+						that.symbolList = data.data.USDT;
+					}
+				});
+			},
+			//订阅交易对
+			subpairsgroup(){
+				this.subWebSocket('pairsgroup',['market.pairsgroup'])
+			},
+			subWebSocket(type,channel) {
+				const data = {
+					event: 'sub',
+					type: type,
+					id: this.websockId,
+					channel: channel
+				};
+				
+				this.websock.webSocketSendMsg(data)
+				console.log("websocket发送", data);
+			},
+			unsubWebSocket(type,channel) {
+				const data = {
+					event: 'un_sub',
+					type: type,
+					id: this.websockId,
+					channel: channel
+				};
+				this.websock.webSocketSendMsg(data)
+			
+			},
 			depthChange(e) {
 				console.log(e);
 			},
@@ -83,6 +218,7 @@ export default {
 			 */
 			switchTo(item) {
 				this.popupShow = false;
+				this.symbol=item;
 			}
 
 		},

utils/axios.js

@@ -29,9 +29,10 @@ service.interceptors.request.use(
 				mask: true
 			})
 		}
+		
 		if (config.url.indexOf('market') > -1) {
 			// #ifdef H5
-			baseURL = constant.H5_MARKET_URL;
+			config.baseURL = constant.H5_MARKET_URL;
 			// #endif
 			// #ifdef APP-PLUS
 			config.baseURL = Vue.prototype.MARKET_URL;
@@ -138,19 +139,16 @@ service.interceptors.response.use(res => {
 	// console.log(res)
 	// console.log(res.data)
 	// console.log(res.data.data[0].nameAlias)
-	if (res.success || res.errCode === 'USER.0017') {
+	if (res.code===0||res.success) {
 		return res.data;
 	} 
-	if(res.errMsg=='No customer service is online'&&res.errCode=='SYS.0012'){
+	
-		return res;
-	}
-	else {
 		uni.showToast({
 			title: res.errMsg,
 			icon: 'none',
 			duration: 1500
 		})
-		if (res.errCode === 'USER.0010') {
+		if (res.errCode === 'SYS.0006') {
 			uni.setStorageSync('ticket',null);
 			uni.removeStorage({
 				key: 'logInfo',
@@ -178,7 +176,6 @@ service.interceptors.response.use(res => {
 		}
 		uni.$emit('refreshQrCode')
 		return Promise.reject(res.errMsg);
-	}
 }, error => {
 	uni.hideLoading();
 	return Promise.reject(error)

utils/websocket.js

@@ -0,0 +1,184 @@
+class WebSocketClass {
+	constructor(url) {
+		this.lockReconnect = false; // 是否开始重连
+		this.wsUrl = ""; // ws 地址
+		this.globalCallback = null; // 回调方法
+		this.userClose = false; // 是否主动关闭
+		this.createWebSocket(url);
+	}
+
+	createWebSocket(url) {
+		// #ifdef H5
+		if (typeof(WebSocket) === 'undefined') {
+			this.writeToScreen("您的浏览器不支持WebSocket，无法获取数据");
+			return false
+		}
+		// #endif
+
+		// #ifdef APP-PLUS
+		if (typeof(uni.connectSocket) === 'undefined') {
+			this.writeToScreen("您的浏览器不支持WebSocket，无法获取数据");
+			return false
+		}
+		// #endif
+
+		this.wsUrl = url;
+		try {
+			// 创建一个this.ws对象【发送、接收、关闭socket都由这个对象操作】
+
+			// #ifdef H5
+			this.ws = new WebSocket(this.wsUrl);
+			this.initEventHandle();
+			// #endif
+
+			// #ifdef APP-PLUS
+			let that = this
+			this.ws = uni.connectSocket({
+				url: this.wsUrl,
+				success(data) {
+					console.log("websocket连接成功");
+
+					that.initEventHandle();
+				},
+			});
+			// #endif
+		} catch (e) {
+			this.reconnect(url);
+		}
+	}
+
+	// 初始化
+	initEventHandle() {
+		/**
+		 * 监听WebSocket连接打开成功
+		 */
+
+		// #ifdef H5
+		this.ws.onopen = (event) => {
+			console.log("WebSocket连接打开");
+		};
+		// #endif
+
+		// #ifdef APP-PLUS
+		this.ws.onOpen(res => {
+			console.log('WebSocket连接打开');
+		});
+		// #endif
+
+
+		/**
+		 * 连接关闭后的回调函数
+		 */
+
+		// #ifdef H5
+		this.ws.onclose = (event) => {
+			if (!this.userClose) {
+				this.reconnect(this.wsUrl); //重连
+			}
+		};
+		// #endif
+
+		// #ifdef APP-PLUS
+		this.ws.onClose(() => {
+			if (!this.userClose) {
+				this.reconnect(this.wsUrl); //重连
+			}
+		});
+		// #endif
+
+
+		/**
+		 * 报错时的回调函数
+		 */
+
+		// #ifdef H5
+		this.ws.onerror = (event) => {
+			if (!this.userClose) {
+				this.reconnect(this.wsUrl); //重连
+			}
+		};
+		// #endif
+
+		// #ifdef APP-PLUS
+		this.ws.onError(() => {
+			if (!this.userClose) {
+				this.reconnect(this.wsUrl); //重连
+			}
+		});
+		// #endif
+
+
+		/**
+		 * 收到服务器数据后的回调函数
+		 */
+
+		// #ifdef H5
+		this.ws.onmessage = (event) => {
+			
+			this.globalCallback(JSON.parse(event.data))
+		};
+		// #endif
+
+		// #ifdef APP-PLUS
+		this.ws.onMessage(event => {
+			this.globalCallback(JSON.parse(event.data))
+		});
+		// #endif
+	}
+
+	// 关闭ws连接回调
+	reconnect(url) {
+		if (this.lockReconnect) return;
+		this.ws.close();
+		this.lockReconnect = true; // 关闭重连，没连接上会一直重连，设置延迟避免请求过多
+		setTimeout(() => {
+			this.createWebSocket(url);
+			this.lockReconnect = false;
+		}, 1000);
+	}
+
+	// 发送信息方法
+	webSocketSendMsg(msg) {
+		// #ifdef H5
+		this.ws && this.ws.send(JSON.stringify(msg));
+		// #endif
+		
+		// #ifdef APP-PLUS
+		this.ws && this.ws.send({
+			data: JSON.stringify(msg),
+			success() {
+				console.log("消息发送成功");
+			},
+			fail(err) {
+				console.log("关闭失败", err)
+			}
+		});
+		// #endif
+		
+	}
+
+	// 获取ws返回的数据方法
+	getWebSocketMsg(callback) {
+		this.globalCallback = callback
+	}
+
+	// 关闭ws方法
+	closeSocket() {
+		if (this.ws) {
+			this.userClose = true;
+			this.ws.close({
+				success(res) {
+					console.log("关闭成功", res)
+				},
+				fail(err) {
+					console.log("关闭失败", err)
+				}
+			});
+		}
+	}
+
+	writeToScreen(massage) {
+		console.log(massage);
+	}
+}
+export default WebSocketClass;