From 5d4525b898ff5ae94e7809672fda4afb252fa1e5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?cls=5F=E5=AE=81=E6=B3=A2=E6=9C=AC=E6=9C=BA?= <908705107@qq.com> Date: Mon, 8 Jun 2026 23:35:08 +0800 Subject: [PATCH] Trim online design previews from AI panels --- .../web-ele/src/components/ChatBox/types.ts | 9 +- .../components/ai-chat-panel/AiChatPanel.vue | 208 +----------- .../ai-chat-panel/form-editor-lite.ts | 10 - .../src/components/ai-chat-panel/types.ts | 11 +- .../agent/components/AgentChatPanel.vue | 100 +----- .../workflow/editor/components/ChatPanel.vue | 310 +----------------- 6 files changed, 28 insertions(+), 620 deletions(-) diff --git a/web/apps/web-ele/src/components/ChatBox/types.ts b/web/apps/web-ele/src/components/ChatBox/types.ts index 62a877e..32705b1 100644 --- a/web/apps/web-ele/src/components/ChatBox/types.ts +++ b/web/apps/web-ele/src/components/ChatBox/types.ts @@ -94,10 +94,13 @@ export interface InteractionConfig { // 设计预览类型 export type DesignPreviewType = + | 'agent_capability' | 'database_design' - | 'form_basic_info' - | 'form_ui_design' - | 'list_config'; + | 'knowledge_retrieval' + | 'list_config' + | 'llm_config' + | 'system_summary' + | 'workflow_result'; // 设计预览配置 export interface DesignPreview { diff --git a/web/apps/web-ele/src/components/ai-chat-panel/AiChatPanel.vue b/web/apps/web-ele/src/components/ai-chat-panel/AiChatPanel.vue index f8dc944..47edcac 100644 --- a/web/apps/web-ele/src/components/ai-chat-panel/AiChatPanel.vue +++ b/web/apps/web-ele/src/components/ai-chat-panel/AiChatPanel.vue @@ -18,7 +18,7 @@ import type { */ import { computed, onUnmounted, ref, watch } from 'vue'; -import { Settings2, X } from '@vben/icons'; +import { Close, Setting } from '@element-plus/icons-vue'; import { ElButton, @@ -32,11 +32,6 @@ import { import { AiWorkingAnimation } from '#/components/ai-loading'; import { ChatBox } from '#/components/ChatBox'; import { - AppDesignPanel, - AppSettingsPanel, - DashboardBasicInfoConfirmPanel, - DashboardDesignConfirmPanel, - DashboardPublishConfirmPanel, DesignEditorPanel, SystemSummaryConfirmPanel, } from '#/components/form-editor'; @@ -197,21 +192,6 @@ const pendingMessage = ref(''); const showDesignPanel = ref(false); const currentDesign = ref(undefined); -const showAppDesignPanel = ref(false); -const currentAppDesign = ref(undefined); - -const showAppSettingsPanel = ref(false); -const currentAppSettings = ref(undefined); - -const showDashboardBasicInfoPanel = ref(false); -const currentDashboardBasicInfo = ref(undefined); - -const showDashboardDesignPanel = ref(false); -const currentDashboardDesign = ref(undefined); - -const showDashboardPublishPanel = ref(false); -const currentDashboardPublish = ref(undefined); - const showSystemSummaryPanel = ref(false); const currentSystemSummary = ref(undefined); @@ -223,11 +203,6 @@ const loadingAnimationTitle = ref('AI 正在开发...'); const hasAnyDesignPanelOpen = computed( () => showDesignPanel.value || - showAppDesignPanel.value || - showAppSettingsPanel.value || - showDashboardBasicInfoPanel.value || - showDashboardDesignPanel.value || - showDashboardPublishPanel.value || showSystemSummaryPanel.value || showLoadingAnimation.value, ); @@ -278,31 +253,6 @@ const handleDesignPreview = (data: DesignPreviewData) => { showLoadingAnimation.value = false; switch (data.type) { - case 'app_design': { - currentAppDesign.value = data; - showAppDesignPanel.value = true; - break; - } - case 'app_settings': { - currentAppSettings.value = data; - showAppSettingsPanel.value = true; - break; - } - case 'dashboard_basic_info': { - currentDashboardBasicInfo.value = data; - showDashboardBasicInfoPanel.value = true; - break; - } - case 'dashboard_design': { - currentDashboardDesign.value = data; - showDashboardDesignPanel.value = true; - break; - } - case 'dashboard_publish': { - currentDashboardPublish.value = data; - showDashboardPublishPanel.value = true; - break; - } case 'system_summary': { currentSystemSummary.value = data; showSystemSummaryPanel.value = true; @@ -807,68 +757,6 @@ const handleDesignClose = createDesignCloseHandler( currentDesign, ); -const handleAppDesignConfirm = createDesignConfirmHandler( - showAppDesignPanel, - currentAppDesign, - '确认应用设计', -); -const handleAppDesignClose = createDesignCloseHandler( - showAppDesignPanel, - currentAppDesign, -); - -const handleAppSettingsConfirm = createDesignConfirmHandler( - showAppSettingsPanel, - currentAppSettings, - '确认应用设置', -); -const handleAppSettingsClose = createDesignCloseHandler( - showAppSettingsPanel, - currentAppSettings, -); - -const handleDashboardBasicInfoConfirm = createDesignConfirmHandler( - showDashboardBasicInfoPanel, - currentDashboardBasicInfo, - '确认仪表盘基础信息', -); -const handleDashboardBasicInfoClose = createDesignCloseHandler( - showDashboardBasicInfoPanel, - currentDashboardBasicInfo, -); - -const handleDashboardDesignConfirm = createDesignConfirmHandler( - showDashboardDesignPanel, - currentDashboardDesign, - '确认仪表盘设计', -); -const handleDashboardDesignClose = createDesignCloseHandler( - showDashboardDesignPanel, - currentDashboardDesign, -); - -const handleDashboardPublishConfirm = (data: Record) => { - showDashboardPublishPanel.value = false; - currentDashboardPublish.value = undefined; - - const userMsg: ChatMessage = { - id: generateId(), - role: 'user', - content: `发布到菜单：${data.menu_name}`, - timestamp: new Date(), - }; - messages.value.push(userMsg); - - waitingForInput.value = false; - waitingConfig.value = null; - - resumeExecution(JSON.stringify(data)); -}; -const handleDashboardPublishClose = createDesignCloseHandler( - showDashboardPublishPanel, - currentDashboardPublish, -); - const handleSystemSummaryConfirm = createDesignConfirmHandler( showSystemSummaryPanel, currentSystemSummary, @@ -919,14 +807,14 @@ onUnmounted(() => { mode === 'workflow' && enableVariablesForm && hasMultipleVariables " link - :icon="Settings2" + :icon="Setting" title="配置输入变量" @click="variablesDialogVisible = true" /> @@ -1014,56 +902,6 @@ onUnmounted(() => { @close="handleDesignClose" /> - - - - - - - - - - - - - - - { @close="handleDesignClose" /> - - - - - - - - - - ([]); @@ -79,14 +78,6 @@ const currentDesign = ref(null); -// 应用设计面板状态 -const currentAppDesign = ref(null); - // 取消流式请求 let cancelStream: (() => void) | null = null; @@ -493,31 +484,17 @@ function handleStreamEvent( if (configData?.type === 'design_preview') { const previewType = configData.preview_type; - // 应用设计方案使用 AppDesignPanel（富文本编辑器） - if (previewType === 'app_design') { - currentAppDesign.value = { - type: previewType, - title: - configData.title || - $t('ai-platform.agent.chatPanel.appDesignTitle'), - data: configData.data || {}, - nodeId: event.node_id || '', - }; - showAppDesignPanel.value = true; - } else { - // 其他设计类型使用 DesignEditorPanel（表单编辑器） - currentDesign.value = { - type: previewType, - title: - configData.title || - $t('ai-platform.agent.chatPanel.designPreview'), - data: configData.data || {}, - nodeId: event.node_id || '', - form_fields: configData.form_fields || [], - table_configs: configData.table_configs || [], - }; - showDesignPanel.value = true; - } + currentDesign.value = { + type: previewType, + title: + configData.title || + $t('ai-platform.agent.chatPanel.designPreview'), + data: configData.data || {}, + nodeId: event.node_id || '', + form_fields: configData.form_fields || [], + table_configs: configData.table_configs || [], + }; + showDesignPanel.value = true; // 显示提示消息 const waitingContent = `**${configData.title}**\n\n${configData.message || $t('ai-platform.agent.chatPanel.designPanelHint')}`; @@ -795,46 +772,6 @@ function handleDesignCancel() { currentDesign.value = null; } -// 应用设计面板确认 -function handleAppDesignConfirm(data: Record) { - showAppDesignPanel.value = false; - - // 添加用户确认消息 - const userMsg: AgentMessage = { - id: generateId(), - role: 'user', - content: $t('ai-platform.agent.chatPanel.confirmAppDesign'), - status: 'completed', - reasoning_steps: [], - tool_calls: [], - prompt_tokens: 0, - completion_tokens: 0, - total_tokens: 0, - elapsed_time: 0, - error_message: '', - feedback: '', - created_at: new Date().toISOString(), - }; - chatMessages.value.push(userMsg); - - // 重置等待状态 - waitingForInput.value = false; - waitingConfig.value = null; - currentAppDesign.value = null; - - // 继续工作流，传递编辑后的数据 - doSendMessage(JSON.stringify(data), false); -} - -// 应用设计面板取消 -function handleAppDesignCancel() { - showAppDesignPanel.value = false; - waitingForInput.value = false; - waitingConfig.value = null; - currentAppDesign.value = null; -} - -// 暴露方法给父组件 defineExpose({ clearChat, scrollToBottom, @@ -909,18 +846,5 @@ onUnmounted(() => { /> - -
- -
diff --git a/web/apps/web-ele/src/views/ai-platform/workflow/editor/components/ChatPanel.vue b/web/apps/web-ele/src/views/ai-platform/workflow/editor/components/ChatPanel.vue index 3574803..1d88cf9 100644 --- a/web/apps/web-ele/src/views/ai-platform/workflow/editor/components/ChatPanel.vue +++ b/web/apps/web-ele/src/views/ai-platform/workflow/editor/components/ChatPanel.vue @@ -2,18 +2,13 @@ import type { WorkflowStreamEvent } from '#/api/ai-platform/ai-platform'; import type { ChatMessage, ReasoningStep } from '#/components/ChatBox/index'; import type { - AppDesignData, - AppSettingsData, - DashboardBasicInfoData, - DashboardDesignData, - DashboardPublishData, DesignData, SystemSummaryData, } from '#/components/form-editor'; import { computed, onUnmounted, ref, watch } from 'vue'; -import { Settings2, X } from '@vben/icons'; +import { Close, Setting } from '@element-plus/icons-vue'; import { $t } from '@vben/locales'; import { @@ -31,11 +26,6 @@ import { } from '#/api/ai-platform/ai-platform'; import { ChatBox } from '#/components/ChatBox/index'; import { - AppDesignPanel, - AppSettingsPanel, - DashboardBasicInfoConfirmPanel, - DashboardDesignConfirmPanel, - DashboardPublishConfirmPanel, DesignEditorPanel, SystemSummaryConfirmPanel, } from '#/components/form-editor'; @@ -74,30 +64,6 @@ const currentRunId = ref(''); const showDesignPanel = ref(false); const currentDesign = ref(undefined); -// 应用设计面板状态 -const showAppDesignPanel = ref(false); -const currentAppDesign = ref(undefined); - -// 应用设置面板状态 -const showAppSettingsPanel = ref(false); -const currentAppSettings = ref(undefined); - -// 仪表盘基础信息面板状态 -const showDashboardBasicInfoPanel = ref(false); -const currentDashboardBasicInfo = ref( - undefined, -); - -// 仪表盘设计面板状态 -const showDashboardDesignPanel = ref(false); -const currentDashboardDesign = ref(undefined); - -// 仪表盘发布面板状态 -const showDashboardPublishPanel = ref(false); -const currentDashboardPublish = ref( - undefined, -); - // 系统总结面板状态 const showSystemSummaryPanel = ref(false); const currentSystemSummary = ref(undefined); @@ -600,84 +566,6 @@ const handleStreamEvent = (event: WorkflowStreamEvent, msgId: string) => { if (configData?.type === 'design_preview') { // 检查是否是应用设计类型 switch (configData.preview_type) { - case 'app_design': { - // 应用设计：打开专用的应用设计面板 - currentAppDesign.value = { - type: 'app_design', - title: - configData.title || - $t('ai-platform.workflow.editor.chatPanel.appDesignTitle'), - data: configData.data || {}, - nodeId: event.node_id || '', - }; - showAppDesignPanel.value = true; - - break; - } - case 'app_settings': { - // 应用设置：打开专用的应用设置面板 - currentAppSettings.value = { - type: 'app_settings', - title: - configData.title || - $t('ai-platform.workflow.editor.chatPanel.appSettingsTitle'), - data: configData.data || {}, - nodeId: event.node_id || '', - layoutOptions: configData.layoutOptions || [], - themeOptions: configData.themeOptions || [], - }; - showAppSettingsPanel.value = true; - - break; - } - case 'dashboard_basic_info': { - // 仪表盘基础信息：打开专用面板（在聊天框右侧） - currentDashboardBasicInfo.value = { - type: 'dashboard_basic_info', - title: - configData.title || - $t( - 'ai-platform.workflow.editor.chatPanel.dashboardBasicInfoTitle', - ), - data: configData.data || {}, - nodeId: event.node_id || '', - }; - showDashboardBasicInfoPanel.value = true; - - break; - } - case 'dashboard_design': { - // 仪表盘设计：打开设计器面板（在聊天框右侧） - currentDashboardDesign.value = { - type: 'dashboard_design', - title: - configData.title || - $t( - 'ai-platform.workflow.editor.chatPanel.dashboardDesignTitle', - ), - data: configData.data || {}, - nodeId: event.node_id || '', - }; - showDashboardDesignPanel.value = true; - - break; - } - case 'dashboard_publish': { - // 仪表盘发布：打开发布确认面板（在聊天框右侧） - currentDashboardPublish.value = { - type: 'dashboard_publish', - title: - configData.title || - $t( - 'ai-platform.workflow.editor.chatPanel.dashboardPublishTitle', - ), - data: configData.data || {}, - nodeId: event.node_id || '', - }; - showDashboardPublishPanel.value = true; - - break; - } case 'system_summary': { // 系统总结：打开总结展示面板 currentSystemSummary.value = { @@ -979,153 +867,6 @@ const handleDesignClose = () => { }; // 处理应用设计确认 -const handleAppDesignConfirm = (data: Record) => { - showAppDesignPanel.value = false; - currentAppDesign.value = undefined; - - // 添加用户确认消息 - const userMsg: ChatMessage = { - id: generateId(), - role: 'user', - content: $t('ai-platform.workflow.editor.chatPanel.confirmAppDesign'), - timestamp: new Date(), - }; - messages.value.push(userMsg); - - // 重置等待状态 - waitingForInput.value = false; - waitingConfig.value = null; - - // 恢复工作流，传递编辑后的数据 - resumeWorkflow(JSON.stringify(data)); -}; - -// 处理应用设计面板关闭 -const handleAppDesignClose = () => { - showAppDesignPanel.value = false; - currentAppDesign.value = undefined; -}; - -// 处理应用设置确认 -const handleAppSettingsConfirm = (data: Record) => { - showAppSettingsPanel.value = false; - currentAppSettings.value = undefined; - - // 添加用户确认消息 - const userMsg: ChatMessage = { - id: generateId(), - role: 'user', - content: $t('ai-platform.workflow.editor.chatPanel.confirmAppSettings'), - timestamp: new Date(), - }; - messages.value.push(userMsg); - - // 重置等待状态 - waitingForInput.value = false; - waitingConfig.value = null; - - // 恢复工作流，传递编辑后的数据 - resumeWorkflow(JSON.stringify(data)); -}; - -// 处理应用设置面板关闭 -const handleAppSettingsClose = () => { - showAppSettingsPanel.value = false; - currentAppSettings.value = undefined; -}; - -// 处理仪表盘基础信息确认 -const handleDashboardBasicInfoConfirm = (data: Record) => { - showDashboardBasicInfoPanel.value = false; - currentDashboardBasicInfo.value = undefined; - - // 添加用户确认消息 - const userMsg: ChatMessage = { - id: generateId(), - role: 'user', - content: $t( - 'ai-platform.workflow.editor.chatPanel.confirmDashboardBasicInfo', - ), - timestamp: new Date(), - }; - messages.value.push(userMsg); - - // 重置等待状态 - waitingForInput.value = false; - waitingConfig.value = null; - - // 恢复工作流，传递编辑后的数据 - resumeWorkflow(JSON.stringify(data)); -}; - -// 处理仪表盘基础信息面板关闭 -const handleDashboardBasicInfoClose = () => { - showDashboardBasicInfoPanel.value = false; - currentDashboardBasicInfo.value = undefined; -}; - -// 处理仪表盘设计确认 -const handleDashboardDesignConfirm = (data: Record) => { - showDashboardDesignPanel.value = false; - currentDashboardDesign.value = undefined; - - // 添加用户确认消息 - const userMsg: ChatMessage = { - id: generateId(), - role: 'user', - content: $t('ai-platform.workflow.editor.chatPanel.confirmDashboardDesign'), - timestamp: new Date(), - }; - messages.value.push(userMsg); - - // 重置等待状态 - waitingForInput.value = false; - waitingConfig.value = null; - - // 恢复工作流，传递编辑后的数据 - resumeWorkflow(JSON.stringify(data)); -}; - -// 处理仪表盘设计面板关闭 -const handleDashboardDesignClose = () => { - showDashboardDesignPanel.value = false; - currentDashboardDesign.value = undefined; -}; - -// 处理仪表盘发布确认 -const handleDashboardPublishConfirm = (data: Record) => { - console.log('[ChatPanel] 接收到发布确认数据:', data); - showDashboardPublishPanel.value = false; - currentDashboardPublish.value = undefined; - - // 添加用户确认消息 - const userMsg: ChatMessage = { - id: generateId(), - role: 'user', - content: $t('ai-platform.workflow.editor.chatPanel.publishToMenu', { - name: data.menu_name, - }), - timestamp: new Date(), - }; - messages.value.push(userMsg); - - // 重置等待状态 - waitingForInput.value = false; - waitingConfig.value = null; - - // 恢复工作流，传递发布数据 - const userInputStr = JSON.stringify(data); - console.log('[ChatPanel] 传递给 resumeWorkflow 的数据:', userInputStr); - resumeWorkflow(userInputStr); -}; - -// 处理仪表盘发布面板关闭 -const handleDashboardPublishClose = () => { - showDashboardPublishPanel.value = false; - currentDashboardPublish.value = undefined; -}; - -// 处理系统总结确认 const handleSystemSummaryConfirm = (data: Record) => { showSystemSummaryPanel.value = false; currentSystemSummary.value = undefined; @@ -1177,11 +918,11 @@ onUnmounted(() => { - + @@ -1258,51 +999,6 @@ onUnmounted(() => { /> - - - - - - - - - - - - - - -