From 2d00d6a8eb0da9fdbeb902a7977f22cdfd7e6d28 Mon Sep 17 00:00:00 2001
From: Your Name <your.email@example.com>
Date: Sun, 31 May 2026 23:30:12 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E7=99=BB=E5=BD=95=E9=A1=B5=E5=B1=85?=
 =?UTF-8?q?=E4=B8=AD=E5=B8=83=E5=B1=80=20+=20=E5=88=A0=E9=99=A4Logo?=
 =?UTF-8?q?=E5=8C=BA=E5=9F=9F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 frontend/src/pages/LoginPage.vue | 169 +++++++++++++++----------------
 1 file changed, 82 insertions(+), 87 deletions(-)

diff --git a/frontend/src/pages/LoginPage.vue b/frontend/src/pages/LoginPage.vue
index b4a6e11a..3aab0ff2 100644
--- a/frontend/src/pages/LoginPage.vue
+++ b/frontend/src/pages/LoginPage.vue
@@ -4,99 +4,87 @@
     <div class="wallpaper-bg" :style="{ backgroundImage: `url(${currentWallpaper})` }" />
     <div class="wallpaper-overlay" />
 
-    <v-container fluid class="fill-height pa-0 login-container">
-      <v-row align="center" justify="center" no-gutters style="min-height: 100vh">
-        <v-col cols="12" sm="8" md="5" lg="4" xl="3">
-          <v-card elevation="0" rounded="xl" class="login-card pa-10" border>
-            <!-- Logo -->
-            <div class="text-center mb-8">
-              <v-avatar color="primary" size="56" rounded="xl" class="mb-4">
-                <v-icon icon="mdi-server-network" size="30" color="white" />
-              </v-avatar>
-              <h1 class="text-h5 font-weight-bold mb-1">登录 Nexus</h1>
-              <p class="text-body-2 text-medium-emphasis">服务器运维管理平台</p>
-            </div>
+    <div class="login-center">
+      <v-card elevation="0" rounded="xl" class="login-card pa-10" border>
 
-            <!-- Error -->
-            <v-alert v-if="error" type="error" density="compact" class="mb-4" closable @click:close="error = ''" rounded="lg" variant="tonal">
-              {{ error }}
-            </v-alert>
+        <!-- Error -->
+        <v-alert v-if="error" type="error" density="compact" class="mb-4" closable @click:close="error = ''" rounded="lg" variant="tonal">
+          {{ error }}
+        </v-alert>
 
-            <!-- Lockout -->
-            <v-alert v-if="lockoutUntil" type="warning" density="compact" class="mb-4" rounded="lg" variant="tonal">
-              账户已锁定，请 {{ remainingMinutes }} 分钟后重试
-            </v-alert>
+        <!-- Lockout -->
+        <v-alert v-if="lockoutUntil" type="warning" density="compact" class="mb-4" rounded="lg" variant="tonal">
+          账户已锁定，请 {{ remainingMinutes }} 分钟后重试
+        </v-alert>
 
-            <!-- Form -->
-            <v-form @submit.prevent="doLogin">
-              <v-text-field
-                v-model="username"
-                label="用户名"
-                variant="outlined"
-                density="comfortable"
-                prepend-inner-icon="mdi-account-outline"
-                :disabled="loading"
-                class="mb-4"
-                autocomplete="username"
-                rounded="lg"
-                hide-details="auto"
-              />
+        <!-- Form -->
+        <v-form @submit.prevent="doLogin">
+          <v-text-field
+            v-model="username"
+            label="用户名"
+            variant="outlined"
+            density="comfortable"
+            prepend-inner-icon="mdi-account-outline"
+            :disabled="loading"
+            class="mb-4"
+            autocomplete="username"
+            rounded="lg"
+            hide-details="auto"
+          />
 
-              <v-text-field
-                v-model="password"
-                label="密码"
-                variant="outlined"
-                density="comfortable"
-                prepend-inner-icon="mdi-lock-outline"
-                :append-inner-icon="showPassword ? 'mdi-eye' : 'mdi-eye-off'"
-                :type="showPassword ? 'text' : 'password'"
-                @click:append-inner="showPassword = !showPassword"
-                :disabled="loading"
-                class="mb-4"
-                autocomplete="current-password"
-                rounded="lg"
-                hide-details="auto"
-              />
+          <v-text-field
+            v-model="password"
+            label="密码"
+            variant="outlined"
+            density="comfortable"
+            prepend-inner-icon="mdi-lock-outline"
+            :append-inner-icon="showPassword ? 'mdi-eye' : 'mdi-eye-off'"
+            :type="showPassword ? 'text' : 'password'"
+            @click:append-inner="showPassword = !showPassword"
+            :disabled="loading"
+            class="mb-4"
+            autocomplete="current-password"
+            rounded="lg"
+            hide-details="auto"
+          />
 
-              <v-text-field
-                v-if="needTotp"
-                v-model="totpCode"
-                label="TOTP 验证码"
-                variant="outlined"
-                density="comfortable"
-                prepend-inner-icon="mdi-shield-key-outline"
-                :disabled="loading"
-                class="mb-4"
-                autocomplete="one-time-code"
-                rounded="lg"
-                hide-details="auto"
-              />
+          <v-text-field
+            v-if="needTotp"
+            v-model="totpCode"
+            label="TOTP 验证码"
+            variant="outlined"
+            density="comfortable"
+            prepend-inner-icon="mdi-shield-key-outline"
+            :disabled="loading"
+            class="mb-4"
+            autocomplete="one-time-code"
+            rounded="lg"
+            hide-details="auto"
+          />
 
-              <v-btn
-                type="submit"
-                color="primary"
-                variant="flat"
-                block
-                size="large"
-                :loading="loading"
-                :disabled="!!lockoutUntil"
-                rounded="lg"
-                class="mt-2"
-                height="48"
-              >
-                登录
-              </v-btn>
-            </v-form>
+          <v-btn
+            type="submit"
+            color="primary"
+            variant="flat"
+            block
+            size="large"
+            :loading="loading"
+            :disabled="!!lockoutUntil"
+            rounded="lg"
+            class="mt-2"
+            height="48"
+          >
+            登录
+          </v-btn>
+        </v-form>
 
-            <div v-if="failedAttempts > 0 && !lockoutUntil" class="text-center mt-4">
-              <v-chip size="small" variant="tonal" color="warning" label>
-                已失败 {{ failedAttempts }} 次
-              </v-chip>
-            </div>
-          </v-card>
-        </v-col>
-      </v-row>
-    </v-container>
+        <div v-if="failedAttempts > 0 && !lockoutUntil" class="text-center mt-4">
+          <v-chip size="small" variant="tonal" color="warning" label>
+            已失败 {{ failedAttempts }} 次
+          </v-chip>
+        </div>
+      </v-card>
+    </div>
   </div>
 </template>
 
@@ -225,13 +213,20 @@ async function doLogin() {
   z-index: 1;
 }
 
-.login-container {
+.login-center {
   position: relative;
   z-index: 2;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  min-height: 100vh;
+  padding: 24px;
 }
 
 .login-card {
   backdrop-filter: blur(4px);
   background: rgba(var(--v-theme-surface), 0.92) !important;
+  width: 100%;
+  max-width: 420px;
 }
 </style>