1

api/index.js

@@ -114,11 +114,30 @@ export function Api_delAddress(data) {
 
 // 划转记录
 export function Api_getWalletHzhistory() {
-	return axios.get(`api/wallet/hzhistory`)
+	return axios.get(`/api/wallet/hzhistory`)
 }
 
 
 
+// 下单页信息：当前持仓、张数、逐仓倍数
+export function Api_getLeverDeal(data) {
+	return axios.post(`/api/lever/deal` , data)
+}
+
+// 合约下单
+export function Api_setSubmitLever(data) {
+	return axios.post(`/api/lever/submit` , data)
+}
+
+// 平仓
+export function Api_setCloseLever(data) {
+	return axios.post(`/api/lever/close` , data)
+}
+
+// 设置止盈止损
+export function Api_setLeverStop(data) {
+	return axios.post(`/api/lever/setstop` , data)
+}
 
 // // 根据手机号登录
 // export function goAuthLogin_Api(data) {

components/headContent/headContent.vue

@@ -160,6 +160,7 @@
 					width: 42rpx;
 					height: 40rpx;
 					.iconfont{
+					font-size: 40rpx;
 						color: rgba(107, 104, 104, 0.9);
 					}
 					image {

components/headModules/close.vue

@@ -1,6 +1,6 @@
 <template>
 	<view class="reverse-back-box" @click.stop="reverseBackBtn">
-		<text class="iconfont" :style="{'color': iconColor}">&#xe621;</text>
+		<text class="iconfont" :style="{'color': iconColor}">&#xeca0;</text>
 	</view>
 </template>
 
@@ -28,13 +28,13 @@
 
 <style lang="scss" scoped>
 	.reverse-back-box {
-		width: 37rpx;
-		height: 37rpx;
+		width: 50rpx;
+		height: 50rpx;
 		display: flex;
 		align-items: center;
 		height: 100%;
 		.iconfont{
-		font-size: 26rpx; 
+		font-size: 40rpx; 
 		}
 	}
 </style>

components/headModules/login.vue

@@ -1,7 +1,7 @@
 <template>
 	<view class="login-status" @click.stop="getUserInfo()">
 		<view class="head-icon">
-			<text class="iconfont">&#xe72a;</text>
+			<text class="iconfont">&#xe941;</text>
 			<!-- <image src="../../static/images/logo.png" mode="aspectFit"></image> -->
 		</view>
 		<view v-if="!token" class="no-login">

components/headModules/message.vue

@@ -1,6 +1,6 @@
 <template>
 	<view class="head-icon" >
-		<text class="iconfont">&#xe658;</text>
+		<text class="iconfont">&#xe607;</text>
 		<!-- <image src="../../static/images/logo.png" mode="aspectFit"></image> -->
 	</view>
 </template>

components/headModules/reverse-back.vue

@@ -1,6 +1,6 @@
 <template>
 	<view class="reverse-back-box" @click.stop="reverseBackBtn">
-		<text class="iconfont" :style="{'color': iconColor}">&#xe603;</text>
+		<text class="iconfont" :style="{'color': iconColor}">&#xe8b5;</text>
 	</view>
 </template>
 
@@ -33,11 +33,13 @@
 
 <style lang="scss" scoped>
 	.reverse-back-box {
-		width: 37rpx;
-		height: 37rpx;
+		width: 50rpx;
+		height: 50rpx;
 		display: flex;
 		align-items: center;
 		height: 100%;
-		font-size: 32rpx; 
+		.iconfont{
+			font-size: 40rpx; 
+		}
 	}
 </style>

components/headModules/share.vue

@@ -1,6 +1,6 @@
 <template>
 	<view class="head-icon" @click.stop="openShare()">
-		<text class="iconfont">&#xe7c5;</text>
+		<text class="iconfont">&#xe61d;</text>
 		<!-- <image  src="../../static/images/logo.png" mode="aspectFit"></image> -->
 	
 	</view>

components/headModules/style.vue

@@ -2,7 +2,7 @@
 	<view :class="['style-box' , `${pageStyle}_style-box` ]" @click.stop="setPagesStyle()">
 		<view :class="['style-status' , `${pageStyle}_style` ]">
 			<text class="iconfont" v-if="pageStyle === 'daytime'">&#xe60f;</text>
-			<text class="iconfont" v-else-if="pageStyle === 'black'">&#xe6b8;</text>
+			<text class="iconfont" v-else-if="pageStyle === 'black'">&#xe8b1;</text>
 		</view>
 	</view>
 </template>
@@ -16,7 +16,7 @@
 		},
 		methods:{
 			 setPagesStyle(){
-				 this.pageStyle = this.pageStyle === 'daytime' ? 'black' : 'daytime'
+				 // this.pageStyle = this.pageStyle === 'daytime' ? 'black' : 'daytime'
 			 }
 		}
 	}

components/rollMessage/rollMessage.vue

@@ -1,6 +1,6 @@
 <template>
 	<view class="roll-box">
-		<image class="roll-icon" src="../../static/logo.png" mode="aspectFit"></image>
+		<image class="roll-icon" src="@/static/images/icon_01.png" mode="aspectFit"></image>
 		<view class="roll-list hide_1">
 			<u-notice-bar icon='' bgColor="" duration="3000" direction="column" @click="lookDetails" :text="rollMsg.map(el => {
 				return el.title || ''
@@ -11,7 +11,7 @@
 			</view> -->
 		</view>
 
-		<image class="roll-more" src="../../static/logo.png" mode="aspectFit"></image>
+		<image class="roll-more" src="@/static/images/icon_02.png" mode="aspectFit"></image>
 	</view>
 </template>
 
@@ -60,9 +60,9 @@
 		justify-content: space-between;
 		align-items: center;
 		border-bottom: 1rpx solid $border-color2;
-		.roll-icon,
+		.roll-icon
 		.roll-more {
-			width: 30rpx;
+			width: 33rpx;
 			height: 30rpx;
 			flex-shrink: 0;
 

components/unopen/unopen.vue

@@ -6,12 +6,17 @@
 				提示
 			</view>
 			<view class="unopen-content">
-				<view class="content">
+				<view class="content" :style="{'text-align': textAlign}">
 					{{ content }}
 				</view>
-				
-				<view class="unopen-btn" @click.stop="$refs.popupRef.close()">
-					我知道了
+
+				<view class="unopen-btns">
+					<view v-if="cancelBtn" class="unopen-btn cancel-btn" @click.stop="close()">
+						{{ cancelBtnTetx }}
+					</view>
+					<view class="unopen-btn" @click.stop="confirm()">
+						{{ confirmBtnTetx }}
+					</view>
 				</view>
 			</view>
 		</view>
@@ -21,10 +26,30 @@
 <script>
 	export default {
 		name: "unopen",
-		props:{
-			content:{
-				type:String,
-				default:'暂未开放'
+		props: {
+			title: {
+				type: String,
+				default: '提示'
+			},
+			cancelBtn: {
+				type: Boolean,
+				default: false
+			},
+			cancelBtnTetx: {
+				type: String,
+				default: '取消'
+			},
+			confirmBtnTetx: {
+				type: String,
+				default: '确定'
+			},
+			textAlign: {
+				type: String,
+				default: 'center'
+			},
+			content: {
+				type: String,
+				default: '暂未开放'
 			}
 		},
 		data() {
@@ -40,6 +65,13 @@
 				this.$nextTick(() => {
 					this.$refs.popupRef.open();
 				})
+			},
+			close() {
+				this.$refs.popupRef.close()
+			},
+			confirm() {
+				this.close();
+				this.$emit('confirm')
 			}
 
 		}
@@ -67,31 +99,48 @@
 
 		.unopen-content {
 			padding: 0 36rpx;
-				min-height: 140rpx;
-			
-			.content{
-				padding:40rpx 0;
+			min-height: 140rpx;
+
+			.content {
+				padding: 30rpx 0 50rpx;
 				font-size: 24rpx;
 				font-family: PingFang SC, PingFang SC-Regular;
 				font-weight: 400;
-				color: #1a1a1a; 
-				display: flex;
-				justify-content: center;
-				align-items: center;
+				color: #1a1a1a;
+
+				// display: flex;
+				// justify-content: center;
+				// align-items: center;
 			}
 		}
-		.unopen-btn{
+
+		.unopen-btns {
 			width: 100%;
-			height: 80rpx;
-			line-height:80rpx;
-			background-color: $Theme-Color;
-			margin-bottom: 40rpx;
-			color: #fff;
-			text-align: center;
-			font-size: 30rpx;
-			letter-spacing: 1px;
-			border-radius: 6rpx;
+			display: flex;
+			justify-content: space-between;
+			align-items: stretch;
+
+			.unopen-btn {
+				flex: 1;
+				height: 70rpx;
+				line-height: 70rpx;
+				background-color: $Theme-Color;
+				margin-bottom: 40rpx;
+				color: #fff;
+				text-align: center;
+				font-size: 30rpx;
+				letter-spacing: 1px;
+				border-radius: 6rpx;
+			}
+
+			.cancel-btn {
+				margin-right: 40rpx;
+				border: 1rpx solid $Theme-Color;
+				background-color: #fff;
+				color: $Theme-Color;
+			}
 		}
 
+
 	}
 </style>

pages/content/mine.vue

@@ -32,67 +32,69 @@
 		<view class="mine-muen">
 			<view v-show="showMuen" class="mine-muen-item" @click.stop="openSafetySet()">
 				<view class="muen-content">
-					<image class="muen-icon" src="@/static/logo.png" mode="aspectFit" />
+					<text class="muen-icon iconfont">&#xec4d;</text>
+					<!-- 
+					<text class="muen-icon iconfont">&#xe616;</text> -->
 					<text class="muen-text">安全设置</text>
 				</view>
 				<view class="muen-more">
-					<text class="more-icon iconfont">&#xe88e;</text>
+					<text class="more-icon iconfont">&#xe8b5;</text>
 					<!-- <image class="muen-more-icon" src="../../static/logo.png" mode="aspectFit" /> -->
 				</view>
 			</view>
 			<view v-show="showMuen" class="mine-muen-item">
 				<view class="muen-content">
-					<image class="muen-icon" src="@/static/logo.png" mode="aspectFit" />
+					<text class="muen-icon iconfont">&#xe616;</text>
 					<text class="muen-text">身份验证</text>
 				</view>
 				<view class="muen-more">
 					<text class="muen-more-text">{{ userInfo.is_realname == 1 ? '去认证' : '' }}</text>
-					<text class="more-icon iconfont">&#xe88e;</text>
+					<text class="more-icon iconfont">&#xe8b5;</text>
 				</view>
 			</view>
 			<view v-show="showMuen" class="mine-muen-item" @click.stop="getAddress()">
 				<view class="muen-content">
-					<image class="muen-icon" src="@/static/logo.png" mode="aspectFit" />
+					<text class="muen-icon iconfont">&#xe688;</text>
 					<text class="muen-text">提现地址</text>
 				</view>
 				<view class="muen-more">
-					<text class="more-icon iconfont">&#xe88e;</text>
+					<text class="more-icon iconfont">&#xe8b5;</text>
 				</view>
 			</view>
 			<view v-show="showMuen" class="mine-muen-item">
 				<view class="muen-content">
-					<image class="muen-icon" src="@/static/logo.png" mode="aspectFit" />
+					<text class="muen-icon iconfont">&#xe784;</text>
 					<text class="muen-text">我的红包</text>
 				</view>
 				<view class="muen-more">
-					<text class="more-icon iconfont">&#xe88e;</text>
+					<text class="more-icon iconfont">&#xe8b5;</text>
 				</view>
 			</view>
 			<view v-show="showMuen" class="mine-muen-item" @click.stop="openActivityCenter()">
 				<view class="muen-content">
-					<image class="muen-icon" src="@/static/logo.png" mode="aspectFit" />
+					<text class="muen-icon iconfont">&#xe614;</text>
 					<text class="muen-text">活动中心</text>
 				</view>
 				<view class="muen-more">
-					<text class="more-icon iconfont">&#xe88e;</text>
+					<text class="more-icon iconfont">&#xe8b5;</text>
 				</view>
 			</view>
 			<view class="mine-muen-item" @click.stop="openShare()">
 				<view class="muen-content">
-					<image class="muen-icon" src="@/static/logo.png" mode="aspectFit" />
+					<text class="muen-icon iconfont">&#xe615;</text>
 					<text class="muen-text">邀请链接</text>
 				</view>
 				<view class="muen-more">
-					<text class="more-icon iconfont">&#xe88e;</text>
+					<text class="more-icon iconfont">&#xe8b5;</text>
 				</view>
 			</view>
 			<view v-show="showMuen" class="mine-muen-item">
 				<view class="muen-content">
-					<image class="muen-icon" src="@/static/logo.png" mode="aspectFit" />
+					<text class="muen-icon iconfont">&#xe6e3;</text>
 					<text class="muen-text">合约战绩</text>
 				</view>
 				<view class="muen-more">
-					<text class="more-icon iconfont">&#xe88e;</text>
+					<text class="more-icon iconfont">&#xe8b5;</text>
 				</view>
 			</view>
 		</view>
@@ -101,11 +103,11 @@
 		<view class="mine-muen">
 			<view class="mine-muen-item" @click.stop="openSetting()">
 				<view class="muen-content">
-					<image class="muen-icon" src="../../static/logo.png" mode="aspectFit" />
+					<text class="muen-icon iconfont">&#xe616;</text>
 					<text class="muen-text">系统设置</text>
 				</view>
 				<view class="muen-more">
-					<text class="more-icon iconfont">&#xe88e;</text>
+					<text class="more-icon iconfont">&#xe8b5;</text>
 				</view>
 			</view>
 		</view>
@@ -113,12 +115,12 @@
 		<view class="mine-muen">
 			<view class="mine-muen-item">
 				<view class="muen-content">
-					<image class="muen-icon" src="../../static/logo.png" mode="aspectFit" />
+					<text class="muen-icon iconfont">&#xe823;</text>
 					<text class="muen-text">检查更新</text>
 				</view>
 				<view class="muen-more">
 					<text class="muen-more-text">当前版本 V2.4.6 62</text>
-					<text class="more-icon iconfont">&#xe88e;</text>
+					<text class="more-icon iconfont">&#xe8b5;</text>
 				</view>
 			</view>
 		</view>
@@ -126,20 +128,20 @@
 		<view class="mine-muen">
 			<view class="mine-muen-item" @click.stop="getService()">
 				<view class="muen-content">
-					<image class="muen-icon" src="../../static/logo.png" mode="aspectFit" />
+					<text class="muen-icon iconfont">&#xe621;</text>
 					<text class="muen-text">在线客服</text>
 				</view>
 				<view class="muen-more">
-					<text class="more-icon iconfont">&#xe88e;</text>
+					<text class="more-icon iconfont">&#xe8b5;</text>
 				</view>
 			</view>
 			<view class="mine-muen-item" @click.stop="getAboutUs()">
 				<view class="muen-content">
-					<image class="muen-icon" src="../../static/logo.png" mode="aspectFit" />
+					<text class="muen-icon iconfont">&#xe609;</text>
 					<text class="muen-text">关于我们</text>
 				</view>
 				<view class="muen-more">
-					<text class="more-icon iconfont">&#xe88e;</text>
+					<text class="more-icon iconfont">&#xe8b5;</text>
 				</view>
 			</view>
 			<view class="mine-btn" @click.stop="retreatFromLogin" v-show="showMuen">
@@ -324,12 +326,12 @@
 			align-items: center;
 
 			.muen-icon {
-				width: 28rpx;
-				height: 28rpx;
+				width: 50rpx;
+				// height: 28rpx;
+				font-size: 32rpx;
 			}
 
-			.muen-text {
-				padding-left: 15rpx;
+			.muen-text { 
 				font-size: 28rpx;
 				font-family: PingFang SC, PingFang SC-Regular;
 				font-weight: 400;
@@ -348,13 +350,14 @@
 				font-family: PingFang SC, PingFang SC-Regular;
 				font-weight: 400;
 				color: #0abd76;
-				padding-right: 18rpx;
+				padding-right: 8rpx;
 			}
 
-			.muen-more-icon {
+			.more-icon {
 
-				font-size: 26rpx;
-				color: #ccc;
+				font-size: 30rpx;
+				color: #939292;
+				transform: rotate(-180deg);
 			}
 		}
 	}

pages/contract/index.vue

@@ -29,6 +29,8 @@
 	import notarize from "./modules/notarize.vue"
 	import sustainability from "./sustainability/index.vue"
 	import grants from "./grants/index.vue" 
+	import { Api_getLeverDeal } from "@/api/index.js"
+	// import { startWebSocket , startAjaxSocket} from "@/utils/websock.js"
 	export default {
 		name:'contract',
 		components:{notarize , sustainability , grants},
@@ -41,6 +43,15 @@
 					'赠金交易'
 				]
 			};
+		},
+		onLoad() {
+			 // startWebSocket(); 
+			// startAjaxSocket()
+			 
+			
+		},
+		methods:{
+			
 		}
 	}
 </script>

pages/contract/modules/restrict.vue

@@ -0,0 +1,361 @@
+<template>
+	<uni-popup ref="popupRef" type="bottom">
+
+		<view class="popups-box">
+			<view class="popups-title">
+				持仓止盈止损修改
+				<text class="close-icon iconfont">&#xeca0;</text>
+			</view>
+			<view class="popups-content">
+				<view class="content-item">
+					<text class="content-lable">合约名称</text>
+					<view class="content-val">
+						<text class="val-name">{{ content.symbol }}</text>
+						<text class="val-lever">{{ content.multiple }}倍杠杆</text>
+						<text class="val-tag">逐仓做多</text>
+					</view>
+				</view>
+				<view class="content-item">
+					<text class="content-lable">开仓价格(USDT)</text>
+					<view class="content-val">
+						{{ content.price }}
+					</view>
+				</view>
+				<view class="content-item">
+					<text class="content-lable">标记价格(USDT)</text>
+					<view class="content-val">
+						{{ content.origin_price }}
+					</view>
+				</view>
+				<view class="content-restrict">
+					<view class="restrict-item">
+						<text class="restrict-lable">止盈</text>
+						<view class="restrict-btn">
+							<text class="iconfont">&#xe672;</text>
+							<text>按比例设置</text>
+						</view>
+					</view>
+					<view class="restrict-input-box">
+						<input class="restrict-input" v-model="target_profit_price" type="number"
+							placeholder-class="placeholder-class" placeholder="请输入触发价">
+						<text class="restrict-tag">USDT</text>
+						<text class="restrict-btn" @click.stop="target_profit_price = ''">清空</text>
+					</view>
+					<view class="restrict-input-box input-type">
+						<text class="restrict-input">市价</text>
+						<text class="restrict-tag">USDT</text>
+						<text class="restrict-btn">市价</text>
+					</view>
+					<view class="restrict-hint">
+						<text class="iconfont">&#xe8ec;</text>
+						<text>市价单的成交价格可能偏离用户下单时看到的成交价格</text>
+					</view>
+					<view class="restrict-hint2">
+						<text>当标价价格触达{{ target_profit_price || '--'}}时，将会触发市价委托平仓</text>
+						<text>预计盈亏--</text>
+					</view>
+					<view class="restrict-item">
+						<text class="restrict-lable">止损</text>
+						<view class="restrict-btn">
+							<text class="iconfont">&#xe672;</text>
+							<text>按比例设置</text>
+						</view>
+					</view>
+					<view class="restrict-input-box">
+						<input class="restrict-input" v-model="stop_loss_price" type="number"
+							placeholder-class="placeholder-class" placeholder="请输入触发价">
+						<text class="restrict-tag">USDT</text>
+						<text class="restrict-btn" @click.stop="stop_loss_price = ''">清空</text>
+					</view>
+					<view class="restrict-input-box input-type">
+						<text class="restrict-input">市价</text>
+						<text class="restrict-tag">USDT</text>
+						<text class="restrict-btn">市价</text>
+					</view>
+					<view class="restrict-hint">
+						<text class="iconfont">&#xe8ec;</text>
+						<text>市价单的成交价格可能偏离用户下单时看到的成交价格</text>
+					</view>
+					<view class="restrict-hint2">
+						<text>当标价价格触达{{ stop_loss_price || '--'}}时，将会触发市价委托平仓</text>
+						<text>预计盈亏--</text>
+					</view>
+					<view class="content-btns">
+						<view class="content-btn cancel-btn" @click.stop="close()">
+							取消
+						</view>
+						<view class="content-btn" @click.stop="setLeverStop()">
+							确定
+						</view>
+					</view>
+				</view>
+			</view>
+		</view>
+	</uni-popup>
+</template>
+
+<script>
+	import { Api_setLeverStop } from "@/api/index.js"
+	export default {
+		name: "unopen",
+	 
+	 
+		data() {
+			return {
+				content: {},
+				target_profit_price: '',
+				stop_loss_price: ''
+			};
+		},
+		mounted() {
+			// this.open()
+		},
+		methods: {
+			open(item) {
+				this.content = item
+				this.$nextTick(() => {
+					this.$refs.popupRef.open();
+				})
+			},
+			close() {
+				this.$refs.popupRef.close()
+			},
+			// confirm() {
+			// 	this.close();
+			// 	this.$emit('confirm')
+			// },
+			// 
+			setLeverStop(){
+				Api_setLeverStop({
+					id:this.content.id,
+					target_profit_price: this.target_profit_price,
+					stop_loss_price: this.stop_loss_price
+				}).then(res => {
+					this.close();
+					this.$emit('setSuccess')
+				})
+			}
+
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.popups-box {
+		width: 100%;
+
+		.popups-title {
+			text-align: center;
+			width: 100%;
+			height: 100rpx;
+			line-height: 100rpx;
+			background-color: $box-bg;
+			position: relative;
+			font-size: 30rpx;
+			font-weight: bold;
+			border-radius: 40rpx 40rpx 0 0;
+
+			.close-icon {
+				position: absolute;
+				right: 30rpx;
+				top: 50%;
+				transform: translateY(-50%);
+			}
+		}
+
+	}
+
+	.popups-content {
+		width: 100%;
+		background-color: #fff;
+
+		.content-item {
+			width: 100%;
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			padding: 20rpx $pages-padding;
+			font-size: 22rpx;
+
+			.content-lable {
+				color: $SizeColor;
+			}
+
+			.content-val {
+				color: #000;
+				font-weight: bold;
+
+				// <text class="val-name">LTC/USDT</text>
+				// <text class="val-lever">100倍杠杆</text>
+				// <text class="val-tag">逐仓做多</text>
+				.val-name {}
+
+				.val-tag,
+				.val-lever {
+					padding: 5rpx 4rpx;
+					color: #fff;
+					font-size: 20rpx;
+					border-radius: 4rpx;
+					margin-left: 6rpx;
+				}
+
+				.val-lever {
+
+					background-color: $Theme-Color;
+				}
+
+				.val-tag {
+
+					background-color: $Theme-Color1;
+				}
+			}
+
+			&:last-child {
+				border-bottom: 10rpx solid $border-color;
+			}
+		}
+
+		.content-restrict {
+			width: 100%;
+			padding: 0 $pages-padding;
+
+			.restrict-item {
+				width: 100%;
+				padding-top: 30rpx;
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+				font-size: 26rpx;
+				font-weight: bold;
+
+				.restrict-btn {
+					.iconfont {
+						font-size: 28rpx;
+						color: $Theme-Color;
+						margin-right: 10rpx;
+					}
+				}
+			}
+
+			.restrict-input-box {
+				margin-top: 20rpx;
+				width: 100%;
+				display: flex;
+				align-items: center;
+				font-size: 26rpx;
+				height: 80rpx;
+				border: 1rpx solid $border-color;
+				border-radius: 10rpx;
+				padding-right: 20rpx;
+
+				text {
+					flex-shrink: 0;
+				}
+
+				.restrict-input {
+					flex: 1;
+					height: 100%;
+					border: none;
+					padding: 0 20rpx;
+				}
+
+				.placeholder-class {
+					font-size: 26rpx;
+					font-weight: bold;
+				}
+
+				.restrict-tag {
+					color: $SizeColor2;
+				}
+
+				.restrict-btn {
+					color: $Theme-Color;
+					padding-left: 20rpx;
+				}
+			}
+
+			.input-type {
+				background-color: $box-bg;
+
+				.restrict-input {
+					flex: 1;
+					height: auto;
+					padding: 0 20rpx;
+					color: #000;
+					font-weight: bold;
+
+				}
+
+				.restrict-btn {
+					line-height: 1;
+					border-left: 1px solid $Theme-Color;
+					margin-left: 10rpx;
+					padding-left: 10rpx;
+				}
+			}
+
+			// <view class="restrict-hint">
+			// 	<text class="iconfont">&#xe8ec;</text>
+			// 	<text>市价单的成交价格可能偏离用户下单时看到的成交价格</text>
+			// </view>
+			// <view class="restrict-hint2">
+			// 	<text>当标价价格触达{{ target_profit_price || '--'}}时，将会触发市价委托平仓</text>
+			// 	<text>预计盈亏--</text>
+			// </view>
+			.restrict-hint {
+				width: 100%;
+				display: flex;
+				align-items: center;
+				padding-top: 10rpx;
+
+				text {
+					font-size: 22rpx;
+				}
+
+				.iconfont {
+					font-size: 26rpx;
+					margin-right: 6rpx;
+					color: #000;
+				}
+			}
+
+			.restrict-hint2 {
+				width: 100%;
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+				font-size: 20rpx;
+				color: $SizeColor;
+				padding-top: 10rpx;
+			}
+		}
+	}
+
+	.content-btns {
+		width: 100%;
+		display: flex;
+		justify-content: space-between;
+		align-items: stretch;
+		padding-top: 60rpx;
+
+		.content-btn {
+			flex: 1;
+			height: 80rpx;
+			line-height: 80rpx;
+			background-color: $Theme-Color;
+			margin-bottom: 40rpx;
+			color: #fff;
+			text-align: center;
+			font-size: 30rpx;
+			letter-spacing: 1px;
+			border-radius: 6rpx;
+		}
+
+		.cancel-btn {
+			margin-right: 20rpx;
+			border: 1rpx solid $Theme-Color;
+			background-color: #fff;
+			color: $Theme-Color;
+		}
+	}
+</style>

pages/contract/sustainability/freight-space.vue

@@ -0,0 +1,318 @@
+<template>
+	<view class="">
+		<template v-if="leverTransaction && leverTransaction.length > 0">
+			<view class="lable-title">
+				<text class="lable-title-text">仓位信息</text>
+				<text class="lable-title-btn" @click.stop="setCloseLeverAll()">全部平仓</text>
+			</view>
+			<template v-for="item in leverTransaction">
+				<view :rise-fall="stocksColor">
+					<view class="content-top">
+						<view class="top-left">
+							<view class="top-left-title">
+								<text>{{ item.symbol }}</text>
+								<text>{{ item.type_name }}</text>
+								<text class="icon-size iconfont">&#xe8b0;</text>
+								<text class="icon-size">分享</text>
+							</view>
+							<view class="top-left-b">
+								<text>{{ item.multiple }}倍杠杆</text>
+								<text class="top-left-b-tag">逐仓做多</text>
+							</view>
+						</view>
+
+						<view class="top-right">
+							<text>{{ item.profits }}</text>
+							<text class="top-right-float"><text>浮动盈亏</text>{{ item.fact_profits }}%</text>
+						</view>
+					</view>
+					<view class="content-info">
+						<view class="info-item">
+							<text class="info-item-lable">保证金(USDT)</text>
+							<text class="info-item-val">{{ item.caution_money }}</text>
+						</view>
+						<view class="info-item">
+							<text class="info-item-lable">开仓价格(USDT)</text>
+							<text class="info-item-val">{{ item.price }}</text>
+						</view>
+						<view class="info-item">
+							<text class="info-item-lable">标记价格(USDT)</text>
+							<text class="info-item-val">{{ item.origin_price }}</text>
+						</view>
+						<view class="info-item">
+							<text class="info-item-lable">持仓数量(张)</text>
+							<text class="info-item-val">{{ item.number }}</text>
+						</view>
+						<view class="info-item">
+							<text class="info-item-lable">风险率(%)</text>
+							<text class="info-item-val"></text>
+							<!-- {{ item.caution_money }} -->
+						</view>
+						<view class="info-item">
+							<text class="info-item-lable">预计强平价(USDT)</text>
+							<text class="info-item-val"></text>
+							<!-- {{ item.caution_money }} -->
+						</view>
+						<view class="info-item">
+							<text class="info-item-lable">预计止损(USDT)</text>
+							<text class="info-item-val"
+								@click.stop="setRestrict(item)">{{ item.stop_loss_price || '--' }} <text
+									class="iconfont">&#xe610;</text></text>
+						</view>
+						<view class="info-item">
+							<text class="info-item-lable">预计止盈(USDT)</text>
+							<text class="info-item-val"
+								@click.stop="setRestrict(item)">{{ item.target_profit_price || '--' }} <text
+									class="iconfont">&#xe610;</text> </text>
+						</view>
+						<view class="info-item">
+							<text class="info-item-lable">预计创建时间(USDT)</text>
+							<text class="info-item-val">{{ $getData_(item.create_time , false) }}</text>
+						</view>
+					</view>
+					<view class="content-btns">
+						<view class="content-btn-item" @click.stop="setCloseLever(item)">
+							平仓
+						</view>
+						<view class="content-btn-item">
+							反向开仓
+						</view>
+						<view class="content-btn-item">
+							加仓
+						</view>
+					</view>
+				</view>
+				<gap />
+			</template>
+		</template>
+		<template v-else>
+			暂无数据
+		</template>
+		<unopen ref="unopenRef" @confirm="confirm" textAlign="left" title="平仓" cancelBtn :content="closeLeverContent" />
+		<restrictPopup ref="restrictRef" @setSuccess="setSuccess" />
+	</view>
+</template>
+
+<script>
+	import {
+		Api_setCloseLever
+	} from "@/api/index.js"
+	import {
+		mapGetters
+	} from 'vuex'
+	import restrictPopup from "./../modules/restrict.vue"
+	export default {
+		name: 'freight-space',
+		props: {
+			closeLeverContent: {
+				type: String,
+				default: ''
+			},
+			leverTransaction: {
+				type: Array,
+				default: () => {
+					return []
+				}
+			}
+		},
+		components: {
+			restrictPopup
+		},
+		computed: {
+			...mapGetters([
+				"stocksColor"
+			])
+		},
+		data() {
+			return {
+				title: '平仓',
+				closeLeverItem: null,
+				restrict: ''
+			};
+		},
+		mounted() {
+
+		},
+		methods: {
+			setCloseLever(item) {
+				this.title = '平仓';
+				this.closeLeverItem = item;
+				this.$refs.unopenRef.open();
+			},
+			setCloseLeverAll() {
+				this.title = '全部平仓';
+				this.closeLeverItem = null;
+				this.$refs.unopenRef.open();
+			},
+			confirm() {
+				if (this.leverTransaction.length > 0) {
+					if (this.closeLeverItem) {
+						// 平仓
+						Api_setCloseLever({
+							id: this.closeLeverItem.id
+						}).then(res => {
+							this.$emit('closeLeverSuccess')
+						})
+					} else {
+						// 全部平仓
+					}
+
+				}
+
+			},
+			setRestrict(item) {
+				this.$nextTick(() => {
+					this.$refs.restrictRef.open(item)
+				})
+			},
+			setSuccess() {
+				this.$emit('closeLeverSuccess')
+			}
+		}
+
+	}
+</script>
+
+<style lang="scss" scoped>
+	// <view class="lable-title">
+	// 	<text class="lable-title-text">仓位信息</text>
+	// 	<text class="lable-title-btn">全部平仓</text>
+	// </view>
+	.lable-title {
+		width: 100%;
+		height: 80rpx;
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		border-bottom: 1rpx solid $border-color;
+		padding: 0 $pages-padding;
+		font-size: 24rpx;
+		color: #000;
+		font-weight: bold;
+
+		.lable-title-btn {
+			color: $Theme-Color;
+		}
+	}
+
+	.content-top {
+		padding: 30rpx $pages-padding;
+		display: flex;
+		justify-content: space-between;
+		align-items: stretch;
+		width: 100%;
+		border-bottom: 1rpx solid $border-color;
+
+		.top-left,
+		.top-right {
+			display: flex;
+			flex-direction: column;
+			justify-content: space-between;
+		}
+
+		.top-left-title {
+			font-size: 34rpx;
+			font-weight: bold;
+
+			.iconfont {
+				margin: 0 10rpx 0 20rpx;
+			}
+
+			.icon-size {
+				font-size: 24rpx;
+				color: $Theme-Color;
+			}
+		}
+
+		.top-left-b {
+			font-size: 24rpx;
+		}
+
+		.top-left-b-tag {
+			padding: 4rpx 6rpx;
+			border-radius: 3rpx;
+			background-color: $Theme-Color;
+			color: #fff;
+			margin-left: 20rpx;
+		}
+
+		.top-right {
+			flex-shrink: 0;
+			text-align: right;
+			color: $Theme-Color;
+			font-size: 28rpx;
+			font-weight: bold;
+
+			.top-right-float {
+				padding-top: 20rpx;
+				font-weight: normal;
+				font-size: 22rpx;
+
+				text {
+					border-bottom: 1rpx dashed $Theme-Color;
+				}
+			}
+		}
+	}
+
+	.content-info {
+		padding: 0 $pages-padding;
+		width: 100%;
+		display: flex;
+		flex-wrap: wrap;
+		align-items: stretch;
+
+		.info-item {
+			width: 30%;
+			display: flex;
+			flex-direction: column;
+
+			font-size: 24rpx;
+
+			&:nth-child(3n) {
+				width: 40%;
+				text-align: right;
+			}
+
+			.info-item-lable {
+				padding: 30rpx 0 20rpx;
+				color: $SizeColor;
+			}
+
+			.info-item-val {
+				color: #000;
+
+				.iconfont {
+					font-size: 24rpx;
+					color: $Theme-Color;
+					margin-left: 20rpx;
+				}
+			}
+		}
+	}
+
+	.content-btns {
+		width: 100%;
+
+		padding: 40rpx $pages-padding 30rpx;
+		width: 100%;
+		display: flex;
+		justify-content: space-between;
+
+		.content-btn-item {
+			width: calc((100% - 40rpx) / 3);
+			height: 70rpx;
+			line-height: 70rpx;
+			background-color: $Theme-Color;
+			text-align: center;
+			color: #fff;
+			border-radius: 6rpx;
+			font-size: 28rpx;
+
+			&:nth-child(n + 2) {
+				background-color: $Theme-Color04;
+				color: $Theme-Color;
+			}
+		}
+	}
+</style>

pages/contract/sustainability/index.vue

@@ -1,5 +1,5 @@
 <template>
-	<view class="contract-box">
+	<view class="contract-box" :rise-fall="stocksColor">
 		<view class="contract-title">
 			<view class="contract-item" @click.stop="openDrawer">
 				<view class="title-iocn">
@@ -73,11 +73,11 @@
 				</view>
 
 				<view class="nums-list">
-					<view class="nums-item" v-for="item in 7">
-						<text class="nums-item-bg"></text>
+					<view class="nums-item die" v-for="(item , indx) in bids" v-if="indx < 7">
+						<text class="nums-item-bg bgcolor01" :style="{'width': item[2] + '%' }"></text>
 						<view class="item-num">
-							<text>28516.8</text>
-							<text>28516.8</text>
+							<text class="color">{{ item[1] }}</text>
+							<text>{{ item[0] }}</text>
 						</view>
 					</view>
 				</view>
@@ -92,11 +92,11 @@
 				</view>
 
 				<view class="nums-list" style="padding-top: 6.5rpx;">
-					<view class="nums-item" v-for="item in 7">
-						<text class="nums-item-bg"></text>
+					<view class="nums-item zhang" v-for="(item , indx) in asks" v-if="indx < 7">
+						<text class="nums-item-bg bgcolor01" :style="{'width': item[2] + '%' }"></text>
 						<view class="item-num">
-							<text>28516.8</text>
-							<text>28516.8</text>
+							<text class="color">{{ item[1] }}</text>
+							<text>{{ item[0] }}</text>
 						</view>
 					</view>
 				</view>
@@ -133,7 +133,7 @@
 				</view>
 
 				<view class="step-content">
-					<step :width="365"/>
+					<step :width="365" />
 				</view>
 
 				<view class="set-node">
@@ -158,7 +158,7 @@
 						<text class="info-btn-lable">可做多</text>
 						<text class="info-btn-val">33719张</text>
 					</view>
-					<view class="info-btn">
+					<view class="info-btn" @click.stop="setSubmitLever()">
 						买入/做多
 					</view>
 				</view>
@@ -171,25 +171,51 @@
 						卖出/做空
 					</view>
 				</view>
-
 			</view>
 		</view>
+		<gap height="10rpx" />
+		<view class="lable-title">
+			<view class="lable-text">
+				<text :class="['lable-text-item' , freightSpaceIndex == 1 ? 'active-text-item' : '' ]">持仓⟮ {{lever_transaction.length}} ⟯</text>
+				<text :class="['lable-text-item' , freightSpaceIndex == 2 ? 'active-text-item' : '' ]">当前委托{1}</text>
+			</view>
+			<view class="iconfont">&#xe613;</view>
+		</view>
+
+
+		<template v-if="freightSpaceIndex === 1">
+			<freightSpace :leverTransaction="lever_transaction" @closeLeverSuccess="closeLeverSuccess"
+				:closeLeverContent="closeLeverContent" />
+		</template>
+		<template v-if="freightSpaceIndex === 2">
+			<freightSpace :leverTransaction="lever_transaction" @closeLeverSuccess="closeLeverSuccess"
+				:closeLeverContent="closeLeverContent" />
+		</template>
 
 		<!-- 侧边抽屉 -->
 		<drawer ref="drawerRef" />
-		
+
 		<!-- 调整杠杆 -->
-		<lever ref="leverRef" :lever-num.sync="leverNum" :leverName.sync="leverName"/>
+		<lever ref="leverRef" :lever-num.sync="leverNum" :leverName.sync="leverName" />
 	</view>
 </template>
 
 <script>
 	import drawer from "./../modules/drawer.vue"
 	import lever from "./lever.vue"
+	import freightSpace from "./freight-space.vue"
+	import {
+		Api_setSubmitLever,
+		Api_getLeverDeal
+	} from "@/api/index.js"
+	import {
+		mapGetters
+	} from 'vuex'
 	export default {
 		components: {
 			drawer,
-			lever
+			lever,
+			freightSpace
 		},
 		data() {
 			return {
@@ -208,23 +234,71 @@
 						text: '计划委托'
 					},
 				],
-				
-				leverName:'全仓',
-				leverNum:'100X',
+
+				leverName: '全仓',
+				leverNum: '100X',
+
+				closeLeverContent: '如果存在平仓挂单(限价止盈止损)，将会在全平前被撤单,确定全部平仓吗？',
+				freightSpaceIndex: 1,
+				// 当前持仓
+				lever_transaction: []
 			};
 		},
+
+		computed: {
+			...mapGetters([
+				"stocksColor",
+				'bids',
+				'asks'
+			])
+		},
+		created() {
+			this.getLeverDeal();
+			// this.$store.dispatch("websocket/openSocket", {
+			// 	type: 'market_depth'
+			// })
+			// this.$store.dispatch("websocket/openSocket", {
+			// 	type: 'market_depth'
+			// })
+		},
 		methods: {
+			// 平仓成功
+			closeLeverSuccess() {
+				this.getLeverDeal()
+			},
 			openDrawer() {
 				this.$refs.drawerRef.open();
 			},
 			change(e) {
 				console.log("e:", e);
 			},
-			adjustLever(){
+			adjustLever() {
 				this.$nextTick(() => {
 					this.$refs.leverRef.open()
 				})
 			},
+			getLeverDeal() {
+				Api_getLeverDeal({
+					legal_id: 3,
+					currency_id: 1
+				}).then(res => {
+					this.lever_transaction = res.lever_transaction?.in || []
+				})
+			},
+			// Api_setSubmitLever
+			setSubmitLever() {
+				const setData = {
+					legal_id: 3,
+					currency_id: 1,
+					multiple: 100,
+					share: 100,
+					type: 1
+				}
+				Api_setSubmitLever(setData).then(res => {
+					this.getLeverDeal()
+				})
+			}
+
 		},
 	}
 </script>
@@ -430,9 +504,7 @@
 						top: 0;
 						right: 0;
 						z-index: 1;
-						width: 50%;
 						height: 100%;
-						background-color: #FEEBED;
 					}
 
 					.item-num {
@@ -448,13 +520,12 @@
 						font-size: 22rpx;
 						font-family: PingFang SC, PingFang SC-Bold;
 						font-weight: 700;
-						color: #ea5162;
 						line-height: 33rpx;
+						color: #1a1a1a;
 
 						text+text {
 
 							font-weight: 700;
-							color: #1a1a1a;
 							line-height: 33rpx;
 						}
 					}
@@ -693,9 +764,11 @@
 					.info-btn-lable {
 						color: #ccc;
 					}
-					.info-btn-val{
+
+					.info-btn-val {
 						font-weight: bold;
 					}
+
 					// <view class="info-btn-info">
 					// 	<text class="info-btn-lable">可做多</text>
 					// 	<text class="info-btn-val">33719张</text>
@@ -718,6 +791,7 @@
 					background-color: red;
 				}
 			}
+
 			// <view class="info-btns">
 			// 	<view class="info-btn-info">
 			// 		<text class="info-btn-lable">可做多</text>
@@ -735,8 +809,57 @@
 
 		}
 	}
-			.switch-icon{
+
+	.switch-icon {
+		color: $Theme-Color;
+		font-size: 26rpx;
+	}
+
+	// <view class="lable-title">
+	// 	<view class="lable-text">
+	// 		<text class="lable-text-item">持仓{1}</text>
+	// 		<text class="lable-text-item">当前委托{1}</text>
+	// 	</view>
+	// 	<view class="iconfont">&#xe613;</view>
+	// </view>
+	.lable-title {
+		width: 100%;
+		height: 100rpx;
+		border-bottom: 1rpx solid $border-color;
+		padding: 0 $pages-padding;
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+
+		.lable-text {
+			height: 100%;
+			display: flex;
+			align-items: stretch;
+			.lable-text-item{
+				height: 100%;
+				display: flex;
+				align-items: center;
+				font-size: 28rpx;
+				&:first-child{
+					padding-right: 40rpx;
+				}
+			}
+			.active-text-item{
+				font-size: 36rpx;
 				color: $Theme-Color;
-				font-size: 26rpx;
+				position: relative;
+				&::before{
+					content: '';
+					position: absolute;
+					left: 50%;
+					bottom: 0;
+					width: 40rpx;
+					height: 6rpx;
+					background-color: $Theme-Color;
+					transform: translateX(-50%);
+					border-radius: 3rpx;
+				}
 			}
+		}
+	}
 </style>

pages/index/index.vue

@@ -7,8 +7,8 @@
 			</template>
 			<template #content>
 				<view class="haed-title">
-					<image src="../../static/images/logo.png" mode="aspectFit"></image>
-					<image src="../../static/images/name.png" mode="aspectFit"></image>
+					<image class="logo" src="../../static/images/logo.png" mode="aspectFit"></image>
+					<image class="name" src="../../static/images/name.png" mode="aspectFit"></image>
 				</view>
 			</template>
 			<template #right>
@@ -21,12 +21,10 @@
 
 		<!-- 滚动消息 -->
 		<rollMessage :rollMsg="Announcement"></rollMessage>
-
-		<view style="width: 100%;height: 1rpx;"></view>
+ 
 		<!-- usdt -->
 		<usdt :usdtList="usdtList"></usdt>
-
-		<view style="width: 100%;height: 8rpx;"></view>
+ 
 		<gap />
 		<!-- 快捷买币 -->
 		<shortcut></shortcut>
@@ -109,11 +107,9 @@
 		},
 		onHide() {
 			this.refreshStatus = false;
-			console.log('00000' , this.refreshStatus)
 		},
 		methods: {
 			openShare() {
-				console.log('00000')
 				this.$nextTick(() => {
 					this.$refs.sharePageRef.openShare()
 				})
@@ -151,7 +147,7 @@
 						if (this.refreshStatus) {
 							this.getQuotationNew()
 						}
-					}, 3000)
+					}, 1000)
 				})
 			},
 			clearInt() {
@@ -177,5 +173,13 @@
 			width: 85rpx;
 			height: 67rpx;
 		}
+		.logo{
+			width: 85rpx;
+			height: 67rpx;
+		}
+		.name{
+			width: 85rpx;
+			height: 80rpx;
+		}
 	}
 </style>

pages/index/modules/market.vue

@@ -105,7 +105,7 @@
 			}
 
 			.active-tab-item {
-				font-size: 30rpx;
+				font-size: 34rpx;
 				color: #20B482;
 				position: relative;
 

pages/index/modules/shortcut.vue

@@ -1,14 +1,15 @@
 <template>
 	<view class="shortcut-box" @click.stop="goShortcutBuy()">
-		<image class="shortcut-icon" src="../../../static/logo.png" mode=""></image>
+		<image class="shortcut-icon" src="@/static/images/icon_04.png" mode="aspectFit"></image>
 		<view class="shortcut-content">
 			<text class="shortcut-content-title">快捷买币</text>
 			<text class="shortcut-content-hint">支持一键快速购买USDT</text>
 		</view>
 		<view class="shortcut-more">
-			<view class="shortcut-more-icon iconfont">
+			<image class="shortcut-more-icon" src="@/static/images/icon_03.png" mode="aspectFit"></image>
+			<!-- <view class="shortcut-more-icon iconfont">
 				&#xe604;
-			</view>
+			</view> -->
 		</view>
 	</view>
 </template>
@@ -21,10 +22,10 @@
 
 			};
 		},
-		methods:{
-			goShortcutBuy(){
+		methods: {
+			goShortcutBuy() {
 				uni.navigateTo({
-					url:'/pages/content/shortcut-buy'
+					url: '/pages/content/shortcut-buy'
 				})
 			}
 		}
@@ -34,14 +35,13 @@
 <style lang="scss" scoped>
 	.shortcut-box {
 		width: 100%;
-		min-height: 120rpx;
 		background-color: $modules-box-bg;
 		padding: 14rpx 60rpx 14rpx $pages-padding ;
 		display: flex;
-		align-items: center;
+		align-items: stretch;
 
 		.shortcut-icon {
-			width: 63rpx;
+			width: 66rpx;
 			height: 83rpx;
 			flex-shrink: 0;
 		}
@@ -50,30 +50,37 @@
 			width: 81rpx;
 			height: 81rpx;
 			flex-shrink: 0;
-			background: linear-gradient(90deg, #ffffff 23%, #d4f1e5);
-			border-radius: 50%;
-			display: flex;
-			justify-content: center;
-			align-items: center;
+
 			.shortcut-more-icon {
-				width: 40rpx;
-				height: 40rpx;
-				border-radius: 50%;
-				background-color: $Theme-Color;
-				font-size: 26rpx;
-				line-height: 40rpx;
-				color: #ffffff;
-				transform: rotate(180deg);
-				text-align: right;
+
+				width: 81rpx;
+				height: 81rpx;
 			}
+
+			// background: linear-gradient(90deg, #ffffff 23%, #d4f1e5);
+			// border-radius: 50%;
+			// display: flex;
+			// justify-content: center;
+			// align-items: center;
+			// .shortcut-more-icon {
+			// 	width: 40rpx;
+			// 	height: 40rpx;
+			// 	border-radius: 50%;
+			// 	background-color: $Theme-Color;
+			// 	font-size: 26rpx;
+			// 	line-height: 40rpx;
+			// 	color: #ffffff;
+			// 	transform: rotate(180deg);
+			// 	text-align: right;
+			// }
 		}
 
 		.shortcut-content {
 			width: calc(100% - 63rpx - 81rpx);
-			padding-left: 35rpx;
+			padding:4rpx 0 4rpx 35rpx;
 			display: flex;
 			flex-direction: column;
-
+			justify-content: space-between;
 			.shortcut-content-title {
 
 				font-size: 30rpx;

pages/property/modules/card.scss

@@ -28,6 +28,7 @@
 				margin-left: 10rpx;
 			}
 			.title-icon{
+				margin-left: 4px;
 				font-size: 28rpx;
 				color: #ffffff;
 			}

pages/property/modules/card.vue

@@ -4,9 +4,9 @@
 			<view class="card-title">
 				<text class="title">资产估值(USDT)</text>
 				<text v-show="showMoney" @click.stop="showMoney = !showMoney"
-					class="title-icon iconfont">&#xe663;</text>
+					class="title-icon iconfont">&#xe661;</text>
 				<text v-show="!showMoney" @click.stop="showMoney = !showMoney"
-					class="title-icon iconfont">&#xe664;</text>
+					class="title-icon iconfont">&#xe6fa;</text>
 				<!-- <image class="icon" src="../../../static/logo.png" mode="aspectFit"></image> -->
 			</view>
 			<view class="card-num" v-show="showMoney">
@@ -16,8 +16,8 @@
 				*****
 			</view>
 			<view class="card-nums" v-show="showMoney">
-				<text class="nums-icon iconfont">&#xe623;</text>
-				<text class="nums-icon iconfont">&#xe615;</text>
+				<text class="nums-icon iconfont">≈</text>
+				<text class="nums-icon iconfont"></text>
 				<text>
 					<slot name="cardnums"></slot>
 				</text>

static/css/index.scss

@@ -1,5 +1,6 @@
 // @import url("./root.css");
- 
+$g_bgColor01:rgba(6,193,116,0.1);
+$r_bgColor01:rgba(255,0,0,0.1);
 [rise-fall='green_rise']{
 	// 绿涨红跌
 	.zhang{
@@ -10,6 +11,10 @@
 		.bgcolor{
 			background-color: #06c174 !important;
 		}
+		
+		.bgcolor01{
+			background-color: $g_bgColor01 !important;
+		}
 	}
 	.die{
 		// 红跌
@@ -17,7 +22,10 @@
 			color:red !important;
 		}
 		.bgcolor{
-			background-color: red !important;
+			background-color: rgba(255,0,0,1) !important;
+		}
+		.bgcolor01{
+			background-color: $r_bgColor01 !important;
 		}
 	}
 	
@@ -41,7 +49,10 @@
 			color:red !important;
 		}
 		.bgcolor{
-			background-color: red !important;
+			background-color: rgba(255,0,0,1) !important;
+		}
+		.bgcolor01{
+			background-color: $r_bgColor01 !important;
 		}
 	}
 	.die{
@@ -52,6 +63,10 @@
 		.bgcolor{
 			background-color: #06c174 !important;
 		}
+		
+		.bgcolor01{
+			background-color: $g_bgColor01 !important;
+		}
 	}
 }
  

static/fontsize/iconfont.css

@@ -1,8 +1,14 @@
-@font-face {
-  font-family: 'iconfont';  /* Project id 4023758 */
+/* @font-face {
+  font-family: 'iconfont';  
   src: url('https://at.alicdn.com/t/c/font_4023758_hahc6f973u7.woff2?t=1683194369295') format('woff2'),
        url('https://at.alicdn.com/t/c/font_4023758_hahc6f973u7.woff?t=1683194369295') format('woff'),
        url('https://at.alicdn.com/t/c/font_4023758_hahc6f973u7.ttf?t=1683194369295') format('truetype');
+} */
+@font-face {
+  font-family: 'iconfont';  /* Project id 3999574 */
+  src: url('https://at.alicdn.com/t/c/font_3999574_lwe8t38nbk.woff2?t=1683511176982') format('woff2'),
+       url('https://at.alicdn.com/t/c/font_3999574_lwe8t38nbk.woff?t=1683511176982') format('woff'),
+       url('https://at.alicdn.com/t/c/font_3999574_lwe8t38nbk.ttf?t=1683511176982') format('truetype');
 }
 .iconfont {
 	font-family: "iconfont" !important;

store/getters.js

@@ -13,5 +13,9 @@ const getters = {
 	legalAccount: state => state.possession.legalAccount,
 	GiftMoneyAccount: state => state.possession.GiftMoneyAccount,
 	
+	// websocket
+	bids: state => state.websocket.bids,
+	asks: state => state.websocket.asks,
+	
 }
 export default getters

store/index.js

@@ -2,6 +2,7 @@ import Vue from 'vue'
 import Vuex from 'vuex'
 import app from './modules/app.config.js'
 import possession from "./modules/possession.js"
+import websocket from "./modules/websocket.js"
 import getters from "./getters.js"
  
 
@@ -10,7 +11,8 @@ Vue.use(Vuex)
 const store = new Vuex.Store({
   modules: {
     app,
-	possession
+	possession,
+	websocket
     
   },
   getters

store/modules/websocket.js

@@ -0,0 +1,85 @@
+// import socket from "@/utils/websocket.js"
+let socket_api = 'https://doc.okenx.com:2000'
+
+const state = {
+	bids: [],
+	asks: []
+}
+
+const mutations = {
+	// SET_CONTRACT: (state, contract) => {
+	// 	// 合约账户
+	// 	state.contractAccount = contract;
+	// },
+	// SET_BIBI: (state, bibi) => {
+	// 	// 币币账户
+	// 	state.bibiAccount = bibi;
+	// },
+	// SET_LEGAL: (state, legal) => {
+	// 	// 法币账户
+	// 	state.legalAccount = legal;
+	// },
+	// SET_GIFTMONEY: (state, GiftMoney) => {
+	// 	// 赠金账户
+	// 	state.GiftMoneyAccount = GiftMoney;
+	// },
+	// SET_STOCKS_COLOR: (state, code) => {
+	// 	state.stocksColor = code
+	// },
+	// SET_TOKEN: (state, token) => {
+	// 	setToken(token)
+	// 	state.token = token
+	// }
+
+}
+
+const nums = (arr) => {
+	const att = arr.map(el => {
+		return el[0]
+	})
+	const num = Math.max.apply(null, att)
+
+	arr.forEach(el => {
+		let n = Math.round(el[0] / num * 10000) / 100
+		el[2] = n > 100 ? 100 : n;
+	})
+	return arr
+}
+
+const actions = {
+
+	openSocket({
+		commit,
+		state
+	}, data) {
+
+		// var sk = socket(socket_api);
+		// sk.on(data.type, function(msg) {
+		// 	if (msg.type == 'market_depth') {
+		// 		if (3 == msg.legal_id && 1 == msg.currency_id) {
+		// 			//btc 匹配
+		// 			// var buyIn = JSON.parse(msg.bids);
+		// 			// var out = JSON.parse(msg.asks).reverse();
+		// 			var buyIn = msg.bids.slice(0, 7);
+
+		// 			state.bids = nums(buyIn);
+		// 			var out = msg.asks.slice(0, 7);
+		// 			// state.bids = msg.bids
+		// 			state.asks = nums(out);
+		// 		}
+		// 	}
+
+		// })
+	},
+
+}
+
+
+
+
+export default {
+	namespaced: true,
+	state,
+	mutations,
+	actions
+}

uni.scss

@@ -17,6 +17,8 @@ $page-bg:#F5F5F5;
 $box-bg: #f1f1f1;
 $modules-box-bg:#ffffff;
 $Theme-Color: #05C175;
+$Theme-Color1: #1fb578;
+$Theme-Color04: rgba(5 ,193 ,117, 0.4);
 $border-color: rgba(204, 204, 204, 0.2);
 $border-color6: rgba(204, 204, 204, 0.6);
 $border-color4: rgba(204, 204, 204, 0.4);
@@ -25,6 +27,7 @@ $headFixedZIndex:50;
 $headTitleHeight: 100rpx;
 $SizeColor:  rgba(132,132,132,0.9);
 $SizeColor1:  rgba(203,203,203,0.9);
+$SizeColor2:  #a6a5a5;
 $btnBgColor:#dedcdc;
 /* 颜色变量 */
 

utils/common.js

@@ -147,14 +147,18 @@ const doubleDigit = (t) => {
 	return t
 
 }
-export const getData_ = (time = '') => {
-	const now = new Date()
-	const year = now.getFullYear();
-	const month = doubleDigit(now.getMonth() + 1);
-	const day = doubleDigit(now.getDate());
-	const hour = doubleDigit(now.getHours());
-	const min = doubleDigit(now.getMinutes());
-	const seon = doubleDigit(now.getSeconds());
-	return `${year}-${month}-${day} ${hour}:${min}:${seon}`
+export const getData_ = (time = '', type = true) => {
+	if (time || type) {
+		let now = new Date(1683512723)
+		console.log('now = ' , now , time)
+		const year = now.getFullYear();
+		const month = doubleDigit(now.getMonth() + 1);
+		const day = doubleDigit(now.getDate());
+		const hour = doubleDigit(now.getHours());
+		const min = doubleDigit(now.getMinutes());
+		const seon = doubleDigit(now.getSeconds());
+		return `${year}-${month}-${day} ${hour}:${min}:${seon}`
+	}
+	return ''
 
 }

utils/config.js

@@ -2,7 +2,7 @@
 	 let baseUrl = 'https://doc.okenx.com'
  
  	// #ifdef H5
- 	baseUrl = '/Apis';
+ 	baseUrl = 'Apis';
  	// #endif
  	// #ifdef APP-PLUS
  	baseUrl = 'https://doc.okenx.com';

utils/initialize.js

@@ -16,7 +16,7 @@ export default {
 		Vue.prototype.$getStorageSync = getStorageSync;  
 		Vue.prototype.$getData_ = getData_;  
 
-		Vue.prototype.$setColor = setColor; // 计算精度
+		Vue.prototype.$setColor = setColor;  
 		// Vue.component('share', share)
 		// Vue.component('reverseBack', reverseBack)
 

utils/websock - 副本.js

@@ -0,0 +1,121 @@
+import s from "./s.js"
+
+import config from "./config.js"
+import {
+	axios
+} from '@/utils/request.js'
+let websock = ''; //webSocket使用
+let isConnect = false; //webSocket连接标识 避免重复连接
+let reConnectNum = 1; //断开后重新连接的次数 免得后台挂了,前端一直重连
+const conceal = () => {
+	websockList.value = [];
+};
+
+const websocketonopen = () => {
+	// console.log("WebSocket连接成功");
+	//连接建立后修改标识
+	isConnect = true;
+};
+const websocketonerror = () => {
+	console.log("WebSocket连接发生错误");
+	//连接断开后修改标识
+	isConnect = false;
+	//连接错误 需要重连
+	reConnect();
+};
+const websocketonmessage = (e) => {
+	if (e != null) {
+		// console.log('websocketclose', e)
+		let str = JSON.parse(e.data);
+		// category :  "SYS"
+		// content :  "您有一个通知公告，请查阅！"
+		// createTime :  1670322927873
+		// createUser :  "1543837863788879871"
+		// deleteFlag :  "NOT_DELETE"
+		// id :  "1600076448078106626"
+		// msgType : 1
+		// subject :  "您有一个通知公告，请查阅！"
+		websockList.value = JSON.parse(JSON.stringify(str));
+	}
+};
+
+// webSocket连接关闭
+const websocketclose = () => {
+	//   console.log("webSocket连接关闭");
+	isConnect = false;
+	websock = "";
+	reConnect();
+};
+
+// 尝试重新连接
+const reConnect = () => {
+	// if (reConnectNum > 6) {
+	//   //   console.log("重连超过6次不再重连");
+	//   return false;
+	// }
+	// //   console.log("isConnect", isConnect, $store.getters.userId);
+	// //如果已经连上就不再重试了
+	// if (isConnect && !$store.getters.userId) return;
+	// initWebSocket($store.getters.userId);
+	// reConnectNum = reConnectNum + 1;
+};
+const initWebSocket = (userId) => {
+	console.log('getBaseUrl = ', config.getBaseUrl)
+	// console.log("进入initWebSocket");
+	// console.log("系统用户ID:" + userId);
+	// if (userId != null && userId != "") {
+	//   // WebSocket与普通的请求所用协议有所不同，ws等同于http，wss等同于https
+	console.log('a ', )
+	const t = new Date().getTime()
+	//   const env = import.meta.env.VITE_API_BASEURL.split("://");
+	let wsServer = `https://doc.okenx.com:2000/socket.io/?EIO=3&transport=polling&t=1683534247683-4&sid=8b70ac692c16d9410137bc75`;
+	//   // console.info("location.protocol", wsServer);
+
+	//   //线上环境
+	//   //webSocket 前面加一个前缀xxx_websocket_ 区分后面其他项目的webSocket
+	//   // let wsServer = "wss://域名地址或ip加端口/ nginx配置的  xxx_websocket/" + userId;
+
+	websock = new WebSocket(wsServer);
+	websock.onopen = websocketonopen;
+	websock.onerror = websocketonerror;
+	websock.onmessage = websocketonmessage;
+	websock.onclose = websocketclose;
+	// }
+};
+
+export const startWebSocket = (data) => {
+	// initWebSocket();
+	var socket_api = 'https://doc.okenx.com:2000'
+	var socket = s(socket_api);
+	socket.on('market_depth', function(msg) {
+				console.log('msg = ', msg)
+		if (msg.type == 'market_depth') {
+			if (3 == msg.legal_id && 1 == msg.currency_id) {
+				//btc 匹配
+				// var buyIn = JSON.parse(msg.bids);
+				// var out = JSON.parse(msg.asks).reverse();
+				var buyIn = msg.bids;
+				var out = msg.asks;
+			}
+		}
+
+	})
+
+	setTimeout(() => {
+		// 关闭
+		console.log('关闭 = ')
+		socket.close()
+	}, 3000)
+}
+
+
+export const startAjaxSocket = () => {
+	// https://doc.okenx.com
+	// https://doc.okenx.com
+	const t = new Date().getTime()
+	axios.post(`:2000`, {
+		t: t
+	}).then(res => {
+
+	})
+}

utils/websock.js

@@ -1,79 +1,121 @@
+import s from "./s.js"
 
-let websock = $ref(""); //webSocket使用
-let isConnect = $ref(false); //webSocket连接标识 避免重复连接
-let reConnectNum = $ref(1); //断开后重新连接的次数 免得后台挂了,前端一直重连
+import config from "./config.js"
+import {
+	axios
+} from '@/utils/request.js'
+let websock = ''; //webSocket使用
+let isConnect = false; //webSocket连接标识 避免重复连接
+let reConnectNum = 1; //断开后重新连接的次数 免得后台挂了,前端一直重连
 const conceal = () => {
-  websockList.value = [];
+	websockList.value = [];
 };
 
 const websocketonopen = () => {
-  // console.log("WebSocket连接成功");
-  //连接建立后修改标识
-  isConnect = true;
+	// console.log("WebSocket连接成功");
+	//连接建立后修改标识
+	isConnect = true;
 };
 const websocketonerror = () => {
-  console.log("WebSocket连接发生错误");
-  //连接断开后修改标识
-  isConnect = false;
-  //连接错误 需要重连
-  reConnect();
+	console.log("WebSocket连接发生错误");
+	//连接断开后修改标识
+	isConnect = false;
+	//连接错误 需要重连
+	reConnect();
 };
 const websocketonmessage = (e) => {
-  if (e != null) {
-    // console.log('websocketclose', e)
-    let str = JSON.parse(e.data);
-    // category :  "SYS"
-    // content :  "您有一个通知公告，请查阅！"
-    // createTime :  1670322927873
-    // createUser :  "1543837863788879871"
-    // deleteFlag :  "NOT_DELETE"
-    // id :  "1600076448078106626"
-    // msgType : 1
-    // subject :  "您有一个通知公告，请查阅！"
-    websockList.value = JSON.parse(JSON.stringify(str));
-  }
+	if (e != null) {
+		// console.log('websocketclose', e)
+		let str = JSON.parse(e.data);
+		// category :  "SYS"
+		// content :  "您有一个通知公告，请查阅！"
+		// createTime :  1670322927873
+		// createUser :  "1543837863788879871"
+		// deleteFlag :  "NOT_DELETE"
+		// id :  "1600076448078106626"
+		// msgType : 1
+		// subject :  "您有一个通知公告，请查阅！"
+		websockList.value = JSON.parse(JSON.stringify(str));
+	}
 };
 
 // webSocket连接关闭
 const websocketclose = () => {
-  //   console.log("webSocket连接关闭");
-  isConnect = false;
-  websock = "";
-  reConnect();
+	//   console.log("webSocket连接关闭");
+	isConnect = false;
+	websock = "";
+	reConnect();
 };
 
 // 尝试重新连接
 const reConnect = () => {
-  if (reConnectNum > 6) {
-    //   console.log("重连超过6次不再重连");
-    return false;
-  }
-  //   console.log("isConnect", isConnect, $store.getters.userId);
-  //如果已经连上就不再重试了
-  if (isConnect && !$store.getters.userId) return;
-  initWebSocket($store.getters.userId);
-  reConnectNum = reConnectNum + 1;
+	// if (reConnectNum > 6) {
+	//   //   console.log("重连超过6次不再重连");
+	//   return false;
+	// }
+	// //   console.log("isConnect", isConnect, $store.getters.userId);
+	// //如果已经连上就不再重试了
+	// if (isConnect && !$store.getters.userId) return;
+	// initWebSocket($store.getters.userId);
+	// reConnectNum = reConnectNum + 1;
 };
 const initWebSocket = (userId) => {
-  // console.log("进入initWebSocket");
-  // console.log("系统用户ID:" + userId);
-  if (userId != null && userId != "") {
-    // WebSocket与普通的请求所用协议有所不同，ws等同于http，wss等同于https
+	console.log('getBaseUrl = ', config.getBaseUrl)
+	// console.log("进入initWebSocket");
+	// console.log("系统用户ID:" + userId);
+	// if (userId != null && userId != "") {
+	//   // WebSocket与普通的请求所用协议有所不同，ws等同于http，wss等同于https
+	console.log('a ', )
+	const t = new Date().getTime()
+	//   const env = import.meta.env.VITE_API_BASEURL.split("://");
+	//   // console.info("location.protocol", wsServer);
 
-    const env = import.meta.env.VITE_API_BASEURL.split("://");
-    let wsServer = `${env[0] === "https" ? "wss" : "ws"}://${
-      env[1]
-    }/socket/message/${userId}`;
-    // console.info("location.protocol", wsServer);
+	//   //线上环境
+	//   //webSocket 前面加一个前缀xxx_websocket_ 区分后面其他项目的webSocket
+	//   // let wsServer = "wss://域名地址或ip加端口/ nginx配置的  xxx_websocket/" + userId;
 
-    //线上环境
-    //webSocket 前面加一个前缀xxx_websocket_ 区分后面其他项目的webSocket
-    // let wsServer = "wss://域名地址或ip加端口/ nginx配置的  xxx_websocket/" + userId;
+	let wsServer = `wss://doc.okenx.com:2000/socket.io/?EIO=3&transport=websocket&sid=d5ce250e2d16d9410233d8a4`;
+	websock = new WebSocket(wsServer);
+	websock.onopen = websocketonopen;
+	websock.onerror = websocketonerror;
+	websock.onmessage = websocketonmessage;
+	websock.onclose = websocketclose;
+	// }
+};
+
+export const startWebSocket = (data) => {
+	initWebSocket();
+	// var socket_api = 'https://doc.okenx.com:2000'
+	// var socket = s(socket_api);
+	// socket.on('market_depth', function(msg) {
+	// 			console.log('msg = ', msg)
+	// 	if (msg.type == 'market_depth') {
+	// 		if (3 == msg.legal_id && 1 == msg.currency_id) {
+	// 			//btc 匹配
+	// 			// var buyIn = JSON.parse(msg.bids);
+	// 			// var out = JSON.parse(msg.asks).reverse();
+	// 			var buyIn = msg.bids;
+	// 			var out = msg.asks;
+	// 		}
+	// 	}
+
+	// })
+
+	// setTimeout(() => {
+	// 	// 关闭
+	// 	console.log('关闭 = ')
+	// 	socket.close()
+	// }, 3000)
+}
+
+
+export const startAjaxSocket = () => {
+	// https://doc.okenx.com
+	// https://doc.okenx.com
+	const t = new Date().getTime()
+	axios.post(`:2000`, {
+		t: t
+	}).then(res => {
 
-    websock = new WebSocket(wsServer);
-    websock.onopen = websocketonopen;
-    websock.onerror = websocketonerror;
-    websock.onmessage = websocketonmessage;
-    websock.onclose = websocketclose;
-  }
-};
+	})
+}