2
0

feat:忘记密码功能完善

This commit is contained in:
zhongzm
2025-02-13 16:51:07 +08:00
parent e471f24764
commit 29f58edef6
3 changed files with 69 additions and 23 deletions

View File

@@ -66,7 +66,7 @@ export const useAppStore = defineStore(SetupStoreId.App, () => {
setTimeout(() => { setTimeout(() => {
window.location.reload(); window.location.reload();
}, 100); }, 50);
} }
/** Update document title by locale */ /** Update document title by locale */

View File

@@ -118,8 +118,8 @@ async function getCheckCode() {
<ASpace direction="vertical" size="large" class="w-full"> <ASpace direction="vertical" size="large" class="w-full">
<div class="flex-y-center justify-between"> <div class="flex-y-center justify-between">
<ACheckbox>{{ $t('page.login.pwdLogin.rememberMe') }}</ACheckbox> <!-- <ACheckbox>{{ $t('page.login.pwdLogin.rememberMe') }}</ACheckbox>-->
<!-- <AButton type="text" @click="toggleLoginModule('reset-pwd')">{{ t('page.login.pwdLogin.forgetPassword') }}</AButton>--> <AButton type="text" @click="toggleLoginModule('reset-pwd')">{{ t('page.login.pwdLogin.forgetPassword') }}</AButton>
</div> </div>
<AButton type="primary" block size="large" shape="round" :loading="authStore.loginLoading" @click="handleSubmit"> <AButton type="primary" block size="large" shape="round" :loading="authStore.loginLoading" @click="handleSubmit">
{{ $t('common.confirm') }} {{ $t('common.confirm') }}

View File

@@ -2,12 +2,14 @@
import { computed, reactive } from 'vue'; import { computed, reactive } from 'vue';
import { useRouterPush } from '@/hooks/common/router'; import { useRouterPush } from '@/hooks/common/router';
import { useAntdForm, useFormRules } from '@/hooks/common/form'; import { useAntdForm, useFormRules } from '@/hooks/common/form';
import {useCaptcha} from "@/hooks/business/captcha"; import { useCaptcha } from "@/hooks/business/captcha";
import {useI18n} from "vue-i18n"; import { useI18n } from "vue-i18n";
import { resetPasswordByEmail } from '@/service/api/auth';
defineOptions({ defineOptions({
name: 'ResetPwd' name: 'ResetPwd'
}); });
const { t } = useI18n(); const { t } = useI18n();
const { toggleLoginModule } = useRouterPush(); const { toggleLoginModule } = useRouterPush();
const { formRef, validate } = useAntdForm(); const { formRef, validate } = useAntdForm();
@@ -18,13 +20,15 @@ interface FormModel {
code: string; code: string;
password: string; password: string;
confirmPassword: string; confirmPassword: string;
uuid: string;
} }
const model: FormModel = reactive({ const model: FormModel = reactive({
email: '', email: '',
code: '', code: '',
password: '', password: '',
confirmPassword: '' confirmPassword: '',
uuid: ''
}); });
type RuleRecord = Partial<Record<keyof FormModel, App.Global.FormRule[]>>; type RuleRecord = Partial<Record<keyof FormModel, App.Global.FormRule[]>>;
@@ -32,19 +36,61 @@ type RuleRecord = Partial<Record<keyof FormModel, App.Global.FormRule[]>>;
const rules = computed<RuleRecord>(() => { const rules = computed<RuleRecord>(() => {
const { formRules, createConfirmPwdRule } = useFormRules(); const { formRules, createConfirmPwdRule } = useFormRules();
const passwordValidateRule: App.Global.FormRule = {
validator: (_rule: any, value: string) => {
if (!value) {
return Promise.reject(t('page.login.register.passwordRequired'));
}
if (value.length < 6 || value.length > 20) {
return Promise.reject(t('page.login.register.passwordLength'));
}
if (!/^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]{6,20}$/.test(value)) {
return Promise.reject(t('page.login.register.passwordFormat'));
}
return Promise.resolve();
}
};
return { return {
//phone: formRules.phone, email: [
email:formRules.email, { required: true, message: t('page.login.register.emailRequired') },
code:formRules.code, { type: 'email', message: t('page.login.register.emailInvalid') }
password: formRules.pwd, ],
code: [{ required: true, message: t('page.login.register.codeRequired') }],
password: [
{ required: true, message: t('page.login.register.passwordRequired') },
passwordValidateRule
],
confirmPassword: createConfirmPwdRule(model.password) confirmPassword: createConfirmPwdRule(model.password)
}; };
}); });
async function handleCaptcha() {
const res = await getCaptcha(model.email);
if (res) {
model.uuid = res.data.uuid;
if (res.data?.text) {
model.code = res.data.text;
}
}
}
async function handleSubmit() { async function handleSubmit() {
await validate(); try {
// request to reset password await validate();
$message?.success(t('page.login.common.validateSuccess'));
await resetPasswordByEmail({
email: model.email,
code: model.code,
password: model.password
});
window.$message?.success(t('page.login.resetPwd.resetSuccess'));
toggleLoginModule('pwd-login');
} catch (error) {
console.error('Reset password failed:', error);
window.$message?.error(t('page.login.resetPwd.resetFailed'));
}
} }
</script> </script>
@@ -53,17 +99,17 @@ async function handleSubmit() {
<AFormItem name="email"> <AFormItem name="email">
<AInput v-model:value="model.email" size="large" :placeholder="t('page.login.common.emailPlaceholder')" /> <AInput v-model:value="model.email" size="large" :placeholder="t('page.login.common.emailPlaceholder')" />
</AFormItem> </AFormItem>
<AFormItem name="code" > <AFormItem name="code">
<div class="w-full flex-y-center gap-8px"> <div class="w-full flex-y-center gap-8px">
<AInput v-model:value="model.code" size="large" :placeholder="t('page.login.common.codePlaceholder')" /> <AInput v-model:value="model.code" size="large" :placeholder="t('page.login.common.codePlaceholder')" />
<AButton <AButton
size="small" size="small"
:disabled="isCounting" :disabled="isCounting"
:loading="loading" :loading="loading"
@click="getCaptcha(model.email)" @click="handleCaptcha"
> >
{{ label }} {{ label }}
</AButton> </AButton>
</div> </div>
</AFormItem> </AFormItem>
<AFormItem name="password"> <AFormItem name="password">