优化密码找回流程、管理后台批量操作和上传体验 (#2)

Reviewed-on: #2

src/views/auth/LoginView.vue

@@ -8,13 +8,10 @@ const authStore = useAuthStore()
 const router = useRouter()
 const route = useRoute()
 
-const email = ref('')
+const email = ref(typeof route.query.email === 'string' ? route.query.email : '')
 const password = ref('')
 const error = ref('')
-const resetMessage = ref('')
-const resetMode = ref(false)
 const loading = ref(false)
-const resetLoading = ref(false)
 
 async function handleLogin() {
   error.value = ''
@@ -29,26 +26,6 @@ async function handleLogin() {
     loading.value = false
   }
 }
-
-async function handleSendResetEmail() {
-  error.value = ''
-  resetMessage.value = ''
-
-  if (!email.value) {
-    error.value = '请输入需要重置密码的邮箱。'
-    return
-  }
-
-  resetLoading.value = true
-  try {
-    await authStore.sendPasswordReset(email.value)
-    resetMessage.value = '重置密码邮件已发送，请查收邮箱。'
-  } catch (e: unknown) {
-    error.value = e instanceof Error ? e.message : '重置邮件发送失败，请稍后重试'
-  } finally {
-    resetLoading.value = false
-  }
-}
 </script>
 
 <template>
@@ -84,7 +61,7 @@ async function handleSendResetEmail() {
           <p class="mt-2 text-sm text-slate-500">输入邮箱和密码，继续你的天空档案。</p>
         </div>
 
-        <NForm @submit.prevent="resetMode ? handleSendResetEmail() : handleLogin()">
+        <NForm @submit.prevent="handleLogin">
           <NFormItem label="邮箱">
             <NInput
               v-model:value="email"
@@ -94,7 +71,7 @@ async function handleSendResetEmail() {
             />
           </NFormItem>
 
-          <NFormItem v-if="!resetMode" label="密码">
+          <NFormItem label="密码">
             <NInput
               v-model:value="password"
               type="password"
@@ -105,32 +82,19 @@ async function handleSendResetEmail() {
             />
           </NFormItem>
 
-          <p v-else class="mb-5 text-sm leading-6 text-slate-500">
-            输入注册邮箱，我们会发送一封密码重置邮件。点击邮件链接后即可设置新密码。
-          </p>
-
           <NAlert v-if="error" type="error" class="mb-4">
             {{ error }}
           </NAlert>
 
-          <NAlert v-if="resetMessage" type="success" class="mb-4">
-            {{ resetMessage }}
-          </NAlert>
-
           <NButton
             attr-type="submit"
             type="primary"
             block
             size="large"
             class="oc-primary-button oc-primary-button--teal"
-            :loading="resetMode ? resetLoading : loading"
+            :loading="loading"
           >
-            <template v-if="resetMode">
-              {{ resetLoading ? '发送中...' : '发送重置邮件' }}
-            </template>
-            <template v-else>
-              {{ loading ? '登录中...' : '登录' }}
-            </template>
+            {{ loading ? '登录中...' : '登录' }}
           </NButton>
         </NForm>
 
@@ -139,13 +103,12 @@ async function handleSendResetEmail() {
             没有账号？
             <RouterLink to="/register" class="font-semibold text-teal-700 hover:text-teal-800">去注册</RouterLink>
           </p>
-          <button
-            type="button"
+          <RouterLink
+            :to="email ? { path: '/forgot-password', query: { email } } : { path: '/forgot-password' }"
             class="font-semibold text-teal-700 transition-colors hover:text-teal-800"
-            @click="resetMode = !resetMode; error = ''; resetMessage = ''"
           >
-            {{ resetMode ? '返回登录' : '忘记密码？' }}
-          </button>
+            忘记密码？
+          </RouterLink>
         </div>
       </NCard>
     </div>