feat: dispaly setting

ui/src/api/API_README.md

@@ -401,7 +401,8 @@ Workspace 与 System 资源管理的 `application/application.ts` 提供 `getAcc
 Xpack 版可用登录方式统一调用 `system/chat-management/chat-user-auth.ts` 的 `getChatUserAuthType`，
 GET `/chat_user/auth/types` 返回 `{ label, value }[]`，两种智能体入口共用。
 
-展示设置共用 `ApplicationDisplaySetting`；`ApplicationAccessToken` 兼容可选展示字段，缺失字段由弹窗补齐默认值。
+社区版展示设置通过 `putAccessToken` 提交 `language`、`show_source` 与 `show_exec`，不调用 `/setting`。
+Xpack 展示设置共用 `ApplicationDisplaySetting`；`ApplicationAccessToken` 兼容可选展示字段，缺失字段由弹窗补齐默认值。
 两范围的 `putDisplaySetting` 沿用 V2 的 `/<applicationId>/setting` PUT 接口，提交 FormData：
 `custom_theme`、`float_location` 序列化为 JSON，图片字段提交本次文件，`<field>_url` 保留已有地址；
 恢复默认时图片文件与地址均提交空字符串。当前社区版后端未提供该路由，完整保存依赖支持此接口的部署。

ui/src/api/types/application.ts

@@ -31,7 +31,6 @@ export interface ApplicationDisplaySetting {
   language: string
   show_history: boolean
   draggable: boolean
-  show_guide: boolean
   show_share: boolean
   icon: string
   chat_background: string
@@ -74,6 +73,8 @@ export interface ApplicationAccessToken extends Partial<ApplicationDisplaySettin
 
 /** 智能体访问配置修改或令牌重置参数。 */
 export interface ApplicationAccessTokenPayload {
+  show_source?: boolean
+  show_exec?: boolean
   is_active?: boolean
   access_token_reset?: boolean
   access_num?: number

ui/src/components/COMPONENT_README.md

@@ -162,6 +162,8 @@ Drawer 没有 `MkDialog` 的外壳挂载控制；需要按需挂载时，由业
 `fields` 使用 `OptionItem<string>`，附加 `multiple`、`remoteMethod`。
 有 `options` 时渲染选择器，否则渲染文本输入；`remoteMethod(query)` 由调用方更新选项，组件管理加载状态。
 `change` 返回 `{ [field]: value }`，多选返回数组；清空返回 `undefined`，切换字段仅在原条件非空时通知清空。
+组合外观复用 [连体表单控件样式](../styles/STYLE_README.md#连体表单控件)，字段和条件控件的默认宽度
+分别为 104px、200px；搜索状态、远程加载和切换字段清空逻辑由组件管理。
 
 ### MkDropdown、MkDropdownMenu、MkDropdownItem
 

ui/src/components/global/mk-complex-search/index.vue

@@ -54,16 +54,18 @@ function handleChange() {
 </script>
 
 <template>
-  <div class="mk-complex-search flex">
-    <el-select v-model="searchField" class="mk-complex-search__field w-26!" @change="handleFieldChange" :persistent="false">
+  <div class="mk-input-group">
+    <!-- 选择搜索字段 -->
+    <el-select v-model="searchField" class="mk-input-group__prepend w-26!" @change="handleFieldChange" :persistent="false">
       <el-option v-for="field in fields" :key="field.value" :label="field.label" :value="field.value" />
     </el-select>
 
+    <!-- 选择搜索条件 -->
     <el-select
       v-if="activeField?.options"
       :key="activeField.value"
       v-model="searchValue"
-      class="mk-complex-search__value w-50!"
+      class="mk-input-group__content w-50!"
       clearable
       :loading="remoteLoading"
       :multiple="activeField.multiple"
@@ -86,42 +88,15 @@ function handleChange() {
       />
     </el-select>
 
+    <!-- 输入搜索条件 -->
     <el-input
       v-else
       :key="activeField?.value"
       v-model="searchValue"
-      class="mk-complex-search__value w-50!"
+      class="mk-input-group__content w-50!"
       clearable
       placeholder="请输入"
       @change="handleChange"
     />
   </div>
 </template>
-
-<style scoped lang="scss">
-.mk-complex-search {
-  border: 1px solid var(--el-border-color);
-  border-radius: var(--el-border-radius-base);
-  &__field {
-    border-right: 1px solid var(--el-border-color);
-    :deep(.el-select__wrapper) {
-      box-shadow: none !important;
-      border-radius: var(--el-border-radius-base) 0 0 var(--el-border-radius-base);
-      min-height: 30px !important;
-    }
-  }
-
-  &__value {
-    :deep(.el-select__wrapper) {
-      box-shadow: none !important;
-      border-radius: 0 var(--el-border-radius-base) var(--el-border-radius-base) 0;
-      min-height: 30px !important;
-    }
-    --el-input-inner-height: 28px !important;
-    :deep(.el-input__wrapper) {
-      box-shadow: none !important;
-      border-radius: 0 var(--el-border-radius-base) var(--el-border-radius-base) 0;
-    }
-  }
-}
-</style>

ui/src/conversation-panel/components/header/debug/index.vue

@@ -7,7 +7,7 @@ const debug = useDebugHeaderStore()
 </script>
 
 <template>
-  <header class="mk-conversation-header flex-align-center h-header shrink-0 border-b px-3">
+  <header class="mk-conversation-header flex-align-center h-header shrink-0 border-b border-N300 px-3">
     <!-- 左侧收起时才在顶部显示:展开左侧 + 新建对话 -->
     <template v-if="!leftSideOpen">
       <MkTooltip content="展开侧边栏">

ui/src/conversation-panel/view/debug/index.vue

@@ -53,7 +53,7 @@ watch([() => bundle.list.currentChatId.value, () => bundle.list.composerResetSig
     <transition name="debug-panel">
       <div
         v-if="debug.visible.value"
-        class="workflow-debug-panel overflow-hidden border border-N300 bg-white shadow-lg"
+        class="workflow-debug-panel overflow-hidden border border-N300 bg-white shadow-lg rounded-xl"
         :class="{ expanded: debug.expanded.value }"
       >
         <ConversationLayout
@@ -81,7 +81,6 @@ watch([() => bundle.list.currentChatId.value, () => bundle.list.composerResetSig
 
 /* 调试面板定位与展开布局 */
 .workflow-debug-panel {
-  border-radius: 12px;
   bottom: calc(var(--spacing) * 3);
   height: min(calc(var(--spacing) * 170), 90vh);
   max-width: calc(100vw - var(--spacing) * 6);

ui/src/styles/STYLE_README.md

@@ -57,6 +57,18 @@ Element Plus 覆盖、主题变量和应用样式。Chat 入口还显式引入 E
 模板无需重复添加 `transition-colors` 或 `focus-within:border-primary`。
 生成输入区使用 `mk-input-box`，不叠加对话专属类。
 
+## 连体表单控件
+
+`app.scss` 中的 `mk-input-group` 用于默认尺寸的两段式控件组合，统一横向布局、外边框、
+分隔线和两端圆角。前段 `el-select` 添加 `mk-input-group__prepend`，后段 `el-input`、
+`el-select` 或 `el-input-number` 添加 `mk-input-group__content`；两段直接放在组合容器内，
+中间不添加间距，单位文字放在容器外。
+
+普通单行组合总高度为 32px，多选内容按需撑高。数值输入使用 `controls-position="right"`
+和 `align="left"`，加减按钮随组合内容高度贴合右侧。宽度由调用方通过工具类控制；伸缩场景
+可在组合容器和内容控件上添加 `min-w-0 flex-1`，固定宽度的前段添加 `shrink-0`。
+样式只负责组合外观，不管理值、选项、联动或搜索事件。
+
 ## 基础样式
 
 全局焦点轮廓统一在 `app.scss` 通过 `*:focus-visible { outline: none !important; }` 移除，

ui/src/styles/app.scss

@@ -264,6 +264,7 @@ h6 {
   grid-template-columns: repeat(auto-fill, minmax(min(100%, 270px), 1fr));
 }
 
+/* input */
 /* 对话与内容生成共用的输入容器。 */
 .mk-input-box {
   background: white;
@@ -281,6 +282,56 @@ h6 {
   }
 }
 
+// 选择器与文本、选项或数值输入共用的连体组合。
+.mk-input-group {
+  border: 1px solid var(--el-border-color);
+  border-radius: var(--el-border-radius-base);
+  display: flex;
+
+  &__content {
+    &,
+    .el-input {
+      --el-input-inner-height: 28px !important;
+    }
+
+    &.el-input-number.is-controls-right {
+      .el-input-number__decrease,
+      .el-input-number__increase {
+        height: 50%;
+        right: 0;
+      }
+
+      .el-input-number__decrease {
+        bottom: 0;
+      }
+
+      .el-input-number__increase {
+        top: 0;
+      }
+    }
+
+    .el-input__wrapper,
+    .el-select__wrapper {
+      border-radius: 0 var(--el-border-radius-base) var(--el-border-radius-base) 0;
+      box-shadow: none !important;
+    }
+
+    .el-select__wrapper {
+      min-height: 30px !important;
+    }
+  }
+
+  &__prepend {
+    border-right: 1px solid var(--el-border-color);
+
+    .el-select__wrapper {
+      border-radius: var(--el-border-radius-base) 0 0 var(--el-border-radius-base);
+      box-shadow: none !important;
+      min-height: 30px !important;
+    }
+  }
+}
+
 /* link */
 .mk-link {
   color: var(--mk-primary);

ui/src/views/VIEW_README.md

@@ -348,9 +348,13 @@ View 负责路由、资源与模式、图加载、保存／发布／调试编排
   嵌入第三方弹窗接收概览已有的 Web 链接与访问凭证，不额外请求接口；按全屏、浮窗、移动端单选切换并复制代码，
   关闭后恢复全屏模式。iframe 沿用 Web 链接，移动端增加 `mode=mobile`；浮窗使用 Chat API 前缀下的
   `/embed`，携带协议、主机和访问凭证；若传入链接含查询参数则一并保留，生成 HTML 时转义属性值。无访问凭证时禁用入口。
-  显示设置每次打开通过当前范围的 Application API 查询访问配置，支持主题色、语言、五类图片、
+  显示设置入口按 `auth.isCE` 选择社区版 `DisplaySettingDialog.vue`，其他版本使用
+  `XpackDisplaySettingDialog.vue`；每次打开通过当前范围的 Application API 查询访问配置。
+  社区版只编辑语言、知识来源与执行详情，使用 `putAccessToken` 保存；Xpack 版支持主题色、语言、五类图片、
   头像与对话展示开关、浮窗位置及免责声明，本地草稿实时预览。恢复默认仅改草稿，保存成功关闭，
   失败保留输入；图片限 JPG／PNG／GIF、10 MB，替换、恢复默认、关闭及卸载时释放临时 URL。
+  预览组件位于 `display-setting/components/`，通过 Props 接收名称、展示草稿和临时图片地址，
+  在组件内部合并图片地址；临时 URL 的创建和释放由弹窗负责。
   展示配置保存协议及后端支持情况见 API 文档。
   访问限制位于本地 `access-restriction/`，入口按 `auth.isCE` 选择社区版 `AccessRestrictionDrawer.vue`，
   其他版本使用 `XpackAccessRestrictionDrawer.vue`；按需挂载，关闭动画后卸载。

ui/src/views/application-detail/overview/display-setting/ButtonDisplaySetting.vue

@@ -1,9 +1,13 @@
 <script setup lang="ts">
-import { useTemplateRef } from 'vue'
+import { computed, useTemplateRef } from 'vue'
+import { useStore } from '@/stores/admin'
 import DisplaySettingDialog from './DisplaySettingDialog.vue'
+import XpackDisplaySettingDialog from './XpackDisplaySettingDialog.vue'
 
 defineOptions({ name: 'ButtonDisplaySetting' })
 
+const { auth } = useStore()
+const displaySettingDialog = computed(() => (auth.isCE ? DisplaySettingDialog : XpackDisplaySettingDialog))
 const dialogRef = useTemplateRef<InstanceType<typeof DisplaySettingDialog>>('dialogRef')
 
 function handleOpenDisplaySetting() {
@@ -17,5 +21,5 @@ function handleOpenDisplaySetting() {
     <MkIcon name="icon_setting" />
     <span>显示设置</span>
   </el-button>
-  <DisplaySettingDialog ref="dialogRef" />
+  <component :is="displaySettingDialog" ref="dialogRef" />
 </template>