管理员默认密码 admin/admin，首次登录强制改密码；增加服务器部署配置

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

web/frontend/src/api/auth.ts

@@ -4,6 +4,7 @@ import type { AuthUser } from '@/stores/auth'
 export interface LoginResp {
   token: string
   user: AuthUser
+  require_password_change: boolean
 }
 
 export function login(username: string, password: string) {
@@ -17,3 +18,7 @@ export function logout() {
 export function me() {
   return client.get<AuthUser>('/me').then((r) => r.data)
 }
+
+export function changePassword(oldPassword: string, newPassword: string) {
+  return client.post('/change-password', { old_password: oldPassword, new_password: newPassword }).then((r) => r.data)
+}

web/frontend/src/router/index.ts

@@ -8,6 +8,12 @@ const routes: RouteRecordRaw[] = [
     component: () => import('@/views/LoginView.vue'),
     meta: { layout: 'blank', public: true },
   },
+  {
+    path: '/change-password',
+    name: 'change-password',
+    component: () => import('@/views/ChangePasswordView.vue'),
+    meta: { layout: 'blank' },
+  },
   { path: '/', redirect: '/scores' },
   {
     path: '/scores',
@@ -44,6 +50,9 @@ router.beforeEach((to) => {
   if (!auth.token) {
     return { path: '/login', query: { redirect: to.fullPath } }
   }
+  if (auth.requirePasswordChange && to.path !== '/change-password') {
+    return { path: '/change-password' }
+  }
   if (to.meta.adminOnly && !auth.isAdmin) {
     return { path: '/scores' }
   }

web/frontend/src/stores/auth.ts

@@ -4,11 +4,13 @@ export interface AuthUser {
   id: number
   username: string
   role: 'admin' | 'user'
+  force_password_change?: boolean
 }
 
 interface State {
   token: string
   user: AuthUser | null
+  requirePasswordChange: boolean
 }
 
 const STORAGE_KEY = 'trade.auth'
@@ -16,10 +18,15 @@ const STORAGE_KEY = 'trade.auth'
 function load(): State {
   try {
     const raw = localStorage.getItem(STORAGE_KEY)
-    if (!raw) return { token: '', user: null }
-    return JSON.parse(raw) as State
+    if (!raw) return { token: '', user: null, requirePasswordChange: false }
+    const parsed = JSON.parse(raw) as Partial<State>
+    return {
+      token: parsed.token || '',
+      user: parsed.user || null,
+      requirePasswordChange: parsed.requirePasswordChange ?? false,
+    }
   } catch {
-    return { token: '', user: null }
+    return { token: '', user: null, requirePasswordChange: false }
   }
 }
 
@@ -29,14 +36,29 @@ export const useAuthStore = defineStore('auth', {
     isAdmin: (s) => s.user?.role === 'admin',
   },
   actions: {
-    setSession(token: string, user: AuthUser) {
+    setSession(token: string, user: AuthUser, requirePasswordChange?: boolean) {
       this.token = token
       this.user = user
-      localStorage.setItem(STORAGE_KEY, JSON.stringify({ token, user }))
+      this.requirePasswordChange = requirePasswordChange ?? false
+      localStorage.setItem(
+        STORAGE_KEY,
+        JSON.stringify({ token, user, requirePasswordChange: this.requirePasswordChange }),
+      )
+    },
+    clearRequirePasswordChange() {
+      this.requirePasswordChange = false
+      if (this.user) {
+        this.user.force_password_change = false
+        localStorage.setItem(
+          STORAGE_KEY,
+          JSON.stringify({ token: this.token, user: this.user, requirePasswordChange: false }),
+        )
+      }
     },
     logout() {
       this.token = ''
       this.user = null
+      this.requirePasswordChange = false
       localStorage.removeItem(STORAGE_KEY)
     },
   },

web/frontend/src/views/ChangePasswordView.vue

@@ -0,0 +1,109 @@
+<script setup lang="ts">
+import { reactive, ref } from 'vue'
+import { useRouter } from 'vue-router'
+import { ElMessage } from 'element-plus'
+import { changePassword } from '@/api/auth'
+import { useAuthStore } from '@/stores/auth'
+
+const auth = useAuthStore()
+const router = useRouter()
+
+const form = reactive({ oldPassword: '', newPassword: '', confirmPassword: '' })
+const loading = ref(false)
+
+async function submit() {
+  if (!form.oldPassword || !form.newPassword) {
+    ElMessage.warning('请输入旧密码和新密码')
+    return
+  }
+  if (form.newPassword.length < 6) {
+    ElMessage.warning('新密码至少 6 位')
+    return
+  }
+  if (form.newPassword !== form.confirmPassword) {
+    ElMessage.warning('两次输入的新密码不一致')
+    return
+  }
+  loading.value = true
+  try {
+    await changePassword(form.oldPassword, form.newPassword)
+    ElMessage.success('密码修改成功')
+    auth.clearRequirePasswordChange()
+    router.replace('/scores')
+  } catch {
+    // axios 拦截器已弹错
+  } finally {
+    loading.value = false
+  }
+}
+</script>
+
+<template>
+  <div class="login">
+    <div class="card">
+      <h2>修改密码</h2>
+      <p class="hint">首次登录或管理员重置密码后，请修改密码。</p>
+      <el-form @submit.prevent="submit" label-width="0">
+        <el-form-item>
+          <el-input
+            v-model="form.oldPassword"
+            type="password"
+            placeholder="旧密码"
+            show-password
+            autocomplete="current-password"
+          />
+        </el-form-item>
+        <el-form-item>
+          <el-input
+            v-model="form.newPassword"
+            type="password"
+            placeholder="新密码"
+            show-password
+            autocomplete="new-password"
+          />
+        </el-form-item>
+        <el-form-item>
+          <el-input
+            v-model="form.confirmPassword"
+            type="password"
+            placeholder="确认新密码"
+            show-password
+            autocomplete="new-password"
+            @keyup.enter="submit"
+          />
+        </el-form-item>
+        <el-button type="primary" :loading="loading" style="width: 100%" @click="submit">
+          确认修改
+        </el-button>
+      </el-form>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.login {
+  min-height: 100vh;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: linear-gradient(135deg, #1f2d3d 0%, #3a506b 100%);
+}
+.card {
+  width: 360px;
+  padding: 36px 32px;
+  background: var(--el-bg-color);
+  color: var(--el-text-color-primary);
+  border-radius: 8px;
+  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.18);
+}
+.card h2 {
+  margin: 0 0 8px;
+  text-align: center;
+}
+.hint {
+  margin: 0 0 24px;
+  color: var(--el-text-color-secondary);
+  font-size: 12px;
+  text-align: center;
+}
+</style>

web/frontend/src/views/LoginView.vue

@@ -20,9 +20,13 @@ async function submit() {
   loading.value = true
   try {
     const resp = await login(form.username.trim(), form.password)
-    auth.setSession(resp.token, resp.user)
-    const redirect = (route.query.redirect as string) || '/scores'
-    router.replace(redirect)
+    auth.setSession(resp.token, resp.user, resp.require_password_change)
+    if (resp.require_password_change) {
+      router.replace('/change-password')
+    } else {
+      const redirect = (route.query.redirect as string) || '/scores'
+      router.replace(redirect)
+    }
   } catch {
     // axios 拦截器已弹错
   } finally {