feat: 登录支持记住账号和密码
This commit is contained in:
@@ -59,19 +59,58 @@ const [Form, formApi] = useVbenForm(
|
||||
const router = useRouter();
|
||||
|
||||
const REMEMBER_ME_KEY = `REMEMBER_ME_ACCOUNT_${location.hostname}`;
|
||||
interface RememberMeLoginData {
|
||||
account: string;
|
||||
password: string;
|
||||
}
|
||||
|
||||
const localAccount = localStorage.getItem(REMEMBER_ME_KEY) || '';
|
||||
function getRememberMeLoginData(): null | RememberMeLoginData {
|
||||
const localValue = localStorage.getItem(REMEMBER_ME_KEY);
|
||||
if (!localValue) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const rememberMe = ref(!!localAccount);
|
||||
try {
|
||||
const parsedValue = JSON.parse(localValue) as Partial<RememberMeLoginData>;
|
||||
if (
|
||||
typeof parsedValue.account === 'string' &&
|
||||
typeof parsedValue.password === 'string'
|
||||
) {
|
||||
return {
|
||||
account: parsedValue.account,
|
||||
password: parsedValue.password,
|
||||
};
|
||||
}
|
||||
} catch {
|
||||
return {
|
||||
account: localValue,
|
||||
password: '',
|
||||
};
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
const localLoginData = getRememberMeLoginData();
|
||||
|
||||
const rememberMe = ref(!!localLoginData?.account);
|
||||
|
||||
async function handleSubmit() {
|
||||
const { valid } = await formApi.validate();
|
||||
const values = await formApi.getValues();
|
||||
if (valid) {
|
||||
localStorage.setItem(
|
||||
REMEMBER_ME_KEY,
|
||||
rememberMe.value ? values?.account : '',
|
||||
);
|
||||
if (rememberMe.value) {
|
||||
localStorage.setItem(
|
||||
REMEMBER_ME_KEY,
|
||||
JSON.stringify({
|
||||
account: `${values?.account ?? ''}`,
|
||||
password: `${values?.password ?? ''}`,
|
||||
}),
|
||||
);
|
||||
} else {
|
||||
localStorage.removeItem(REMEMBER_ME_KEY);
|
||||
}
|
||||
|
||||
emit('submit', values);
|
||||
}
|
||||
}
|
||||
@@ -81,8 +120,9 @@ function handleGo(path: string) {
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
if (localAccount) {
|
||||
formApi.setFieldValue('account', localAccount);
|
||||
if (localLoginData?.account) {
|
||||
formApi.setFieldValue('account', localLoginData.account);
|
||||
formApi.setFieldValue('password', localLoginData.password);
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
@@ -12,7 +12,7 @@
|
||||
"passwordErrorTip": "Password is incorrect",
|
||||
"passwordTip": "Please enter password",
|
||||
"verifyRequiredTip": "Please complete the verification first",
|
||||
"rememberMe": "Remember Me",
|
||||
"rememberMe": "Remember Account and Password",
|
||||
"createAnAccount": "Create an Account",
|
||||
"createAccount": "Create Account",
|
||||
"alreadyHaveAccount": "Already have an account?",
|
||||
|
||||
@@ -12,7 +12,7 @@
|
||||
"passwordTip": "请输入密码",
|
||||
"verifyRequiredTip": "请先完成验证",
|
||||
"passwordErrorTip": "密码错误",
|
||||
"rememberMe": "记住账号",
|
||||
"rememberMe": "记住账号和密码",
|
||||
"createAnAccount": "创建一个账号",
|
||||
"createAccount": "创建账号",
|
||||
"alreadyHaveAccount": "已经有账号了?",
|
||||
|
||||
Reference in New Issue
Block a user