feat:忘记密码功能完善
This commit is contained in:
@@ -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 */
|
||||||
|
|||||||
@@ -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') }}
|
||||||
|
|||||||
@@ -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">
|
||||||
|
|||||||
Reference in New Issue
Block a user