salix-front/src/pages/Login/RecoverPassword.vue

60 lines
1.7 KiB
Vue

<script setup>
import { ref } from 'vue';
import { useQuasar } from 'quasar';
import { useI18n } from 'vue-i18n';
import { useRouter, useRoute } from 'vue-router';
import axios from 'axios';
import VnInput from 'src/components/common/VnInput.vue';
import VnOutForm from 'src/components/ui/VnOutForm.vue';
const quasar = useQuasar();
const router = useRouter();
const route = useRoute();
const { t } = useI18n();
const user = ref(route.query.user);
async function onSubmit() {
try {
await axios.post('VnUsers/recoverPassword', { user: user.value, app: 'lilium' });
router.push('Login');
quasar.notify({
message: t('globals.notificationSent'),
type: 'positive',
});
} catch (e) {
quasar.notify({
message: e.response?.data?.error.message,
type: 'negative',
});
}
}
</script>
<template>
<VnOutForm @submit="onSubmit" :title="t('globals.pageTitles.recoverPassword')">
<template #default>
<VnInput
v-model="user"
:label="t('recoverPassword.userOrEmail')"
:hint="t('recoverPassword.explanation')"
autofocus
required
>
<template #prepend>
<QIcon name="contact_mail" />
</template>
</VnInput>
</template>
<template #buttons>
<QBtn
:label="t('globals.pageTitles.recoverPassword')"
type="submit"
color="primary"
class="full-width q-mt-md"
rounded
unelevated
/>
</template>
</VnOutForm>
</template>