main
liudan
10 months ago
parent
f2b7bb90e0
commit
7daa287b25
@ -0,0 +1,213 @@ |
|||||||
|
<template> |
||||||
|
<view class="zhuanzhang"> |
||||||
|
<view class="title"> |
||||||
|
可转账金额（元） |
||||||
|
</view> |
||||||
|
<view class="num"> |
||||||
|
3000 |
||||||
|
</view> |
||||||
|
<view class="form"> |
||||||
|
<view class="title"> |
||||||
|
提现金额 |
||||||
|
</view> |
||||||
|
<view class=""> |
||||||
|
<view class="money"> |
||||||
|
<text>￥</text> |
||||||
|
<input type="digit" class="moneyInput" v-model="form.money" placeholder="请输入转账金额"/> |
||||||
|
</view> |
||||||
|
<view class="money"> |
||||||
|
<input type="number" v-model="form.account" placeholder="请输入对方账号"/> |
||||||
|
</view> |
||||||
|
<view class="money"> |
||||||
|
<input type="number" v-model="form.phone" placeholder="请输入手机号"/> |
||||||
|
</view> |
||||||
|
<view class="money codeContent"> |
||||||
|
<input v-model="form.code" class="codeInput" placeholder="请输入验证码"/> |
||||||
|
<view class="codeBtn" @click="getCodeHandle" v-if="canClick">获取验证码</view> |
||||||
|
<view class="codeBtn" v-if="!canClick">{{timeNum}}s后再次获取</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="submitBtn" @click="submitHandle"> |
||||||
|
确认转账 |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import { |
||||||
|
setCode,zhuanzhangApi |
||||||
|
} from '@/api/user.js' |
||||||
|
export default{ |
||||||
|
data(){ |
||||||
|
return{ |
||||||
|
form:{ |
||||||
|
money:null, |
||||||
|
account:null, |
||||||
|
phone:null, |
||||||
|
code:null, |
||||||
|
}, |
||||||
|
timer:null, |
||||||
|
timeNum:60, |
||||||
|
canClick:true, |
||||||
|
} |
||||||
|
}, |
||||||
|
beforeDestroy() { |
||||||
|
clearInterval(this.timer); |
||||||
|
}, |
||||||
|
methods:{ |
||||||
|
getCodeHandle(){ |
||||||
|
if(!this.form.phone){ |
||||||
|
uni.showToast({ |
||||||
|
title: '请输入手机号码', |
||||||
|
icon: 'none' |
||||||
|
}) |
||||||
|
return; |
||||||
|
} |
||||||
|
let reg = /^1[3-9]\d{9}$/ |
||||||
|
if(!reg.test(this.form.phone)){ |
||||||
|
uni.showToast({ |
||||||
|
title: '请输入正确的手机号码', |
||||||
|
icon: 'none' |
||||||
|
}) |
||||||
|
return; |
||||||
|
} |
||||||
|
setCode({phone:this.form.phone}).then(res => { |
||||||
|
uni.showToast({ |
||||||
|
title: res.message, |
||||||
|
icon: 'none' |
||||||
|
}) |
||||||
|
this.timeNum = 60; |
||||||
|
this.canClick = false; |
||||||
|
this.timer = setInterval(()=>{ |
||||||
|
if(this.timeNum==0){ |
||||||
|
clearInterval(this.timer); |
||||||
|
this.canClick = true; |
||||||
|
}else{ |
||||||
|
this.timeNum--; |
||||||
|
} |
||||||
|
},1000) |
||||||
|
}) |
||||||
|
|
||||||
|
}, |
||||||
|
submitHandle(){ |
||||||
|
if(!this.form.money){ |
||||||
|
uni.showToast({ |
||||||
|
title: '请输入转账金额', |
||||||
|
icon: 'none' |
||||||
|
}) |
||||||
|
return; |
||||||
|
} |
||||||
|
if(!this.form.account){ |
||||||
|
uni.showToast({ |
||||||
|
title: '请输入对方账号', |
||||||
|
icon: 'none' |
||||||
|
}) |
||||||
|
return; |
||||||
|
} |
||||||
|
if(!this.form.phone){ |
||||||
|
uni.showToast({ |
||||||
|
title: '请输入手机号码', |
||||||
|
icon: 'none' |
||||||
|
}) |
||||||
|
return; |
||||||
|
} |
||||||
|
let reg = /^1[3-9]\d{9}$/ |
||||||
|
if(!reg.test(this.form.phone)){ |
||||||
|
uni.showToast({ |
||||||
|
title: '请输入正确的手机号码', |
||||||
|
icon: 'none' |
||||||
|
}) |
||||||
|
return; |
||||||
|
} |
||||||
|
let params={ |
||||||
|
phone:this.form.phone, |
||||||
|
from_account:this.form.account, |
||||||
|
sms_code:this.form.code, |
||||||
|
money:this.form.money |
||||||
|
} |
||||||
|
zhuanzhangApi(params).then(res=>{ |
||||||
|
console.log(res,"00") |
||||||
|
}) |
||||||
|
|
||||||
|
|
||||||
|
}, |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped> |
||||||
|
.zhuanzhang{ |
||||||
|
min-height: calc(100vh); |
||||||
|
background: #F5F5F7; |
||||||
|
padding:34rpx 31rpx; |
||||||
|
.title{ |
||||||
|
font-weight: 400; |
||||||
|
font-size: 30rpx; |
||||||
|
color: #333333; |
||||||
|
} |
||||||
|
.num{ |
||||||
|
margin-top:39rpx; |
||||||
|
font-family: Alibaba PuHuiTi; |
||||||
|
font-weight: 400; |
||||||
|
font-size: 60rpx; |
||||||
|
color: #222222; |
||||||
|
} |
||||||
|
.form{ |
||||||
|
|
||||||
|
background: #FFFFFF; |
||||||
|
border-radius: 20rpx; |
||||||
|
padding:36rpx 30rpx; |
||||||
|
.title{ |
||||||
|
|
||||||
|
font-family: Alibaba PuHuiTi; |
||||||
|
font-weight: 400; |
||||||
|
font-size: 30rpx; |
||||||
|
color: #09090B; |
||||||
|
} |
||||||
|
.money{ |
||||||
|
padding:30rpx 0; |
||||||
|
border-bottom: 1px solid #EAEAEA; |
||||||
|
position: relative; |
||||||
|
input{ |
||||||
|
font-size: 28rpx; |
||||||
|
} |
||||||
|
text{ |
||||||
|
position: absolute; |
||||||
|
left:0; |
||||||
|
top:30rpx; |
||||||
|
font-weight: 400; |
||||||
|
font-size: 30rpx; |
||||||
|
color: #09090B; |
||||||
|
} |
||||||
|
.moneyInput{ |
||||||
|
padding-left: 40rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
.codeContent{ |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
.codeInput{ |
||||||
|
flex:1; |
||||||
|
} |
||||||
|
.codeBtn{ |
||||||
|
|
||||||
|
font-weight: 400; |
||||||
|
font-size: 30rpx; |
||||||
|
color: #116636; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
.submitBtn{ |
||||||
|
margin:40rpx 54rpx; |
||||||
|
background: linear-gradient(-90deg, #89B929, #116636); |
||||||
|
border-radius: 50px; |
||||||
|
padding:36rpx 0; |
||||||
|
font-weight: 500; |
||||||
|
font-size: 30rpx; |
||||||
|
color: #FFFFFF; |
||||||
|
text-align: center; |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
Loading…
Reference in new issue