mirror of https://github.com/certd/certd
feat 找回密码
parent
b33ec201ac
commit
903fe9aa9d
|
@ -57,6 +57,7 @@ export default {
|
||||||
passwordPlaceholder: "Please enter your password",
|
passwordPlaceholder: "Please enter your password",
|
||||||
mobilePlaceholder: "Please enter your mobile number",
|
mobilePlaceholder: "Please enter your mobile number",
|
||||||
loginButton: "Log In",
|
loginButton: "Log In",
|
||||||
|
forgotPassword: "Forgot password?",
|
||||||
forgotAdminPassword: "Forgot admin password?",
|
forgotAdminPassword: "Forgot admin password?",
|
||||||
registerLink: "Register",
|
registerLink: "Register",
|
||||||
|
|
||||||
|
|
|
@ -57,6 +57,7 @@ export default {
|
||||||
passwordPlaceholder: "请输入密码",
|
passwordPlaceholder: "请输入密码",
|
||||||
mobilePlaceholder: "请输入手机号",
|
mobilePlaceholder: "请输入手机号",
|
||||||
loginButton: "登录",
|
loginButton: "登录",
|
||||||
|
forgotPassword: "忘记密码?",
|
||||||
forgotAdminPassword: "忘记管理员密码?",
|
forgotAdminPassword: "忘记管理员密码?",
|
||||||
registerLink: "注册",
|
registerLink: "注册",
|
||||||
|
|
||||||
|
|
|
@ -24,6 +24,14 @@ export const outsideResource = [
|
||||||
path: "/register",
|
path: "/register",
|
||||||
component: "/framework/register/index.vue",
|
component: "/framework/register/index.vue",
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
meta: {
|
||||||
|
title: "找回密码",
|
||||||
|
},
|
||||||
|
name: "forgotPassword",
|
||||||
|
path: "/forgotPassword",
|
||||||
|
component: "/framework/forgot-password/index.vue",
|
||||||
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
...errorPage,
|
...errorPage,
|
||||||
|
|
|
@ -20,6 +20,17 @@ export interface SmsLoginReq {
|
||||||
randomStr: string;
|
randomStr: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export interface ForgotPasswordReq {
|
||||||
|
forgotPasswordType: string;
|
||||||
|
input: string;
|
||||||
|
randomStr: string;
|
||||||
|
imgCode: string;
|
||||||
|
validateCode: string;
|
||||||
|
|
||||||
|
password: string;
|
||||||
|
confirmPassword: string;
|
||||||
|
}
|
||||||
|
|
||||||
export interface UserInfoRes {
|
export interface UserInfoRes {
|
||||||
id: string | number;
|
id: string | number;
|
||||||
username: string;
|
username: string;
|
||||||
|
@ -43,6 +54,13 @@ export async function register(user: RegisterReq): Promise<UserInfoRes> {
|
||||||
data: user,
|
data: user,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
export async function forgotPassword(data: ForgotPasswordReq): Promise<any> {
|
||||||
|
return await request({
|
||||||
|
url: "/forgotPassword",
|
||||||
|
method: "post",
|
||||||
|
data: data,
|
||||||
|
});
|
||||||
|
}
|
||||||
export async function logout() {
|
export async function logout() {
|
||||||
return await request({
|
return await request({
|
||||||
url: "/logout",
|
url: "/logout",
|
||||||
|
|
|
@ -4,7 +4,7 @@ import router from "../../router";
|
||||||
import { LocalStorage } from "/src/utils/util.storage";
|
import { LocalStorage } from "/src/utils/util.storage";
|
||||||
// @ts-ignore
|
// @ts-ignore
|
||||||
import * as UserApi from "./api.user";
|
import * as UserApi from "./api.user";
|
||||||
import { RegisterReq, SmsLoginReq } from "./api.user";
|
import { ForgotPasswordReq, RegisterReq, SmsLoginReq } from "./api.user";
|
||||||
// @ts-ignore
|
// @ts-ignore
|
||||||
import { LoginReq, UserInfoRes } from "/@/store/user/api.user";
|
import { LoginReq, UserInfoRes } from "/@/store/user/api.user";
|
||||||
import { message, Modal, notification } from "ant-design-vue";
|
import { message, Modal, notification } from "ant-design-vue";
|
||||||
|
@ -67,6 +67,13 @@ export const useUserStore = defineStore({
|
||||||
});
|
});
|
||||||
await router.replace("/login");
|
await router.replace("/login");
|
||||||
},
|
},
|
||||||
|
async forgotPassword(params: ForgotPasswordReq): Promise<any> {
|
||||||
|
await UserApi.forgotPassword(params);
|
||||||
|
notification.success({
|
||||||
|
message: "密码已重置,请登录",
|
||||||
|
});
|
||||||
|
await router.replace("/login");
|
||||||
|
},
|
||||||
/**
|
/**
|
||||||
* @description: login
|
* @description: login
|
||||||
*/
|
*/
|
||||||
|
|
|
@ -0,0 +1,163 @@
|
||||||
|
<template>
|
||||||
|
<div class="main forgot-password-page">
|
||||||
|
<a-form
|
||||||
|
ref="formRef"
|
||||||
|
class="user-layout-forgot-password"
|
||||||
|
name="custom-validation"
|
||||||
|
:model="formState"
|
||||||
|
:rules="rules"
|
||||||
|
v-bind="layout"
|
||||||
|
:label-col="{ span: 6 }"
|
||||||
|
@finish="handleFinish"
|
||||||
|
@finish-failed="handleFinishFailed"
|
||||||
|
>
|
||||||
|
<a-tabs v-model:active-key="forgotPasswordType" :destroyInactiveTabPane="true">
|
||||||
|
<a-tab-pane key="email" tab="邮箱找回">
|
||||||
|
<a-form-item has-feedback name="input" label="邮箱">
|
||||||
|
<a-input v-model:value="formState.input" placeholder="邮箱" size="large" autocomplete="off">
|
||||||
|
<template #prefix>
|
||||||
|
<fs-icon icon="ion:mail-outline"></fs-icon>
|
||||||
|
</template>
|
||||||
|
</a-input>
|
||||||
|
</a-form-item>
|
||||||
|
<a-form-item has-feedback name="validateCode" label="邮件验证码">
|
||||||
|
<email-code v-model:value="formState.validateCode" :img-code="formState.imgCode" :email="formState.input" :random-str="formState.randomStr" />
|
||||||
|
</a-form-item>
|
||||||
|
</a-tab-pane>
|
||||||
|
<a-tab-pane key="mobile" tab="手机号找回">
|
||||||
|
<a-form-item required has-feedback name="input" label="手机号">
|
||||||
|
<a-input v-model:value="formState.input" placeholder="手机号" autocomplete="off">
|
||||||
|
<template #prefix>
|
||||||
|
<fs-icon icon="ion:phone-portrait-outline"></fs-icon>
|
||||||
|
</template>
|
||||||
|
</a-input>
|
||||||
|
</a-form-item>
|
||||||
|
<a-form-item name="validateCode" label="手机验证码">
|
||||||
|
<sms-code v-model:value="formState.validateCode" :img-code="formState.imgCode" :mobile="formState.input" :phone-code="formState.phoneCode" :random-str="formState.randomStr" />
|
||||||
|
</a-form-item>
|
||||||
|
</a-tab-pane>
|
||||||
|
</a-tabs>
|
||||||
|
|
||||||
|
<a-form-item has-feedback name="imgCode" label="图片验证码">
|
||||||
|
<image-code ref="imageCodeRef" v-model:value="formState.imgCode" v-model:random-str="formState.randomStr"></image-code>
|
||||||
|
</a-form-item>
|
||||||
|
|
||||||
|
<a-form-item has-feedback name="password" label="新密码">
|
||||||
|
<a-input-password v-model:value="formState.password" placeholder="新密码" size="large" autocomplete="off">
|
||||||
|
<template #prefix>
|
||||||
|
<fs-icon icon="ion:lock-closed-outline"></fs-icon>
|
||||||
|
</template>
|
||||||
|
</a-input-password>
|
||||||
|
</a-form-item>
|
||||||
|
<a-form-item has-feedback name="confirmPassword" label="确认密码">
|
||||||
|
<a-input-password v-model:value="formState.confirmPassword" placeholder="确认密码" size="large" autocomplete="off">
|
||||||
|
<template #prefix>
|
||||||
|
<fs-icon icon="ion:lock-closed-outline"></fs-icon>
|
||||||
|
</template>
|
||||||
|
</a-input-password>
|
||||||
|
</a-form-item>
|
||||||
|
<a-form-item>
|
||||||
|
<a-button type="primary" size="large" html-type="submit" class="submit-button"> 找回密码</a-button>
|
||||||
|
|
||||||
|
<div class="mt-2">
|
||||||
|
<a href="https://certd.docmirror.cn/guide/use/forgotpasswd/" target="_blank"> 管理员无绑定邮箱或MFA丢失找回 </a>
|
||||||
|
</div>
|
||||||
|
</a-form-item>
|
||||||
|
</a-form>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { onMounted, reactive, ref, toRaw, watch } from "vue";
|
||||||
|
import ImageCode from "/@/views/framework/login/image-code.vue";
|
||||||
|
import EmailCode from "/@/views/framework/register/email-code.vue";
|
||||||
|
import SmsCode from "/@/views/framework/login/sms-code.vue";
|
||||||
|
import { utils } from "@fast-crud/fast-crud";
|
||||||
|
import { useUserStore } from "/@/store/user";
|
||||||
|
|
||||||
|
defineOptions({
|
||||||
|
name: "ForgotPasswordPage",
|
||||||
|
});
|
||||||
|
|
||||||
|
const rules = {
|
||||||
|
input: [{ required: true }],
|
||||||
|
validateCode: [{ required: true }],
|
||||||
|
imgCode: [{ required: true }, { min: 4, max: 4, message: "请输入4位图片验证码" }],
|
||||||
|
password: [{ required: true, trigger: "change", message: "请输入密码" }],
|
||||||
|
confirmPassword: [
|
||||||
|
{ required: true, trigger: "change", message: "请确认密码" },
|
||||||
|
{
|
||||||
|
validator: async (rule: any, value: any) => {
|
||||||
|
if (value && value !== formState.password) {
|
||||||
|
throw new Error("两次输入密码不一致");
|
||||||
|
}
|
||||||
|
return true;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
};
|
||||||
|
const layout = {
|
||||||
|
labelCol: {
|
||||||
|
span: 0,
|
||||||
|
},
|
||||||
|
wrapperCol: {
|
||||||
|
span: 24,
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
const forgotPasswordType = ref();
|
||||||
|
const userStore = useUserStore();
|
||||||
|
const formRef = ref();
|
||||||
|
const imageCodeRef = ref();
|
||||||
|
|
||||||
|
const formState: any = reactive({
|
||||||
|
input: "",
|
||||||
|
randomStr: "",
|
||||||
|
imgCode: "",
|
||||||
|
phoneCode: "86",
|
||||||
|
validateCode: "",
|
||||||
|
|
||||||
|
password: "",
|
||||||
|
confirmPassword: "",
|
||||||
|
});
|
||||||
|
|
||||||
|
// TODO 这里配置不同的找回方式
|
||||||
|
onMounted(() => {
|
||||||
|
forgotPasswordType.value = "email";
|
||||||
|
});
|
||||||
|
|
||||||
|
// 监控找回类型变化
|
||||||
|
watch(forgotPasswordType, () => {
|
||||||
|
formState.input = "";
|
||||||
|
formState.validateCode = "";
|
||||||
|
imageCodeRef.value.resetImageCode();
|
||||||
|
formRef.value.clearValidate(Object.keys(formState).filter(key => !["password", "confirmPassword"].includes(key)));
|
||||||
|
});
|
||||||
|
|
||||||
|
const handleFinish = async (values: any) => {
|
||||||
|
await userStore.forgotPassword(
|
||||||
|
toRaw({
|
||||||
|
type: forgotPasswordType.value,
|
||||||
|
input: formState.input,
|
||||||
|
randomStr: formState.randomStr,
|
||||||
|
imgCode: formState.imgCode,
|
||||||
|
validateCode: formState.validateCode,
|
||||||
|
password: formState.password,
|
||||||
|
confirmPassword: formState.confirmPassword,
|
||||||
|
}) as any
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleFinishFailed = (errors: any) => {
|
||||||
|
utils.logger.log(errors);
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style scoped lang="less">
|
||||||
|
.forgot-password-page {
|
||||||
|
.user-layout-forgot-password {
|
||||||
|
.submit-button {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -11,7 +11,7 @@
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, useAttrs } from "vue";
|
import { ref, useAttrs, defineExpose } from "vue";
|
||||||
import { nanoid } from "nanoid";
|
import { nanoid } from "nanoid";
|
||||||
|
|
||||||
const props = defineProps<{
|
const props = defineProps<{
|
||||||
|
@ -32,5 +32,10 @@ function resetImageCode() {
|
||||||
imageCodeUrl.value = url + "?randomStr=" + randomStr;
|
imageCodeUrl.value = url + "?randomStr=" + randomStr;
|
||||||
emit("update:randomStr", randomStr);
|
emit("update:randomStr", randomStr);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
defineExpose({
|
||||||
|
resetImageCode,
|
||||||
|
})
|
||||||
|
|
||||||
resetImageCode();
|
resetImageCode();
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -48,9 +48,9 @@
|
||||||
</a-button>
|
</a-button>
|
||||||
|
|
||||||
<div v-if="!settingStore.isComm" class="mt-2">
|
<div v-if="!settingStore.isComm" class="mt-2">
|
||||||
<a href="https://certd.docmirror.cn/guide/use/forgotpasswd/" target="_blank">
|
<router-link :to="{name: 'forgotPassword'}">
|
||||||
{{ t("authentication.forgotAdminPassword") }}
|
{{ t("authentication.forgotPassword") }}
|
||||||
</a>
|
</router-link>
|
||||||
</div>
|
</div>
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
|
|
||||||
|
|
|
@ -0,0 +1,45 @@
|
||||||
|
import { ALL, Body, Controller, Inject, Post, Provide } from '@midwayjs/core';
|
||||||
|
import { BaseController, CommonException, Constants, SysSettingsService } from "@certd/lib-server";
|
||||||
|
import { CodeService } from '../../../modules/basic/service/code-service.js';
|
||||||
|
import { UserService } from '../../../modules/sys/authority/service/user-service.js';
|
||||||
|
|
||||||
|
/**
|
||||||
|
*/
|
||||||
|
@Provide()
|
||||||
|
@Controller('/api')
|
||||||
|
export class LoginController extends BaseController {
|
||||||
|
@Inject()
|
||||||
|
userService: UserService;
|
||||||
|
@Inject()
|
||||||
|
codeService: CodeService;
|
||||||
|
|
||||||
|
@Inject()
|
||||||
|
sysSettingsService: SysSettingsService;
|
||||||
|
|
||||||
|
@Post('/forgotPassword', { summary: Constants.per.guest })
|
||||||
|
public async forgotPassword(
|
||||||
|
@Body(ALL)
|
||||||
|
body: any,
|
||||||
|
) {
|
||||||
|
if(body.type === 'email') {
|
||||||
|
this.codeService.checkEmailCode({
|
||||||
|
email: body.input,
|
||||||
|
randomStr: body.randomStr,
|
||||||
|
validateCode: body.validateCode,
|
||||||
|
throwError: true,
|
||||||
|
});
|
||||||
|
} else if(body.type === 'mobile') {
|
||||||
|
await this.codeService.checkSmsCode({
|
||||||
|
mobile: body.input,
|
||||||
|
randomStr: body.randomStr,
|
||||||
|
phoneCode: body.phoneCode,
|
||||||
|
smsCode: body.validateCode,
|
||||||
|
throwError: true,
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
throw new CommonException('暂不支持的找回类型,请联系管理员找回');
|
||||||
|
}
|
||||||
|
await this.userService.forgotPassword(body);
|
||||||
|
return this.ok();
|
||||||
|
}
|
||||||
|
}
|
|
@ -15,6 +15,7 @@ import { DbAdapter } from '../../../db/index.js';
|
||||||
import { simpleNanoId, utils } from '@certd/basic';
|
import { simpleNanoId, utils } from '@certd/basic';
|
||||||
|
|
||||||
export type RegisterType = 'username' | 'mobile' | 'email';
|
export type RegisterType = 'username' | 'mobile' | 'email';
|
||||||
|
export type ForgotPasswordType = 'mobile' | 'email';
|
||||||
|
|
||||||
export const AdminRoleId = 1
|
export const AdminRoleId = 1
|
||||||
/**
|
/**
|
||||||
|
@ -23,7 +24,7 @@ export const AdminRoleId = 1
|
||||||
@Provide()
|
@Provide()
|
||||||
@Scope(ScopeEnum.Request, { allowDowngrade: true })
|
@Scope(ScopeEnum.Request, { allowDowngrade: true })
|
||||||
export class UserService extends BaseService<UserEntity> {
|
export class UserService extends BaseService<UserEntity> {
|
||||||
|
|
||||||
@InjectEntityModel(UserEntity)
|
@InjectEntityModel(UserEntity)
|
||||||
repository: Repository<UserEntity>;
|
repository: Repository<UserEntity>;
|
||||||
@Inject()
|
@Inject()
|
||||||
|
@ -229,6 +230,28 @@ export class UserService extends BaseService<UserEntity> {
|
||||||
return newUser;
|
return newUser;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async forgotPassword(
|
||||||
|
data: {
|
||||||
|
type: ForgotPasswordType; input?: string, phoneCode?: string,
|
||||||
|
randomStr: string, imgCode:string, validateCode: string,
|
||||||
|
password: string, confirmPassword: string,
|
||||||
|
}
|
||||||
|
) {
|
||||||
|
if(!data.type) {
|
||||||
|
throw new CommonException('找回类型不能为空');
|
||||||
|
}
|
||||||
|
if(data.password !== data.confirmPassword) {
|
||||||
|
throw new CommonException('两次输入的密码不一致');
|
||||||
|
}
|
||||||
|
const user = await this.findOne([{ [data.type]: data.input }]);
|
||||||
|
console.log('user', user)
|
||||||
|
if(!user) {
|
||||||
|
throw new CommonException('用户不存在');
|
||||||
|
// return;
|
||||||
|
}
|
||||||
|
await this.resetPassword(user.id, data.password)
|
||||||
|
}
|
||||||
|
|
||||||
async changePassword(userId: any, form: any) {
|
async changePassword(userId: any, form: any) {
|
||||||
const user = await this.info(userId);
|
const user = await this.info(userId);
|
||||||
const passwordChecked = await this.checkPassword(form.password, user.password, user.passwordVersion);
|
const passwordChecked = await this.checkPassword(form.password, user.password, user.passwordVersion);
|
||||||
|
|
Loading…
Reference in New Issue