接入密码找回功能
YunaiV
parent
592827bc3d
commit
475a681300
|
|
@ -5,6 +5,8 @@ export function sendSmsCode(mobile, scene) {
|
|||
return request.post('app-api/member/auth/send-sms-code', {
|
||||
mobile,
|
||||
scene
|
||||
}, {
|
||||
noAuth: true // TODO 芋艿：后续要做调整
|
||||
});
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -14,3 +14,15 @@ export function updateUser(data) {
|
|||
export function updateUserMobile(data) {
|
||||
return request.put('app-api/member/user/update-mobile', data);
|
||||
}
|
||||
|
||||
// 修改用户密码
|
||||
export function updateUserPassword(data) {
|
||||
return request.put('app-api/member/user/update-password', data);
|
||||
}
|
||||
|
||||
// 重置密码
|
||||
export function resetUserPassword(data) {
|
||||
return request.put('app-api/member/user/reset-password', data, {
|
||||
noAuth: true // TODO 芋艿：后续要做调整
|
||||
});
|
||||
}
|
||||
|
|
|
|||
|
|
@ -130,12 +130,6 @@
|
|||
"style": {
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "retrievePassword/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "忘记密码"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "user_info/index",
|
||||
"style": {
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
<template>
|
||||
<view class="register absolute">
|
||||
<view class="shading">
|
||||
<view class="pictrue acea-row row-center-wrapper">
|
||||
<image src="../../static/images/logo2.png"></image>
|
||||
<view class="pictrue acea-row row-center-wrapper">
|
||||
<image src="../../static/images/logo2.png" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="whiteBg">
|
||||
|
|
@ -10,13 +10,13 @@
|
|||
<view class="list">
|
||||
<view class="item">
|
||||
<view class="acea-row row-middle">
|
||||
<image src="/static/images/phone_1.png"></image>
|
||||
<input type="text" placeholder="输入手机号码" placeholder-class="placeholder" v-model="account" class="input"/>
|
||||
<image src="/static/images/phone_1.png" />
|
||||
<input type="text" placeholder="输入手机号码" placeholder-class="placeholder" v-model="mobile" class="input"/>
|
||||
</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="align-left acea-row row-middle">
|
||||
<image src="/static/images/code_2.png"></image>
|
||||
<view class="align-left acea-row row-middle">
|
||||
<image src="/static/images/code_2.png" />
|
||||
<input type="text" placeholder="填写验证码" class="codeIput" v-model="captcha" placeholder-class="placeholder"/>
|
||||
<button class="code" :disabled="disabled" :class="disabled === true ? 'on' : ''" @click="code">
|
||||
{{ text }}
|
||||
|
|
@ -25,27 +25,28 @@
|
|||
</view>
|
||||
<view class="item">
|
||||
<view class="acea-row row-middle">
|
||||
<image src="/static/images/code_1.png"></image>
|
||||
<image src="/static/images/code_1.png" />
|
||||
<input type="password" placeholder="填写您的登录密码" v-model="password" placeholder-class="placeholder" class="input"/>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="logon" @click="registerReset">确认</view>
|
||||
<navigator url="/pages/users/login/index" class="tip">
|
||||
<text class="font-color">立即登录</text>
|
||||
<navigator url="/pages/users/login/index" class="tip">
|
||||
<text class="font-color">立即登录</text>
|
||||
</navigator>
|
||||
</view>
|
||||
<view class="bottom"></view>
|
||||
<view class="bottom" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import sendVerifyCode from "@/mixins/SendVerifyCode";
|
||||
import { registerVerify, registerReset } from "@/api/user";
|
||||
export default {
|
||||
import * as AuthUtil from '@/api/member/auth.js';
|
||||
import * as UserApi from '@/api/member/user.js';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
account: "",
|
||||
mobile: "",
|
||||
password: "",
|
||||
captcha: ""
|
||||
};
|
||||
|
|
@ -53,67 +54,77 @@
|
|||
mixins: [sendVerifyCode],
|
||||
methods: {
|
||||
registerReset() {
|
||||
let that = this;
|
||||
if (!that.account) return that.$util.Tips({
|
||||
title: '请填写手机号码'
|
||||
});
|
||||
if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.account)) return that.$util.Tips({
|
||||
title: '请输入正确的手机号码'
|
||||
});
|
||||
if (!that.captcha) return that.$util.Tips({
|
||||
title: '请填写验证码'
|
||||
});
|
||||
if (!/^[\w\d]+$/i.test(that.captcha)) return that.$util.Tips({
|
||||
title: '请输入正确的验证码'
|
||||
});
|
||||
if (!that.password) return that.$util.Tips({
|
||||
title: '请填写密码'
|
||||
});
|
||||
if (!/^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,16}$/i.test(that.password)) return that.$util.Tips({
|
||||
title: '您输入的密码过于简单'
|
||||
});
|
||||
registerReset({
|
||||
account: that.account,
|
||||
captcha: that.captcha,
|
||||
password: that.password
|
||||
})
|
||||
.then(res => {
|
||||
that.$util.Tips({
|
||||
title: res,
|
||||
success: () => {
|
||||
uni.navigateTo({
|
||||
url: '/pages/login/index'
|
||||
});
|
||||
}
|
||||
});
|
||||
})
|
||||
.catch(res => {
|
||||
that.$util.Tips({
|
||||
title: res
|
||||
});
|
||||
});
|
||||
if (!this.mobile) {
|
||||
return this.$util.Tips({
|
||||
title: '请填写手机号码'
|
||||
});
|
||||
}
|
||||
if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(this.mobile)) {
|
||||
return this.$util.Tips({
|
||||
title: '请输入正确的手机号码'
|
||||
});
|
||||
}
|
||||
if (!this.captcha) {
|
||||
return this.$util.Tips({
|
||||
title: '请填写验证码'
|
||||
});
|
||||
}
|
||||
if (!/^[\w\d]+$/i.test(this.captcha)) {
|
||||
return this.$util.Tips({
|
||||
title: '请输入正确的验证码'
|
||||
});
|
||||
}
|
||||
if (!this.password) {
|
||||
return this.$util.Tips({
|
||||
title: '请填写密码'
|
||||
});
|
||||
}
|
||||
if (!/^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,16}$/i.test(this.password)) {
|
||||
return this.$util.Tips({
|
||||
title: '您输入的密码过于简单'
|
||||
});
|
||||
}
|
||||
UserApi.resetUserPassword({
|
||||
mobile: this.mobile,
|
||||
code: this.captcha,
|
||||
password: this.password
|
||||
}).then(res => {
|
||||
return this.$util.Tips({
|
||||
title: '密码找回成功',
|
||||
icon: 'success'
|
||||
}, {
|
||||
tab: 5,
|
||||
url: '/pages/users/login/index'
|
||||
});
|
||||
}).catch(res => {
|
||||
this.$util.Tips({
|
||||
title: res
|
||||
});
|
||||
});
|
||||
},
|
||||
async code() {
|
||||
let that = this;
|
||||
if (!that.account) return that.$util.Tips({
|
||||
title: '请填写手机号码'
|
||||
});
|
||||
if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.account)) return that.$util.Tips({
|
||||
title: '请输入正确的手机号码'
|
||||
});
|
||||
registerVerify({ phone: that.account })
|
||||
.then(res => {
|
||||
that.$util.Tips({
|
||||
title: res
|
||||
});
|
||||
that.sendCode();
|
||||
})
|
||||
.catch(res => {
|
||||
that.$util.Tips({
|
||||
title: res
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
async code() {
|
||||
if (!this.mobile) {
|
||||
return this.$util.Tips({
|
||||
title: '请填写手机号码'
|
||||
});
|
||||
}
|
||||
if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(this.mobile)) {
|
||||
return this.$util.Tips({
|
||||
title: '请输入正确的手机号码'
|
||||
});
|
||||
}
|
||||
AuthUtil.sendSmsCode(this.mobile, 4).then(res => {
|
||||
this.$util.Tips({
|
||||
title: res
|
||||
});
|
||||
this.sendCode();
|
||||
}).catch(res => {
|
||||
this.$util.Tips({
|
||||
title: res
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,161 +0,0 @@
|
|||
<template>
|
||||
<div class="register absolute">
|
||||
<div class="shading">
|
||||
<div class="pictrue acea-row row-center-wrapper">
|
||||
<image src="../../../static/images/logo2.png" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="whiteBg">
|
||||
<div class="title">找回密码</div>
|
||||
<div class="list">
|
||||
<div class="item">
|
||||
<div class="acea-row row-middle">
|
||||
<image src="/static/images/phone_1.png"></image>
|
||||
<input type="text" placeholder="输入手机号码" v-model="account" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
|
||||
<div class="acea-row row-middle">
|
||||
<image src="/static/images/code_2.png"></image>
|
||||
<input type="text" placeholder="填写验证码" class="codeIput" v-model="captcha" />
|
||||
<button class="code" :disabled="disabled" :class="disabled === true ? 'on' : ''" @click="code">
|
||||
{{ text }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="acea-row row-middle">
|
||||
<image src="/static/images/code_2.png"></image>
|
||||
<input type="password" placeholder="填写您的新密码" v-model="password" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="item" v-if="isShowCode">
|
||||
<div class="align-left">
|
||||
<input type="text" placeholder="填写验证码" class="codeIput" v-model="codeVal" />
|
||||
<div class="code" @click="again"><img :src="codeUrl" /></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="logon" @click="registerReset">确认</div>
|
||||
<div class="tip">
|
||||
<span class="font-color-red" @click="back">立即登录</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bottom"></div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import sendVerifyCode from "@/mixins/SendVerifyCode";
|
||||
import {
|
||||
registerVerify,
|
||||
registerReset,
|
||||
getCodeApi
|
||||
} from "@/api/user";
|
||||
// import { validatorDefaultCatch } from "@/utils/dialog";
|
||||
// import attrs, { required, alpha_num, chs_phone } from "@utils/validate";
|
||||
// import { VUE_APP_API_URL } from "@utils";
|
||||
|
||||
export default {
|
||||
name: "RetrievePassword",
|
||||
data: function() {
|
||||
return {
|
||||
account: "",
|
||||
password: "",
|
||||
captcha: "",
|
||||
keyCode: "",
|
||||
codeUrl: "",
|
||||
codeVal: "",
|
||||
isShowCode: false
|
||||
};
|
||||
},
|
||||
mixins: [sendVerifyCode],
|
||||
mounted: function() {
|
||||
this.getCode();
|
||||
},
|
||||
methods: {
|
||||
back() {
|
||||
uni.navigateBack();
|
||||
},
|
||||
again() {
|
||||
this.codeUrl =
|
||||
VUE_APP_API_URL + "/captcha?" + this.keyCode + Date.parse(new Date());
|
||||
},
|
||||
getCode() {
|
||||
getCodeApi()
|
||||
.then(res => {
|
||||
this.keyCode = res.data.key;
|
||||
})
|
||||
.catch(res => {
|
||||
this.$dialog.error(res.msg);
|
||||
});
|
||||
},
|
||||
async registerReset() {
|
||||
var that = this;
|
||||
if (!that.account) return that.$util.Tips({
|
||||
title: '请填写手机号码'
|
||||
});
|
||||
if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.account)) return that.$util.Tips({
|
||||
title: '请输入正确的手机号码'
|
||||
});
|
||||
if (!that.captcha) return that.$util.Tips({
|
||||
title: '请填写验证码'
|
||||
});
|
||||
registerReset({
|
||||
account: that.account,
|
||||
captcha: that.captcha,
|
||||
password: that.password,
|
||||
code: that.codeVal
|
||||
})
|
||||
.then(res => {
|
||||
that.$util.Tips({
|
||||
title: res.message
|
||||
}, {
|
||||
tab: 3
|
||||
})
|
||||
})
|
||||
.catch(res => {
|
||||
that.$util.Tips({
|
||||
title: res
|
||||
})
|
||||
});
|
||||
},
|
||||
async code() {
|
||||
let that = this;
|
||||
if (!that.account) return that.$util.Tips({
|
||||
title: '请填写手机号码'
|
||||
});
|
||||
if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.account)) return that.$util.Tips({
|
||||
title: '请输入正确的手机号码'
|
||||
});
|
||||
if (that.formItem == 2) that.type = "register";
|
||||
await registerVerify({
|
||||
phone: that.account,
|
||||
type: that.type,
|
||||
key: that.keyCode,
|
||||
code: that.codeVal
|
||||
})
|
||||
.then(res => {
|
||||
that.$dialog.success(res.message);
|
||||
that.sendCode();
|
||||
})
|
||||
.catch(res => {
|
||||
// if (res.data.status === 402) {
|
||||
// that.codeUrl = `${VUE_APP_API_URL}/sms_captcha?key=${that.keyCode}`;
|
||||
// that.isShowCode = true;
|
||||
// }
|
||||
that.$util.Tips({
|
||||
title: res
|
||||
});
|
||||
});
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style scoped>
|
||||
.code img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -122,7 +122,7 @@
|
|||
oldCode: this.captcha
|
||||
}).then(res => {
|
||||
return this.$util.Tips({
|
||||
title: res.message,
|
||||
title: '手机修改成功',
|
||||
icon: 'success'
|
||||
}, {
|
||||
tab: 5,
|
||||
|
|
|
|||
|
|
@ -2,16 +2,18 @@
|
|||
<view>
|
||||
<view class="ChangePassword">
|
||||
<form @submit="editPwd" report-submit='true'>
|
||||
<view class="phone">当前手机号：{{phone}}</view>
|
||||
<view class="phone">当前手机号：{{ userInfo.mobile }}</view>
|
||||
<view class="list">
|
||||
<view class="item">
|
||||
<input type='password' placeholder='以字母开头，长度在6~18之间，只能包含字符、数字和下划线' placeholder-class='placeholder' name="password" :value="password"></input>
|
||||
<input type='password' placeholder='以字母开头，长度在6~18之间，只能包含字符、数字和下划线'
|
||||
placeholder-class='placeholder' name="password" :value="password" />
|
||||
</view>
|
||||
<view class="item">
|
||||
<input type='password' placeholder='确认新密码' placeholder-class='placeholder' name="qr_password" :value="qr_password"></input>
|
||||
<input type='password' placeholder='确认新密码' placeholder-class='placeholder'
|
||||
name="qr_password" :value="qr_password" />
|
||||
</view>
|
||||
<view class="item acea-row row-between-wrapper">
|
||||
<input type='number' placeholder='填写验证码' placeholder-class='placeholder' class="codeIput" name="captcha" :value="captcha"></input>
|
||||
<input type='number' placeholder='填写验证码' placeholder-class='placeholder' class="codeIput" name="captcha" :value="captcha" />
|
||||
<button class="code font-color" :class="disabled === true ? 'on' : ''" :disabled='disabled' @click="code">
|
||||
{{ text }}
|
||||
</button>
|
||||
|
|
@ -20,105 +22,41 @@
|
|||
<button form-type="submit" class="confirmBnt bg-color">确认修改</button>
|
||||
</form>
|
||||
</view>
|
||||
<!-- #ifdef MP -->
|
||||
<!-- <authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize> -->
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import sendVerifyCode from "@/mixins/SendVerifyCode";
|
||||
import {
|
||||
phoneRegisterReset,
|
||||
registerVerify
|
||||
} from '@/api/api.js';
|
||||
import {
|
||||
getUserInfo
|
||||
} from '@/api/user.js';
|
||||
import {
|
||||
toLogin
|
||||
} from '@/libs/login.js';
|
||||
import {
|
||||
mapGetters
|
||||
} from "vuex";
|
||||
// #ifdef MP
|
||||
import authorize from '@/components/Authorize';
|
||||
// #endif
|
||||
export default {
|
||||
mixins: [sendVerifyCode],
|
||||
components: {
|
||||
// #ifdef MP
|
||||
authorize
|
||||
// #endif
|
||||
},
|
||||
import { mapGetters } from "vuex";
|
||||
import sendVerifyCode from "@/mixins/SendVerifyCode";
|
||||
import * as AuthUtil from '@/api/member/auth.js';
|
||||
import * as UserApi from '@/api/member/user.js';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
userInfo: {},
|
||||
phone: '',
|
||||
password: '',
|
||||
captcha: '',
|
||||
qr_password: '',
|
||||
isAuto: false, //没有授权的不会自动授权
|
||||
isShowAuth: false //是否隐藏授权
|
||||
qr_password: '',
|
||||
captcha: '',
|
||||
};
|
||||
},
|
||||
computed: mapGetters(['isLogin']),
|
||||
watch:{
|
||||
isLogin:{
|
||||
handler:function(newV,oldV){
|
||||
if(newV){
|
||||
this.getUserInfo();
|
||||
}
|
||||
},
|
||||
deep:true
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
if (this.isLogin) {
|
||||
this.getUserInfo();
|
||||
} else {
|
||||
toLogin();
|
||||
}
|
||||
},
|
||||
mixins: [sendVerifyCode],
|
||||
computed: mapGetters(['isLogin', 'userInfo']),
|
||||
methods: {
|
||||
/**
|
||||
* 授权回调
|
||||
*/
|
||||
onLoadFun: function(e) {
|
||||
this.getUserInfo();
|
||||
},
|
||||
// 授权关闭
|
||||
authColse: function(e) {
|
||||
this.isShowAuth = e
|
||||
},
|
||||
/**
|
||||
* 获取个人用户信息
|
||||
*/
|
||||
getUserInfo: function() {
|
||||
let that = this;
|
||||
getUserInfo().then(res => {
|
||||
let tel = res.data.phone;
|
||||
let phone = tel.substr(0, 3) + "****" + tel.substr(7);
|
||||
that.$set(that, 'userInfo', res.data);
|
||||
that.phone = phone;
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 发送验证码
|
||||
*
|
||||
*/
|
||||
async code() {
|
||||
let that = this;
|
||||
if (!that.userInfo.phone) return that.$util.Tips({
|
||||
title: '手机号码不存在,无法发送验证码！'
|
||||
});
|
||||
await registerVerify(that.userInfo.phone).then(res => {
|
||||
that.$util.Tips({
|
||||
title: res.message
|
||||
if (!this.userInfo.mobile) {
|
||||
return this.$util.Tips({
|
||||
title: '手机号码不存在，无法发送验证码！'
|
||||
});
|
||||
}
|
||||
await AuthUtil.sendSmsCode(this.userInfo.mobile, 3).then(res => {
|
||||
this.$util.Tips({
|
||||
title: '验证码已发送'
|
||||
});
|
||||
that.sendCode();
|
||||
this.sendCode();
|
||||
}).catch(err => {
|
||||
return that.$util.Tips({
|
||||
return this.$util.Tips({
|
||||
title: err
|
||||
});
|
||||
});
|
||||
|
|
@ -126,38 +64,43 @@
|
|||
|
||||
/**
|
||||
* H5登录 修改密码
|
||||
*
|
||||
*/
|
||||
editPwd: function(e) {
|
||||
let that = this,
|
||||
password = e.detail.value.password,
|
||||
qr_password = e.detail.value.qr_password,
|
||||
captcha = e.detail.value.captcha;
|
||||
if (!password) return that.$util.Tips({
|
||||
title: '请输入新密码'
|
||||
});
|
||||
if (!/^[a-zA-Z]\w{5,17}$/i.test(password)) return that.$util.Tips({
|
||||
title: '以字母开头，长度在6~18之间，只能包含字符、数字和下划线'
|
||||
});
|
||||
if (qr_password != password) return that.$util.Tips({
|
||||
title: '两次输入的密码不一致！'
|
||||
});
|
||||
if (!captcha) return that.$util.Tips({
|
||||
title: '请输入验证码'
|
||||
});
|
||||
phoneRegisterReset({
|
||||
account: that.userInfo.phone,
|
||||
captcha: captcha,
|
||||
const password = e.detail.value.password;
|
||||
const qr_password = e.detail.value.qr_password;
|
||||
const captcha = e.detail.value.captcha;
|
||||
if (!password) {
|
||||
return this.$util.Tips({
|
||||
title: '请输入新密码'
|
||||
});
|
||||
}
|
||||
if (!/^[a-zA-Z]\w{5,17}$/i.test(password)) {
|
||||
return this.$util.Tips({
|
||||
title: '以字母开头，长度在6~18之间，只能包含字符、数字和下划线'
|
||||
});
|
||||
}
|
||||
if (qr_password !== password) {
|
||||
return this.$util.Tips({
|
||||
title: '两次输入的密码不一致！'
|
||||
});
|
||||
}
|
||||
if (!captcha) {
|
||||
return this.$util.Tips({
|
||||
title: '请输入验证码'
|
||||
});
|
||||
}
|
||||
UserApi.updateUserPassword({
|
||||
code: captcha,
|
||||
password: password
|
||||
}).then(res => {
|
||||
return that.$util.Tips({
|
||||
title: res.message
|
||||
return this.$util.Tips({
|
||||
title: '修改成功'
|
||||
}, {
|
||||
tab: 3,
|
||||
url: 1
|
||||
});
|
||||
}).catch(err => {
|
||||
return that.$util.Tips({
|
||||
return this.$util.Tips({
|
||||
title: err
|
||||
});
|
||||
});
|
||||
|
|
@ -165,7 +108,6 @@
|
|||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: #fff !important;
|
||||
|
|
|
|||
Loading…
Reference in New Issue