From 8ae004b46623fb9ec3d652998a72f5bc2532ccb8 Mon Sep 17 00:00:00 2001
From: Mplan <mplan_@outlook.com>
Date: Tue, 28 Jul 2026 23:27:59 +0800
Subject: [PATCH] fix(auth): improve password form autocomplete

---
 src/views/auth/ForgotPasswordView.vue     |  9 +++++--
 src/views/auth/LoginView.vue              | 16 +++++++++---
 src/views/auth/RegisterView.vue           | 30 +++++++++++++++++------
 src/views/auth/ResetPasswordView.vue      | 22 ++++++++++++++---
 src/views/profile/ProfileSettingsView.vue | 10 ++++++++
 5 files changed, 69 insertions(+), 18 deletions(-)

diff --git a/src/views/auth/ForgotPasswordView.vue b/src/views/auth/ForgotPasswordView.vue
index c26a7e7..645b877 100644
--- a/src/views/auth/ForgotPasswordView.vue
+++ b/src/views/auth/ForgotPasswordView.vue
@@ -139,8 +139,13 @@ onUnmounted(() => {
             <NFormItem label="邮箱">
               <NInput
                 v-model:value="email"
-                required
-                autocomplete="email"
+                type="text"
+                :input-props="{
+                  autocomplete: 'email',
+                  inputmode: 'email',
+                  name: 'email',
+                  required: true,
+                }"
                 placeholder="your@email.com"
               />
             </NFormItem>
diff --git a/src/views/auth/LoginView.vue b/src/views/auth/LoginView.vue
index 190f2d8..7c0b197 100644
--- a/src/views/auth/LoginView.vue
+++ b/src/views/auth/LoginView.vue
@@ -79,8 +79,13 @@ async function handleLogin() {
           <NFormItem label="邮箱">
             <NInput
               v-model:value="email"
-              required
-              autocomplete="email"
+              type="text"
+              :input-props="{
+                autocomplete: 'username',
+                inputmode: 'email',
+                name: 'username',
+                required: true,
+              }"
               placeholder="your@email.com"
             />
           </NFormItem>
@@ -89,9 +94,12 @@ async function handleLogin() {
             <NInput
               v-model:value="password"
               type="password"
-              required
               show-password-on="click"
-              autocomplete="current-password"
+              :input-props="{
+                autocomplete: 'current-password',
+                name: 'current-password',
+                required: true,
+              }"
               placeholder="输入密码"
             />
           </NFormItem>
diff --git a/src/views/auth/RegisterView.vue b/src/views/auth/RegisterView.vue
index a0b195f..03e67b1 100644
--- a/src/views/auth/RegisterView.vue
+++ b/src/views/auth/RegisterView.vue
@@ -105,8 +105,11 @@ async function handleRegister() {
               <NInput
                 v-model:value="username"
                 type="text"
-                required
-                autocomplete="username"
+                :input-props="{
+                  autocomplete: 'username',
+                  name: 'username',
+                  required: true,
+                }"
                 placeholder="你的昵称"
                 maxlength="20"
               />
@@ -115,8 +118,13 @@ async function handleRegister() {
             <NFormItem label="邮箱">
               <NInput
                 v-model:value="email"
-                required
-                autocomplete="email"
+                type="text"
+                :input-props="{
+                  autocomplete: 'email',
+                  inputmode: 'email',
+                  name: 'email',
+                  required: true,
+                }"
                 placeholder="your@email.com"
               />
             </NFormItem>
@@ -125,9 +133,12 @@ async function handleRegister() {
               <NInput
                 v-model:value="password"
                 type="password"
-                required
                 show-password-on="click"
-                autocomplete="new-password"
+                :input-props="{
+                  autocomplete: 'new-password',
+                  name: 'new-password',
+                  required: true,
+                }"
                 placeholder="至少8位"
               />
             </NFormItem>
@@ -136,9 +147,12 @@ async function handleRegister() {
               <NInput
                 v-model:value="confirmPassword"
                 type="password"
-                required
                 show-password-on="click"
-                autocomplete="new-password"
+                :input-props="{
+                  autocomplete: 'new-password',
+                  name: 'confirm-new-password',
+                  required: true,
+                }"
                 placeholder="再次输入密码"
               />
             </NFormItem>
diff --git a/src/views/auth/ResetPasswordView.vue b/src/views/auth/ResetPasswordView.vue
index 301f9ee..fd28c92 100644
--- a/src/views/auth/ResetPasswordView.vue
+++ b/src/views/auth/ResetPasswordView.vue
@@ -142,13 +142,24 @@ onUnmounted(() => {
           </div>
 
           <NForm @submit.prevent="handleResetPassword">
+            <input
+              type="text"
+              name="username"
+              autocomplete="username"
+              class="sr-only"
+              tabindex="-1"
+              aria-label="账户用户名"
+            />
             <NFormItem label="新密码">
               <NInput
                 v-model:value="password"
                 type="password"
-                required
                 show-password-on="click"
-                autocomplete="new-password"
+                :input-props="{
+                  autocomplete: 'new-password',
+                  name: 'new-password',
+                  required: true,
+                }"
                 placeholder="至少 8 位"
               />
             </NFormItem>
@@ -157,9 +168,12 @@ onUnmounted(() => {
               <NInput
                 v-model:value="confirmPassword"
                 type="password"
-                required
                 show-password-on="click"
-                autocomplete="new-password"
+                :input-props="{
+                  autocomplete: 'new-password',
+                  name: 'confirm-new-password',
+                  required: true,
+                }"
                 placeholder="再次输入新密码"
               />
             </NFormItem>
diff --git a/src/views/profile/ProfileSettingsView.vue b/src/views/profile/ProfileSettingsView.vue
index e4280f3..ec2c8a0 100644
--- a/src/views/profile/ProfileSettingsView.vue
+++ b/src/views/profile/ProfileSettingsView.vue
@@ -149,6 +149,16 @@ async function savePassword() {
               </p>
             </div>
             <NForm class="grid gap-3" @submit.prevent="savePassword">
+              <input
+                :value="authStore.user?.email || ''"
+                type="text"
+                name="username"
+                autocomplete="username"
+                class="sr-only"
+                tabindex="-1"
+                aria-label="账户邮箱"
+                readonly
+              />
               <NInput
                 v-model:value="newPassword"
                 type="password"