Few updates

frontend/src/views/Login.vue

@@ -34,7 +34,9 @@
           outlined
           />
       </validation-provider>
-      <a @click="recoverPass" class="float-right primary--text"><translate>Forgot password?</translate></a>
+      <router-link :to="{ name: 'PasswordRecoveryForm' }" class="float-right primary--text">
+        <translate>Forgot password?</translate>
+      </router-link>
       <v-checkbox
         v-model="rememberMe"
         :label="'Remember me'|translate"
@@ -70,9 +72,6 @@ export default {
     }
   },
   methods: {
-    recoverPass () {
-      this.$router.push({ name: 'PasswordRecoveryForm' })
-    },
     async authenticate () {
       const isValid = await this.$refs.observer.validate()
       if (!isValid) {
@@ -101,7 +100,3 @@ export default {
   }
 }
 </script>
-
-<style>
-
-</style>

frontend/src/views/user/PasswordRecoveryChangeForm.vue

@@ -15,7 +15,7 @@
           v-slot="{ errors }"
           rules="required"
         >
-        <p id="password_validation"></p>
+        <p id="password_validation">{{ password_validation_error }}</p>
         <label class="m-label"><translate>Change password</translate></label>
           <v-text-field
             v-model="password"
@@ -49,7 +49,9 @@
         </v-btn>
       </div>
       <div>
-        <a @click="returnLogin" class="float-right primary--text"><translate>Return to login?</translate></a>
+        <router-link :to="{ name: 'Login' }" class="float-right primary--text">
+          <translate>Return to login</translate>
+        </router-link>
       </div>
     </v-col>
   </v-row>
@@ -64,6 +66,7 @@ export default {
       loading: false,
       password: '',
       password_confirmed: '',
+      password_validation_error: '',
       errors: {},
       token: '',
       id: ''
@@ -87,9 +90,6 @@ export default {
         }
       }
     },
-    returnLogin () {
-      this.$router.push({ name: 'Login' })
-    },
     async changePassword () {
       const isValid = await this.$refs.observer.validate()
       if (!isValid) {
@@ -102,7 +102,7 @@ export default {
         id: this.id
       }
       this.loading = true
-      document.getElementById('password_validation').innerHTML = ''
+      this.password_validation_error = ''
       auth.changePassword(payload).then(resp => {
         if (resp.status === 200) {
           this.loading = false
@@ -120,7 +120,7 @@ export default {
             message += this.$gettext(element) + '<br>'
           })
         }
-        document.getElementById('password_validation').innerHTML = message
+        this.password_validation_error = message
       })
     }
   },

frontend/src/views/user/PasswordRecoverySmsTotpForm.vue

@@ -39,7 +39,7 @@
       </div>
       <div>
         <a @click="resendSms" class="float-left primary--text"><translate>Resend SMS.</translate></a>
-        <a @click="returnLogin" class="float-right primary--text"><translate>Return to login?</translate></a>
+        <router-link :to="{ name: 'Login' }" class="float-right primary--text"><translate>Return to login</translate></router-link>
       </div>
     </v-col>
   </v-row>
@@ -61,9 +61,6 @@ export default {
     }
   },
   methods: {
-    returnLogin () {
-      this.$router.push({ name: 'Login' })
-    },
     async showErrorDialog (body) {
       const confirm = await this.$refs.confirm.open(
         this.$gettext('Error'),
@@ -91,7 +88,7 @@ export default {
       }).catch(err => {
         if (err.response.status === 400) {
           this.loading = false
-          this.showErrorDialog('User seems wrong, return to login or restart reset the process?')
+          this.showErrorDialog(this.$t('User seems wrong, return to login or restart reset the process?'))
         }
       })
     },