From 79782073e2d89dfa12311dbde7855dfd3e0d0a93 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=98daijinzheng=40xingtongworld=2Ecom=E2=80=99?=
 <‘ceshi@qq.com’>
Date: Tue, 14 Nov 2023 12:07:07 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E5=90=88=E7=BA=A6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 assets/img/home/history.png             | Bin 0 -> 904 bytes
 main.js                                 |   6 +-
 pages/exchange/exchange-transaction.vue | 132 +++++++++----
 pages/exchange/open-position.vue        | 250 +++++++++++++++++++-----
 pages/exchange/sell-and-buy.vue         |  12 +-
 5 files changed, 307 insertions(+), 93 deletions(-)
 create mode 100644 assets/img/home/history.png

diff --git a/assets/img/home/history.png b/assets/img/home/history.png
new file mode 100644
index 0000000000000000000000000000000000000000..4ecdd0b20c3a744d0bcdf2940b53e5b1542a9226
GIT binary patch
literal 904
zcmV;319$w1P)<h;3K|Lk000e1NJLTq000yK000vR1^@s6kc=(000001b5ch_0Itp)
z=>Px#1ZP1_K>z@;j|==^1poj8GD$>1R5(v{RLv{AQ51gW9Yo}_d``_IA2XDd1vW-f
zVljpkyCEC?0ah%=LMh7D=Jy{^7D|dF5eo}Kiebq2N60tVea^U3<oDF=z3;i_Joh>0
zo_lTS>FNKJQcnDWw!vnzAt@;d@$vD9iHX7M>non0pYizkDC-1$4D|fKmX?+_rzhTT
zTNDn50~Hk&C@wCRIZ2<Mo^W(@gpG|2EG;eJ;^IOG&F1<$Z%;@_2<RUd4F+DX7kzzw
zXl!hR&H#IRdpJ2c!N<o3%FD}9S63&S9UmXdVC*+x2vn$pR7OUIN=;2wfj~fQZEdO9
z*;&=x+$?tO6CK&v*{ZX%Q!OtqtKHpQ)z;RgGBYzJR{PHVP)KEigM(OIT}3b$#QOTW
zDCU}FS<&>E^2*8z3JVKSQ&R&i0B2`sqR^5EjjXIJbaZq`YQw|B*x%n5I|=lr&}!lH
z`Q)GEEW^;ykQ`KddplxdW5qv8SXNdhJC2TyA{-8j8iE8o>4t^|8H7>FO(!NMP*qih
zoSYok?e+*E+1+k8?(Xieu&^LO3@{)8ojD8)>E`Ap9v&W0U0sd$_xA{4TwEM<VI>V3
z4UEd)Fk~Fp*VnkZx<Wxgf!KwR6E^PK+ncloLFdoUPf_LZc#xNu7j0<T`DHC>W3wkF
zCPr)wCJALHCnt+q<IKRy%1R6j4B-C$UJijag6oXqfsyR=^i=+Z@a5$Nhlhu9C`{cr
zQ&oR|KX!I@(A(Q9hs8C5S#exmUSecq1e24KlBM*a-ql5?+S*#V8H<aH62z9^Rhycc
zLMRjx0xC45{L+WF<>uywrjQWo1=sEEEpl^n(c0RI^Ye3TZ*NO5TZ3zyvlL9v@Aspt
zs|)q@_0n$iVaZ4s*-C?j9UmVTqMn`}G&MCz|B-~C8biubxLht7PN!2I4uc<8kA>%z
z%FoXi!jh5_q@<+CVVTopZJ8pkCrh)owk8`fbv;6VK3}XO?{!N{i;%P7$HvAmJv}XI
zy1Tojkqy{d-|O>#5}M-k%et19mdb-bWh7)P6%`fzD96mq3~M?6-xr&pBT1R2`RAOr
e-{6{MSqEQDv(y^9>Zs2E0000<MNUMnLSTZc{G}iO

literal 0
HcmV?d00001

diff --git a/main.js b/main.js
index a2c6788..55810f9 100644
--- a/main.js
+++ b/main.js
@@ -3,9 +3,9 @@ import App from './App.vue'
 import '@/plugins'
 import i18n from "./i18n";
 import store from './store'
-// import 'element-ui/lib/theme-chalk/index.css'
-// import element from './element/index'
-// Vue.use(element)
+import 'element-ui/lib/theme-chalk/index.css'
+import element from './element/index'
+Vue.use(element)
 //把vuex定义成全局组件
 Vue.prototype.$store = store
 Vue.prototype._i18n = i18n;
diff --git a/pages/exchange/exchange-transaction.vue b/pages/exchange/exchange-transaction.vue
index fae07aa..6d2b178 100644
--- a/pages/exchange/exchange-transaction.vue
+++ b/pages/exchange/exchange-transaction.vue
@@ -158,17 +158,26 @@
                 </view> -->
               </view>
               <view>
-               <view class="m-t-xs">
+               <view class="m-t-xs" style="margin-bottom: 25px;">
                   <!-- <view class="d-flex justify-between fn-sm">
                     <text>0%</text>
                     <text>100%</text>
                   </view> -->
-                  <view class="d-flex justify-between" style="margin-top: 20px;">
-                      <view class="borders w-23 rounded-3 fn-center p-y-xs fn-12" v-for="(item,index) in progress" @click="sliderChange(item,index)" :class="sliderActive==index?'color-theme-1 active':''">
+                  <!-- <view class="d-flex justify-between" style="margin-top: 20px;"> -->
+                      <!-- <view class="borders w-23 rounded-3 fn-center p-y-xs fn-12" v-for="(item,index) in progress" @click="sliderChange(item,index)" :class="sliderActive==index?'color-theme-1 active':''">
                           {{item}}%
-                      </view>
+                      </view> -->
+					   
                     <!-- <bing-progress activeColor="#60c08c" barBorderRadius="20px" handleWidth="12px" handleHeight="12px" handleColor="#60c08c"  borderRadius="20px" width="150px" :showInfo="false" strokeWidth="2px" noActiveColor="#484859" @dragging="sliderChange" :value="activeStep"/> -->
-                  </view>
+                  <!-- </view> -->
+				  <el-slider
+				        :value="activeStep"
+				        @input="sliderChange"
+				        :step="25"
+						:marks="marks"
+						:show-tooltip="false"
+				        show-stops>
+				      </el-slider>
                 </view>
 				<view class="" style="margin: 20px 0px;">
 					<v-input v-if="form.type == 1 && form.direction == 'sell'"
@@ -197,7 +206,7 @@
 				<view class="" style="margin-bottom: 20px;">
 					<view class="" style="font-size: 20rpx;line-height: 30px;display: flex;justify-content: space-between;">
 						<view>
-							可用  <text class="col-fff" style="margin-left: 5px;">{{ usable }}{{ usableUnit }}</text>
+							 {{ $t("common.c3") }}  <text class="col-fff" style="margin-left: 5px;">{{ usable }}{{ usableUnit }}</text>
 						</view>
 						<img :src="$localImgUrl('antOutline.png')" alt="" class="h-18" style="position: relative;top: 5px;" />
 					</view>
@@ -321,25 +330,34 @@
             </table>
           </view> -->
           <view class="m-t-xs" style="background-color: #121212;">
-              <view class="border-t-original d-flex justify-between align-center p-x-md p-t-lg" style="border-bottom: 1px solid #ccc;padding-bottom: 15px;">
-                  <!-- <text class="fn-16 fn-bold color-light">{{$t("exchange.a4")}}</text> -->
-                  <!-- <v-link tag="div" to="/pages/exchange/exchangeHis" class="d-flex align-center">
+              <view class="border-t-original d-flex justify-between align-center p-x-md p-t-lg">
+                  <text class="fn-16 fn-bold color-light">{{$t("exchange.a4")}}</text>
+                  <v-link tag="div" to="/pages/exchange/exchangeHis" class="d-flex align-center">
 										<van-icon name="orders-o" class="fn-14" style="font-size: 16px;"/>
 										<span class="fn-12 " style="font-size: 16px;">{{$t("purchase.a9")}}</span>
-									</v-link> -->
-					<view class="">
-						委托(0)
-					</view>
-					<view class="">
-						仓位(0)
-					</view>
-					<view class="">
-						资产
+									</v-link>
+					<!-- <view class="entrust_title">
+						<view class="">
+							委托(0)
+						</view>
+						<view class="">
+							仓位(0)
+						</view>
+						<view class="">
+							资产
+						</view>
+						<view class="">
+							策略(0)
+						</view>
 					</view>
 					<view class="">
-						策略(0)
-					</view>
+						<image src="@/assets/img/home/history.png" style="width: 40rpx;height: 40rpx;"></image>
+					</view> -->
               </view>
+			  <!-- <view class="" style="border-bottom: 1px solid #ccc;height: 20px;">
+			  	<view class="">当前交易品种</view>
+				<view class="">批量撤单</view>
+			  </view> -->
               <van-empty v-if="!Object.values(list).length" description="" />
               <view v-for="item in (list)" class="item border-b fn-14" :key="item.order_no">
                 <view class="p-x-md p-y-xs">
@@ -475,7 +493,14 @@ export default {
       sliderActive:-1,
       dtime: null,
       scrollTop:0,
-      refreshing:false
+      refreshing:false,
+	  marks:{
+		2: '0%',
+		25: '25%',
+		50: '50%',
+		75: '75%',
+		100: '100%',
+	  }
     };
   },
   computed: {
@@ -549,20 +574,29 @@ export default {
       return totalMoney;
     },
     // 显示百分比
-    activeStep() {
-      let num = 0;
-      if (this.form.direction == "buy") {
-        if (!this.targetBalance.usable_balance) return 0;
-        num = this.totalMoney / this.targetBalance.usable_balance;
-      } else if (this.form.direction == "sell") {
-        if (!this.currentBalance.usable_balance) return 0;
-        num = this.form.amount / this.currentBalance.usable_balance;
-      }
-      if (!isNaN(num)) {
-        num = num.toFixed(3);
-      }
-      return num*100
-    },
+    // activeStep() {
+    //   let num = 0;
+    //   if (this.form.direction == "buy") {
+    //     if (!this.targetBalance.usable_balance) return 0;
+    //     num = this.totalMoney / this.targetBalance.usable_balance;
+    //   } else if (this.form.direction == "sell") {
+    //     if (!this.currentBalance.usable_balance) return 0;
+    //     num = this.form.amount / this.currentBalance.usable_balance;
+    //   }
+    //   if (!isNaN(num)) {
+    //     num = num.toFixed(3);
+    //   }
+    //   return num*100
+    // },
+	// 所占百分比
+	activeStep() {
+	    return (this.form.amount / this.maxNum) * 100;
+	},
+	activeStep() {
+	    if (!this.form.amount || !this.maxNum) return 0;
+	    let num = (this.form.amount / this.maxNum) * 100;
+	    return num;
+	},
     // 可用数量
     usable() {
       if (this.form.direction == "buy") {
@@ -1075,6 +1109,34 @@ export default {
     // border:1px solid $theme-1!important;
     border-color: $theme-1!important;
 }
+// 滑块样式
+::v-deep .el-slider__marks-text{
+	font-size: 18rpx;
+}
+::v-deep .el-slider__runway{
+	background-color: #2B2B2B;
+	height: 8rpx;
+}
+::v-deep .el-slider__bar{
+	background-color: white;
+}
+::v-deep .el-slider__stop{
+	background-color: #121212;
+	border: 2px solid #2B2B2B;
+	top: -3px;
+	// border-radius: 10px;
+}
+::v-deep .el-slider__button{
+	width: 20rpx;
+	height: 20rpx;
+	border: 2px solid #fff;
+	background-color: #121212;
+}
+
+.entrust_title{
+	display: flex;justify-content: space-between;width: 240px;padding-bottom: 4px;
+}
+
 .h-110{
     height: 110px;
 }
diff --git a/pages/exchange/open-position.vue b/pages/exchange/open-position.vue
index 9d03b9d..bd38df2 100644
--- a/pages/exchange/open-position.vue
+++ b/pages/exchange/open-position.vue
@@ -1,15 +1,36 @@
 <template>
     <view class="bg-panel-3">
-        <view class="d-flex p-x-md p-0 fa p-t-md justify-between align-center fn-18 bg-panel-3 color-light flex-wrap">
+		<v-header class="nav-tab" :left-arrow="false" style="background-color: #121212;">
+			<template #left>
+				<!-- <van-icon name="user-circle-o" class="fn-25 color-theme-1" style="color: #D0712F;" /> -->
+				<image src="@/assets/img/home/top.png" mode="aspectFit" style="width: 36rpx;height: 36rpx;"></image>
+			</template>
+			<template #title>
+				<view style="color: #ffffff; font-size: 30rpx;">{{$t("base.d0")}}</view>
+			</template>
+			<template #right>
+				<view class="per-bot p-y-md p-x-sm d-flex align-center">
+					<!-- <img :src="$localImgUrl('Page6.png')" alt="" class="h-20 m-r-xs" /> -->
+					<span class="color-light">
+						<v-lang @change="marketList = [];
+		                indexData();getHelpList();"></v-lang>
+						<i class="iconfont m-l-xs fn-sm">&#xe6e9;</i>
+					</span>
+				</view>
+			</template>
+		</v-header>
+		
+        <view class="d-flex p-x-md p-0 p-t-md justify-between align-center fn-18 color-light flex-wrap">
             <view class="w-max" style="height: var(--status-bar-height)"></view>
             <view @click="$emit('symbol')" class="d-flex align-center">
-                <i class="iconfont color-light fn-bold fn-18">&#xe655;</i>
+                <!-- <i class="iconfont color-light fn-bold fn-18">&#xe655;</i> -->
                 <text class="fn-bold" style="margin-right: 5px;">{{ symbol }}</text>
                 {{ $t("first.b8") }}
-                <text class="fn-10 m-l-xs p-y-2"
+				<i class="iconfont" style="margin-left: 5px;">&#xe6e9;</i>
+                <!-- <text class="fn-10 m-l-xs p-y-2"
                       :class="increase.increase < 0 ? 'color-sell bg-sell-transparent' : 'color-buy bg-buy-transparent'">
                     {{increase.increaseStr}}
-                </text>
+                </text> -->
             </view>
             <view class="d-flex fn-20 color-theme-1">
                 <view class="m-r-xs" @click="$emit('option')">
@@ -28,7 +49,7 @@
                     <van-icon name="chart-trending-o"/>
                 </v-link>
             </view>
-            <view class="p-ms bg-form-panel-3 fn-sm m-t-xs rounded-sm d-flex justify-between w-max fn-13">
+            <!-- <view class="p-ms bg-form-panel-3 fn-sm m-t-xs rounded-sm d-flex justify-between w-max fn-13">
                 <view class="item w-33 t-no positions">
                     <view class="label">{{ $t("contract.d4") }}(USDT)</view>
                     <view class="num color-light d-flex align-center" style="margin-top:8px;">
@@ -39,12 +60,12 @@
                 </view>
                 <view class="item p-x-xs t-no w-33 fn-center">
                     <view class="label">
-                        <!-- {{ $t("contract.d5") }} -->
+                        {{ $t("contract.d5") }}
                         {{ $t("contract.e4") }}
                         (USDT)
                     </view>
                     <view class="num color-light " style="margin-top:8px;">
-                        <!-- {{accountInfo.totalUnrealProfit}} -->
+                        {{accountInfo.totalUnrealProfit}}
                         {{accountInfo.usable_balance}}
                     </view>
                 </view>
@@ -58,10 +79,11 @@
                         }}
                     </view>
                 </view>
-            </view>
+            </view> -->
+			
         </view>
         <view class="w-max" style="height: var(--status-bar-height)"></view>
-        <view class="h-120"></view>
+        <!-- <view class="h-120"></view> -->
         <scroll-view
             @refresherrefresh="onRefresh"
             :refresher-enabled="refresherEnabled&&scrollTop<50"
@@ -80,7 +102,7 @@
                             <text style="width: 50%;display: inline-block;">平仓</text>
                           </view>
                         </view> -->
-                        <view class="d-flex fn-center m-b-ms h-30 color-light">
+                        <view class="d-flex fn-center m-b-ms h-30 color-light" style="margin-top: 20px;">
                             <!-- <v-picker
                               :list="commissionTypes"
                               v-model="form.type"
@@ -91,7 +113,7 @@
                               </text>
                               <i class="iconfont">&#xe6e9;</i>
                             </v-picker> -->
-                            <v-dropdwon class="w-60 m-r-xs bg-form-panel-3 p-y-xxs rounded posi" :list="commissionTypes"
+                            <v-dropdwon class="w-60 m-r-xs bg-form-panel-3 p-y-xxs posi border_1" :list="commissionTypes"
                                         @onClick="dropDownChange">
                             </v-dropdwon>
                             <!-- <v-picker
@@ -104,7 +126,7 @@
                               <i class="iconfont fn-13">&#xe6e9;</i>
                             </v-picker> -->
                             <v-dropdwon v-if="lever_rage.length>0"
-                                        class="w-40 m-r-xs posi bg-form-panel-3 p-y-xxs rounded" :contract="contract"
+                                        class="w-40 m-r-xs posi bg-form-panel-3 p-y-xxs border_1" :contract="contract"
                                         :list="lever_rage" @onClick="openNum" :leverShow="leverShow">
                             </v-dropdwon>
                         </view>
@@ -131,19 +153,26 @@
                         <view>
                             <!-- :placeholder="$t('contract.d2')"
                             v-model="form.amount" -->
-                            <v-input
+                            <!-- <v-input
                                 v-model="margin"
                                 :placeholder="$t('contract.d2')"
                                 @input="sliderActive=-1"
                                 class="h-30 p-x-sm p-y-xxs rounded bg-form-panel-3"
                             >
                                 <template #right>
-                  <span class="color-light fn-bold">
-					<!-- {{ $t("contract.d8") }} -->
-					USDT
-				  </span>
+									<span class="color-light fn-bold">{{ $t("contract.d8") }}USDT</span>
                                 </template>
-                            </v-input>
+                            </v-input> -->
+							<v-input
+							   v-model="margin"
+							   @input="sliderActive=-1"
+							   :placeholder="$t('contract.d2')" style="border: 1px solid #202020;">
+							   <template #right>
+							     <view class="color-light fn-bold" style="margin-right: 10px;">
+								 <!-- {{ $t("contract.d8") }} -->
+								 USDT</view>
+							   </template>
+							 </v-input>
                         </view>
                         <view class="m-b-xs">
                             <view class="m-t-xs">
@@ -152,11 +181,11 @@
                                   <text>100%</text>
                                 </view> -->
                                 <view class="d-flex justify-between">
-                                    <view class="borders w-23 rounded-3 fn-center p-y-xs fn-12"
+                                    <!-- <view class="borders w-23 rounded-3 fn-center p-y-xs fn-12"
                                           v-for="(item,index) in progress" @click="sliderChange(item,index)"
                                           :class="sliderActive==index?'color-theme-1 active':''">
                                         {{item}}%
-                                    </view>
+                                    </view> -->
                                     <!-- <bing-progress
                                        activeColor="#60c08c"
                                        barBorderRadius="20px"
@@ -172,12 +201,14 @@
                                        :value="activeStep"
                                      /> -->
                                 </view>
-                                <!-- <el-slider
+                                <el-slider
                                   :value="activeStep"
                                   @input="sliderChange"
-                                  :step="20"
+                                  :step="25"
                                   show-stops
-                                ></el-slider> -->
+								  :marks="marks"
+								  :show-tooltip="false"
+                                ></el-slider>
                                 <!-- :format-tooltip="tooltip" -->
                             </view>
                         </view>
@@ -185,12 +216,25 @@
                           <span class="color-default">{{ $t("contract.d9") }}</span>
                           <span>{{ margin }}</span>
                         </view> -->
+						
+						<!-- 1111 -->
                         <view class="d-flex flex-wrap">
-                            <view class="fn-12">
+                            <!-- <view class="fn-12">
                                 {{$t('first.a3')}}
                                 <text class="color-theme-1">({{$t('reg.b4')}})</text>
-                            </view>
-                            <view class="d-flex justify-between m-y-xs align-center">
+                            </view> -->
+							<view class="fn-sm m-t-xs d-flex justify-between" style="width: 100%;">
+							    <view class="d-flex">
+							        {{ $t("common.c3") }}
+									<view class="m-l-xs">
+									    {{ maxNum }}
+									    {{ $t("contract.d8") }}
+									</view>
+							    </view>
+								<img :src="$localImgUrl('antOutline.png')" alt="" class="h-18" />
+							</view>
+							
+                            <!-- <view class="d-flex justify-between m-y-xs align-center">
                                 <v-input
                                     :placeholder="$t('contract.i4')"
                                     v-model="form.tp_trigger_price"
@@ -203,7 +247,35 @@
                                     class="h-30 p-x-ms m-l-xs rounded fn-12 bg-form-panel-3"
                                 >
                                 </v-input>
-                            </view>
+                            </view> -->
+							
+							<!-- 止盈/止损 -->
+							<view style="margin-top: 10px;">
+								<van-checkbox :value="shows" @change="shows = !shows"  checked-color="#fff" shape="square" icon-size="15px">
+									<text class="col-fff m-r-xs" style="font-size: 13px;">{{ $t('contract.i4') }}/{{ $t('contract.i7') }}</text>
+								</van-checkbox>
+							</view>
+							<view style="margin: 10px 0px;" v-if="shows">
+								<v-input
+								   v-model="form.tp_trigger_price"
+								   :placeholder="$t('contract.i4')" style="border: 1px solid #202020;">
+								   <template #right>
+								     <view class="fn-bold" style="margin-right: 10px;">
+									 <!-- {{ $t("contract.d8") }} -->
+									 USDT</view>
+								   </template>
+								 </v-input>
+								 
+								 <v-input
+								    v-model="form.sl_trigger_price"
+								    :placeholder="$t('contract.i7')" style="border: 1px solid #202020;margin-top: 5px;">
+								    <template #right>
+								      <view class="fn-bold" style="margin-right: 10px;">
+								 	 <!-- {{ $t("contract.d8") }} -->
+								 	 USDT</view>
+								    </template>
+								  </v-input>
+							</view>
                         </view>
                         <view class="m-b-sm m-t-xs">
                             <template v-if="isLogin">
@@ -214,11 +286,26 @@
                                     size="small"
                                     block
                                     class="w-max rounded"
-																		style="background-color: #25A74F;"
-                                >
+									style="background-color: #25A74F;">
                                     <span class="but_text">{{ $t("contract.c0") }}</span>
-                                    <!--<span class="fn-10 but_right">{{ $t("contract.e0") }}</span>-->
+                                    <!-- <span class="fn-10 but_right">{{ $t("contract.e0") }}</span> -->
                                 </v-button>
+								<view class="fn-sm m-t-xs d-flex">
+								    <view class="">
+								        可买
+								    </view>
+								    <view class="" style="margin-left: 10px;">
+								        {{amount}} BTC
+								    </view>
+								</view>
+								<view class="d-flex">
+									<view class="">
+										成本
+									</view>
+									<view class="" style="margin-left: 10px;">
+										--
+									</view>
+								</view>
                             </template>
                             <template v-else>
                                 <v-button
@@ -227,7 +314,7 @@
                                     to="/pages/login/index"
                                     :type="'green'"
                                     class="w-max rounded"
-																		style="background-color: #25A74F;"
+									style="background-color: #25A74F;"
                                 >{{ $t("exchange.d0") }}
                                 </v-button
                                 >
@@ -250,11 +337,27 @@
                                     size="small"
                                     block
                                     class="w-max rounded"
-																		style="background-color: #CA3F66;"
+									style="background-color: #CA3F66;"
                                 >
                                     <span class="but_text">{{ $t("contract.c2") }}</span>
                                     <!--<span class="fn-10 but_right">{{ $t("contract.e2") }}</span>-->
                                 </v-button>
+								<view class="fn-sm m-t-xs d-flex">
+								    <view class="">
+								        可卖
+								    </view>
+								    <view class="" style="margin-left: 10px;">
+								        {{amount}} BTC
+								    </view>
+								</view>
+								<view class="d-flex">
+									<view class="">
+										成本
+									</view>
+									<view class="" style="margin-left: 10px;">
+										--
+									</view>
+								</view>
                             </template>
                             <template v-else>
                                 <v-button
@@ -268,25 +371,25 @@
                                 </v-button
                                 >
                             </template>
-                            <view class="fn-sm m-t-xs d-flex justify-between">
+                            <!-- <view class="fn-sm m-t-xs d-flex justify-between">
                                 <view class="">
                                     {{ $t("common.c3") }}
                                 </view>
                                 <view class="">
                                     {{ maxNum }}
-                                    <!-- {{ $t("contract.d8") }} -->
+                                    {{ $t("contract.d8") }}
                                 </view>
-                            </view>
-                            <view class="fn-sm m-t-xs d-flex justify-between">
+                            </view> -->
+                            <!-- <view class="fn-sm m-t-xs d-flex justify-between">
                                 <view class="">
                                     {{ $t("common.c4") }}
-                                    <!-- {{ $t('contract.d2') }} -->
+                                    {{ $t('contract.d2') }}
                                 </view>
                                 <view class="">
-                                    <!-- {{  form.amount}} USDT -->
+                                    {{  form.amount}} USDT
                                     {{amount}}
                                 </view>
-                            </view>
+                            </view> -->
                         </view>
                         <!-- <view
                           class="m-b-xs border-t border-b p-y-xs d-flex justify-between align-center"
@@ -308,6 +411,17 @@
                         </view> -->
                     </view>
                     <view class="w-6/12 p-r-md p-l-md box-size">
+						
+							<view style="margin-top: 20px;" class="m-b-md">
+							    <view style="text-align: right;">
+							        {{ $t("contract.d6") }}
+							        <van-icon @click="popshow=true" class="color-theme-1 m-l-xs" name="info-o"/>
+							    </view>
+							    <view class="num color-light fn-right" style="margin-top:8px;">{{
+							        accountInfo.riskRate || "0%"
+							        }}
+							    </view>
+							</view>
                         <sell-and-buy
                             @price="form.entrust_price = $event"
                             :sellList="sellList"
@@ -865,7 +979,15 @@ export default {
             refreshing: false,
             pingAmount: '',
             imgurl: '',
-            bao: 0
+            bao: 0,
+			marks:{
+				2: '0%',
+				25: '25%',
+				50: '50%',
+				75: '75%',
+				100: '100%',
+			},
+			shows:false
         };
     },
     computed: {
@@ -1679,7 +1801,10 @@ export default {
         bottom: 8px;
     }
 }
-
+.border_1{
+	border: 1px solid #212121;
+	border-radius: 5px;
+}
 /deep/ .van-stepper {
     display: flex;
     justify-content: space-between;
@@ -1742,6 +1867,13 @@ export default {
         display: block;
     }
 }
+::v-deep uni-input{
+	background-color: #121212;
+}
+
+::v-deep .van-checkbox__icon--checked{
+	color: #000;
+}
 
 .span-next {
     width: 30%;
@@ -1772,13 +1904,6 @@ export default {
     border-radius: 3px;
 }
 
-/deep/ .el-slider__stop {
-    width: 5px;
-    height: 10px;
-    border-radius: 0;
-    top: -2px;
-    background-color: $form-panel-4;
-}
 
 .w-50 {
     width: 48%;
@@ -1832,7 +1957,9 @@ export default {
     width: 100%;
     box-sizing: border-box;
 }
-
+.col-fff{
+	color: white;
+}
 .w-23 {
     width: 22%;
 }
@@ -1962,4 +2089,29 @@ export default {
 .red /deep/ uni-button{
 	background-color: #CA3F66 !important;
 }
+
+// 滑块样式
+::v-deep .el-slider__marks-text{
+	font-size: 18rpx;
+}
+::v-deep .el-slider__runway{
+	background-color: #2B2B2B;
+	height: 8rpx;
+}
+::v-deep .el-slider__bar{
+	background-color: white;
+}
+::v-deep .el-slider__stop{
+	background-color: #121212;
+	border: 2px solid #2B2B2B;
+	top: -3px;
+	// border-radius: 10px;
+}
+::v-deep .el-slider__button{
+	width: 20rpx;
+	height: 20rpx;
+	border: 2px solid #fff;
+	background-color: #121212;
+}
+
 </style>
\ No newline at end of file
diff --git a/pages/exchange/sell-and-buy.vue b/pages/exchange/sell-and-buy.vue
index 7d76c46..6063964 100644
--- a/pages/exchange/sell-and-buy.vue
+++ b/pages/exchange/sell-and-buy.vue
@@ -2,8 +2,8 @@
   <div class="p-l-xs d-flex flex-col dep-list">
     <!-- 卖 -->
     <div class="d-flex justify-between fn-xs m-b-xs">
-      <span>{{$t('exchange.d2')}}</span>
-      <span>{{$t('exchange.c5')}}</span>
+      <span>{{$t('exchange.d2')}}<view>(USDT)</view></span>
+      <span>{{$t('exchange.c5')}}<view>(BTC)</view></span>
     </div>
     <div class=" overflow-scroll rotatebox" v-if="symbol!='GITP/USDT'">
       <div class="rotateZ">
@@ -16,7 +16,7 @@
             <span class="color-sell" v-if="item.price>100">{{omitTo(item.price,2)}}</span>
             <span class="color-sell" v-if="item.price>1&&item.price<100">{{omitTo(item.price,4)}}</span>
             <span class="color-sell" v-if="item.price<1">{{omitTo(item.price,6)}}</span>
-          <span class="p-r-xs">{{omitTo(item.amount,2)}}</span>
+          <span class="p-r-xs" style="color: white;">{{omitTo(item.amount,2)}}</span>
           <div
             class="proagess h-max bg-sell-transparent"
             :style="{width:getValue(item.amount)+'%'}"
@@ -38,7 +38,7 @@
             <span class="color-buy" v-if="item.price>100">{{omitTo(item.price,2)}}</span>
             <span class="color-buy" v-if="item.price>1&&item.price<100">{{omitTo(item.price,4)}}</span>
             <span class="color-buy" v-if="item.price<1">{{omitTo(item.price,6)}}</span>
-        <span class="p-r-xs">{{omitTo(item.amount,2)}}</span>
+        <span class="p-r-xs" style="color: white;">{{omitTo(item.amount,2)}}</span>
         <div class="proagess h-max bg-buy-transparent" :style="{width:getValue(item.amount)+'%'}"></div>
       </div>
     </div>
@@ -128,10 +128,10 @@ export default {
   }
 }
 .color-buy{
-	color: #2A7745;
+	color: #2C7543;
 }
 .color-sell{
-	color: #CA3F66;
+	color: #89334D;
 }
 
 </style>
\ No newline at end of file