145 lines
2.9 KiB
Vue
145 lines
2.9 KiB
Vue
<template>
|
|
<LoginBox
|
|
v-if="!$resources.validateResetKey.loading && email"
|
|
title="为您的账户设置新密码"
|
|
>
|
|
<form class="flex flex-col" @submit.prevent="handleSubmit">
|
|
<div v-if="ask2FA">
|
|
<FormControl
|
|
label="来自验证器应用的2FA代码"
|
|
placeholder="123456"
|
|
v-model="twoFactorCode"
|
|
required
|
|
/>
|
|
</div>
|
|
<div v-else class="space-y-4">
|
|
<FormControl
|
|
label="邮箱"
|
|
class="pointer-events-none"
|
|
:modelValue="email"
|
|
name="email"
|
|
autocomplete="off"
|
|
disabled
|
|
/>
|
|
<FormControl
|
|
label="密码"
|
|
type="password"
|
|
v-model="password"
|
|
name="password"
|
|
autocomplete="new-password"
|
|
required
|
|
/>
|
|
</div>
|
|
<ErrorMessage
|
|
class="mt-6"
|
|
:message="
|
|
$resources.resetPassword.error ||
|
|
$resources.verify2FA.error ||
|
|
$resources.is2FAEnabled.error
|
|
"
|
|
/>
|
|
<Button
|
|
class="mt-6"
|
|
variant="solid"
|
|
:disabled="!password"
|
|
:loading="
|
|
$resources.resetPassword.loading ||
|
|
$resources.verify2FA.loading ||
|
|
$resources.is2FAEnabled.loading
|
|
"
|
|
>
|
|
提交
|
|
</Button>
|
|
</form>
|
|
</LoginBox>
|
|
<div
|
|
class="mt-20 px-6 text-center"
|
|
v-else-if="!$resources.validateResetKey.loading && !email"
|
|
>
|
|
账户密钥 <strong>{{ requestKey }}</strong> 无效或已过期。返回
|
|
<router-link class="underline" to="/login">登录</router-link>。
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import LoginBox from '../components/auth/LoginBox.vue';
|
|
|
|
export default {
|
|
name: 'ResetPassword',
|
|
components: {
|
|
LoginBox,
|
|
},
|
|
props: ['requestKey'],
|
|
data() {
|
|
return {
|
|
email: null,
|
|
ask2FA: false,
|
|
password: null,
|
|
};
|
|
},
|
|
resources: {
|
|
validateResetKey() {
|
|
return {
|
|
url: 'jcloud.api.account.get_user_for_reset_password_key',
|
|
params: {
|
|
key: this.requestKey,
|
|
},
|
|
onSuccess(email) {
|
|
this.email = email || null;
|
|
},
|
|
auto: true,
|
|
};
|
|
},
|
|
resetPassword() {
|
|
return {
|
|
url: 'jcloud.api.account.reset_password',
|
|
params: {
|
|
key: this.requestKey,
|
|
password: this.password,
|
|
},
|
|
onSuccess() {
|
|
window.location.reload();
|
|
},
|
|
};
|
|
},
|
|
is2FAEnabled() {
|
|
return {
|
|
url: 'jcloud.api.account.is_2fa_enabled',
|
|
};
|
|
},
|
|
verify2FA() {
|
|
return {
|
|
url: 'jcloud.api.account.verify_2fa',
|
|
onSuccess: async () => {
|
|
await this.$resources.resetPassword.submit();
|
|
},
|
|
};
|
|
},
|
|
},
|
|
methods: {
|
|
handleSubmit() {
|
|
if (this.ask2FA) {
|
|
this.$resources.verify2FA.submit({
|
|
user: this.email,
|
|
totp_code: this.twoFactorCode,
|
|
});
|
|
} else {
|
|
this.$resources.is2FAEnabled.submit(
|
|
{
|
|
user: this.email,
|
|
},
|
|
{
|
|
onSuccess: (is2FAEnabled) => {
|
|
if (is2FAEnabled) {
|
|
this.ask2FA = true;
|
|
} else {
|
|
this.$resources.resetPassword.submit();
|
|
}
|
|
},
|
|
},
|
|
);
|
|
}
|
|
},
|
|
},
|
|
};
|
|
</script> |