[Reset password] Implemented reset password

This commit is contained in:
Matej Glasnák committed 2023-03-30 13:20:51 +02:00
1 parent 04774b0fb3
commit f8a1936f3e
7 files changed
+52 -19

No files matched your search

+8 -2
View File
@@ -26,11 +26,17 @@ const routes: Array<RouteRecordRaw> = [
component: () => import('@/plugins/lib@auth/forgot-password/forgot-password.vue'),
meta: {requiresAuth: false}
},
{
path: '/auth/forgot-success',
name: 'Forgot success',
component: () => import('@/plugins/lib@auth/forgot-success/forgot-success.vue'),
meta: {requiresAuth: false}
},
{
path: '/auth/reset-password',
name: 'Reset password',
component: () => import('@/plugins/lib@auth/reset-password/reset-password.vue'),
meta: {requiresAuth: false}
meta: {requiresAuth: null}
}
]
},
@@ -126,7 +132,7 @@ router.beforeEach((to, from, next) => {
else
return next({name: 'Dashboard - Tasks'})
} else {
return next({name: 'Login'})
return next()
}
})
@@ -1,7 +1,7 @@
<template>
<header class="login-header-border ">
<header class="login-header-border hover">
<v-container>
<img :src="require('@/plugins/app/_img/jandl-logo.svg')" alt="jandl-logo">
<img :src="require('@/plugins/app/_img/jandl-logo.svg')" alt="jandl-logo" @click="$router.push({name: 'Login'})">
</v-container>
</header>
</template>
@@ -45,8 +45,7 @@ export default {
try {
await this.$store.dispatch('auth/forgotPassword', this.credentials)
this.$router.push({name: 'Reset password', query: {email: this.credentials.email}})
this.$toast.success('Reset code has been sent to your email.')
this.$router.push({name: 'Forgot success', query: {email: this.credentials.email}})
} catch (error) {
this.$toast.error(error)
}
@@ -0,0 +1,23 @@
<template>
<v-container>
<div class="auth-card">
<h1>We have just sent an email to <b>{{ email }}</b></h1>
<p class="mb-10">Please check your inbox and follow the instructions to complete the next steps.</p>
</div>
</v-container>
</template>
<script>
export default {
data() {
return {
email: this.$route.query.email
}
},
mounted() {
if (!this.email)
this.$router.replace({name: 'Forgot password'})
}
}
</script>
@@ -49,7 +49,7 @@ export default {
await this.$store.dispatch('auth/login', this.form)
this.$router.push({ name: 'Dashboard - Tasks'})
} catch (error) {
this.$toast.error(error)
this.$toast.error(error?.response?.data?.message || error)
}
}
}
@@ -1,23 +1,19 @@
<template>
<v-form @keydown.enter="submit()">
<v-text-field v-model="credentials.token" label="Token" autocomplete="one-time-token" bg-color="white" variant="solo" type="number" class="mb-2" :hint="v$.credentials.token.$errors ? errorUtils.parseErrors(v$.credentials.token.$errors) : null" :counter="6" :class="{ error: v$.credentials.token.$errors.length }" />
<v-text-field v-model="credentials.email" label="E-mail" autocomplete="email" bg-color="white" variant="solo" type="email" class="mb-2" :hint="v$.credentials.email.$errors ? errorUtils.parseErrors(v$.credentials.email.$errors) : null" :class="{ error: v$.credentials.email.$errors.length }" />
<v-text-field v-model="credentials.password" label="Heslo" autocomplete="new-password" bg-color="white" variant="solo" :type="showPassword ? 'text' : 'password'" class="mb-2" :hint="v$.credentials.password.$errors ? errorUtils.parseErrors(v$.credentials.password.$errors) : null" :class="{ error: v$.credentials.password.$errors.length }" :counter="12" :append-icon="showPassword ? 'mdi-eye' : 'mdi-eye-off'" @click:append="showPassword = !showPassword" />
<v-text-field v-model="credentials.password_confirmation" autocomplete="new-password" bg-color="white" variant="solo" label="Potvrdenie hesla" :type="showConfirmationPassword ? 'text' : 'password'" :counter="12" class="mb-2" :hint="v$.credentials.password_confirmation.$errors ? errorUtils.parseErrors(v$.credentials.password_confirmation.$errors) : null" :class="{ error: v$.credentials.password_confirmation.$errors.length }" :append-icon="showConfirmationPassword ? 'mdi-eye' : 'mdi-eye-off'" @click:append="showConfirmationPassword = !showConfirmationPassword" />
<div class="d-flex flex-column">
<v-btn class="button" color="#7F39FB" @click.prevent="submit()">Change password</v-btn>
<v-btn class="button" color="#7F39FB" @click.prevent="submit()" :disabled="!credentials.token">Change password</v-btn>
</div>
</v-form>
</template>
<script>
import useVuelidate from '@vuelidate/core'
import { required, email, integer, minLength, maxLength, sameAs } from '@vuelidate/validators'
import errorUtils from '@/plugins/lib@auth/_utils/error.utils'
import useVuelidate from '@vuelidate/core'
import { required, email, minLength, sameAs } from '@vuelidate/validators'
import errorUtils from '@/plugins/lib@auth/_utils/error.utils'
export default {
props: {
@@ -32,8 +28,8 @@ export default {
errorUtils,
v$: useVuelidate(),
credentials: {
token: this.$route.query.token,
email: this.$route.query.email
email: this.$route.query.email,
token: this.$route.query.token
},
showPassword: false,
showConfirmationPassword: false
@@ -43,7 +39,6 @@ export default {
validations() {
return {
credentials: {
token: { required },
email: { required, email },
password: { required, minLength: minLength(12) },
password_confirmation: { required, minLength: minLength(12), sameAs: sameAs(this.credentials.password)}
@@ -51,6 +46,11 @@ export default {
}
},
mounted() {
if (!this.$route.query.token)
return this.$toast.error('Error. Please check that the link is correct')
},
methods: {
async submit() {
if (!(await this.v$.$validate())) return
+6 -1
View File
@@ -93,9 +93,14 @@ export default {
},
// eslint-disable-next-line
resetPassword({commit}: {commit: any}, credentials: any) {
commit('auth_success', {token: credentials.token})
return new Promise((resolve, reject) => {
axios.post_auth_data('v1/users/reset', {data: credentials})
.then(response => resolve(response))
.then(response => {
commit('logout')
resolve(response)
})
.catch(error => reject(error))
})
},