From ef365664423e16c08813ad353afa2ec4eb819fff Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Fri, 26 Jul 2024 09:09:21 -0300
Subject: [PATCH] Create change password with and without token and add related
 features

---
 src/components/ui/ChangePasswordForm.vue | 32 ++++++++++++++++++++++--
 1 file changed, 30 insertions(+), 2 deletions(-)

diff --git a/src/components/ui/ChangePasswordForm.vue b/src/components/ui/ChangePasswordForm.vue
index fb2c595d..2a6fe392 100644
--- a/src/components/ui/ChangePasswordForm.vue
+++ b/src/components/ui/ChangePasswordForm.vue
@@ -1,5 +1,5 @@
 <script setup>
-import { ref, inject, onMounted } from 'vue';
+import { ref, inject, onMounted, nextTick } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRouter } from 'vue-router';
 
@@ -15,6 +15,8 @@ const userStore = useUserStore();
 const { notify } = useNotify();
 const router = useRouter();
 
+const oldPasswordRef = ref(null);
+const newPasswordRef = ref(null);
 const passwordRequirementsDialogRef = ref(null);
 const vnFormRef = ref(null);
 const repeatPassword = ref('');
@@ -35,6 +37,21 @@ const changePassword = async () => {
         notify(t('passwordsDoNotMatch'), 'negative');
         throw new Error('Passwords do not match');
     }
+    if (userStore.token) {
+        await changePasswordWithToken(userStore.token);
+    } else {
+        await changePasswordWithoutToken();
+    }
+};
+
+const changePasswordWithToken = async token => {
+    const headers = {
+        Authorization: token
+    };
+    await api.post('VnUsers/reset-password', formData.value, { headers });
+};
+
+const changePasswordWithoutToken = async () => {
     await api.patch('Accounts/change-password', formData.value);
 };
 
@@ -52,7 +69,15 @@ const logout = async () => {
     router.push({ name: 'Login' });
 };
 
-onMounted(async () => await getPasswordRequirements());
+onMounted(async () => {
+    getPasswordRequirements();
+    await nextTick();
+    if (userStore.token) {
+        newPasswordRef.value.focus();
+    } else {
+        oldPasswordRef.value.focus();
+    }
+});
 </script>
 
 <template>
@@ -68,11 +93,14 @@ onMounted(async () => await getPasswordRequirements());
     >
         <template #form>
             <VnInput
+                v-if="!userStore.token"
+                ref="oldPasswordRef"
                 v-model="formData.oldPassword"
                 :label="t('oldPassword')"
                 type="password"
             />
             <VnInput
+                ref="newPasswordRef"
                 v-model="formData.newPassword"
                 :label="t('newPassword')"
                 type="password"