From 8085cefd6a3437a8bb9e7b39628d444fc4203223 Mon Sep 17 00:00:00 2001
From: DESKTOP-CVS3R96\我恁爹 <11>
Date: Thu, 10 Nov 2022 05:00:06 +0800
Subject: [PATCH] 11.10 5
---
src/page/trading/buy.vue | 221 ++++++++++++++++++++++++++++++++++++++++++++++++++----
1 files changed, 202 insertions(+), 19 deletions(-)
diff --git a/src/page/trading/buy.vue b/src/page/trading/buy.vue
index 5c80beb..d7453a7 100644
--- a/src/page/trading/buy.vue
+++ b/src/page/trading/buy.vue
@@ -8,10 +8,10 @@
</div>
<div class="right_title">
<div class="t_t">
- <span>{{ '人民币' }}</span>
+ <span>{{ name }}</span>
</div>
<div class="b_t">
- <span>{{ 'CNY' }}</span>
+ <span>{{ code }}</span>
</div>
</div>
</div>
@@ -19,7 +19,7 @@
<div class="cot">
<div class="lefts">
<div class="top_new">
- <span>{{ '1.34609' }}</span>
+ <span>{{ nowPrice }}</span>
</div>
<div class="bottom_es">
<span>{{ '买入价' }}</span>
@@ -39,7 +39,10 @@
</div>
</div>
</div>
- <div class="price_tabs">
+
+ </div>
+
+ <div class="price_tabs">
<div class="tabs">
<div class="tab_item"
v-for="(item, index) in priceTabs"
@@ -59,7 +62,7 @@
<input type="text" v-model="num">
</div>
</div>
- <div class="tr_rs gg">
+ <div class="tr_rs gg" @click="showGg=true">
<div class="top_bzz">
<span>{{ '杠杆' }}</span>
<span>{{ '200X' }}</span>
@@ -75,22 +78,77 @@
<span>{{ '可用余额(¥)' }}</span>
</div>
<div class="bottom_bzz">
- <span>{{ '5.00' }}</span>
- <span>{{ '49,698.61' }}</span>
+ <span>{{ (nowPrice/ selectCycle).toFixed(2) }}</span>
+ <span v-if="$store.state.userInfo.userAmt==undefined">¥0.00</span>
+ <span
+ v-if="$store.state.userInfo&&type!='0'"
+ style="white-space: nowarp;"
+ >
+ {{ '¥' + $store.state.userInfo.userIndexAmt
+ }}
+ </span>
+ <span
+ v-if="$store.state.userInfo.userAmt!=undefined&&type=='0'"
+ style="white-space: nowarp;"
+ >
+ {{ '¥ ' + $store.state.userInfo.userAmt
+ }}
+ </span>
</div>
</div>
</div>
</div>
<div class="switchs">
- <div class="zy"
- v-for="(item, index) in profitArr"
- :key="index"
- >
+ <div class="zy">
<div class="left_zy">
- <span>{{ item.name }}</span>
+ <span>止盈</span>
</div>
<div class="right_sw">
- <van-switch v-model="item.checked" />
+ <van-switch v-model="checkedZy" />
+ </div>
+ </div>
+ <div class="zy" v-show="checkedZy">
+ <div class="left_zy">
+ <input v-model="profitTarget" />
+ </div>
+ <div class="right_sw" style="width:auto;">
+ <div class="addorj" @click="profitTarget--">
+ <img src="@/assets/img/ic_number_jian.png"/>
+ </div>
+ <div class="addorj" ></div>
+ <div class="addorj" @click="profitTarget++">
+ <img src="@/assets/img/ic_number_add.png"/>
+ </div>
+ </div>
+ </div>
+ <div class="zy">
+ <div class="left_zy">
+ <span>止损</span>
+ </div>
+ <div class="right_sw">
+ <van-switch v-model="checkedZs" />
+ </div>
+ </div>
+ <div class="zy" v-show="checkedZs">
+ <div class="left_zy">
+ <input v-model="zhisun" />
+ </div>
+ <div class="right_sw" style="width:auto;">
+ <div class="addorj" @click="zhisun--">
+ <img src="@/assets/img/ic_number_jian.png"/>
+ </div>
+ <div class="addorj" ></div>
+ <div class="addorj" @click="zhisun++">
+ <img src="@/assets/img/ic_number_add.png"/>
+ </div>
+ </div>
+ </div>
+ <div class="zy">
+ <div class="left_zy">
+ <span>追踪止损</span>
+ </div>
+ <div class="right_sw">
+ <van-switch v-model="profitArr[2].checked" />
</div>
</div>
</div>
@@ -99,14 +157,39 @@
<span>{{ '买入' }}</span>
</div>
</div>
- </div>
</div>
+ <van-action-sheet
+ v-model="showGg"
+ :actions="actions"
+ cancel-text="取消"
+ description="选择杠杆"
+ close-on-click-action
+/>
</div>
</template>
<script>
+import * as api from "@/axios/api";
export default {
name: 'trBuy',
+ created() {
+ if(this.$route.query.t){
+ this.tabsCurrentIndex= Number(this.$route.query.t)
+ console.log(this.tabsCurrentIndex)
+ }
+ if(this.$route.query.m){
+ this.nowPrice= Number(this.$route.query.m)
+ }
+ if(this.$route.query.code){
+ this.code= this.$route.query.code
+ }
+ if(this.$route.query.name){
+ this.name= this.$route.query.name
+ }
+ if(this.$route.query.type){
+ this.type= this.$route.query.type
+ }
+ },
data() {
return {
tradingArr: ['卖出', '买入'],
@@ -115,6 +198,23 @@
priceTabsCurrentIndex: 0,
num: 0.01,
profit: false,
+ nowPrice: 0,
+ type: 0,
+ code: '',
+ name: '',
+ settingInfo:[],
+ selectCycle: 20,
+ siteLeverList:[],
+ checkedZy:false,
+ checkedZs:false,
+ zhisun:0,
+ showGg: false,
+ profitTarget: 0,
+ actions: [
+ { name: '100X', subname: '需付保证金：' },
+ { name: '200X', subname: '需付保证金：'},
+ { name: '300X', subname: '需付保证金：' },
+ ],
profitArr: [
{
name: '止盈',
@@ -131,6 +231,10 @@
]
}
},
+ mounted() {
+ this.getSettingInfo();
+ this.getUserInfo();
+ },
methods: {
handleBack() {
this.$router.go(-1);
@@ -140,7 +244,48 @@
},
handleTabsClick(item, index) {
this.priceTabsCurrentIndex = index;
- }
+ },
+ async getUserInfo() {
+ // 获取用户信息
+ // let showcookie = this.getCookie('USER_TOKEN');
+ let data = await api.getUserInfo();
+ if (data.status === 0) {
+ // this.getProductSetting()
+ this.$store.state.userInfo = data.data;
+ } else {
+ Toast(data.msg);
+ }
+ this.$store.state.user = this.user;
+ },
+ async getSettingInfo () {
+ // 网站设置信息
+ let data = await api.getSetting()
+ if (data.status === 0) {
+ // 成功
+ this.settingInfo = data.data
+ // 杠杆倍数
+ this.selectCycle = data.data.siteLever
+ if(this.$store.state.userInfo !== undefined && this.$store.state.userInfo !== null && this.$store.state.userInfo.phone !== '' && this.$store.state.userInfo.siteLever !== null){
+ this.selectCycle = this.$store.state.userInfo.siteLever.split('/')[0]
+ this.siteLeverList = []
+ for (let i = 0; i < this.$store.state.userInfo.siteLever.split('/').length; i++) {
+ let val = this.$store.state.userInfo.siteLever.split('/')[i]
+ let item = { label: val + '倍', value: val }
+ this.siteLeverList.push(item)
+ }
+ } else {
+ this.selectCycle = data.data.siteLever.split('/')[0]
+ this.siteLeverList = []
+ for (let i = 0; i < data.data.siteLever.split('/').length; i++) {
+ let val = data.data.siteLever.split('/')[i]
+ let item = { label: val + '倍', value: val }
+ this.siteLeverList.push(item)
+ }
+ }
+ } else {
+ Toast(data.msg)
+ }
+ },
}
};
</script>
@@ -148,11 +293,13 @@
<style scoped lang="less">
.buy_page {
width: 100%;
- height: calc(100% - 1.7rem);
+ min-height: 100vh;
+ background-color: #fff;
> .content {
width: 100%;
- height: 100%;
+ height: calc(100% - 1.6rem);
position: relative;
+ background-color: rgb(241,242,246);
}
}
.top_cny {
@@ -266,6 +413,7 @@
padding: .2rem .8rem;
background: #fff;
margin-top: .1rem;
+ border-radius: 0.3rem;
.tabs {
width: 100%;
height: .8205rem;
@@ -346,11 +494,14 @@
}
.switchs{
width: 100%;
- height: 6rem;
+ height: auto;
padding: 0 .8rem;
background: #fff;
margin-top: .3rem;
+ border-radius: 0.3rem 0.3rem 0 0;
+ transition: all 0.5s;
.zy {
+ transition: all 0.5s;
width: 100%;
height: 1.8rem;
display: flex;
@@ -371,7 +522,7 @@
}
.btn_buy{
width: 100%;
- height: 4.8rem;
+ height: auto;
background: #fff;
padding: .2rem .8rem;
display: flex;
@@ -388,4 +539,36 @@
border-radius: .15rem;
}
}
+/deep/.van-action-sheet__name{
+ font-size: .3846rem;
+ color: #000;
+}
+/deep/.van-action-sheet__gap{
+ height: 0.25rem;
+
+}
+/deep/.van-action-sheet__cancel{
+ font-size: .4246rem;
+ height: 1.3rem;
+ color: #000;
+}
+/deep/.van-action-sheet__description{
+ font-size: 0.3846rem;
+ height: 1.45rem;
+ line-height: 0.7rem;
+}
+.left_zy input{
+ font-size: 0.48rem;
+ font-weight: 500;
+}
+.addorj{
+ width:0.7rem;
+ height: 0.7rem;
+ color: #000;
+ font-weight: 500;
+}
+.addorj img{
+ width: 100%;
+ height: 100%;
+}
</style>
\ No newline at end of file
--
Gitblit v1.9.3