From 5049b055478769b0b597c635a978aa4799ea093c Mon Sep 17 00:00:00 2001
From: carlossa <carlossa@verdnatura.es>
Date: Fri, 20 Dec 2024 13:01:56 +0100
Subject: [PATCH 1/9] fix: refs #7699 add icons and hint

---
 src/components/common/VnChangePassword.vue | 40 ++++++++++++++--------
 1 file changed, 25 insertions(+), 15 deletions(-)

diff --git a/src/components/common/VnChangePassword.vue b/src/components/common/VnChangePassword.vue
index 79784f3c5..9d59a3d3f 100644
--- a/src/components/common/VnChangePassword.vue
+++ b/src/components/common/VnChangePassword.vue
@@ -19,6 +19,8 @@ const changePassDialog = ref();
 const passwords = ref({ newPassword: null, repeatPassword: null });
 const requirements = ref([]);
 const isLoading = ref(false);
+const showPwd = true;
+const showRpPwd = true;
 
 const validate = async () => {
     const { newPassword, repeatPassword, oldPassword } = passwords.value;
@@ -79,27 +81,35 @@ defineExpose({ show: () => changePassDialog.value.show() });
                         autofocus
                     />
                     <VnInput
-                        :label="t('New password')"
-                        v-model="passwords.newPassword"
-                        type="password"
                         :required="true"
-                        :info="
-                            t('passwordRequirements', {
-                                length: requirements.length,
-                                nAlpha: requirements.nAlpha,
-                                nUpper: requirements.nUpper,
-                                nDigits: requirements.nDigits,
-                                nPunct: requirements.nPunct,
-                            })
-                        "
                         autofocus
-                    />
-
+                        v-model="passwords.newPassword"
+                        :label="$t('New password')"
+                        :type="showPwd ? 'password' : 'text'"
+                        hint=""
+                        filled
+                    >
+                        <template #append>
+                            <QIcon
+                                :name="showPwd ? 'visibility_off' : 'visibility'"
+                                class="cursor-pointer"
+                                @click="showPwd = !showPwd"
+                            />
+                        </template>
+                    </VnInput>
                     <VnInput
                         :label="t('Repeat password')"
                         v-model="passwords.repeatPassword"
-                        type="password"
+                        :type="showRpPwd ? 'password' : 'text'"
+                        hint=""
                     />
+                    <template #append>
+                        <QIcon
+                            :name="showRpPwd ? 'visibility_off' : 'visibility'"
+                            class="cursor-pointer"
+                            @click="showRpPwd = !showRpPwd"
+                        />
+                    </template>
                 </QCardSection>
             </QForm>
             <QCardActions>
-- 
2.40.1


From 01f63ff239ef68d460eb0914fc9d0f8cff676679 Mon Sep 17 00:00:00 2001
From: carlossa <carlossa@verdnatura.es>
Date: Tue, 24 Dec 2024 09:52:31 +0100
Subject: [PATCH 2/9] fix: refs #7699 fix password visibility

---
 src/components/common/VnChangePassword.vue | 34 +++++++++++++---------
 1 file changed, 21 insertions(+), 13 deletions(-)

diff --git a/src/components/common/VnChangePassword.vue b/src/components/common/VnChangePassword.vue
index 9d59a3d3f..9026df85c 100644
--- a/src/components/common/VnChangePassword.vue
+++ b/src/components/common/VnChangePassword.vue
@@ -19,8 +19,8 @@ const changePassDialog = ref();
 const passwords = ref({ newPassword: null, repeatPassword: null });
 const requirements = ref([]);
 const isLoading = ref(false);
-const showPwd = true;
-const showRpPwd = true;
+const showPwd = ref(true);
+const showRpPwd = ref(true);
 
 const validate = async () => {
     const { newPassword, repeatPassword, oldPassword } = passwords.value;
@@ -76,10 +76,18 @@ defineExpose({ show: () => changePassDialog.value.show() });
                         v-if="props.askOldPass"
                         :label="t('Old password')"
                         v-model="passwords.oldPassword"
-                        type="password"
+                        :type="showPwd ? 'password' : 'text'"
                         :required="true"
                         autofocus
-                    />
+                    >
+                        <template #append>
+                            <QIcon
+                                :name="showPwd ? 'visibility_off' : 'visibility'"
+                                class="cursor-pointer"
+                                @click="showPwd = !showPwd"
+                            />
+                        </template>
+                    </VnInput>
                     <VnInput
                         :required="true"
                         autofocus
@@ -87,7 +95,6 @@ defineExpose({ show: () => changePassDialog.value.show() });
                         :label="$t('New password')"
                         :type="showPwd ? 'password' : 'text'"
                         hint=""
-                        filled
                     >
                         <template #append>
                             <QIcon
@@ -102,14 +109,15 @@ defineExpose({ show: () => changePassDialog.value.show() });
                         v-model="passwords.repeatPassword"
                         :type="showRpPwd ? 'password' : 'text'"
                         hint=""
-                    />
-                    <template #append>
-                        <QIcon
-                            :name="showRpPwd ? 'visibility_off' : 'visibility'"
-                            class="cursor-pointer"
-                            @click="showRpPwd = !showRpPwd"
-                        />
-                    </template>
+                    >
+                        <template #append>
+                            <QIcon
+                                :name="showRpPwd ? 'visibility_off' : 'visibility'"
+                                class="cursor-pointer"
+                                @click="showRpPwd = !showRpPwd"
+                            />
+                        </template>
+                    </VnInput>
                 </QCardSection>
             </QForm>
             <QCardActions>
-- 
2.40.1


From f0364124cce57e599a4d708635ff7caa75941726 Mon Sep 17 00:00:00 2001
From: carlossa <carlossa@verdnatura.es>
Date: Thu, 26 Dec 2024 07:29:00 +0100
Subject: [PATCH 3/9] fix: refs #7699 add pwd vnInput

---
 src/components/common/VnChangePassword.vue | 34 +++++++++------------
 src/components/common/VnInput.vue          | 35 +++++++++++-----------
 2 files changed, 31 insertions(+), 38 deletions(-)

diff --git a/src/components/common/VnChangePassword.vue b/src/components/common/VnChangePassword.vue
index 9026df85c..4077359ff 100644
--- a/src/components/common/VnChangePassword.vue
+++ b/src/components/common/VnChangePassword.vue
@@ -76,48 +76,42 @@ defineExpose({ show: () => changePassDialog.value.show() });
                         v-if="props.askOldPass"
                         :label="t('Old password')"
                         v-model="passwords.oldPassword"
-                        :type="showPwd ? 'password' : 'text'"
+                        type="password"
                         :required="true"
                         autofocus
-                    >
-                        <template #append>
-                            <QIcon
-                                :name="showPwd ? 'visibility_off' : 'visibility'"
-                                class="cursor-pointer"
-                                @click="showPwd = !showPwd"
-                            />
-                        </template>
-                    </VnInput>
+                        :clearable="true"
+                        :show-pwd="showPwd"
+                        @update:show-pwd="showPwd = $event"
+                    />
                     <VnInput
                         :required="true"
                         autofocus
                         v-model="passwords.newPassword"
                         :label="$t('New password')"
-                        :type="showPwd ? 'password' : 'text'"
-                        hint=""
+                        :show-pwd="showPwd"
+                        @update:show-pwd="showPwd = $event"
                     >
-                        <template #append>
+                        <!-- <template #append>
                             <QIcon
                                 :name="showPwd ? 'visibility_off' : 'visibility'"
                                 class="cursor-pointer"
                                 @click="showPwd = !showPwd"
                             />
-                        </template>
+                        </template> -->
                     </VnInput>
                     <VnInput
                         :label="t('Repeat password')"
                         v-model="passwords.repeatPassword"
-                        :type="showRpPwd ? 'password' : 'text'"
-                        hint=""
-                    >
-                        <template #append>
+                        type="password"
+                        :toggle-visibility="true"
+                    />
+                    <!-- <template #append>
                             <QIcon
                                 :name="showRpPwd ? 'visibility_off' : 'visibility'"
                                 class="cursor-pointer"
                                 @click="showRpPwd = !showRpPwd"
                             />
-                        </template>
-                    </VnInput>
+                        </template> -->
                 </QCardSection>
             </QForm>
             <QCardActions>
diff --git a/src/components/common/VnInput.vue b/src/components/common/VnInput.vue
index 57a495ac3..31a3cd411 100644
--- a/src/components/common/VnInput.vue
+++ b/src/components/common/VnInput.vue
@@ -42,9 +42,15 @@ const $props = defineProps({
         type: Number,
         default: null,
     },
+    toggleVisibility: {
+        // Nueva propiedad
+        type: Boolean,
+        default: false,
+    },
 });
 
 const vnInputRef = ref(null);
+const showPassword = ref(false); // Estado para la visibilidad de contraseña
 const value = computed({
     get() {
         return $props.modelValue;
@@ -124,7 +130,7 @@ const handleInsertMode = (e) => {
             ref="vnInputRef"
             v-model="value"
             v-bind="{ ...$attrs, ...styleAttrs }"
-            :type="$attrs.type"
+            :type="toggleVisibility ? (showPassword ? 'text' : 'password') : $attrs.type"
             :class="{ required: isRequired }"
             @keyup.enter="emit('keyup.enter')"
             @keydown="handleKeydown"
@@ -134,10 +140,18 @@ const handleInsertMode = (e) => {
             hide-bottom-space
             :data-cy="$attrs.dataCy ?? $attrs.label + '_input'"
         >
-            <template v-if="$slots.prepend" #prepend>
+            <template #prepend>
                 <slot name="prepend" />
             </template>
             <template #append>
+                <!-- Icono para mostrar/ocultar contraseña -->
+                <QIcon
+                    v-if="toggleVisibility"
+                    :name="showPassword ? 'visibility_off' : 'visibility'"
+                    class="cursor-pointer"
+                    @click="showPassword = !showPassword"
+                />
+                <!-- Ícono para borrar el valor -->
                 <QIcon
                     name="close"
                     size="xs"
@@ -155,7 +169,7 @@ const handleInsertMode = (e) => {
                             emit('remove');
                         }
                     "
-                ></QIcon>
+                />
                 <slot name="append" v-if="$slots.append && !$attrs.disabled" />
                 <QIcon v-if="info" name="info">
                     <QTooltip max-width="350px">
@@ -166,18 +180,3 @@ const handleInsertMode = (e) => {
         </QInput>
     </div>
 </template>
-<i18n>
-    en:
-        inputMin: Must be more than {value}
-        maxLength: The value exceeds {value} characters
-        inputMax: Must be less than {value}
-    es:
-        inputMin: Debe ser mayor a {value}
-        maxLength: El valor excede los {value} carácteres
-        inputMax: Debe ser menor a {value}
-</i18n>
-<style lang="scss">
-.q-field__append {
-    padding-inline: 0;
-}
-</style>
-- 
2.40.1


From 0d9ba62d375a9423cfce045da325c5ae96293e08 Mon Sep 17 00:00:00 2001
From: carlossa <carlossa@verdnatura.es>
Date: Thu, 26 Dec 2024 07:34:31 +0100
Subject: [PATCH 4/9] fix: refs #7699 fix vnChangePassword, clean VnInput

---
 src/components/common/VnChangePassword.vue | 43 +++++++++-------------
 src/components/common/VnInput.vue          |  5 +--
 2 files changed, 18 insertions(+), 30 deletions(-)

diff --git a/src/components/common/VnChangePassword.vue b/src/components/common/VnChangePassword.vue
index 4077359ff..c17c0ffbd 100644
--- a/src/components/common/VnChangePassword.vue
+++ b/src/components/common/VnChangePassword.vue
@@ -19,8 +19,6 @@ const changePassDialog = ref();
 const passwords = ref({ newPassword: null, repeatPassword: null });
 const requirements = ref([]);
 const isLoading = ref(false);
-const showPwd = ref(true);
-const showRpPwd = ref(true);
 
 const validate = async () => {
     const { newPassword, repeatPassword, oldPassword } = passwords.value;
@@ -79,39 +77,32 @@ defineExpose({ show: () => changePassDialog.value.show() });
                         type="password"
                         :required="true"
                         autofocus
-                        :clearable="true"
-                        :show-pwd="showPwd"
-                        @update:show-pwd="showPwd = $event"
+                        :toggle-visibility="true"
                     />
                     <VnInput
-                        :required="true"
-                        autofocus
+                        :label="t('New password')"
                         v-model="passwords.newPassword"
-                        :label="$t('New password')"
-                        :show-pwd="showPwd"
-                        @update:show-pwd="showPwd = $event"
-                    >
-                        <!-- <template #append>
-                            <QIcon
-                                :name="showPwd ? 'visibility_off' : 'visibility'"
-                                class="cursor-pointer"
-                                @click="showPwd = !showPwd"
-                            />
-                        </template> -->
-                    </VnInput>
+                        type="password"
+                        :required="true"
+                        :toggle-visibility="true"
+                        :info="
+                            t('passwordRequirements', {
+                                length: requirements.length,
+                                nAlpha: requirements.nAlpha,
+                                nUpper: requirements.nUpper,
+                                nDigits: requirements.nDigits,
+                                nPunct: requirements.nPunct,
+                            })
+                        "
+                        autofocus
+                    />
+
                     <VnInput
                         :label="t('Repeat password')"
                         v-model="passwords.repeatPassword"
                         type="password"
                         :toggle-visibility="true"
                     />
-                    <!-- <template #append>
-                            <QIcon
-                                :name="showRpPwd ? 'visibility_off' : 'visibility'"
-                                class="cursor-pointer"
-                                @click="showRpPwd = !showRpPwd"
-                            />
-                        </template> -->
                 </QCardSection>
             </QForm>
             <QCardActions>
diff --git a/src/components/common/VnInput.vue b/src/components/common/VnInput.vue
index 31a3cd411..f2fdb8ef1 100644
--- a/src/components/common/VnInput.vue
+++ b/src/components/common/VnInput.vue
@@ -43,14 +43,13 @@ const $props = defineProps({
         default: null,
     },
     toggleVisibility: {
-        // Nueva propiedad
         type: Boolean,
         default: false,
     },
 });
 
 const vnInputRef = ref(null);
-const showPassword = ref(false); // Estado para la visibilidad de contraseña
+const showPassword = ref(false);
 const value = computed({
     get() {
         return $props.modelValue;
@@ -144,14 +143,12 @@ const handleInsertMode = (e) => {
                 <slot name="prepend" />
             </template>
             <template #append>
-                <!-- Icono para mostrar/ocultar contraseña -->
                 <QIcon
                     v-if="toggleVisibility"
                     :name="showPassword ? 'visibility_off' : 'visibility'"
                     class="cursor-pointer"
                     @click="showPassword = !showPassword"
                 />
-                <!-- Ícono para borrar el valor -->
                 <QIcon
                     name="close"
                     size="xs"
-- 
2.40.1


From 4c57e55f254053f65df7e49217727906df84305e Mon Sep 17 00:00:00 2001
From: carlossa <carlossa@verdnatura.es>
Date: Thu, 2 Jan 2025 13:23:02 +0100
Subject: [PATCH 5/9] fix: refs #7699 fix vnInputPassword

---
 src/components/common/VnChangePassword.vue | 13 +++-----
 src/components/common/VnInput.vue          | 12 +-------
 src/components/common/VnInputPassword.vue  | 36 ++++++++++++++++++++++
 3 files changed, 42 insertions(+), 19 deletions(-)
 create mode 100644 src/components/common/VnInputPassword.vue

diff --git a/src/components/common/VnChangePassword.vue b/src/components/common/VnChangePassword.vue
index c17c0ffbd..acc895f0e 100644
--- a/src/components/common/VnChangePassword.vue
+++ b/src/components/common/VnChangePassword.vue
@@ -2,9 +2,9 @@
 import { ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 import VnRow from '../ui/VnRow.vue';
-import VnInput from './VnInput.vue';
 import FetchData from '../FetchData.vue';
 import useNotify from 'src/composables/useNotify';
+import VnInputPassword from './VnInputPassword.vue';
 
 const props = defineProps({
     submitFn: { type: Function, default: () => {} },
@@ -70,19 +70,17 @@ defineExpose({ show: () => changePassDialog.value.show() });
             </QCardSection>
             <QForm ref="form">
                 <QCardSection>
-                    <VnInput
+                    <VnInputPassword
                         v-if="props.askOldPass"
                         :label="t('Old password')"
                         v-model="passwords.oldPassword"
-                        type="password"
                         :required="true"
-                        autofocus
                         :toggle-visibility="true"
+                        autofocus
                     />
-                    <VnInput
+                    <VnInputPassword
                         :label="t('New password')"
                         v-model="passwords.newPassword"
-                        type="password"
                         :required="true"
                         :toggle-visibility="true"
                         :info="
@@ -97,10 +95,9 @@ defineExpose({ show: () => changePassDialog.value.show() });
                         autofocus
                     />
 
-                    <VnInput
+                    <VnInputPassword
                         :label="t('Repeat password')"
                         v-model="passwords.repeatPassword"
-                        type="password"
                         :toggle-visibility="true"
                     />
                 </QCardSection>
diff --git a/src/components/common/VnInput.vue b/src/components/common/VnInput.vue
index f2fdb8ef1..e165b9e3f 100644
--- a/src/components/common/VnInput.vue
+++ b/src/components/common/VnInput.vue
@@ -42,10 +42,6 @@ const $props = defineProps({
         type: Number,
         default: null,
     },
-    toggleVisibility: {
-        type: Boolean,
-        default: false,
-    },
 });
 
 const vnInputRef = ref(null);
@@ -129,7 +125,7 @@ const handleInsertMode = (e) => {
             ref="vnInputRef"
             v-model="value"
             v-bind="{ ...$attrs, ...styleAttrs }"
-            :type="toggleVisibility ? (showPassword ? 'text' : 'password') : $attrs.type"
+            :type="$attrs.type"
             :class="{ required: isRequired }"
             @keyup.enter="emit('keyup.enter')"
             @keydown="handleKeydown"
@@ -143,12 +139,6 @@ const handleInsertMode = (e) => {
                 <slot name="prepend" />
             </template>
             <template #append>
-                <QIcon
-                    v-if="toggleVisibility"
-                    :name="showPassword ? 'visibility_off' : 'visibility'"
-                    class="cursor-pointer"
-                    @click="showPassword = !showPassword"
-                />
                 <QIcon
                     name="close"
                     size="xs"
diff --git a/src/components/common/VnInputPassword.vue b/src/components/common/VnInputPassword.vue
new file mode 100644
index 000000000..f0e72ab6d
--- /dev/null
+++ b/src/components/common/VnInputPassword.vue
@@ -0,0 +1,36 @@
+<script setup>
+import VnInput from 'src/components/common/VnInput.vue';
+import { ref } from 'vue';
+
+const $props = defineProps({
+    modelValue: {
+        type: [String, Number],
+        default: null,
+    },
+    toggleVisibility: {
+        type: Boolean,
+        default: false,
+    },
+});
+
+const showPassword = ref(false);
+const model = defineModel({ type: [Number, String] });
+</script>
+<template>
+    <VnInput
+        v-bind="{ ...$attrs }"
+        v-model.number="model"
+        :type="
+            $props.toggleVisibility ? (showPassword ? 'text' : 'password') : $attrs.type
+        "
+        hint=""
+    >
+        <template #append>
+            <QIcon
+                :name="showPassword ? 'visibility_off' : 'visibility'"
+                class="cursor-pointer"
+                @click="showPassword = !showPassword"
+            />
+        </template>
+    </VnInput>
+</template>
-- 
2.40.1


From 60f3ea838aadd04ecc609a1f8a9b82fab1a6e400 Mon Sep 17 00:00:00 2001
From: carlossa <carlossa@verdnatura.es>
Date: Fri, 3 Jan 2025 08:18:11 +0100
Subject: [PATCH 6/9] fix: refs #7699 fix component

---
 src/components/common/VnChangePassword.vue      | 2 +-
 src/pages/Login/LoginMain.vue                   | 7 +++----
 test/cypress/integration/outLogin/login.spec.js | 1 +
 3 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/components/common/VnChangePassword.vue b/src/components/common/VnChangePassword.vue
index acc895f0e..780cdc17b 100644
--- a/src/components/common/VnChangePassword.vue
+++ b/src/components/common/VnChangePassword.vue
@@ -4,7 +4,7 @@ import { useI18n } from 'vue-i18n';
 import VnRow from '../ui/VnRow.vue';
 import FetchData from '../FetchData.vue';
 import useNotify from 'src/composables/useNotify';
-import VnInputPassword from './VnInputPassword.vue';
+import VnInputPassword from 'VnInputPassword.vue';
 
 const props = defineProps({
     submitFn: { type: Function, default: () => {} },
diff --git a/src/pages/Login/LoginMain.vue b/src/pages/Login/LoginMain.vue
index 44b868ebd..a4c3566a9 100644
--- a/src/pages/Login/LoginMain.vue
+++ b/src/pages/Login/LoginMain.vue
@@ -3,7 +3,7 @@ import { ref } from 'vue';
 import { Notify } from 'quasar';
 import { useI18n } from 'vue-i18n';
 import { useRouter } from 'vue-router';
-
+import VnInputPassword from 'src/components/common/VnInputPassword.vue';
 import { useSession } from 'src/composables/useSession';
 import { useLogin } from 'src/composables/useLogin';
 
@@ -63,11 +63,10 @@ async function onSubmit() {
             :rules="[(val) => (val && val.length > 0) || t('login.fieldRequired')]"
             color="primary"
         />
-        <VnInput
-            type="password"
+        <VnInputPassword
             v-model="password"
             :label="t('login.password')"
-            lazy-rules
+            :toggle-visibility="true"
             :rules="[(val) => (val && val.length > 0) || t('login.fieldRequired')]"
             class="red"
         />
diff --git a/test/cypress/integration/outLogin/login.spec.js b/test/cypress/integration/outLogin/login.spec.js
index 3db223cdb..2bd5a8c3b 100755
--- a/test/cypress/integration/outLogin/login.spec.js
+++ b/test/cypress/integration/outLogin/login.spec.js
@@ -19,6 +19,7 @@ describe('Login', () => {
     it('should fail to log in using wrong password', () => {
         cy.get('input[aria-label="Username"]').type('employee');
         cy.get('input[aria-label="Password"]').type('wrongPassword');
+        cy.get('.q-field__append > .q-icon');
         cy.get('button[type="submit"]').click();
         cy.get('.q-notification__message').should(
             'have.text',
-- 
2.40.1


From cd6cc5c865dbf2cd963bf4ed6abf69e4fb4941c1 Mon Sep 17 00:00:00 2001
From: carlossa <carlossa@verdnatura.es>
Date: Fri, 3 Jan 2025 08:46:22 +0100
Subject: [PATCH 7/9] fix: refs #7699 fix vnInputPassword

---
 src/pages/Account/AccountCreate.vue              |  5 +++--
 src/pages/Account/AccountLdap.vue                |  4 ++--
 src/pages/Account/AccountList.vue                |  4 ++--
 src/pages/Account/AccountSamba.vue               |  5 +++--
 src/pages/Account/Card/AccountDescriptorMenu.vue |  4 ++--
 src/pages/Login/ResetPassword.vue                | 11 +++++------
 6 files changed, 17 insertions(+), 16 deletions(-)

diff --git a/src/pages/Account/AccountCreate.vue b/src/pages/Account/AccountCreate.vue
index 6b7c049c8..b925ff06a 100644
--- a/src/pages/Account/AccountCreate.vue
+++ b/src/pages/Account/AccountCreate.vue
@@ -6,6 +6,7 @@ import FormModelPopup from 'components/FormModelPopup.vue';
 import VnSelect from 'src/components/common/VnSelect.vue';
 import FetchData from 'components/FetchData.vue';
 import VnInput from 'src/components/common/VnInput.vue';
+import VnInputPassword from 'src/components/common/VnInputPassword.vue';
 
 const { t } = useI18n();
 const router = useRouter();
@@ -61,10 +62,10 @@ const redirectToAccountBasicData = (_, { id }) => {
                     hide-selected
                     :rules="validate('VnUser.roleFk')"
                 />
-                <VnInput
+                <VnInputPassword
                     v-model="data.password"
                     :label="t('ldap.password')"
-                    type="password"
+                    :toggle-visibility="true"
                     :rules="validate('VnUser.password')"
                 />
                 <QCheckbox
diff --git a/src/pages/Account/AccountLdap.vue b/src/pages/Account/AccountLdap.vue
index bb220aa2e..4710f961b 100644
--- a/src/pages/Account/AccountLdap.vue
+++ b/src/pages/Account/AccountLdap.vue
@@ -8,6 +8,7 @@ import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
 import { useArrayData } from 'src/composables/useArrayData';
 import useNotify from 'src/composables/useNotify.js';
 import axios from 'axios';
+import VnInputPassword from 'src/components/common/VnInputPassword.vue';
 
 const { t } = useI18n();
 const { notify } = useNotify();
@@ -128,10 +129,9 @@ onMounted(async () => await getInitialLdapConfig());
                         :required="true"
                         :rules="validate('LdapConfig.rdn')"
                     />
-                    <VnInput
+                    <VnInputPassword
                         :label="t('ldap.password')"
                         clearable
-                        type="password"
                         v-model="data.password"
                         :required="true"
                         :rules="validate('LdapConfig.password')"
diff --git a/src/pages/Account/AccountList.vue b/src/pages/Account/AccountList.vue
index c1c75fcee..6fde0e422 100644
--- a/src/pages/Account/AccountList.vue
+++ b/src/pages/Account/AccountList.vue
@@ -7,6 +7,7 @@ import { useSummaryDialog } from 'src/composables/useSummaryDialog';
 import VnInput from 'src/components/common/VnInput.vue';
 import VnSection from 'src/components/common/VnSection.vue';
 import FetchData from 'src/components/FetchData.vue';
+import VnInputPassword from 'src/components/common/VnInputPassword.vue';
 
 const { t } = useI18n();
 const { viewSummary } = useSummaryDialog();
@@ -168,10 +169,9 @@ function exprBuilder(param, value) {
             >
                 <template #more-create-dialog="{ data }">
                     <QCardSection>
-                        <VnInput
+                        <VnInputPassword
                             :label="t('Password')"
                             v-model="data.password"
-                            type="password"
                             :required="true"
                             autocomplete="new-password"
                         />
diff --git a/src/pages/Account/AccountSamba.vue b/src/pages/Account/AccountSamba.vue
index 699a638eb..cf65cceb3 100644
--- a/src/pages/Account/AccountSamba.vue
+++ b/src/pages/Account/AccountSamba.vue
@@ -9,6 +9,8 @@ import { useArrayData } from 'src/composables/useArrayData';
 import useNotify from 'src/composables/useNotify.js';
 import axios from 'axios';
 
+import VnInputPassword from 'src/components/common/VnInputPassword.vue';
+
 const { t } = useI18n();
 const { notify } = useNotify();
 const arrayData = useArrayData('AccountSamba');
@@ -143,10 +145,9 @@ onMounted(async () => await getInitialSambaConfig());
                         v-model="data.adUser"
                         :rules="validate('SambaConfigs.adUser')"
                     />
-                    <VnInput
+                    <VnInputPassword
                         :label="t('samba.passwordAD')"
                         clearable
-                        type="password"
                         v-model="data.adPassword"
                     />
                     <VnInput
diff --git a/src/pages/Account/Card/AccountDescriptorMenu.vue b/src/pages/Account/Card/AccountDescriptorMenu.vue
index 1780b4247..c091962fc 100644
--- a/src/pages/Account/Card/AccountDescriptorMenu.vue
+++ b/src/pages/Account/Card/AccountDescriptorMenu.vue
@@ -9,6 +9,7 @@ import { useArrayData } from 'src/composables/useArrayData';
 import VnConfirm from 'src/components/ui/VnConfirm.vue';
 import VnChangePassword from 'src/components/common/VnChangePassword.vue';
 import { useQuasar } from 'quasar';
+import VnInputPassword from 'src/components/common/VnInputPassword.vue';
 
 const $props = defineProps({
     hasAccount: {
@@ -97,14 +98,13 @@ async function sync() {
                     <QTooltip>{{ t('account.card.actions.sync.tooltip') }}</QTooltip>
                 </QIcon></QCheckbox
             >
-            <QInput
+            <VnInputPassword
                 v-if="shouldSyncPassword"
                 :label="t('login.password')"
                 v-model="syncPassword"
                 class="full-width"
                 clearable
                 clear-icon="close"
-                type="password"
             />
         </template>
     </VnConfirm>
diff --git a/src/pages/Login/ResetPassword.vue b/src/pages/Login/ResetPassword.vue
index 2751f1ceb..081801e0e 100644
--- a/src/pages/Login/ResetPassword.vue
+++ b/src/pages/Login/ResetPassword.vue
@@ -7,6 +7,7 @@ import axios from 'axios';
 
 import VnInput from 'components/common/VnInput.vue';
 import VnOutForm from 'components/ui/VnOutForm.vue';
+import VnInputPassword from 'src/components/common/VnInputPassword.vue';
 
 const quasar = useQuasar();
 const router = useRouter();
@@ -54,8 +55,7 @@ async function onSubmit() {
 <template>
     <VnOutForm @submit="onSubmit" :title="t('globals.pageTitles.resetPassword')">
         <template #default>
-            <VnInput
-                type="password"
+            <VnInputPassword
                 :label="t('login.password')"
                 v-model="newPassword"
                 :info="
@@ -72,9 +72,8 @@ async function onSubmit() {
                 <template #prepend>
                     <QIcon name="password" />
                 </template>
-            </VnInput>
-            <VnInput
-                type="password"
+            </VnInputPassword>
+            <VnInputPassword
                 :label="t('resetPassword.repeatPassword')"
                 v-model="repeatPassword"
                 required
@@ -82,7 +81,7 @@ async function onSubmit() {
                 <template #prepend>
                     <QIcon name="password" />
                 </template>
-            </VnInput>
+            </VnInputPassword>
         </template>
         <template #buttons>
             <QBtn
-- 
2.40.1


From a89fad0ae2d0a0d56065e5ab6bff34b8dc9ad1ab Mon Sep 17 00:00:00 2001
From: carlossa <carlossa@verdnatura.es>
Date: Fri, 3 Jan 2025 09:35:03 +0100
Subject: [PATCH 8/9] fix: refs #7699 fix tfront clean code

---
 src/components/common/VnChangePassword.vue | 2 +-
 src/pages/Account/AccountList.vue          | 1 -
 src/pages/Account/AccountSamba.vue         | 1 -
 3 files changed, 1 insertion(+), 3 deletions(-)

diff --git a/src/components/common/VnChangePassword.vue b/src/components/common/VnChangePassword.vue
index 780cdc17b..d8374498f 100644
--- a/src/components/common/VnChangePassword.vue
+++ b/src/components/common/VnChangePassword.vue
@@ -4,7 +4,7 @@ import { useI18n } from 'vue-i18n';
 import VnRow from '../ui/VnRow.vue';
 import FetchData from '../FetchData.vue';
 import useNotify from 'src/composables/useNotify';
-import VnInputPassword from 'VnInputPassword.vue';
+import VnInputPassword from 'src/components/common/VnInputPassword.vue';
 
 const props = defineProps({
     submitFn: { type: Function, default: () => {} },
diff --git a/src/pages/Account/AccountList.vue b/src/pages/Account/AccountList.vue
index 6fde0e422..ea8daba0d 100644
--- a/src/pages/Account/AccountList.vue
+++ b/src/pages/Account/AccountList.vue
@@ -4,7 +4,6 @@ import { computed, ref } from 'vue';
 import VnTable from 'components/VnTable/VnTable.vue';
 import AccountSummary from './Card/AccountSummary.vue';
 import { useSummaryDialog } from 'src/composables/useSummaryDialog';
-import VnInput from 'src/components/common/VnInput.vue';
 import VnSection from 'src/components/common/VnSection.vue';
 import FetchData from 'src/components/FetchData.vue';
 import VnInputPassword from 'src/components/common/VnInputPassword.vue';
diff --git a/src/pages/Account/AccountSamba.vue b/src/pages/Account/AccountSamba.vue
index cf65cceb3..7b36de85f 100644
--- a/src/pages/Account/AccountSamba.vue
+++ b/src/pages/Account/AccountSamba.vue
@@ -8,7 +8,6 @@ import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
 import { useArrayData } from 'src/composables/useArrayData';
 import useNotify from 'src/composables/useNotify.js';
 import axios from 'axios';
-
 import VnInputPassword from 'src/components/common/VnInputPassword.vue';
 
 const { t } = useI18n();
-- 
2.40.1


From 3953721424e978966a43510068be8cd6fab14ef2 Mon Sep 17 00:00:00 2001
From: carlossa <carlossa@verdnatura.es>
Date: Tue, 7 Jan 2025 11:18:16 +0100
Subject: [PATCH 9/9] fix: refs #7699 fix component

---
 src/components/common/VnInputPassword.vue | 11 +++--------
 1 file changed, 3 insertions(+), 8 deletions(-)

diff --git a/src/components/common/VnInputPassword.vue b/src/components/common/VnInputPassword.vue
index f0e72ab6d..56981c0c3 100644
--- a/src/components/common/VnInputPassword.vue
+++ b/src/components/common/VnInputPassword.vue
@@ -2,11 +2,8 @@
 import VnInput from 'src/components/common/VnInput.vue';
 import { ref } from 'vue';
 
+const model = defineModel({ type: [Number, String] });
 const $props = defineProps({
-    modelValue: {
-        type: [String, Number],
-        default: null,
-    },
     toggleVisibility: {
         type: Boolean,
         default: false,
@@ -14,18 +11,16 @@ const $props = defineProps({
 });
 
 const showPassword = ref(false);
-const model = defineModel({ type: [Number, String] });
 </script>
 <template>
     <VnInput
         v-bind="{ ...$attrs }"
-        v-model.number="model"
+        v-model="model"
         :type="
             $props.toggleVisibility ? (showPassword ? 'text' : 'password') : $attrs.type
         "
-        hint=""
     >
-        <template #append>
+        <template #append v-if="toggleVisibility">
             <QIcon
                 :name="showPassword ? 'visibility_off' : 'visibility'"
                 class="cursor-pointer"
-- 
2.40.1