用户密码重置和忘记密码调整
This commit is contained in:
parent
aef684e320
commit
2eca40ba41
@ -238,3 +238,34 @@ export function registerUser(data) {
|
||||
data
|
||||
});
|
||||
}
|
||||
/** 超管重置用户密码 */
|
||||
export function adminResetUserPassword(userId) {
|
||||
return request({
|
||||
url: `/api/userinfo/${userId}/reset/pwd`,
|
||||
method: 'put'
|
||||
});
|
||||
}
|
||||
/** 找回密码 */
|
||||
export function findPassword(data) {
|
||||
return request({
|
||||
url: `/api/userinfo/retrieve/pwd`,
|
||||
method: 'put',
|
||||
data
|
||||
});
|
||||
}
|
||||
/** 发送手机验证码 */
|
||||
export function sendPhoneVfcode(data) {
|
||||
return request({
|
||||
url: '/api/userinfo/mobile/code',
|
||||
method: 'post',
|
||||
data
|
||||
});
|
||||
}
|
||||
/** 发送邮箱验证码 */
|
||||
export function sendEmailVfcode(params) {
|
||||
return request({
|
||||
url: '/api/userinfo/email/code',
|
||||
method: 'post',
|
||||
params
|
||||
});
|
||||
}
|
||||
|
262
src/views/login/forgetPassword.vue
Normal file
262
src/views/login/forgetPassword.vue
Normal file
@ -0,0 +1,262 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
:title="title"
|
||||
:visible.sync="dialogShow"
|
||||
width="500px"
|
||||
:before-close="doClose"
|
||||
:z-index="9000"
|
||||
:show-close="false"
|
||||
:close-on-click-modal="false"
|
||||
top="25vh"
|
||||
>
|
||||
<el-form ref="ruleForm" :model="form" :rules="rules" label-width="110px" class="demo-ruleForm">
|
||||
<el-form-item prop="type">
|
||||
<template slot="label">
|
||||
<span>找回途径:</span>
|
||||
</template>
|
||||
<el-radio-group v-model="form.type" size="small">
|
||||
<el-radio label="phone" border>手机号找回</el-radio>
|
||||
<el-radio label="email" border>邮箱找回</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="form.type === 'email'" prop="email">
|
||||
<template slot="label">
|
||||
<span>邮  箱:</span>
|
||||
</template>
|
||||
<el-input v-model="form.email" size="small" style="width: 200px;" />
|
||||
</el-form-item>
|
||||
<el-form-item v-if="form.type === 'phone'" prop="phone">
|
||||
<template slot="label">
|
||||
<span>手机号:</span>
|
||||
</template>
|
||||
<el-input v-model="form.phone" size="small" style="width: 200px;" />
|
||||
</el-form-item>
|
||||
<el-form-item label="密码:" prop="password">
|
||||
<template slot="label">
|
||||
<span>密  码:</span>
|
||||
</template>
|
||||
<el-input v-model="form.password" size="small" autocomplete="new-password" show-password style="width: 200px;" />
|
||||
</el-form-item>
|
||||
<el-form-item label="密码确认:" prop="repeatPassword">
|
||||
<el-input v-model="form.repeatPassword" size="small" autocomplete="new-password" show-password style="width: 200px;" />
|
||||
</el-form-item>
|
||||
<el-form-item prop="vfCode">
|
||||
<template slot="label">
|
||||
<span>验证码:</span>
|
||||
</template>
|
||||
<el-input v-model="form.vfCode" size="small" style="display: inline-block;width: 200px" />
|
||||
<el-button
|
||||
size="small"
|
||||
type="primary"
|
||||
style="margin-top: 10px; margin-right: 10px;"
|
||||
:disabled="passWordCodeTime != 0"
|
||||
@click="sendVfcode"
|
||||
>
|
||||
{{ $t('global.sendCode') }}
|
||||
<span
|
||||
v-if="passWordCodeTime"
|
||||
>{{ passWordCodeTime }}</span>
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
<div style="display: flex;justify-content: space-around;">
|
||||
<el-button type="primary" size="small" @click="submitForm()">找回</el-button>
|
||||
<el-button size="small" @click="doClose()">返回登录</el-button>
|
||||
</div>
|
||||
</el-form>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { findPassword, sendPhoneVfcode, sendEmailVfcode } from '@/api/management/user';
|
||||
import md5 from 'js-md5';
|
||||
import {clearInterval, setInterval} from 'timers';
|
||||
export default {
|
||||
name: 'ForgetPassword',
|
||||
|
||||
data() {
|
||||
var validateEmail = (rule, value, callback) => {
|
||||
const regu = /^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/;
|
||||
const re = new RegExp(regu);
|
||||
if (!re.test(value) ) {
|
||||
callback(new Error('邮箱格式不正确'));
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
};
|
||||
var validatePhone = (rule, value, callback) => {
|
||||
const regu = /^1(3[0-9]|4[5,7]|5[0,1,2,3,5,6,7,8,9]|6[2,5,6,7]|7[0,1,7,8]|8[0-9]|9[1,8,9])\d{8}$/;
|
||||
const re = new RegExp(regu);
|
||||
if (!re.test(value)) {
|
||||
callback(new Error('手机号格式不正确'));
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
};
|
||||
var validatePassword = (rule, value, callback) => {
|
||||
if (this.form.repeatPassword) {
|
||||
this.$refs.ruleForm.validateField('repeatPassword');
|
||||
}
|
||||
callback();
|
||||
};
|
||||
var validateRepeatPassword = (rule, value, callback) => {
|
||||
if (value !== this.form.password) {
|
||||
callback(new Error('两次密码不相同,请确认密码'));
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
};
|
||||
var validateVfCode = (rule, value, callback) => {
|
||||
if (this.form.vfCode.length !== 4) {
|
||||
callback(new Error('验证码长度错误'));
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
};
|
||||
return {
|
||||
dialogShow: false,
|
||||
message: '',
|
||||
operation: '',
|
||||
title: '密码找回',
|
||||
passWordTime: null,
|
||||
form: {
|
||||
type: 'phone',
|
||||
phone: '',
|
||||
email: '',
|
||||
password: '',
|
||||
repeatPassword: '',
|
||||
vfCode: ''
|
||||
},
|
||||
passWordCodeTime: 0,
|
||||
rules: {
|
||||
phone: [
|
||||
{ required: true, message: '请输入手机号', trigger: 'blur' },
|
||||
{ validator: validatePhone, trigger: 'blur' }
|
||||
],
|
||||
email: [
|
||||
{ required: true, message: '请输入邮箱', trigger: 'blur' },
|
||||
{ validator: validateEmail, trigger: 'blur' }
|
||||
],
|
||||
password: [
|
||||
{ required: true, message: '请输入密码', trigger: 'blur' },
|
||||
{ validator: validatePassword, trigger: 'blur' },
|
||||
{ min: 5, max: 20, message: '长度在 5 到 20 个字符', trigger: 'blur' }
|
||||
],
|
||||
repeatPassword: [
|
||||
{ required: true, message: '请重复输入密码', trigger: 'blur' },
|
||||
{ validator: validateRepeatPassword, trigger: 'blur' },
|
||||
{ min: 5, max: 20, message: '长度在 5 到 20 个字符', trigger: 'blur' }
|
||||
],
|
||||
vfCode: [
|
||||
{ required: true, message: '请输入验证码', trigger: 'blur' },
|
||||
{ validator: validateVfCode, trigger: 'blur' }
|
||||
]
|
||||
}
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
methods: {
|
||||
doShow() {
|
||||
this.form = {
|
||||
type: 'phone',
|
||||
phone: '',
|
||||
email: '',
|
||||
password: '',
|
||||
repeatPassword: '',
|
||||
vfCode: ''
|
||||
};
|
||||
this.dialogShow = true;
|
||||
},
|
||||
doClose() {
|
||||
this.dialogShow = false;
|
||||
this.form = {
|
||||
type: 'phone',
|
||||
phone: '',
|
||||
email: '',
|
||||
password: '',
|
||||
repeatPassword: '',
|
||||
vfCode: ''
|
||||
};
|
||||
this.$refs.ruleForm.clearValidate();
|
||||
},
|
||||
async sendVfcode() {
|
||||
const reguEmail = /^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/;
|
||||
const reguPhone = /^1(3[0-9]|4[5,7]|5[0,1,2,3,5,6,7,8,9]|6[2,5,6,7]|7[0,1,7,8]|8[0-9]|9[1,8,9])\d{8}$/;
|
||||
const rePhone = new RegExp(reguPhone);
|
||||
const reEmail = new RegExp(reguEmail);
|
||||
if (this.form.type === 'phone' && this.form.phone && rePhone.test(this.form.phone)) {
|
||||
const random = Math.floor(Math.random() * 10000 + 1);
|
||||
const timeCount = Date.parse(new Date()) / 1000;
|
||||
const pass = `${timeCount}86${this.form.phone}${random}`;
|
||||
const param = {
|
||||
mobile: this.form.phone,
|
||||
nationCode: '86',
|
||||
rd: random + '',
|
||||
time: timeCount + '',
|
||||
token: md5(pass)
|
||||
};
|
||||
try {
|
||||
this.passWordCodeTime = 60;
|
||||
this.passWordTime = setInterval(() => {
|
||||
this.passWordCodeTime--;
|
||||
if (this.passWordCodeTime <= 0) {
|
||||
this.passWordCodeTime = 0;
|
||||
clearInterval(this.mobileTime);
|
||||
this.passWordTime = null;
|
||||
}
|
||||
}, 1000);
|
||||
await sendPhoneVfcode(param);
|
||||
} catch (error) {
|
||||
this.$message.info(this.$t('global.codeFaile'));
|
||||
}
|
||||
} else if (this.form.type === 'email' && this.form.email && reEmail.test(this.form.email)) {
|
||||
const param = { email: this.form.email };
|
||||
try {
|
||||
this.passWordCodeTime = 60;
|
||||
this.passWordTime = setInterval(() => {
|
||||
this.passWordCodeTime--;
|
||||
if (this.passWordCodeTime <= 0) {
|
||||
this.passWordCodeTime = 0;
|
||||
clearInterval(this.mobileTime);
|
||||
this.passWordTime = null;
|
||||
}
|
||||
}, 1000);
|
||||
await sendEmailVfcode(param);
|
||||
} catch (error) {
|
||||
this.$message.info(this.$t('global.codeFaile'));
|
||||
}
|
||||
} else {
|
||||
this.$refs.ruleForm.validateField('email');
|
||||
this.$refs.ruleForm.validateField('phone');
|
||||
}
|
||||
},
|
||||
submitForm() {
|
||||
this.$refs.ruleForm.validate((valid) => {
|
||||
if (valid) {
|
||||
const data = { email: this.form.email, mobile: this.form.phone, newPwd: md5(this.form.password), vfCode: this.form.vfCode };
|
||||
findPassword(data).then(resp => {
|
||||
this.$message.success('设置密码成功!' );
|
||||
this.doClose();
|
||||
}).catch(error => {
|
||||
this.$message.error('设置密码失败:' + error.message);
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
</script>
|
||||
<style scoped>
|
||||
.confirm-control-speed .context {
|
||||
padding-bottom: 40px !important;
|
||||
border: 1px solid lightgray;
|
||||
}
|
||||
.ningbo-01__systerm .el-dialog .el-button{
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
}
|
||||
</style>
|
@ -100,6 +100,9 @@
|
||||
{{ $t('login.login') }}
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
<div style="display: inline-block;width: 100%;">
|
||||
<div class="popover_box active" style="bottom: 50px;" @click="forgetPassword">忘记密码</div>
|
||||
</div>
|
||||
</el-form>
|
||||
</div>
|
||||
<float-part v-if="isProject && !versionBaseNoShow.includes(project)" />
|
||||
@ -128,6 +131,7 @@
|
||||
<!--</div>-->
|
||||
</div>
|
||||
<register ref="register" />
|
||||
<forget-password ref="forgetPassword" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -156,10 +160,11 @@ import { getSimulationInfoNew } from '@/api/simulation';
|
||||
import { getSimulationInfoByGroup } from '@/api/rtSimulation';
|
||||
import { getSessionStorage } from '@/utils/auth';
|
||||
import Register from './register';
|
||||
import ForgetPassword from './forgetPassword';
|
||||
|
||||
export default {
|
||||
name: 'Login',
|
||||
components: { QrcodeVue, FloatPart, Register },
|
||||
components: { QrcodeVue, FloatPart, Register, ForgetPassword },
|
||||
data() {
|
||||
const validateName = (rule, value, callback) => {
|
||||
if (value) {
|
||||
@ -623,6 +628,9 @@ export default {
|
||||
// },
|
||||
registerUser() {
|
||||
this.$refs.register.doShow();
|
||||
},
|
||||
forgetPassword() {
|
||||
this.$refs.forgetPassword.doShow();
|
||||
}
|
||||
}
|
||||
};
|
||||
@ -762,7 +770,7 @@ export default {
|
||||
.popover_box {
|
||||
position: absolute;
|
||||
right: 80px;
|
||||
bottom: 106px;
|
||||
bottom: 124px;
|
||||
cursor: pointer;
|
||||
color: #225592;
|
||||
font-size: 14px;
|
||||
|
@ -15,6 +15,7 @@ import DictionaryEdit from './edit';
|
||||
import CreateUser from './createUser';
|
||||
import CreateSingleUser from './createSingleUser';
|
||||
import BindCompany from './bindCompany';
|
||||
import {adminResetUserPassword} from '@/api/management/user';
|
||||
|
||||
export default {
|
||||
name: 'UserControl',
|
||||
@ -163,6 +164,10 @@ export default {
|
||||
name: '绑定组织管理员',
|
||||
handleClick: this.handleBind
|
||||
},
|
||||
{
|
||||
name: '重置密码',
|
||||
handleClick: this.resetPassword
|
||||
},
|
||||
{
|
||||
name: '删除',
|
||||
handleClick: this.handleDelete
|
||||
@ -222,6 +227,19 @@ export default {
|
||||
handleBind(index, row) {
|
||||
this.$refs.bindCompany.doShow(row);
|
||||
},
|
||||
resetPassword(index, row) {
|
||||
this.$confirm('操作会将改用户密码重置为初始密码,是否继续', this.$t('global.tips'), {
|
||||
confirmButtonText: this.$t('global.confirm'),
|
||||
cancelButtonText: this.$t('global.cancel'),
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
adminResetUserPassword(row.id).then(response => {
|
||||
this.$message.success('重置密码成功!');
|
||||
}).catch(() => {
|
||||
this.$message.error('重置密码失败!');
|
||||
});
|
||||
});
|
||||
},
|
||||
handleDelete(index, row) {
|
||||
deleteUserInLogic(row.id).then(resp=> {
|
||||
// 逻辑删除
|
||||
|
Loading…
Reference in New Issue
Block a user