From 5b6a484d96269ef67cdb0e684776af6bf6b54a12 Mon Sep 17 00:00:00 2001
From: wangdan-fit2cloud <dan.wang@fit2cloud.com>
Date: Thu, 29 Oct 2026 16:04:10 +0800
Subject: [PATCH] fix: chat user

---
 ui/src/api/chat/README.md                     |   5 +
 ui/src/api/chat/chat-user.ts                  |  17 ++-
 ui/src/api/types/chat-user.ts                 |   9 ++
 ui/src/conversation-panel/core/types.ts       |   1 +
 .../account-menu/ApiKeyDialog.vue             |  74 +++++++++++
 .../account-menu/UserPwdDialog.vue            | 123 ++++++++++++++++++
 .../left-sidebar/account-menu/index.vue       | 107 +++++++++++++++
 .../conversation-list/AccountMenu.vue         |  84 ------------
 .../left-sidebar/conversation-list/index.vue  |   2 +-
 .../portal-conversation-list/index.vue        |   2 +-
 ui/src/conversation-panel/view/chat/index.ts  |   4 +-
 ui/src/styles/element-plus.scss               |  11 +-
 ui/src/views/VIEW_README.md                   |   2 +
 13 files changed, 347 insertions(+), 94 deletions(-)
 create mode 100644 ui/src/conversation-panel/left-sidebar/account-menu/ApiKeyDialog.vue
 create mode 100644 ui/src/conversation-panel/left-sidebar/account-menu/UserPwdDialog.vue
 create mode 100644 ui/src/conversation-panel/left-sidebar/account-menu/index.vue
 delete mode 100644 ui/src/conversation-panel/left-sidebar/conversation-list/AccountMenu.vue

diff --git a/ui/src/api/chat/README.md b/ui/src/api/chat/README.md
index 47748919cbe..dfea401bea9 100644
--- a/ui/src/api/chat/README.md
+++ b/ui/src/api/chat/README.md
@@ -24,3 +24,8 @@ Chat 业务接口统一调用后端 v3 路由（`/chat/api/v3/...`）；文件
 `postAnonymousAuth(accessToken?)` 与 `postLogin(loginRequest, accessToken?)` 传入 accessToken 时为应用认证，
 否则为门户认证。`getCaptcha(username, accessToken)` 获取应用登录验证码，后端以 `accessToken`
 查询参数接收应用令牌，暂不支持门户。`chat-user.ts` 的 `getChatUserProfile()` 获取当前对话用户。
+
+`chat-user.ts` 的 `postResetPassword({ encryptedData })` 提交 RSA 加密的 `{ password, re_password }`，
+公钥取当前认证配置的 `rsa_key`；成功后当前 token 失效，调用方清理认证状态并重新导航。
+`getApiKey()` 与 `postApiKey()` 分别读取、重新生成 `/v3/api_key`，返回 `ChatUserApiKey`。
+首次读取由后端创建密钥；每个用户仅保留一个，重新生成后旧密钥立即失效。
diff --git a/ui/src/api/chat/chat-user.ts b/ui/src/api/chat/chat-user.ts
index 16ff5f427e7..03c85afc9fe 100644
--- a/ui/src/api/chat/chat-user.ts
+++ b/ui/src/api/chat/chat-user.ts
@@ -1,11 +1,20 @@
-/** 提供当前对话用户档案接口。 */
+/** 提供当前对话用户档案、密码与 API Key 接口。 */
 
-import { get } from './core/request'
-import type { ChatUserProfile } from '@/api/types'
+import { get, post } from './core/request'
+import type { ChatUserProfile, ChatUserApiKey } from '@/api/types'
 
 /** 获取当前登录的对话用户档案。 */
 const getChatUserProfile = () => {
   return get<ChatUserProfile>('/v3/chat_user/profile')
 }
 
-export default { getChatUserProfile }
+/** 修改当前用户密码，提交 RSA 加密后的表单。 */
+const postResetPassword = (data: { encryptedData: string }) => post<{ encryptedData: string }, boolean>('/v3/chat_user/current/reset_password', data)
+
+/** 获取当前用户 API Key；首次读取由服务端创建。 */
+const getApiKey = () => get<ChatUserApiKey>('/v3/api_key')
+
+/** 重新生成当前用户 API Key，旧 Key 立即失效。 */
+const postApiKey = () => post<undefined, ChatUserApiKey>('/v3/api_key')
+
+export default { getChatUserProfile, postResetPassword, getApiKey, postApiKey }
diff --git a/ui/src/api/types/chat-user.ts b/ui/src/api/types/chat-user.ts
index 4944e6eb3cd..96429f6c459 100644
--- a/ui/src/api/types/chat-user.ts
+++ b/ui/src/api/types/chat-user.ts
@@ -130,3 +130,12 @@ export interface ChatUserAuthorizationPayload {
   chat_user_id: string
   is_auth: boolean
 }
+
+/** 当前对话用户的唯一 API Key。 */
+export interface ChatUserApiKey {
+  id: string
+  secret_key: string
+  is_active: boolean
+  create_time: string
+  user_id: string
+}
diff --git a/ui/src/conversation-panel/core/types.ts b/ui/src/conversation-panel/core/types.ts
index dc45fc3e0df..a0f15bc38dd 100644
--- a/ui/src/conversation-panel/core/types.ts
+++ b/ui/src/conversation-panel/core/types.ts
@@ -11,6 +11,7 @@ export type ConversationAppInfo = ChatApplicationProfile
 export interface ConversationAccount {
   nickName?: string
   username?: string
+  token_quota?: any
 }
 
 export interface Conversation {
diff --git a/ui/src/conversation-panel/left-sidebar/account-menu/ApiKeyDialog.vue b/ui/src/conversation-panel/left-sidebar/account-menu/ApiKeyDialog.vue
new file mode 100644
index 00000000000..b497c17e11b
--- /dev/null
+++ b/ui/src/conversation-panel/left-sidebar/account-menu/ApiKeyDialog.vue
@@ -0,0 +1,74 @@
+<script setup lang="ts">
+import { computed, ref } from 'vue'
+import { useRouter } from 'vue-router'
+import ChatUserApi from '@/api/chat/chat-user'
+import { copyText } from '@/utils/clipboard'
+
+defineOptions({ name: 'ConversationApiKeyDialog' })
+
+const router = useRouter()
+const dialogVisible = ref(false)
+const apiKey = ref('')
+const loading = ref(false)
+const apiUrl = computed(() => new URL(router.resolve({ name: 'portal-home' }).href, window.location.origin).href)
+const maskedApiKey = computed(() => (apiKey.value ? `******${apiKey.value.slice(-4)}` : ''))
+
+// 每次打开重新读取；重置直接替换当前用户的唯一密钥。
+function loadApiKey(regenerate = false) {
+  if (loading.value) return
+  loading.value = true
+  return (regenerate ? ChatUserApi.postApiKey() : ChatUserApi.getApiKey())
+    .then((record) => {
+      if (dialogVisible.value) apiKey.value = record.secret_key
+    })
+    .catch(() => {})
+    .finally(() => {
+      loading.value = false
+    })
+}
+
+function open() {
+  dialogVisible.value = true
+  return loadApiKey()
+}
+
+function resetData() {
+  apiKey.value = ''
+}
+
+defineExpose({ open })
+</script>
+
+<template>
+  <MkDialog v-model="dialogVisible" title="API Key" @closed="resetData">
+    <template #subtitle>每个用户仅一个 API Key，绑定当前对话用户、与其同权。重置后旧 Key 立即失效</template>
+    <div class="pb-5">
+      <div class="mb-4">
+        <div class="mb-2">API URL</div>
+        <el-input :model-value="apiUrl" readonly>
+          <template #suffix>
+            <!-- 复制 API URL -->
+            <el-button text class="-mr-1" @click="copyText(apiUrl)">
+              <MkIcon name="icon_copy_outlined" />
+            </el-button>
+          </template>
+        </el-input>
+      </div>
+      <div class="mb-2">API Key</div>
+      <el-input :model-value="maskedApiKey" readonly>
+        <template #suffix>
+          <!-- 复制完整 API Key -->
+          <el-button text :disabled="loading || !apiKey" @click="copyText(apiKey)">
+            <MkIcon name="icon_copy_outlined" />
+          </el-button>
+          <MkTooltip content="重新生成">
+            <!-- 重新生成 API Key -->
+            <el-button text class="-mr-1" :loading="loading" @click="loadApiKey(true)">
+              <MkIcon name="icon_refresh_outlined" />
+            </el-button>
+          </MkTooltip>
+        </template>
+      </el-input>
+    </div>
+  </MkDialog>
+</template>
diff --git a/ui/src/conversation-panel/left-sidebar/account-menu/UserPwdDialog.vue b/ui/src/conversation-panel/left-sidebar/account-menu/UserPwdDialog.vue
new file mode 100644
index 00000000000..83b9628eadd
--- /dev/null
+++ b/ui/src/conversation-panel/left-sidebar/account-menu/UserPwdDialog.vue
@@ -0,0 +1,123 @@
+<script setup lang="ts">
+import { reactive, ref } from 'vue'
+import JSEncrypt from 'jsencrypt'
+import type { FormInstance, FormRules } from 'element-plus'
+import { useRouter } from 'vue-router'
+import ChatUserApi from '@/api/chat/chat-user'
+import type { UpdatePasswordForm } from '@/api/types'
+import { useStore } from '@/stores/chat'
+import { MsgError, MsgSuccess } from '@/utils/message'
+
+defineOptions({ name: 'UserPwdDialog' })
+
+const router = useRouter()
+const { auth } = useStore()
+
+const dialogVisible = ref(false)
+const passwordSubmitting = ref(false)
+
+const userPasswordFormRef = ref<FormInstance>()
+const userPasswordForm = reactive<UpdatePasswordForm>({ password: '', re_password: '' })
+
+function validateConfirmPassword(_rule: unknown, value: string, callback: (error?: Error) => void) {
+  if (!value) {
+    callback(new Error('请输入确认密码'))
+  } else if (value !== userPasswordForm.password) {
+    callback(new Error('输入的密码不一致'))
+  } else {
+    callback()
+  }
+}
+
+const userPasswordRules = reactive<FormRules<UpdatePasswordForm>>({
+  password: [
+    { required: true, whitespace: true, message: '请输入新密码', trigger: 'blur' },
+    { min: 6, max: 20, message: '长度应为 6-20 个字符', trigger: 'blur' },
+  ],
+  re_password: [
+    { required: true, whitespace: true, message: '请输入确认密码', trigger: 'blur' },
+    { validator: validateConfirmPassword, trigger: 'blur' },
+  ],
+})
+
+function open() {
+  dialogVisible.value = true
+}
+
+async function submitPassword() {
+  if (passwordSubmitting.value) return
+  userPasswordFormRef.value?.validate((valid) => {
+    if (!valid) return
+    passwordSubmitting.value = true
+    const encryptor = new JSEncrypt()
+    encryptor.setPublicKey(auth.authProfile?.rsa_key ?? '')
+    const encryptedData = encryptor.encrypt(JSON.stringify(userPasswordForm))
+    if (!encryptedData) {
+      MsgError('密码加密失败，请刷新后重试')
+      passwordSubmitting.value = false
+      return
+    }
+
+    return ChatUserApi.postResetPassword({ encryptedData })
+      .then(() => {
+        MsgSuccess('密码修改成功')
+
+        dialogVisible.value = false
+        auth.clearToken()
+        return router.replace({ path: router.currentRoute.value.fullPath, force: true }).then(() => undefined)
+      })
+      .catch(() => {})
+      .finally(() => {
+        passwordSubmitting.value = false
+      })
+  })
+}
+
+function resetData() {
+  Object.assign(userPasswordForm, { password: '', re_password: '' })
+  passwordSubmitting.value = false
+  userPasswordFormRef.value?.clearValidate()
+}
+defineExpose({ open })
+</script>
+
+<template>
+  <MkDialog v-model="dialogVisible" title="修改密码" @closed="resetData">
+    <el-form
+      ref="userPasswordFormRef"
+      :model="userPasswordForm"
+      :rules="userPasswordRules"
+      label-position="top"
+      require-asterisk-position="right"
+      @submit.prevent
+    >
+      <el-form-item label="新密码" prop="password">
+        <el-input
+          v-model="userPasswordForm.password"
+          autocomplete="new-password"
+          maxlength="20"
+          placeholder="请输入新密码"
+          show-password
+          type="password"
+        />
+      </el-form-item>
+      <el-form-item label="确认密码" prop="re_password">
+        <el-input
+          v-model="userPasswordForm.re_password"
+          autocomplete="new-password"
+          maxlength="20"
+          placeholder="请再次输入新密码"
+          show-password
+          type="password"
+        />
+      </el-form-item>
+    </el-form>
+
+    <template #footer>
+      <!-- 取消修改密码 -->
+      <el-button plain @click="dialogVisible = false">取消</el-button>
+      <!-- 保存新密码 -->
+      <el-button :loading="passwordSubmitting" type="primary" @click="submitPassword">保存</el-button>
+    </template>
+  </MkDialog>
+</template>
diff --git a/ui/src/conversation-panel/left-sidebar/account-menu/index.vue b/ui/src/conversation-panel/left-sidebar/account-menu/index.vue
new file mode 100644
index 00000000000..23d1e6479c8
--- /dev/null
+++ b/ui/src/conversation-panel/left-sidebar/account-menu/index.vue
@@ -0,0 +1,107 @@
+<script setup lang="ts">
+import { computed, ref, useTemplateRef } from 'vue'
+import { useRouter } from 'vue-router'
+import { useStore } from '@/stores/chat'
+import { formatTokenNumber } from '@/utils/number'
+import { QUOTA_TYPE } from '@/api/enums'
+import { useConversationListStore } from '../conversation-list/index'
+import UserPwdDialog from './UserPwdDialog.vue'
+import ApiKeyDialog from './ApiKeyDialog.vue'
+
+defineOptions({ name: 'ConversationAccountMenu' })
+
+const { account } = useConversationListStore()
+const { auth } = useStore()
+const router = useRouter()
+
+const menuVisible = ref(false)
+const displayName = computed(() => account.value?.nickName || account.value?.username || '用户')
+
+// 配额尚未接入时保留空值展示，不将缺失数据表示为零用量。
+const tokenPercentage = computed(() => {
+  return Math.min(100, Math.max(0, (account.value?.token_quota?.used_tokens / account.value?.token_quota?.total_tokens) * 100))
+})
+
+const userPwdDialogRef = useTemplateRef<InstanceType<typeof UserPwdDialog>>('userPwdDialogRef')
+const apiKeyDialogRef = useTemplateRef<InstanceType<typeof ApiKeyDialog>>('apiKeyDialogRef')
+
+// 退出对话账号后重新导航，由守卫处理后续认证。
+const handleLogout = () => {
+  return auth
+    .logout()
+    .then(() => router.replace({ path: router.currentRoute.value.fullPath, force: true }))
+    .catch(() => {})
+}
+</script>
+
+<template>
+  <MkDropdown v-if="account" class="w-full" trigger="click" placement="top-start" @visible-change="menuVisible = $event">
+    <!-- 展开账户菜单 -->
+    <button
+      type="button"
+      class="flex-align-center w-full cursor-pointer gap-2 rounded-md py-1 px-2 hover:bg-N900/10"
+      :class="{ 'bg-N900/10': menuVisible }"
+    >
+      <el-avatar :size="32" class="bg-primary-gradient!">
+        <img src="@/assets/mk_icon_user_gradient.svg" alt="" style="width: 54%" />
+      </el-avatar>
+      <span class="truncate" :title="displayName">{{ displayName }}</span>
+    </button>
+    <template #dropdown>
+      <div class="w-60">
+        <div class="p-3">
+          <div class="mb-2 flex-align-center gap-2">
+            <el-avatar :size="40" class="shrink-0 bg-primary-gradient!">
+              <img src="@/assets/mk_icon_user_gradient.svg" alt="" style="width: 54%" />
+            </el-avatar>
+            <div class="min-w-0">
+              <h4 class="truncate" :title="displayName">{{ displayName }}</h4>
+              <div class="truncate text-N600" :title="account?.username">{{ account?.username || '-' }}</div>
+            </div>
+          </div>
+          <template v-if="account?.token_quota">
+            <div class="mb-1 flex-align-center">
+              <span class="mr-3">Tokens</span>
+              <span class="text-primary">{{ formatTokenNumber(account?.token_quota?.used_tokens) }}</span>
+              <span class="text-N500">
+                /{{ account?.token_quota?.quota_type === QUOTA_TYPE.UNLIMITED ? '不限' : formatTokenNumber(account?.token_quota?.total_tokens) }}
+              </span>
+            </div>
+
+            <el-progress
+              v-if="account?.token_quota?.quota_type !== QUOTA_TYPE.UNLIMITED"
+              :percentage="tokenPercentage"
+              :status="tokenPercentage > 80 ? 'warning' : undefined"
+              :show-text="false"
+              :stroke-width="6"
+            />
+          </template>
+        </div>
+        <el-divider />
+        <MkDropdownMenu>
+          <!-- 修改密码 -->
+          <MkDropdownItem @click="userPwdDialogRef?.open()">
+            <template #icon><MkIcon name="icon-key_outlined" /></template>
+            <span>修改密码</span>
+          </MkDropdownItem>
+          <!-- 管理 API Key -->
+          <MkDropdownItem @click="apiKeyDialogRef?.open()">
+            <template #icon><MkIcon name="icon_passkeys_outlined" /></template>
+            <span>API Key</span>
+          </MkDropdownItem>
+          <!-- 退出登录 -->
+          <MkDropdownItem divided @click="handleLogout">
+            <template #icon><MkIcon name="icon_logout_outlined" /></template>
+            <span>退出登录</span>
+          </MkDropdownItem>
+        </MkDropdownMenu>
+      </div>
+    </template>
+  </MkDropdown>
+  <!-- 匿名登陆 -->
+  <el-button v-else type="primary" class="w-full">立即登录</el-button>
+  <UserPwdDialog ref="userPwdDialogRef" />
+  <ApiKeyDialog ref="apiKeyDialogRef" />
+</template>
+
+<style scoped lang="scss"></style>
diff --git a/ui/src/conversation-panel/left-sidebar/conversation-list/AccountMenu.vue b/ui/src/conversation-panel/left-sidebar/conversation-list/AccountMenu.vue
deleted file mode 100644
index 45b1c4c19c8..00000000000
--- a/ui/src/conversation-panel/left-sidebar/conversation-list/AccountMenu.vue
+++ /dev/null
@@ -1,84 +0,0 @@
-<script setup lang="ts">
-import { computed, ref } from 'vue'
-import { formatTokenNumber } from '@/utils/number'
-import { MsgInfo } from '@/utils/message'
-import { useConversationListStore } from './index'
-
-defineOptions({ name: 'ConversationAccountMenu' })
-
-const props = defineProps<{ usedTokens?: number; totalTokens?: number }>()
-const { account } = useConversationListStore()
-const menuVisible = ref(false)
-const displayName = computed(() => account.value?.nickName || account.value?.username || '用户')
-
-// 配额尚未接入时保留空值展示，不将缺失数据表示为零用量。
-const tokenPercentage = computed(() => {
-  const { usedTokens, totalTokens } = props
-  if (usedTokens === undefined || totalTokens === undefined || !Number.isFinite(usedTokens) || !Number.isFinite(totalTokens) || totalTokens <= 0) {
-    return 0
-  }
-  return Math.min(100, Math.max(0, (usedTokens / totalTokens) * 100))
-})
-
-// 账户接口后续接入，当前仅提供菜单布局与明确的操作反馈。
-const handleAccountAction = (action: string) => MsgInfo(`${action}功能暂未接入`)
-</script>
-
-<template>
-  <MkDropdown class="w-full" trigger="click" placement="top-start" @visible-change="menuVisible = $event">
-    <!-- 展开账户菜单 -->
-    <button
-      type="button"
-      class="flex-align-center w-full cursor-pointer gap-2 rounded-md py-1 px-2 hover:bg-N900/10"
-      :class="{ 'bg-N900/10': menuVisible }"
-    >
-      <el-avatar :size="32" class="bg-primary-gradient!">
-        <img src="@/assets/mk_icon_user_gradient.svg" alt="" style="width: 54%" />
-      </el-avatar>
-      <span class="truncate" :title="displayName">{{ displayName }}</span>
-    </button>
-    <template #dropdown>
-      <div class="w-60">
-        <div class="p-3">
-          <div class="mb-2 flex-align-center gap-2">
-            <el-avatar :size="40" class="shrink-0 bg-primary-gradient!">
-              <img src="@/assets/mk_icon_user_gradient.svg" alt="" style="width: 54%" />
-            </el-avatar>
-            <div class="min-w-0">
-              <h4 class="truncate" :title="displayName">{{ displayName }}</h4>
-              <div class="truncate text-N600" :title="account?.username">{{ account?.username || '-' }}</div>
-            </div>
-          </div>
-          <div class="mb-1 flex-align-center gap-3">
-            <span>Tokens</span>
-            <!-- // TODO UI后期加 超过80%变黄 -->
-            <span class="text-primary">{{ formatTokenNumber(usedTokens) }}</span>
-            /
-            <span class="text-N500">{{ formatTokenNumber(totalTokens) }}</span>
-          </div>
-          <el-progress :percentage="tokenPercentage" :show-text="false" :stroke-width="6" />
-        </div>
-        <el-divider />
-        <MkDropdownMenu>
-          <!-- 修改密码 -->
-          <MkDropdownItem @click="handleAccountAction('修改密码')">
-            <template #icon><MkIcon name="icon-key_outlined" /></template>
-            <span>修改密码</span>
-          </MkDropdownItem>
-          <!-- 管理 API Key -->
-          <MkDropdownItem @click="handleAccountAction('API Key')">
-            <template #icon><MkIcon name="icon_passkeys_outlined" /></template>
-            <span>API Key</span>
-          </MkDropdownItem>
-          <!-- 退出登录 -->
-          <MkDropdownItem divided @click="handleAccountAction('退出登录')">
-            <template #icon><MkIcon name="icon_logout_outlined" /></template>
-            <span>退出登录</span>
-          </MkDropdownItem>
-        </MkDropdownMenu>
-      </div>
-    </template>
-  </MkDropdown>
-</template>
-
-<style scoped lang="scss"></style>
diff --git a/ui/src/conversation-panel/left-sidebar/conversation-list/index.vue b/ui/src/conversation-panel/left-sidebar/conversation-list/index.vue
index 48bc0f3e3ef..59f8aebc668 100644
--- a/ui/src/conversation-panel/left-sidebar/conversation-list/index.vue
+++ b/ui/src/conversation-panel/left-sidebar/conversation-list/index.vue
@@ -2,7 +2,7 @@
 import { relativeTimeFormat } from '@/utils/time'
 import type { Conversation } from '../../core/types'
 import { useConversationListStore } from './index'
-import AccountMenu from './AccountMenu.vue'
+import AccountMenu from '../account-menu/index.vue'
 
 defineOptions({ name: 'ConversationList' })
 
diff --git a/ui/src/conversation-panel/left-sidebar/portal-conversation-list/index.vue b/ui/src/conversation-panel/left-sidebar/portal-conversation-list/index.vue
index 41c475f6247..f2965282f8a 100644
--- a/ui/src/conversation-panel/left-sidebar/portal-conversation-list/index.vue
+++ b/ui/src/conversation-panel/left-sidebar/portal-conversation-list/index.vue
@@ -2,7 +2,7 @@
 import { relativeTimeFormat } from '@/utils/time'
 import type { Conversation } from '../../core/types'
 import { useConversationListStore } from '../conversation-list/index'
-import AccountMenu from '../conversation-list/AccountMenu.vue'
+import AccountMenu from '../account-menu/index.vue'
 import { usePortalConversationListStore, type PortalApplicationGroup } from './index'
 
 defineOptions({ name: 'PortalConversationList' })
diff --git a/ui/src/conversation-panel/view/chat/index.ts b/ui/src/conversation-panel/view/chat/index.ts
index eec9ea958c2..75c8dec1bef 100644
--- a/ui/src/conversation-panel/view/chat/index.ts
+++ b/ui/src/conversation-panel/view/chat/index.ts
@@ -77,7 +77,7 @@ export function createChatConversation(routing: ChatConversationRouting = useApp
     rename: api.rename,
     account: computed(() => {
       const profile = user.chatUserProfile
-      return profile?.username ? { nickName: profile.nick_name, username: profile.username } : null
+      return profile?.username ? { nickName: profile.nick_name, username: profile.username, token_quota: profile.token_quota } : null
     }),
     appInfo,
   })
@@ -120,7 +120,7 @@ export function createChatConversation(routing: ChatConversationRouting = useApp
     const applicationId = getApplicationId()
     if (!applicationId) return
     ApplicationApi.getApplicationProfile(applicationId).then((profile) => {
-      if (applicationId === getApplicationId()) appInfo.value = {...APPLICATION_DISPLAY_SETTING_DEFAULT,...profile}
+      if (applicationId === getApplicationId()) appInfo.value = { ...APPLICATION_DISPLAY_SETTING_DEFAULT, ...profile }
     })
   }
   loadApplicationProfile()
diff --git a/ui/src/styles/element-plus.scss b/ui/src/styles/element-plus.scss
index 644bba6e8c0..cb15a772941 100644
--- a/ui/src/styles/element-plus.scss
+++ b/ui/src/styles/element-plus.scss
@@ -805,8 +805,15 @@
 }
 
 /* progress */
-.el-progress-bar__inner {
-  background: linear-gradient(90deg, rgb(var(--mk-primary-rgb) / 20%) 0%, var(--el-color-primary) 100%);
+.el-progress {
+  .el-progress-bar__inner {
+    background: linear-gradient(90deg, rgb(var(--mk-primary-rgb) / 20%) 0%, var(--el-color-primary) 100%);
+  }
+  &.is-warning {
+    .el-progress-bar__inner {
+      background: linear-gradient(90deg, rgb(var(--mk-warning-rgb) / 20%) 0%, var(--el-color-warning) 100%);
+    }
+  }
 }
 
 /* radio */
diff --git a/ui/src/views/VIEW_README.md b/ui/src/views/VIEW_README.md
index 8b231c5b8a6..aa5f1b7adf1 100644
--- a/ui/src/views/VIEW_README.md
+++ b/ui/src/views/VIEW_README.md
@@ -435,5 +435,7 @@ View 负责路由、资源与模式、图加载、保存／发布／调试编排
   组件不直接引用某个入口的 Store 或 API；接口、回调地址与登录后跳转由页面传入的 `LoginService` 提供。
 - Chat／Portal 页面以 auth token 为面板 key，token 变化重建并加载用户档案；路由认证见路由文档。
   会话装配在 conversation-panel，列表 Store 不感知 Router；门户复用 chat 装配，保留各智能体最近会话分组。
+  账户菜单位于 `conversation-panel/left-sidebar/account-menu/index.vue`，单应用与门户共用；直接调用 Chat API 的 `postLogout()`，成功后清理当前认证场景并重新导航，由守卫处理后续认证。
+  同目录的 `UserPwdDialog.vue` 修改当前对话用户密码，`ApiKeyDialog.vue` 展示门户地址及用户唯一 API Key，支持复制完整密钥和重新生成；密钥在界面中仅显示末四位。
   没有当前智能体时不查询其信息／会话、禁用输入，分组加载后选首个；无可用智能体显示空态。
   全部智能体与选择抽屉复用卡片，抽屉每次打开重新查询，搜索状态独立。