Richiesta Cambio Password: ti manda il codice a 6 cifre e poterlo inserire sulla APP.

src/views/updatepassword/updatepassword.ts

@@ -28,6 +28,8 @@ export default defineComponent({
     const $router = useRouter()
     const $route = useRoute()
 
+    const typePassword = ref('password')
+
     const emailsent = ref(false)
     const form = reactive({
       password: '',
@@ -93,6 +95,11 @@ export default defineComponent({
 
     }
 
+    function showPassword() {
+      //
+      typePassword.value = typePassword.value === 'password' ? 'text' : 'password'
+    }
+
 
     return {
       form,
@@ -100,6 +107,8 @@ export default defineComponent({
       submit,
       tools,
       v$,
+      showPassword,
+      typePassword,
     }
   }
 })

src/views/updatepassword/updatepassword.vue

@@ -17,7 +17,7 @@
 
           <q-input
             v-model="form.password"
-            type="password"
+            :type="typePassword"
             dense
             rounded outlined
             @blur="v$.password.$touch"
@@ -26,17 +26,27 @@
             maxlength="30"
             :label="$t('reg.password')">
 
+
+            <template v-slot:append>
+              <q-btn
+                tabindex="-1"
+                :icon="typePassword === `password` ? `fas fa-eye-slash` : `fas fa-eye`"
+                @click="showPassword"
+              >
+              </q-btn>
+            </template>
             <template v-slot:prepend>
               <q-icon name="vpn_key"/>
             </template>
 
+
           </q-input>
 
           <div class="q-my-sm"></div>
 
           <q-input
             v-model="form.repeatPassword"
-            type="password"
+            :type="typePassword"
             dense
             maxlength="30"
             rounded outlined
@@ -49,6 +59,14 @@
             <template v-slot:prepend>
               <q-icon name="vpn_key"/>
             </template>
+            <template v-slot:append>
+              <q-btn
+                tabindex="-1"
+                :icon="typePassword === `password` ? `fas fa-eye-slash` : `fas fa-eye`"
+                @click="showPassword"
+              >
+              </q-btn>
+            </template>
 
           </q-input>
 
@@ -61,8 +79,6 @@
           </div>
         </div>
 
-        <pre>{{ v$.$errors }}</pre>
-
       </div>
       <div v-else>
         <q-banner