From 68ee56034a6929016c96cc565ffd7293154c50fe 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: Tue, 9 Jun 2026 22:14:13 +0800
Subject: [PATCH] Lazy load AI chat panels

---
 web/apps/web-ele/src/views/_core/agent-chat/index.vue  | 10 ++++++++--
 .../src/views/ai-platform/agent/editor/index.vue       |  7 +++++--
 .../src/views/ai-platform/workflow/editor/index.vue    |  4 +++-
 3 files changed, 16 insertions(+), 5 deletions(-)

diff --git a/web/apps/web-ele/src/views/_core/agent-chat/index.vue b/web/apps/web-ele/src/views/_core/agent-chat/index.vue
index f1c873e..7e4f337 100644
--- a/web/apps/web-ele/src/views/_core/agent-chat/index.vue
+++ b/web/apps/web-ele/src/views/_core/agent-chat/index.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import type { Agent } from '#/api/ai-platform/ai-platform';
 
-import { computed, onMounted, ref } from 'vue';
+import { computed, defineAsyncComponent, onMounted, ref } from 'vue';
 import { useRoute } from 'vue-router';
 
 import { Page } from '@vben/common-ui';
@@ -11,7 +11,13 @@ import { $t } from '@vben/locales';
 import { ElButton, ElEmpty } from 'element-plus';
 
 import { getAgentByCodeApi } from '#/api/ai-platform/ai-platform';
-import { AiChatPanel, ConversationList } from '#/components/ai-chat-panel';
+
+const AiChatPanel = defineAsyncComponent(() =>
+  import('#/components/ai-chat-panel/AiChatPanel.vue'),
+);
+const ConversationList = defineAsyncComponent(() =>
+  import('#/components/ai-chat-panel/ConversationList.vue'),
+);
 
 defineOptions({ name: 'AgentChat' });
 
diff --git a/web/apps/web-ele/src/views/ai-platform/agent/editor/index.vue b/web/apps/web-ele/src/views/ai-platform/agent/editor/index.vue
index ec0b3eb..bc308ac 100644
--- a/web/apps/web-ele/src/views/ai-platform/agent/editor/index.vue
+++ b/web/apps/web-ele/src/views/ai-platform/agent/editor/index.vue
@@ -7,7 +7,7 @@ import type {
   WorkflowListItem,
 } from '#/api/ai-platform/ai-platform';
 
-import { onMounted, reactive, ref, watch } from 'vue';
+import { defineAsyncComponent, onMounted, reactive, ref, watch } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
 
 import {
@@ -49,9 +49,12 @@ import {
   publishAgentApi,
   updateAgentApi,
 } from '#/api/ai-platform/ai-platform';
-import { AiChatPanel } from '#/components/ai-chat-panel';
 import { useAppContextStore } from '#/store/app-context';
 
+const AiChatPanel = defineAsyncComponent(() =>
+  import('#/components/ai-chat-panel/AiChatPanel.vue'),
+);
+
 const appContextStore = useAppContextStore();
 
 const route = useRoute();
diff --git a/web/apps/web-ele/src/views/ai-platform/workflow/editor/index.vue b/web/apps/web-ele/src/views/ai-platform/workflow/editor/index.vue
index 3e20efc..d79187e 100644
--- a/web/apps/web-ele/src/views/ai-platform/workflow/editor/index.vue
+++ b/web/apps/web-ele/src/views/ai-platform/workflow/editor/index.vue
@@ -76,7 +76,6 @@ import {
   runWorkflowStreamApi,
   updateWorkflowApi,
 } from '#/api/ai-platform/ai-platform';
-import { AiChatPanel } from '#/components/ai-chat-panel';
 import { useAppContextStore } from '#/store/app-context';
 import { useWorkflowEditorStore } from '#/store/workflow-editor';
 
@@ -91,6 +90,9 @@ import '@vue-flow/core/dist/style.css';
 import '@vue-flow/core/dist/theme-default.css';
 import '@vue-flow/controls/dist/style.css';
 
+const AiChatPanel = defineAsyncComponent(() =>
+  import('#/components/ai-chat-panel/AiChatPanel.vue'),
+);
 const AppCreateNode = defineAsyncComponent(() => import('./nodes/AppCreateNode.vue'));
 const AppDesignNode = defineAsyncComponent(() => import('./nodes/AppDesignNode.vue'));
 const AppSettingsNode = defineAsyncComponent(() => import('./nodes/AppSettingsNode.vue'));