project init
This commit is contained in:
zxy
201
pageMy/setUserBase/seal/forget.vue
Normal file
201
pageMy/setUserBase/seal/forget.vue
Normal file
@@ -0,0 +1,201 @@
|
||||
<template>
|
||||
<view class="forget">
|
||||
<view class="phone">
|
||||
手机号： {{phoneFilter(userInfo.user_name)}}
|
||||
</view>
|
||||
<view class="codeBox">
|
||||
<jl-input type="number" v-model="code" placeholder="请输入验证码"></jl-input>
|
||||
<view v-if="action === 'can'" class="code" @click="getCode">
|
||||
获取验证码
|
||||
</view>
|
||||
<view v-else-if="action === 'wait'" class="code">
|
||||
获取验证码({{codeint}}s)
|
||||
</view>
|
||||
<view v-else-if="action === 'sending'" class="code">
|
||||
发送中...
|
||||
</view>
|
||||
</view>
|
||||
<jl-input type="number" :maxlength="maxlength" v-model="password" placeholder="请输入六位数字密码" @confirm="regPassword" showPassword clearable></jl-input>
|
||||
<jl-input type="number" :maxlength="maxlength" v-model="newPassword" placeholder="请再次输入六位数字密码" @confirm="regNewPassword" showPassword clearable></jl-input>
|
||||
<view v-if="error" class="error">两次密码输入不一致，请重新输入</view>
|
||||
<view class="btn">
|
||||
<view v-if="loading" class="bottombtn nocheck">提交中</view>
|
||||
<view v-else-if="!validate" class="bottombtn nocheck">确认</view>
|
||||
<view v-else @click="submit" class="bottombtn">确认</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {mapGetters} from 'vuex'
|
||||
import {
|
||||
phoneFilter
|
||||
} from '@/untils/format.js'
|
||||
import jlInput from '@/components/jl-input/main.vue'
|
||||
import {sendValidate, resetPass} from '@/api/auth.js'
|
||||
import {
|
||||
forgetPW,
|
||||
accountsendValidate,
|
||||
getCaptcha,
|
||||
validateCode
|
||||
} from '@/api/forgetPW.js'
|
||||
const resendTime = 120
|
||||
export default{
|
||||
data () {
|
||||
return {
|
||||
code: '',
|
||||
password: '',
|
||||
newPassword: '',
|
||||
action: 'can',
|
||||
maxlength: 6,
|
||||
codeint: resendTime,
|
||||
loading: false,
|
||||
error: false,
|
||||
defCount:5,//默认发送短信次数
|
||||
}
|
||||
},
|
||||
onLoad(options) {
|
||||
if (options.forget) {
|
||||
uni.setNavigationBarTitle({
|
||||
title:'忘记密码'
|
||||
})
|
||||
}
|
||||
},
|
||||
components:{jlInput},
|
||||
methods: {
|
||||
phoneFilter,
|
||||
setTimer() {
|
||||
var sendCode = setInterval(() => {
|
||||
this.codeint -= 1;
|
||||
if (this.codeint <= 0) {
|
||||
this.action = 'can'
|
||||
this.codeint = resendTime;
|
||||
clearInterval(sendCode);
|
||||
return;
|
||||
}
|
||||
}, 1000)
|
||||
},
|
||||
getCode: function() {
|
||||
if (this.action !== 'can') {
|
||||
return;
|
||||
}
|
||||
this.action = 'sending';
|
||||
sendValidate(this.userInfo.user_name).then((res) => {
|
||||
if(res.data.code==200){
|
||||
let count=res.data.data;
|
||||
let diffCount=this.defCount-count;//剩余获取短信次数
|
||||
if(count>1 && count<=5){
|
||||
uni.showToast({
|
||||
title:`今日验证码已获取${count}次，还有${diffCount}次获取机会`,
|
||||
icon:'none',
|
||||
duration:3000
|
||||
})
|
||||
}
|
||||
this.action = 'wait'
|
||||
this.setTimer()
|
||||
}
|
||||
this.loading = false
|
||||
}).catch(() => {
|
||||
this.action='can'
|
||||
this.loading = false
|
||||
this.$refs.code.refushCode()
|
||||
})
|
||||
},
|
||||
submit(){
|
||||
if (this.password !== this.newPassword){
|
||||
this.error = true
|
||||
return
|
||||
}
|
||||
this.loading = true
|
||||
resetPass(this.userInfo.user_name, this.code, this.password).then(()=>{
|
||||
this.loading = false
|
||||
uni.showToast({
|
||||
title: '重置密码成功',
|
||||
icon: false
|
||||
})
|
||||
setTimeout(() => {
|
||||
uni.navigateBack()
|
||||
}, 1000)
|
||||
}).catch(()=>{
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
regPassword(){
|
||||
if(this.password.length !== 6) {
|
||||
uni.showToast({
|
||||
title: '请设置长度6位的密码',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
},
|
||||
regNewPassword(){
|
||||
if(this.newPassword.length !== 6) {
|
||||
uni.showToast({
|
||||
title: '请设置长度6位的密码',
|
||||
icon: 'none'
|
||||
});
|
||||
} else if (this.password !== this.newPassword) {
|
||||
this.error = true
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['realName', 'userInfo']),
|
||||
validate() {
|
||||
return this.password.length ===6 && this.newPassword.length === 6 && this.code
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.error {
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 32rpx;
|
||||
color: red;
|
||||
}
|
||||
.forget{
|
||||
padding: 90rpx 80rpx 0 80rpx;
|
||||
.phone{
|
||||
height: 50rpx;
|
||||
font-size: 36rpx;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
line-height: 50rpx;margin-bottom: 90rpx;
|
||||
}
|
||||
}
|
||||
.codeBox{
|
||||
position: relative;
|
||||
.code{
|
||||
z-index: 999;
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right:14px;
|
||||
height: 60rpx;
|
||||
line-height: 60rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: 400;
|
||||
color: #1B66FF;
|
||||
line-height: 38rpx;
|
||||
|
||||
}
|
||||
}
|
||||
.nocheck {
|
||||
opacity: 0.3;
|
||||
}
|
||||
.bottombtn {
|
||||
background-color: #1B66FF;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
border-radius: 10rpx;
|
||||
font-family: PingFangSC-Medium;
|
||||
font-size: 32rpx;
|
||||
height: 90rpx;
|
||||
line-height: 90rpx;
|
||||
}
|
||||
|
||||
.btn {
|
||||
background-color: #fefefe;
|
||||
padding: 70rpx 80rpx;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user