107 lines
3.4 KiB
Vue
107 lines
3.4 KiB
Vue
<template>
|
|
<div>
|
|
<QCard-section>
|
|
<QIcon
|
|
name="check"
|
|
class="block q-mx-auto text-accent"
|
|
style="font-size: 120px"
|
|
/>
|
|
</QCard-section>
|
|
<QCard-section>
|
|
<QForm @submit="onRegister" ref="form" class="q-gutter-y-md">
|
|
<div class="text-grey-8 text-h5 text-center">
|
|
{{ $t('fillData') }}
|
|
</div>
|
|
<div class="q-gutter-y-sm">
|
|
<QInput
|
|
v-model="password"
|
|
:label="$t('password')"
|
|
:type="showPwd ? 'password' : 'text'"
|
|
autofocus
|
|
hint=""
|
|
filled
|
|
>
|
|
<template v-slot:append>
|
|
<QIcon
|
|
:name="
|
|
showPwd ? 'visibility_off' : 'visibility'
|
|
"
|
|
class="cursor-pointer"
|
|
@click="showPwd = !showPwd"
|
|
/>
|
|
</template>
|
|
</QInput>
|
|
<QInput
|
|
v-model="repeatPassword"
|
|
:label="$t('repeatPassword')"
|
|
:type="showRpPwd ? 'password' : 'text'"
|
|
:rules="[
|
|
value =>
|
|
value == password || $t('repeatPasswordError')
|
|
]"
|
|
hint=""
|
|
filled
|
|
>
|
|
<template v-slot:append>
|
|
<QIcon
|
|
:name="
|
|
showRpPwd ? 'visibility_off' : 'visibility'
|
|
"
|
|
class="cursor-pointer"
|
|
@click="showRpPwd = !showRpPwd"
|
|
/>
|
|
</template>
|
|
</QInput>
|
|
</div>
|
|
<div>
|
|
<QBtn
|
|
type="submit"
|
|
:label="$t('resetPassword')"
|
|
class="full-width"
|
|
color="primary"
|
|
/>
|
|
<div class="text-center q-mt-xs">
|
|
<router-link to="/login" class="link">
|
|
{{ $t('return') }}
|
|
</router-link>
|
|
</div>
|
|
</div>
|
|
</QForm>
|
|
</QCard-section>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'VnRegister',
|
|
data() {
|
|
return {
|
|
password: '',
|
|
repeatPassword: '',
|
|
showPwd: true,
|
|
showRpPwd: true
|
|
};
|
|
},
|
|
methods: {
|
|
async onRegister() {
|
|
const headers = {
|
|
Authorization: this.$route.query.access_token
|
|
};
|
|
await this.$axios.post(
|
|
'users/reset-password',
|
|
{
|
|
newPassword: this.password
|
|
},
|
|
{ headers }
|
|
);
|
|
|
|
this.$q.notify({
|
|
message: this.$t('passwordResetSuccessfully'),
|
|
type: 'positive'
|
|
});
|
|
this.$router.push('/login');
|
|
}
|
|
}
|
|
};
|
|
</script>
|