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.
98 lines
1.8 KiB
98 lines
1.8 KiB
2 years ago
|
<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>
|