pull/12/head
xiaozhiyong
2 years ago
parent
49fc0e5531
commit
5a73a4e9a6
9 changed files with 699 additions and 399 deletions
@ -0,0 +1,240 @@ |
||||
<template> |
||||
<view> |
||||
<uni-popup ref="indexPopup" type="bottom"> |
||||
<view class="trans-block"> |
||||
<view class="title">请输入赠卡金额</view> |
||||
<text>￥</text><input v-model="params.occurAmount" class="uni-input" type="digit" |
||||
:placeholder=" '最多可以赠送'+ info.balance + '元'" /> |
||||
<button @click="sendTextMessage">确认赠卡</button> |
||||
</view> |
||||
</uni-popup> |
||||
|
||||
<uni-popup ref="smscodePopup" type="center"> |
||||
<view class="poput_tip"> |
||||
<view :style="'background-image: url('+popupbg+ ');'" class="popup_header">短信身份验证</view> |
||||
<view style="margin: 20rpx auto;width: 90%;">转出验证：本次转出需要短信确认，验证码 已发送至您的手机 |
||||
{{phoneHandle(this.user.userPhone)}} |
||||
</view> |
||||
<xt-verify-code class="code" v-model="params.code" @confirm="submit"></xt-verify-code> |
||||
<button @click="send" class="oliout_butten" |
||||
style="width:60%; border-radius: 50rpx;">{{time===0?'重新发送验证码':time+'S'}} |
||||
</button> |
||||
</view> |
||||
</uni-popup> |
||||
|
||||
<uni-popup ref="successPopupt" type="center"> |
||||
<view class="poput_tip"> |
||||
<view :style="'background-image: url('+popupbg+ ');'" class="popup_header">温馨提示</view> |
||||
<view style="margin: 20rpx auto;width: 90%;text-align: center;"> |
||||
<view class="container_img"> |
||||
<image class="success_img" src="../../static/img/success.png"></image> |
||||
</view> |
||||
转出成功! |
||||
</view> |
||||
<button @click="$refs.successPopupt.close()" class="oliout_butten" |
||||
style="width:60%; border-radius: 50rpx;">确认</button> |
||||
</view> |
||||
</uni-popup> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
import serve from '@/api/account.js' |
||||
export default { |
||||
data() { |
||||
return { |
||||
popupbg: 'https://xoi-support.oss-cn-hangzhou.aliyuncs.com/web/cuscomtrac/popupbg.png', |
||||
time: 0, |
||||
price: '', |
||||
info: {}, |
||||
user: uni.getStorageSync('user') || {}, |
||||
params: { |
||||
occurAmount: '', |
||||
code: '', |
||||
verifyCodeToken: '', |
||||
billType: 'OIL_DONATION', |
||||
createSource: 'XOIL_DRIVER_WECHAT_APPLET', |
||||
} |
||||
} |
||||
}, |
||||
|
||||
methods: { |
||||
_open(item) { |
||||
if (item) { |
||||
console.log('itemitemitemitem', item) |
||||
this.params.occurAmount = '' |
||||
this.info = item |
||||
this.$refs.indexPopup.open() |
||||
} |
||||
}, |
||||
sendTextMessage() { |
||||
if (!this.submitCheck()) return |
||||
|
||||
if (this.time === 0) { |
||||
this.params.code = '' |
||||
this.params.verifyCodeToken = '' |
||||
serve.giveCard({ |
||||
phone: this.user.userPhone |
||||
}).then(res => { |
||||
this.time = 60 |
||||
this.params.verifyCodeToken = res.data.verifyCodeToken |
||||
this.timefn() |
||||
this.$refs.smscodePopup.open() |
||||
}) |
||||
|
||||
} |
||||
}, |
||||
submitCheck() { |
||||
let { |
||||
occurAmount |
||||
} = this.params |
||||
if (!occurAmount) { |
||||
uni.showToast({ |
||||
title: '请输入赠送金额', |
||||
icon: 'none' |
||||
}) |
||||
return |
||||
} |
||||
if (occurAmount > this.info.balance) { |
||||
uni.showToast({ |
||||
title: '超过最多赠送金额', |
||||
icon: 'none' |
||||
}) |
||||
return |
||||
} |
||||
if (occurAmount < 5) { |
||||
uni.showToast({ |
||||
title: '赠送金额不可低于5元', |
||||
icon: 'none' |
||||
}) |
||||
return |
||||
} |
||||
return true |
||||
}, |
||||
submit() { |
||||
let { |
||||
giveCustomerId, //收款方 |
||||
companyId, //付款方 |
||||
accountCardCode //付款方 |
||||
} = this.info |
||||
|
||||
serve.oilCustomerAccountRecord({ |
||||
giveCustomerId, |
||||
givePhone: '', |
||||
companyId, |
||||
payerCustomerId: this.user.id, |
||||
accountCardCode, |
||||
...this.params |
||||
}).then(res => { |
||||
this.$refs.indexPopup.close() |
||||
this.$refs.smscodePopup.close() |
||||
this.$refs.successPopupt.open() |
||||
this.$emit('reloadCard') |
||||
}) |
||||
}, |
||||
|
||||
|
||||
phoneHandle(e) { |
||||
return e.substr(0, 3) + "****" + e.substr(7); |
||||
}, |
||||
|
||||
timefn() { |
||||
if (this.time !== 0) { |
||||
this.time-- |
||||
setTimeout(() => { |
||||
this.timefn() |
||||
}, 1000) |
||||
} |
||||
}, |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.poput_tip { |
||||
width: 85vw; |
||||
height: 40vh; |
||||
background-color: #F8F8F8; |
||||
border-radius: 15rpx; |
||||
overflow: hidden; |
||||
} |
||||
|
||||
.popup_header { |
||||
height: 20%; |
||||
width: 100%; |
||||
background-color: #FE0505; |
||||
color: white; |
||||
display: flex; |
||||
justify-content: center; |
||||
align-items: center; |
||||
background-size: 100% 30vh; |
||||
} |
||||
|
||||
.container_img { |
||||
height: 100rpx; |
||||
width: 100rpx; |
||||
overflow: hidden; |
||||
border-radius: 50%; |
||||
margin: 0 auto; |
||||
margin-top: 50rpx; |
||||
margin-bottom: 25rpx; |
||||
} |
||||
|
||||
// .xt__verify-code .xt__input-ground .xt__box-box.data-v-e4b72d00 { |
||||
// height: 100rpx !important; |
||||
// } |
||||
|
||||
// .xt__verify-code { |
||||
// width: 90% !important; |
||||
// margin: 0 auto !important; |
||||
// } |
||||
|
||||
.oliout_butten { |
||||
width: 90vw; |
||||
margin: 0 auto; |
||||
background-color: #FE0505; |
||||
margin-top: 60rpx; |
||||
color: #F0F0F0; |
||||
} |
||||
|
||||
.trans-block { |
||||
padding: 54rpx 43rpx 0 63rpx; |
||||
width: 100%; |
||||
height: 679rpx; |
||||
background: #FFF; |
||||
border-radius: 15rpx 15rpx 0 0; |
||||
|
||||
.title { |
||||
margin-bottom: 35rpx; |
||||
font-size: 26rpx; |
||||
font-weight: 550; |
||||
color: #333; |
||||
} |
||||
|
||||
>text { |
||||
position: relative; |
||||
top: -10rpx; |
||||
font-size: 42rpx; |
||||
font-weight: 550; |
||||
color: #000; |
||||
} |
||||
|
||||
>input { |
||||
display: inline-block; |
||||
margin-left: 10rpx; |
||||
font-size: 28rpx; |
||||
color: #000; |
||||
} |
||||
|
||||
>button { |
||||
margin-top: 320rpx; |
||||
width: 441rpx; |
||||
height: 89rpx; |
||||
color: #fff; |
||||
font-size: 34rpx; |
||||
text-align: center; |
||||
background: #FF6700; |
||||
border-radius: 10rpx |
||||
} |
||||
} |
||||
</style> |
||||
Loading…
Reference in new issue