feat(m11): add password change with profile page

web/delivery-platform-ui/src/layout/MainLayout.vue

@@ -175,7 +175,7 @@ const breadcrumb = computed(() => {
 
 function onGlobalSearch() { ElMessage.info("全局搜索（开发中）") }
 function onNotifications() { ElMessage.info("通知中心（开发中）") }
-function onUserMenu() { ElMessage.info("用户设置（开发中）") }
+function onUserMenu() { router.push('/profile') }
 function onLogout() { auth.logout(); router.push({ name: "login" }); }
 </script>
 

web/delivery-platform-ui/src/router/index.js

@@ -158,6 +158,12 @@ const routes = [
         component: () => import("../views/CallbackStatsView.vue"),
         meta: { roles: ["SYS_ADMIN", "OPS"], title: "Callback 统计" },
       },
+      {
+        path: "profile",
+        name: "profile",
+        component: () => import("../views/ProfileView.vue"),
+        meta: { roles: ["SYS_ADMIN", "DEVELOPER", "OPS"], title: "个人设置" },
+      },
       {
         path: "reports/project-health",
         name: "project-health",

web/delivery-platform-ui/src/views/ProfileView.vue

@@ -0,0 +1,66 @@
+<script setup>
+import { ref } from 'vue'
+import { useRouter } from 'vue-router'
+import { useAuthStore } from '../stores/auth'
+import { ElMessage } from 'element-plus'
+import axios from 'axios'
+import { apiErrorMessage } from '../utils/apiErrorMessage'
+
+const auth = useAuthStore()
+const router = useRouter()
+const dialogVisible = ref(false)
+const form = ref({ oldPassword: '', newPassword: '', confirmPassword: '' })
+
+async function handleChangePassword() {
+  if (form.value.newPassword !== form.value.confirmPassword) {
+    ElMessage.error('两次密码不一致')
+    return
+  }
+  if (form.value.newPassword.length < 6) {
+    ElMessage.error('新密码至少6位')
+    return
+  }
+  try {
+    await axios.post('/api/v1/auth/change-password', {
+      oldPassword: form.value.oldPassword,
+      newPassword: form.value.newPassword,
+    })
+    ElMessage.success('密码修改成功')
+    dialogVisible.value = false
+    form.value = { oldPassword: '', newPassword: '', confirmPassword: '' }
+  } catch (e) {
+    ElMessage.error(apiErrorMessage(e, '密码修改失败'))
+  }
+}
+</script>
+
+<template>
+  <div>
+    <h2>个人设置</h2>
+    <el-card shadow="never" style="margin-top:16px;max-width:500px">
+      <el-descriptions :column="1" border>
+        <el-descriptions-item label="用户名">{{ auth.displayName }}</el-descriptions-item>
+        <el-descriptions-item label="角色">{{ auth.roles.join(', ') }}</el-descriptions-item>
+      </el-descriptions>
+      <el-button type="primary" style="margin-top:16px" @click="dialogVisible = true">修改密码</el-button>
+    </el-card>
+
+    <el-dialog v-model="dialogVisible" title="修改密码" width="420px">
+      <el-form label-width="100px">
+        <el-form-item label="旧密码" required>
+          <el-input v-model="form.oldPassword" type="password" show-password />
+        </el-form-item>
+        <el-form-item label="新密码" required>
+          <el-input v-model="form.newPassword" type="password" show-password />
+        </el-form-item>
+        <el-form-item label="确认密码" required>
+          <el-input v-model="form.confirmPassword" type="password" show-password />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <el-button @click="dialogVisible = false">取消</el-button>
+        <el-button type="primary" @click="handleChangePassword">确认修改</el-button>
+      </template>
+    </el-dialog>
+  </div>
+</template>