From 24697c726cc3d76f5d644178d39843fa2b643dd7 Mon Sep 17 00:00:00 2001
From: wangdan-fit2cloud <dan.wang@fit2cloud.com>
Date: Mon, 21 Sep 2026 16:53:36 +0800
Subject: [PATCH] feat: portal

---
 ui/src/components.d.ts                        |  2 +
 ui/src/components/COMPONENT_README.md         | 31 ++++---
 .../components/global/mk-icon/PortalIcon.vue  | 13 +++
 ui/src/components/mk-edit-avatar/index.vue    | 77 +++++++---------
 ui/src/layout/ResourceDetailLayout.vue        | 21 +----
 ui/src/layout/sidebar/ResourceDetailMenu.vue  | 92 +++++++++++++++++++
 ui/src/router/ROUTE_README.md                 | 40 ++++----
 ui/src/router/admin/system/index.ts           |  6 +-
 ui/src/router/admin/types.ts                  |  2 +
 ui/src/router/admin/utils.ts                  | 12 +--
 .../admin/workspace/modules/application.ts    |  2 +-
 .../admin/workspace/modules/knowledge.ts      | 81 ++++++++++++++--
 ui/src/styles/STYLE_README.md                 |  9 ++
 ui/src/styles/element-plus.scss               |  6 ++
 ui/src/styles/tailwind.css                    |  1 +
 ui/src/views/VIEW_README.md                   |  9 +-
 ui/src/views/application/ApplicationView.vue  |  2 +-
 .../chat-user/ChatUserListView.vue            |  7 ++
 .../dictionary/DictionaryView.vue             |  7 ++
 .../ExternalRetrievalView.vue                 |  7 ++
 .../knowledge-detail/image/ImageListView.vue  |  7 ++
 .../question/QuestionListView.vue             |  7 ++
 .../recall-test/RecallTestView.vue            |  7 ++
 .../tag/TagManagementView.vue                 |  7 ++
 .../portal-setting/PortalSettingView.vue      | 20 ++--
 .../components/ButtonEditPortal.vue           | 28 +++---
 26 files changed, 367 insertions(+), 136 deletions(-)
 create mode 100644 ui/src/components/global/mk-icon/PortalIcon.vue
 create mode 100644 ui/src/layout/sidebar/ResourceDetailMenu.vue
 create mode 100644 ui/src/views/knowledge-detail/chat-user/ChatUserListView.vue
 create mode 100644 ui/src/views/knowledge-detail/dictionary/DictionaryView.vue
 create mode 100644 ui/src/views/knowledge-detail/external-retrieval/ExternalRetrievalView.vue
 create mode 100644 ui/src/views/knowledge-detail/image/ImageListView.vue
 create mode 100644 ui/src/views/knowledge-detail/question/QuestionListView.vue
 create mode 100644 ui/src/views/knowledge-detail/recall-test/RecallTestView.vue
 create mode 100644 ui/src/views/knowledge-detail/tag/TagManagementView.vue

diff --git a/ui/src/components.d.ts b/ui/src/components.d.ts
index 6779c68675e..b900b6df53c 100644
--- a/ui/src/components.d.ts
+++ b/ui/src/components.d.ts
@@ -44,6 +44,7 @@ declare module 'vue' {
     MkTagGroup: typeof import('./components/global/mk-tag-group/index.vue')['default']
     MkTooltip: typeof import('./components/global/mk-tooltip/index.vue')['default']
     MkViewLayout: typeof import('./components/global/mk-view-layout/index.vue')['default']
+    PortalIcon: typeof import('./components/global/mk-icon/PortalIcon.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']
     ToolIcon: typeof import('./components/global/mk-icon/ToolIcon.vue')['default']
@@ -85,6 +86,7 @@ declare global {
   const MkTagGroup: typeof import('./components/global/mk-tag-group/index.vue')['default']
   const MkTooltip: typeof import('./components/global/mk-tooltip/index.vue')['default']
   const MkViewLayout: typeof import('./components/global/mk-view-layout/index.vue')['default']
+  const PortalIcon: typeof import('./components/global/mk-icon/PortalIcon.vue')['default']
   const RouterLink: typeof import('vue-router')['RouterLink']
   const RouterView: typeof import('vue-router')['RouterView']
   const ToolIcon: typeof import('./components/global/mk-icon/ToolIcon.vue')['default']
diff --git a/ui/src/components/COMPONENT_README.md b/ui/src/components/COMPONENT_README.md
index 5b324766df5..fbd7c3a3f77 100644
--- a/ui/src/components/COMPONENT_README.md
+++ b/ui/src/components/COMPONENT_README.md
@@ -355,16 +355,20 @@ Dialog、Drawer、Popover、嵌套区域等其他大、小表格均禁止开启
 
 ### MkEditAvatar（修改头像）
 
-手动导入 `@/components/mk-edit-avatar/index.vue`，不参与全局注册。`defaultIcon` 必填，接收默认
-图标图片 URL；字符串 `v-model` 为当前自定义头像 URL，空字符串表示使用默认图标。
-`size` 默认为 `32`（px），`editable` 默认为 `true`，设为 `false` 时仅展示头像。
-
-默认插槽替换触发区的头像内容，透出 `{ icon, size }`；`icon` 为当前 `v-model` 值，空值可由
-`ToolIcon` 等资源组件自行回退。未提供插槽时展示当前头像或 `defaultIcon` 图片。
-触发按钮及悬停、聚焦、点击行为由 `MkEditAvatar` 统一维护，插槽内只放展示内容，不嵌套按钮。
-`ToolFormDrawer` 通过此插槽渲染 `ToolIcon`，并将头像绑定到 `toolForm.icon`。
-
-悬停、聚焦或点击头像打开 Logo 设置，打开后保持显示以便选择本地文件；取消、点击外部或 Escape
+手动导入 `@/components/mk-edit-avatar/index.vue`，不参与全局注册。字符串 `v-model` 为当前
+自定义头像 URL，空字符串表示使用默认图标；不再接收 `defaultIcon`。
+`size` 默认为 `32`（px），控制触发区传给插槽的尺寸；弹层预览和上传区域固定为 80px。
+`editable` 默认为 `true`，设为 `false` 时仅展示头像。
+
+必填默认插槽同时渲染触发区和默认 Logo 预览，透出 `{ icon, size }`。触发区传入当前头像
+（空值转为 `undefined`）和 `props.size`；默认预览始终传入 `icon: undefined`、固定的 `size: 80`，不读取组件的
+`props.size`。插槽参数由调用方按需使用，不会自动覆盖插槽内组件的尺寸。
+调用方必须使用插槽的 `icon`，由 `PortalIcon`、`ToolIcon` 等资源组件自行展示默认图标，
+不要在插槽内直接绑定外部头像值。
+触发区由 `MkEditAvatar` 的 `span` 容器承载，统一处理悬停，插槽内只放展示内容。
+门户编辑通过此插槽渲染 `PortalIcon`，并将头像绑定到 `portalForm.logo`。
+
+悬停头像打开 Logo 设置，打开后保持显示以便选择本地文件；取消、点击外部或弹层内按 Escape
 关闭并丢弃草稿，确定后才更新 `v-model` 并触发 `change(icon, file)`。
 自定义图片支持 JPG、PNG、GIF，大小不超过 10MB；确认时 `icon` 为本地 Data URL，`file`
 为所选 `File`，未重新选文件或使用默认 Logo 时为 `null`。组件不请求上传接口；调用方负责上传
@@ -374,13 +378,16 @@ Dialog、Drawer、Popover、嵌套区域等其他大、小表格均禁止开启
 <script setup lang="ts">
 import { ref } from 'vue'
 import MkEditAvatar from '@/components/mk-edit-avatar/index.vue'
-import defaultIcon from '@/assets/mk_icon_upload.svg'
 
 const avatar = ref('')
 </script>
 
 <template>
-  <MkEditAvatar v-model="avatar" :default-icon="defaultIcon" />
+  <MkEditAvatar v-model="avatar">
+    <template #default="{ icon, size: previewSize }">
+      <PortalIcon :icon="icon" :size="previewSize" />
+    </template>
+  </MkEditAvatar>
 </template>
 ```
 
diff --git a/ui/src/components/global/mk-icon/PortalIcon.vue b/ui/src/components/global/mk-icon/PortalIcon.vue
new file mode 100644
index 00000000000..1028ead5082
--- /dev/null
+++ b/ui/src/components/global/mk-icon/PortalIcon.vue
@@ -0,0 +1,13 @@
+<script setup lang="ts">
+import { resetUrl } from '@/utils/icon'
+
+defineOptions({ name: 'PortalIcon' })
+
+withDefaults(defineProps<{ icon?: string; size?: number | string }>(), { size: 24 })
+</script>
+
+<template>
+  <el-avatar class="bg-transparent!" shape="square" :size="size">
+    <img :src="resetUrl(icon, true)" alt="" />
+  </el-avatar>
+</template>
diff --git a/ui/src/components/mk-edit-avatar/index.vue b/ui/src/components/mk-edit-avatar/index.vue
index a2e8b862f55..5c6c86805e7 100644
--- a/ui/src/components/mk-edit-avatar/index.vue
+++ b/ui/src/components/mk-edit-avatar/index.vue
@@ -1,17 +1,17 @@
 <script setup lang="ts">
-import { computed, onBeforeUnmount, ref, useTemplateRef, watch } from 'vue'
+import { onBeforeUnmount, ref, useTemplateRef, watch } from 'vue'
 import { ClickOutside as vClickOutside, ElMessage } from 'element-plus'
-import { Plus } from '@element-plus/icons-vue'
+import type { UploadFile, UploadInstance } from 'element-plus'
 
 defineOptions({ name: 'MkEditAvatar' })
 
-const props = withDefaults(defineProps<{ defaultIcon: string; editable?: boolean; size?: number }>(), {
+const props = withDefaults(defineProps<{ editable?: boolean; size?: number }>(), {
   editable: true,
   size: 32,
 })
 const avatar = defineModel<string>({ default: '' })
 const emit = defineEmits<{ change: [icon: string, file: File | null] }>()
-defineSlots<{ default?(props: { icon: string; size: number }): unknown }>()
+defineSlots<{ default(props: { icon: string | undefined; size: number }): unknown }>()
 
 // 头像编辑草稿：确认前不修改外部值。
 const visible = ref(false)
@@ -20,13 +20,13 @@ const draftIcon = ref('')
 const draftFile = ref<File | null>(null)
 const reading = ref(false)
 const referenceRef = useTemplateRef<HTMLElement>('referenceRef')
-const fileInputRef = useTemplateRef<HTMLInputElement>('fileInputRef')
-const currentIcon = computed(() => avatar.value || props.defaultIcon)
+const uploadRef = useTemplateRef<UploadInstance>('uploadRef')
+
 let fileReader: FileReader | undefined
 
 function open() {
   if (!props.editable || visible.value) return
-  logoMode.value = avatar.value && avatar.value !== props.defaultIcon ? 'custom' : 'default'
+  logoMode.value = avatar.value ? 'custom' : 'default'
   draftIcon.value = logoMode.value === 'custom' ? avatar.value : ''
   draftFile.value = null
   visible.value = true
@@ -42,7 +42,7 @@ function clearDraft() {
   if (visible.value) return
   draftIcon.value = ''
   draftFile.value = null
-  if (fileInputRef.value) fileInputRef.value.value = ''
+  uploadRef.value?.clearFiles()
 }
 
 function closeOutside(event: MouseEvent) {
@@ -60,10 +60,9 @@ function confirm() {
 }
 
 // 本地图片校验与预览，文件由调用方上传。
-function selectImage(event: Event) {
-  const input = event.target as HTMLInputElement
-  const file = input.files?.[0]
-  input.value = ''
+function selectImage(uploadFile: UploadFile) {
+  const file = uploadFile.raw
+  uploadRef.value?.clearFiles()
   if (!file) return
   if (!['image/jpeg', 'image/png', 'image/gif'].includes(file.type)) {
     ElMessage.warning('仅支持 JPG、PNG、GIF 格式的图片')
@@ -99,26 +98,12 @@ onBeforeUnmount(() => fileReader?.abort())
 </script>
 
 <template>
-  <!-- // TODO: 优化头像预览效果 -->
   <el-popover :visible="visible" :width="414" placement="bottom-start" @after-leave="clearDraft">
     <template #reference>
-      <!-- 悬停或点击修改头像 -->
-      <button
-        ref="referenceRef"
-        type="button"
-        class="inline-flex shrink-0 overflow-hidden rounded-md border-0 bg-transparent p-0 align-middle"
-        :class="editable ? 'cursor-pointer' : 'cursor-default'"
-        :disabled="!editable"
-        :title="editable ? '修改头像' : '头像'"
-        @mouseenter="open"
-        @focus="open"
-        @click.stop="open"
-        @keydown.esc.stop="close"
-      >
-        <slot :icon="avatar" :size="size">
-          <img :src="currentIcon" alt="头像" class="object-contain" :style="{ width: `${size}px`, height: `${size}px` }" />
-        </slot>
-      </button>
+      <!-- 悬停修改头像 -->
+      <span ref="referenceRef" class="inline-flex" :class="{ 'cursor-pointer': props.editable }" @mouseenter="open">
+        <slot :icon="avatar || undefined" :size="props.size" />
+      </span>
     </template>
 
     <div v-click-outside="closeOutside" class="p-4" @keydown.esc.stop="close" @click.stop>
@@ -127,29 +112,37 @@ onBeforeUnmount(() => fileReader?.abort())
         <el-radio value="default">默认 Logo</el-radio>
         <el-radio value="custom">自定义上传</el-radio>
       </el-radio-group>
+      <div v-if="logoMode === 'default'">
+        <slot :icon="undefined" :size="80" />
+      </div>
 
-      <img v-if="logoMode === 'default'" :src="defaultIcon" alt="默认 Logo" class="h-[106px] w-[106px] rounded-md object-contain" />
       <div v-else>
-        <input ref="fileInputRef" type="file" accept="image/jpeg,image/png,image/gif" class="hidden" @change="selectImage" />
         <!-- 选择或更换头像图片 -->
-        <button
-          type="button"
-          class="flex-center h-20 w-20 cursor-pointer overflow-hidden rounded-md border border-dashed bg-N100 p-0 hover:border-primary"
+        <el-upload
+          ref="uploadRef"
+          action="#"
+          accept="image/jpeg,image/png,image/gif"
+          :auto-upload="false"
+          :show-file-list="false"
           :disabled="reading"
-          :title="draftIcon ? '更换头像图片' : '上传头像图片'"
-          @click="fileInputRef?.click()"
+          :on-change="selectImage"
         >
-          <img v-if="draftIcon" :src="draftIcon" alt="自定义头像预览" class="h-full w-full object-contain" />
-          <MkIcon v-else :icon="Plus" :size="28" />
-        </button>
-        <p class="text-N600">支持 JPG、PNG、GIF，文件大小不超过 10MB</p>
+          <el-avatar v-if="draftIcon" :size="80" shape="square">
+            <img :src="draftIcon" alt="自定义头像预览" class="object-cover" />
+          </el-avatar>
+
+          <div v-else class="flex-center h-20 w-20 rounded-md border border-dashed bg-N200 hover:border-primary">
+            <MkIcon name="icon_add_outlined" :size="24" />
+          </div>
+        </el-upload>
+        <p class="text-N600 mt-1">支持 JPG、PNG、GIF，文件大小不超过 10MB</p>
       </div>
 
       <div class="mt-4 text-right">
         <!-- 取消头像修改 -->
         <el-button plain @click="close">取消</el-button>
         <!-- 确认头像修改 -->
-        <el-button type="primary" :loading="reading" @click="confirm"> 确定 </el-button>
+        <el-button type="primary" :loading="reading" :disabled="logoMode === 'custom' && !draftIcon" @click="confirm">确定</el-button>
       </div>
     </div>
   </el-popover>
diff --git a/ui/src/layout/ResourceDetailLayout.vue b/ui/src/layout/ResourceDetailLayout.vue
index 98c39fd5ebb..f0edb8a0820 100644
--- a/ui/src/layout/ResourceDetailLayout.vue
+++ b/ui/src/layout/ResourceDetailLayout.vue
@@ -3,6 +3,7 @@ import { computed } from 'vue'
 import { RouterView, useRoute, useRouter } from 'vue-router'
 import { getMatchedChildRouteList } from '@/router/admin/utils'
 import type { LayoutMenuItem } from './types'
+import ResourceDetailMenu from './sidebar/ResourceDetailMenu.vue'
 
 defineOptions({ name: 'ResourceDetailLayout' })
 
@@ -17,10 +18,6 @@ const router = useRouter()
 const detailMenuItems = computed(() => getMatchedChildRouteList(route))
 const activeDetailMenuName = computed(() => route.meta.detailActiveMenu ?? String(route.name ?? ''))
 
-function isDetailMenuActive(detailMenuItem: LayoutMenuItem) {
-  return detailMenuItem.name === activeDetailMenuName.value
-}
-
 function navigateBack() {
   emit('back')
 }
@@ -35,6 +32,7 @@ function navigateToDetailMenu(detailMenuItem: LayoutMenuItem) {
     <template #aside="{ Header }">
       <component :is="Header">
         <div class="flex-align-center min-w-0 gap-2">
+          <!-- 返回资源列表 -->
           <el-button class="-ml-1" text @click="navigateBack">
             <MkIcon name="icon_arrow-left_outlined" :size="20" />
           </el-button>
@@ -43,20 +41,7 @@ function navigateToDetailMenu(detailMenuItem: LayoutMenuItem) {
       </component>
 
       <el-scrollbar class="min-h-0 flex-1">
-        <div class="space-y-1 px-4">
-          <template v-for="detailMenuItem in detailMenuItems" :key="detailMenuItem.name">
-            <MkListItem :active="isDetailMenuActive(detailMenuItem)" @click="navigateToDetailMenu(detailMenuItem)">
-              <template #default="{ active }">
-                <MkIcon
-                  v-if="detailMenuItem.icon"
-                  class="mr-3"
-                  :name="active ? (detailMenuItem.activeIcon ?? detailMenuItem.icon) : detailMenuItem.icon"
-                />
-                <span class="min-w-0 flex-1 truncate" :title="detailMenuItem.label">{{ detailMenuItem.label }}</span>
-              </template>
-            </MkListItem>
-          </template>
-        </div>
+        <ResourceDetailMenu :menu-items="detailMenuItems" :active-name="activeDetailMenuName" @select="navigateToDetailMenu" />
       </el-scrollbar>
     </template>
 
diff --git a/ui/src/layout/sidebar/ResourceDetailMenu.vue b/ui/src/layout/sidebar/ResourceDetailMenu.vue
new file mode 100644
index 00000000000..a2c6e420530
--- /dev/null
+++ b/ui/src/layout/sidebar/ResourceDetailMenu.vue
@@ -0,0 +1,92 @@
+<script setup lang="ts">
+import { ref, watch } from 'vue'
+import type { LayoutMenuItem } from '../types'
+
+defineOptions({ name: 'ResourceDetailMenu' })
+
+const props = defineProps<{ menuItems: LayoutMenuItem[]; activeName: string }>()
+const emit = defineEmits<{ select: [menuItem: LayoutMenuItem] }>()
+
+/* 初始展开分组；导航时展开当前页所属分组，保留用户对其他分组的选择。 */
+const expandedGroups = ref<string[]>(props.menuItems.filter((menuItem) => menuItem.children?.length).map((menuItem) => menuItem.name))
+
+watch(
+  () => props.activeName,
+  (activeName) => {
+    const activeGroup = props.menuItems.find((menuItem) => menuItem.children?.some((child) => child.name === activeName))
+    if (activeGroup && !expandedGroups.value.includes(activeGroup.name)) expandedGroups.value.push(activeGroup.name)
+  },
+  { immediate: true },
+)
+</script>
+
+<template>
+  <el-collapse v-model="expandedGroups" class="resource-detail-menu space-y-1 border-0! px-4">
+    <template v-for="menuItem in props.menuItems" :key="menuItem.name">
+      <!-- 展开或收起菜单分组 -->
+      <el-collapse-item v-if="menuItem.children?.length" :name="menuItem.name">
+        <template #title>
+          <span class="flex-align-center min-w-0 gap-3">
+            <MkIcon v-if="menuItem.icon" :name="menuItem.icon" />
+            <span class="min-w-0 flex-1 truncate" :title="menuItem.label">{{ menuItem.label }}</span>
+          </span>
+        </template>
+        <template #icon="{ isActive }">
+          <MkIcon name="icon_down_outlined" class="ml-2 text-N500 transition-transform" :class="{ 'rotate-180': isActive }" />
+        </template>
+        <div class="space-y-1 pt-1">
+          <template v-for="child in menuItem.children" :key="child.name">
+            <!-- 切换二级菜单页面 -->
+            <MkListItem :active="child.name === props.activeName" @click="emit('select', child)">
+              <span class="ml-7 min-w-0 flex-1 truncate" :title="child.label">{{ child.label }}</span>
+            </MkListItem>
+          </template>
+        </div>
+      </el-collapse-item>
+      <!-- 切换一级菜单页面 -->
+      <MkListItem v-else :active="menuItem.name === props.activeName" @click="emit('select', menuItem)">
+        <template #default="{ active }">
+          <MkIcon v-if="menuItem.icon" class="mr-3" :name="active ? (menuItem.activeIcon ?? menuItem.icon) : menuItem.icon" />
+          <span class="min-w-0 flex-1 truncate" :title="menuItem.label">{{ menuItem.label }}</span>
+        </template>
+      </MkListItem>
+    </template>
+  </el-collapse>
+</template>
+
+<style lang="scss" scoped>
+/* 详情导航折叠分组与 MkListItem 使用相同的行尺寸和悬停样式。 */
+.resource-detail-menu {
+  :deep(.el-collapse-item__content) {
+    color: var(--mk-N900);
+    font-size: var(--mk-font-size-base);
+    line-height: var(--mk-line-height-base);
+    padding-bottom: 0;
+  }
+
+  :deep(.el-collapse-item__header) {
+    background: transparent;
+    border: 0;
+    border-radius: var(--el-border-radius-base);
+    color: var(--mk-N900);
+    font-size: var(--mk-font-size-base);
+    font-weight: 400;
+    height: auto;
+    line-height: var(--mk-line-height-base);
+    padding: 9px calc(var(--spacing) * 2);
+
+    &:hover {
+      background: rgb(var(--mk-N900-rgb) / 10%);
+    }
+  }
+
+  :deep(.el-collapse-item__title) {
+    min-width: 0;
+  }
+
+  :deep(.el-collapse-item__wrap) {
+    background: transparent;
+    border: 0;
+  }
+}
+</style>
diff --git a/ui/src/router/ROUTE_README.md b/ui/src/router/ROUTE_README.md
index b47f83083b9..0c4bb2537da 100644
--- a/ui/src/router/ROUTE_README.md
+++ b/ui/src/router/ROUTE_README.md
@@ -59,7 +59,7 @@ System 根地址为 `/admin/system`，默认进入首页 `/admin/system/home`。
 对话端管理根地址为 `/admin/system/chat-management`（`system-chat-management`），默认进入
 `users`（`system-chat-users`）。子路由还包括 `groups`
 （`system-chat-groups`）、`authentication`（`system-chat-authentication`）
-和 `portal-access`（`system-portal-access`），页面组件统一位于 `views/system/chat-management/`。
+和 `portal-setting`（`system-portal-setting`），页面组件统一位于 `views/system/chat-management/`。
 门户访问设置渲染 `views/system/chat-management/portal-setting/PortalSettingView.vue`，提供门户访问
 配置和右侧界面预览。
 
@@ -113,18 +113,19 @@ Chat 使用独立入口 `src/chat.ts` 和独立 Router，不要把 Chat 路由
 
 路由扩展字段定义在 `admin/types.ts`：
 
-| 字段               | 类型                                                  | 说明                                                   |
-| ------------------ | ----------------------------------------------------- | ------------------------------------------------------ |
-| `scope`            | `'workspace' \| 'system'`                             | 标记生成哪一套框架导航，只配置在布局根路由上           |
-| `resourceScope`    | `'workspace' \| 'system-resource' \| 'system-shared'` | 标记页面使用的资源范围，由对应资源父路由配置并向下继承 |
-| `activeIcon`       | `string`                                              | 菜单激活状态的 iconfont Symbol ID                      |
-| `activeMenu`       | `string`                                              | 进入子页面时需要保持激活的侧栏菜单路径                 |
-| `detailActiveMenu` | `string`                                              | 更深层详情页面需要保持激活的二级菜单路由名称           |
-| `title`            | `string`                                              | 页面标题，同时作为导航名称                             |
-| `icon`             | `string`                                              | iconfont Symbol ID，子目录通常可以不配置               |
-| `order`            | `number`                                              | 同级导航排序，数字越小越靠前                           |
-| `hidden`           | `boolean`                                             | 设置为 `true` 时不显示在导航中                         |
-| `resource`         | `ResourceAuthorizationType`                           | 系统资源授权页面当前管理的后端资源类型                 |
+| 字段                 | 类型                                                  | 说明                                                   |
+| -------------------- | ----------------------------------------------------- | ------------------------------------------------------ |
+| `scope`              | `'workspace' \| 'system'`                             | 标记生成哪一套框架导航，只配置在布局根路由上           |
+| `resourceScope`      | `'workspace' \| 'system-resource' \| 'system-shared'` | 标记页面使用的资源范围，由对应资源父路由配置并向下继承 |
+| `activeIcon`         | `string`                                              | 菜单激活状态的 iconfont Symbol ID                      |
+| `activeMenu`         | `string`                                              | 进入子页面时需要保持激活的侧栏菜单路径                 |
+| `resourceDetailRoot` | `boolean`                                             | 标记资源详情导航根，仅在详情容器路由自身配置           |
+| `detailActiveMenu`   | `string`                                              | 更深层详情页面需要保持激活的二级菜单路由名称           |
+| `title`              | `string`                                              | 页面标题，同时作为导航名称                             |
+| `icon`               | `string`                                              | iconfont Symbol ID，子目录通常可以不配置               |
+| `order`              | `number`                                              | 同级导航排序，数字越小越靠前                           |
+| `hidden`             | `boolean`                                             | 设置为 `true` 时不显示在导航中                         |
+| `resource`           | `ResourceAuthorizationType`                           | 系统资源授权页面当前管理的后端资源类型                 |
 
 ## 导航生成
 
@@ -139,8 +140,8 @@ Chat 使用独立入口 `src/chat.ts` 和独立 Router，不要把 Chat 路由
 `WorkspaceSidebar` 和 `SystemSidebar` 分别调用该方法，不需要在页面组件中维护菜单数组。
 
 资源详情页面统一使用 `ResourceDetailLayout`。`admin/utils.ts` 中的
-`getMatchedChildRouteList(route)` 根据当前匹配路由找到所属详情父路由，并复用与
-`getChildRouteList(scope)` 相同的过滤、排序和菜单字段转换逻辑生成二级导航。详情子路由通过
+`getMatchedChildRouteList(route)` 从 `route.matched` 的记录自身 meta 中查找 `resourceDetailRoot: true`，定位详情父路由，并复用与
+`getChildRouteList(scope)` 相同的过滤、排序和菜单字段转换逻辑生成二级导航。详情菜单支持一级入口与二级折叠分组混排，分组直接使用路由 `children`。详情子路由通过
 `title`、`icon`、`activeIcon` 和 `order` 配置二级菜单；更深层页面通过
 `detailActiveMenu` 指定需要保持激活的二级菜单路由名称，不配置 `parentPath` 或 `parentName`。
 `ResourceDetailLayout` 切换二级菜单时保留当前 query；详情容器返回列表时按业务来源状态透传或
@@ -323,10 +324,15 @@ System 共享资源页面：
 - 每次新增、删除、移动或修改路由时，必须同步更新本文件。
 
 工作空间知识库卡片进入 `workspace-knowledge-detail`，默认重定向到“文档”子路由。
-详情容器复用 `ResourceDetailLayout`，二级目录包含“文档”、“工作流”和“设置”；`setting`
+详情容器复用 `ResourceDetailLayout`，菜单依次为“资料库（文档、图片、标签管理）”、
+“工作流”、“检索优化（召回测试、问题、自定义分词）”、“授权与集成（对话用户、外部检索服务）”、
+“设置”。资料库分组使用空 path，保留原 `/document` 地址；图片和标签分别使用 `/image`、`/tag`。
+检索优化使用 `/retrieval/recall`、`/retrieval/question`、`/retrieval/dictionary`；
+授权与集成使用 `/integration/chat-user`、`/integration/external-retrieval`。
+分组不挂载页面组件，直接访问分组时重定向到首个子页。新增七个页面暂为占位 View。`setting`
 渲染 `knowledge-detail/setting/KnowledgeSettingView.vue`，使用容器提供的知识库详情。`workflow-entry`
 仅作为目录跳转入口，重定向到独立的 `workflow-knowledge` 全屏画布。画布返回知识库详情。
-文档详情继续保留原地址，并通过 `detailActiveMenu` 高亮“文档”。
+文档详情路由当前尚未启用；后续接入时通过 `detailActiveMenu` 高亮“文档”。
 
 智能体工作流返回通过 `views/workflow/application/navigation.ts` 动态读取详情父路由的 `children`。
 Workspace 父路由为 `workspace-application-detail-layout`；System 详情实现时使用
diff --git a/ui/src/router/admin/system/index.ts b/ui/src/router/admin/system/index.ts
index 2fc819c93fb..6e1dc47432b 100644
--- a/ui/src/router/admin/system/index.ts
+++ b/ui/src/router/admin/system/index.ts
@@ -252,12 +252,12 @@ export const systemRoutes: RouteRecordRaw = {
           component: () => import('@/views/system/chat-management/authentication/AuthenticationView.vue'),
           meta: { title: '对话用户认证', order: 30,
             permission:perm.system.chatAuth.read,
-            next:'system-portal-access'
+            next:'system-portal-setting'
           },
         },
         {
-          path: 'portal-access',
-          name: 'system-portal-access',
+          path: 'portal-setting',
+          name: 'system-portal-setting',
           component: () => import('@/views/system/chat-management/portal-setting/PortalSettingView.vue'),
           meta: { title: '门户访问设置', order: 40, permission: perm.system.portal.read, next: 'system-settings' },
         },
diff --git a/ui/src/router/admin/types.ts b/ui/src/router/admin/types.ts
index feffdd3e7c2..caec3b3e068 100644
--- a/ui/src/router/admin/types.ts
+++ b/ui/src/router/admin/types.ts
@@ -17,6 +17,8 @@ declare module 'vue-router' {
     activeMenu?: string
     /** 资源详情页需要保持激活的二级菜单路由名称。 */
     detailActiveMenu?: string
+    /** 资源详情导航根，仅配置在挂载详情容器的路由上。 */
+    resourceDetailRoot?: boolean
     /** iconfont Symbol ID */
     icon?: string
     order?: number
diff --git a/ui/src/router/admin/utils.ts b/ui/src/router/admin/utils.ts
index 1a871ee950b..da61db2e5bc 100644
--- a/ui/src/router/admin/utils.ts
+++ b/ui/src/router/admin/utils.ts
@@ -26,7 +26,7 @@ function createMenuItems(routes: readonly MenuRouteRecord[]): LayoutMenuItem[] {
         activeIcon: route.meta?.activeIcon,
         icon: route.meta?.icon,
         route: { name: route.name! },
-        permission:route.meta?.permission as LayoutMenuItem['permission'],
+        permission: route.meta?.permission as LayoutMenuItem['permission'],
         children: children.length ? children : undefined,
       }
     })
@@ -41,13 +41,7 @@ export function getChildRouteList(scope: RouteScope): LayoutMenuItem[] {
 
 /** 根据当前匹配路由生成所属详情父路由的二级侧栏目录。 */
 export function getMatchedChildRouteList(route: RouteLocationNormalizedLoaded): LayoutMenuItem[] {
-  const activeRouteName = route.meta.detailActiveMenu ?? route.name
+  const detailRoot = route.matched.find((matchedRoute) => matchedRoute.meta.resourceDetailRoot === true)
 
-  if (!activeRouteName) return []
-
-  const parentRoute = [...route.matched]
-    .reverse()
-    .find((matchedRoute) => matchedRoute.children.some((childRoute) => childRoute.name === activeRouteName))
-
-  return createMenuItems(parentRoute?.children ?? [])
+  return createMenuItems(detailRoot?.children ?? [])
 }
diff --git a/ui/src/router/admin/workspace/modules/application.ts b/ui/src/router/admin/workspace/modules/application.ts
index ae8fc556780..228ec16739c 100644
--- a/ui/src/router/admin/workspace/modules/application.ts
+++ b/ui/src/router/admin/workspace/modules/application.ts
@@ -19,7 +19,7 @@ export const applicationRoutes: RouteRecordRaw[] = [
         path: ':applicationId/:type',
         name: 'workspace-application-detail-layout',
         component: () => import('@/views/application-detail/WorkspaceApplicationDetail.vue'),
-        meta: { title: '智能体详情', hidden: true },
+        meta: { title: '智能体详情', hidden: true, resourceDetailRoot: true },
         children: [
           {
             path: 'overview',
diff --git a/ui/src/router/admin/workspace/modules/knowledge.ts b/ui/src/router/admin/workspace/modules/knowledge.ts
index f743dc21397..587c645958c 100644
--- a/ui/src/router/admin/workspace/modules/knowledge.ts
+++ b/ui/src/router/admin/workspace/modules/knowledge.ts
@@ -18,26 +18,91 @@ export const knowledgeRoutes: RouteRecordRaw[] = [
         name: 'workspace-knowledge-detail',
         component: () => import('@/views/knowledge-detail/WorkspaceKnowledgeDetailView.vue'),
         redirect: { name: 'workspace-knowledge-document-list' },
-        meta: { title: '知识库详情', hidden: true },
+        meta: { title: '知识库详情', hidden: true, resourceDetailRoot: true },
         children: [
           {
-            path: 'document',
-            name: 'workspace-knowledge-document-list',
-            component: () => import('@/views/knowledge-detail/document/DocumentListView.vue'),
-            meta: { title: '文档', icon: 'icon-draft_outlined', activeIcon: 'icon-draft_outlined', order: 10 },
+            path: '',
+            name: 'workspace-knowledge-library',
+            redirect: { name: 'workspace-knowledge-document-list' },
+            meta: { title: '资料库', icon: 'icon_describe_outlined', order: 10 },
+            children: [
+              {
+                path: 'document',
+                name: 'workspace-knowledge-document-list',
+                component: () => import('@/views/knowledge-detail/document/DocumentListView.vue'),
+                meta: { title: '文档', order: 10 },
+              },
+              {
+                path: 'image',
+                name: 'workspace-knowledge-image-list',
+                component: () => import('@/views/knowledge-detail/image/ImageListView.vue'),
+                meta: { title: '图片', order: 20 },
+              },
+              {
+                path: 'tag',
+                name: 'workspace-knowledge-tag',
+                component: () => import('@/views/knowledge-detail/tag/TagManagementView.vue'),
+                meta: { title: '标签管理', order: 30 },
+              },
+            ],
           },
-
           {
             path: 'workflow-entry',
             name: 'workspace-knowledge-workflow',
             redirect: (to) => ({ name: 'workflow-knowledge', params: { workspaceId: to.params.workspaceId, knowledgeId: to.params.knowledgeId } }),
-            meta: { title: '工作流', icon: 'icon_ticket-flow_outlined', activeIcon: 'icon_ticket-flow_outlined', order: 20 },
+            meta: { title: '工作流', icon: 'icon_mindnote_outlined', order: 20 },
+          },
+          {
+            path: 'retrieval',
+            name: 'workspace-knowledge-retrieval',
+            redirect: { name: 'workspace-knowledge-recall-test' },
+            meta: { title: '检索优化', icon: 'icon-laser', order: 30 },
+            children: [
+              {
+                path: 'recall',
+                name: 'workspace-knowledge-recall-test',
+                component: () => import('@/views/knowledge-detail/recall-test/RecallTestView.vue'),
+                meta: { title: '召回测试', order: 10 },
+              },
+              {
+                path: 'question',
+                name: 'workspace-knowledge-question',
+                component: () => import('@/views/knowledge-detail/question/QuestionListView.vue'),
+                meta: { title: '问题', order: 20 },
+              },
+              {
+                path: 'dictionary',
+                name: 'workspace-knowledge-dictionary',
+                component: () => import('@/views/knowledge-detail/dictionary/DictionaryView.vue'),
+                meta: { title: '自定义分词', order: 30 },
+              },
+            ],
+          },
+          {
+            path: 'integration',
+            name: 'workspace-knowledge-integration',
+            redirect: { name: 'workspace-knowledge-chat-user' },
+            meta: { title: '授权与集成', icon: 'icon_admin_outlined', order: 40 },
+            children: [
+              {
+                path: 'chat-user',
+                name: 'workspace-knowledge-chat-user',
+                component: () => import('@/views/knowledge-detail/chat-user/ChatUserListView.vue'),
+                meta: { title: '对话用户', order: 10 },
+              },
+              {
+                path: 'external-retrieval',
+                name: 'workspace-knowledge-external-retrieval',
+                component: () => import('@/views/knowledge-detail/external-retrieval/ExternalRetrievalView.vue'),
+                meta: { title: '外部检索服务', order: 20 },
+              },
+            ],
           },
           {
             path: 'setting',
             name: 'workspace-knowledge-setting',
             component: () => import('@/views/knowledge-detail/setting/KnowledgeSettingView.vue'),
-            meta: { title: '设置', icon: 'icon_setting', activeIcon: 'icon_setting_filled', order: 30 },
+            meta: { title: '设置', icon: 'icon_setting', activeIcon: 'icon_setting_filled', order: 50 },
           },
           // {
           //   path: 'document/:documentId',
diff --git a/ui/src/styles/STYLE_README.md b/ui/src/styles/STYLE_README.md
index 350bcb23ed3..ef2ca123a86 100644
--- a/ui/src/styles/STYLE_README.md
+++ b/ui/src/styles/STYLE_README.md
@@ -507,3 +507,12 @@ npm run build-only-chat
 
 `mk-rank` 提供 20px 圆形名次徽标，前三名叠加 `mk-rank-1`、`mk-rank-2`、
 `mk-rank-3`，使用固定渐变配色。样式统一维护在 `app.scss`。
+
+## 资源详情导航
+
+`layout/sidebar/ResourceDetailMenu.vue` 统一资源详情的单层与二级菜单样式，供
+`ResourceDetailLayout` 使用。分组使用 `el-collapse / el-collapse-item`，允许同时展开多个分组；
+叶子菜单复用 `MkListItem`，二级项仅缩进内容，选中背景保持整行宽度。
+折叠标题沿用菜单行的字号、行高、圆角、内边距与悬停颜色，移除 Collapse 默认分隔线和内容留白。
+覆盖样式限定在组件 scoped 范围内，不影响 SystemSidebar 或其他 Collapse。
+分组首次默认展开，路由切换时展开当前叶子所属分组，普通渲染不重置手动收起状态。
diff --git a/ui/src/styles/element-plus.scss b/ui/src/styles/element-plus.scss
index 835426efb8d..4f8fc4a6e7e 100644
--- a/ui/src/styles/element-plus.scss
+++ b/ui/src/styles/element-plus.scss
@@ -321,6 +321,9 @@
     line-height: 22px;
     font-weight: 400;
   }
+  &__inner:before {
+    top: 6px !important;
+  }
 }
 
 .el-checkbox-button {
@@ -1209,4 +1212,7 @@
       color: var(--el-color-primary-light-5);
     }
   }
+  &:focus {
+    color: inherit;
+  }
 }
diff --git a/ui/src/styles/tailwind.css b/ui/src/styles/tailwind.css
index 13bc2b878ff..59610aaa178 100644
--- a/ui/src/styles/tailwind.css
+++ b/ui/src/styles/tailwind.css
@@ -9,6 +9,7 @@
   --color-purple: var(--mk-purple);
   --color-blue: var(--mk-blue);
   --color-N100: var(--mk-N100);
+  --color-N200: var(--mk-N200);
   --color-N300: var(--mk-N300);
   --color-N350: var(--mk-N350);
   --color-N400: var(--mk-N400);
diff --git a/ui/src/views/VIEW_README.md b/ui/src/views/VIEW_README.md
index 6df932da2e8..7007c1eb400 100644
--- a/ui/src/views/VIEW_README.md
+++ b/ui/src/views/VIEW_README.md
@@ -407,7 +407,7 @@ Dialog。新增或重命名文件时，应同步更新所有导入和页面功
 | `system/identity/workspaces/WorkspaceListView.vue`                     | 工作空间列表页面                                                     |
 | `system/chat/user-groups/GroupsListView.vue`                           | 对话用户组及组成员管理页面                                           |
 | `system/chat/users/UserListView.vue`                                   | 对话用户列表、配额及用户导入管理页面                                 |
-| `system/chat-management/portal-setting/PortalSettingView.vue`           | 门户基本信息、访问开关、认证配置、跨域地址编辑与门户预览 |
+| `system/chat-management/portal-setting/PortalSettingView.vue`          | 门户基本信息、访问开关、认证配置、跨域地址编辑与门户预览             |
 | `system/settings/theme/ThemeSettingView.vue`                           | 系统外观设置和登录外观预览页面                                       |
 | `system/settings/authentication/AuthenticationView.vue`                | 系统登录及认证源配置页面                                             |
 | `system/settings/email/EmailSettingsView.vue`                          | 系统邮件 SMTP 服务配置页面                                           |
@@ -625,14 +625,17 @@ Workspace 与 System 授权均使用该工作空间 ID，不读取路由工作
 
 `KnowledgeCard` 在非批量选择模式下通过 `click` 通知列表进入知识库详情。
 `knowledge-detail/WorkspaceKnowledgeDetailView.vue` 查询并展示知识库名称，复用
-`ResourceDetailLayout` 生成“文档”、“工作流”和“设置”目录，返回列表时恢复所属文件夹。
+`ResourceDetailLayout` 生成资料库、工作流、检索优化、授权与集成、设置目录，返回列表时恢复所属文件夹。
+资料库包含文档、图片、标签管理；检索优化包含召回测试、问题、自定义分词；授权与集成包含
+对话用户、外部检索服务。新增页面分别放在 `knowledge-detail/` 下的 `image/`、`tag/`、
+`recall-test/`、`question/`、`dictionary/`、`chat-user/`、`external-retrieval/`，暂只展示占位内容。
 容器通过 `knowledge-detail/context.ts` 提供只读详情与替换能力；设置页复用已加载详情，保存成功后
 更新容器数据，同步名称等展示。基本信息复用创建流程的 `KnowledgeBaseForm`，类型配置和校验留在
 设置页中。当前设置页仅接入 Workspace 路由和 API，暂不增加前端权限判断。
 更换向量模型需确认，先保存再重新向量化，整条流程禁止重复提交；向量化失败时保留原模型比较基准，
 允许再次保存重试。Web、飞书设置保留未编辑的 `meta` 字段，上传限制使用详情顶层值。
 `knowledge-detail/document/DocumentListView.vue` 为文档列表子页面，目前保留占位内容；
-文档详情作为同一容器的子路由。System 详情仍使用原有独立占位页面。
+文档详情路由暂未启用，System 知识库详情路由暂未注册。
 
 `KnowledgeWorkflowView` 复用 `ButtonDefaultModelSetting`，从知识库详情读取默认模型配置，
 随工作流保存提交并将配置传入画布；支持应用到所有节点，保存失败回滚至已保存配置。
diff --git a/ui/src/views/application/ApplicationView.vue b/ui/src/views/application/ApplicationView.vue
index a45a9ffa8bb..7d6f3959a75 100644
--- a/ui/src/views/application/ApplicationView.vue
+++ b/ui/src/views/application/ApplicationView.vue
@@ -244,7 +244,7 @@ function handleBatchDelete() {
                   <RelatedResourcesApplicationAction label="查看关联资源" :api="RelatedResourcesApi" :application="application" />
                   <!-- 复制 -->
                   <CopyApplicationAction
-                    v-if="$perm.application.workspace.copy(application.id)"
+
                     v-model:loading="applicationOperationLoading"
                     label="复制"
                     :api="ApplicationApi"
diff --git a/ui/src/views/knowledge-detail/chat-user/ChatUserListView.vue b/ui/src/views/knowledge-detail/chat-user/ChatUserListView.vue
new file mode 100644
index 00000000000..a1226794a2e
--- /dev/null
+++ b/ui/src/views/knowledge-detail/chat-user/ChatUserListView.vue
@@ -0,0 +1,7 @@
+<script setup lang="ts">
+defineOptions({ name: 'ChatUserListView' })
+</script>
+
+<template>
+  <div class="flex-center min-h-0 flex-1 text-N500">对话用户功能待接入</div>
+</template>
diff --git a/ui/src/views/knowledge-detail/dictionary/DictionaryView.vue b/ui/src/views/knowledge-detail/dictionary/DictionaryView.vue
new file mode 100644
index 00000000000..55fcf537860
--- /dev/null
+++ b/ui/src/views/knowledge-detail/dictionary/DictionaryView.vue
@@ -0,0 +1,7 @@
+<script setup lang="ts">
+defineOptions({ name: 'DictionaryView' })
+</script>
+
+<template>
+  <div class="flex-center min-h-0 flex-1 text-N500">自定义分词功能待接入</div>
+</template>
diff --git a/ui/src/views/knowledge-detail/external-retrieval/ExternalRetrievalView.vue b/ui/src/views/knowledge-detail/external-retrieval/ExternalRetrievalView.vue
new file mode 100644
index 00000000000..1f787e2b013
--- /dev/null
+++ b/ui/src/views/knowledge-detail/external-retrieval/ExternalRetrievalView.vue
@@ -0,0 +1,7 @@
+<script setup lang="ts">
+defineOptions({ name: 'ExternalRetrievalView' })
+</script>
+
+<template>
+  <div class="flex-center min-h-0 flex-1 text-N500">外部检索服务功能待接入</div>
+</template>
diff --git a/ui/src/views/knowledge-detail/image/ImageListView.vue b/ui/src/views/knowledge-detail/image/ImageListView.vue
new file mode 100644
index 00000000000..48ff3b8310c
--- /dev/null
+++ b/ui/src/views/knowledge-detail/image/ImageListView.vue
@@ -0,0 +1,7 @@
+<script setup lang="ts">
+defineOptions({ name: 'ImageListView' })
+</script>
+
+<template>
+  <div class="flex-center min-h-0 flex-1 text-N500">图片功能待接入</div>
+</template>
diff --git a/ui/src/views/knowledge-detail/question/QuestionListView.vue b/ui/src/views/knowledge-detail/question/QuestionListView.vue
new file mode 100644
index 00000000000..4812063720d
--- /dev/null
+++ b/ui/src/views/knowledge-detail/question/QuestionListView.vue
@@ -0,0 +1,7 @@
+<script setup lang="ts">
+defineOptions({ name: 'QuestionListView' })
+</script>
+
+<template>
+  <div class="flex-center min-h-0 flex-1 text-N500">问题功能待接入</div>
+</template>
diff --git a/ui/src/views/knowledge-detail/recall-test/RecallTestView.vue b/ui/src/views/knowledge-detail/recall-test/RecallTestView.vue
new file mode 100644
index 00000000000..ea6087a3295
--- /dev/null
+++ b/ui/src/views/knowledge-detail/recall-test/RecallTestView.vue
@@ -0,0 +1,7 @@
+<script setup lang="ts">
+defineOptions({ name: 'RecallTestView' })
+</script>
+
+<template>
+  <div class="flex-center min-h-0 flex-1 text-N500">召回测试功能待接入</div>
+</template>
diff --git a/ui/src/views/knowledge-detail/tag/TagManagementView.vue b/ui/src/views/knowledge-detail/tag/TagManagementView.vue
new file mode 100644
index 00000000000..79e14c7166f
--- /dev/null
+++ b/ui/src/views/knowledge-detail/tag/TagManagementView.vue
@@ -0,0 +1,7 @@
+<script setup lang="ts">
+defineOptions({ name: 'TagManagementView' })
+</script>
+
+<template>
+  <div class="flex-center min-h-0 flex-1 text-N500">标签管理功能待接入</div>
+</template>
diff --git a/ui/src/views/system/chat-management/portal-setting/PortalSettingView.vue b/ui/src/views/system/chat-management/portal-setting/PortalSettingView.vue
index d5036dc5c74..42e04750dfe 100644
--- a/ui/src/views/system/chat-management/portal-setting/PortalSettingView.vue
+++ b/ui/src/views/system/chat-management/portal-setting/PortalSettingView.vue
@@ -80,14 +80,16 @@ const previewLogo = computed(() => portalSetting.logo)
   <MkViewLayout title="门户访问设置">
     <div class="flex min-w-215 flex-1 gap-4">
       <div class="w-95 shrink-0 space-y-4">
-        <el-card shadow="never" body-class="flex-between gap-3">
-          <div class="flex-align-center min-w-0 gap-2">
-            <img v-if="previewLogo" :src="previewLogo" alt="门户 Logo" class="size-6 shrink-0 object-contain" />
-            <LogoIcon v-else :height="24" class="shrink-0" />
-            <h4 class="truncate" :title="previewName">{{ previewName }}</h4>
+        <el-card shadow="never">
+          <div class="flex-between gap-3">
+            <div class="flex-align-center min-w-0 gap-2">
+              <img v-if="previewLogo" :src="previewLogo" alt="门户 Logo" class="size-6 shrink-0 object-contain" />
+              <LogoIcon v-else :height="24" class="shrink-0" />
+              <h4 class="truncate" :title="previewName">{{ previewName }}</h4>
+            </div>
+            <!-- 编辑门户名称与 Logo -->
+            <ButtonEditPortal ref="editPortalButtonRef" :setting="portalSetting" :save="savePortalSetting" />
           </div>
-          <!-- 编辑门户名称与 Logo -->
-          <ButtonEditPortal v-if="perm.system.portal.edit()" ref="editPortalButtonRef" :setting="portalSetting" :saving="saving" :save="savePortalSetting" />
         </el-card>
         <el-card shadow="never">
           <div class="space-y-4">
@@ -149,7 +151,7 @@ const previewLogo = computed(() => portalSetting.logo)
               <span>身份认证</span>
               <div class="flex-align-center gap-2">
                 <!-- 配置身份认证 -->
-                <ButtonPortalAuthSetting ref="authSettingButtonRef" :setting="portalSetting" :saving="saving" :save="savePortalAuthSetting" />
+                <ButtonPortalAuthSetting ref="authSettingButtonRef" :setting="portalSetting" :save="savePortalAuthSetting" />
                 <el-switch :model-value="portalSetting.enable_auth" size="small" @change="handleAccessChange('enable_auth', $event)" />
               </div>
             </div>
@@ -157,7 +159,7 @@ const previewLogo = computed(() => portalSetting.logo)
               <span>跨域设置</span>
               <div class="flex-align-center gap-2">
                 <!-- 配置跨域地址 -->
-                <ButtonPortalCorsSetting v-model="portalCorsOrigins" :disabled="saving" />
+                <ButtonPortalCorsSetting v-model="portalCorsOrigins" />
                 <el-switch :model-value="portalSetting.enable_cors" size="small" @change="handleAccessChange('enable_cors', $event)" />
               </div>
             </div>
diff --git a/ui/src/views/system/chat-management/portal-setting/components/ButtonEditPortal.vue b/ui/src/views/system/chat-management/portal-setting/components/ButtonEditPortal.vue
index 3fbf488561a..f7a4db218c5 100644
--- a/ui/src/views/system/chat-management/portal-setting/components/ButtonEditPortal.vue
+++ b/ui/src/views/system/chat-management/portal-setting/components/ButtonEditPortal.vue
@@ -1,11 +1,10 @@
 <script setup lang="ts">
-import { computed, reactive, ref, useTemplateRef } from 'vue'
+import { reactive, ref, useTemplateRef } from 'vue'
 import type { FormInstance, FormRules } from 'element-plus'
 import type { PortalSetting } from '@/api/types'
 import MkEditAvatar from '@/components/mk-edit-avatar/index.vue'
-import defaultLogo from '@/assets/mk-logo/logo.svg'
 
-const props = defineProps<{ setting: PortalSetting; saving: boolean; save: (payload: FormData) => Promise<void> }>()
+const props = defineProps<{ setting: PortalSetting; save: (payload: FormData) => Promise<void> }>()
 
 /* 门户名称与 Logo */
 const editVisible = ref(false)
@@ -14,10 +13,7 @@ const portalForm = reactive({ name: '', logo: '' })
 const logoFile = ref<File | null>(null)
 const logoChanged = ref(false)
 const portalRules: FormRules = {
-  name: [
-    { required: true, message: '请输入门户名称', trigger: 'blur' },
-    { whitespace: true, message: '门户名称不能为空白', trigger: 'blur' },
-  ],
+  name: [{ required: true, whitespace: true, message: '请输入门户名称', trigger: 'blur' }],
 }
 
 function handleOpenPortalEdit() {
@@ -27,7 +23,9 @@ function handleOpenPortalEdit() {
   editVisible.value = true
 }
 
-function handleLogoChange(_icon: string, file: File | null) {
+function handleLogoChange(icon: string, file: File | null) {
+  // 保留已有图片及尚未保存的文件，只有新选图片或恢复默认时更新。
+  if (icon && !file) return
   logoFile.value = file
   logoChanged.value = true
 }
@@ -55,23 +53,27 @@ function handleClosePortalEdit() {
 
 <template>
   <!-- 编辑门户名称与 Logo -->
-  <el-button text :disabled="saving" @click="handleOpenPortalEdit">
+  <el-button text @click="handleOpenPortalEdit">
     <MkIcon name="icon_edit_outlined" />
   </el-button>
   <MkDialog v-model="editVisible" title="编辑" @closed="handleClosePortalEdit">
     <el-form ref="portalFormRef" :model="portalForm" :rules="portalRules" label-position="top" require-asterisk-position="right" @submit.prevent>
       <el-form-item label="名称" prop="name">
         <div class="flex-align-center w-full gap-3">
-          <MkEditAvatar v-model="portalForm.logo" :default-icon="defaultLogo" :size="32" @change="handleLogoChange" />
-          <el-input v-model="portalForm.name" maxlength="64" show-word-limit :disabled="saving" placeholder="请输入门户名称" />
+          <MkEditAvatar v-model="portalForm.logo" @change="handleLogoChange" :size="32">
+            <template #default="{ icon }">
+              <PortalIcon :icon="icon" />
+            </template>
+          </MkEditAvatar>
+          <el-input v-model="portalForm.name" maxlength="64" show-word-limit placeholder="请输入门户名称" />
         </div>
       </el-form-item>
     </el-form>
     <template #footer>
       <!-- 取消编辑 -->
-      <el-button plain :disabled="saving" @click="editVisible = false">取消</el-button>
+      <el-button plain @click="editVisible = false">取消</el-button>
       <!-- 保存门户信息 -->
-      <el-button type="primary" :loading="saving" @click="handleSavePortalInfo">保存</el-button>
+      <el-button type="primary" @click="handleSavePortalInfo">保存</el-button>
     </template>
   </MkDialog>
 </template>