You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
97 lines
1.8 KiB
97 lines
1.8 KiB
<template> |
|
<view> |
|
<view class="form_body" style=""> |
|
<view class="form_body_title"> |
|
登陆账户<br/> |
|
<text class="form_body_title_text"> |
|
验证码已发送至 |
|
</text> |
|
<text style="font-weight: 600;" class="form_body_title_text">{{phone}}</text> |
|
</view> |
|
<view style=" background-color: #f0f2ff; border-radius: 0;" class="form_body_input"> |
|
<xt-verify-code style="width: 100%;" v-model="verifyCode" @confirm="confirm"></xt-verify-code> |
|
</view> |
|
<view class="switch"> |
|
<view @tap="switchFn">密码登录</view> |
|
<view style="font-size: 26rpx;color: #2866FF;" @tap="senFn">{{timer.time==0? timer.timeText:timer.time+'s'}}</view> |
|
</view> |
|
</view> |
|
</view> |
|
</template> |
|
|
|
<script> |
|
export default { |
|
props:{ |
|
phone:{ |
|
type:String, |
|
default:'' |
|
} |
|
}, |
|
data() { |
|
return { |
|
value: '', |
|
timer:{ |
|
time:60, |
|
timeText:'重新发送' |
|
}, |
|
verifyCode:'', |
|
range: [{ |
|
"value": 0, |
|
"text": "" |
|
}] |
|
} |
|
}, |
|
created() { |
|
this.timerFn() |
|
}, |
|
methods: { |
|
senFn(){ |
|
if(this.timer.time!==0) return; |
|
this.timer.time = 60 |
|
this.timerFn() |
|
}, |
|
timerFn(){ |
|
let that = this |
|
let time = setInterval(() => { |
|
console.log('定时器启动') |
|
that.timer.time--; |
|
if(that.timer.time == 0){ |
|
clearInterval(time) |
|
} |
|
}, 1000); |
|
}, |
|
switchFn(){ |
|
let that = this |
|
uni.$emit('state',{ |
|
state:1, |
|
phone:that.phone |
|
}) |
|
}, |
|
confirm(e){ |
|
if(e){ |
|
console.log(e) |
|
} |
|
console.log(this.verifyCode,'验证码') |
|
}, |
|
sumit(){ |
|
console.log(1) |
|
} |
|
} |
|
} |
|
</script> |
|
|
|
<style> |
|
.switch{ |
|
font-size: 28rpx; |
|
font-weight: 500; |
|
color: #000000; |
|
margin-top: 21rpx; |
|
margin-left:29rpx; |
|
display: flex; |
|
justify-content: space-between; |
|
} |
|
.form_body_title_text{ |
|
font-size: 28rpx; |
|
color: #333333; |
|
} |
|
</style>
|
|
|