合约倍数滑块滑动条

i18n/index.js

@@ -20,7 +20,6 @@ requireComponent.keys().forEach(fileName => {
 // 语言注入
 let i18n = new VueI18n({
     locale: uni.getStorageSync('language')||'en',
-	 locale:'en',
     messages: messages
 })
 export default i18n;

pages/exchange/open-position.vue

@@ -151,12 +151,21 @@
                                   <text>0%</text>
                                   <text>100%</text>
                                 </view> -->
-                                <view class="d-flex justify-between">
-                                    <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 class="d-flex justify-between" style="flex-wrap: wrap;">
+                                    <!-- <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> -->
+																		<slider style="width: 100%;margin:0px;" block-size="16" class="fn-center p-y-xs fn-12" value="0" @change="sliderChangeN" step="1" />
+																		<view style="width: 100%;display: flex;justify-content: space-between;">
+																			<text style="text-align: left;font-size: 12px;">0%</text>
+																			<text style="text-align: right;font-size: 12px;">25%</text>
+																			<text style="text-align: right;font-size: 12px;">50%</text>
+																			<text style="text-align: right;font-size: 12px;">75%</text>
+																			<text style="text-align: right;font-size: 12px;">100%</text>
+																		</view>
+																		<view style="width: 100%;">{{showSliderNum}}</view>
                                     <!-- <bing-progress
                                        activeColor="#60c08c"
                                        barBorderRadius="20px"
@@ -803,7 +812,7 @@ export default {
     },
     data() {
         return {
-            margin: '',
+            // margin: '',
             sellList: [],
             buyList: [],
             tradeList: [],
@@ -866,7 +875,8 @@ export default {
             refreshing: false,
             pingAmount: '',
             imgurl: '',
-            bao: 0
+            bao: 0,
+						showSliderNum: '0%'
         };
     },
     computed: {
@@ -1183,6 +1193,15 @@ export default {
             myCanvas.height = 0
         },
         // 设置数量
+				sliderChangeN(e){
+					console.log('value 发生变化：' + e.detail.value);
+					let num = e.detail.value;
+					this.showSliderNum = num+"%";
+					this.form.amount = Math.round((this.maxNum * num) / 100);
+					// this.sliderActive = i
+					this.sliderActive1 = num
+					this.margin = (this.form.amount / this.form.lever_rate).toFixed(5)
+				},
         // sliderChange($ev) {
         //   this.form.amount = Math.round((this.maxNum * $ev) / 100)||'';
         // },