91 lines
1.8 KiB
Vue
91 lines
1.8 KiB
Vue
<template>
|
|
<LoginBox
|
|
v-if="!$resources.validateResetKey.loading && email"
|
|
title="Set a new password for your account"
|
|
>
|
|
<form
|
|
class="flex flex-col"
|
|
@submit.prevent="$resources.resetPassword.submit()"
|
|
>
|
|
<div class="space-y-4">
|
|
<FormControl
|
|
label="Email"
|
|
class="pointer-events-none"
|
|
:modelValue="email"
|
|
name="email"
|
|
autocomplete="off"
|
|
disabled
|
|
/>
|
|
<FormControl
|
|
label="Password"
|
|
type="password"
|
|
v-model="password"
|
|
name="password"
|
|
autocomplete="new-password"
|
|
required
|
|
/>
|
|
</div>
|
|
<ErrorMessage class="mt-6" :message="$resources.resetPassword.error" />
|
|
<Button
|
|
class="mt-6"
|
|
variant="solid"
|
|
:disabled="!password"
|
|
:loading="$resources.resetPassword.loading"
|
|
>
|
|
Submit
|
|
</Button>
|
|
</form>
|
|
</LoginBox>
|
|
<div
|
|
class="mt-20 px-6 text-center"
|
|
v-else-if="!$resources.validateResetKey.loading && !email"
|
|
>
|
|
Account Key <strong>{{ requestKey }}</strong> is invalid or expired. Go back
|
|
to <router-link class="underline" to="/login">login</router-link>.
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import LoginBox from '@/views/partials/LoginBox.vue';
|
|
|
|
export default {
|
|
name: 'ResetPassword',
|
|
components: {
|
|
LoginBox
|
|
},
|
|
props: ['requestKey'],
|
|
data() {
|
|
return {
|
|
email: null,
|
|
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();
|
|
}
|
|
};
|
|
}
|
|
}
|
|
};
|
|
</script>
|