20261008
This commit is contained in:
+124
-63
@@ -5,12 +5,13 @@
|
||||
</div>
|
||||
<div class="grade-list">
|
||||
<div class="item pointer" v-for="(item,index) in gradeList" :key="index"
|
||||
:class="gradeIndex === index ? 'active' : ''" @click="onChange(index)">
|
||||
:class="[parseInt(gradeIndex) === index ? 'active' : '', item.disabled ? 'disabled' : '']"
|
||||
@click="onChange(index)">
|
||||
<div class="item-box">
|
||||
<div class="title">{{ item.name }}</div>
|
||||
<div class="title">
|
||||
<span>{{ item.amount }}元/年</span>
|
||||
<span v-if="parseFloat(item.ensureAmount) > 0">+交易保证金</span>
|
||||
<span v-if="parseFloat(item.ensureAmount) > 0">+交易保证金({{ item.ensureAmount }}元)</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="select">
|
||||
@@ -19,11 +20,46 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item pointer"
|
||||
:class="[gradeIndex === -2 ? 'active' : '']" @click="onChange(-2)">
|
||||
<div class="item-box">
|
||||
<div class="title">交易保证金缴纳</div>
|
||||
<div class="title">
|
||||
<el-select v-model="ensureAmount" size="small">
|
||||
<el-option
|
||||
v-for="item in ensureList"
|
||||
:key="item.amount"
|
||||
:label="`${item.amount.toFixed(2)}元`"
|
||||
:value="item.amount">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="select">
|
||||
<div class="icon">
|
||||
<i class="el-icon-check"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex justify-start items-center mt-20" v-if="gradeIndex === 2">
|
||||
<div @click="ensureIndex = 0"
|
||||
:style="{backgroundColor: ensureIndex === 0 ? '#a92924' : '', color: ensureIndex === 0 ? 'white' : ''}"
|
||||
class="border rounded p-20">50000元保证金
|
||||
</div>
|
||||
<div @click="ensureIndex = 1"
|
||||
:style="{backgroundColor: ensureIndex === 1 ? '#a92924' : '', color: ensureIndex === 1 ? 'white' : ''}"
|
||||
class="border rounded p-20 mx-20">100000元保证金
|
||||
</div>
|
||||
<div @click="ensureIndex = 2"
|
||||
:style="{backgroundColor: ensureIndex === 2 ? '#a92924' : '', color: ensureIndex === 2 ? 'white' : ''}"
|
||||
class="border rounded p-20">200000元保证金
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bzj-readme">
|
||||
<div class="sub-title">保证金说明</div>
|
||||
<div class="sub-title">保证金协议</div>
|
||||
<div class="content">
|
||||
保证金说明内容...
|
||||
{{ desc }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="payment">
|
||||
@@ -41,7 +77,7 @@
|
||||
</div>
|
||||
<div class="pay-price" v-if="billQRCode">
|
||||
<uv-qrcode ref="qrcode" size="240px" :value="billQRCode"></uv-qrcode>
|
||||
<div class="pay-desc">请打开手机微信，扫一扫完成支付</div>
|
||||
<div class="pay-desc">微信、支付宝、云闪付扫码完成支付</div>
|
||||
<el-button type="success" @click="onPayStatus">已完成支付</el-button>
|
||||
</div>
|
||||
<el-button v-else type="danger" @click="onPay">立即支付</el-button>
|
||||
@@ -67,80 +103,80 @@ export default {
|
||||
payment: ["银联支付"],
|
||||
showQrcode: false,
|
||||
billQRCode: '',
|
||||
gradeIndex: 1,
|
||||
gradeList: []
|
||||
gradeIndex: null,
|
||||
desc: '',
|
||||
gradeList: [],
|
||||
ensureList: [],
|
||||
ensureAmount: null,
|
||||
ensureIndex: 0
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getUserLevelList()
|
||||
this.getDesc()
|
||||
this.getEnsureConfig()
|
||||
},
|
||||
methods: {
|
||||
getUserInfo() {
|
||||
vk.userCenter.getCurrentUserInfo({
|
||||
success: (data) => {
|
||||
if (data.userInfo.businessCard) {
|
||||
this.form1.data = data.userInfo.businessCard
|
||||
this.gradeList.map(item => {
|
||||
item.disabled = false
|
||||
if (data.userInfo.userLevel && parseInt(data.userInfo.userLevel) > -1) {
|
||||
item.disabled = parseInt(item.level) < parseInt(data.userInfo.userLevel)
|
||||
}
|
||||
return item
|
||||
})
|
||||
for (let i in this.gradeList) {
|
||||
if (!this.gradeList[i].disabled) {
|
||||
this.gradeIndex = i
|
||||
break
|
||||
}
|
||||
}
|
||||
// 成功后的逻辑
|
||||
console.log('用户信息: ', data);
|
||||
}
|
||||
});
|
||||
|
||||
},
|
||||
onChange(index) {
|
||||
this.gradeIndex = index
|
||||
if (index === -2) this.gradeIndex = index
|
||||
else {
|
||||
if (this.gradeList[index].disabled) return
|
||||
this.gradeIndex = index
|
||||
}
|
||||
},
|
||||
async onPay() {
|
||||
|
||||
const res = await vk.callFunction({
|
||||
url: 'client/order/kh/add',
|
||||
data: {
|
||||
goods: {
|
||||
name: '会员升级',
|
||||
amount: this.amount,
|
||||
cover: null
|
||||
},
|
||||
type: 3,
|
||||
goodsId: parseInt(this.gradeList[this.gradeIndex].level),
|
||||
num: 1,
|
||||
}
|
||||
})
|
||||
const requestTimestamp = dayjs().format('YYYY-MM-DD HH:mm:ss')
|
||||
const timestamp = dayjs().format('YYYYMMDDHHmmss')
|
||||
let data = {
|
||||
queryUrl: 'https://test-api-open.chinaums.com/v1/netpay/bills/get-qrcode',
|
||||
timestamp,
|
||||
nonce: 'rp84ufhfn20yneo3tp',
|
||||
content: {
|
||||
billNo: res.data,
|
||||
requestTimestamp,
|
||||
mid: '898201612345678',
|
||||
tid: '88880001',
|
||||
instMid: 'QRPAYDEFAULT',
|
||||
totalAmount: 1,
|
||||
notifyUrl: 'https://static-mp-0737e52b-fffa-4223-bcdf-d4ad3d9968a5.next.bspapp.com/#/'
|
||||
}
|
||||
let res
|
||||
if (this.gradeIndex === -2) {
|
||||
res = await vk.callFunction({
|
||||
url: 'client/order/kh/add',
|
||||
data: {
|
||||
goods: {
|
||||
name: `交易保证金-${this.ensureAmount}元`,
|
||||
amount: this.ensureAmount,
|
||||
cover: null
|
||||
},
|
||||
type: 2,
|
||||
goodsId: null,
|
||||
num: 1,
|
||||
}
|
||||
})
|
||||
} else {
|
||||
res = await vk.callFunction({
|
||||
url: 'client/order/kh/add',
|
||||
data: {
|
||||
goods: {
|
||||
name: `会员升级-${this.gradeList[this.gradeIndex].name}`,
|
||||
amount: this.amount,
|
||||
cover: null
|
||||
},
|
||||
type: 3,
|
||||
goodsId: parseInt(this.gradeList[this.gradeIndex].level),
|
||||
ensureIndex: this.ensureIndex,
|
||||
num: 1,
|
||||
}
|
||||
})
|
||||
}
|
||||
/**
|
||||
* 调用函数
|
||||
*/
|
||||
sdk.exec(data).then(res => {
|
||||
const h = this.$createElement;
|
||||
const result = JSON.parse(res);
|
||||
if (result.errCode === 'SUCCESS') {
|
||||
this.showQrcode = true
|
||||
this.billQRCode = result.billQRCode
|
||||
// this.$alert('', '请打开手机微信，扫一扫完成支付', {
|
||||
// confirmButtonText: '确定',
|
||||
// callback: action => {
|
||||
// this.$message({
|
||||
// type: 'success',
|
||||
// message: `已完成支付`
|
||||
// });
|
||||
// }
|
||||
// });
|
||||
}
|
||||
})
|
||||
vk.redirectTo({url: `/pages/index/shop/pay?id=${res.data}`})
|
||||
},
|
||||
getUserLevelList() {
|
||||
vk.callFunction({
|
||||
@@ -151,13 +187,33 @@ export default {
|
||||
},
|
||||
success: (data) => {
|
||||
this.gradeList = data.rows.filter(item => parseFloat(item.amount) > 0)
|
||||
this.getUserInfo()
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
async getDesc() {
|
||||
const res = await vk.callFunction({
|
||||
url: 'client/dict/pub/getDetail',
|
||||
data: {
|
||||
id: '880c33886636217300376edd5a56e1e6'
|
||||
},
|
||||
})
|
||||
this.desc = res.content
|
||||
},
|
||||
async getEnsureConfig() {
|
||||
const {rows} = await vk.callFunction({
|
||||
url: 'client/ensureConfig/pub/getList',
|
||||
})
|
||||
this.ensureList = rows
|
||||
this.ensureAmount = this.ensureList[0].amount
|
||||
},
|
||||
|
||||
},
|
||||
computed: {
|
||||
amount() {
|
||||
return parseFloat(this.gradeList[this.gradeIndex].amount) + parseFloat(this.gradeList[this.gradeIndex].ensureAmount)
|
||||
if (this.gradeIndex === -2) return this.ensureAmount
|
||||
else if (this.gradeIndex === 2) return parseFloat(this.gradeList[this.gradeIndex].amount) + [50000, 100000, 200000][this.ensureIndex]
|
||||
else return parseFloat(this.gradeList[this.gradeIndex].amount) + parseFloat(this.gradeList[this.gradeIndex].ensureAmount)
|
||||
}
|
||||
},
|
||||
}
|
||||
@@ -288,4 +344,9 @@ export default {
|
||||
font-size: 16px;
|
||||
line-height: 2em;
|
||||
}
|
||||
|
||||
.disabled {
|
||||
cursor: not-allowed;
|
||||
background-color: #F0F0F0;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user