feat: conversation

ui/src/components/COMPONENT_README.md

@@ -77,13 +77,14 @@ import { MkDynamicsForm, MkDynamicsFormConstructor } from '@/components/mk-dynam
 
 ### MkTooltip
 
-普通提示统一使用 `MkTooltip`，业务代码不直接使用 `el-tooltip`。默认悬停 500ms 后显示，
+普通提示统一使用 `MkTooltip`，业务代码不直接使用 `el-tooltip`。默认悬停 300ms 后显示，
 延迟由 `global/mk-tooltip/constants.ts` 的 `TOOLTIP_SHOW_DELAY` 维护；提前移开时由 Element Plus 取消显示。
-`showAfter` 可按需覆盖，其他 Tooltip 属性、事件（包括 `update:visible`）通过 `$attrs` 透传，
+项目中所有显式 `show-after` / `showAfter` 配置（包括 Popover）统一引用 `TOOLTIP_SHOW_DELAY`，不写死延迟数值。
+`MkTooltip` 的 `showAfter` 默认值使用该常量；其他 Tooltip 属性、事件（包括 `update:visible`）通过 `$attrs` 透传，
 支持默认触发插槽和 `content` 插槽，保持原有关闭延迟及可移入行为。
 显式控制 `visible` 时，显示时机由调用方负责，`showAfter` 不参与受控显示。
 Admin、Chat 共用的 `App.vue` 通过 Config Provider 的 `table.tooltipOptions` 为表格溢出提示
-配置同一延迟，不额外开启溢出提示。原生 `title`、Popover、下拉菜单及图表提示保持各自行为。
+配置同一延迟，不额外开启溢出提示。原生 `title`、未显式配置延迟的浮层、下拉菜单及图表提示保持各自行为。
 
 ### MdEditor、MdEditorMagnify、MdPreview
 
@@ -655,6 +656,8 @@ Model 配置器的默认模型也使用 `SelectModel`，仅展示已选的可选
 重新生成追加用户消息 `Re generate` 后请求；停止调用当前流的 `cancel()`，保留已生成内容。
 输入支持 Enter 发送、Ctrl/Shift/Alt/Meta + Enter 在光标处换行、原生文本粘贴，拒绝纯空白，
 输入法组合期间不提交；键盘和粘贴事件停止冒泡，输入上限 100000 字符。
+回车与组合键换行复用 `conversation-panel/core/shortcuts.ts` 的 `inputShortcut`，
+发送条件由组件保留；该工具不接管原生文本粘贴或附件上传。
 
 ### FolderTree
 

ui/src/components/business/generate-content/index.vue

@@ -3,6 +3,7 @@ import { computed, nextTick, onBeforeUnmount, reactive, ref, useTemplateRef, wat
 import type { ScrollbarInstance } from 'element-plus'
 import type { PromptGenerateMessage } from '@/api/types'
 import { ConversationStream } from '@/conversation-panel/core/stream'
+import { inputShortcut } from '@/conversation-panel/core/shortcuts'
 import { MsgError } from '@/utils/message'
 
 defineOptions({ name: 'GenerateContent' })
@@ -107,21 +108,8 @@ function replaceContent() {
 }
 
 // 需求输入：回车发送，组合键在光标处换行，输入法确认时不提交。
-function handleInputKeydown(event: KeyboardEvent) {
-  if (event.isComposing || event.key !== 'Enter') return
-  event.preventDefault()
-  if (event.ctrlKey || event.shiftKey || event.altKey || event.metaKey) {
-    const textarea = event.target
-    if (!(textarea instanceof HTMLTextAreaElement)) return
-    const startPos = textarea.selectionStart
-    const endPos = textarea.selectionEnd
-    const content = inputValue.value.slice(0, startPos) + '\n' + inputValue.value.slice(endPos)
-    if (textarea.maxLength >= 0 && content.length > textarea.maxLength) return
-    inputValue.value = content
-    nextTick(() => textarea.setSelectionRange(startPos + 1, startPos + 1))
-    return
-  }
-  generateContent()
+function handleKeydown(event: KeyboardEvent) {
+  inputShortcut(event, inputValue, () => generateContent())
 }
 
 // 关闭或卸载时停止读取，关闭动画结束后清理会话。
@@ -162,15 +150,15 @@ onBeforeUnmount(stopGenerate)
         <!-- 重新生成内容 -->
         <el-button plain :disabled="disabled" @click="generateContent(true)">重新生成</el-button>
       </div>
-      <div class="mk-conversation-input border transition-colors hover:border-primary focus-within:border-primary">
+      <div class="mk-input-box border transition-colors hover:border-primary focus-within:border-primary">
         <el-input
           v-model="inputValue"
           type="textarea"
           resize="none"
           :autosize="{ minRows: 1, maxRows: 10 }"
           :placeholder="placeholder"
           :maxlength="100000"
-          @keydown.stop="handleInputKeydown"
+          @keydown.stop="handleKeydown"
           @paste.stop
         />
         <div class="text-right">

ui/src/components/business/select-application-dialog/index.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import { TOOLTIP_SHOW_DELAY } from '@/components/global/mk-tooltip/constants'
 import { computed, nextTick, ref, useTemplateRef } from 'vue'
 import { cloneDeep } from 'lodash'
 import ApplicationApi from '@/api/admin/workspace/application/application'
@@ -125,7 +126,13 @@ defineExpose({ open })
         <template v-if="!loading">
           <div v-if="applicationOptions.length" class="grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3">
             <template v-for="application in applicationOptions" :key="application.id">
-              <el-popover placement="bottom-start" :width="360" :show-after="500" :persistent="false" popper-class="border-none! rounded-xl!">
+              <el-popover
+                placement="bottom-start"
+                :width="360"
+                :show-after="TOOLTIP_SHOW_DELAY"
+                :persistent="false"
+                popper-class="border-none! rounded-xl!"
+              >
                 <template #reference>
                   <MkCardCheckbox
                     :model-value="selectedApplicationIds.includes(application.id)"

ui/src/components/business/select-knowledge-dialog/index.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import { TOOLTIP_SHOW_DELAY } from '@/components/global/mk-tooltip/constants'
 import { computed, nextTick, ref, useTemplateRef } from 'vue'
 import { cloneDeep } from 'lodash'
 import KnowledgeApi from '@/api/admin/workspace/knowledge/knowledge'
@@ -133,7 +134,13 @@ defineExpose({ open })
         <template v-if="!loading">
           <div v-if="filteredKnowledge.length" class="grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3">
             <template v-for="knowledge in filteredKnowledge" :key="knowledge.id">
-              <el-popover placement="bottom-start" :width="360" :show-after="500" :persistent="false" popper-class="border-none! rounded-xl!">
+              <el-popover
+                placement="bottom-start"
+                :width="360"
+                :show-after="TOOLTIP_SHOW_DELAY"
+                :persistent="false"
+                popper-class="border-none! rounded-xl!"
+              >
                 <template #reference>
                   <MkCardCheckbox
                     :model-value="selectedKnowledgeIds.includes(knowledge.id)"
@@ -147,7 +154,7 @@ defineExpose({ open })
                   </MkCardCheckbox>
                 </template>
                 <template #default>
-                  <KnowledgeCard :knowledge="knowledge" disabled> </KnowledgeCard>
+                  <KnowledgeCard :knowledge="knowledge" disabled></KnowledgeCard>
                 </template>
               </el-popover>
             </template>

ui/src/components/business/select-tool-dialog/index.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import { TOOLTIP_SHOW_DELAY } from '@/components/global/mk-tooltip/constants'
 import { computed, nextTick, ref, useTemplateRef } from 'vue'
 import { cloneDeep } from 'lodash'
 import ToolApi from '@/api/admin/workspace/tool/tool'
@@ -127,7 +128,13 @@ defineExpose({ open })
         <template v-if="!loading">
           <div v-if="toolOptions.length" class="grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3">
             <template v-for="tool in toolOptions" :key="tool.id">
-              <el-popover placement="bottom-start" :width="360" :show-after="500" :persistent="false" popper-class="border-none! rounded-xl!">
+              <el-popover
+                placement="bottom-start"
+                :width="360"
+                :show-after="TOOLTIP_SHOW_DELAY"
+                :persistent="false"
+                popper-class="border-none! rounded-xl!"
+              >
                 <template #reference>
                   <MkCardCheckbox :model-value="selectedToolIds.includes(tool.id)" :label="tool.name" @update:model-value="toggleTool(tool)">
                     <div class="flex-align-center min-w-0 flex-1 gap-2">

ui/src/components/business/workspace-relation-tags/index.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import { TOOLTIP_SHOW_DELAY } from '@/components/global/mk-tooltip/constants'
 defineOptions({ name: 'WorkspaceRelationTags' })
 
 interface RelationColumn {
@@ -19,7 +20,7 @@ function formatCellValue(value: unknown): string {
 </script>
 
 <template>
-  <el-popover placement="bottom" trigger="hover" :width="420" :persistent="false" :show-after="300" :disabled="!data.length">
+  <el-popover placement="bottom" trigger="hover" :width="420" :persistent="false" :show-after="TOOLTIP_SHOW_DELAY" :disabled="!data.length">
     <template #reference>
       <MkTagGroup :tags="tags" popover-disabled :class="{ 'cursor-pointer': data.length }" />
     </template>

ui/src/components/global/mk-tag-group/index.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import { TOOLTIP_SHOW_DELAY } from '@/components/global/mk-tooltip/constants'
 import type { TagProps } from 'element-plus'
 
 defineOptions({ name: 'MkTagGroup' })
@@ -30,7 +31,7 @@ withDefaults(
       popper-class="mk-tag-group__popper"
       trigger="hover"
       :popper-style="{ maxWidth: '250px', width: 'auto' }"
-      :show-after="300"
+      :show-after="TOOLTIP_SHOW_DELAY"
       v-if="tags?.length > 1"
     >
       <template #reference>

ui/src/components/global/mk-tooltip/constants.ts

@@ -1,2 +1,2 @@
 /** 悬停提示的统一显示延迟，单位为毫秒。 */
-export const TOOLTIP_SHOW_DELAY = 500
+export const TOOLTIP_SHOW_DELAY = 300

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

@@ -1,83 +1,47 @@
-<template>
-  <header class="debug-header">
-    <!-- 左侧收起时才在顶部显示:展开左侧 + 新建对话 -->
-    <template v-if="!list.leftSideOpen.value">
-      <!-- 展开左侧 -->
-      <button class="header-btn" @click="list.toggleLeftSide()">
-        <svg width="16" height="16" viewBox="0 0 16 16" fill="none">
-          <rect x="1.5" y="2.5" width="13" height="11" rx="2" stroke="currentColor" stroke-width="1.4" />
-          <line x1="6" y1="2.5" x2="6" y2="13.5" stroke="currentColor" stroke-width="1.4" />
-        </svg>
-      </button>
-      <!-- 新建对话 -->
-      <button class="header-btn" @click="list.newConversation()">
-        <el-icon :size="18"><Plus /></el-icon>
-      </button>
-    </template>
-    <div class="header-info">
-      <span class="header-title">{{ list.currentConversation.value?.abstract || '新建对话' }}</span>
-    </div>
-
-    <!-- 放大或还原调试面板 -->
-    <button class="header-btn" @click="debug.toggleExpand()">
-      <MkIcon :icon="debug.expanded.value ? Aim : FullScreen" :size="16" />
-    </button>
-    <!-- 关闭调试 -->
-    <button class="header-btn" @click="debug.close()">
-      <MkIcon :icon="Close" :size="16" />
-    </button>
-  </header>
-</template>
-
 <script setup lang="ts">
-import { Aim, Close, FullScreen, Operation, Plus } from '@element-plus/icons-vue'
 import { useConversationListStore } from '../../../left-sidebar/conversation-list/index'
-import { useExecutionDetailStore } from '../../../right-sidebar/execution-detail/index'
 import { useDebugHeaderStore } from './index'
 
-const list = useConversationListStore()
-const detail = useExecutionDetailStore()
+const { appInfo, leftSideOpen, toggleLeftSide, newConversation } = useConversationListStore()
 const debug = useDebugHeaderStore()
 </script>
 
-<style scoped lang="scss">
-.debug-header {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  height: 44px;
-  padding: 0 12px;
-  flex-shrink: 0;
-  border-bottom: 1px solid var(--bd, #dcdfe6);
-}
-.header-btn {
-  width: 32px;
-  height: 32px;
-  border: none;
-  background: transparent;
-  cursor: pointer;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  border-radius: 6px;
-  color: var(--t2, #606266);
-  flex-shrink: 0;
-}
-.header-btn:hover {
-  background: rgba(0, 0, 0, 0.05);
-}
-.header-info {
-  display: flex;
-  align-items: center;
-  flex: 1;
-  min-width: 0;
-}
-.header-title {
-  font-size: 13px;
-  font-weight: 500;
-  color: var(--t1, #303133);
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-</style>
+<template>
+  <header class="mk-conversation-header flex-align-center h-header shrink-0 border-b px-3">
+    <!-- 左侧收起时才在顶部显示:展开左侧 + 新建对话 -->
+    <template v-if="!leftSideOpen">
+      <MkTooltip content="展开侧边栏">
+        <!-- 展开左侧 -->
+        <el-button text @click="toggleLeftSide()" class="mr-2">
+          <MkIcon name="icon_sidebar_outlined" :size="18" class="text-N900!" />
+        </el-button>
+      </MkTooltip>
+    </template>
+    <ApplicationIcon :icon="appInfo?.icon" :size="24" class="shrink-0 mr-2" />
+    <!-- // TODO 没拿到appInfo -->
+    <h4 class="min-w-0 flex-1 truncate font-semibold" :title="appInfo?.name">
+      {{ appInfo?.name }}
+    </h4>
+
+    <MkTooltip content="新建对话">
+      <!-- 新建对话 -->
+      <el-button text @click="newConversation()">
+        <MkIcon name="icon_new-chat_outlined" :size="18" />
+      </el-button>
+    </MkTooltip>
+    <MkTooltip :content="debug.expanded.value ? '还原' : '放大'">
+      <!-- 放大或还原调试面板 -->
+      <el-button text @click="debug.toggleExpand()">
+        <MkIcon :name="debug.expanded.value ? 'icon_minify_outlined' : 'icon_magnify_outlined'" :size="18" />
+      </el-button>
+    </MkTooltip>
+    <MkTooltip content="关闭调试">
+      <!-- 关闭调试 -->
+      <el-button text @click="debug.close()">
+        <MkIcon name="icon_close_outlined" :size="18" />
+      </el-button>
+    </MkTooltip>
+  </header>
+</template>
+
+<style scoped lang="scss"></style>