From a16ab222adf5feed4161b5a554b81e15cf268287 Mon Sep 17 00:00:00 2001
From: wang-xh <wang-xh@inspur.com>
Date: Sat, 19 Jul 2025 11:41:54 +0800
Subject: [PATCH 1/9] =?UTF-8?q?fix:=20=E6=94=BE=E5=BC=80=E9=80=89=E6=8B=A9?=
 =?UTF-8?q?=E5=B7=B2=E6=9C=89=E6=96=B9=E6=B3=95=EF=BC=9B=E5=AE=8C=E5=96=84?=
 =?UTF-8?q?=E8=A1=A8=E5=8D=95=E6=A0=A1=E9=AA=8C=E6=96=87=E6=A1=88?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../composition/use-form-validation.ts        | 24 +++++++++----------
 .../types/toolbox/pc-rtc-toolbox.json         |  6 -----
 .../command-source.component.tsx              | 13 +++++-----
 .../src/components/card-view.component.tsx    |  2 +-
 4 files changed, 19 insertions(+), 26 deletions(-)

diff --git a/packages/designer/src/components/composition/use-form-validation.ts b/packages/designer/src/components/composition/use-form-validation.ts
index 469513ac2fa..cb1f12cad5d 100644
--- a/packages/designer/src/components/composition/use-form-validation.ts
+++ b/packages/designer/src/components/composition/use-form-validation.ts
@@ -20,8 +20,8 @@ export function useFormValidation(useFormSchema: UseFormSchema, formCommandServi
         if (!vmCommand) {
             const controlInfo = useFormSchema.getControlBasicInfoMap().get(boundEvent.id);
             const controlName = (controlInfo && controlInfo.parentPathName) || boundEvent.id;
-            let msg = `控件【CCC】的【XXX】配置的命令已被移除，请重新选择。`;
-            msg = msg.replace('CCC', controlName).replace('XXX', boundEvent.eventName);
+            let msg = `【ControlName】的【EventName】绑定的命令已被移除，请重新选择。`;
+            msg = msg.replace('ControlName', controlName).replace('EventName', boundEvent.eventName);
             FMessageBoxService.warning(msg, '');
             return false;
         }
@@ -134,8 +134,8 @@ export function useFormValidation(useFormSchema: UseFormSchema, formCommandServi
             for (const communicationId of communicationIds) {
                 const communication = communications.find(item => item.id === communicationId);
                 if (!communication) {
-                    let msg = `控件【CCC】配置的【XXX】已被移除，请重新选择。`;
-                    msg = msg.replace('CCC', controlName).replace('XXX', boundEvent.eventName);
+                    let msg = `【ControlName】的【EventName】绑定的通讯已被移除，请重新选择。`;
+                    msg = msg.replace('ControlName', controlName).replace('EventName', boundEvent.eventName);
                     FMessageBoxService.warning(msg, '');
                     return false;
                 }
@@ -144,15 +144,15 @@ export function useFormValidation(useFormSchema: UseFormSchema, formCommandServi
                 const isSourceComplete = source && source.formId && source.componentId && source.event;
                 const isTargetComplete = target && target.formId && target.commandCode;
                 if (!isSourceComplete || !isTargetComplete) {
-                    let msg = `控件【CCC】配置的组件通讯事件不完整，请检查。`;
-                    msg = msg.replace('CCC', controlName);
+                    let msg = `【ControlName】配置的组件通讯事件不完整，请检查。`;
+                    msg = msg.replace('ControlName', controlName);
                     FMessageBoxService.warning(msg, '');
                     return false;
                 }
                 // 检查通讯内的事件、名称等是否有效
                 if (!checkCommunicationSource(source) || !checkCommunicationTarget(target)) {
-                    let msg = `控件【CCC】配置的组件通讯事件已失效，请检查。`;
-                    msg = msg.replace('CCC', controlName);
+                    let msg = `【ControlName】配置的组件通讯事件已失效，请检查。`;
+                    msg = msg.replace('ControlName', controlName);
                     FMessageBoxService.warning(msg, '');
                     return false;
                 }
@@ -162,15 +162,15 @@ export function useFormValidation(useFormSchema: UseFormSchema, formCommandServi
                     for (const paramMapping of paramMappings) {
                         const isParamValid = paramMapping.sourceValue && paramMapping.targetVariable;
                         if (!isParamValid) {
-                            let msg = `控件【CCC】配置的组件通讯事件参数不完整，请检查。`;
-                            msg = msg.replace('CCC', controlName);
+                            let msg = `【ControlName】配置的组件通讯事件参数不完整，请检查。`;
+                            msg = msg.replace('ControlName', controlName);
                             FMessageBoxService.warning(msg, '');
                             return false;
                         }
                         // 检查参是否数失效
                         if (!checkCommunicationTargetState(target, paramMapping)) {
-                            let msg = `控件【CCC】配置的组件通讯事件参数已失效，请检查。`;
-                            msg = msg.replace('CCC', controlName);
+                            let msg = `【ControlName】配置的组件通讯事件参数已失效，请检查。`;
+                            msg = msg.replace('ControlName', controlName);
                             FMessageBoxService.warning(msg, '');
                             return false;
                         }
diff --git a/packages/designer/src/components/types/toolbox/pc-rtc-toolbox.json b/packages/designer/src/components/types/toolbox/pc-rtc-toolbox.json
index 1a4128db789..2a5084fb695 100644
--- a/packages/designer/src/components/types/toolbox/pc-rtc-toolbox.json
+++ b/packages/designer/src/components/types/toolbox/pc-rtc-toolbox.json
@@ -122,12 +122,6 @@
                 "type": "content-container",
                 "name": "容器",
                 "category": "container"
-            },
-            {
-                "id": "ExternalContainer",
-                "type": "external-container",
-                "name": "外部容器",
-                "category": "container"
             }
         ]
     },
diff --git a/packages/ui-vue/components/events-editor/src/components/command-source/command-source.component.tsx b/packages/ui-vue/components/events-editor/src/components/command-source/command-source.component.tsx
index d1cc8ab2fa7..5c55649b082 100644
--- a/packages/ui-vue/components/events-editor/src/components/command-source/command-source.component.tsx
+++ b/packages/ui-vue/components/events-editor/src/components/command-source/command-source.component.tsx
@@ -179,15 +179,14 @@ export default defineComponent({
                         <div class="f-icon f-icon-panel-retraction" style={actionButtonStyle.value}></div>
                         <div class="f-function-class" onClick={() => openMetadataSelector()}>引入控制器</div>
                     </div>
-                    { useFormSchema.designerMode !== 'PC_RTC' &&
-                        <div class="f-page-internals-new-command-func2">
-                            <div class="f-icon f-icon-new-edit" style={actionButtonStyle.value}></div>
-                            <div class="f-function-class" onClick={() => generateNewFunc()}>添加新方法</div>
-                        </div>}
-                    {/* {props.haveBoundCommand && <div class="f-page-internals-new-command-func3">
+                    <div class="f-page-internals-new-command-func2">
+                        <div class="f-icon f-icon-new-edit" style={actionButtonStyle.value}></div>
+                        <div class="f-function-class" onClick={() => generateNewFunc()}>添加新方法</div>
+                    </div>
+                    {props.haveBoundCommand && <div class="f-page-internals-new-command-func3">
                         <div class="f-icon f-icon-licensed" style={actionButtonStyle.value}></div>
                         <div class="f-function-class" onClick={() => showBoundEvents()}>已有方法</div>
-                    </div>} */}
+                    </div>}
                     {shoulShowCommunication.value && <div class="f-page-internals-new-command-func2">
                         <div class="fd-i-Family fd_pc-extend-setting" style={actionButtonStyle.value}></div>
                         <div class="f-function-class" onClick={() => openFormCommunicationPanel()}>添加组件通讯事件</div>
diff --git a/packages/ui-vue/components/schema-selector/src/components/card-view.component.tsx b/packages/ui-vue/components/schema-selector/src/components/card-view.component.tsx
index 070e165d858..506799e0bf2 100644
--- a/packages/ui-vue/components/schema-selector/src/components/card-view.component.tsx
+++ b/packages/ui-vue/components/schema-selector/src/components/card-view.component.tsx
@@ -37,7 +37,7 @@ export default defineComponent({
             searchResult.value = resultItems;
             updateListViewDataScource(searchResult.value);
 
-            showPagination.value = !newValue;
+            // showPagination.value = !newValue;
         });
         function renderListViewContent({ item, index, selectedItem }) {
             return (
-- 
Gitee


From f9bf99e6fffa1a517abf2c7c85f87fcd5e41a451 Mon Sep 17 00:00:00 2001
From: wang-xh <wang-xh@inspur.com>
Date: Thu, 24 Jul 2025 17:00:16 +0800
Subject: [PATCH 2/9] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E7=BB=84=E5=90=88?=
 =?UTF-8?q?=E8=A1=A8=E5=8D=95=E9=80=9A=E8=AE=AF=E9=85=8D=E7=BD=AE=E9=97=AE?=
 =?UTF-8?q?=E9=A2=98=EF=BC=9B=E4=BF=AE=E6=94=B9=E8=BE=93=E5=85=A5=E6=8E=A7?=
 =?UTF-8?q?=E4=BB=B6=E7=A9=BA=E7=BB=91=E5=AE=9A=E7=9A=84=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../composition/use-update-controls.ts        |  15 +--
 .../components/code-view.component.tsx        |  12 +--
 .../composition/handler/frm-cmp-builder.ts    |  92 +++++++++++-----
 .../composition/command.service.tsx           |  15 ++-
 .../composition/events-editor-utils.ts        |   6 +-
 .../composition/use-form-validation.ts        |  24 ++---
 .../composition/use-parameter-editor-data.ts  |  23 ++--
 .../src/composition/use-field-selection.ts    |  17 ++-
 .../checkbox.property-config.ts               |  33 +++++-
 .../split-form-component.component.tsx        |   9 +-
 .../data-grid-column.property-config.ts       |   2 +-
 .../src/schema/data-grid-column.schema.json   |   5 +-
 .../src/schema/data-grid.schema.json          |   5 +-
 .../date-picker.property-config.ts            |  30 +++++-
 .../designer/form-group-use-designer-rules.ts |   4 +-
 .../combine-form/combine-form.component.tsx   |   4 +-
 .../components/combine-form/combine-form.scss |  29 ++++-
 .../combine-form/select-command.component.tsx |  25 +++--
 .../select-parameter.component.tsx            |  35 +++---
 .../select-source-control.component.tsx       |   8 +-
 .../select-target-form.component.tsx          |   6 +-
 .../command-source.component.tsx              |  17 +--
 .../command-source/command-source.css         | 100 ++++++++++--------
 .../external-container.design.component.tsx   |   2 +-
 .../import-external-schema.component.tsx      |  12 ++-
 .../src/designer/import-external-schema.css   |   3 +-
 .../external-container.property-config.ts     |  55 ++++++++--
 .../response-layout-item-designer-rules.ts    |   6 +-
 .../src/components/card-view.component.tsx    |  11 +-
 .../src/components/list-view.component.tsx    |   8 +-
 .../src/schema-selector-editor.component.tsx  |   2 +-
 .../src/schema-selector.component.tsx         |  22 +++-
 .../schema-selector/src/schema-selector.css   |   1 -
 .../property-config/switch.property-config.ts |  49 +++++++--
 34 files changed, 478 insertions(+), 209 deletions(-)

diff --git a/packages/designer/src/components/components/change-set/composition/use-update-controls.ts b/packages/designer/src/components/components/change-set/composition/use-update-controls.ts
index 66901031eb1..cd5b36390a7 100644
--- a/packages/designer/src/components/components/change-set/composition/use-update-controls.ts
+++ b/packages/designer/src/components/components/change-set/composition/use-update-controls.ts
@@ -376,14 +376,17 @@ export function useUpdateControls(
                 const fieldTypeName = updateChanges.find(c => c.propPath === 'type.name');
                 if (fieldTypeName) {
                     control.editor.showTime = fieldTypeName.newValue === 'DateTime';
-                    if (!control.editor.showTime) {
-                        control.editor.displayFormat = 'yyyy-MM-dd';
-                        if (control.formatter?.dateFormat) {
-                            control.formatter.dateFormat = 'yyyy-MM-dd';
-                        }
+                    const formatValue = control.editor.showTime ? 'yyyy-MM-dd HH:mm:ss' : 'yyyy-MM-dd';
+
+                    control.editor.displayFormat = formatValue;
+                    if (control.formatter?.dateFormat) {
+                        control.formatter.dateFormat = formatValue;
+                    }
+                    if (control.editor.showTime) {
+                        control.editor.valueFormat = formatValue;
+                    } else {
                         delete control.editor.valueFormat;
                     }
-
                 }
             }
 
diff --git a/packages/designer/src/components/components/code-view/components/code-view.component.tsx b/packages/designer/src/components/components/code-view/components/code-view.component.tsx
index 7c641069eae..75315e983de 100644
--- a/packages/designer/src/components/components/code-view/components/code-view.component.tsx
+++ b/packages/designer/src/components/components/code-view/components/code-view.component.tsx
@@ -16,7 +16,7 @@
 import { computed, defineComponent, inject, onMounted, onUnmounted, provide, ref, SetupContext, watch } from 'vue';
 import { codeViewProps, CodeViewProps } from '../props/code-view.props';
 import FNavTreeDesign from './nav-tree.component';
-import { FSplitter, FSplitterPane, FNotifyService, FLoadingService } from '@farris/ui-vue/components';
+import { FSplitter, FSplitterPane, FLoadingService } from '@farris/ui-vue/components';
 import './code-view.scss';
 import FDesignCodeTabs from './code-tabs.component';
 import { EditorController } from '../composition/handler/editor.controller';
@@ -33,7 +33,7 @@ export default defineComponent({
     props: codeViewProps,
     emits: ['changeView', 'saveAll'] as (string[] & ThisType<void>) | undefined,
     setup(props: CodeViewProps, context: SetupContext) {
-        const notifyService: any = new FNotifyService();
+        const messagerService: any = inject('FMessageBoxService');
         const loadingService: any = inject<FLoadingService>('FLoadingService');
         const formBasicInfo = ref(props.formBasicInfo);
         const frmCmpBuilder = new FrmCmpBuilder(formBasicInfo.value);
@@ -167,7 +167,7 @@ export default defineComponent({
         function openAndGoTo(data: any) {
             // console.log('打开并跳转', data, fileTreeInstance.value.controllers());
             const { command, controller } = data;
-            if (controller) { 
+            if (controller) {
                 const controllerFileName = controller.label + '.ts';
                 const controllerFiles = flattenTreeData(fileTreeInstance.value.controllers() || []);
 
@@ -179,7 +179,7 @@ export default defineComponent({
                     editorController.openFile(controllFile);
                     filePath.value = controllFile.path;
 
-                    editorController.sendNotification(controllFile.path, {eventName: 'GotoMethod', eventPayload: { methodCode: command.handlerName, methodName: command.name  } });
+                    editorController.sendNotification(controllFile.path, { eventName: 'GotoMethod', eventPayload: { methodCode: command.handlerName, methodName: command.name } });
                 }
             }
         }
@@ -233,10 +233,10 @@ export default defineComponent({
                     return;  // 用户点击取消
                 }
                 if (result.hasError) {
-                    notifyService.error(result && result.errorTip || '构件创建失败，请刷新后重试');
+                    messagerService.error(result && result.errorTip || '构件创建失败，请刷新后重试');
                 } else {
                     // 打开文件
-                    editorController.openFile(result);
+                    editorController.openFile({ path: result.tsFilePath, webCommandId: result.webCommandId, webComponentId: result.webComponentId });
                 }
                 if (result.hasNewFile) {
                     fileTreeInstance.value.reloadTreeData(result.tsFilePath);
diff --git a/packages/designer/src/components/components/code-view/composition/handler/frm-cmp-builder.ts b/packages/designer/src/components/components/code-view/composition/handler/frm-cmp-builder.ts
index a3bdc7abae7..ce7dee7e067 100644
--- a/packages/designer/src/components/components/code-view/composition/handler/frm-cmp-builder.ts
+++ b/packages/designer/src/components/components/code-view/composition/handler/frm-cmp-builder.ts
@@ -20,6 +20,10 @@ export interface CmpBuildResult {
   hasError?: boolean;
   /** 错误提示信息 */
   errorTip?: string;
+  /** web构件id,用于运行时定制场景 */
+  webComponentId?: string;
+  /** 命令构件id,用于运行时定制场景 */
+  webCommandId?: string;
 }
 /** 构件元数据基本信息 */
 interface CmpBuildInfo {
@@ -231,33 +235,53 @@ export class FrmCmpBuilder {
     buildInfo.tsFilePathName = '/' + buildInfo.relativePath + '/' + buildInfo.code + '.ts';
     const webCmpFileName = buildInfo.code + '.webcmp';
     const webCmdFileName = buildInfo.code + '.webcmd';
-    let webCmp;
-    let webCmd;
-    this.metadataService.queryRelatedComponentMetadata(this.formBasicInfo.rtcId).then(data => {
-      webCmp = data.find(metadata => metadata.fileName === webCmpFileName);
-      webCmd = data.find(metadata => metadata.fileName === webCmdFileName);
 
-    });
-    if (webCmp && webCmd) {
-      return { tsFilePath: buildInfo.tsFilePathName, hasNewFile: false };
-    }
-    const createWebCmpError = !webCmp && (await this.createRtcWebCmp(buildInfo, webCmpFileName));
-    if (createWebCmpError) {
-      return {
-        hasError: true,
-        errorTip: createWebCmpError,
-        tsFilePath: '', hasNewFile: true
-      };
+    const componentData = await this.metadataService.queryRelatedComponentMetadata(this.formBasicInfo.rtcId);
+
+    const webCmp = componentData?.find(metadata => metadata.fileName === webCmpFileName);
+    const webCmd = componentData?.find(metadata => metadata.fileName === webCmdFileName);
+
+    let webComponentId = webCmp ? webCmp.id : '';
+    let webCommandId = webCmd ? webCmd.id : '';
+    let hasNewFile = false;
+
+    // 创建web构件
+    if (!webCmp) {
+      const result: any = await this.createRtcWebCmp(buildInfo, webCmpFileName);
+      if (result?.error) {
+        return {
+          hasError: true,
+          errorTip: result.error,
+          tsFilePath: '',
+          hasNewFile: true
+        };
+      } else {
+        webComponentId = result.metadataId;
+        hasNewFile = true;
+      }
     }
-    const createWebCmdError = !webCmd && (await this.createRtcWebCmd(buildInfo, webCmdFileName));
-    if (createWebCmdError) {
-      return {
-        hasError: true,
-        errorTip: createWebCmdError,
-        tsFilePath: '', hasNewFile: true
-      };
+    // 创建命令构件
+    if (!webCmd) {
+      const result: any = await this.createRtcWebCmd(buildInfo, webCmdFileName);
+      if (result?.error) {
+        return {
+          hasError: true,
+          errorTip: result.error,
+          tsFilePath: '',
+          hasNewFile: true
+        };
+      } else {
+        webCommandId = result.metadataId;
+        hasNewFile = true;
+      }
     }
-    return { tsFilePath: buildInfo.tsFilePathName, hasNewFile: true };
+
+    return {
+      tsFilePath: buildInfo.tsFilePathName,
+      hasNewFile,
+      webCommandId,
+      webComponentId
+    };
   }
   /**
    * 运行时定制：新增WebComponent构件
@@ -267,15 +291,21 @@ export class FrmCmpBuilder {
       '', buildInfo.namespace, buildInfo.code, buildInfo.name, fileName, 'WebComponent',
       buildInfo.bizObjId, buildInfo.relativePath, JSON.stringify(buildInfo.extendProperty), '', false, this.formBasicInfo.nameLanguage
     );
+    const errorMessage = '构件元数据文件创建失败，请刷新后重试';
+    let metadataId = '';
 
-    // 不存在web构件，先创建web构件
     return this.metadataService.initializeRtcMetadataEntity(metadatadto, this.formBasicInfo.rtcId || '').then((data) => {
       data.fileName = metadatadto.fileName;
+      metadataId = data.id;
       return this.metadataService.createRtcMetadata(data);
     }).then(result => {
       if (!result || !result.ok) {
-        return '构件元数据文件创建失败，请刷新后重试';
+        return { error: errorMessage };
+      } else {
+        return { metadataId };
       }
+    }).catch(error => {
+      return { error: error?.response?.data?.Message || errorMessage };
     });
 
   }
@@ -287,15 +317,21 @@ export class FrmCmpBuilder {
       '', buildInfo.namespace, buildInfo.code, buildInfo.name, fileName, 'WebCommand',
       buildInfo.bizObjId, buildInfo.relativePath, JSON.stringify(buildInfo.extendProperty), '', false, this.formBasicInfo.nameLanguage
     );
+    const errorMessage = '构件元数据文件创建失败，请刷新后重试';
 
-    // 不存在web构件，先创建web构件
+    let metadataId = '';
     return this.metadataService.initializeRtcMetadataEntity(metadatadto, this.formBasicInfo.rtcId || '').then((data) => {
       data.fileName = metadatadto.fileName;
+      metadataId = data.id;
       return this.metadataService.createRtcMetadata(data);
     }).then(result => {
       if (!result || !result.ok) {
-        return '构件元数据文件创建失败，请刷新后重试';
+        return { error: errorMessage };
+      } else {
+        return { metadataId };
       }
+    }).catch(error => {
+      return { error: error?.response?.data?.Message || errorMessage };
     });
 
   }
diff --git a/packages/designer/src/components/composition/command.service.tsx b/packages/designer/src/components/composition/command.service.tsx
index 32a08a88a82..4fa5dc66715 100644
--- a/packages/designer/src/components/composition/command.service.tsx
+++ b/packages/designer/src/components/composition/command.service.tsx
@@ -76,6 +76,7 @@ export function useFormCommandService(formSchemaService: UseFormSchema, useFormS
         assembleSchemaFieldsByComponent,
         assembleStateVariables,
         assembleSchemaFieldsUnderBoundEntity,
+        getViewModelName
     } = useParameterEditorData(formSchemaService);
     function getCommands() {
         return commands;
@@ -93,7 +94,7 @@ export function useFormCommandService(formSchemaService: UseFormSchema, useFormS
                 loadingInstance.value?.close();
                 resolve([]);
             }).catch((error) => {
-                messageService.warning(error);
+                messageService.warning(error?.response?.data?.Message || '加载控制器失败');
                 loadingInstance.value?.close();
                 reject(error);
             });
@@ -139,7 +140,7 @@ export function useFormCommandService(formSchemaService: UseFormSchema, useFormS
                 });
                 axios.all(requestCommandsMetadata).then(axios.spread((...metadataList) => {
                     // !!item进行转化
-                    const metadataContentList = metadataList.filter(item => item !== undefined && item !== null).map(item => {
+                    const metadataContentList = metadataList.filter(item => !!item).map(item => {
                         const content = new CommandMetadataConvertor().InitFromJobject(JSON.parse(item['content']));
                         const supportedCommands = item.nameSpace.includes('.Front') ? content.Commands : filterSupportedCommand(content);
                         content.Commands = supportedCommands;
@@ -151,7 +152,9 @@ export function useFormCommandService(formSchemaService: UseFormSchema, useFormS
                     reject(error);
 
                 });
-            });
+            }).catch((error) => {
+                reject(error);
+            });;
         });
     }
     /**
@@ -435,7 +438,8 @@ export function useFormCommandService(formSchemaService: UseFormSchema, useFormS
                 });
             }
 
-            const controlEventPropertyIDList = schemaMap[componentsItem.type]?.events;
+            const componentType = componentsItem.type === 'form-group' && componentsItem.editor ? componentsItem.editor.type : componentsItem.type;
+            const controlEventPropertyIDList = schemaMap[componentType]?.events;
             if (controlEventPropertyIDList) {
                 const eventKeys = Object.keys(controlEventPropertyIDList);
                 for (let i = 0; i < eventKeys.length; i++) {
@@ -1285,7 +1289,8 @@ export function useFormCommandService(formSchemaService: UseFormSchema, useFormS
             assembleSchemaFieldsByComponent,
             assembleStateVariables,
             assembleSchemaFieldsUnderBoundEntity,
-            getEventParameterData
+            getEventParameterData,
+            getViewModelName
         };
     }
 
diff --git a/packages/designer/src/components/composition/events-editor-utils.ts b/packages/designer/src/components/composition/events-editor-utils.ts
index a05730086b7..67a866b13b0 100644
--- a/packages/designer/src/components/composition/events-editor-utils.ts
+++ b/packages/designer/src/components/composition/events-editor-utils.ts
@@ -62,9 +62,9 @@ export function useEventsEditorUtils(commandService: UseFormCommandService, form
         };
 
         // 画布选中外部容器
-        if (propertyData.type === 'external-container' && propertyData.externalComponent) {
-            communication.formId = propertyData.externalComponent.id;
-            communication.formCode = propertyData.externalComponent.code;
+        if (propertyData.type === 'external-container') {
+            communication.formId = propertyData.externalComponent?.id;
+            communication.formCode = propertyData.externalComponent?.code;
             communication.externalContainerId = propertyData.id;
         } else {
             // 画布选中当前表单的控件
diff --git a/packages/designer/src/components/composition/use-form-validation.ts b/packages/designer/src/components/composition/use-form-validation.ts
index cb1f12cad5d..edeeb22b997 100644
--- a/packages/designer/src/components/composition/use-form-validation.ts
+++ b/packages/designer/src/components/composition/use-form-validation.ts
@@ -105,7 +105,7 @@ export function useFormValidation(useFormSchema: UseFormSchema, formCommandServi
         // 当前表单id
         const currentFormId = useFormSchema.getFormMetadataBasicInfo().id;
         // 当前引入的所有子表单
-        const {externalFormSchema} = useFormSchema;
+        const { externalFormSchema } = useFormSchema;
 
         // 目标表单元数据
         const targetForm = currentFormId === target.formId ? useFormSchema.getFormSchema() : externalFormSchema.get(target.externalContainerId)?.content;
@@ -113,7 +113,7 @@ export function useFormValidation(useFormSchema: UseFormSchema, formCommandServi
             return false;
         }
         // 检查目标表单的命令是否存在
-        const isCommandExisted = checkStateExisted(targetForm, target.commandViewmodelId, paramMapping.targetVariable);
+        const isCommandExisted = checkStateExisted(targetForm, paramMapping.targetVariableViewModelId, paramMapping.targetVariable);
         if (!isCommandExisted) {
             return false;
         }
@@ -134,8 +134,8 @@ export function useFormValidation(useFormSchema: UseFormSchema, formCommandServi
             for (const communicationId of communicationIds) {
                 const communication = communications.find(item => item.id === communicationId);
                 if (!communication) {
-                    let msg = `【ControlName】的【EventName】绑定的通讯已被移除，请重新选择。`;
-                    msg = msg.replace('ControlName', controlName).replace('EventName', boundEvent.eventName);
+                    let msg = `【ControlName(ControlId)】的【EventName】绑定的通讯已被移除，请重新选择。`;
+                    msg = msg.replace('ControlName', controlName).replace('EventName', boundEvent.eventName).replace('ControlId', boundEvent.id);
                     FMessageBoxService.warning(msg, '');
                     return false;
                 }
@@ -144,15 +144,15 @@ export function useFormValidation(useFormSchema: UseFormSchema, formCommandServi
                 const isSourceComplete = source && source.formId && source.componentId && source.event;
                 const isTargetComplete = target && target.formId && target.commandCode;
                 if (!isSourceComplete || !isTargetComplete) {
-                    let msg = `【ControlName】配置的组件通讯事件不完整，请检查。`;
-                    msg = msg.replace('ControlName', controlName);
+                    let msg = `【ControlName(ControlId)】配置的组件通讯不完整，请检查。`;
+                    msg = msg.replace('ControlName', controlName).replace('ControlId', boundEvent.id);;
                     FMessageBoxService.warning(msg, '');
                     return false;
                 }
                 // 检查通讯内的事件、名称等是否有效
                 if (!checkCommunicationSource(source) || !checkCommunicationTarget(target)) {
-                    let msg = `【ControlName】配置的组件通讯事件已失效，请检查。`;
-                    msg = msg.replace('ControlName', controlName);
+                    let msg = `【ControlName(ControlId)】配置的组件通讯已失效，请检查。`;
+                    msg = msg.replace('ControlName', controlName).replace('ControlId', boundEvent.id);;
                     FMessageBoxService.warning(msg, '');
                     return false;
                 }
@@ -162,15 +162,15 @@ export function useFormValidation(useFormSchema: UseFormSchema, formCommandServi
                     for (const paramMapping of paramMappings) {
                         const isParamValid = paramMapping.sourceValue && paramMapping.targetVariable;
                         if (!isParamValid) {
-                            let msg = `【ControlName】配置的组件通讯事件参数不完整，请检查。`;
-                            msg = msg.replace('ControlName', controlName);
+                            let msg = `【ControlName(ControlId)】配置的组件通讯参数不完整，请检查。`;
+                            msg = msg.replace('ControlName', controlName).replace('ControlId', boundEvent.id);;
                             FMessageBoxService.warning(msg, '');
                             return false;
                         }
                         // 检查参是否数失效
                         if (!checkCommunicationTargetState(target, paramMapping)) {
-                            let msg = `【ControlName】配置的组件通讯事件参数已失效，请检查。`;
-                            msg = msg.replace('ControlName', controlName);
+                            let msg = `【ControlName(ControlId)】配置的组件通讯参数已失效，请检查。`;
+                            msg = msg.replace('ControlName', controlName).replace('ControlId', boundEvent.id);;
                             FMessageBoxService.warning(msg, '');
                             return false;
                         }
diff --git a/packages/designer/src/components/composition/use-parameter-editor-data.ts b/packages/designer/src/components/composition/use-parameter-editor-data.ts
index f19f19e3b7d..fbfc76e5ffb 100644
--- a/packages/designer/src/components/composition/use-parameter-editor-data.ts
+++ b/packages/designer/src/components/composition/use-parameter-editor-data.ts
@@ -64,12 +64,9 @@ export function useParameterEditorData(useFormSchemaComposition: UseFormSchema)
 
         return '表格组件';
     }
-    function getViewModelName(viewModelId: string, componentName: string) {
-        const component = useFormSchemaComposition.getComponentByViewModelId(viewModelId);
-        if (!component || component.fakeDel) {
-            return;
-        }
-        switch (component.componentType) {
+    function getViewModelName(component: any, componentName: string) {
+
+        switch (component?.componentType) {
             case ComponentType.Frame: {
                 return '根组件';
             }
@@ -208,9 +205,10 @@ export function useParameterEditorData(useFormSchemaComposition: UseFormSchema)
         allComponents.forEach((cmp: FormComponent) => {
             const viewModelId = cmp.viewModel;
             let name: any = null;
-            const viewModel = useFormSchemaComposition.getViewModelById(viewModelId);
-            if (viewModel) {
-                name = getViewModelName(viewModelId, viewModel.name);
+            const viewModel = formSchema.module.viewmodels.find(item => item.id === viewModelId);
+            const component = formSchema.module.components.find(item => item.viewModel === viewModelId);
+            if (viewModel && component) {
+                name = getViewModelName(component, viewModel.name);
             }
             const cmpTreeData: ComponentTreeNode = {
                 data: cmp,
@@ -259,8 +257,10 @@ export function useParameterEditorData(useFormSchemaComposition: UseFormSchema)
             if (!viewModel || !viewModel.states || !viewModel.states.length) {
                 return;
             }
+            const component = formSchema.module.components.find(item => item.viewModel === viewModel.id);
+            const viewModelName = getViewModelName(component, viewModel.name);
             const vmNode: ViewModelTreeNode = {
-                data: { id: viewModel.id, code: viewModel.code, name: viewModel.name + '视图模型', statePath: viewModel.id },
+                data: { id: viewModel.id, code: viewModel.code, name: viewModelName || viewModel.name, statePath: viewModel.id },
                 id: viewModel.id,
                 code: viewModel.code || viewModel.id,
                 children: [] as ViewModelTreeNode[],
@@ -268,7 +268,7 @@ export function useParameterEditorData(useFormSchemaComposition: UseFormSchema)
                 expanded: true
             };
             data.push(vmNode);
-            const componentId = useFormSchemaComposition.getComponentByViewModelId(viewModel.id)?.id;
+            const componentId = formSchema.module.components.find(item => item.viewModel === viewModel.id)?.id;
             viewModel.states.forEach(state => {
                 vmNode.children.push({
                     data: { ...state, statePath: `/${componentId}/${state.code}` },
@@ -301,5 +301,6 @@ export function useParameterEditorData(useFormSchemaComposition: UseFormSchema)
         assembleSchemaFieldsByComponent,
         assembleStateVariables,
         assembleSchemaFieldsUnderBoundEntity,
+        getViewModelName
     };
 }
diff --git a/packages/ui-vue/components/binding-selector/src/composition/use-field-selection.ts b/packages/ui-vue/components/binding-selector/src/composition/use-field-selection.ts
index dd059b51e06..1542f7627a3 100644
--- a/packages/ui-vue/components/binding-selector/src/composition/use-field-selection.ts
+++ b/packages/ui-vue/components/binding-selector/src/composition/use-field-selection.ts
@@ -2,7 +2,7 @@ import { FNotifyService } from "../../../notify";
 import { FormBindingType, SchemaDOMMapping } from "@farris/ui-vue/components/property-panel";
 import { merge } from "lodash-es";
 import { BindingSelectorProps } from "../binding-selector.props";
-import { FormSchemaEntityField$Type } from "@farris/ui-vue/components/common";
+import { FormSchemaEntityField$Type, FormSchemaEntityFieldTypeName } from "@farris/ui-vue/components/common";
 
 export function useFieldSelection(props: BindingSelectorProps) {
 
@@ -55,6 +55,7 @@ export function useFieldSelection(props: BindingSelectorProps) {
     function updataViewModelField(bindingData: Record<string, any>) {
         const currentSelectedField = merge({}, bindingData.rawData, { groupId: null, groupName: null });
         const originalBinding = props.editorParams.componentSchema?.binding;
+        const originalLabel = props.editorParams.componentSchema?.label;
         const dgViewModel = designViewModelUtils.getDgViewModel(viewModelId);
 
         // 删除原始绑定信息
@@ -71,6 +72,9 @@ export function useFieldSelection(props: BindingSelectorProps) {
         if (props.editorParams.componentSchema?.editor?.type) {
             dgViewModel.changeField(currentSelectedField.id, { editor: currentSelectedField.editor });
         }
+        if (originalLabel) {
+            dgViewModel.changeField(currentSelectedField.id, { name: originalLabel });
+        }
     }
 
     function updataViewModelVariable(bindingData: Record<string, any>) {
@@ -155,6 +159,15 @@ export function useFieldSelection(props: BindingSelectorProps) {
         }
     }
 
+    /**
+     * 同步控件的最大长度属性(场景：控件从空绑定至绑定字段后，需要带出字段的长度属性)
+     */
+    function updateComponentMaxLength(bindingData: any) {
+        const hasMaxLength = [FormSchemaEntityFieldTypeName.Number, FormSchemaEntityFieldTypeName.String, FormSchemaEntityFieldTypeName.Text].includes(bindingData.type.name) && bindingData.type?.length;
+        if (hasMaxLength && props.editorParams.componentSchema.editor && !Object.prototype.hasOwnProperty.call(props.editorParams.componentSchema.editor, 'maxLength')) {
+            props.editorParams.componentSchema.editor.maxLength = bindingData.type.length;
+        }
+    }
     /**
      * 更新控件schema数据
      */
@@ -190,6 +203,8 @@ export function useFieldSelection(props: BindingSelectorProps) {
         props.editorParams.componentSchema.binding.type = bindingType;
         props.editorParams.componentSchema.path = bindingData.bindingPath;
 
+        updateComponentMaxLength(bindingData);
+
         return props.editorParams.componentSchema.binding;
     }
 
diff --git a/packages/ui-vue/components/checkbox/src/property-config/checkbox.property-config.ts b/packages/ui-vue/components/checkbox/src/property-config/checkbox.property-config.ts
index e602d02248e..c766bd084a2 100644
--- a/packages/ui-vue/components/checkbox/src/property-config/checkbox.property-config.ts
+++ b/packages/ui-vue/components/checkbox/src/property-config/checkbox.property-config.ts
@@ -1,4 +1,5 @@
-import { InputBaseProperty } from "@farris/ui-vue/components/property-panel";
+import { FormSchemaEntityFieldTypeName } from "@farris/ui-vue/components/common";
+import { FormPropertyChangeObject, InputBaseProperty } from "@farris/ui-vue/components/property-panel";
 
 export class CheckBoxProperty extends InputBaseProperty {
 
@@ -44,4 +45,34 @@ export class CheckBoxProperty extends InputBaseProperty {
             // }
         });
     }
+    /**
+     * 切换绑定属性 
+     */
+     public changeBindingField(propertyData: any, changeObject: FormPropertyChangeObject, parameters?: any): any {
+        super.changeBindingField(propertyData, changeObject);
+
+
+        // 同步trueValue和falseValue属性值(场景：控件从空绑定至绑定日期时间类型字段)
+        const newBindingField = parameters;
+        if (propertyData.editor && newBindingField?.type?.name) {
+            let defaultTrueValue;
+            let defaultFalseValue;
+            if (newBindingField.type.name === FormSchemaEntityFieldTypeName.String) {
+                defaultTrueValue = 'true';
+                defaultFalseValue = 'false';
+            }
+            if (newBindingField.type.name === FormSchemaEntityFieldTypeName.Number) {
+                defaultTrueValue = 1;
+                defaultFalseValue = 0;
+            }
+            if (!Object.prototype.hasOwnProperty.call(propertyData.editor, 'trueValue') && defaultTrueValue !== undefined) {
+                propertyData.editor.trueValue = defaultTrueValue;
+            }
+            if (!Object.prototype.hasOwnProperty.call(propertyData.editor, 'falseValue') && defaultFalseValue !== undefined) {
+                propertyData.editor.falseValue = defaultFalseValue;
+            }
+
+        }
+
+    }
 }
diff --git a/packages/ui-vue/components/component/src/components/split-form-component.component.tsx b/packages/ui-vue/components/component/src/components/split-form-component.component.tsx
index d483614b5fe..ee544ae2155 100644
--- a/packages/ui-vue/components/component/src/components/split-form-component.component.tsx
+++ b/packages/ui-vue/components/component/src/components/split-form-component.component.tsx
@@ -68,6 +68,12 @@ export default defineComponent({
                 {!nodeData.isRemoved && !nodeData.isBindVariable && !nodeData.isComplexField ? <span>{nodeData.bindingField} </span> : ''}
             </>;
         }
+        function renderNameCell(row: any) {
+            const controlData = row.raw?.control;
+            return <>
+                {controlData.label ? <span>{controlData.label} </span> : <span>{controlData.id} </span>}
+            </>;
+        }
         return () => {
             return (
                 <div class="h-100 d-flex flex-column flex-fill">
@@ -105,8 +111,7 @@ export default defineComponent({
                                 hierarchy={hierarchyOption}>
                                 {{
                                     'cellTemplate': ({ cell, row }) => {
-                                        return cell.field === 'bindingPath' ? renderBindingPathCell(cell, row) :
-                                            (cell.data != null ? cell.data.toString() : cell.data);
+                                        return cell.field === 'bindingPath' ? renderBindingPathCell(cell, row) :renderNameCell(row);
                                     }
                                 }}
                             </FTreeGrid>
diff --git a/packages/ui-vue/components/data-grid/src/property-config/data-grid-column.property-config.ts b/packages/ui-vue/components/data-grid/src/property-config/data-grid-column.property-config.ts
index 2fd1322dfff..17fe2829c0a 100644
--- a/packages/ui-vue/components/data-grid/src/property-config/data-grid-column.property-config.ts
+++ b/packages/ui-vue/components/data-grid/src/property-config/data-grid-column.property-config.ts
@@ -158,7 +158,7 @@ export class DataGriColumnProperty extends BaseControlProperty {
                 // 联动修改排序开关
                 propertyData.remoteSort = propertyData.columnSorted ? true : false;
 
-                if (propertyData.onClickLinkCommand) {
+                if (propertyData.onClickLinkCommand && !propertyData.onClickLinkCommand.includes('communication:')) {
                     // 同步超链接模板
                     // 替换自定义模板
                     propertyData.columnTemplate = `<span class="f-pretend-link f-cursor-pointer" 
diff --git a/packages/ui-vue/components/data-grid/src/schema/data-grid-column.schema.json b/packages/ui-vue/components/data-grid/src/schema/data-grid-column.schema.json
index eaa981de50f..5711c9e8e88 100644
--- a/packages/ui-vue/components/data-grid/src/schema/data-grid-column.schema.json
+++ b/packages/ui-vue/components/data-grid/src/schema/data-grid-column.schema.json
@@ -173,5 +173,8 @@
     "required": [
         "id",
         "type"
-    ]
+    ],
+    "events": {
+        "onClickLinkCommand": "超链接事件"
+    }
 }
\ No newline at end of file
diff --git a/packages/ui-vue/components/data-grid/src/schema/data-grid.schema.json b/packages/ui-vue/components/data-grid/src/schema/data-grid.schema.json
index 17ed07b5bd1..f76f755d4b7 100644
--- a/packages/ui-vue/components/data-grid/src/schema/data-grid.schema.json
+++ b/packages/ui-vue/components/data-grid/src/schema/data-grid.schema.json
@@ -814,6 +814,9 @@
         "onClickRow": "行点击事件",
         "onSelectionChange": "行切换事件",
         "onPageIndexChanged": "切换页码事件",
-        "onPageSizeChanged": "分页条数变化事件"
+        "onPageSizeChanged": "分页条数变化事件",
+        "onDoubleClickRow": "行双击事件",
+        "onClickEditCommand": "操作列编辑事件",
+        "onClickDeleteCommand": "操作列删除事件"
     }
 }
\ No newline at end of file
diff --git a/packages/ui-vue/components/date-picker/src/property-config/date-picker.property-config.ts b/packages/ui-vue/components/date-picker/src/property-config/date-picker.property-config.ts
index 768d225f260..db478266949 100644
--- a/packages/ui-vue/components/date-picker/src/property-config/date-picker.property-config.ts
+++ b/packages/ui-vue/components/date-picker/src/property-config/date-picker.property-config.ts
@@ -1,4 +1,5 @@
-import { InputBaseProperty } from "@farris/ui-vue/components/property-panel";
+import { FormSchemaEntityFieldTypeName } from "@farris/ui-vue/components/common";
+import { FormPropertyChangeObject, InputBaseProperty } from "@farris/ui-vue/components/property-panel";
 import { DATE_FORMATS } from "./date-format";
 
 export class DatePickerProperty extends InputBaseProperty {
@@ -122,4 +123,31 @@ export class DatePickerProperty extends InputBaseProperty {
             { id: 'yyyy', name: 'yyyy' }
         ];
     }
+    /**
+     * 切换绑定属性 
+     */
+    public changeBindingField(propertyData: any, changeObject: FormPropertyChangeObject, parameters?: any): any {
+        super.changeBindingField(propertyData, changeObject);
+
+
+        const newBindingField = parameters;
+        if (propertyData.editor && newBindingField?.type?.name) {
+            // 同步字段类型
+            propertyData.editor.fieldType = newBindingField.type.name;
+
+            // 同步日期时间相关属性(场景：控件从空绑定至绑定日期时间类型字段)
+            if (newBindingField.type.name === FormSchemaEntityFieldTypeName.DateTime) {
+                if (!Object.prototype.hasOwnProperty.call(propertyData.editor, 'showTime')) {
+                    propertyData.editor.showTime = true;
+                }
+                if (!Object.prototype.hasOwnProperty.call(propertyData.editor, 'displayFormat')) {
+                    propertyData.editor.displayFormat = 'yyyy-MM-dd HH:mm:ss';
+                }
+                if (!Object.prototype.hasOwnProperty.call(propertyData.editor, 'valueFormat')) {
+                    propertyData.editor.valueFormat = 'yyyy-MM-dd HH:mm:ss';
+                }
+            }
+        }
+
+    }
 }
diff --git a/packages/ui-vue/components/dynamic-form/src/designer/form-group-use-designer-rules.ts b/packages/ui-vue/components/dynamic-form/src/designer/form-group-use-designer-rules.ts
index 2c62ce2f9b1..4ede0980ce1 100644
--- a/packages/ui-vue/components/dynamic-form/src/designer/form-group-use-designer-rules.ts
+++ b/packages/ui-vue/components/dynamic-form/src/designer/form-group-use-designer-rules.ts
@@ -115,9 +115,9 @@ export function useDesignerRulesForFormGroup(designItemContext: DesignerItemCont
         if (bindingFieldId) {
             removeBindingFromViewModel(bindingFieldId);
             removeExpression(bindingFieldId);
-
-            removeFormClassFromResponseLayoutItem();
         }
+        removeFormClassFromResponseLayoutItem();
+
     }
 
 
diff --git a/packages/ui-vue/components/events-editor/src/components/combine-form/combine-form.component.tsx b/packages/ui-vue/components/events-editor/src/components/combine-form/combine-form.component.tsx
index 42f1811e7e1..aa63ee50ac7 100644
--- a/packages/ui-vue/components/events-editor/src/components/combine-form/combine-form.component.tsx
+++ b/packages/ui-vue/components/events-editor/src/components/combine-form/combine-form.component.tsx
@@ -94,7 +94,7 @@ export default defineComponent({
         }
         return () => {
             return (
-                <div class="combine-form-container mt-2 pb-2">
+                <div class="combine-form-container mt-2 pb-2 pl-1">
                     {shouldShowSourceControl.value &&
                         <FSelectSourceControl
                             communication={communication.value}
@@ -104,7 +104,7 @@ export default defineComponent({
                     {shouldShowTargetPanel.value && <>
                         <FSelectTargetForm communication={communication.value} onSelectForm={onSelectTargetForm}></FSelectTargetForm>
                         {communication.value?.target?.formId && <>
-                            <FSelectCommand communication={communication.value} onSelectCommand={onSelectTargetCommand} onAddParameter={onAddParameter}></FSelectCommand>
+                            <FSelectCommand communication={communication.value} sourceCommunication={props.sourceCommunication} onSelectCommand={onSelectTargetCommand} onAddParameter={onAddParameter}></FSelectCommand>
                             <FSelectParameters ref={parameterRef} communication={communication.value} onChanged={onParameterChanged} sourceCommunication={props.sourceCommunication}></FSelectParameters></>
                         }
                     </>
diff --git a/packages/ui-vue/components/events-editor/src/components/combine-form/combine-form.scss b/packages/ui-vue/components/events-editor/src/components/combine-form/combine-form.scss
index dd32dd41857..5691998d609 100644
--- a/packages/ui-vue/components/events-editor/src/components/combine-form/combine-form.scss
+++ b/packages/ui-vue/components/events-editor/src/components/combine-form/combine-form.scss
@@ -10,6 +10,23 @@
                 color: #8DA3CE;
             }
 
+            .form-control-tip {
+                padding: 2px;
+                background: #F0F3F9;
+                border-radius: 5px;
+                color: #8da3ce;
+                width: 72px;
+
+                >div {
+                    color: #5b89fe;
+                    background: #fff;
+                    display: flex;
+                    justify-content: center;
+                    padding: 0 8px;
+                    border-radius: 4px;
+                }
+            }
+
             .form-control {
                 border: 0;
                 flex: 1;
@@ -18,6 +35,8 @@
                 text-overflow: ellipsis;
                 white-space: nowrap;
                 overflow: hidden !important;
+                background-color: inherit;
+                padding-right: 20px;
             }
 
             .form-control:focus {
@@ -86,7 +105,7 @@
         .param-panel {
             padding: 6px;
             background-color: #F7FAFF;
-            box-shadow: 0px 14px 20px 0px rgba(3, 18, 51, 0.07);
+            box-shadow: 0px 0px 20px 0px rgba(3, 18, 51, 0.07);
             border-radius: 6px;
 
             .col-form-label {
@@ -95,7 +114,7 @@
         }
 
         .form-control {
-            padding-right: 10px;
+            padding-right: 10px !important;
         }
     }
 
@@ -109,10 +128,12 @@
     .fv-grid-row-selected {
         border-radius: 6px;
     }
-    .f-icon-flowline-warning{
+
+    .f-icon-flowline-warning {
         font-size: 14px;
     }
-    .f-icon-yxs_delete{
+
+    .f-icon-yxs_delete {
         font-size: 13px;
     }
 }
\ No newline at end of file
diff --git a/packages/ui-vue/components/events-editor/src/components/combine-form/select-command.component.tsx b/packages/ui-vue/components/events-editor/src/components/combine-form/select-command.component.tsx
index fc50a455f54..344aeda4ae5 100644
--- a/packages/ui-vue/components/events-editor/src/components/combine-form/select-command.component.tsx
+++ b/packages/ui-vue/components/events-editor/src/components/combine-form/select-command.component.tsx
@@ -37,18 +37,22 @@ export default defineComponent({
             }
         }
 
-        /** 获取所有模型下的变量 */
-        function getAllCommands(viewModels: any[]) {
-            if (viewModels?.length === 0) {
+        /** 获取所有模型下的命令 */
+        function getAllCommands(formSchema: any) {
+            const { viewmodels: viewModels, components } = formSchema.module;
+            if (viewModels?.length === 0 || components?.length === 0) {
                 return [];
             }
             targetCommands.value = [];
+            const viewModelNameResolver = props.sourceCommunication?.parameterData?.getViewModelName;
             viewModels.forEach(viewModel => {
                 if (!viewModel || !viewModel.commands || viewModel.commands.length === 0) {
                     return [];
                 }
+                const component = components.find(item => item.viewModel === viewModel.id);
+                const viewModelName = viewModelNameResolver && component ? viewModelNameResolver(component, viewModel.name) : '';
                 targetCommands.value.push({
-                    id: viewModel.id, code: viewModel.code, name: viewModel.name
+                    id: viewModel.id, code: viewModel.code, name: viewModelName || viewModel.name
                 });
                 viewModel.commands.forEach(command => {
                     if (!command.isInvalid) {
@@ -65,12 +69,12 @@ export default defineComponent({
             }
             // 当前表单
             if (communication.value.target.formId === formMetaBasicInfo.id) {
-                getAllCommands(useFormSchema.getViewModels());
+                getAllCommands(useFormSchema.getFormSchema());
             } else {
                 // 外部表单
                 const targetFormSchema = useFormSchema.externalFormSchema.get(communication.value?.target?.externalContainerId);
-                if (targetFormSchema?.content?.module?.viewmodels) {
-                    getAllCommands(targetFormSchema.content.module.viewmodels);
+                if (targetFormSchema?.content?.module) {
+                    getAllCommands(targetFormSchema.content);
                 }
             }
 
@@ -112,11 +116,10 @@ export default defineComponent({
         return () => {
             return (
                 <div class="form-container mt-2 position-relative">
-                    <div class="pl-2 selected-item" >
-                        <span class="f-icon f-icon-code"></span>
-                        <input placeholder="命令" class="form-control mr-3" v-model={displayCommandName.value} readonly onClick={onClickSelectedCommand}></input>
+                    <div class="selected-item" >
+                        <div class="form-control-tip"><div>目标命令</div></div>
+                        <input placeholder="请选择命令" class="form-control" v-model={displayCommandName.value} title={displayCommandName.value} readonly onClick={onClickSelectedCommand}></input>
                         {isInValidCommand.value ? <span title="目标命令已失效，请重新选择"><i class="ml-2 f-icon f-icon-flowline-warning text-danger text-tip"></i></span> : ''}
-
                     </div>
                     {shouldShowCommandList.value ? <div class="item-list">
                         <span class="tip">请选择目标命令</span>
diff --git a/packages/ui-vue/components/events-editor/src/components/combine-form/select-parameter.component.tsx b/packages/ui-vue/components/events-editor/src/components/combine-form/select-parameter.component.tsx
index 6f89accd22b..452d40bc154 100644
--- a/packages/ui-vue/components/events-editor/src/components/combine-form/select-parameter.component.tsx
+++ b/packages/ui-vue/components/events-editor/src/components/combine-form/select-parameter.component.tsx
@@ -72,18 +72,23 @@ export default defineComponent({
         });
 
         /** 获取所有模型下的变量，组装成树结构 */
-        function getAllVariables(viewModels: any[]) {
-            if (viewModels?.length === 0) {
+        function getAllVariables(formSchema: any) {
+            const { viewmodels: viewModels, components } = formSchema.module;
+            if (viewModels?.length === 0 || components?.length === 0) {
                 return [];
             }
             const vmTree = [] as any;
             targetVariablePlainData.value = [];
+            const viewModelNameResolver = props.sourceCommunication?.parameterData?.getViewModelName;
+
             viewModels.forEach(viewModel => {
                 if (!viewModel || !viewModel.states || viewModel.states.length === 0) {
                     return [];
                 }
 
                 const children = [] as any;
+                const component = components.find(item => item.viewModel === viewModel.id);
+                const viewModelName = viewModelNameResolver && component ? viewModelNameResolver(component, viewModel.name) : '';
                 viewModel.states.forEach(variable => {
                     const data = { ...variable, statePath: viewModel.id + '.' + variable.code };
                     children.push({ data, children: [] });
@@ -91,7 +96,7 @@ export default defineComponent({
                 });
 
                 const rootVm = {
-                    data: { id: viewModel.id, code: viewModel.code, name: viewModel.name, statePath: viewModel.id },
+                    data: { id: viewModel.id, code: viewModel.code, name: viewModelName || viewModel.name, statePath: viewModel.id },
                     children
                 };
                 vmTree.push(rootVm);
@@ -105,12 +110,12 @@ export default defineComponent({
             }
             // 当前表单
             if (communication.value.target.formId === formMetaBasicInfo.id) {
-                targetVariableTreeData.value = getAllVariables(useFormSchema.getViewModels());
+                targetVariableTreeData.value = getAllVariables(useFormSchema.getFormSchema());
             } else {
                 // 外部表单
                 const targetFormSchema = useFormSchema.externalFormSchema.get(communication.value.target.externalContainerId);
-                if (targetFormSchema?.content?.module?.viewmodels) {
-                    targetVariableTreeData.value = getAllVariables(targetFormSchema?.content?.module.viewmodels);
+                if (targetFormSchema?.content?.module) {
+                    targetVariableTreeData.value = getAllVariables(targetFormSchema?.content);
                 }
             }
         }
@@ -166,7 +171,7 @@ export default defineComponent({
             }
             shouldShowParam.value[parameter.id] = false;
             Object.assign(parameter, parameterForEditor);
-
+            delete parameter.statePath;
             context.emit('changed');
         }
         /** 关闭参数面板 */
@@ -191,7 +196,9 @@ export default defineComponent({
             if (selections.newValue?.length) {
                 const { statePath } = selections.newValue[0];
                 if (statePath?.indexOf('.') > 0) {
-                    parameter.targetVariableViewModelId = statePath.slice(0, statePath.indexOf('.'));
+                    const paths = statePath.split('.');
+                    parameter.targetVariableViewModelId = paths[0];
+                    parameter.targetVariable = paths[1];
                 }
             }
             // context.emit('changed');
@@ -202,7 +209,7 @@ export default defineComponent({
             return {
                 type: 'combo-tree',
                 textField: 'name',
-                valueField: 'code',
+                valueField: 'statePath',
                 idField: 'statePath',
                 data: targetVariableTreeData.value,
                 editable: false,
@@ -225,7 +232,7 @@ export default defineComponent({
         /** 渲染参数面板 */
         function renderParamPanel(parameter: CommunicationParameter) {
             const parameterForEditor = cloneDeep(parameter);
-
+            parameterForEditor['statePath'] = `${parameterForEditor.targetVariableViewModelId}.${parameterForEditor.targetVariable}`;
             const targetParameterEditor = resolveVariableTreeEditor(parameter);
 
             // 获取源页面的schema结构，以便于组装源页面相关的字段、变量等树形结构
@@ -257,7 +264,7 @@ export default defineComponent({
                     editable={true}
                 >
                 </FEventParameter>
-                <FDynamicFormGroup label="目标参数" v-model={parameterForEditor.targetVariable} customClass="col-12 mb-2"
+                <FDynamicFormGroup label="目标参数" v-model={parameterForEditor['statePath']} customClass="col-12 mb-2"
                     editor={targetParameterEditor}
                     onChange={(newValue, selections) => onChangeTargetVariable(newValue, parameterForEditor, selections)}></FDynamicFormGroup>
 
@@ -283,9 +290,9 @@ export default defineComponent({
                     const displayText = paramDispayText.value(parameter);
                     const isInValid = isInValidParam.value[parameter.targetVariable];
                     return (<div class={paramContainerClass.value(isInValid)}>
-                        <div class="pl-3 selected-item position-relative" >
-                            <span class="f-icon f-icon-circle"></span>
-                            <input placeholder="参数配置" class="form-control mr-3" readonly value={displayText} title={displayText} onClick={() => onClickSelectedParam(parameter)}></input>
+                        <div class="selected-item position-relative" >
+                            <div class="form-control-tip"><div>参数映射</div></div>
+                            <input placeholder="请配置参数" class="form-control mr-3" readonly value={displayText} title={displayText} onClick={() => onClickSelectedParam(parameter)}></input>
                             {isInValid ? <span title="目标参数已失效，请重新选择"><i class="f-icon f-icon-flowline-warning text-danger text-tip"></i></span> : ''}
 
                             <div class="remove-icon">
diff --git a/packages/ui-vue/components/events-editor/src/components/combine-form/select-source-control.component.tsx b/packages/ui-vue/components/events-editor/src/components/combine-form/select-source-control.component.tsx
index cf2aeca15bc..a45113d4bac 100644
--- a/packages/ui-vue/components/events-editor/src/components/combine-form/select-source-control.component.tsx
+++ b/packages/ui-vue/components/events-editor/src/components/combine-form/select-source-control.component.tsx
@@ -192,11 +192,13 @@ export default defineComponent({
                     <div class="remove-icon" style="top:4px;">
                         <div class="f-icon f-icon-yxs_delete mr-2" title="删除" onClick={onDeleteControl}></div>
                     </div>
-                    <div class="pl-2 selected-item" >
-                        <span class="f-icon f-icon-file-txt"></span>
-                        <input placeholder="源控件" class="form-control mr-3" v-model={dispayControlName.value} readonly onClick={onClickSelectedControl}></input>
+                    <div class="selected-item" >
+                        <div class="form-control-tip"><div>源控件</div></div>
+                        <input placeholder="请选择源控件" class="form-control" v-model={dispayControlName.value} title={dispayControlName.value} readonly onClick={onClickSelectedControl}></input>
                         {isInValidControl.value ? <span title="源控件已失效，请重新选择"><i class="ml-2 f-icon f-icon-flowline-warning text-danger text-tip"></i></span> : ''}
+
                     </div>
+
                     <div class={controlListPanelClass.value} style="min-height:220px;">
                         <span class="tip">请选择源控件</span>
                         <FTreeView
diff --git a/packages/ui-vue/components/events-editor/src/components/combine-form/select-target-form.component.tsx b/packages/ui-vue/components/events-editor/src/components/combine-form/select-target-form.component.tsx
index 44aa741c534..fdd545fd814 100644
--- a/packages/ui-vue/components/events-editor/src/components/combine-form/select-target-form.component.tsx
+++ b/packages/ui-vue/components/events-editor/src/components/combine-form/select-target-form.component.tsx
@@ -96,9 +96,9 @@ export default defineComponent({
         return () => {
             return (
                 <div class="form-container mt-2">
-                    <div class="pl-2 selected-item" >
-                        <span class="f-icon f-icon-file-txt"></span>
-                        <input placeholder="目标页面" class="form-control" v-model={dispayFormName.value} readonly onClick={onClickSelectedForm}></input>
+                    <div class="selected-item" >
+                        <div class="form-control-tip"><div>目标页面</div></div>
+                        <input placeholder="请选择目标页面" class="form-control" v-model={dispayFormName.value} title={dispayFormName.value} readonly onClick={onClickSelectedForm}></input>
                         {isInValidTarget.value ? <span title="目标页面已失效，请重新选择"><i class="ml-2 f-icon f-icon-flowline-warning text-danger text-tip"></i></span> : ''}
                     </div>
                     {shouldShowFormList.value ? <div class="item-list">
diff --git a/packages/ui-vue/components/events-editor/src/components/command-source/command-source.component.tsx b/packages/ui-vue/components/events-editor/src/components/command-source/command-source.component.tsx
index 5c55649b082..298a8f7ee57 100644
--- a/packages/ui-vue/components/events-editor/src/components/command-source/command-source.component.tsx
+++ b/packages/ui-vue/components/events-editor/src/components/command-source/command-source.component.tsx
@@ -44,15 +44,6 @@ export default defineComponent({
         const notifyService = new NotifyService();
         const { checkIfNewControllerExists, addNewController } = methodsComposition;
         const controllers = ref(props.controllers);
-
-        const actionButtonStyle = computed(() => {
-            return {
-                'font-size': '15px',
-                'margin': '5px',
-                'color': '#226eff',
-                'flex': '1 1 0'
-            };
-        });
         const useFormSchema = inject('useFormSchema') as any;
         const modalService = inject(F_MODAL_SERVICE_TOKEN) as any;
         let newFuncModal: any;
@@ -176,19 +167,19 @@ export default defineComponent({
             return (
                 <div class="f-page-internals-new-command">
                     <div class="f-page-internals-new-command-func1">
-                        <div class="f-icon f-icon-panel-retraction" style={actionButtonStyle.value}></div>
+                        <div class="f-icon f-icon-panel-retraction"></div>
                         <div class="f-function-class" onClick={() => openMetadataSelector()}>引入控制器</div>
                     </div>
                     <div class="f-page-internals-new-command-func2">
-                        <div class="f-icon f-icon-new-edit" style={actionButtonStyle.value}></div>
+                        <div class="f-icon f-icon-new-edit"></div>
                         <div class="f-function-class" onClick={() => generateNewFunc()}>添加新方法</div>
                     </div>
                     {props.haveBoundCommand && <div class="f-page-internals-new-command-func3">
-                        <div class="f-icon f-icon-licensed" style={actionButtonStyle.value}></div>
+                        <div class="f-icon f-icon-licensed"></div>
                         <div class="f-function-class" onClick={() => showBoundEvents()}>已有方法</div>
                     </div>}
                     {shoulShowCommunication.value && <div class="f-page-internals-new-command-func2">
-                        <div class="fd-i-Family fd_pc-extend-setting" style={actionButtonStyle.value}></div>
+                        <div class="fd-i-Family fd_pc-extend-setting"></div>
                         <div class="f-function-class" onClick={() => openFormCommunicationPanel()}>添加组件通讯事件</div>
                     </div>}
                 </div>
diff --git a/packages/ui-vue/components/events-editor/src/components/command-source/command-source.css b/packages/ui-vue/components/events-editor/src/components/command-source/command-source.css
index 20b1a81b337..b90808987d2 100644
--- a/packages/ui-vue/components/events-editor/src/components/command-source/command-source.css
+++ b/packages/ui-vue/components/events-editor/src/components/command-source/command-source.css
@@ -11,9 +11,9 @@
     padding: 10px 10px 0 10px;
     display: flex;
     flex-direction: column;
-  }
-  
-  .f-page-events-editor-command-source::before {
+}
+
+.f-page-events-editor-command-source::before {
     content: '';
     width: 0;
     height: 0;
@@ -23,9 +23,9 @@
     border-width: 7px;
     border-style: solid;
     border-color: transparent transparent #e2e5e6;
-  }
-  
-  .f-page-events-editor-command-source::after {
+}
+
+.f-page-events-editor-command-source::after {
     content: '';
     width: 0;
     height: 0;
@@ -35,18 +35,18 @@
     border-width: 7px;
     border-style: solid dashed dashed;
     border-color: transparent transparent #ffffff;
-  }
-  
-  .f-page-command-source-choice {
+}
+
+.f-page-command-source-choice {
     overflow-x: hidden;
     overflow-y: scroll;
     padding: 5px 0px;
     border-radius: 3px;
     min-width: 200px;
     flex: 2 2 0;
-  }
-  
-  /* .f-page-command-source-choice{
+}
+
+/* .f-page-command-source-choice{
     height: 315px;
     overflow-x:hidden;
     overflow-y: scroll;
@@ -54,9 +54,9 @@
     border-radius: 3px;
     min-width: 200px;
   } */
-  
-  
-  .f-page-events-editor-switch {
+
+
+.f-page-events-editor-switch {
     background: #EFF5FF;
     border-radius: 10px;
     margin: 10px;
@@ -64,9 +64,9 @@
     height: 32px;
     display: flex;
     text-align: center;
-  }
-  
-  .namelist {
+}
+
+.namelist {
     font-family: PingFangSC-Regular;
     font-size: 14px;
     color: #446a9fd9;
@@ -74,9 +74,9 @@
     margin: 8px 13px 8px 13px;
     flex-grow: 1;
     cursor: pointer;
-  }
-  
-  .namelist-focus {
+}
+
+.namelist-focus {
     opacity: 0.6;
     font-family: PingFangSC-Regular;
     font-size: 14px;
@@ -89,28 +89,42 @@
     box-shadow: 0 4px 18px 0 rgb(2 75 193 / 20%);
     border-radius: 10px;
     cursor: pointer;
-  }
-  
-  .f-page-internals-new-command {
+}
+
+.f-page-internals-new-command {
     margin: 0px 2px 0px 13px;
-  }
-  
-  .f-page-internals-new-command-func1 {
+}
+
+.f-page-internals-new-command-func1 {
     display: flex;
     margin: 4px 1px;
-  }
-  
-  .f-page-internals-new-command-func2 {
+}
+
+.f-page-internals-new-command-func2 {
     display: flex;
     margin: 4px 1px;
-  }
-  
-  .f-page-internals-new-command-func3 {
+}
+
+.f-page-internals-new-command-func3 {
     display: flex;
     margin: 4px 1px;
-  }
-  
-  .f-function-class {
+}
+
+.f-page-internals-new-command .f-icon {
+    font-size: 15px;
+    margin: 5px;
+    color: #226eff;
+    flex: 1 1 0;
+}
+
+.f-page-internals-new-command .fd-i-Family {
+    font-size: 14px;
+    margin: 5px;
+    color: #226eff;
+    flex: 1 1 0;
+}
+
+.f-function-class {
     margin: 0 0 0 5px;
     font-family: PingFangSC-Regular;
     color: #4f6b9d;
@@ -121,9 +135,9 @@
     line-height: 26px;
     font-weight: 400;
     flex: 10;
-  }
-  
-  .f-page-internals-close {
+}
+
+.f-page-internals-close {
     font-family: PingFangSC-Regular;
     font-size: 13px;
     margin: 7.75px 10px;
@@ -134,13 +148,13 @@
     color: #425159;
     font-weight: 400;
     text-align: center;
-  }
-  
-  .f-command-breakline {
+}
+
+.f-command-breakline {
     color: #B4BCCC;
     margin: 2px;
     overflow: hidden;
     white-space: nowrap;
     text-overflow: clip;
     height: 10px;
-  }
\ No newline at end of file
+}
\ No newline at end of file
diff --git a/packages/ui-vue/components/external-container/src/designer/external-container.design.component.tsx b/packages/ui-vue/components/external-container/src/designer/external-container.design.component.tsx
index aa8b4fde2c0..edb69a64950 100644
--- a/packages/ui-vue/components/external-container/src/designer/external-container.design.component.tsx
+++ b/packages/ui-vue/components/external-container/src/designer/external-container.design.component.tsx
@@ -57,7 +57,7 @@ export default defineComponent({
 
                         recordExternalForm();
                     }, (error) => {
-                        messagerService.exception(error?.error || `查询表单【${externalComponent.value.name}】失败`);
+                        messagerService.error(error?.response?.data.Message || `查询表单【${externalComponent.value.name}】失败`);
                         instance.value.close();
                     });
             }
diff --git a/packages/ui-vue/components/external-container/src/designer/import-external-schema.component.tsx b/packages/ui-vue/components/external-container/src/designer/import-external-schema.component.tsx
index df3ed71e91c..2a2d0dde85e 100644
--- a/packages/ui-vue/components/external-container/src/designer/import-external-schema.component.tsx
+++ b/packages/ui-vue/components/external-container/src/designer/import-external-schema.component.tsx
@@ -5,6 +5,7 @@ import { FSchemaSelector } from '@farris/ui-vue/components/schema-selector';
 import { FormSchemaRepositorySymbol } from '@farris/ui-vue/components/common';
 import { FNotifyService } from '@farris/ui-vue/components/notify';
 import './import-external-schema.css';
+import { FLoadingService } from '@farris/ui-vue/components/loading';
 
 export default defineComponent({
     name: 'FImportExteranlSchema',
@@ -15,15 +16,17 @@ export default defineComponent({
         const selectedItem = ref();
         const notifyService: any = new FNotifyService();
         notifyService.globalConfig = { position: 'top-center' };
+        const loadingService: any | null = inject<FLoadingService>('FLoadingService');
 
         const formBasicInfo = designerHostService.formSchemaUtils.getFormMetadataBasicInfo();
         const schemaSelectorRef = ref();
 
         async function checkFormValidtion(selectionFormInfo: any) {
             const formBasicInfo = designerHostService.formSchemaUtils.getFormMetadataBasicInfo();
-
+            const instance = loadingService.show();
             return designerHostService.metadataService.getPickMetadata(formBasicInfo.relativePath, selectionFormInfo)
                 .then((res: any) => {
+                    instance.value?.close();
                     const metadata = JSON.parse(res?.metadata.content);
                     const formSchema = metadata.Contents;
                     const { templateId, name } = formSchema.module;
@@ -31,11 +34,12 @@ export default defineComponent({
                     if (['list-component', 'tree-component'].includes(templateId)) {
                         return true;
                     }
-                    const message = `表单【${name}】不属于组件类模板，无法被导入到当前表单。`;
+                    const message = `表单【${name}】不属于组件类模板，无法被引入到当前表单。`;
                     designerHostService.messagerService.warning(message);
                     return false;
                 }, (error) => {
-                    designerHostService.exception(error?.error || `查询表单【${selectionFormInfo.name}】失败`);
+                    designerHostService.messagerService.error(error?.response?.data.Message || `查询表单【${selectionFormInfo.name}】失败`);
+                    instance.value?.close();
                     return false;
                 });
         }
@@ -76,7 +80,7 @@ export default defineComponent({
             context.emit('close');
         }
         function onSelectionChange($event) {
-            selectedItem.value = $event[0];
+            selectedItem.value = $event?.length ? $event[0] : null;
         }
         function renderFormSelectorComponent() {
             const formSelectorParams = { formBasicInfo };
diff --git a/packages/ui-vue/components/external-container/src/designer/import-external-schema.css b/packages/ui-vue/components/external-container/src/designer/import-external-schema.css
index 7ab3f2b6e2b..9d2bea97284 100644
--- a/packages/ui-vue/components/external-container/src/designer/import-external-schema.css
+++ b/packages/ui-vue/components/external-container/src/designer/import-external-schema.css
@@ -6,6 +6,7 @@
     height: 100%;
     display: flex;
     justify-content: center;
+    border: dotted 2px #e8e8e8;
 }
 
 .f-import-exteranl-component-button-center {
@@ -14,4 +15,4 @@
     padding: 6px 17px;
     color: #2A87FF;
     cursor: pointer;
-}
+}
\ No newline at end of file
diff --git a/packages/ui-vue/components/external-container/src/property-config/external-container.property-config.ts b/packages/ui-vue/components/external-container/src/property-config/external-container.property-config.ts
index 80826e9b8b4..4e72cf78b14 100644
--- a/packages/ui-vue/components/external-container/src/property-config/external-container.property-config.ts
+++ b/packages/ui-vue/components/external-container/src/property-config/external-container.property-config.ts
@@ -1,10 +1,10 @@
 
-import { inject } from "vue";
 import { FormSchemaRepositorySymbol } from "@farris/ui-vue/components/common";
 import { DesignerComponentInstance } from "@farris/ui-vue/components/designer-canvas";
 import { BaseControlProperty } from "@farris/ui-vue/components/property-panel";
 import { FLoadingService } from "@farris/ui-vue/components/loading";
 import { externalContainerConverter } from "./external-container.converter";
+import { FNotifyService } from "@farris/ui-vue/components/notify";
 
 export class ExternalContainerProperty extends BaseControlProperty {
 
@@ -18,16 +18,15 @@ export class ExternalContainerProperty extends BaseControlProperty {
         // 外观
         this.propertyConfig.categories['appearance'] = this.getAppearanceConfig(propertyData);
         // 引入表单
-        this.propertyConfig.categories['content'] = this.getContentConfig();
+        this.propertyConfig.categories['content'] = this.getContentConfig(propertyData);
 
         this.propertyConfig.categories['eventsEditor'] = this.getEventPropConfig(propertyData);
 
         return this.propertyConfig;
     }
 
-    private getContentConfig() {
+    private getContentConfig(propertyData: any) {
         const self = this;
-        const loadingService: any | null = inject<FLoadingService>('FLoadingService');
 
         return {
             description: '外部表单',
@@ -61,8 +60,13 @@ export class ExternalContainerProperty extends BaseControlProperty {
                             }
                         }
                     },
-                    $converter: externalContainerConverter
-
+                    $converter: externalContainerConverter,
+                    refreshPanelAfterChanged: true
+                }
+            },
+            setPropertyRelates(changeObject: any) {
+                if (changeObject?.propertyID === 'externalComponent') {
+                    self.syncCommunicationAfterFormChanged(changeObject, propertyData);
                 }
             }
         };
@@ -70,9 +74,11 @@ export class ExternalContainerProperty extends BaseControlProperty {
 
     private checkFormValidtion(selectionFormInfo: any) {
         const formBasicInfo = this.designerHostService.formSchemaUtils.getFormMetadataBasicInfo();
+        const loadingInstance = FLoadingService.show();
 
         return this.designerHostService.metadataService.getPickMetadata(formBasicInfo.relativePath, selectionFormInfo)
             .then((res: any) => {
+                (loadingInstance.value as any).close();
                 const metadata = JSON.parse(res?.metadata.content);
                 const formSchema = metadata.Contents;
                 const { templateId, name } = formSchema.module;
@@ -80,11 +86,12 @@ export class ExternalContainerProperty extends BaseControlProperty {
                 if (['list-component', 'tree-component'].includes(templateId)) {
                     return true;
                 }
-                const message = `表单【${name}】不属于组件类模板，无法被导入到当前表单。`;
+                const message = `表单【${name}】不属于组件类模板，无法被引入到当前表单。`;
                 this.designerHostService.messagerService.warning(message);
                 return false;
             }, (error) => {
-                this.designerHostService.exception(error?.error || `查询表单【${selectionFormInfo.name}】失败`);
+                (loadingInstance.value as any).close();
+                this.designerHostService.messagerService.error(error?.response?.data.Message || `查询表单【${selectionFormInfo.name}】失败`);
                 return false;
             });
     }
@@ -117,4 +124,36 @@ export class ExternalContainerProperty extends BaseControlProperty {
             }
         };
     }
+    /**
+     * 切换外部表单后，同步更新组件通讯中的源表单（场景：已配置组件通讯，再切换外部表单）
+     */
+    private syncCommunicationAfterFormChanged(changeObject, propertyData) {
+        if (!propertyData.onCommunication) {
+            return;
+        }
+        const communicationIds = propertyData.onCommunication.replace('communication:', '').split(';');
+        if (!communicationIds?.length) {
+            return;
+        }
+        const formSchema = this.designerHostService.formSchemaUtils.getFormSchema();
+        const communications = formSchema.module.communications || [];
+        let needNotify = false;
+        communicationIds.map(communicationId => {
+            const communication = communications.find(item => item.id === communicationId);
+            if (communication?.source && communication.source.formId !== propertyData.externalComponent.id) {
+                communication.source.formId = propertyData.externalComponent.id;
+                communication.source.formCode = propertyData.externalComponent.code;
+                communication.source.componentId = '';
+                communication.source.event = '';
+
+                needNotify = true;
+            }
+        });
+        if (needNotify) {
+            const notifyService: any = new FNotifyService();
+            notifyService.globalConfig = { position: 'top-center' };
+            notifyService.warning({ message: '切换引入表单后，请重新配置组件通讯。' });
+        }
+
+    }
 }
diff --git a/packages/ui-vue/components/response-layout/src/designer/response-layout-item-designer-rules.ts b/packages/ui-vue/components/response-layout/src/designer/response-layout-item-designer-rules.ts
index 5f6d2580bd8..5c4a0d0a63f 100644
--- a/packages/ui-vue/components/response-layout/src/designer/response-layout-item-designer-rules.ts
+++ b/packages/ui-vue/components/response-layout/src/designer/response-layout-item-designer-rules.ts
@@ -121,14 +121,14 @@ export function useDesignerRules(designItemContext: DesignerItemContext, designe
         }
         const sourceComponentInstance = sourceElement.componentInstance;
         const sourceComponentSchema = sourceComponentInstance.value.schema;
-        if (!sourceComponentSchema.binding || !sourceComponentSchema.binding.field) {
-            return;
-        }
 
         // 若拖拽的源组件是输入类控件，需要在当前布局项上增加form样式
         if (sourceComponentSchema.type === 'form-group') {
             addFormClassToResponseLayoutItem();
         }
+        if (!sourceComponentSchema.binding || !sourceComponentSchema.binding.field) {
+            return;
+        }
 
         const formMoveHandler = formUseDesignerRules(designItemContext, designerHostService);
         if (formMoveHandler.onAcceptMovedChildElement) {
diff --git a/packages/ui-vue/components/schema-selector/src/components/card-view.component.tsx b/packages/ui-vue/components/schema-selector/src/components/card-view.component.tsx
index 506799e0bf2..8fadf6f33ec 100644
--- a/packages/ui-vue/components/schema-selector/src/components/card-view.component.tsx
+++ b/packages/ui-vue/components/schema-selector/src/components/card-view.component.tsx
@@ -49,7 +49,7 @@ export default defineComponent({
                         </div>
                     </div>
                     <div class="f-navForm-rightText">
-                        <div class="f-navForm-name" title={item.name}>{item.name}({item.code})</div>
+                        <div class="f-navForm-name" title={`${item.name}(${item.code})`}>{item.name}({item.code})</div>
                         <div class="f-navForm-source" title={item.nameSpace}>{item.nameSpace}</div>
                     </div>
                 </div>
@@ -73,7 +73,7 @@ export default defineComponent({
         function selectionChangeEventHandler($event) {
             context.emit('selectionChange', $event);
         }
-        
+
         async function loadData() {
             const loadingService: any | null = inject('FLoadingService', null);
             const loading = loadingService?.show();
@@ -88,6 +88,13 @@ export default defineComponent({
             loadData();
 
         });
+        function clearSelection() {
+            listViewRef.value.clearSelection();
+            listViewRef.value.updateSelectionByIds([]);
+
+        }
+        context.expose({ clearSelection });
+
         return () => {
             return (<FListView ref={listViewRef} data={dataList.value} group={group} view="CardView" class="h-100"
                 onSelectionChange={(event) => selectionChangeEventHandler(event)}>
diff --git a/packages/ui-vue/components/schema-selector/src/components/list-view.component.tsx b/packages/ui-vue/components/schema-selector/src/components/list-view.component.tsx
index 0d6b046786d..4489e25ebe8 100644
--- a/packages/ui-vue/components/schema-selector/src/components/list-view.component.tsx
+++ b/packages/ui-vue/components/schema-selector/src/components/list-view.component.tsx
@@ -1,4 +1,4 @@
- 
+
 import { defineComponent, inject, onMounted, Ref, ref, watch } from "vue";
 import { FListView } from '../../../list-view';
 import { FPagination } from '../../../pagination';
@@ -52,6 +52,12 @@ export default defineComponent({
         onMounted(() => {
             loadData();
         });
+        function clearSelection() {
+            listViewRef.value.clearSelection();
+            listViewRef.value.updateSelectionByIds([]);
+
+        }
+        context.expose({ clearSelection });
 
         function renderListViewContent({ item, index, selectedItem }) {
             return (
diff --git a/packages/ui-vue/components/schema-selector/src/schema-selector-editor.component.tsx b/packages/ui-vue/components/schema-selector/src/schema-selector-editor.component.tsx
index c4568dcc890..e080ce29f9e 100644
--- a/packages/ui-vue/components/schema-selector/src/schema-selector-editor.component.tsx
+++ b/packages/ui-vue/components/schema-selector/src/schema-selector-editor.component.tsx
@@ -51,7 +51,7 @@ export default defineComponent({
 
         function renderSchemaSelector() {
             if (viewType.value === 'controller') {
-                return <FSchemaSelector injectSymbolToken={props.repositoryToken} view-type="NavList" onS></FSchemaSelector>;
+                return <FSchemaSelector injectSymbolToken={props.repositoryToken} view-type="NavList"></FSchemaSelector>;
             }
 
             return <FSchemaSelector injectSymbolToken={props.repositoryToken}
diff --git a/packages/ui-vue/components/schema-selector/src/schema-selector.component.tsx b/packages/ui-vue/components/schema-selector/src/schema-selector.component.tsx
index 1d0669631ce..f6e3cd3c4ae 100644
--- a/packages/ui-vue/components/schema-selector/src/schema-selector.component.tsx
+++ b/packages/ui-vue/components/schema-selector/src/schema-selector.component.tsx
@@ -38,12 +38,26 @@ export default defineComponent({
         /** 标识按钮是否被点击，防止连续多次点击触发多次事件 */
         const submitButtonClicked = ref(false);
 
+        const dataViewRef: any = [];
+
         function onSchemaSelect(schema: SchemaItem) {
             context.emit('selectionChange', schema);
         }
-
+        /**
+         * 切换页签时，清除已选项
+         */
+        function onTabChanged() {
+            context.emit('selectionChange', []);
+            if (dataViewRef.length) {
+                dataViewRef.map(viewRef => {
+                    if (viewRef.clearSelection) {
+                        viewRef.clearSelection();
+                    }
+                });
+            }
+        }
         function renderTabsContent() {
-            return viewOptions.value.map((viewOption: ViewOption) => {
+            return viewOptions.value.map((viewOption: ViewOption, index: number) => {
                 if (viewsMap.has(viewOption.type)) {
                     const SelectorDataView = viewsMap.get(viewOption.type) as any;
                     const options = {
@@ -55,7 +69,7 @@ export default defineComponent({
                         pagination: viewOption.pagination || false
                     };
                     return <FTabPage id={viewOption.id} title={viewOption.title} class="container h-100">
-                        <SelectorDataView {...options} onSelectionChange={($event) => onSchemaSelect($event)}></SelectorDataView>
+                        <SelectorDataView ref={(view) => { if (view) { dataViewRef[index] = view; } }}  {...options} onSelectionChange={($event) => onSchemaSelect($event)}></SelectorDataView>
                     </FTabPage>;
                 }
             });
@@ -75,7 +89,7 @@ export default defineComponent({
         }
 
         function renderTabsView() {
-            return <FTabs>{{ default: renderTabsContent, headerSuffix: renderTabsHeaderSuffix }}</FTabs>;
+            return <FTabs onTabChange={onTabChanged}>{{ default: renderTabsContent, headerSuffix: renderTabsHeaderSuffix }}</FTabs>;
         }
 
         function renderNavView() {
diff --git a/packages/ui-vue/components/schema-selector/src/schema-selector.css b/packages/ui-vue/components/schema-selector/src/schema-selector.css
index 5661cb21d0b..b40b5267a98 100644
--- a/packages/ui-vue/components/schema-selector/src/schema-selector.css
+++ b/packages/ui-vue/components/schema-selector/src/schema-selector.css
@@ -108,7 +108,6 @@
     font-size: 13px;
     color: #8999b9;
     font-weight: 400;
-    background: #f7f9fc;
     border-radius: 4px;
     padding: 2px;
     text-overflow: ellipsis;
diff --git a/packages/ui-vue/components/switch/src/property-config/switch.property-config.ts b/packages/ui-vue/components/switch/src/property-config/switch.property-config.ts
index f8b96a2785f..a2f1d47051e 100644
--- a/packages/ui-vue/components/switch/src/property-config/switch.property-config.ts
+++ b/packages/ui-vue/components/switch/src/property-config/switch.property-config.ts
@@ -1,4 +1,5 @@
-import { InputBaseProperty } from "@farris/ui-vue/components/property-panel";
+import { FormSchemaEntityFieldTypeName } from "@/components/common";
+import { FormPropertyChangeObject, InputBaseProperty } from "@farris/ui-vue/components/property-panel";
 
 export class SwitchProperty extends InputBaseProperty {
 
@@ -7,14 +8,14 @@ export class SwitchProperty extends InputBaseProperty {
     }
 
     getEditorProperties(propertyData: any) {
-        return this.getComponentConfig(propertyData, { 
-            type:"switch"
+        return this.getComponentConfig(propertyData, {
+            type: "switch"
         }, {
             disabled: {
-                visible:false
+                visible: false
             },
-            placeholder:{
-                visible:false
+            placeholder: {
+                visible: false
             },
             onLabel: {
                 description: "",
@@ -36,11 +37,11 @@ export class SwitchProperty extends InputBaseProperty {
                 title: "关闭背景色",
                 type: "string"
             },
-            size:{
+            size: {
                 description: "",
                 title: "尺寸",
                 type: "enum",
-                editor:{
+                editor: {
                     data: [
                         {
                             id: "small",
@@ -57,7 +58,7 @@ export class SwitchProperty extends InputBaseProperty {
                     ]
                 }
             },
-             trueValue: {
+            trueValue: {
                 description: "打开时的值",
                 title: "打开的值",
                 type: this.getBindingDataType(),
@@ -77,5 +78,35 @@ export class SwitchProperty extends InputBaseProperty {
             }
         });
     }
+    /**
+     * 切换绑定属性 
+     */
+    public changeBindingField(propertyData: any, changeObject: FormPropertyChangeObject, parameters?: any): any {
+        super.changeBindingField(propertyData, changeObject);
+
+
+        // 同步trueValue和falseValue属性值(场景：控件从空绑定至绑定日期时间类型字段)
+        const newBindingField = parameters;
+        if (propertyData.editor && newBindingField?.type?.name) {
+            let defaultTrueValue;
+            let defaultFalseValue;
+            if (newBindingField.type.name === FormSchemaEntityFieldTypeName.String) {
+                defaultTrueValue = 'true';
+                defaultFalseValue = 'false';
+            }
+            if (newBindingField.type.name === FormSchemaEntityFieldTypeName.Number) {
+                defaultTrueValue = 1;
+                defaultFalseValue = 0;
+            }
+            if (!Object.prototype.hasOwnProperty.call(propertyData.editor, 'trueValue') && defaultTrueValue !== undefined) {
+                propertyData.editor.trueValue = defaultTrueValue;
+            }
+            if (!Object.prototype.hasOwnProperty.call(propertyData.editor, 'falseValue') && defaultFalseValue !== undefined) {
+                propertyData.editor.falseValue = defaultFalseValue;
+            }
+
+        }
+
+    }
 };
 
-- 
Gitee


From d52d03185cf7236de5bbdc878cc6955e5a753734 Mon Sep 17 00:00:00 2001
From: wang-xh <wang-xh@inspur.com>
Date: Tue, 29 Jul 2025 15:06:02 +0800
Subject: [PATCH 3/9] =?UTF-8?q?fix:=20=E9=80=89=E6=8B=A9=E8=A1=A8=E5=8D=95?=
 =?UTF-8?q?=E7=9A=84=E7=AA=97=E5=8F=A3=E6=94=AF=E6=8C=81=E5=88=86=E9=A1=B5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../external-component-selector.component.tsx |  8 +++---
 .../method-list/method-list.component.tsx     |  5 ++--
 .../external-container.design.component.tsx   | 17 ++++++------
 .../external-container.property-config.ts     |  9 +++----
 .../composition/use-response-layout.ts        |  2 +-
 .../src/designer/use-designer-item-rules.ts   | 10 +++++--
 .../src/components/card-view.component.tsx    | 27 ++++++++++++++-----
 .../property-config/switch.property-config.ts |  2 +-
 8 files changed, 49 insertions(+), 31 deletions(-)

diff --git a/packages/designer/src/components/components/form-designer/components/external-component-panel/components/external-component-selector/external-component-selector.component.tsx b/packages/designer/src/components/components/form-designer/components/external-component-panel/components/external-component-selector/external-component-selector.component.tsx
index 1ca522ae997..bcb7d10ac41 100644
--- a/packages/designer/src/components/components/form-designer/components/external-component-panel/components/external-component-selector/external-component-selector.component.tsx
+++ b/packages/designer/src/components/components/form-designer/components/external-component-panel/components/external-component-selector/external-component-selector.component.tsx
@@ -22,8 +22,8 @@ export default defineComponent({
         const formBasicInfo = formSchemaUtils.getFormMetadataBasicInfo();
         const editorParams = { formBasicInfo };
         const viewOptions = [
-            { id: 'recommend', title: '推荐', type: 'Card', dataSource: 'Recommand', pagination: false },
-            { id: 'total', title: '全部', type: 'Card', dataSource: 'Total', pagination: false }
+            { id: 'recommend', title: '推荐', type: 'Card', dataSource: 'Recommand', pagination: true },
+            { id: 'total', title: '全部', type: 'Card', dataSource: 'Total', pagination: true }
         ];
         const injectSymbolToken = computed(() => {
             return externalComponentType === 'Independence' ? FormSchemaRepositorySymbol : LookupSchemaRepositoryToken;
@@ -35,9 +35,9 @@ export default defineComponent({
          */
         function onSelectionChange($event: any[]) {
             if (externalComponentType === 'Lookup') {
-                selectedComponent.value = $event[0].data;
+                selectedComponent.value = $event?.length ? $event[0].data : null;
             } else {
-                selectedComponent.value = $event[0];
+                selectedComponent.value = $event?.length ? $event[0] : null;;
             }
         }
 
diff --git a/packages/designer/src/components/components/view-model-designer/method-manager/components/method-list/method-list.component.tsx b/packages/designer/src/components/components/view-model-designer/method-manager/components/method-list/method-list.component.tsx
index 8831dcd1b32..1b2527f1656 100644
--- a/packages/designer/src/components/components/view-model-designer/method-manager/components/method-list/method-list.component.tsx
+++ b/packages/designer/src/components/components/view-model-designer/method-manager/components/method-list/method-list.component.tsx
@@ -110,7 +110,7 @@ export default defineComponent({
         /**
          * 由外部触发刷新方法
          */
-        function refreshMethodList(newCommandsData: Array<Command>, newActiveViewModel: FormViewModel, selectedCommandId?: string) {
+        function refreshMethodList(newCommandsData: Array<Command>, newActiveViewModel: FormViewModel, specifiedCommandId?: string) {
             commandsData.value = newCommandsData || [];
             // cleanData(commandsData.value);
             activeViewModel.value = newActiveViewModel;
@@ -118,7 +118,8 @@ export default defineComponent({
             treeGridRef.value.clearSelection();
 
             if (commandsData.value.length) {
-                treeGridRef.value.selectItemById(selectedCommandId || selectedTreeNode.value?.id || commandsData.value[0].id);
+                const currentSelectedCommandId = selectedTreeNode.value && !selectedTreeNode.value.parent ? selectedTreeNode.value.id : '';
+                treeGridRef.value.selectItemById(specifiedCommandId || currentSelectedCommandId || commandsData.value[0].id);
             } else {
                 selectedTreeNode.value = null;
                 paramsData.value = [];
diff --git a/packages/ui-vue/components/external-container/src/designer/external-container.design.component.tsx b/packages/ui-vue/components/external-container/src/designer/external-container.design.component.tsx
index edb69a64950..255a41efaaf 100644
--- a/packages/ui-vue/components/external-container/src/designer/external-container.design.component.tsx
+++ b/packages/ui-vue/components/external-container/src/designer/external-container.design.component.tsx
@@ -27,7 +27,6 @@ export default defineComponent({
         const externalFormSchemaComponent = computed(() => externalFormSchema.value?.module?.components[0]);
         /** 是否显示引入表单的占位区域 */
         const shouldShowImportSchema = computed(() => !externalFormSchema.value);
-
         /**  记录外部容器id */
         provide<string>('external-container-id', componentInstance.value.schema.id);
 
@@ -48,26 +47,26 @@ export default defineComponent({
         async function loadFormMetadata() {
             const formBasicInfo = designerHostService.formSchemaUtils.getFormMetadataBasicInfo();
             if (externalComponent.value?.id) {
-                const instance = loadingService?.show();
-                designerHostService.metadataService.getPickMetadata(formBasicInfo.relativePath, externalComponent.value)
+                const instance = loadingService?.show({ message: '数据加载中，请稍候...' });
+                return designerHostService.metadataService.getPickMetadata(formBasicInfo.relativePath, externalComponent.value)
                     .then((res: any) => {
                         const metadata = JSON.parse(res?.metadata.content);
                         externalFormSchema.value = metadata.Contents;
                         instance.value.close();
-
                         recordExternalForm();
                     }, (error) => {
                         messagerService.error(error?.response?.data.Message || `查询表单【${externalComponent.value.name}】失败`);
                         instance.value.close();
                     });
             }
-
         }
 
-        watch(() => props.externalComponent, (newValue) => {
+        watch(() => props.externalComponent, async (newValue) => {
             if (!externalComponent.value || !newValue || JSON.stringify(externalComponent.value) !== JSON.stringify(newValue)) {
                 externalComponent.value = newValue;
-                loadFormMetadata();
+                await loadFormMetadata();
+                // 触发更新属性面板
+                designItemContext?.setupContext?.emit('dragEnd');
             } else {
                 externalComponent.value = newValue;
             }
@@ -92,10 +91,10 @@ export default defineComponent({
                 <FDesignerItem v-model={externalFormSchemaComponent.value} external-form-schema={externalFormSchema.value}></FDesignerItem>
             </>;
         }
-        function onFormSelected(formMetadaInfo: any) {
+        async function onFormSelected(formMetadaInfo: any) {
             componentInstance.value.schema.externalComponent = formMetadaInfo;
             externalComponent.value = formMetadaInfo;
-            loadFormMetadata();
+            await loadFormMetadata();
 
             // 触发更新属性面板
             designItemContext?.setupContext?.emit('dragEnd');
diff --git a/packages/ui-vue/components/external-container/src/property-config/external-container.property-config.ts b/packages/ui-vue/components/external-container/src/property-config/external-container.property-config.ts
index 4e72cf78b14..6698f2014aa 100644
--- a/packages/ui-vue/components/external-container/src/property-config/external-container.property-config.ts
+++ b/packages/ui-vue/components/external-container/src/property-config/external-container.property-config.ts
@@ -47,11 +47,11 @@ export class ExternalContainerProperty extends BaseControlProperty {
                         },
                         viewOptions: this.formSchemaUtils.designerMode === 'PC_RTC' ?
                             [
-                                { id: 'total', title: '全部', type: 'Card', dataSource: 'Total', pagination: false }
+                                { id: 'total', title: '全部', type: 'Card', dataSource: 'Total', pagination: true }
                             ] :
                             [
-                                { id: 'recommend', title: '推荐', type: 'Card', dataSource: 'Recommand', pagination: false },
-                                { id: 'total', title: '全部', type: 'Card', dataSource: 'Total', pagination: false }
+                                { id: 'recommend', title: '推荐', type: 'Card', dataSource: 'Recommand', pagination: true },
+                                { id: 'total', title: '全部', type: 'Card', dataSource: 'Total', pagination: true }
                             ],
                         repositoryToken: FormSchemaRepositorySymbol,
                         validateFunction: (selection: any) => {
@@ -60,8 +60,7 @@ export class ExternalContainerProperty extends BaseControlProperty {
                             }
                         }
                     },
-                    $converter: externalContainerConverter,
-                    refreshPanelAfterChanged: true
+                    $converter: externalContainerConverter
                 }
             },
             setPropertyRelates(changeObject: any) {
diff --git a/packages/ui-vue/components/response-layout/src/property-config/response-layout-splitter/composition/use-response-layout.ts b/packages/ui-vue/components/response-layout/src/property-config/response-layout-splitter/composition/use-response-layout.ts
index 23db017eefc..c08db08825f 100644
--- a/packages/ui-vue/components/response-layout/src/property-config/response-layout-splitter/composition/use-response-layout.ts
+++ b/packages/ui-vue/components/response-layout/src/property-config/response-layout-splitter/composition/use-response-layout.ts
@@ -2,7 +2,7 @@ import { ComponentSchema } from "../../../../../designer-canvas";
 import { getSchemaByType } from "../../../../../dynamic-resolver";
 import { inject, Ref, ref, SetupContext } from "vue";
 import { ResponseLayoutSplitterProps } from "../response-layout-splitter.props";
-import { FMessageBoxService } from "@/components/message-box";
+import { FMessageBoxService } from "@farris/ui-vue/components/message-box";
 
 export function useResponseLayoutSplitter(props: ResponseLayoutSplitterProps, context: SetupContext) {
 
diff --git a/packages/ui-vue/components/response-toolbar/src/designer/use-designer-item-rules.ts b/packages/ui-vue/components/response-toolbar/src/designer/use-designer-item-rules.ts
index 60245de78d4..d376937fd84 100644
--- a/packages/ui-vue/components/response-toolbar/src/designer/use-designer-item-rules.ts
+++ b/packages/ui-vue/components/response-toolbar/src/designer/use-designer-item-rules.ts
@@ -401,9 +401,15 @@ export function useDesignerItemRules(designerItemContext: DesignerItemContext, d
                     break;
                 }
                 case 'tab-toolbar-item': case 'section-toolbar-item': {
-                    const parentComponentInstance = designerItemContext.parent?.parent?.componentInstance?.value;
+                    let parentComponentInstance;
+                    const parentDesignerItemContext = designerItemContext.parent?.parent;
+                    if (parentDesignerItemContext?.schema.type === 'tabs' || parentDesignerItemContext?.schema.type === 'section') {
+                        parentComponentInstance = parentDesignerItemContext.componentInstance?.value;
+                    } else {
+                        parentComponentInstance = parentDesignerItemContext?.parent?.componentInstance?.value;
+                    }
                     if (parentComponentInstance?.setComponentBasicInfoMap) {
-                        parentComponentInstance?.setComponentBasicInfoMap();
+                        parentComponentInstance.setComponentBasicInfoMap();
                     }
                 }
             }
diff --git a/packages/ui-vue/components/schema-selector/src/components/card-view.component.tsx b/packages/ui-vue/components/schema-selector/src/components/card-view.component.tsx
index 8fadf6f33ec..4a05b98f9dc 100644
--- a/packages/ui-vue/components/schema-selector/src/components/card-view.component.tsx
+++ b/packages/ui-vue/components/schema-selector/src/components/card-view.component.tsx
@@ -3,7 +3,7 @@ import { defineComponent, inject, onMounted, Ref, ref, watch } from "vue";
 import { FListView } from '../../../list-view';
 import { FPagination } from '../../../pagination';
 import { SchemaViewProps, schemaViewProps } from "./schema-view.props";
-import { GetSchemaDataFunction, SchemaRepositoryPagination } from "../composition/types";
+import { GetSchemaDataFunction } from "../composition/types";
 
 export default defineComponent({
     name: 'FSchemaSelectCardView',
@@ -21,11 +21,10 @@ export default defineComponent({
         const searchValue = inject<Ref>('F_SCHEMA_SELECTOR_SEARCH_VALUE');
         const showPagination = ref(props.pagination);
         const currentPageIndex = ref(1);
-        const totalItems = ref();
+        const totalItems = ref(0);
+        const pageSize = ref(21);
         function updateListViewDataScource(items: any[]) {
             listViewRef.value.updateDataSource(items);
-
-            totalItems.value = items.length;
         }
         watch(() => searchValue?.value, (newValue, oldValue) => {
             let resultItems = dataList.value;
@@ -37,7 +36,7 @@ export default defineComponent({
             searchResult.value = resultItems;
             updateListViewDataScource(searchResult.value);
 
-            // showPagination.value = !newValue;
+            showPagination.value = props.pagination && !newValue;
         });
         function renderListViewContent({ item, index, selectedItem }) {
             return (
@@ -55,16 +54,28 @@ export default defineComponent({
                 </div>
             );
         }
+        /** 切换页码 */
+        function onPageIndexChanged(pageInfo: { pageIndex: number }) {
+            const { pageIndex } = pageInfo;
+
+            // 计算起始、结束索引
+            const startIndex = (pageIndex - 1) * pageSize.value;
+            const endIndex = startIndex + pageSize.value;
 
+            const resultItems = dataList.value.slice(startIndex, endIndex);
+            updateListViewDataScource(resultItems);
+        }
         function renderListViewFooter() {
             return (
                 showPagination.value && <FPagination
                     style="float:right;"
                     mode="default"
+                    show-page-info={true}
                     current-page={currentPageIndex.value}
-                    page-size={21}
+                    page-size={pageSize.value}
                     total-items={totalItems.value}
-                    show-page-list={false} >
+                    show-page-list={false}
+                    onPageIndexChanged={onPageIndexChanged} >
                 </FPagination>
             );
 
@@ -81,7 +92,9 @@ export default defineComponent({
             dataList.value = data;
             searchResult.value = data;
             updateListViewDataScource(searchResult.value);
+            totalItems.value = data.length;
 
+            onPageIndexChanged({ pageIndex: 1 });
             loading.value?.close();
         }
         onMounted(() => {
diff --git a/packages/ui-vue/components/switch/src/property-config/switch.property-config.ts b/packages/ui-vue/components/switch/src/property-config/switch.property-config.ts
index a2f1d47051e..7dc109cd341 100644
--- a/packages/ui-vue/components/switch/src/property-config/switch.property-config.ts
+++ b/packages/ui-vue/components/switch/src/property-config/switch.property-config.ts
@@ -1,4 +1,4 @@
-import { FormSchemaEntityFieldTypeName } from "@/components/common";
+import { FormSchemaEntityFieldTypeName } from "@farris/ui-vue/components/common";
 import { FormPropertyChangeObject, InputBaseProperty } from "@farris/ui-vue/components/property-panel";
 
 export class SwitchProperty extends InputBaseProperty {
-- 
Gitee


From d6deafcf3efb5032961add92bf8b75f52485bd7c Mon Sep 17 00:00:00 2001
From: wang-xh <wang-xh@inspur.com>
Date: Wed, 30 Jul 2025 14:11:57 +0800
Subject: [PATCH 4/9] =?UTF-8?q?feature:=20=E6=94=AF=E6=8C=81=E8=A1=A8?=
 =?UTF-8?q?=E5=8D=95=E8=A7=86=E5=9B=BE=E5=92=8C=E4=BB=A3=E7=A0=81=E8=A7=86?=
 =?UTF-8?q?=E5=9B=BE=E5=90=8C=E6=97=B6=E8=BF=9B=E8=A1=8C=E4=BF=9D=E5=AD=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/code-view.component.tsx        | 12 ++++-
 .../composition/command.service.tsx           | 11 ++--
 .../src/components/designer.component.tsx     | 52 ++++++++++++++-----
 .../designer/src/components/types/command.ts  |  2 +-
 4 files changed, 58 insertions(+), 19 deletions(-)

diff --git a/packages/designer/src/components/components/code-view/components/code-view.component.tsx b/packages/designer/src/components/components/code-view/components/code-view.component.tsx
index 75315e983de..8723c98fa0c 100644
--- a/packages/designer/src/components/components/code-view/components/code-view.component.tsx
+++ b/packages/designer/src/components/components/code-view/components/code-view.component.tsx
@@ -114,7 +114,15 @@ export default defineComponent({
          */
         async function handleSaveBtnClicked(): Promise<void> {
             const results = await editorController.doSaveAllFile(props.directlyNotifySaveAllResults);
-            context.emit('saveAll', results);
+            context.emit('saveAll', { results });
+        }
+
+        /**
+         * 由外部触发的构件保存事件
+         */
+        async function triggerSaveAllFiles(loadingInstanceByDesigner: any): Promise<void> {
+            const results = await editorController.doSaveAllFile(props.directlyNotifySaveAllResults);
+            context.emit('saveAll', { results, triggerByDesigner: true, loadingInstanceByDesigner });
         }
 
         /**
@@ -268,7 +276,7 @@ export default defineComponent({
                 </div> */}
             </div>;
         }
-        context.expose({ refreshNavTree, open, sendNotification, openAndGoTo });
+        context.expose({ refreshNavTree, open, sendNotification, openAndGoTo, triggerSaveAllFiles });
 
         return () => {
             return (
diff --git a/packages/designer/src/components/composition/command.service.tsx b/packages/designer/src/components/composition/command.service.tsx
index 4fa5dc66715..96d482fea8a 100644
--- a/packages/designer/src/components/composition/command.service.tsx
+++ b/packages/designer/src/components/composition/command.service.tsx
@@ -82,8 +82,11 @@ export function useFormCommandService(formSchemaService: UseFormSchema, useFormS
         return commands;
     }
     /** 0.获取webcmd控制器（其参数为空）*/
-    function checkCommands(): Promise<any> {
-        const loadingInstance: any = FLoadingService.show({ message: '数据加载中，请稍候...' });
+    function checkCommands(showLoading = true): Promise<any> {
+        let loadingInstance: any;
+        if (showLoading) {
+            loadingInstance = FLoadingService.show({ message: '数据加载中，请稍候...' });
+        }
         return new Promise((resolve, reject) => {
             loadWebcmd().then((webCmds) => {
                 commands = cloneDeep(webCmds);
@@ -91,11 +94,11 @@ export function useFormCommandService(formSchemaService: UseFormSchema, useFormS
                 checkViewModelCommands(webCmds);
                 updateViewModels(webCmds);
                 syncActions();
-                loadingInstance.value?.close();
+                loadingInstance?.value?.close();
                 resolve([]);
             }).catch((error) => {
                 messageService.warning(error?.response?.data?.Message || '加载控制器失败');
-                loadingInstance.value?.close();
+                loadingInstance?.value?.close();
                 reject(error);
             });
         });
diff --git a/packages/designer/src/components/designer.component.tsx b/packages/designer/src/components/designer.component.tsx
index 89d705d728e..2068c63da96 100644
--- a/packages/designer/src/components/designer.component.tsx
+++ b/packages/designer/src/components/designer.component.tsx
@@ -123,22 +123,33 @@ export default defineComponent({
 
         /**
          * 保存表单
+         * @param needRunForm 是否需要运行表单
+         * @param triggerByCodeEditor 是否由代码编辑器触发的保存（在代码视图中点击保存按钮：先保存代码，然后触发表单的保存）
+         * @param showLoading 是否显示遮罩
          */
-        function saveFormMetadata(needRunForm: boolean = false) {
+        function saveFormMetadata(needRunForm: boolean = false, triggerByCodeEditor = false, showLoading = true) {
             if (formDesignerRef.value && !formDesignerRef.value.prepareBeforeSaveForm()) {
                 return;
             };
 
-            const loadingInstance = loadingService?.show({ message: '保存中，请稍候...' });
-            useFormMetadataComposition.saveFormMetadata().then(() => {
-                !needRunForm && notifyService.success({ message: '表单保存成功' });
-                loadingInstance.value.close();
+            let loadingInstance: any;
+            if (showLoading) {
+                loadingInstance = loadingService?.show({ message: '保存中，请稍候...' });
+            }
+            return useFormMetadataComposition.saveFormMetadata().then(async () => {
+                if (triggerByCodeEditor) {
+                    !needRunForm && notifyService.success({ message: '保存成功' });
+                    loadingInstance?.value.close();
+                } else {
+                    await codeViewComponent.value.triggerSaveAllFiles(loadingInstance);
+                }
+
                 if (needRunForm && useFormMetadataComposition.runForm) {
                     useFormMetadataComposition.runForm(loadingService, messageBoxService, designerContext, metadataPath);
                 }
             }, (error) => {
                 messageBoxService.error(error?.response?.data?.Message || '表单保存失败');
-                loadingInstance.value.close();
+                loadingInstance?.value.close();
             });
         }
 
@@ -195,12 +206,31 @@ export default defineComponent({
                 currentViewType.value = 'codeEditor';
             }
         }
-        // 代码编辑器保存的时候触发
-        function onCodeViewSaveAll(results) {
+        /**
+         * 代码视图下，保存了全部文件后事件。
+         * @param data result:各文件的保存结果；triggerByDesigner:是否由表单视图触发的保存；loadingInstanceByDesigner: 遮罩组件实例，若当前是由表单视图触发的保存，则此实例有值。
+         */
+        function onCodeViewSaveAll(data: { results: any, triggerByDesigner: boolean, loadingInstanceByDesigner: any }) {
+            const { results, triggerByDesigner, loadingInstanceByDesigner } = data;
             if (results) {
                 const successes = results.filter(item => item.success);
                 if (successes.length === results.length) {
-                    notifyService.success({ message: '保存成功' });
+                    if (triggerByDesigner) {
+                        formCommandService.checkCommands(false).then(() => {
+                            formDesignerRef.value?.reloadPropertyPanel();
+                            loadingInstanceByDesigner?.value?.close();
+                            notifyService.success({ message: '保存成功' });
+                        });
+                    } else {
+                        const loadingInstance = loadingService?.show({ message: '保存中，请稍候...' });
+                        formCommandService.checkCommands(false).then(async () => {
+                            formDesignerRef.value?.reloadPropertyPanel();
+                            await saveFormMetadata(false, !triggerByDesigner, false);
+                            loadingInstance?.value.close();
+                        }, () => {
+                            loadingInstance?.value.close();
+                        });
+                    }
                 } else {
                     const failedResults = results.filter(item => !item.success);
                     let message = '';
@@ -208,11 +238,9 @@ export default defineComponent({
                         message += `<p>${failedInfo.name} ${failedInfo.tip}</p> `;
                     });
                     messageBoxService.error(message, '');
+                    loadingInstanceByDesigner?.value?.close();
                 }
             }
-            formCommandService.checkCommands().then(() => {
-                formDesignerRef.value?.reloadPropertyPanel();
-            });
         }
 
         /**
diff --git a/packages/designer/src/components/types/command.ts b/packages/designer/src/components/types/command.ts
index fed3f344e02..d051aa13dd7 100644
--- a/packages/designer/src/components/types/command.ts
+++ b/packages/designer/src/components/types/command.ts
@@ -8,7 +8,7 @@ export interface UseCommandBuilderService {
     jumpToCodeView: (param: { tsFilePathName: string, command: WebCommand }) => void;
 }
 export interface UseFormCommandService {
-    checkCommands: () => Promise<any>;
+    checkCommands: (showLoading?: boolean) => Promise<any>;
     commandsChanged: (newController) => void;
     generateInternalCommandList: () => any;
     viewModelDisplay: () => Array<any>;
-- 
Gitee


From 5b92a7e18c70421938a1466c469970654a57c4e4 Mon Sep 17 00:00:00 2001
From: wang-xh <wang-xh@inspur.com>
Date: Wed, 13 Aug 2025 11:59:25 +0800
Subject: [PATCH 5/9] =?UTF-8?q?feature:=20=E4=BC=98=E5=8C=96=E7=BB=84?=
 =?UTF-8?q?=E4=BB=B6=E9=80=9A=E8=AE=AF=E4=BA=A4=E4=BA=92=E6=96=B9=E5=BC=8F?=
 =?UTF-8?q?=EF=BC=8C=E6=94=AF=E6=8C=81=E5=90=8C=E6=97=B6=E9=85=8D=E7=BD=AE?=
 =?UTF-8?q?=E5=91=BD=E4=BB=A4=E5=92=8C=E9=80=9A=E8=AE=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../method-list/method-list.component.tsx     |   2 +-
 .../composition/command.service.tsx           | 174 +++++++++--
 .../composition/events-editor-utils.ts        |  34 +-
 .../components/composition/use-form-schema.ts |   2 +-
 .../composition/use-form-validation.ts        |   5 +-
 .../designer/src/components/types/command.ts  |   2 +
 .../composition/data/use-data-view.ts         |   2 +-
 .../src/dynamic-view.component.tsx            |  18 +-
 .../bound-event-selector.component.tsx        | 235 +++++++++++++-
 .../bound-event-selector.css                  |  46 ++-
 .../bound-event-selector.props.ts             |   5 +-
 .../combine-command-item.component.tsx        | 201 ++++++++++++
 .../combine-form/combine-form.component.tsx   | 121 +++-----
 .../components/combine-form/combine-form.scss | 248 ++++++++-------
 .../combine-form/select-command.component.tsx | 124 +++++---
 .../select-parameter.component.tsx            |  27 +-
 .../select-source-control.component.tsx       |  83 +----
 .../select-target-form.component.tsx          | 115 -------
 .../combine-form/use-communication.ts         | 209 ++++++++++---
 .../command-source.component.tsx              |  21 +-
 .../command-source/command-source.props.ts    |   5 +-
 .../interaction-button.component.tsx          |  42 ++-
 .../interaction-item.component.tsx            | 292 ++++++++++++++----
 .../parameter-editor.component.tsx            |  41 +--
 .../parameter-editor/parameter-editor.css     |  15 +-
 .../parameter-editor.props.ts                 |   4 +-
 .../events-editor/src/composition/types.ts    |   6 +-
 .../src/composition/use-interaction.ts        |  32 +-
 .../src/composition/use-methods.ts            |  23 +-
 .../src/events-editor.component.tsx           |  52 +++-
 .../events-editor/src/events-editor.css       |   4 +-
 .../components/events-editor/src/types.ts     |   5 +-
 .../external-container.design.component.tsx   |   6 +-
 .../external-container.property-config.ts     |  12 +-
 .../schema-selector/src/schema-selector.css   |   4 +-
 35 files changed, 1504 insertions(+), 713 deletions(-)
 create mode 100644 packages/ui-vue/components/events-editor/src/components/combine-form/combine-command-item.component.tsx
 delete mode 100644 packages/ui-vue/components/events-editor/src/components/combine-form/select-target-form.component.tsx

diff --git a/packages/designer/src/components/components/view-model-designer/method-manager/components/method-list/method-list.component.tsx b/packages/designer/src/components/components/view-model-designer/method-manager/components/method-list/method-list.component.tsx
index 1b2527f1656..8476e6ccb26 100644
--- a/packages/designer/src/components/components/view-model-designer/method-manager/components/method-list/method-list.component.tsx
+++ b/packages/designer/src/components/components/view-model-designer/method-manager/components/method-list/method-list.component.tsx
@@ -134,7 +134,7 @@ export default defineComponent({
             if (!controllerLabel) {
                 return false;
             }
-            return controllerLabel.indexOf(useFormSchemaComposition.getModule().code) > -1
+            return controllerLabel.indexOf(useFormSchemaComposition.getModule().code) > -1;
         };
 
         function onViewMethodSource($event) {
diff --git a/packages/designer/src/components/composition/command.service.tsx b/packages/designer/src/components/composition/command.service.tsx
index 4fa5dc66715..627f63ec710 100644
--- a/packages/designer/src/components/composition/command.service.tsx
+++ b/packages/designer/src/components/composition/command.service.tsx
@@ -17,6 +17,7 @@ import { ParamConfig } from "../components/view-model-designer/method-manager/en
 import { CallbackFn, useComponentProvider } from './use-component-provider';
 
 import { DesignerMode } from "../types/designer-context";
+import { Communication } from '@farris/ui-vue/components/events-editor';
 
 export function useFormCommandService(formSchemaService: UseFormSchema, useFormStateMachineComposition: UseFormStateMachine, loadingService: FLoadingService, webCmpBuilderService: UseCommandBuilderService): UseFormCommandService {
     const { externalComponentProps, externalComponents, externalParamterEditor } = useComponentProvider();
@@ -627,27 +628,81 @@ export function useFormCommandService(formSchemaService: UseFormSchema, useFormS
         });
         checkViewModelCommands(commands);
     }
-    function generateCommunication(propertyData: any, event, events) {
-        const eventLabel = propertyData[event.label];
-        const communicationIds = eventLabel.slice(eventLabel.indexOf(':') + 1, eventLabel.length);
-        const communicationIdArray = communicationIds.split(';');
-        communicationIdArray.forEach(communicationId => {
-            const boundEventsListItem = {
-                command: {},
-                controller: {},
-                boundEvents: {},
-                communication: {
-                    id: communicationId,
+    /**
+     * 将同源的通讯配置合并为一个交互
+     */
+    function groupCommunicationBySource(communicationIdArray: string[]) {
+        const allCommunications = formSchemaService.getFormSchema().module.communications;
+        const currentCommunications = allCommunications?.filter(item => communicationIdArray.includes(item.id));
+        // 创建映射表，key为source的唯一标识，value为该组的通信项数组
+        const groups: Record<string, any[]> = {};
+        if (currentCommunications?.length) {
+            for (const comm of currentCommunications) {
+                const { formId, componentId, event, formCode, externalContainerId } = comm.source;
+                const key = [formId, componentId, event, formCode || '', externalContainerId || ''].join('|');
+                if (!groups[key]) {
+                    groups[key] = [];
                 }
-            };
-            events.forEach(each => {
-                if (each.label === event.label) { boundEventsListItem.boundEvents = cloneDeep(each); }
-            });
+                groups[key].push({ id: comm.id });
+            }
+        }
+        return Object.values(groups);
+    }
+    /**
+     * 组装控件的通讯类交互事件
+     */
+    function generateCommunication(event, events, communication: string) {
+        if (communication) {
+            const communicationIds = communication.replace(/communication:/g, '');
+            const communicationIdArray = communicationIds.split(';');
 
-            boundEventsList.push(cloneDeep(boundEventsListItem));
-        });
+            // 对于外部容器配置的通讯，将同源的通讯合并为一个交互，不同源的通讯是多条交互；
+            // 对于当前表单控件配置的通讯（已经是同源了），认为是一个交互下的多条通讯
+            if (event.label === 'onCommunication') {
+                const groupedCommunications = groupCommunicationBySource(communicationIdArray);
+                groupedCommunications.map((item) => {
+                    const boundEventsListItem = {
+                        command: {},
+                        controller: {},
+                        boundEvents: {},
+                        communication: item
+                    };
+                    events.forEach(each => {
+                        if (each.label === event.label) { boundEventsListItem.boundEvents = cloneDeep(each); }
+                    });
+                    boundEventsList.push(cloneDeep(boundEventsListItem));
+                });
 
+            } else {
+                return communicationIdArray.map(communicationId => { return { id: communicationId }; });
+            }
+        }
     }
+
+    /**
+     * 从控件schema中解析某一事件绑定的命令值和通讯值。因为事件中可能同时绑定命令和组件通讯
+     * @param propertyData 控件schema
+     * @param eventLabel 事件编号
+     */
+    function splitCommandAndCommunicationFromEvent(propertyData: any, eventLabel: string) {
+        if (!propertyData[eventLabel]) {
+            return { command: '', communication: '' };
+        }
+        let commandValue = propertyData[eventLabel];
+        let communicationValue = '';
+        if (propertyData[eventLabel].includes('communication:')) {
+            const valueArray = propertyData[eventLabel].split(';') || [];
+            const communicationItems = valueArray.filter(item => item.includes('communication:'));
+            const commandValueItems = valueArray.filter(item => !item.includes('communication:'));
+            if (communicationItems.length > 0) {
+                communicationValue = communicationItems.join(';');
+                commandValue = commandValueItems.join(';');
+            }
+        }
+
+        return { command: commandValue, communication: communicationValue };
+    }
+
     /** 
      * 事件面板调用-1
      * a. 合并视图模型带参数的命令&控制器中无参数的命令
@@ -659,14 +714,36 @@ export function useFormCommandService(formSchemaService: UseFormSchema, useFormS
         // 1. 遍历当前container的组件dom结构的所有事件的值
         events.forEach(event => {
             if (propertyData[event.label]) {
-                if (propertyData[event.label].includes('communication:')) {
-                    generateCommunication(propertyData, event, events);
-                    return;
+                const { command, communication } = splitCommandAndCommunicationFromEvent(propertyData, event.label);
+                const boundEventsListItem: any = {
+                    command: {
+                    },
+                    controller: {
+                    },
+                    boundEvents: {
+                    },
+                    communication: []
+                };
+                events.forEach(each => {
+                    if (each.label === event.label) { boundEventsListItem.boundEvents = cloneDeep(each); }
+                });
+                if (command) {
+                    // 三段式path：root-viewmodel.items-component-viewmodel.itemsAddItem1 或 一段path：itemsAddItem1
+                    const paths = command.includes('.') ? command.split('.') : undefined;
+                    const { recordCommand, recordController } = handleParams(viewModelData, paths, command, viewModelId, allComponentList);
+                    const commandItem = generateBoundEventsList(event, events, recordController, recordCommand);
+                    if (commandItem) {
+                        Object.assign(boundEventsListItem, commandItem);
+                    }
+                }
+                const communicationItems = generateCommunication(event, events, communication);
+                if (communicationItems?.length) {
+                    boundEventsListItem.communication = communicationItems;
+                }
+
+                if (boundEventsListItem.command?.id || boundEventsListItem.communication?.length) {
+                    boundEventsList.push(boundEventsListItem);
                 }
-                // 三段式path：root-viewmodel.items-component-viewmodel.itemsAddItem1 或 一段path：itemsAddItem1
-                const paths = propertyData[event.label].includes('.') ? propertyData[event.label].split('.') : undefined;
-                const { recordCommand, recordController } = handleParams(viewModelData, paths, propertyData[event.label], viewModelId, allComponentList);
-                generateBoundEventsList(event, events, recordController, recordCommand);
             }
         });
         return boundEventsList;
@@ -821,7 +898,7 @@ export function useFormCommandService(formSchemaService: UseFormSchema, useFormS
             });
             boundEventsListItem.controller = cloneDeep(recordController.controllerName);
             boundEventsListItem.command = cloneDeep(recordCommand);
-            boundEventsList.push(cloneDeep(boundEventsListItem));
+            return boundEventsListItem;
         }
     }
 
@@ -832,10 +909,11 @@ export function useFormCommandService(formSchemaService: UseFormSchema, useFormS
         const viewModelData = cloneDeep(formSchemaService.getViewModels());
         events.forEach(event => {
             // 1. 遍历当前container的dom结构的所有事件的值
-            if (propertyData[event.label] && !propertyData[event.label].includes('communication:')) {
+            const { command: commandValue } = splitCommandAndCommunicationFromEvent(propertyData, event.label);
+            if (commandValue) {
                 // 三段式path：root-viewmodel.items-component-viewmodel.itemsAddItem1 或 一段path：itemsAddItem1
-                const paths = propertyData[event.label].includes('.') ? propertyData[event.label].split('.') : undefined;
-                handleViewModel(viewModelData, paths, propertyData[event.label], viewModelId, domActions, propertyData);
+                const paths = commandValue.includes('.') ? commandValue.split('.') : undefined;
+                handleViewModel(viewModelData, paths, commandValue, viewModelId, domActions, propertyData);
             }
         });
         formSchemaService.setViewmodels(cloneDeep(viewModelData));
@@ -1104,6 +1182,40 @@ export function useFormCommandService(formSchemaService: UseFormSchema, useFormS
         }
         return suffix;
     }
+
+    /**
+     * 设置控件的事件属性（将普通命令和组件通讯合并，以逗号分隔）
+     * @param controlSchema 控件schmea
+     * @param eventLabel 控件事件编号
+     * @param newCommandValue 新命令值，为空字符串代表清空值，为null代表保留已有命令
+     * @param newCommunicationValue 新组件通讯值，为空字符串代表清空值，为null代表保留已有通讯
+     */
+    function setControlEventValue(controlSchema: any, eventLabel: string, newCommandValue: any, newCommunicationValue: any) {
+        let commandValue = '';
+        let communicationValue = '';
+        const valueArray = controlSchema[eventLabel] ? controlSchema[eventLabel].split(';') : [];
+
+        if (controlSchema[eventLabel]?.includes('communication:')) {
+            communicationValue = valueArray.filter(item => item.startsWith('communication:')).join(';');
+        }
+        commandValue = (controlSchema[eventLabel] || '').replace(communicationValue, '').replace(';', '');
+
+        if (newCommandValue !== null && newCommandValue !== undefined) {
+            commandValue = newCommandValue;
+        }
+        if (newCommunicationValue !== null && newCommunicationValue !== undefined) {
+            communicationValue = newCommunicationValue;
+        }
+        const newValueArray: any = [];
+        if (commandValue) {
+            newValueArray.push(commandValue);
+        }
+        if (communicationValue) {
+            newValueArray.push(communicationValue);
+        }
+        controlSchema[eventLabel] = newValueArray.join(';');
+
+    }
     /**
      * 代码视图返回新增方法的编号、名称后，由设计器将方法添加到控件上
      * @param methodCode 新增方法的编号
@@ -1125,7 +1237,7 @@ export function useFormCommandService(formSchemaService: UseFormSchema, useFormS
         methodCode = codeSuffix > 0 ? methodCode + codeSuffix : methodCode;
         methodName = codeSuffix > 0 ? methodName + codeSuffix : methodName;
         // 1、控件绑定命令
-        newControllerMethodBindingInfo.controlData[eventCode] = methodCode;
+        setControlEventValue(newControllerMethodBindingInfo.controlData, eventCode, methodCode, null);
 
         // 2、控件绑定命令后，可能会需要联动其他属性的变更
         if (newControllerMethodBindingInfo.setPropertyRelates) {
@@ -1298,6 +1410,8 @@ export function useFormCommandService(formSchemaService: UseFormSchema, useFormS
         checkCommands, commandsChanged, generateInternalCommandList, viewModelDisplay, findParamtersPosition, addControllerMethod, viewModelDomChanged, getCommands, bindNewMethodToControl, getInternalControllerFromControllerMetadata, getSupportedControllerMetadata,
         getEventParameterGeneralData, webCmpBuilderService, syncActions,
         findBoundEvent,
-        getUniqueEvent
+        getUniqueEvent,
+        setControlEventValue,
+        splitCommandAndCommunicationFromEvent
     };
 }
diff --git a/packages/designer/src/components/composition/events-editor-utils.ts b/packages/designer/src/components/composition/events-editor-utils.ts
index 67a866b13b0..b609bf797a7 100644
--- a/packages/designer/src/components/composition/events-editor-utils.ts
+++ b/packages/designer/src/components/composition/events-editor-utils.ts
@@ -81,7 +81,6 @@ export function useEventsEditorUtils(commandService: UseFormCommandService, form
         if (parameters.isAddControllerMethod) {
 
             if (!parameters.controlInfo && propertyData.type) {
-                // parameters.controlInfo = { type: propertyData.type, name: DgControl[propertyData.type] && DgControl[propertyData.type].name };
                 parameters.controlInfo = { type: propertyData.type, name: propertyData.type };
             }
 
@@ -186,6 +185,7 @@ export function useEventsEditorUtils(commandService: UseFormCommandService, form
         });
         return actions;
     }
+
     /**
      * 将组件通讯数据保存到控件dom中
      */
@@ -195,43 +195,47 @@ export function useEventsEditorUtils(commandService: UseFormCommandService, form
                 return eventItem.boundEvents.label === event.label;
             }
         });
-        if (data[event.label] && data[event.label].includes('communication:')) {
-            data[event.label] = null;
-        }
+        const communicationIds: string[] = [];
+
         if (relatedBoundList.length) {
-            const communicationIds: string[] = [];
             relatedBoundList.map(boundCommunication => {
-                if (boundCommunication.communication) {
-                    communicationIds.push(boundCommunication.communication.id);
-                    deleteActionItem(data.id, event.label);
+                if (boundCommunication.communication?.length) {
+                    boundCommunication.communication.map((item) => {
+                        communicationIds.push(`communication:${item.id}`);
+                    });
                     return;
                 }
             });
             if (communicationIds.length) {
-                data[event.label] = `communication:${communicationIds.join(';')}`;
+                commandService.setControlEventValue(data, event.label, null, communicationIds.join(';'));
+            } else {
+                commandService.setControlEventValue(data, event.label, null, '');
             }
+        } else {
+            commandService.setControlEventValue(data, event.label, null, '');
         }
     }
     /** 增删改组件dom中事件绑定值 */
     function eventsValueChanged(data, actions, eventList, parameters) {
         // 增加或修改：data[事件id] = 'viewModelId.targetComponent-viewModelId.command';
         actions.sourceComponent.map.forEach(mapItem => {
+            let newCommandValue;
             // 判断是存储为三段path或一段path
             if (mapItem.targetComponent.viewModelId && (actions.sourceComponent.viewModelId !== mapItem.targetComponent.viewModelId)) {
-                data[mapItem.event.label] = cloneDeep(`root-viewmodel.${mapItem.targetComponent.viewModelId}.${mapItem.command.label}`);
+                newCommandValue = cloneDeep(`root-viewmodel.${mapItem.targetComponent.viewModelId}.${mapItem.command.label}`);
             } else {
-                data[mapItem.event.label] = cloneDeep(`${mapItem.command.label}`);
+                newCommandValue = cloneDeep(`${mapItem.command.label}`);
             }
+            commandService.setControlEventValue(data, mapItem.event.label, newCommandValue, null);
+
         });
         /** 删除 data[事件id] = null */
         eventList.forEach(event => {
             resolveCommunicationValue(data, event, parameters);
-            if (data[event.label]?.includes('communication:')) {
-                return;
-            }
+
             const exist = actions.sourceComponent.map.find(mapItem => mapItem.event.label === event.label);
             if (!exist) {
-                data[event.label] = null;
+                commandService.setControlEventValue(data, event.label, '', null);
                 deleteActionItem(data.id, event.label);
             }
         });
diff --git a/packages/designer/src/components/composition/use-form-schema.ts b/packages/designer/src/components/composition/use-form-schema.ts
index 84dc6ced8a3..47c631d8f47 100644
--- a/packages/designer/src/components/composition/use-form-schema.ts
+++ b/packages/designer/src/components/composition/use-form-schema.ts
@@ -1260,7 +1260,7 @@ export function useFormSchema(): UseFormSchema {
             Object.keys(controlEventPropertyIDList).forEach(propertyId => {
                 const propertyValue = componentSchema[propertyId];
                 if (propertyValue && propertyValue.includes('communication:')) {
-                    const communicationIds = propertyValue.replace('communication:', '').split(';');
+                    const communicationIds = propertyValue.replace(/communication:/g, '').split(';');
                     formSchema.module.communications = formSchema.module.communications?.filter(communication => !communicationIds.includes(communication.id));
                 }
             });
diff --git a/packages/designer/src/components/composition/use-form-validation.ts b/packages/designer/src/components/composition/use-form-validation.ts
index edeeb22b997..5931eae4032 100644
--- a/packages/designer/src/components/composition/use-form-validation.ts
+++ b/packages/designer/src/components/composition/use-form-validation.ts
@@ -123,12 +123,13 @@ export function useFormValidation(useFormSchema: UseFormSchema, formCommandServi
      * 校验控件的组件通讯配置是否完整
      */
     function checkCommunicationValid(boundEvent: any) {
-        const { commandLabel } = boundEvent;
+        const { commandLabel, eventLabel } = boundEvent;
+        const { communication } = formCommandService.splitCommandAndCommunicationFromEvent({ [eventLabel]: commandLabel }, eventLabel);
         const controlInfo = useFormSchema.getControlBasicInfoMap().get(boundEvent.id);
         // 控件名称
         const controlName = (controlInfo && controlInfo.parentPathName) || boundEvent.id;
 
-        const communicationIds = commandLabel.replace('communication:', '').split(';');
+        const communicationIds = communication.replace(/communication:/g, '').split(';');
         if (communicationIds?.length) {
             const communications = useFormSchema.getFormSchema().module.communications || [];
             for (const communicationId of communicationIds) {
diff --git a/packages/designer/src/components/types/command.ts b/packages/designer/src/components/types/command.ts
index fed3f344e02..d92ad4959ce 100644
--- a/packages/designer/src/components/types/command.ts
+++ b/packages/designer/src/components/types/command.ts
@@ -24,6 +24,8 @@ export interface UseFormCommandService {
     syncActions: () => any;
     findBoundEvent: (components: any[], findEvents: any[], viewModelId: string, excludedEvents?: string[]) => any;
     getUniqueEvent: (allBoundEvents: any[]) => any[];
+    setControlEventValue: (controlSchema: any, eventLabel: string, newCommandValue: any, newCommunicationValue: any) => void;
+    splitCommandAndCommunicationFromEvent: (propertyData: any, eventLabel: string) => { command: string, communication: string };
 }
 
 
diff --git a/packages/ui-vue/components/data-view/composition/data/use-data-view.ts b/packages/ui-vue/components/data-view/composition/data/use-data-view.ts
index a1f6bd0a79f..d480277c271 100644
--- a/packages/ui-vue/components/data-view/composition/data/use-data-view.ts
+++ b/packages/ui-vue/components/data-view/composition/data/use-data-view.ts
@@ -41,7 +41,7 @@ export function useDataView(
     const sorters = ref<DataViewSorter[]>([]);
     const groupComposition = useGroupData(props, useIdentifyCompostion);
     const { generateGroupData, groupFields, shouldGroupingData } = groupComposition;
-    const originalData = ref(props.data);
+    const originalData = ref(props.data||[]);
     const hierarchyDataComposition = useHierarchyData(props, originalData, useHierarchyCompostion, useIdentifyCompostion);
     const { collapseTo: collpaseToLayer, expandTo: expandToLayer, generateHierarchyData, hasRealChildren, insertSibling, insertChild,
         insertChildren, isVisibleInTree,
diff --git a/packages/ui-vue/components/dynamic-view/src/dynamic-view.component.tsx b/packages/ui-vue/components/dynamic-view/src/dynamic-view.component.tsx
index 214b5240826..1dc39883a9e 100644
--- a/packages/ui-vue/components/dynamic-view/src/dynamic-view.component.tsx
+++ b/packages/ui-vue/components/dynamic-view/src/dynamic-view.component.tsx
@@ -404,15 +404,21 @@ const FDynamicView = defineComponent({
             }
             convertModelValueToProps(viewSchema);
         });
+        function resolveInitialSchema(newSchema: any) {
+            if (newSchema) {
+                schema.value = newSchema;
+                const viewSchema = getFrameComponentSchema();
+                if (!viewSchema) {
+                    return;
+                }
+                convertSchemaToProps(viewSchema);
+            }
 
+        }
         watch(() => props.schema, (newSchema) => {
-            schema.value = newSchema;
-            const viewSchema = getFrameComponentSchema();
-            if (!viewSchema) {
-                return;
-            }
-            convertSchemaToProps(viewSchema);
+            resolveInitialSchema(newSchema);
         });
+        resolveInitialSchema(props.schema);
 
         setupContext.expose({ componentManager, rerender, getProps, invoke, setProps, selectItemById, getSchema, setSchema, convertPartialSchemaToProps, getControlValue });
 
diff --git a/packages/ui-vue/components/events-editor/src/components/bound-event-selector/bound-event-selector.component.tsx b/packages/ui-vue/components/events-editor/src/components/bound-event-selector/bound-event-selector.component.tsx
index 346f34f132c..632c974c14c 100644
--- a/packages/ui-vue/components/events-editor/src/components/bound-event-selector/bound-event-selector.component.tsx
+++ b/packages/ui-vue/components/events-editor/src/components/bound-event-selector/bound-event-selector.component.tsx
@@ -1,4 +1,4 @@
-import { SetupContext, defineComponent, ref, onBeforeMount, inject } from "vue";
+import { SetupContext, defineComponent, ref, onBeforeMount, inject, computed } from "vue";
 import { boundEventSelectorProps, BoundEventSelectorProps } from "./bound-event-selector.props";
 import FInputGroup from '@farris/ui-vue/components/input-group';
 import { cloneDeep } from "lodash-es";
@@ -16,8 +16,15 @@ export default defineComponent({
         const viewModelDisplay = ref();
         const viewModelData = ref<any>([]);
         const groupIcon = ref('<i class="f-icon f-icon-search"></i>');
+        const formMetaBasicInfo = props.useFormSchema.getFormMetadataBasicInfo();
         const searchValue = ref('');
         const selectedCommand = ref();
+        /** 是否显示左侧页面列表。在组合表单场景中已有方法可以选择当前页面下的方法或者子表单下的方法 */
+        const shouldShowPageList = ref(props.useFormSchema.externalFormSchema?.size > 0);
+        /** 当前选中的页面 */
+        const selectedForm = ref();
+        /** 外部页面的方法 */
+        const methodsFromCombineForm: any = ref([]);
 
         onBeforeMount(() => {
             if (props.getEventPath) {
@@ -34,8 +41,9 @@ export default defineComponent({
 
             }
         });
-        /** 匹配满足条件的方法并显示 */
-        function matchCommand(changeValue = '') {
+
+        /** 搜索当前页面的命令 */
+        function matchCommandInCurrentForm(changeValue = '') {
             changeValue = changeValue.replace(/ /g, '').replace(/>/g, '').toLowerCase();
             if (changeValue === '') {
                 changeValue = ' ';
@@ -57,20 +65,66 @@ export default defineComponent({
 
         }
 
+        /** 搜索子表单下的命令 */
+        function matchCommandInCombinedForm(changeValue = '') {
+            changeValue = changeValue.replace(/ /g, '').replace(/>/g, '').toLowerCase();
+            methodsFromCombineForm.value.forEach(mapItem => {
+                if (!mapItem.isCommandNode) {
+                    return;
+                }
+                const methodNameString = mapItem.name || '';
+                const methodCodeString = mapItem.code || '';
+                const methodViewmodelString = mapItem.viewmodelName || '';
+                const searchContent = `${methodNameString}${methodCodeString}${methodViewmodelString}`.toLowerCase();
+                if (changeValue && !searchContent.includes(changeValue)) {
+                    mapItem['hide'] = true;
+                } else {
+                    mapItem['hide'] = false;
+                }
+            });
+        }
+
+        /** 触发搜索 */
+        function onSearch(changeValue = '') {
+            if (!selectedForm.value || selectedForm.value.id === formMetaBasicInfo.id) {
+                matchCommandInCurrentForm(changeValue);
+            } else {
+                matchCommandInCombinedForm(changeValue);
+            }
+        }
+
+        /** 渲染搜索条 */
         function renderViewModelSearchBar() {
-            return (
-                <div class="f-vm-search">
-                    <div class="f-vm-searchBar">
-                        <FInputGroup updateOn='change' groupText={groupIcon.value} v-model={searchValue.value}
-                            onChange={matchCommand} ></FInputGroup>
-                    </div>
+            const searchBar = <div class="f-vm-search">
+                <div class="f-vm-searchBar">
+                    <FInputGroup updateOn='change' groupText={groupIcon.value} v-model={searchValue.value}
+                        onChange={onSearch} placeholder="请输入名称/编号/路径搜索"></FInputGroup>
                 </div>
-            );
+            </div>;
+
+            if (shouldShowPageList.value) {
+                return (
+                    <div class="f-navSelector-header">
+                        <div class="f-navSelector-recommand">
+                            <div class="f-navSelector-recommand-text">方法列表</div>
+                        </div>
+                        <div class="f-navSelector-remainder">
+                            <div class="f-vm-search">
+                                {searchBar}
+                            </div>
+                        </div>
+                    </div>
+
+                );
+            } else {
+                return searchBar;
+            }
+
         }
 
         function viewModelItemClass(mapItem: any) {
             const classObject = {
-                'f-vm-item': !mapItem.active,
+                'f-vm-item': true,
                 'f-vm-item-focus': mapItem.active
             } as Record<string, boolean>;
             return classObject;
@@ -131,7 +185,7 @@ export default defineComponent({
 
         function renderViewModels() {
             return viewModelData.value.length > 0 &&
-                <div class="f-vm-viewModel">
+                <div class="f-vm-viewModel flex-fill">
                     {viewModelData.value.map((viewModelDataItem: any) => {
                         return renderViewModelMapItem(viewModelDataItem);
                     })}
@@ -149,14 +203,163 @@ export default defineComponent({
                 return;
             }
             context.emit('submit', {
-                selectedCommand: selectedCommand.value
+                selectedCommand: selectedCommand.value,
+                selectedForm: selectedForm.value
+            });
+        }
+        /** 组装目标页面数据列表 */
+        function getPageFormData() {
+            const externalFormMap = props.useFormSchema.externalFormSchema;
+            const targetForms: any = [];
+
+            targetForms.push({
+                containerId: '',
+                id: formMetaBasicInfo.id,
+                code: formMetaBasicInfo.code,
+                name: formMetaBasicInfo.name
+            });
+            Array.from(externalFormMap.keys()).forEach(containerId => {
+                const formItem = externalFormMap.get(containerId);
+                targetForms.push({
+                    containerId,
+                    id: formItem.id,
+                    code: formItem.code,
+                    name: formItem.name
+                });
+
+            });
+            return targetForms;
+        }
+
+        const panelClass = computed(() => {
+            return {
+                'f-vm-all': true,
+                ' h-100': true,
+                'has-page-list': shouldShowPageList.value
+            }
+        });
+        /** 获取所有模型下的命令 */
+        function getAllCommands(formSchema: any) {
+            const { viewmodels: viewModels, components } = formSchema.module;
+            if (viewModels?.length === 0 || components?.length === 0) {
+                return [];
+            }
+            methodsFromCombineForm.value = [];
+            const viewModelNameResolver = props.sourceCommunication?.parameterData?.getViewModelName;
+            viewModels.forEach(viewModel => {
+                if (!viewModel || !viewModel.commands || viewModel.commands.length === 0) {
+                    return [];
+                }
+                const component = components.find(item => item.viewModel === viewModel.id);
+                const viewModelName = viewModelNameResolver && component ? viewModelNameResolver(component, viewModel.name) : '';
+                methodsFromCombineForm.value.push({
+                    id: viewModel.id, code: viewModel.code, name: viewModelName || viewModel.name
+                });
+                viewModel.commands.forEach(command => {
+                    if (!command.isInvalid) {
+                        methodsFromCombineForm.value.push({ ...command, viewmodelId: viewModel.id, viewmodelName: viewModelName || viewModel.name, isCommandNode: true });
+                    }
+                });
+
             });
         }
+
+        /** 切换目标页面 */
+        function onChangeFormPage(form) {
+            if (form.id === selectedForm.value.id) {
+                return;
+            }
+            selectedForm.value = form;
+            // 清除搜索项
+            searchValue.value = '';
+            // 清除已选方法
+            selectedCommand.value = null;
+
+            // 切换到子表单时，组装子表单内的模型方法
+            if (selectedForm.value.id !== formMetaBasicInfo.id) {
+                const targetFormSchema = props.useFormSchema.externalFormSchema?.get(selectedForm.value?.containerId);
+                if (targetFormSchema?.content?.module) {
+                    getAllCommands(targetFormSchema.content);
+                }
+            } else {
+                viewModelData.value.map((viewModelDataItem: any) => {
+                    viewModelDataItem.sourceComponent.map.map(mapItem => mapItem.active = false);
+                });
+            }
+        }
+        /** 渲染左侧页面列表 */
+        function renderFormPageList() {
+            const targetForms = getPageFormData();
+            if (!selectedForm.value) {
+                selectedForm.value = targetForms[0];
+            }
+
+            const pageItemClass = computed(() => (item: any) => {
+                return {
+                    'f-list-view-group-item': true,
+                    'f-listview-active': item.id === selectedForm.value?.id
+                };
+            });
+            return <div class="f-page-nav">
+                <div class="f-list-view">
+                    <div class="f-list-view-content">
+                        <ul class="f-list-view-group" style="list-style: none;">
+                            {targetForms.map(form => {
+                                return <li class={pageItemClass.value(form)} onClick={() => onChangeFormPage(form)}>
+                                    <div class="f-list-content">
+                                        <div class="f-navSelector-leftCategory" title={form.name}>{form.name}</div>
+                                    </div>
+                                </li>;
+                            })}
+
+                        </ul>
+                    </div>
+                </div>
+            </div>;
+        }
+
+        /** 选中外部表单的方法 */
+        function onSelectMethodFromCombineForm(method: any) {
+            methodsFromCombineForm.value.map(item => item.active = false);
+            method.active = true;
+            selectedCommand.value = method;
+        }
+        function renderMethodsFromCombineForm() {
+
+            return <div class="f-vm-viewModel flex-fill">
+                {methodsFromCombineForm.value.filter(method => !method.hide).map(method => {
+                    if (method.isCommandNode) {
+                        return <div class={viewModelItemClass(method)} onClick={() => onSelectMethodFromCombineForm(method)}>
+                            <div class="f-event-commandItem">
+                                <div class="f-icon-command">
+                                    <div class="f-icon f-icon-source-code" style="font-size: 10px; color: rgb(48, 180, 113);">
+                                    </div>
+                                </div>
+                                <div class="f-event-func">{method.name}({method.code})</div>
+                            </div>
+                            <div class="f-event-path">{method.viewmodelName}</div>
+                        </div>;
+                    }
+
+                })}
+            </div>;
+        }
+
         return () => {
             return (
-                <div class="f-vm-all">
-                    {renderViewModelSearchBar()}
-                    {renderViewModels()}
+                <div class={panelClass.value}>
+                    <div class="d-flex f-utils-fill-flex-row splitter">
+                        {shouldShowPageList.value ? renderFormPageList() : ''}
+                        <div class="f-utils-fill-flex-column">
+                            {renderViewModelSearchBar()}
+                            {!selectedForm.value || selectedForm.value.id === formMetaBasicInfo.id ?
+                                renderViewModels() :
+                                renderMethodsFromCombineForm()
+                            }
+
+                        </div>
+
+                    </div>
                     <div class="modal-footer">
                         <button type="button" class="btn btn-secondary" onClick={onCancel}>取消</button>
                         <button type="button" class="btn btn-primary" onClick={onSubmit}>确定</button>
diff --git a/packages/ui-vue/components/events-editor/src/components/bound-event-selector/bound-event-selector.css b/packages/ui-vue/components/events-editor/src/components/bound-event-selector/bound-event-selector.css
index 1f67d8d9531..3529a5c4c22 100644
--- a/packages/ui-vue/components/events-editor/src/components/bound-event-selector/bound-event-selector.css
+++ b/packages/ui-vue/components/events-editor/src/components/bound-event-selector/bound-event-selector.css
@@ -10,7 +10,6 @@
     height: 60px;
     background-color: #fff;
     width: 96%;
-    z-index: 2;
     margin: 0px 2%;
 }
 
@@ -22,6 +21,7 @@
     display: block;
     overflow: auto;
     flex: 1;
+    overflow: auto;
 }
 
 .f-vm-viewModel>:first-child {
@@ -126,17 +126,45 @@ input::-webkit-input-placeholder {
 }
 
 .f-vm-item-focus {
-    border-bottom: 1px solid #e5e9ef;
-    border-left: 1px solid #e5e9ef;
-    border-right: 1px solid #e5e9ef;
     background-color: #EDF5FC !important;
-    margin: 0px 30px;
 }
 
 .f-vm-item-focus:hover {
-    border-bottom: 1px solid #e5e9ef;
-    border-left: 1px solid #e5e9ef;
-    border-right: 1px solid #e5e9ef;
     background-color: #EDF5FC !important;
-    margin: 0px 30px;
+}
+
+.f-vm-all.has-page-list .f-vm-search {
+    height: auto;
+    background-color: transparent;
+    width: 300px;
+    float: right;
+    margin-right: 0px;
+}
+
+.f-vm-all.has-page-list .splitter {
+    margin: 0 24px;
+    border: 1px solid #e5e9ef;
+    border-radius: 8px;
+}
+
+.f-vm-all.has-page-list .f-vm-item {
+    margin: 0px;
+    border-radius: 0 !important;
+    border-left: 0 !important;
+    border-right: 0;
+}
+
+.f-page-nav {
+    width: 200px;
+    height: 100%;
+    border-right: 1px solid #e5e9ef;
+    padding-top: 6px;
+    overflow-y: auto;
+}
+
+.f-vm-all.has-page-list .methods-list {
+    padding: 10px 20px 10px
+}
+.f-vm-all.has-page-list .f-list-view-group-item{
+    margin-bottom: 5px;
 }
\ No newline at end of file
diff --git a/packages/ui-vue/components/events-editor/src/components/bound-event-selector/bound-event-selector.props.ts b/packages/ui-vue/components/events-editor/src/components/bound-event-selector/bound-event-selector.props.ts
index bfc533bc4e8..29a91c06e40 100644
--- a/packages/ui-vue/components/events-editor/src/components/bound-event-selector/bound-event-selector.props.ts
+++ b/packages/ui-vue/components/events-editor/src/components/bound-event-selector/bound-event-selector.props.ts
@@ -2,7 +2,10 @@ import { ExtractPropTypes } from "vue";
 
 export const boundEventSelectorProps = {
     getEventPath: { type: Function, default: null },
-    notifyService: { type: Object }
+    notifyService: { type: Object },
+    useFormSchema: { type: Object },
+    /** 通讯来源 */
+    sourceCommunication: { type: Object, default: {} }
 } as Record<string, any>;
 
 export type BoundEventSelectorProps = ExtractPropTypes<typeof boundEventSelectorProps>;
diff --git a/packages/ui-vue/components/events-editor/src/components/combine-form/combine-command-item.component.tsx b/packages/ui-vue/components/events-editor/src/components/combine-form/combine-command-item.component.tsx
new file mode 100644
index 00000000000..8b8edab895f
--- /dev/null
+++ b/packages/ui-vue/components/events-editor/src/components/combine-form/combine-command-item.component.tsx
@@ -0,0 +1,201 @@
+import { SetupContext, defineComponent, ref, inject, computed, onMounted, watch, Ref } from "vue";
+import { Communication } from "./types";
+import { combineFormProps, CombineFormProps } from './combine-form.props';
+
+/**
+ * 展示组合通讯中的目标页面和目标命令
+ */
+export default defineComponent({
+    name: 'FCommunicationCommandItem',
+    props: combineFormProps,
+    emits: ['addParameter', 'deleteCommand', 'toggleParameterPanel'] as (string[] & ThisType<void>) | undefined,
+    setup(props: CombineFormProps, context: SetupContext) {
+        const communication = ref(props.communication) as Ref<Communication>;
+        const useFormSchema = inject('useFormSchema') as any;
+        const formMetaBasicInfo = useFormSchema.getFormMetadataBasicInfo();
+        /** 目标页面列表数据 */
+        const targetForms: any = ref([]);
+        /** 当前选择的页面 */
+        const selectedTargetForm = ref();
+        /** 当前已选目标表单是否已失效（被移除） */
+        const isInValidTargetForm = ref(false);
+        /** 目标命令列表数据 */
+        const targetCommands: any = ref([]);
+        /** 当前选择的目标命令 */
+        const selectedTargetCommand = ref();
+        /** 当前已选目标命令是否已失效（被移除） */
+        const isInValidCommand = ref(false);
+        /** 是否显示收折参数面板的图标 */
+        const shouldShowEditIcon = ref(props.communication.paramMappings && props.communication.paramMappings.length > 0);
+        /** 目标表单名称-命令名称 */
+        const displayCommandName = computed(() => {
+            if (!selectedTargetForm.value) {
+                return '';
+            }
+            const formName = selectedTargetForm.value?.name || selectedTargetForm.value?.code || '';
+            const commandName = selectedTargetCommand.value?.name || selectedTargetCommand.value?.code || '';
+            return `${formName}-${commandName}`;;
+
+        });
+
+        /** 失效的提示信息 */
+        const inValidTip = computed(() => {
+            if (isInValidTargetForm.value) {
+                return '目标表单已失效，请删除当前方法。';
+            }
+            if (isInValidCommand.value) {
+                return '目标命令已失效，请删除当前方法。';
+            }
+            return '';
+        });
+
+        /** 获取初始选中的目标页面 */
+        function resolveInitialTargetForm() {
+            if (communication.value?.target?.formId) {
+                const targetForm = targetForms.value.find(form => form.id === communication.value.target.formId && form.containerId === communication.value.target.externalContainerId);
+                isInValidTargetForm.value = !targetForm;
+                selectedTargetForm.value = targetForm ? targetForm :
+                    {
+                        containerId: communication.value.target.externalContainerId,
+                        id: communication.value.target.formId,
+                        code: communication.value.target.formCode
+                    };
+            } else {
+                isInValidTargetForm.value = false;
+            }
+        }
+        /** 组装目标页面数据列表 */
+        function getTargetForms() {
+            const externalFormMap = useFormSchema.externalFormSchema;
+            Array.from(externalFormMap.keys()).forEach(containerId => {
+
+                const formItem = externalFormMap.get(containerId);
+                if (communication.value?.source?.externalContainerId !== containerId) {
+                    targetForms.value.push({
+                        containerId,
+                        id: formItem.id,
+                        code: formItem.code,
+                        name: formItem.name
+                    });
+                }
+            });
+            if (communication.value?.source?.formId !== formMetaBasicInfo.id) {
+                targetForms.value.unshift({
+                    containerId: '',
+                    id: formMetaBasicInfo.id,
+                    code: formMetaBasicInfo.code,
+                    name: formMetaBasicInfo.name
+                });
+            }
+            resolveInitialTargetForm();
+        }
+        /** 获取初始选中的目标命令 */
+        function resolveInitialTargetCommand() {
+            if (communication.value?.target?.commandCode) {
+                const { commandCode, commandViewmodelId } = communication.value.target;
+                const command = targetCommands.value.find(command => command.code === commandCode && command.viewmodelId === commandViewmodelId);
+                selectedTargetCommand.value = command ? command : { code: communication.value.target.commandCode };
+                isInValidCommand.value = !command;
+            } else {
+                selectedTargetCommand.value = null;
+                isInValidCommand.value = false;
+            }
+        }
+
+        /** 获取所有模型下的命令 */
+        function getAllCommands(formSchema: any) {
+            const { viewmodels: viewModels, components } = formSchema.module;
+            if (viewModels?.length === 0 || components?.length === 0) {
+                return [];
+            }
+            targetCommands.value = [];
+            const viewModelNameResolver = props.sourceCommunication?.parameterData?.getViewModelName;
+            viewModels.forEach(viewModel => {
+                if (!viewModel || !viewModel.commands || viewModel.commands.length === 0) {
+                    return [];
+                }
+                const component = components.find(item => item.viewModel === viewModel.id);
+                const viewModelName = viewModelNameResolver && component ? viewModelNameResolver(component, viewModel.name) : '';
+                targetCommands.value.push({
+                    id: viewModel.id, code: viewModel.code, name: viewModelName || viewModel.name
+                });
+                viewModel.commands.forEach(command => {
+                    if (!command.isInvalid) {
+                        targetCommands.value.push({ ...command, viewmodelId: viewModel.id, isCommandNode: true });
+                    }
+                });
+
+            });
+        }
+        /** 组装目标页面的命令列表 */
+        function getTargetCommands() {
+            if (!selectedTargetForm.value?.id) {
+                return [];
+            }
+            // 当前表单
+            if (selectedTargetForm.value.id === formMetaBasicInfo.id) {
+                getAllCommands(useFormSchema.getFormSchema());
+            } else {
+                // 外部表单
+                const targetFormSchema = useFormSchema.externalFormSchema.get(selectedTargetForm.value?.containerId);
+                if (targetFormSchema?.content?.module) {
+                    getAllCommands(targetFormSchema.content);
+                }
+            }
+
+            resolveInitialTargetCommand();
+
+        }
+        onMounted(() => {
+            getTargetForms();
+            getTargetCommands();
+        });
+
+        watch(() => props.communication, (newDatas) => {
+            shouldShowEditIcon.value = props.communication.paramMappings && props.communication.paramMappings.length > 0;
+            resolveInitialTargetForm();
+            getTargetCommands();
+        }, { deep: true });
+
+        function onAddParameter() {
+            context.emit("addParameter");
+        }
+
+        /** 删除目标表单和目标命令 */
+        function onDeleteTargetCommand() {
+            context.emit("deleteCommand");
+        }
+
+        /** 隐藏/显示通讯参数 */
+        function toggleParameterPanel() {
+            context.emit("toggleParameterPanel");
+        }
+
+        return () => {
+            return (
+                <div class="form-container position-relative">
+                    {displayCommandName.value &&
+                        <div class="f-page-parameter-editor-first-row">
+                            <span class="f-page-parameter-editor-command-name" title={displayCommandName.value} >{displayCommandName.value}
+                            </span>
+                            <div class="f-page-parameter-editor-first-row-icon">
+                                {isInValidTargetForm.value || isInValidCommand.value ?
+                                    <div>
+                                        <span title={inValidTip.value}><i class="ml-2 f-icon f-icon-flowline-warning text-danger text-tip"></i></span>
+                                        <div class="f-icon f-icon-yxs_delete" title="删除命令" onClick={(event) => onDeleteTargetCommand()}></div>
+                                    </div> :
+                                    <>
+                                        <div class="f-icon f-icon-home-add" title="新增参数" style="font-size: 11px;" onClick={onAddParameter}></div>
+                                        {shouldShowEditIcon.value && <div class="f-icon f-icon-edit-button" title="收折参数" onClick={() => toggleParameterPanel()}></div>}
+                                        <div class="f-icon f-icon-yxs_delete" title="删除命令" onClick={(event) => onDeleteTargetCommand()}></div>
+                                    </>
+                                }
+                            </div>
+
+                        </div>
+                    }
+                </div >
+            );
+        };
+    }
+});
diff --git a/packages/ui-vue/components/events-editor/src/components/combine-form/combine-form.component.tsx b/packages/ui-vue/components/events-editor/src/components/combine-form/combine-form.component.tsx
index aa63ee50ac7..e50bafbe78d 100644
--- a/packages/ui-vue/components/events-editor/src/components/combine-form/combine-form.component.tsx
+++ b/packages/ui-vue/components/events-editor/src/components/combine-form/combine-form.component.tsx
@@ -1,13 +1,11 @@
 
-import { SetupContext, defineComponent, ref, inject, computed, Ref, onMounted } from "vue";
+import { SetupContext, defineComponent, ref, inject, computed, Ref } from "vue";
 import { combineFormProps, CombineFormProps } from "./combine-form.props";
-import FSelectTargetForm from "./select-target-form.component";
 import FSelectParameters from "./select-parameter.component";
-import FSelectCommand from "./select-command.component";
+import FCommunicationCommandItem from "./combine-command-item.component";
 import "./combine-form.scss";
 import { useCommunication } from "./use-communication";
 import { Communication } from "./types";
-import FSelectSourceControl from './select-source-control.component';
 
 /**
  * 组合表单通讯相关组件
@@ -15,102 +13,79 @@ import FSelectSourceControl from './select-source-control.component';
 export default defineComponent({
     name: 'FCombineForm',
     props: combineFormProps,
-    emits: ['changed'] as (string[] & ThisType<void>) | undefined,
+    emits: ['changed', 'deleteCommand', 'addCommand'] as (string[] & ThisType<void>) | undefined,
     setup(props: CombineFormProps, context: SetupContext) {
 
         const useFormSchema = inject('useFormSchema') as any;
-        const { saveCommunication, resolveCommunication } = useCommunication(useFormSchema);
-        const communication = ref() as Ref<Communication>;
-        communication.value = resolveCommunication(props);
-        const shouldShowSourceControl = ref(props.sourceCommunication?.needSelectSourceControl);
+        const { saveCommunication } = useCommunication(useFormSchema);
+        const communication = ref(props.communication) as Ref<Communication>;
         const shouldShowTargetPanel = computed(() => communication.value?.source?.componentId && communication.value?.source?.event);
+        /** 是否渲染参数面板 */
+        const shouldShowParameter = ref(true);
+        /** 是否收折参数面板（组件渲染但是处于display none的状态） */
+        const shouldCollapseParameter = ref(true);
         const parameterRef = ref();
-        onMounted(() => {
+        const selectCommandRef = ref();
 
-        });
-
-        /** 切换目标页面 */
-        function onSelectTargetForm(targetForm: any) {
-            if (communication.value.target.formId !== targetForm.id) {
-                communication.value.target.commandCode = '';
-                communication.value.target.commandViewmodelId = '';
-                communication.value.paramMappings = [];
-            }
-            communication.value.target.formId = targetForm.id;
-            communication.value.target.formCode = targetForm.code;
-            communication.value.target.externalContainerId = targetForm.containerId;
-
-            saveCommunication(communication.value);
-            context.emit('changed', communication.value);
-            if (parameterRef.value) {
-                parameterRef.value.closeAllParameterPanel();
-            }
-        }
-        /** 切换目标命令 */
-        function onSelectTargetCommand(targetCommand: any) {
-            communication.value.target.commandCode = targetCommand.code;
-            communication.value.target.commandViewmodelId = targetCommand.viewmodelId;
-
-            context.emit('changed', communication.value);
-
-            if (parameterRef.value) {
-                parameterRef.value.closeAllParameterPanel();
-            }
-        }
         /** 变更参数 */
         function onParameterChanged() {
+            saveCommunication(communication.value);
             context.emit('changed', communication.value);
         }
-        /** 修改源表单控件 */
-        function onSelectSourceControl(source: any) {
-            communication.value.source.componentId = source.componentId;
-            communication.value.source.event = '';
+
+        /** 新增参数 */
+        function onAddParameter() {
             if (parameterRef.value) {
-                parameterRef.value.closeAllParameterPanel();
+                parameterRef.value.addParameter();
             }
+            shouldCollapseParameter.value = false;
         }
-        /** 修改源表单事件 */
-        function onSelectSourceControlEvent(source: any) {
-            communication.value.source.componentId = source.componentId;
-            communication.value.source.event = source.event;
 
-            saveCommunication(communication.value);
-            context.emit('changed', communication.value);
+        /** 删除通讯中的目标页面和目标命令 */
+        function onDeleteCommand() {
+            context.emit('deleteCommand');
+        }
 
+        /** 隐藏/显示通讯参数 */
+        function onToggleParameterPanel() {
+            shouldCollapseParameter.value = !shouldCollapseParameter.value;
+        }
+        const parametarPanelClass = computed(() => {
+            return { 'd-none': shouldCollapseParameter.value };
+        });
+        /**
+         * 关闭所有的参数编辑面板
+         */
+        function closeAllParameterPanel() {
             if (parameterRef.value) {
                 parameterRef.value.closeAllParameterPanel();
             }
         }
-        /** 删除源控件（删除通讯） */
-        function onDeleteControl() {
-            context.emit('delete');
-        }
+        context.expose({ closeAllParameterPanel });
 
-        /** 新增参数 */
-        function onAddParameter() {
-            if (parameterRef.value) {
-                parameterRef.value.addParameter();
-            }
-        }
         return () => {
             return (
-                <div class="combine-form-container mt-2 pb-2 pl-1">
-                    {shouldShowSourceControl.value &&
-                        <FSelectSourceControl
-                            communication={communication.value}
-                            onSelectSourceControl={onSelectSourceControl}
-                            onSelectSourceEvent={onSelectSourceControlEvent}
-                            onDeleteControl={onDeleteControl}></FSelectSourceControl>}
+                <div class="combine-form-container pb-2">
+
                     {shouldShowTargetPanel.value && <>
-                        <FSelectTargetForm communication={communication.value} onSelectForm={onSelectTargetForm}></FSelectTargetForm>
-                        {communication.value?.target?.formId && <>
-                            <FSelectCommand communication={communication.value} sourceCommunication={props.sourceCommunication} onSelectCommand={onSelectTargetCommand} onAddParameter={onAddParameter}></FSelectCommand>
-                            <FSelectParameters ref={parameterRef} communication={communication.value} onChanged={onParameterChanged} sourceCommunication={props.sourceCommunication}></FSelectParameters></>
+                        <FCommunicationCommandItem ref={selectCommandRef}
+                            communication={communication.value}
+                            sourceCommunication={props.sourceCommunication}
+                            onAddParameter={onAddParameter}
+                            onDeleteCommand={onDeleteCommand}
+                            onToggleParameterPanel={onToggleParameterPanel}>
+                        </FCommunicationCommandItem>
+                        {shouldShowParameter.value && <div class={parametarPanelClass.value}>
+                            <FSelectParameters ref={parameterRef}
+                                communication={communication.value}
+                                onChanged={onParameterChanged}
+                                sourceCommunication={props.sourceCommunication}>
+                            </FSelectParameters></div>
                         }
                     </>
                     }
 
-                </div >
+                </div>
             );
         };
     }
diff --git a/packages/ui-vue/components/events-editor/src/components/combine-form/combine-form.scss b/packages/ui-vue/components/events-editor/src/components/combine-form/combine-form.scss
index 5691998d609..329b5f97958 100644
--- a/packages/ui-vue/components/events-editor/src/components/combine-form/combine-form.scss
+++ b/packages/ui-vue/components/events-editor/src/components/combine-form/combine-form.scss
@@ -1,139 +1,157 @@
-.combine-form-container {
-
-    .form-container,
-    .param-container {
-        .selected-item {
-            display: flex;
-            align-items: center;
-
-            .f-icon {
-                color: #8DA3CE;
-            }
-
-            .form-control-tip {
-                padding: 2px;
-                background: #F0F3F9;
-                border-radius: 5px;
-                color: #8da3ce;
-                width: 72px;
-
-                >div {
-                    color: #5b89fe;
-                    background: #fff;
-                    display: flex;
-                    justify-content: center;
-                    padding: 0 8px;
-                    border-radius: 4px;
-                }
-            }
-
-            .form-control {
-                border: 0;
-                flex: 1;
-                border-radius: 0;
-                box-shadow: unset !important;
-                text-overflow: ellipsis;
-                white-space: nowrap;
-                overflow: hidden !important;
-                background-color: inherit;
-                padding-right: 20px;
-            }
-
-            .form-control:focus {
-                border-bottom: 1px solid rgb(217, 222, 231);
-            }
-
-            .f-icon-circle {
-                font-size: 8px;
-            }
+.form-container,
+.param-container {
+
+    .f-icon {
+        color: #8DA3CE;
+    }
+
+    .item-list {
+        margin-top: 2px;
+        // margin-left: 8px;
+        background-color: #fff;
+        z-index: 2001;
+        width: 100%;
+        border: 2px solid #e7eced;
+        box-shadow: 0 1px 18px 0 rgb(232 235 243);
+        min-width: 220px;
+        border-radius: 10px;
+        position: relative;
+        padding: 10px;
+        display: flex;
+        flex-direction: column;
+        max-height: 400px;
+        overflow: auto;
+
+        .tip {
+            color: #B4BCCC;
+            margin-bottom: 4px;
+            padding-left: 4px;
         }
 
-        .item-list {
-            margin-top: 2px;
-            margin-left: 8px;
-            background-color: #fff;
-            z-index: 2001;
-            width: 100%;
-            border: 2px solid #e7eced;
-            box-shadow: 0 1px 18px 0 rgb(232 235 243);
-            min-width: 220px;
-            border-radius: 10px;
-            position: relative;
-            padding: 10px;
-            display: flex;
-            flex-direction: column;
-            max-height: 400px;
-            overflow: auto;
-
-            .tip {
-                color: #B4BCCC;
-                margin-bottom: 4px;
-                padding-left: 4px;
-            }
-
-            .item {
-                padding: 4px;
-                cursor: pointer;
-                border-radius: 6px;
-            }
-
-            .item:hover {
-                background: #EDF5FF;
-            }
-
-            .item.selected {
-                background: #dae9ff;
-            }
-
-            .item.disabled {
-                color: #b4bccc;
-            }
-
-            .item.disabled:hover {
-                background: unset;
-                cursor: default;
-            }
+        .item {
+            padding: 4px;
+            cursor: pointer;
+            border-radius: 6px;
         }
 
-        .remove-icon {
-            right: 0;
-            position: absolute;
+        .item:hover {
+            background: #EDF5FF;
         }
-    }
 
-    .param-container {
-        .param-panel {
-            padding: 6px;
-            background-color: #F7FAFF;
-            box-shadow: 0px 0px 20px 0px rgba(3, 18, 51, 0.07);
-            border-radius: 6px;
+        .item.selected {
+            background: #dae9ff;
+        }
 
-            .col-form-label {
-                margin-bottom: 0;
-            }
+        .item.disabled {
+            color: #b4bccc;
         }
 
-        .form-control {
-            padding-right: 10px !important;
+        .item.disabled:hover {
+            background: unset;
+            cursor: default;
         }
     }
+}
+
+.param-container {
+    .selected-item {
+        display: flex;
+        align-items: center;
+        padding-right: 5px;
+
+        .form-control {
+            border: 0;
+            flex: 1;
+            border-radius: 0;
+            box-shadow: unset !important;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+            overflow: hidden !important;
+            background-color: inherit;
+            padding-right: 20px;
+            color: #878d99;
+        }
+
+        .form-control:focus {
+            border-bottom: 1px solid rgb(217, 222, 231);
+        }
 
-    .form-container.invalid,
-    .param-container.invalid {
-        .remove-icon {
-            right: 14px;
+        .f-icon {
+            font-size: 13px !important;
         }
+
     }
 
-    .fv-grid-row-selected {
+    .param-panel {
+        padding: 6px;
+        background-color: #F7FAFF;
+        box-shadow: 0px 0px 20px 0px rgba(3, 18, 51, 0.07);
         border-radius: 6px;
+
+        .col-form-label {
+            margin-bottom: 0;
+        }
     }
 
-    .f-icon-flowline-warning {
-        font-size: 14px;
+    .form-control {
+        padding-right: 10px !important;
     }
 
     .f-icon-yxs_delete {
         font-size: 13px;
     }
+}
+
+
+.param-container.invalid {
+    .remove-icon {
+        margin-left: 10px;
+    }
+}
+
+
+.fv-grid-row-selected {
+    border-radius: 6px;
+}
+
+.f-icon-flowline-warning {
+    font-size: 14px;
+}
+
+
+// .form-container .item-list::before {
+//     content: " ";
+//     width: 0px;
+//     height: 0px;
+//     position: absolute;
+//     right: 54px;
+//     top: -13px;
+//     border-width: 7px;
+//     border-style: solid;
+//     border-color: transparent transparent rgb(226, 229, 230);
+// }
+
+// .form-container .item-list::after {
+//     content: " ";
+//     width: 0;
+//     height: 0;
+//     position: absolute;
+//     right: 54px;
+//     top: -13px;
+//     border-width: 7px;
+//     border-style: solid dashed dashed;
+//     border-color: transparent transparent #ffffff;
+// }
+
+// .form-container .item-list.item-form-list {
+//     overflow: visible;
+// }
+.form-container {
+    .f-page-parameter-editor-first-row-icon {
+
+        .f-icon {
+            font-size: 13px;
+            margin-left: 10px;
+        }
+    }
 }
\ No newline at end of file
diff --git a/packages/ui-vue/components/events-editor/src/components/combine-form/select-command.component.tsx b/packages/ui-vue/components/events-editor/src/components/combine-form/select-command.component.tsx
index 344aeda4ae5..0618907734b 100644
--- a/packages/ui-vue/components/events-editor/src/components/combine-form/select-command.component.tsx
+++ b/packages/ui-vue/components/events-editor/src/components/combine-form/select-command.component.tsx
@@ -3,40 +3,55 @@ import { Communication } from "./types";
 import { combineFormProps, CombineFormProps } from './combine-form.props';
 
 /**
- * 选择目标命令
+ * 选择目标表单和目标命令
  */
 export default defineComponent({
-    name: 'FSelectCommand',
+    name: 'FSelectCommunicationCommand',
     props: combineFormProps,
-    emits: ['selectCommand', 'addParameter'] as (string[] & ThisType<void>) | undefined,
+    emits: ['selectCommand', 'addParameter', 'deleteCommand', 'toggleParameterPanel'] as (string[] & ThisType<void>) | undefined,
     setup(props: CombineFormProps, context: SetupContext) {
-        const communication = ref(props.communication) as Ref<Communication>;
         const useFormSchema = inject('useFormSchema') as any;
         const formMetaBasicInfo = useFormSchema.getFormMetadataBasicInfo();
+        /** 目标页面列表数据 */
+        const targetForms: any = ref([]);
+        /** 当前选择的页面 */
+        const selectedTargetForm = ref();
+
+        /** 目标命令列表数据 */
         const targetCommands: any = ref([]);
+        /** 当前选择的目标命令 */
         const selectedTargetCommand = ref();
+        /** 是否显示目标页面列表 */
+        const shouldShowFormList = ref(true);
+        /** 是否显示命令下拉列表 */
         const shouldShowCommandList = ref(false);
-        const displayCommandName = computed(() => selectedTargetCommand.value?.name || selectedTargetCommand.value?.code);
-        /** 当前已选目标表单是否已失效（被移除） */
-        const isInValidCommand = ref(false);
 
-        watch(() => props.communication, (newData) => {
-            communication.value = newData;
-        }, { deep: true });
+        /** 组装目标页面数据列表 */
+        function getTargetForms() {
+            const externalFormMap = useFormSchema.externalFormSchema;
+            Array.from(externalFormMap.keys()).forEach(containerId => {
 
-        /** 获取初始选中的目标命令 */
-        function resolveInitialTargetCommand() {
-            if (communication.value?.target?.commandCode) {
-                const { commandCode, commandViewmodelId } = communication.value.target;
-                const command = targetCommands.value.find(command => command.code === commandCode && command.viewmodelId === commandViewmodelId);
-                selectedTargetCommand.value = command ? command : { code: communication.value.target.commandCode };
-                isInValidCommand.value = !command;
-            } else {
-                selectedTargetCommand.value = null;
-                isInValidCommand.value = false;
+                const formItem = externalFormMap.get(containerId);
+                if (props.sourceCommunication?.externalContainerId !== containerId) {
+                    targetForms.value.push({
+                        containerId,
+                        id: formItem.id,
+                        code: formItem.code,
+                        name: formItem.name
+                    });
+                }
+            });
+            if (props.sourceCommunication?.formId !== formMetaBasicInfo.id) {
+                targetForms.value.unshift({
+                    containerId: '',
+                    id: formMetaBasicInfo.id,
+                    code: formMetaBasicInfo.code,
+                    name: formMetaBasicInfo.name
+                });
             }
         }
 
+
         /** 获取所有模型下的命令 */
         function getAllCommands(formSchema: any) {
             const { viewmodels: viewModels, components } = formSchema.module;
@@ -62,34 +77,44 @@ export default defineComponent({
 
             });
         }
+
         /** 组装目标页面的命令列表 */
         function getTargetCommands() {
-            if (!communication.value?.target?.formId) {
+            if (!selectedTargetForm.value?.id) {
                 return [];
             }
             // 当前表单
-            if (communication.value.target.formId === formMetaBasicInfo.id) {
+            if (selectedTargetForm.value.id === formMetaBasicInfo.id) {
                 getAllCommands(useFormSchema.getFormSchema());
             } else {
                 // 外部表单
-                const targetFormSchema = useFormSchema.externalFormSchema.get(communication.value?.target?.externalContainerId);
+                const targetFormSchema = useFormSchema.externalFormSchema.get(selectedTargetForm.value?.containerId);
                 if (targetFormSchema?.content?.module) {
                     getAllCommands(targetFormSchema.content);
                 }
             }
 
-            resolveInitialTargetCommand();
-
         }
         onMounted(() => {
+            getTargetForms();
             getTargetCommands();
         });
-        watch(() => props.communication, (newDatas) => {
-            getTargetCommands();
-        }, { deep: true });
+        /** 选择目标页面 */
+        function onSelectForm(targetForm: any) {
+            selectedTargetForm.value = targetForm;
+            shouldShowFormList.value = false;
+            shouldShowCommandList.value = true;
 
+            getTargetCommands();
+        }
 
         const formItemClass = computed(() => (item: any) => {
+            return {
+                'item': true,
+                'selected': selectedTargetForm.value?.id === item.id && selectedTargetForm.value?.containerId === item.containerId
+            };
+        });
+        const commandItemClass = computed(() => (item: any) => {
             return {
                 'item': true,
                 'selected': selectedTargetCommand.value?.id === item.id,
@@ -97,39 +122,36 @@ export default defineComponent({
                 'disabled': !item.isCommandNode
             };
         });
-        function onClickSelectedCommand() {
-            shouldShowCommandList.value = !shouldShowCommandList.value;
-        }
         function onSelectCommand(targetCommand: any) {
             if (targetCommand.isCommandNode) {
                 shouldShowCommandList.value = false;
                 selectedTargetCommand.value = targetCommand;
-                isInValidCommand.value = false;
-                context.emit("selectCommand", targetCommand);
-            }
 
+                context.emit("selectCommand", {
+                    targetForm: selectedTargetForm.value,
+                    targetCommand: targetCommand
+                });
+            }
         }
 
-        function onAddParameter() {
-            context.emit("addParameter");
-        }
         return () => {
             return (
-                <div class="form-container mt-2 position-relative">
-                    <div class="selected-item" >
-                        <div class="form-control-tip"><div>目标命令</div></div>
-                        <input placeholder="请选择命令" class="form-control" v-model={displayCommandName.value} title={displayCommandName.value} readonly onClick={onClickSelectedCommand}></input>
-                        {isInValidCommand.value ? <span title="目标命令已失效，请重新选择"><i class="ml-2 f-icon f-icon-flowline-warning text-danger text-tip"></i></span> : ''}
-                    </div>
-                    {shouldShowCommandList.value ? <div class="item-list">
-                        <span class="tip">请选择目标命令</span>
-                        {targetCommands.value.map(targetCommand => {
-                            return <span class={formItemClass.value(targetCommand)} onClick={() => onSelectCommand(targetCommand)}>{targetCommand.name}</span>;
+                <div class="form-container position-relative">
+                    {shouldShowFormList.value && <div class="item-list">
+                        <span class="tip">请选择目标页面</span>
+                        {targetForms.value.map(targetForm => {
+                            return <span class={formItemClass.value(targetForm)} onClick={() => onSelectForm(targetForm)}
+                                title={targetForm.containerId ? `所属外部容器：${targetForm.containerId}` : '当前页面'}>{targetForm.name}</span>;
                         })}
-                    </div> : ''}
-
-                    {displayCommandName.value && !isInValidCommand.value &&
-                        < div class="f-icon f-icon-home-add mr-2" title="新增参数" style="font-size: 11px;position: absolute;top: 8px;right: 0;" onClick={onAddParameter}></div>}
+                    </div>}
+                    {
+                        shouldShowCommandList.value ? <div class="item-list">
+                            <span class="tip">请选择目标命令</span>
+                            {targetCommands.value.map(targetCommand => {
+                                return <span class={commandItemClass.value(targetCommand)} onClick={() => onSelectCommand(targetCommand)}>{targetCommand.name}</span>;
+                            })}
+                        </div> : ''
+                    }
                 </div >
             );
         };
diff --git a/packages/ui-vue/components/events-editor/src/components/combine-form/select-parameter.component.tsx b/packages/ui-vue/components/events-editor/src/components/combine-form/select-parameter.component.tsx
index 452d40bc154..2c8431f9d55 100644
--- a/packages/ui-vue/components/events-editor/src/components/combine-form/select-parameter.component.tsx
+++ b/packages/ui-vue/components/events-editor/src/components/combine-form/select-parameter.component.tsx
@@ -36,16 +36,24 @@ export default defineComponent({
         const isInValidParam = ref({});
         /** 变量文本框的展示文本 */
         const paramDispayText = computed(() => (parameter: any) => {
+            let displayText = '';
+            let displayTextTip = '';
             if (parameter.sourceValue && parameter.targetVariable) {
                 const targetVariable = targetVariablePlainData.value.find(param => param.statePath === `${parameter.targetVariableViewModelId}.${parameter.targetVariable}`);
                 if (targetVariable && targetVariable.name) {
                     isInValidParam.value[parameter.targetVariable] = false;
-                    return `${parameter.sourceValue}-->${targetVariable.name}`;
+                    displayText = `${parameter.sourceValue}--->${targetVariable.name}`;
+                    displayTextTip = `将 ${parameter.sourceValue} 赋值给 ${targetVariable.name}`;
                 } else {
                     isInValidParam.value[parameter.targetVariable] = true;
-                    return `${parameter.sourceValue}-->${parameter.targetVariable}`;
+                    displayText = `${parameter.sourceValue}--->${parameter.targetVariable}`;
+                    displayTextTip = `将 ${parameter.sourceValue} 赋值给 ${parameter.targetVariable}`;
                 }
             }
+            return {
+                displayText,
+                displayTextTip
+            };
         });
 
 
@@ -56,7 +64,7 @@ export default defineComponent({
 
         /** 校验参数：删除源参数和目标参数都为空的条目  */
         function checkParameterValidation() {
-
+            const originalParamLength = parameters.value.length || 0;
             if (parameters.value.length) {
                 parameters.value = parameters.value.filter(paramMapping => {
                     if (!paramMapping.sourceValue && !paramMapping.targetVariable) {
@@ -64,8 +72,12 @@ export default defineComponent({
                     }
                     return true;
                 });
+
             }
             communication.value.paramMappings = parameters.value;
+            if (originalParamLength !== communication.value.paramMappings?.length) {
+                context.emit('changed');
+            }
         }
         onUnmounted(() => {
             checkParameterValidation();
@@ -280,23 +292,22 @@ export default defineComponent({
         const paramContainerClass = computed(() => (isInValid: boolean) => {
             return {
                 'param-container': true,
-                'mt-2': true,
+                'ml-3': true,
                 'invalid': isInValid
             };
         });
         return () => {
             if (parameters.value.length) {
                 return parameters.value.map(parameter => {
-                    const displayText = paramDispayText.value(parameter);
+                    const { displayText, displayTextTip } = paramDispayText.value(parameter);
                     const isInValid = isInValidParam.value[parameter.targetVariable];
                     return (<div class={paramContainerClass.value(isInValid)}>
                         <div class="selected-item position-relative" >
-                            <div class="form-control-tip"><div>参数映射</div></div>
-                            <input placeholder="请配置参数" class="form-control mr-3" readonly value={displayText} title={displayText} onClick={() => onClickSelectedParam(parameter)}></input>
+                            <span class="form-control mr-3" title={displayTextTip} onClick={() => onClickSelectedParam(parameter)}>{displayText || '请配置参数'}</span>
                             {isInValid ? <span title="目标参数已失效，请重新选择"><i class="f-icon f-icon-flowline-warning text-danger text-tip"></i></span> : ''}
 
                             <div class="remove-icon">
-                                <div class="f-icon f-icon-yxs_delete mr-2" title="删除参数" onClick={(event) => onDeleteParameter(event, parameter)}></div>
+                                <div class="f-icon f-icon-yxs_delete" title="删除参数" onClick={(event) => onDeleteParameter(event, parameter)}></div>
                             </div>
                         </div>
                         {shouldShowParam.value[parameter.id] ? renderParamPanel(parameter) : ''}
diff --git a/packages/ui-vue/components/events-editor/src/components/combine-form/select-source-control.component.tsx b/packages/ui-vue/components/events-editor/src/components/combine-form/select-source-control.component.tsx
index a45113d4bac..34466e493d0 100644
--- a/packages/ui-vue/components/events-editor/src/components/combine-form/select-source-control.component.tsx
+++ b/packages/ui-vue/components/events-editor/src/components/combine-form/select-source-control.component.tsx
@@ -5,6 +5,8 @@ import { useDataView } from "../../../../designer-outline/src/composition/use-da
 import { FTreeView } from "@farris/ui-vue/components/tree-view";
 import "./combine-form.scss";
 import { schemaMap } from "@farris/ui-vue/components/dynamic-resolver";
+import { useCommunication } from "./use-communication";
+import { Communication } from "./types";
 
 /**
  * 选择源表单的控件以及事件
@@ -14,10 +16,12 @@ export default defineComponent({
     props: combineFormProps,
     emits: ['selectSourceEvent', 'deleteControl'] as (string[] & ThisType<void>) | undefined,
     setup(props: CombineFormProps, context: SetupContext) {
-        /** 当前通讯数据 */
-        const communication = ref(props.communication);
         const useFormSchema = inject('useFormSchema') as any;
-        const formMetaBasicInfo = useFormSchema.getFormMetadataBasicInfo();
+        /** 当前通讯数据 */
+        const { createNewCommunication } = useCommunication(useFormSchema);
+        const communication = ref() as Ref<Communication>;
+        communication.value = createNewCommunication(props);
+
         const columns = ref([{ field: 'name', title: '', dataType: 'string' }]);
 
         /** 源表单大纲树数据 */
@@ -28,7 +32,7 @@ export default defineComponent({
         const controlTreeRef = ref();
 
         /** 是否显示控件下拉列表 */
-        const shouldShowControlList = ref(false);
+        const shouldShowControlList = ref(true);
         /** 是否显示事件下拉列表 */
         const shouldShowEventList = ref(false);
         /** 事件列表 */
@@ -40,37 +44,11 @@ export default defineComponent({
         /** 当前已选源控件是否已失效（被移除） */
         const isInValidControl = ref(false);
 
-        /** 控件文本框展示文本 */
-        const dispayControlName = computed(() => {
-            if (isInValidControl.value) {
-                return selectedSourceControl.value?.id || '';
-            }
-            let displayName = selectedSourceControl.value?.name;
-            if (displayName && selectedEvent.value?.eventName) {
-                displayName += `-${selectedEvent.value?.eventName}`;
-            }
-            return displayName;
-        });
-
-
-        watch(() => props.communication, (newDatas) => {
-            communication.value = newDatas;
-        }, { deep: true });
-
         /** 组装源页面大纲树数据 */
         function assembleSourceOutline() {
-            const designerHostService: any = inject('designer-host-service');
-            const useOutlineNodeComposition = useOutlineNode(designerHostService, context);
-            const sourceFormSchema = useFormSchema.externalFormSchema.get(communication.value?.source.externalContainerId);
-            if (sourceFormSchema?.content) {
-                const outlineProps = { data: sourceFormSchema.content };
-                const { getData } = useDataView(outlineProps, useOutlineNodeComposition);
-
-                sourceControlTreeData.value = getData();
-                controlTreeRef.value.updateDataSource(sourceControlTreeData.value);
-            }
-
-
+            const sourceOutlineData: any = inject('sourceOutlineData');
+            sourceControlTreeData.value = sourceOutlineData || [];
+            controlTreeRef.value.updateDataSource(sourceControlTreeData.value);
         }
 
         /**
@@ -106,11 +84,6 @@ export default defineComponent({
             isInit.value = false;
         });
 
-        /** 点击控件行，控制是否显示大纲树列表 */
-        function onClickSelectedControl() {
-            shouldShowControlList.value = !shouldShowControlList.value;
-        }
-
         /** 组装控件对应的事件 */
         function resolveEventList() {
             eventListData.value = [];
@@ -139,10 +112,6 @@ export default defineComponent({
 
             if (!isInit.value && isControlChanged) {
                 selectedEvent.value = null;
-                context.emit("selectSourceControl", {
-                    componentId: selectedSourceControl.value.rawSchema.id,
-                    event: ''
-                });
             }
         }
         const controlListPanelClass = computed(() => {
@@ -160,27 +129,19 @@ export default defineComponent({
         });
         /** 选择事件 */
         function onSelectEvent(event: any) {
+            shouldShowControlList.value = false;
             shouldShowEventList.value = false;
             selectedEvent.value = event;
+            communication.value.source.componentId = selectedSourceControl.value.rawSchema.id;
+            communication.value.source.event = selectedEvent.value?.eventCode;
 
-            context.emit("selectSourceEvent", {
-                componentId: selectedSourceControl.value.rawSchema.id,
-                event: selectedEvent.value?.eventCode
-
-            });
-        }
-        /**
-         * 删除源控件（删除通讯）
-         * @param event 
-         */
-        function onDeleteControl() {
-            context.emit("deleteControl");
+            context.emit("selectSourceEvent", communication.value);
         }
 
+
         const controlContainerClass = computed(() => {
             return {
                 'form-container': true,
-                'mt-2': true,
                 'position-relative': true,
                 'invalid': isInValidControl.value
             };
@@ -189,17 +150,7 @@ export default defineComponent({
         return () => {
             return (
                 <div class={controlContainerClass.value}>
-                    <div class="remove-icon" style="top:4px;">
-                        <div class="f-icon f-icon-yxs_delete mr-2" title="删除" onClick={onDeleteControl}></div>
-                    </div>
-                    <div class="selected-item" >
-                        <div class="form-control-tip"><div>源控件</div></div>
-                        <input placeholder="请选择源控件" class="form-control" v-model={dispayControlName.value} title={dispayControlName.value} readonly onClick={onClickSelectedControl}></input>
-                        {isInValidControl.value ? <span title="源控件已失效，请重新选择"><i class="ml-2 f-icon f-icon-flowline-warning text-danger text-tip"></i></span> : ''}
-
-                    </div>
-
-                    <div class={controlListPanelClass.value} style="min-height:220px;">
+                       <div class={controlListPanelClass.value} style="min-height:220px;">
                         <span class="tip">请选择源控件</span>
                         <FTreeView
                             ref={controlTreeRef}
diff --git a/packages/ui-vue/components/events-editor/src/components/combine-form/select-target-form.component.tsx b/packages/ui-vue/components/events-editor/src/components/combine-form/select-target-form.component.tsx
deleted file mode 100644
index fdd545fd814..00000000000
--- a/packages/ui-vue/components/events-editor/src/components/combine-form/select-target-form.component.tsx
+++ /dev/null
@@ -1,115 +0,0 @@
-import { SetupContext, defineComponent, ref, inject, computed, onMounted, Ref, watch } from "vue";
-import { Communication } from "./types";
-import { combineFormProps, CombineFormProps } from './combine-form.props';
-
-/**
- * 选择目标表单
- */
-export default defineComponent({
-    name: 'FSelectTargetForm',
-    props: combineFormProps,
-    emits: ['selectForm'] as (string[] & ThisType<void>) | undefined,
-    setup(props: CombineFormProps, context: SetupContext) {
-        /** 当前通讯数据 */
-        const communication = ref(props.communication) as Ref<Communication>;
-        const useFormSchema = inject('useFormSchema') as any;
-        const formMetaBasicInfo = useFormSchema.getFormMetadataBasicInfo();
-        /** 页面列表数据 */
-        const targetForms: any = ref([]);
-        /** 当前选择的页面 */
-        const selectedTargetForm = ref();
-        /** 是否显示页面下拉列表 */
-        const shouldShowFormList = ref(false);
-        /** 文本框展示文本 */
-        const dispayFormName = computed(() => selectedTargetForm.value?.name || selectedTargetForm.value?.code);
-        /** 当前已选目标表单是否已失效（被移除） */
-        const isInValidTarget = ref(false);
-
-        watch(() => props.communication, (newDatas) => {
-            communication.value = newDatas;
-        }, { deep: true });
-
-        /** 获取初始选中的目标页面 */
-        function resolveInitialTargetForm() {
-            if (communication.value?.target?.formId) {
-                const targetForm = targetForms.value.find(form => form.id === communication.value.target.formId && form.containerId === communication.value.target.externalContainerId);
-                isInValidTarget.value = !targetForm;
-                selectedTargetForm.value = targetForm ? targetForm :
-                    {
-                        containerId: communication.value.target.externalContainerId,
-                        id: communication.value.target.formId,
-                        code: communication.value.target.formCode
-                    };
-            } else {
-                isInValidTarget.value = false;
-            }
-        }
-        /** 组装目标页面数据列表 */
-        function getTargetForms() {
-            const externalFormMap = useFormSchema.externalFormSchema;
-            Array.from(externalFormMap.keys()).forEach(containerId => {
-
-                const formItem = externalFormMap.get(containerId);
-                if (communication.value?.source?.externalContainerId !== containerId) {
-                    targetForms.value.push({
-                        containerId,
-                        id: formItem.id,
-                        code: formItem.code,
-                        name: formItem.name
-                    });
-                }
-            });
-            if (communication.value?.source?.formId !== formMetaBasicInfo.id) {
-                targetForms.value.unshift({
-                    containerId: '',
-                    id: formMetaBasicInfo.id,
-                    code: formMetaBasicInfo.code,
-                    name: formMetaBasicInfo.name
-                });
-            }
-            resolveInitialTargetForm();
-        }
-
-        onMounted(() => {
-            getTargetForms();
-        });
-
-        const formItemClass = computed(() => (item: any) => {
-            return {
-                'item': true,
-                'selected': selectedTargetForm.value?.id === item.id && selectedTargetForm.value?.containerId === item.containerId
-            };
-        });
-
-        /** 点击目标页面，控制是否显示页面下拉列表 */
-        function onClickSelectedForm() {
-            shouldShowFormList.value = !shouldShowFormList.value;
-        }
-
-        /** 选择目标页面 */
-        function onSelectForm(targetForm: any) {
-            shouldShowFormList.value = false;
-            isInValidTarget.value = false;
-            selectedTargetForm.value = targetForm;
-            context.emit("selectForm", targetForm);
-        }
-        return () => {
-            return (
-                <div class="form-container mt-2">
-                    <div class="selected-item" >
-                        <div class="form-control-tip"><div>目标页面</div></div>
-                        <input placeholder="请选择目标页面" class="form-control" v-model={dispayFormName.value} title={dispayFormName.value} readonly onClick={onClickSelectedForm}></input>
-                        {isInValidTarget.value ? <span title="目标页面已失效，请重新选择"><i class="ml-2 f-icon f-icon-flowline-warning text-danger text-tip"></i></span> : ''}
-                    </div>
-                    {shouldShowFormList.value ? <div class="item-list">
-                        <span class="tip">请选择目标页面</span>
-                        {targetForms.value.map(targetForm => {
-                            return <span class={formItemClass.value(targetForm)} onClick={() => onSelectForm(targetForm)}
-                                title={targetForm.containerId ? `所属外部容器：${targetForm.containerId}` : '当前页面'}>{targetForm.name}</span>;
-                        })}
-                    </div> : ''}
-                </div>
-            );
-        };
-    }
-});
diff --git a/packages/ui-vue/components/events-editor/src/components/combine-form/use-communication.ts b/packages/ui-vue/components/events-editor/src/components/combine-form/use-communication.ts
index 80f8a210329..85730adafce 100644
--- a/packages/ui-vue/components/events-editor/src/components/combine-form/use-communication.ts
+++ b/packages/ui-vue/components/events-editor/src/components/combine-form/use-communication.ts
@@ -1,47 +1,68 @@
 import { useGuid } from "@farris/ui-vue/components/common";
-import { ref } from "vue";
-import { Communication } from "./types";
+import { inject, ref } from "vue";
+import { Communication, CommunicationSource, CommunicationTarget } from "./types";
 import { CombineFormProps } from "./combine-form.props";
 import { InteractionItem } from "../../types";
+import { useOutlineNode } from '../../../../designer-outline/src/composition/use-outline-node';
+import { useDataView } from "../../../../designer-outline/src/composition/use-data-view";
+import { schemaMap } from "@farris/ui-vue/components/dynamic-resolver";
 
 export function useCommunication(useFormSchema: any) {
 
-    const communication = ref();
+    /** 源表单大纲树数据 */
+    const sourceOutlineData: any = inject('sourceOutlineData') || [];
+    /** 当前选择的源控件 */
+    const selectedSourceControl = ref();
+    /** 当前已选源控件/源事件是否已失效（被移除） */
+    const isControlInvalid = ref(false);
+    /** 事件列表 */
+    const eventListData = ref<Array<{ eventCode: string, eventName: string }>>([]);
+    /** 当前选择的事件 */
+    const selectedEvent = ref();
     /**
-     * 获取通讯内容
+     * 新增一条通讯
      */
-    function resolveCommunication(props: CombineFormProps): Communication {
-        let result;
-        const { communications } = useFormSchema.getFormSchema().module;
-        if (props.communication?.id && communications?.length) {
-            result = communications.find(item => item.id === props.communication.id);
-        }
+    function createNewCommunication(props: CombineFormProps, eventCode?: string, target?: CommunicationTarget, source?: CommunicationSource): Communication {
 
-        if (!result && props.sourceCommunication) {
-            result = {
-                id: useGuid().guid(),
-                source: {
-                    formId: props.sourceCommunication.formId,
-                    formCode: props.sourceCommunication.formCode,
-                    componentId: props.sourceCommunication.componentId,
-                    externalContainerId: props.sourceCommunication.externalContainerId,
-                    event: props.event,
-                },
-                target: {
-                    formId: '',
-                    formCode: '',
-                    externalContainerId: '',
-                    commandCode: '',
-                    commandViewmodelId: ''
-                },
-                paramMappings: []
-            } as Communication;
-        }
-        return result;
+        return {
+            id: useGuid().guid(),
+            source: source ? source : {
+                formId: props.sourceCommunication?.formId,
+                formCode: props.sourceCommunication?.formCode,
+                componentId: props.sourceCommunication?.componentId,
+                externalContainerId: props.sourceCommunication?.externalContainerId,
+                event: eventCode || 'onCommunication',
+            },
+            target: {
+                formId: target?.formId || '',
+                formCode: target?.formCode || '',
+                externalContainerId: target?.externalContainerId || '',
+                commandCode: target?.commandCode || '',
+                commandViewmodelId: target?.commandViewmodelId || ''
+            },
+            paramMappings: [],
+        } as Communication;
     }
+    /**
+     * 补充当前通讯配置
+     * @param interaction 
+     */
+    function resolveCommunication(interaction: InteractionItem) {
+        // 针对已有配置项，根据id获取完整配置
+        if (interaction?.communication?.length) {
+            interaction?.communication?.map((communication) => {
+                if (communication?.id && !communication?.source?.componentId) {
+                    const completeCommunication = useFormSchema.getFormSchema().module.communications?.find(item => item.id === communication?.id);
+                    if (completeCommunication) {
+                        Object.assign(communication, completeCommunication);
+                    }
+                }
+            });
+        }
 
+    }
     /** 
-     * 保存新增的通讯
+     * 保存新增或修改的通讯
      */
     function saveCommunication(communication: Communication) {
         const formSchema = useFormSchema.getFormSchema();
@@ -53,28 +74,132 @@ export function useCommunication(useFormSchema: any) {
         const index = formSchema.module.communications.findIndex(com => com.id === communication.id);
         if (index === -1) {
             formSchema.module.communications.push(communication);
+        } else {
+            Object.assign(formSchema.module.communications[index], communication);
         }
     }
 
     /**
-     * 清除通讯
+     * 清除一条交互下的所有组件通讯
      */
-    function clearCommunication(interaction: InteractionItem) {
-        if (interaction?.communication) {
+    function clearAllCommunication(interaction: InteractionItem) {
+        if (interaction?.communication?.length) {
             const formSchema = useFormSchema.getFormSchema();
-            if (formSchema.module.communications) {
-                formSchema.module.communications = formSchema.module.communications.filter(communication => communication.id !== interaction.communication?.id);
-            }
+            interaction.communication.map((communication) => {
+                if (formSchema.module.communications && communication) {
+                    formSchema.module.communications = formSchema.module.communications.filter(item => item.id !== communication.id);
+                }
+            });
+
+
+            interaction.communication = [];
+        }
+
+    }
 
-            interaction.communication = null;
+    /**
+     * 根据通讯id清除单条组件通讯
+     */
+    function clearCommunicationById(communicationId: string) {
+        const formSchema = useFormSchema.getFormSchema();
+        if (communicationId && formSchema.module.communications?.length) {
+            formSchema.module.communications = formSchema.module.communications.filter(item => item.id !== communicationId);
         }
+    }
 
+    /**
+     * 获取外部表单的控件树结构数据
+     */
+    function assembleSourceOutline(designerHostService: any, context, externalContainerId: string) {
+        const useOutlineNodeComposition = useOutlineNode(designerHostService, context);
+        const sourceFormSchema = useFormSchema.externalFormSchema.get(externalContainerId);
+        if (sourceFormSchema?.content) {
+            const outlineProps = { data: sourceFormSchema.content };
+            const { getData } = useDataView(outlineProps, useOutlineNodeComposition);
+
+            return getData();
+        }
+        return [];
     }
 
+    /**
+     * 定位已选控件信息
+     */
+    function resolveSourceControl(communication: Communication) {
+        if (!communication?.source?.componentId) {
+            isControlInvalid.value = false;
+            return;
+        }
+        const selectedItem = sourceOutlineData.find(data => data.originalId === communication.source.componentId);
+        if (selectedItem) {
+            isControlInvalid.value = false;
+            selectedSourceControl.value = selectedItem;
+        } else {
+            isControlInvalid.value = true;
+            selectedSourceControl.value = { id: communication.source.componentId };
+        }
+    }
+
+    /**
+     *  定位已选事件信息
+     */
+    function resolveSourceControlEvent(communication: Communication) {
+        eventListData.value = [];
+        const controlSchema = selectedSourceControl.value?.rawSchema;
+        if (!controlSchema) {
+            selectedEvent.value = null;
+            return;
+        }
+        const controlType = controlSchema.type === 'form-group' && controlSchema.editor ? controlSchema.editor.type : controlSchema.type;
+        const eventMap = schemaMap[controlType]?.events;
+        if (eventMap) {
+            Object.keys(eventMap).forEach(eventCode => {
+                eventListData.value.push({ eventCode, eventName: eventMap[eventCode] });
+            });
+        }
+        if (communication.source?.event && eventListData.value?.length) {
+            selectedEvent.value = eventListData.value.find(event => event.eventCode === communication.source?.event);
+        }
+    }
+    /**
+     * 获取源表单的控件名称+控件事件名称
+     */
+    function resolveSourceControlEventTitle(communication?: Communication[]) {
+        if (!communication?.length) {
+            return;
+        }
+        resolveSourceControl(communication[0]);
+        resolveSourceControlEvent(communication[0]);
+        let title = '';
+        if (isControlInvalid.value) {
+            title = `${communication[0].source?.componentId || ''}-${communication[0].source?.event || ''}`;
+        } else {
+            title = selectedSourceControl.value?.name;
+            if (title && selectedEvent.value?.eventName) {
+                title += `-${selectedEvent.value?.eventName}`;
+            }
+        }
+
+        return { title, isControlInvalid: isControlInvalid.value };
+    }
+    /**
+     * 获取当前交互下组件通讯的源配置
+     */
+    function resolveCommunicationSource(interaction: InteractionItem) {
+        if (interaction?.communication?.length) {
+            // 因为一个交互下所有的通讯都是同一个源，所以这里取第一条
+            const firstCommuncation = interaction?.communication[0];
+            return firstCommuncation?.source;
+        }
+    }
     return {
-        communication,
+        createNewCommunication,
         resolveCommunication,
-        clearCommunication,
-        saveCommunication
+        clearAllCommunication,
+        clearCommunicationById,
+        saveCommunication,
+        assembleSourceOutline,
+        resolveSourceControlEventTitle,
+        resolveCommunicationSource
     };
 }
diff --git a/packages/ui-vue/components/events-editor/src/components/command-source/command-source.component.tsx b/packages/ui-vue/components/events-editor/src/components/command-source/command-source.component.tsx
index 298a8f7ee57..e44984eee49 100644
--- a/packages/ui-vue/components/events-editor/src/components/command-source/command-source.component.tsx
+++ b/packages/ui-vue/components/events-editor/src/components/command-source/command-source.component.tsx
@@ -36,7 +36,7 @@ export default defineComponent({
         'newFunctionChanged',
         'close',
         'selectMethod',
-        'switchToCommunicationPanel'
+        'addCommunication'
     ] as (string[] & ThisType<void>) | undefined,
     setup(props: CommandSourceProps, context: SetupContext) {
         const methodsComposition = inject<UseMethods>('useMethodsComposition') as UseMethods;
@@ -119,10 +119,17 @@ export default defineComponent({
             }
         }
         function onSubmitExsitedMethodModal(value: any) {
-            const { selectedCommand } = value;
-            methodsComposition.selectBoundCommand(selectedCommand, props.iteractionDisplayOrder);
+            const { selectedCommand, selectedForm } = value;
+            /** 选择当前表单的方法，认为是替换现有方法；选择子表单的方法，认为是新增通讯方法 */
+            if (!selectedForm || selectedForm?.id === useFormSchema.getFormMetadataBasicInfo().id) {
+                methodsComposition.selectBoundCommand(selectedCommand, props.iteractionDisplayOrder);
+                context.emit('selectBoundMethod');
+            } else {
+                context.emit('addCommunication', value);
+            }
             onCancelExsitedMethodModal();
-            context.emit('selectBoundMethod');
+
+
         }
         /** 渲染已有方法窗口 */
         function renderBoundEvents() {
@@ -130,6 +137,8 @@ export default defineComponent({
             return <FBoundEventSelector
                 getEventPath={getEventPath}
                 notifyService={notifyService}
+                useFormSchema={useFormSchema}
+                sourceCommunication={props.sourceCommunication}
                 onCancel={onCancelExsitedMethodModal}
                 onSubmit={onSubmitExsitedMethodModal}></FBoundEventSelector>;
         }
@@ -178,10 +187,6 @@ export default defineComponent({
                         <div class="f-icon f-icon-licensed"></div>
                         <div class="f-function-class" onClick={() => showBoundEvents()}>已有方法</div>
                     </div>}
-                    {shoulShowCommunication.value && <div class="f-page-internals-new-command-func2">
-                        <div class="fd-i-Family fd_pc-extend-setting"></div>
-                        <div class="f-function-class" onClick={() => openFormCommunicationPanel()}>添加组件通讯事件</div>
-                    </div>}
                 </div>
             );
         }
diff --git a/packages/ui-vue/components/events-editor/src/components/command-source/command-source.props.ts b/packages/ui-vue/components/events-editor/src/components/command-source/command-source.props.ts
index 6b164045819..d4dce324520 100644
--- a/packages/ui-vue/components/events-editor/src/components/command-source/command-source.props.ts
+++ b/packages/ui-vue/components/events-editor/src/components/command-source/command-source.props.ts
@@ -13,7 +13,10 @@ export const commandSourceProps = {
     /** 接收是否显示「可选择方法」功能 */
     haveBoundCommand: { Type: Boolean, default: false },
     controllers: { type: Array<Command>, default: [] },
-    iteractionDisplayOrder: { Type: Number, default: 0 }
+    iteractionDisplayOrder: { Type: Number, default: 0 },
+    /** 通讯来源 */
+    sourceCommunication: { type: Object, default: {} }
+
 } as Record<string, any>;
 
 export type CommandSourceProps = ExtractPropTypes<typeof commandSourceProps>;
diff --git a/packages/ui-vue/components/events-editor/src/components/interaction-button/interaction-button.component.tsx b/packages/ui-vue/components/events-editor/src/components/interaction-button/interaction-button.component.tsx
index 6285906eb2f..09f09f4d6bd 100644
--- a/packages/ui-vue/components/events-editor/src/components/interaction-button/interaction-button.component.tsx
+++ b/packages/ui-vue/components/events-editor/src/components/interaction-button/interaction-button.component.tsx
@@ -1,17 +1,18 @@
 import { SetupContext, defineComponent, inject, ref } from "vue";
 import { InteractionButtonProps, interactionButtonProps } from "./interaction-button.props";
-
 import FEventList from '../event-list/event-list.component';
-import { EventItem } from "../../types";
+import { Communication, EventItem } from "../../types";
 import { UseEvents, UseInteraction } from "../../composition/types";
 import { FNotifyService as NotifyService } from "@farris/ui-vue/components/notify";
+import FSelectSourceControl from '../combine-form/select-source-control.component';
+
 /**
  * 【新建交互事件】按钮
  */
 export default defineComponent({
     name: 'FInteractionButton',
     props: interactionButtonProps,
-    emits: ['clickEventItem', 'addSourceControl'] as (string[] & ThisType<void>) | undefined,
+    emits: ['clickEventItem', 'selectSourceControl'] as (string[] & ThisType<void>) | undefined,
     setup(props: InteractionButtonProps, context: SetupContext) {
         const notifyService = new NotifyService();
         const eventsComposition = inject<UseEvents>('useEventsComposition') as UseEvents;
@@ -19,12 +20,17 @@ export default defineComponent({
         const { candidateEvents } = eventsComposition;
         const { collapseInteractions } = interactionComposition;
         const shouldShowCandidateEventsList = ref(false);
+        const shouldShowSourceControl = ref(false);
 
         function excludeFromCandidates(selectedEvent: EventItem) {
             candidateEvents.value = candidateEvents.value.filter((eventItem: EventItem) => eventItem.label !== selectedEvent.label);
         }
-        function toggleEventList(state = false) {
-            shouldShowCandidateEventsList.value = state;
+        function toggleEventList() {
+            if (props.sourceCommunication?.needSelectSourceControl) {
+                shouldShowSourceControl.value = !shouldShowSourceControl.value;
+            } else {
+                shouldShowCandidateEventsList.value = !shouldShowCandidateEventsList.value;
+            }
         }
         function onClickEventItem(eventItem: EventItem) {
             toggleEventList();
@@ -38,14 +44,21 @@ export default defineComponent({
             }
             // 1. 收折其他已展示的事件列表
             collapseInteractions();
-            if (props.sourceCommunication?.needSelectSourceControl) {
-                context.emit('addSourceControl');
-            } else {
-                // 2. 显示/隐藏候选事件事件列表
-                toggleEventList(!shouldShowCandidateEventsList.value);
-            }
+            // if (props.sourceCommunication?.needSelectSourceControl) {
+            //     context.emit('addSourceControl');
+            // } else {
+            // 2. 显示/隐藏候选事件事件列表
+            toggleEventList();
+            // }
+        }
+        /**
+         * 
+         * 选择源控件+ 源事件
+         */
+        function onSelectSourceControlEvent(communication: Communication) {
+            shouldShowSourceControl.value = false;
+            context.emit('selectSourceControl', communication);
         }
-
         return () => {
             return (
                 <>
@@ -57,6 +70,11 @@ export default defineComponent({
                     {shouldShowCandidateEventsList.value &&
                         <FEventList events={candidateEvents.value} onClick={onClickEventItem}></FEventList>
                     }
+                    {shouldShowSourceControl.value &&
+                        <FSelectSourceControl
+                            sourceCommunication={props.sourceCommunication}
+                            onSelectSourceEvent={onSelectSourceControlEvent}
+                        ></FSelectSourceControl>}
                 </>
             );
         };
diff --git a/packages/ui-vue/components/events-editor/src/components/interaction-item/interaction-item.component.tsx b/packages/ui-vue/components/events-editor/src/components/interaction-item/interaction-item.component.tsx
index 7059dd801cb..43ba0cd7c69 100644
--- a/packages/ui-vue/components/events-editor/src/components/interaction-item/interaction-item.component.tsx
+++ b/packages/ui-vue/components/events-editor/src/components/interaction-item/interaction-item.component.tsx
@@ -1,4 +1,4 @@
-import { SetupContext, computed, defineComponent, inject, ref } from "vue";
+import { SetupContext, computed, defineComponent, inject, ref, onMounted, onBeforeMount } from "vue";
 import { InteractionItemProps, interactionItemProps } from "./interaction-item.props";
 import { Command, CommandItem, InteractionItem, MethodChangedEventArgs } from "../../types";
 import FCommandSource from '../command-source/command-source.component';
@@ -6,10 +6,11 @@ import FParameterEditor from '../parameter-editor/parameter-editor.component';
 import { UseMethods } from "../../composition/types";
 import { cloneDeep } from "lodash-es";
 import { useGuid } from "@farris/ui-vue/components/common";
-import FSelectSourceControl from '../combine-form/select-source-control.component';
 import FCombineForm from "../combine-form/combine-form.component";
 import { useCommunication } from "../combine-form/use-communication";
-import { Communication } from "../combine-form/types";
+import { Communication, CommunicationSource, CommunicationTarget } from "../combine-form/types";
+import { FNotifyService as NotifyService } from "@farris/ui-vue/components/notify";
+import FSelectCommunicationCommand from '../combine-form/select-command.component';
 
 /**
  * 事件交互项
@@ -36,30 +37,62 @@ export default defineComponent({
         const methodsComposition = inject<UseMethods>('useMethodsComposition') as UseMethods;
         const { toggleSelectingMethod, emitFinalState, getViewModeId, getMethodsOnViewModel, getComponentList, updateTarget, updateCommandHasPath } = methodsComposition;
         const useFormSchema = inject('useFormSchema') as any;
-        const { clearCommunication } = useCommunication(useFormSchema);
+        const { clearCommunicationById, resolveSourceControlEventTitle, resolveCommunication, createNewCommunication, saveCommunication, resolveCommunicationSource } = useCommunication(useFormSchema);
         const controllers = ref<Command[]>(props.controllers);
         const interaction = ref<InteractionItem>(props.interaction);
         const methodSelectedChanged = ref(false);
+        /** 是否显示方法列表 */
         const shouldShowCommandSource = computed(() => {
             const switchOption = interaction.value.showSwitch[0];
-            // 获取是否显示方法列表
             const toSelectMethod = switchOption.showSection[switchOption.showSwitchNumber][2];
             return toSelectMethod;
         });
         /** 是否显示选择源控件窗口 */
-        const shouldShowSelectControlPanel = ref(props.sourceCommunication.needSelectSourceControl);
+        const needSelectSourceControl = ref(props.sourceCommunication.needSelectSourceControl);
         /** 是否显示通讯窗口 */
-        const shouldShowCommunicationPanel = ref(!!interaction.value?.communication?.id || shouldShowSelectControlPanel.value);
-
+        const shouldShowCommunicationPanel = ref(!!interaction.value?.communication?.length || needSelectSourceControl.value);
 
+        /** 是否显示方法名称行 */
         const shouldShowMethod = computed(() => {
-            const hasCommand = !!interaction.value.command;
+            const hasCommand = !!interaction.value.command?.id;
             const switchOption = interaction.value.showSwitch[0];
-            // 获取是否显示方法名
             const toShowMethod = switchOption.showSection[switchOption.showSwitchNumber][3];
-            return hasCommand && toShowMethod && !shouldShowCommunicationPanel.value;
+            return hasCommand && toShowMethod;
         });
+        /** 是否显示组件通讯中选择目标页面和目标命令的窗口 */
+        const shouldShowSelectCommunicationCommand = ref(interaction.value.needSelectCommunicationCommand || false);
+        /** 事件标题 */
+        const eventTitle = ref();
+        /** 事件标题提示 */
+        const eventTitleTip = ref();
+        /** 事件是否失效（用于组合表单场景） */
+        const isControlEventInvalid = ref(false);
+        /** 交互中组合通讯的源（包含源表单、源控件、源事件等） */
+        const sourceCommunication = ref();
+        /** 通讯命令组件的实例合集 */
+        const combineFormRefs: any = ref([]);
+
+        /** 组装事件标题 */
+        function assembleEventTitle() {
+            if (needSelectSourceControl.value) {
+                const data = resolveSourceControlEventTitle(interaction.value.communication);
+                if (data) {
+                    const { title, isControlInvalid } = data;
+                    eventTitle.value = title;
+                    eventTitleTip.value = isControlInvalid ? '源表单或事件已失效，请删除' : title;
+                    isControlEventInvalid.value = isControlInvalid;
+                }
 
+            } else {
+                eventTitleTip.value = interaction.value.event.label;
+                eventTitle.value = interaction.value.event.name;
+            }
+        }
+        onBeforeMount(() => {
+            resolveCommunication(interaction.value);
+            assembleEventTitle();
+            sourceCommunication.value = resolveCommunicationSource(interaction.value) || props.sourceCommunication;
+        });
 
         const toggleButtonIconClass = computed(() => {
             const classObject = {
@@ -70,6 +103,7 @@ export default defineComponent({
             return classObject;
         });
 
+        /** 删除交互：删除交互内的命令和所有通讯配置 */
         function onClickDeleteButton() {
             context.emit('delete', props.displayOrder);
         }
@@ -77,32 +111,40 @@ export default defineComponent({
         function onClickToggleButton() {
             const switchOption = interaction.value.showSwitch[0];
 
+            const hasBoundCommand = !!interaction.value.command?.id;
+            const hasCommunication = interaction.value.communication && interaction.value.communication.length > 0;
             // 切换通讯窗口显示状态
-            const hasCommunication = interaction.value.communication !== undefined;
             if (hasCommunication) {
                 shouldShowCommunicationPanel.value = !shouldShowCommunicationPanel.value;
-            } else {
-                //  切换方法名显示状态
+            }
+            //  切换方法名显示状态
+            if (hasBoundCommand) {
                 switchOption.showSection[switchOption.showSwitchNumber][3] =
                     !switchOption.showSection[switchOption.showSwitchNumber][3];
-
+                context.emit('toggle', props.displayOrder);
             }
-            context.emit('toggle', props.displayOrder);
-        }
 
+        }
+        /**
+         * 点击标题行的新增图标
+         */
         function onClickAddActionButton() {
-            const hasBoundCommand = interaction.value.command !== null;
-            const hasCommunication = interaction.value.communication !== undefined;
-            if (hasBoundCommand || hasCommunication) {
-                // 切换通讯窗口显示状态
-                if (hasCommunication) {
-                    shouldShowCommunicationPanel.value = shouldShowCommandSource.value;
+            const hasBoundCommand = !!interaction.value.command?.id;
+            const hasCommunication = interaction.value.communication && interaction.value.communication.length > 0;
+            // 当前选中的是外部容器，需要触发切换显示选择目标页面和命令的窗口
+            if (needSelectSourceControl.value) {
+                shouldShowSelectCommunicationCommand.value = !shouldShowSelectCommunicationCommand.value;
+                if (combineFormRefs.value?.length) {
+                    combineFormRefs.value.map(combineRef => { combineRef.closeAllParameterPanel(); });
                 }
-                const switchOption = interaction.value.showSwitch[0];
-                toggleSelectingMethod(switchOption, hasCommunication);
-
-                context.emit('addAction', props.displayOrder);
+                return;
             }
+            if (hasCommunication) {
+                shouldShowCommunicationPanel.value = !shouldShowCommunicationPanel.value;
+            }
+            const switchOption = interaction.value.showSwitch[0];
+            toggleSelectingMethod(switchOption, hasBoundCommand);
+            context.emit('addAction', props.displayOrder);
         }
 
         function onCloseMethodList(command: CommandItem) {
@@ -185,10 +227,12 @@ export default defineComponent({
             switchOption.showSection[switchOption.showSwitchNumber][3] = true;
             methodSelectedChanged.value = true;
 
-            // 隐藏组件通讯窗口
-            shouldShowCommunicationPanel.value = false;
-            // 清除已有的通讯
-            clearCommunication(interaction.value);
+            // 显示组件通讯窗口
+            const hasCommunication = interaction.value.communication && interaction.value.communication.length > 0;
+            if (hasCommunication) {
+                shouldShowCommunicationPanel.value = true;
+            }
+
             emitFinalState(false, null);
         }
         /**
@@ -216,27 +260,64 @@ export default defineComponent({
             };
             emitFinalState(true, interaction.value.event);
             const switchOption = interaction.value.showSwitch[0];
-            toggleSelectingMethod(switchOption);
+            toggleSelectingMethod(switchOption, true);
+        }
+
+        function checkAndAddNewCommunication(target: CommunicationTarget, source?: CommunicationSource) {
+            if (!interaction.value.communication) {
+                interaction.value.communication = [];
+            }
+            const existedTarget = interaction.value.communication.find(item => item.target?.formId === target.formId && item.target?.commandCode === target.commandCode);
+            if (existedTarget) {
+                const notifyService = new NotifyService();
+                notifyService.info({ position: 'top-center', message: '方法已存在，请勿重复添加。' });
+                return;
+            }
+
+            let currentCommunication;
+            if (interaction.value.communication.length === 1 && !interaction.value.communication[0].target?.formId) {
+                // 若当前通讯没有目标命令，则将新选择的命令赋值给当前通讯；
+                Object.assign(interaction.value.communication[0].target, target);
+                currentCommunication = interaction.value.communication[0];
+            } else {
+                // 若当前通讯已有目标命令，则创建一个新的通讯
+                currentCommunication = createNewCommunication(props, interaction.value.event.label, target, source);
+                interaction.value.communication.push(currentCommunication);
+            }
+
+            emitFinalState(false, null);
+            saveCommunication(currentCommunication);
         }
         /**
-         * 打开组件通讯窗口
+         * 选择「已有方法」中子表单的方法后，为当前控件的交互新增一条组件通讯
          */
-        function onSwitchToCommunicationPanel() {
-            // 清除原有的方法
-            interaction.value.command = null;
+        function onAddCommunication(targetValue: any) {
             const switchOption = interaction.value.showSwitch[0];
             // 隐藏方法列表
             switchOption.showSection[switchOption.showSwitchNumber][2] = false;
-            // 隐藏方法名
-            switchOption.showSection[switchOption.showSwitchNumber][3] = false;
+            // 显示方法名
+            if (interaction.value.command?.id) {
+                switchOption.showSection[switchOption.showSwitchNumber][3] = true;
+            }
             // 显示通讯窗口
             shouldShowCommunicationPanel.value = true;
 
-            interaction.value.communication = null;
+            // 新增通讯配置
+            if (targetValue) {
+                const { selectedCommand, selectedForm } = targetValue;
+                const target: CommunicationTarget = {
+                    formId: selectedForm?.id || '',
+                    formCode: selectedForm?.code || '',
+                    externalContainerId: selectedForm?.containerId || '',
+                    commandCode: selectedCommand?.code || '',
+                    commandViewmodelId: selectedCommand?.viewmodelId || ''
+                };
+                checkAndAddNewCommunication(target);
+            };
         }
 
         /**
-         * 选择「已有方法」后，切换页面的显示状态
+         * 选择「已有方法」中当前页面的方法后，切换页面的显示状态
          */
         function onSelectBoundMethod() {
             const switchOption = interaction.value.showSwitch[0];
@@ -248,20 +329,22 @@ export default defineComponent({
             switchOption.showSection[switchOption.showSwitchNumber][3] = true;
             methodSelectedChanged.value = false;
 
-            // 隐藏组件通讯窗口
-            shouldShowCommunicationPanel.value = false;
-            // 清除已有的通讯
-            clearCommunication(interaction.value);
+            // 显示组件通讯窗口
+            const hasCommunication = interaction.value.communication && interaction.value.communication.length > 0;
+            if (hasCommunication) {
+                shouldShowCommunicationPanel.value = true;
+            }
             emitFinalState(false, null);
         }
 
         function renderMethodSource() {
             return <FCommandSource
                 controllers={controllers.value}
+                sourceCommunication={props.sourceCommunication}
                 onClose={onCloseMethodList}
                 onSelectMethod={onSelectedMethodChanged}
                 onNewFunctionChanged={() => onNewFunctionChangedHandler()}
-                onSwitchToCommunicationPanel={onSwitchToCommunicationPanel}
+                onAddCommunication={onAddCommunication}
                 haveBoundCommand={props.haveBoundCommand}
                 iteractionDisplayOrder={props.displayOrder}
                 onSelectBoundMethod={onSelectBoundMethod}
@@ -301,53 +384,138 @@ export default defineComponent({
             props.viewSourceHandle?.({ ...$event, ...interaction.value });
         }
 
+        /** 删除交互内的单条命令 */
+        function onDeleteCommand() {
+            interaction.value.command = null;
+            emitFinalState(false, null);
+        }
+
         function renderMethodInfo() {
             return <FParameterEditor
                 command={interaction.value.command}
                 showParameter={methodSelectedChanged.value}
+                showDeleteIcon={interaction.value.communication && interaction.value.communication.length > 0}
                 onConfirm={() => onParameterEditorConfirmHandler()}
                 onChange={(event) => onParameterEditorChangeHandler(event)}
                 onTargetChange={(event) => onParameterEditorTargetChangeHandler(event)}
                 onViewSource={($event) => onViewSource($event)}
+                onDeleteCommand={onDeleteCommand}
             ></FParameterEditor>;
         }
 
         /**
          * 组合通讯配置变更
          */
-        function onCombineFormChanged(communication: Communication) {
-            interaction.value.communication = communication;
-            emitFinalState(false, null);
+        function onCombineFormChanged(communication: Communication, index: number) {
+            if (interaction.value.communication && interaction.value.communication.length > index) {
+                interaction.value.communication[index] = communication;
+                emitFinalState(false, null);
+            }
+
         }
-        function renderCommunicationPanel() {
+        /**
+         * 删除交互内的单条组件通讯（点击了删除目标命令）
+         */
+        function onDeleteCommunicationCommand(communication: Communication, index: number) {
+            if (interaction.value.communication && interaction.value.communication.length > index) {
+                interaction.value.communication.splice(index, 1);
+
+                clearCommunicationById(communication.id);
+                if (interaction.value.communication.length === 0 && !interaction.value.command?.id) {
+                    context.emit('delete', props.displayOrder);
+                } else {
+                    emitFinalState(false, null);
+                }
+            }
+        }
+        /**
+         * 选中目标页面和命令后，为外部表单的事件新增一条组件通讯
+         */
+        function onAddCommunicationCommand(data, index: number) {
+            const { source, target } = data;
+            checkAndAddNewCommunication(target, source);
+
+            // 显示通讯窗口
+            shouldShowCommunicationPanel.value = true;
+        }
+        function renderCommunicationPanel(communication: Communication, index: number) {
             return <FCombineForm
-                communication={interaction.value.communication}
+                ref={(combineElement) => { if (combineElement) { combineFormRefs.value[index] = combineElement; } }}
+                communication={communication}
                 event={interaction.value.event.label}
                 sourceCommunication={props.sourceCommunication}
-                onChanged={onCombineFormChanged}
-                onDelete={onClickDeleteButton}>
+                onChanged={(data) => onCombineFormChanged(data, index)}
+                onDeleteCommand={() => onDeleteCommunicationCommand(communication, index)}
+                onAddCommand={(data) => onAddCommunicationCommand(data, index)}>
             </FCombineForm>;
         }
+        /**
+         * 选中目标页面和命令后，为外部表单的事件新增一条组件通讯
+         */
+        function onSelectCommunicationCommand(data) {
+            const { targetForm, targetCommand } = data;
+
+            const newTarget: CommunicationTarget = {
+                formId: targetForm.id,
+                formCode: targetForm.code,
+                externalContainerId: targetForm.containerId,
+                commandCode: targetCommand.code,
+                commandViewmodelId: targetCommand.viewmodelId
+            };
+            checkAndAddNewCommunication(newTarget, sourceCommunication.value);
 
+            // 显示通讯窗口
+            shouldShowCommunicationPanel.value = true;
+            // 关闭选择目标页面和命令的窗口
+            shouldShowSelectCommunicationCommand.value = false;
+
+            interaction.value.needSelectCommunicationCommand = false;
+        }
+        /**
+         * 显示组件通讯中选择目标页面和目标命令的窗口
+         */
+        function renderSelectCommunicationCommand() {
+            return <FSelectCommunicationCommand
+                sourceCommunication={props.sourceCommunication}
+                onSelectCommand={(data) => onSelectCommunicationCommand(data)}>
+            </FSelectCommunicationCommand>;
+        }
 
         return () => {
             return (
                 <div class="show-switch">
-                    {!shouldShowSelectControlPanel.value && <div class="f-page-events-editor-bound-event">
-                        <div class="f-page-events-editor-bound-event-name" title={interaction.value.event.label}>
-                            {interaction.value.event.name}
-                        </div>
-                        <div style="float:right;margin:5px;">
-                            <div class={toggleButtonIconClass.value} style="font-size: 10px;" onClick={onClickToggleButton}></div>
+                    {/* 标题行 */}
+                    <div class="f-page-events-editor-bound-event">
+                        <div class="f-page-events-editor-bound-event-name" title={eventTitleTip.value}>
+                            {eventTitle.value}
                         </div>
+                        {!isControlEventInvalid.value &&
+                            <div style="float:right;margin:5px;">
+                                <div class={toggleButtonIconClass.value} style="font-size: 10px;" onClick={onClickToggleButton}></div>
+                            </div>
+                        }
                         <div class="f-icon f-icon-yxs_delete" style="font-size: 13px;float: right; margin:8px;"
                             onClick={onClickDeleteButton}></div>
-                        <div class="f-icon f-icon-home-add" style="float:right; font-size: 10px; margin:8px;"
-                            onClick={onClickAddActionButton}></div>
-                    </div>}
+                        {!isControlEventInvalid.value &&
+                            <div class="f-icon f-icon-home-add" style="float:right; font-size: 10px; margin:8px;"
+                                onClick={onClickAddActionButton}></div>
+                        }
+                        {isControlEventInvalid.value &&
+                            <div class="f-icon f-icon-flowline-warning text-danger text-tip" title="源表单或事件已失效，请删除" style="float:right; font-size: 13px; margin:8px;"></div>
+                        }
+                    </div>
+                    {/* 选择控制器方法的面板 */}
                     {shouldShowCommandSource.value && renderMethodSource()}
+                    {/* 选择通讯目标页面和目标方法的面板 */}
+                    {shouldShowSelectCommunicationCommand.value && renderSelectCommunicationCommand()}
+                    {/* 展示已绑定的方法 */}
                     {shouldShowMethod.value && renderMethodInfo()}
-                    {shouldShowCommunicationPanel.value && renderCommunicationPanel()}
+                    {/* 展示通讯方法和参数 */}
+                    {!isControlEventInvalid.value && shouldShowCommunicationPanel.value && interaction.value.communication && interaction.value.communication.length > 0 ?
+                        interaction.value.communication.map((communication, index) => {
+                            return renderCommunicationPanel(communication, index);
+                        }) : ''}
+
                 </div>
 
             );
diff --git a/packages/ui-vue/components/events-editor/src/components/parameter-editor/parameter-editor.component.tsx b/packages/ui-vue/components/events-editor/src/components/parameter-editor/parameter-editor.component.tsx
index 74df7ad2cd6..1525cb7ad38 100644
--- a/packages/ui-vue/components/events-editor/src/components/parameter-editor/parameter-editor.component.tsx
+++ b/packages/ui-vue/components/events-editor/src/components/parameter-editor/parameter-editor.component.tsx
@@ -20,15 +20,17 @@ import { cloneDeep } from "lodash-es";
 export default defineComponent({
     name: 'FParameterEditor',
     props: parameterEditorProps,
-    emits: ['confirm', 'change', 'targetChange', 'viewSource'] as (string[] & ThisType<void>) | undefined,
+    emits: ['confirm', 'change', 'targetChange', 'viewSource', 'deleteCommand'] as (string[] & ThisType<void>) | undefined,
     setup(props: ParameterEditorProps, context: SetupContext) {
         const notifyService = new NotifyService();
         const command = ref<CommandItem>(cloneDeep(props.command));
         const commandItemIndex = ref<number>(0);
-        // 方法被废弃
+        /** 是否显示方法被废弃的图标 */
         const showAbandonedIcon = computed(() => command.value.id === 'abandoned');
-        // 方法被删除
+        /** 是否显示方法被删除的图标 */
         const showDeletedIcon = computed(() => command.value.id === 'deleted');
+        /** 是否显示删除方法的图标 */
+        const showDeleteCommandIcon = computed(() => props.showDeleteIcon);
 
         const shouldShowParametersOfTheCommand = computed(() => command.value !== null);
 
@@ -67,11 +69,9 @@ export default defineComponent({
          */
         function renderAbandonedIcon() {
             return (
-                <div >
-                    <div title="方法已被移除，请重新绑定" class="f-icon f-icon-flowline-warning text-danger text-center "
-                        style="font-size: 13px;margin-right:10px;width: 30px;height: 20px;"
-                        onClick={() => showAbandonedMessage()}></div>
-                </div>
+                <div title="方法已被移除，请重新绑定" class="f-icon f-icon-flowline-warning text-danger text-center "
+                    style="font-size: 13px;margin-right:10px;width: 30px;height: 20px;"
+                    onClick={() => showAbandonedMessage()}></div>
             );
         }
 
@@ -83,11 +83,9 @@ export default defineComponent({
          * @returns 
          */
         function renderDeletedIcon() {
-            return <div>
-                <div title="'方法已被删除，请绑定其他方法'" class="f-icon f-icon-flowline-warning text-danger text-center "
-                    style="font-size: 13px;margin-right:10px;width: 30px;height: 20px;"
-                    onClick={() => showDeletedMessage()}></div>
-            </div>;
+            return <div title="'方法已被删除，请绑定其他方法'" class="f-icon f-icon-flowline-warning text-danger text-center "
+                style="font-size: 13px;margin-right:10px;width: 30px;height: 20px;"
+                onClick={() => showDeletedMessage()}></div>;
         }
 
         /**
@@ -99,10 +97,8 @@ export default defineComponent({
         }
 
         function renderEditButton() {
-            return <div >
-                <div class="f-icon f-icon-edit-button" style="font-size: 13px;margin-right:10px;"
-                    onClick={() => hideCurrentParameter(commandItemIndex.value)}></div>
-            </div>;
+            return <div class="f-icon f-icon-edit-button" style="font-size: 13px;margin-right:10px;"
+                onClick={() => hideCurrentParameter(commandItemIndex.value)}></div>;
         }
 
         const shouldSelectTargetComponent = computed(() => {
@@ -241,6 +237,14 @@ export default defineComponent({
             context.emit('viewSource', { command: command.value, event: $event });
         }
 
+        function onDeleteCommand() {
+            context.emit('deleteCommand');
+        }
+        /** 渲染删除命令图标 */
+        function renderDeleteCommandIcon() {
+            return <div class="f-icon f-icon-yxs_delete" title="删除命令" onClick={(event) => onDeleteCommand()}></div>;
+
+        }
         /**
          * 显示方法名称和编辑按钮
          * 显示参数列表
@@ -258,10 +262,11 @@ export default defineComponent({
                             {showAbandonedIcon.value && renderAbandonedIcon()}
                             {showDeletedIcon.value && renderDeletedIcon()}
                             {shouldShowEditButton.value && renderEditButton()}
+                            {showDeleteCommandIcon.value && renderDeleteCommandIcon()}
                         </div>
                     </div>
                     {shouldShowParameterEditorGroup.value && renderParameterEditorGroup()}
-                    {shouldShowParameterEditorGroup.value && renderConfirmButton()}
+                    {/* {shouldShowParameterEditorGroup.value && renderConfirmButton()} */}
                 </div>
             );
         }
diff --git a/packages/ui-vue/components/events-editor/src/components/parameter-editor/parameter-editor.css b/packages/ui-vue/components/events-editor/src/components/parameter-editor/parameter-editor.css
index 556775277cf..abaf178f595 100644
--- a/packages/ui-vue/components/events-editor/src/components/parameter-editor/parameter-editor.css
+++ b/packages/ui-vue/components/events-editor/src/components/parameter-editor/parameter-editor.css
@@ -29,7 +29,7 @@
     color: #878d99;
     display: inline-block;
     margin: 7px 0 7px 12px;
-    max-width: 180px;
+    max-width: 190px;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
@@ -38,11 +38,16 @@
 
 .f-page-parameter-editor-first-row-icon {
     margin-left: 5px;
-    margin-right: 5px;
-    height: 25px;
     background-color: white;
     float: right;
-    margin-top: 8px;
+    margin-top: 7px;
+    display: flex;
+    margin-bottom: 7px;
+    align-items: center;
+}
+
+.f-page-parameter-editor-first-row-icon .f-icon-yxs_delete {
+    font-size: 13px;
 }
 
 .f-page-parameter-editor-parameter-name {
@@ -130,4 +135,4 @@
 
 .f-page-parameter-editor-targetComponent-dropdown {
     padding: 0 8px 0px 0px;
-}
+}
\ No newline at end of file
diff --git a/packages/ui-vue/components/events-editor/src/components/parameter-editor/parameter-editor.props.ts b/packages/ui-vue/components/events-editor/src/components/parameter-editor/parameter-editor.props.ts
index dbda29fb735..42b702ab2ee 100644
--- a/packages/ui-vue/components/events-editor/src/components/parameter-editor/parameter-editor.props.ts
+++ b/packages/ui-vue/components/events-editor/src/components/parameter-editor/parameter-editor.props.ts
@@ -3,7 +3,9 @@ import { CommandItem } from "../../types";
 
 export const parameterEditorProps = {
     command: { type: Object as PropType<CommandItem>, default: {} },
-    showParameter: { type: Boolean, default: false }
+    showParameter: { type: Boolean, default: false },
+    /** 是否显示删除按钮 */
+    showDeleteIcon: { type: Boolean, default: false }
 } as Record<string, any>;
 
 export type ParameterEditorProps = ExtractPropTypes<typeof parameterEditorProps>;
diff --git a/packages/ui-vue/components/events-editor/src/composition/types.ts b/packages/ui-vue/components/events-editor/src/composition/types.ts
index e2481f9ac91..03fb8263030 100644
--- a/packages/ui-vue/components/events-editor/src/composition/types.ts
+++ b/packages/ui-vue/components/events-editor/src/composition/types.ts
@@ -1,5 +1,5 @@
 import { Ref } from "vue";
-import { BoundEventItem, Command, ComponentItem, EventItem, InteractionItem, InternalCommand, SwitchOption } from "../types";
+import { BoundEventItem, Command, Communication, ComponentItem, EventItem, InteractionItem, InternalCommand, SwitchOption } from "../types";
 
 export interface UseEventsEditorUtil {
 
@@ -25,7 +25,7 @@ export interface UseTargetComponent {
 }
 
 export interface UseInteraction {
-    addNewInteraction: (selectedEvent?: EventItem) => void;
+    addNewInteraction: (selectedEvent?: EventItem, communication?: Communication) => void;
 
     collapseInteractions: () => void;
 
@@ -59,7 +59,7 @@ export interface UseMethods {
 
     controllers: Ref<Command[]>;
     onClosed: (actionIndex: number) => void;
-    toggleSelectingMethod: (switchOption: SwitchOption, hasCommunication?: boolean) => void;
+    toggleSelectingMethod: (switchOption: SwitchOption, hasCommand?: boolean) => void;
     emitFinalState: (addNewFunctionState, event) => void;
     getComponentList: () => ComponentItem[];
     updateTarget: (command) => void;
diff --git a/packages/ui-vue/components/events-editor/src/composition/use-interaction.ts b/packages/ui-vue/components/events-editor/src/composition/use-interaction.ts
index 8ce9fe45e11..a910a8dff8e 100644
--- a/packages/ui-vue/components/events-editor/src/composition/use-interaction.ts
+++ b/packages/ui-vue/components/events-editor/src/composition/use-interaction.ts
@@ -1,6 +1,6 @@
 import { Ref, ref } from "vue";
 import { cloneDeep } from "lodash-es";
-import { BoundEventItem, EventItem, InteractionItem, InternalCommand, SwitchOption } from "../types";
+import { BoundEventItem, Communication, EventItem, InteractionItem, InternalCommand, SwitchOption } from "../types";
 import { UseEvents, UseInteraction } from "./types";
 import { useCommunication } from "../components/combine-form/use-communication";
 
@@ -39,10 +39,6 @@ export function useInteraction(
             communication: boundEventItem.communication
         } as InteractionItem;
 
-        // 若当前绑定组件通讯，则隐藏方法名的面板
-        if (boundEventItem.communication) {
-            interaction.showSwitch[0].showSection[2][3] = false;
-        }
         return interaction;
     }
 
@@ -50,24 +46,28 @@ export function useInteraction(
         interactions.value = boundEvents.value?.map((boundEventItem: BoundEventItem) => createInteraction(boundEventItem));
     }
 
-    function addNewInteraction(selectedEvent?: EventItem) {
+    function addNewInteraction(selectedEvent?: EventItem, communication?: Communication) {
         const eventToBeBinded = {
             boundEvents: selectedEvent,
             command: null,
-            controller: { id: '', name: '', label: '' }
+            controller: { id: '', name: '', label: '' },
+            communication: communication ? [communication] : []
         } as BoundEventItem;
         const newInteraction = createInteraction(eventToBeBinded);
 
-        // 需要先选择源控件
-        if (initialData.value.sourceCommunication?.needSelectSourceControl) {
+        // 添加通讯类事件
+        if (communication) {
             newInteraction.showSwitch[0].showSwitchNumber = 2;
             // 隐藏方法列表
             newInteraction.showSwitch[0].showSection[2][2] = false;
             // 隐藏方法名
             newInteraction.showSwitch[0].showSection[2][3] = false;
-            interactions.value.push(newInteraction);
-        } else {
-            // 选择事件
+            newInteraction.needSelectCommunicationCommand = true;
+            interactions.value.unshift(newInteraction);
+            return;
+        }
+        // 添加命令类事件
+        if (selectedEvent) {
             newInteraction.showSwitch[0].showSwitchNumber = 1;
             newInteraction.showSwitch[0].showSection[2][3] = true;
             interactions.value.unshift(newInteraction);
@@ -100,11 +100,15 @@ export function useInteraction(
             interactions.value.splice(interactionIndex, 1);
 
             // 3、移除通讯
-            const { clearCommunication } = useCommunication(useFormSchema);
-            clearCommunication(interactionToBeRemoved);
+            const { clearAllCommunication } = useCommunication(useFormSchema);
+            clearAllCommunication(interactionToBeRemoved);
         }
     }
 
+    function deleteCommandInInteraction() {
+
+    }
+
     return {
         addNewInteraction,
         collapseInteractions,
diff --git a/packages/ui-vue/components/events-editor/src/composition/use-methods.ts b/packages/ui-vue/components/events-editor/src/composition/use-methods.ts
index 9d1424c6ae2..7ed6465539f 100644
--- a/packages/ui-vue/components/events-editor/src/composition/use-methods.ts
+++ b/packages/ui-vue/components/events-editor/src/composition/use-methods.ts
@@ -130,28 +130,29 @@ export function useMethods(
         switchOption.showSection[switchOption.showSwitchNumber][2] = false;
     }
 
-    function showMethodName(switchOption: SwitchOption, hasCommunication = false) {
+    function showMethodName(switchOption: SwitchOption) {
         // 1. 显示方法名
-        if (!hasCommunication) {
-            switchOption.showSection[switchOption.showSwitchNumber][3] = true;
-        }
+        switchOption.showSection[switchOption.showSwitchNumber][3] = true;
     }
 
-    function hideMethodName(switchOption: SwitchOption, hasCommunication = false) {
+    function hideMethodName(switchOption: SwitchOption) {
         // 1. 隐藏方法名
-        if (!hasCommunication) {
-            switchOption.showSection[switchOption.showSwitchNumber][3] = false;
-        }
+        switchOption.showSection[switchOption.showSwitchNumber][3] = false;
     }
 
-    function toggleSelectingMethod(switchOption: SwitchOption, hasCommunication = false) {
+    function toggleSelectingMethod(switchOption: SwitchOption, hasCommand = false) {
         const isSelectingMethod = switchOption.showSection[switchOption.showSwitchNumber][2];
         if (isSelectingMethod) {
             hideMethodList(switchOption);
-            showMethodName(switchOption, hasCommunication);
+            if (hasCommand) {
+                showMethodName(switchOption);
+
+            }
         } else {
             showMethodList(switchOption);
-            hideMethodName(switchOption, hasCommunication);
+            if (hasCommand) {
+                hideMethodName(switchOption);
+            }
         }
     }
     /**
diff --git a/packages/ui-vue/components/events-editor/src/events-editor.component.tsx b/packages/ui-vue/components/events-editor/src/events-editor.component.tsx
index c5bec9a214b..46d8f47bba4 100644
--- a/packages/ui-vue/components/events-editor/src/events-editor.component.tsx
+++ b/packages/ui-vue/components/events-editor/src/events-editor.component.tsx
@@ -1,17 +1,17 @@
 
 import { SetupContext, defineComponent, onMounted, provide, ref, inject } from "vue";
 import { EventsEditorProps, eventsEditorProps } from "./events-editor.props";
-import { EventItem, InteractionItem, InternalCommand } from "./types";
+import { Communication, EventItem, InteractionItem, InternalCommand } from "./types";
 import { useEventsEditorUtil } from "./composition/use-events-editor-util";
 import { useInteraction } from "./composition/use-interaction";
 import { useEvents } from "./composition/use-events";
-
 import FInteractionButton from './components/interaction-button/interaction-button.component';
 import FInteractionItem from './components/interaction-item/interaction-item.component';
 import { UseEvents, UseInteraction, UseMethods } from "./composition/types";
-
 import './events-editor.css';
 import { useMethods } from "./composition/use-methods";
+import { useCommunication } from "./components/combine-form/use-communication";
+import { FNotifyService as NotifyService } from "@farris/ui-vue/components/notify";
 
 export default defineComponent({
     name: 'FEventsEditor',
@@ -23,10 +23,10 @@ export default defineComponent({
         // const originalData = ref<OriginalDataItem[]>([]);
         const useEventsEditorUtilComposition = useEventsEditorUtil();
         const { isContextDependent } = useEventsEditorUtilComposition;
-        // const useInteractionCompostion = useInteraction(initialData, useOriginalDataComposition);
-        // const { interactions } = useInteractionCompostion;
 
+        const designerHostService: any = inject('designer-host-service');
         const useEventsComposition = useEvents(initialData);
+
         const { loadEvents, resetBoundEvents } = useEventsComposition;
         const useFormSchema = inject('useFormSchema') as any;
         const useInteractionCompostion = useInteraction(useFormSchema, useEventsComposition, initialData);
@@ -44,6 +44,15 @@ export default defineComponent({
             initialData.value.isAddControllerMethod = false;
         }
 
+        function loadSourceOutlineForCommunication() {
+            const externalContainerId = initialData.value?.sourceCommunication?.externalContainerId;
+            if (externalContainerId) {
+                const { assembleSourceOutline } = useCommunication(useFormSchema);
+                const sourceOutline = assembleSourceOutline(designerHostService, context, externalContainerId);
+                provide<any>('sourceOutlineData', sourceOutline);
+            }
+        }
+
         onMounted(() => {
             // 重置切换到代码视图的标识
             resetDataVmLabel();
@@ -53,6 +62,8 @@ export default defineComponent({
             loadEvents();
             // 加载已有交互
             loadInteractions();
+
+            loadSourceOutlineForCommunication();
         });
 
         function onDeleteInteraction(interactionIndex: number) {
@@ -91,10 +102,11 @@ export default defineComponent({
         function renderInteractionList() {
             return interactions.value?.map((interaction: InteractionItem, displayOrder: number) => {
                 let itemKey = interaction.event.label;
-                if (interaction.communication?.id) {
-                    itemKey = `${interaction.communication?.id}_itemKey`;
+                if (interaction.communication?.length) {
+                    const communicationIdString = interaction.communication.map(item => item.id).join('-');
+                    itemKey = `${communicationIdString}_${itemKey}`;
                 }
-                return <div class="events-display-order" key={itemKey}>
+                return <div class="events-display-order" key={`${itemKey}_${displayOrder}`}>
                     {renderInteraction(interaction, displayOrder)}
                 </div>;
             });
@@ -105,9 +117,25 @@ export default defineComponent({
             addNewInteraction(selectedEvent);
         }
 
-        /** 新增一条源控件 */
-        function onAddSourceControl() {
-            addNewInteraction({ label: 'onCommunication', name: '组件通讯' });
+        /** 组合通讯：新增一条源控件 */
+        function onSelectSourceControl(communication: Communication) {
+            // 校验事件是否存在
+            const newSource = communication.source;
+            const existedInteraction = interactions.value.find(interaction => {
+                if (interaction.communication?.length) {
+                    const existedComm = interaction.communication.find(item => item.source?.formId === newSource.formId && item.source?.componentId === newSource.componentId && item.source?.event === newSource.event);
+                    if (existedComm) {
+                        return true;
+                    }
+                }
+            });
+            if (existedInteraction) {
+                const notifyService = new NotifyService();
+                notifyService.info({ position: 'top-center', message: '事件已存在，请勿重复添加。' });
+                return;
+            }
+
+            addNewInteraction({ label: 'onCommunication', name: '组件通讯' }, communication);
         }
         return () => {
             return (
@@ -116,7 +144,7 @@ export default defineComponent({
                         <FInteractionButton
                             sourceCommunication={initialData.value.sourceCommunication}
                             onClickEventItem={onClickEventItem}
-                            onAddSourceControl={onAddSourceControl}></FInteractionButton>
+                            onSelectSourceControl={onSelectSourceControl}></FInteractionButton>
                         {renderInteractionList()}
                     </div>
                 </div>
diff --git a/packages/ui-vue/components/events-editor/src/events-editor.css b/packages/ui-vue/components/events-editor/src/events-editor.css
index f226ac597f9..f9fbc2ffd66 100644
--- a/packages/ui-vue/components/events-editor/src/events-editor.css
+++ b/packages/ui-vue/components/events-editor/src/events-editor.css
@@ -160,6 +160,6 @@
     border: 1px transparent;
 }
 
-.f-page-events-editor-content .events-display-order:not(:last-child) .combine-form-container {
+/* .f-page-events-editor-content .events-display-order:not(:last-child) .combine-form-container {
     box-shadow: 0px 2px 0px 0px rgba(3, 18, 51, 0.07)
-}
\ No newline at end of file
+} */
\ No newline at end of file
diff --git a/packages/ui-vue/components/events-editor/src/types.ts b/packages/ui-vue/components/events-editor/src/types.ts
index dd8076eb441..6f42427a0da 100644
--- a/packages/ui-vue/components/events-editor/src/types.ts
+++ b/packages/ui-vue/components/events-editor/src/types.ts
@@ -212,6 +212,9 @@ export interface InteractionItem {
 
     controller: ControllerName;
 
-    communication?: Communication | null;
+    communication?: Array<Communication>;
+
+    /** 是否显示选择通讯命令的窗口*/
+    needSelectCommunicationCommand?: false;
 }
 export * from "./components/combine-form/types";
diff --git a/packages/ui-vue/components/external-container/src/designer/external-container.design.component.tsx b/packages/ui-vue/components/external-container/src/designer/external-container.design.component.tsx
index 255a41efaaf..a9b03124046 100644
--- a/packages/ui-vue/components/external-container/src/designer/external-container.design.component.tsx
+++ b/packages/ui-vue/components/external-container/src/designer/external-container.design.component.tsx
@@ -4,6 +4,7 @@ import { FLoadingService } from '@farris/ui-vue/components/loading';
 import { externalContainerProps, ExteranlContainerPropsType } from '../external-container.props';
 import { useDesignerRules } from './use-designer-rules';
 import FImportExternalSchema from './import-external-schema.component';
+import { FDynamicView } from '@farris/ui-vue/components/dynamic-view';
 
 export default defineComponent({
     name: 'FExternalContainerDesign',
@@ -87,8 +88,9 @@ export default defineComponent({
 
         function renderExternalForm() {
             return <>
-                <div style="position: absolute;left: 0;right: 0;bottom: 0;top: 0;z-index: 99;"></div>
-                <FDesignerItem v-model={externalFormSchemaComponent.value} external-form-schema={externalFormSchema.value}></FDesignerItem>
+                {/* <div style="position: absolute;left: 0;right: 0;bottom: 0;top: 0;z-index: 99;"></div> */}
+                {/* <FDesignerItem v-model={externalFormSchemaComponent.value} external-form-schema={externalFormSchema.value}></FDesignerItem> */}
+                <FDynamicView schema={externalFormSchema.value} ></FDynamicView>
             </>;
         }
         async function onFormSelected(formMetadaInfo: any) {
diff --git a/packages/ui-vue/components/external-container/src/property-config/external-container.property-config.ts b/packages/ui-vue/components/external-container/src/property-config/external-container.property-config.ts
index 6698f2014aa..874adce97cd 100644
--- a/packages/ui-vue/components/external-container/src/property-config/external-container.property-config.ts
+++ b/packages/ui-vue/components/external-container/src/property-config/external-container.property-config.ts
@@ -124,13 +124,13 @@ export class ExternalContainerProperty extends BaseControlProperty {
         };
     }
     /**
-     * 切换外部表单后，同步更新组件通讯中的源表单（场景：已配置组件通讯，再切换外部表单）
+     * 切换外部表单后，删除已有的通讯配置（场景：已配置组件通讯，再切换外部表单）
      */
     private syncCommunicationAfterFormChanged(changeObject, propertyData) {
         if (!propertyData.onCommunication) {
             return;
         }
-        const communicationIds = propertyData.onCommunication.replace('communication:', '').split(';');
+        const communicationIds = propertyData.onCommunication.replace(/communication:/g, '').split(';');
         if (!communicationIds?.length) {
             return;
         }
@@ -140,15 +140,13 @@ export class ExternalContainerProperty extends BaseControlProperty {
         communicationIds.map(communicationId => {
             const communication = communications.find(item => item.id === communicationId);
             if (communication?.source && communication.source.formId !== propertyData.externalComponent.id) {
-                communication.source.formId = propertyData.externalComponent.id;
-                communication.source.formCode = propertyData.externalComponent.code;
-                communication.source.componentId = '';
-                communication.source.event = '';
-
+                communication.needDelete = true;
                 needNotify = true;
             }
         });
+        formSchema.module.communications = formSchema.module.communications.filter(item => !item.needDelete);
         if (needNotify) {
+            propertyData.onCommunication = '';
             const notifyService: any = new FNotifyService();
             notifyService.globalConfig = { position: 'top-center' };
             notifyService.warning({ message: '切换引入表单后，请重新配置组件通讯。' });
diff --git a/packages/ui-vue/components/schema-selector/src/schema-selector.css b/packages/ui-vue/components/schema-selector/src/schema-selector.css
index b40b5267a98..a2f07b5247c 100644
--- a/packages/ui-vue/components/schema-selector/src/schema-selector.css
+++ b/packages/ui-vue/components/schema-selector/src/schema-selector.css
@@ -1,10 +1,10 @@
 .f-schema-selector-search {
-    width: 220px;
+    width: 300px;
     height: 26.6px;
     background: #ffffff;
     border-radius: 6px;
     float: right;
-    margin-right: 40px;
+    margin-right: 10px;
 }
 
 .f-schema-selector .farris-tabs-header {
-- 
Gitee


From f1618519f72da01f23e59addeeb805246c427003 Mon Sep 17 00:00:00 2001
From: wang-xh <wang-xh@inspur.com>
Date: Wed, 13 Aug 2025 14:10:07 +0800
Subject: [PATCH 6/9] =?UTF-8?q?fix:=20=E4=BF=AE=E6=94=B9=E5=B7=B2=E6=9C=89?=
 =?UTF-8?q?=E6=96=B9=E6=B3=95=E7=AA=97=E5=8F=A3=E7=9A=84=E6=90=9C=E7=B4=A2?=
 =?UTF-8?q?=E6=95=88=E6=9E=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../bound-event-selector.component.tsx        | 21 +++++++++++--------
 1 file changed, 12 insertions(+), 9 deletions(-)

diff --git a/packages/ui-vue/components/events-editor/src/components/bound-event-selector/bound-event-selector.component.tsx b/packages/ui-vue/components/events-editor/src/components/bound-event-selector/bound-event-selector.component.tsx
index 632c974c14c..11c2ef004b4 100644
--- a/packages/ui-vue/components/events-editor/src/components/bound-event-selector/bound-event-selector.component.tsx
+++ b/packages/ui-vue/components/events-editor/src/components/bound-event-selector/bound-event-selector.component.tsx
@@ -33,8 +33,8 @@ export default defineComponent({
                 const { actionWithPath } = eventInfo;
                 actionWithPath.forEach(vmItem => {
                     vmItem.sourceComponent.map.forEach(mapItem => {
-                        mapItem['active'] = false;
-                        mapItem['hide'] = false;
+                        mapItem.active = false;
+                        mapItem.hide = false;
                     });
                 });
                 viewModelData.value = cloneDeep(actionWithPath);
@@ -56,9 +56,9 @@ export default defineComponent({
                     const commandLabelString = mapItem.command.label;
                     const searchContent = `${pathString}${commandString}${eventString}${commandLabelString}`.toLowerCase();
                     if (!searchContent.includes(changeValue)) {
-                        mapItem['hide'] = true;
+                        mapItem.hide = true;
                     } else {
-                        mapItem['hide'] = false;
+                        mapItem.hide = false;
                     }
                 });
             });
@@ -77,9 +77,9 @@ export default defineComponent({
                 const methodViewmodelString = mapItem.viewmodelName || '';
                 const searchContent = `${methodNameString}${methodCodeString}${methodViewmodelString}`.toLowerCase();
                 if (changeValue && !searchContent.includes(changeValue)) {
-                    mapItem['hide'] = true;
+                    mapItem.hide = true;
                 } else {
-                    mapItem['hide'] = false;
+                    mapItem.hide = false;
                 }
             });
         }
@@ -135,7 +135,7 @@ export default defineComponent({
             viewModelData.value.forEach(vmItem => {
                 vmItem.sourceComponent.map.forEach(mapItem => {
                     if (!mapItem.command['isInvalid'] && value.controller.id === mapItem.controller.id && value.command.id === mapItem.command.id && value.event.label === mapItem.event.label && viewModelDataItem.sourceComponent.id === vmItem.sourceComponent.id) {
-                        value['active'] = !value['active'];
+                        value.active = !value.active;
                         selectedCommand.value = cloneDeep(value);
                     }
                     else {
@@ -147,7 +147,7 @@ export default defineComponent({
                                 selectedCommand.value = null;
                             }
                         }
-                        mapItem['active'] = false;
+                        mapItem.active = false;
                     }
                 });
             });
@@ -283,7 +283,10 @@ export default defineComponent({
                 }
             } else {
                 viewModelData.value.map((viewModelDataItem: any) => {
-                    viewModelDataItem.sourceComponent.map.map(mapItem => mapItem.active = false);
+                    viewModelDataItem.sourceComponent.map.map(mapItem => {
+                        mapItem.hide = false;
+                        mapItem.active = false
+                    });
                 });
             }
         }
-- 
Gitee


From de0643bc6f20de9618ef6d378a25984c1d2f7d55 Mon Sep 17 00:00:00 2001
From: wang-xh <wang-xh@inspur.com>
Date: Fri, 22 Aug 2025 11:48:30 +0800
Subject: [PATCH 7/9] =?UTF-8?q?feature:=20=E6=94=AF=E6=8C=81=E6=96=B9?=
 =?UTF-8?q?=E6=B3=95=E7=9A=84=E5=A4=8D=E5=88=B6=E7=B2=98=E8=B4=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../method-editor/method-editor.component.tsx |   3 +
 .../composition/build-method.ts               | 132 ++++++++++++++++--
 .../method-manager.component.tsx              | 103 +++++++++++++-
 .../variable-manager/variable-manager.scss    |   1 +
 4 files changed, 219 insertions(+), 20 deletions(-)

diff --git a/packages/designer/src/components/components/view-model-designer/method-manager/components/method-editor/method-editor.component.tsx b/packages/designer/src/components/components/view-model-designer/method-manager/components/method-editor/method-editor.component.tsx
index c23a0060c0b..bd4ea9d770e 100644
--- a/packages/designer/src/components/components/view-model-designer/method-manager/components/method-editor/method-editor.component.tsx
+++ b/packages/designer/src/components/components/view-model-designer/method-manager/components/method-editor/method-editor.component.tsx
@@ -3,6 +3,9 @@ import { FNotifyService } from "@farris/ui-vue/components";
 import { methodEditorProps, MethodEditorProps } from "./method-editor.props";
 import { UseFormSchema } from "../../../../../types";
 
+/**
+ * 重命名方法、粘贴方法时填写方法名称和编号
+ */
 export default defineComponent({
     name: 'FMethodEditor',
     props: methodEditorProps,
diff --git a/packages/designer/src/components/components/view-model-designer/method-manager/composition/build-method.ts b/packages/designer/src/components/components/view-model-designer/method-manager/composition/build-method.ts
index dd7890a54ba..46a2f45bbc7 100644
--- a/packages/designer/src/components/components/view-model-designer/method-manager/composition/build-method.ts
+++ b/packages/designer/src/components/components/view-model-designer/method-manager/composition/build-method.ts
@@ -6,12 +6,15 @@ import { WebCommand, WebCommandMetadata } from "../entity/web-command";
 import { IdService } from "../service/id.service";
 import { MetadataService } from "../../../../composition/metadata.service";
 import { cloneDeep } from 'lodash-es';
-import { FMessageBoxService } from '@farris/ui-vue/components';
+import { FMessageBoxService, FNotifyService } from '@farris/ui-vue/components';
 import { DesignerMode } from '../../../../types/designer-context';
+import { ref, Ref } from 'vue';
 
 export class MethodBuilder {
-
-    constructor(private useFormSchema: UseFormSchema) { };
+    private notifyService: FNotifyService = new FNotifyService();
+    constructor(private useFormSchema: UseFormSchema) {
+        this.notifyService.globalConfig = { position: 'top-center' };
+    };
 
     private commands: Command[] | any[] = [];
 
@@ -21,6 +24,16 @@ export class MethodBuilder {
     /** 控制器元数据集合 */
     private controllers: any = [];
 
+    /** 待复制的命令 */
+    public commandToBePasted: Ref<Command | undefined> = ref();
+
+    /** 待复制的命令所在的视图模型id */
+    private commandToBePastedViewModelId: string = '';
+
+    private reloadCommandTree() {
+
+    }
+
     /**
      * 加载表单相关的控制器和控制器内的方法，并组装为树表格所需的结构
      * @param commandsJson
@@ -177,7 +190,18 @@ export class MethodBuilder {
             }
         });
     }
+    /**
+     * 重置方法树
+     * @param activeViewModel 当前选中的模型
+     */
+    private rebuildCommandTree(activeViewModel: FormViewModel) {
 
+        const oldCommandsTreeData = cloneDeep(this.commandsTreeData);
+        this.commandsTreeData = [];
+        this.convertCommandsDataToTreeGridFormat(this.commands, this.commandsTreeData, 0, null);
+        this.assignTreeCollapseState(this.commandsTreeData, oldCommandsTreeData);
+        this.updateViewModel(this.commands, activeViewModel);
+    }
     /**
      * 移除方法
      */
@@ -193,12 +217,7 @@ export class MethodBuilder {
 
         this.removeWebCommandHandler(selectedTreeNode.data);
 
-        const oldCommandsTreeData = cloneDeep(this.commandsTreeData);
-        this.commandsTreeData = [];
-        this.convertCommandsDataToTreeGridFormat(this.commands, this.commandsTreeData, 0, null);
-        this.assignTreeCollapseState(this.commandsTreeData, oldCommandsTreeData);
-        this.updateViewModel(this.commands, activeViewModel);
-
+        this.rebuildCommandTree(activeViewModel);
         return { nextCommandId, commandsTreeData: this.commandsTreeData };
     }
 
@@ -247,11 +266,8 @@ export class MethodBuilder {
             this.addWebCommandHandler(command);
 
         });
-        const oldCommandsTreeData = cloneDeep(this.commandsTreeData);
-        this.commandsTreeData = [];
-        this.convertCommandsDataToTreeGridFormat(this.commands, this.commandsTreeData, 0, null);
-        this.assignTreeCollapseState(this.commandsTreeData, oldCommandsTreeData);
-        this.updateViewModel(this.commands, activeViewModel);
+        this.rebuildCommandTree(activeViewModel);
+
         return this.commandsTreeData;
 
     }
@@ -379,4 +395,92 @@ export class MethodBuilder {
         }
 
     }
+
+    /**
+     * 复制方法
+     */
+    public onCopyMethod(selectedTreeNode: any, activeViewModelId: string) {
+        if (!selectedTreeNode) {
+            return;
+        }
+        this.commandToBePasted.value = cloneDeep(selectedTreeNode.data);
+        this.commandToBePastedViewModelId = activeViewModelId;
+
+
+        this.notifyService.success('复制成功，请在目标模型中粘贴方法');
+    }
+    /**
+     * 粘贴命令：打开方法名称和编号的编辑窗口
+     */
+    public async openMethodEditor(methodEditorVisible: Ref<boolean>, commandForMethodEditor: Ref<Command>) {
+        if (!this.commandToBePasted.value) {
+            this.notifyService.warning('请先选择方法进行复制');
+            return;
+        }
+        const newCommand = await this.checkValidationOfCommand(this.commandToBePasted.value, this.commandToBePastedViewModelId);
+        if (!newCommand) {
+            this.messageService.warning(`【${this.commandToBePasted.value?.name}】已失效，请重新选择方法进行复制。`, '');
+            return;
+        }
+        newCommand.id = new IdService().generate();
+        newCommand.code = newCommand.code + 'Copy';
+        newCommand.name = newCommand.name + '副本';
+        this.commandToBePasted.value = newCommand;
+        this.commandToBePasted.value.isNewGenerated = false;
+        this.commandToBePasted.value.targetComponent = undefined;
+
+        methodEditorVisible.value = true;
+        commandForMethodEditor.value = this.commandToBePasted.value;
+    }
+
+    public onMethodPasted(newCommandData: any, activeViewModel: any) {
+        if (!newCommandData || !this.commandToBePasted?.value) {
+            return;
+        }
+
+        Object.assign(this.commandToBePasted.value, newCommandData);
+        // 1、复制的命令来源于内置控制器
+        if (this.commandToBePasted.value.isFromPresetController) {
+
+            this.commands.push(this.commandToBePasted.value);
+            this.addWebCommandHandler(this.commandToBePasted.value);
+
+            this.rebuildCommandTree(activeViewModel);
+            return this.commandsTreeData;
+        }
+    }
+    /**
+     * 校验单个命令是否有效，并获取命令的最新值
+     * @param webCmdId 命令所属构件id
+     * @param handlerName 命令在构件中的编号
+     */
+    private async checkValidationOfCommand(originalCommand: Command, viewModelId: string): Promise<Command | null> {
+        const viewModel = this.useFormSchema.getViewModelById(viewModelId);
+        const viewModelCommand = viewModel?.commands.find(co => co.id === originalCommand.id);
+
+        // 命令已在视图模型中被移除
+        if (!viewModelCommand) {
+            return Promise.resolve(null);
+        }
+        const formBasicInfo = this.useFormSchema.getFormMetadataBasicInfo()
+        const relativePath = formBasicInfo ? formBasicInfo.relativePath : '';
+
+        return new Promise((resolve, reject) => {
+            new MetadataService().getRefMetadata(relativePath, viewModelCommand.cmpId).then(response => {
+                const metadataContent = JSON.parse(response?.data?.content);
+                const webCommand = metadataContent.Commands.find(item => item.Code === viewModelCommand.handlerName);
+                if (webCommand) {
+                    const newCommand = new Command(webCommand, viewModelCommand, metadataContent);
+
+                    resolve(newCommand);
+                } else {
+                    resolve(null);
+                }
+            }, error => {
+                this.messageService.warning(error?.response?.data?.Message || `获取元数据${viewModelCommand.name}失败，请检查。`, '');
+                resolve(null);
+            });
+        });
+
+    }
 }
diff --git a/packages/designer/src/components/components/view-model-designer/method-manager/method-manager.component.tsx b/packages/designer/src/components/components/view-model-designer/method-manager/method-manager.component.tsx
index 8b5ad20ca0b..4a277c29098 100644
--- a/packages/designer/src/components/components/view-model-designer/method-manager/method-manager.component.tsx
+++ b/packages/designer/src/components/components/view-model-designer/method-manager/method-manager.component.tsx
@@ -1,4 +1,4 @@
-import { SetupContext, defineComponent, ref, computed, inject } from "vue";
+import { SetupContext, defineComponent, ref, computed, inject, Ref } from "vue";
 import { FNotifyService, FModal, FSplitter, FSplitterPane } from "@farris/ui-vue/components";
 import { FormViewModel, FormWebCmd, UseFormSchema } from "../../../types";
 import { MethodBuilder } from "./composition/build-method";
@@ -37,6 +37,13 @@ export default defineComponent({
         /** 是否显示重命名方法的弹窗 */
         const methodEditorVisible = ref(false);
 
+        /** 当前编辑的方法，用于编辑方法名称和编号的弹窗 */
+        const commandForMethodEditor = ref();
+        /** 编辑命令的触发来源 */
+        const methodEditingType: Ref<'Editing' | 'Copying'> = ref('Editing');
+        /** 编辑命令窗口的标题 */
+        const methodEditorTitle = ref('');
+
         const viewModelTabClass = computed(() => (viewModelTabId: string) => {
             return { 'f-listview-active': activeViewModel.value && activeViewModel.value.id === viewModelTabId };
         });
@@ -152,11 +159,14 @@ export default defineComponent({
                 notifyService.warning({ message: '不允许重命名基础表单的方法' });
                 return;
             }
+            methodEditingType.value = 'Editing';
+            methodEditorTitle.value = '重命名方法';
+            commandForMethodEditor.value = methodListRef.value.selectedTreeNode?.data;
             methodEditorVisible.value = true;
         }
         /**
-         * 方法编号、名称修改后事件
-         */
+        * 方法编号、名称修改后事件
+        */
         function onMethodEdited(newCommandData: any) {
             const { id, code: previousCommandCode } = methodListRef.value.selectedTreeNode;
             const newCommandsTreeData = methodBuilderComposition.editCommand(methodListRef.value.selectedTreeNode, activeViewModel.value, newCommandData);
@@ -171,7 +181,62 @@ export default defineComponent({
             if (previousCommandCode !== newCommandData.code) {
                 notifyService.success({ message: '修改方法编号后请重新绑定控件交互事件！' });
             }
+        }
+
+        /**
+         * 复制方法
+         */
+        function onClickCopyMethod() {
+            if (!methodListRef.value.selectedTreeNode || !methodListRef.value.isCommandNodeSelected) {
+                notifyService.warning({ message: '请先选择方法' });
+                return;
+            }
+            if (!methodListRef.value?.isValidCommandSelected) {
+                notifyService.warning({ message: '方法已失效，不支持复制' });
+                return;
+            }
+
+            if (!methodListRef.value?.selectedTreeNode.data?.isFromPresetController) {
+                notifyService.warning({ message: '暂不支持复制自定义控制器方法' });
+                return;
+            }
+            methodBuilderComposition.onCopyMethod(methodListRef.value.selectedTreeNode, activeViewModel.value?.id);
+        }
 
+        /**
+         * 粘贴方法
+         */
+        function onClickPasteMethod() {
+            methodEditingType.value = 'Copying';
+            methodEditorTitle.value = '粘贴方法';
+            methodBuilderComposition.openMethodEditor(methodEditorVisible, commandForMethodEditor)
+        }
+        /**
+         * 粘贴方法后事件
+         * @param newCommandData 
+         */
+        function onMethodPasted(newCommandData: any) {
+            const data = methodBuilderComposition.onMethodPasted(newCommandData, activeViewModel.value);
+            if (data) {
+                commandsTreeData.value = data;
+                methodListRef.value.refreshMethodList(commandsTreeData.value, activeViewModel.value, newCommandData.id);
+                notifyService.success({ message: '粘贴成功' });
+            }
+        }
+        /**
+         * 关闭方法编辑窗口
+         */
+        function onAfterMethodEditClosed(newCommandData: any) {
+            switch (methodEditingType.value) {
+                case 'Editing': {
+                    onMethodEdited(newCommandData);
+                    break;
+                }
+                case 'Copying': {
+                    onMethodPasted(newCommandData);
+                    break;
+                }
+            }
             methodEditorVisible.value = false;
         }
 
@@ -188,6 +253,20 @@ export default defineComponent({
             };
         });
 
+        const toolbarItemCanCopyClass = computed(() => {
+            // 暂时只支持内置控制器的方法进行复制
+            return {
+                'toolbar-item': true,
+                'disable': methodListRef.value?.isValidCommandSelected && methodListRef.value?.selectedTreeNode?.data?.isFromPresetController ? false : true
+            };
+        });
+        const toolbarItemCanPasteClass = computed(() => {
+            return {
+                'toolbar-item': true,
+                'disable': methodBuilderComposition.commandToBePasted?.value ? false : true
+            };
+        });
+
         function onViewSource($event: any) {
             context.emit('viewSource', $event);
         }
@@ -219,6 +298,18 @@ export default defineComponent({
                                         <div class="toolbar-item-icon toolbar-item-icon-edit"></div>
                                         <span class="toolbar-item-text"> 重命名方法 </span>
                                     </div>
+                                    <div class="toolbar-item-spilter"></div>
+
+                                    <div class={toolbarItemCanCopyClass.value} onClick={onClickCopyMethod}>
+                                        <div class="f-icon f-icon-copy mr-1"></div>
+                                        <span class="toolbar-item-text"> 复制方法 </span>
+                                    </div>
+                                    <div class="toolbar-item-spilter"></div>
+
+                                    <div class={toolbarItemCanPasteClass.value} onClick={onClickPasteMethod}>
+                                        <div class="f-icon f-icon-paste-html mr-1"></div>
+                                        <span class="toolbar-item-text"> 粘贴方法 </span>
+                                    </div>
                                 </div>
                                 <FMethodList
                                     ref={methodListRef}
@@ -238,11 +329,11 @@ export default defineComponent({
                     }
                     {
                         methodEditorVisible.value ?
-                            <FModal v-model={methodEditorVisible.value} title="重命名方法" width={450} height={220} show-buttons={false} fit-content={false} draggable={true}>
+                            <FModal v-model={methodEditorVisible.value} title={methodEditorTitle.value} width={450} height={220} show-buttons={false} fit-content={false} draggable={true}>
                                 <FMethodEditor
-                                    command={methodListRef.value.selectedTreeNode?.data}
+                                    command={commandForMethodEditor.value}
                                     activeViewModel={activeViewModel.value}
-                                    onSubmit={onMethodEdited}
+                                    onSubmit={onAfterMethodEditClosed}
                                     onCancel={() => { methodEditorVisible.value = false; }}></FMethodEditor>
                             </FModal > : ''
                     }
diff --git a/packages/designer/src/components/components/view-model-designer/variable-manager/variable-manager.scss b/packages/designer/src/components/components/view-model-designer/variable-manager/variable-manager.scss
index 2c71a362f88..ac9f869762a 100644
--- a/packages/designer/src/components/components/view-model-designer/variable-manager/variable-manager.scss
+++ b/packages/designer/src/components/components/view-model-designer/variable-manager/variable-manager.scss
@@ -27,6 +27,7 @@
     .cell-wrapper .shown-value {
         text-overflow: ellipsis;
         overflow: hidden;
+        user-select: text;
     }
 
     .view-model-toolbar {
-- 
Gitee


From 40972ab88b66a8df4c9a79734313c2ac256fa047 Mon Sep 17 00:00:00 2001
From: wang-xh <wang-xh@inspur.com>
Date: Mon, 25 Aug 2025 15:27:31 +0800
Subject: [PATCH 8/9] =?UTF-8?q?fix:=20=E4=BF=AE=E6=94=B9=E5=A4=8D=E5=88=B6?=
 =?UTF-8?q?=E7=B2=98=E8=B4=B4=E6=96=B9=E6=B3=95=E6=97=B6=E6=96=B9=E6=B3=95?=
 =?UTF-8?q?=E6=93=8D=E4=BD=9Cid=E9=87=8D=E5=A4=8D=E7=AD=89=E9=97=AE?=
 =?UTF-8?q?=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../method-editor/method-editor.component.tsx | 33 +++++++-------
 .../composition/build-method.ts               | 43 +++++++++++++------
 .../method-manager.component.tsx              |  8 ++--
 3 files changed, 51 insertions(+), 33 deletions(-)

diff --git a/packages/designer/src/components/components/view-model-designer/method-manager/components/method-editor/method-editor.component.tsx b/packages/designer/src/components/components/view-model-designer/method-manager/components/method-editor/method-editor.component.tsx
index bd4ea9d770e..265038947eb 100644
--- a/packages/designer/src/components/components/view-model-designer/method-manager/components/method-editor/method-editor.component.tsx
+++ b/packages/designer/src/components/components/view-model-designer/method-manager/components/method-editor/method-editor.component.tsx
@@ -34,12 +34,12 @@ export default defineComponent({
             const commandNames = commandsInViewModel.value.map((command: any) => {
                 if (command.id !== commandData.value.id) { return command.name; }
             });
-            if (commandNames.includes(commandData.value.name.trim())) {
-                notifyService.warning({ message: `【${commandData.value.name.trim()}】已存在，请修改！` });
+            if (commandNames.includes(commandData.value.name)) {
+                notifyService.warning({ message: `【${commandData.value.name}】已存在，请修改！` });
                 return false;
             }
 
-            const newCommandCode = commandData.value.code.trim();
+            const newCommandCode = commandData.value.code;
             // 2、当前视图模型下编号不可重复，编号不区分大小写
             const commandCodes = commandsInViewModel.value.filter((command) => command.id !== commandData.value.id)
                 .map((command) => command.code.toLowerCase());
@@ -50,14 +50,14 @@ export default defineComponent({
 
             // 3、其他视图模型下编号不可重复
             const viewModels = useFormSchema.getFormSchema().module.viewmodels;
-            viewModels.filter((viewModel) => viewModel.id !== activeViewModelId.value)
-                .forEach((viewModel) => {
-                    const commandCodesInViewModel = viewModel.commands.map((command) => command.code.toLowerCase());
-                    if (commandCodesInViewModel.includes(newCommandCode)) {
-                        notifyService.warning({ message: '视图模型【' + viewModel.id + '】中已存在命令编号【' + newCommandCode + '】，请修改！' });
-                        return false;
-                    }
-                });
+            const otherViewModels = viewModels.filter((viewModel) => viewModel.id !== activeViewModelId.value);
+            for (const viewModel of otherViewModels) {
+                const commandCodesInViewModel = viewModel.commands.map((command) => command.code.toLowerCase());
+                if (commandCodesInViewModel.includes(newCommandCode.toLowerCase())) {
+                    notifyService.warning({ message: `【${newCommandCode}】已存在，请修改！` });
+                    return false;
+                }
+            }
 
             // 4、编号格式：由英文字母开头，英文字母、数字和下划线组成
             const reg1 = /^[a-zA-Z][a-zA-Z0-9_]*$/;
@@ -72,11 +72,13 @@ export default defineComponent({
             context.emit('cancel');
         }
         function onSubmitClicked() {
-            if (!commandData.value?.name?.trim()) {
+            commandData.value.code = commandData.value.code.trim();
+            commandData.value.name = commandData.value.name.trim();
+            if (!commandData.value.name) {
                 notifyService.warning('请输入方法名称');
                 return;
             }
-            if (!commandData.value?.code?.trim()) {
+            if (!commandData.value.code) {
                 notifyService.warning('请输入方法编号');
                 return;
             }
@@ -84,10 +86,7 @@ export default defineComponent({
                 return;
             }
 
-            context.emit('submit', {
-                code: commandData.value.code.trim(),
-                name: commandData.value.name.trim()
-            });
+            context.emit('submit', commandData.value);
         }
 
         return () => {
diff --git a/packages/designer/src/components/components/view-model-designer/method-manager/composition/build-method.ts b/packages/designer/src/components/components/view-model-designer/method-manager/composition/build-method.ts
index 46a2f45bbc7..9fbec95f2ac 100644
--- a/packages/designer/src/components/components/view-model-designer/method-manager/composition/build-method.ts
+++ b/packages/designer/src/components/components/view-model-designer/method-manager/composition/build-method.ts
@@ -30,10 +30,6 @@ export class MethodBuilder {
     /** 待复制的命令所在的视图模型id */
     private commandToBePastedViewModelId: string = '';
 
-    private reloadCommandTree() {
-
-    }
-
     /**
      * 加载表单相关的控制器和控制器内的方法，并组装为树表格所需的结构
      * @param commandsJson
@@ -409,36 +405,57 @@ export class MethodBuilder {
 
         this.notifyService.success('复制成功，请在目标模型中粘贴方法');
     }
+
+    /**
+     * 将选中命令进行唯一化改造
+     */
+    private uniqueReferenceCommand(command: Command): Command {
+        // 唯一化命令
+        command.id = new IdService().generate();
+        command.code = command.code + 'Copy';
+        command.name = command.name + '副本';
+
+        // 唯一化操作
+        if (command.handlers && Array.isArray(command.handlers)) {
+            for (const item of command.handlers) {
+                item.id = new IdService().generate();
+            }
+        }
+        return command;
+    }
     /**
      * 粘贴命令：打开方法名称和编号的编辑窗口
      */
-    public async openMethodEditor(methodEditorVisible: Ref<boolean>, commandForMethodEditor: Ref<Command>) {
+    public async openMethodEditor(methodEditorVisible: Ref<boolean>, commandForMethodEditor: Ref<Command>, loadingService: any) {
         if (!this.commandToBePasted.value) {
             this.notifyService.warning('请先选择方法进行复制');
             return;
         }
+        const loadingInstance = loadingService?.show();
         const newCommand = await this.checkValidationOfCommand(this.commandToBePasted.value, this.commandToBePastedViewModelId);
+        if (loadingInstance?.value) {
+            loadingInstance.value.close();
+        }
         if (!newCommand) {
             this.messageService.warning(`【${this.commandToBePasted.value?.name}】已失效，请重新选择方法进行复制。`, '');
             return;
         }
-        newCommand.id = new IdService().generate();
-        newCommand.code = newCommand.code + 'Copy';
-        newCommand.name = newCommand.name + '副本';
-        this.commandToBePasted.value = newCommand;
+        this.commandToBePasted.value = cloneDeep(newCommand);
         this.commandToBePasted.value.isNewGenerated = false;
         this.commandToBePasted.value.targetComponent = undefined;
 
+        this.uniqueReferenceCommand(newCommand);
+
         methodEditorVisible.value = true;
-        commandForMethodEditor.value = this.commandToBePasted.value;
+        commandForMethodEditor.value = newCommand;
     }
 
-    public onMethodPasted(newCommandData: any, activeViewModel: any) {
+    public onMethodPasted(newCommandCodeName: any, activeViewModel: any, newCommandData) {
         if (!newCommandData || !this.commandToBePasted?.value) {
             return;
         }
 
-        Object.assign(this.commandToBePasted.value, newCommandData);
+        Object.assign(this.commandToBePasted.value, newCommandData, newCommandCodeName);
         // 1、复制的命令来源于内置控制器
         if (this.commandToBePasted.value.isFromPresetController) {
 
@@ -446,6 +463,8 @@ export class MethodBuilder {
             this.addWebCommandHandler(this.commandToBePasted.value);
 
             this.rebuildCommandTree(activeViewModel);
+
+            this.commandToBePasted.value = undefined;
             return this.commandsTreeData;
         }
     }
diff --git a/packages/designer/src/components/components/view-model-designer/method-manager/method-manager.component.tsx b/packages/designer/src/components/components/view-model-designer/method-manager/method-manager.component.tsx
index 4a277c29098..665d2e9feaa 100644
--- a/packages/designer/src/components/components/view-model-designer/method-manager/method-manager.component.tsx
+++ b/packages/designer/src/components/components/view-model-designer/method-manager/method-manager.component.tsx
@@ -209,17 +209,17 @@ export default defineComponent({
         function onClickPasteMethod() {
             methodEditingType.value = 'Copying';
             methodEditorTitle.value = '粘贴方法';
-            methodBuilderComposition.openMethodEditor(methodEditorVisible, commandForMethodEditor)
+            methodBuilderComposition.openMethodEditor(methodEditorVisible, commandForMethodEditor, LoadingService)
         }
         /**
          * 粘贴方法后事件
          * @param newCommandData 
          */
-        function onMethodPasted(newCommandData: any) {
-            const data = methodBuilderComposition.onMethodPasted(newCommandData, activeViewModel.value);
+        function onMethodPasted(newCommandCodeName: any) {
+            const data = methodBuilderComposition.onMethodPasted(newCommandCodeName, activeViewModel.value, commandForMethodEditor.value);
             if (data) {
                 commandsTreeData.value = data;
-                methodListRef.value.refreshMethodList(commandsTreeData.value, activeViewModel.value, newCommandData.id);
+                methodListRef.value.refreshMethodList(commandsTreeData.value, activeViewModel.value, commandForMethodEditor.value.id);
                 notifyService.success({ message: '粘贴成功' });
             }
         }
-- 
Gitee


From c8191dfa5543623485d1e74daed5272d93f86a09 Mon Sep 17 00:00:00 2001
From: wang-xh <wang-xh@inspur.com>
Date: Tue, 26 Aug 2025 09:27:33 +0800
Subject: [PATCH 9/9] =?UTF-8?q?fix:=20=E4=BF=AE=E6=94=B9=E4=BB=A3=E7=A0=81?=
 =?UTF-8?q?=E8=A7=84=E8=8C=83=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../method-manager/composition/build-method.ts                | 2 +-
 .../method-manager/method-manager.component.tsx               | 2 +-
 .../designer/src/components/types/form-property-config.ts     | 2 +-
 .../src/compositions/use-dragula/use-dragula-common-rule.ts   | 2 +-
 .../src/composition/function/use-designer-component.ts        | 2 +-
 .../bound-event-selector/bound-event-selector.component.tsx   | 4 ++--
 packages/ui-vue/components/events-editor/src/types.ts         | 2 +-
 7 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/packages/designer/src/components/components/view-model-designer/method-manager/composition/build-method.ts b/packages/designer/src/components/components/view-model-designer/method-manager/composition/build-method.ts
index 9fbec95f2ac..b393f7089d3 100644
--- a/packages/designer/src/components/components/view-model-designer/method-manager/composition/build-method.ts
+++ b/packages/designer/src/components/components/view-model-designer/method-manager/composition/build-method.ts
@@ -481,7 +481,7 @@ export class MethodBuilder {
         if (!viewModelCommand) {
             return Promise.resolve(null);
         }
-        const formBasicInfo = this.useFormSchema.getFormMetadataBasicInfo()
+        const formBasicInfo = this.useFormSchema.getFormMetadataBasicInfo();
         const relativePath = formBasicInfo ? formBasicInfo.relativePath : '';
 
         return new Promise((resolve, reject) => {
diff --git a/packages/designer/src/components/components/view-model-designer/method-manager/method-manager.component.tsx b/packages/designer/src/components/components/view-model-designer/method-manager/method-manager.component.tsx
index 665d2e9feaa..79ffcdab9ab 100644
--- a/packages/designer/src/components/components/view-model-designer/method-manager/method-manager.component.tsx
+++ b/packages/designer/src/components/components/view-model-designer/method-manager/method-manager.component.tsx
@@ -209,7 +209,7 @@ export default defineComponent({
         function onClickPasteMethod() {
             methodEditingType.value = 'Copying';
             methodEditorTitle.value = '粘贴方法';
-            methodBuilderComposition.openMethodEditor(methodEditorVisible, commandForMethodEditor, LoadingService)
+            methodBuilderComposition.openMethodEditor(methodEditorVisible, commandForMethodEditor, LoadingService);
         }
         /**
          * 粘贴方法后事件
diff --git a/packages/designer/src/components/types/form-property-config.ts b/packages/designer/src/components/types/form-property-config.ts
index 925108314e8..527ff5fd5af 100644
--- a/packages/designer/src/components/types/form-property-config.ts
+++ b/packages/designer/src/components/types/form-property-config.ts
@@ -48,5 +48,5 @@ export function resolveFormModulePropertyConfig(designerMode: DesignerMode) {
                 }
             }
         }
-    }
+    };
 };
diff --git a/packages/mobile-ui-vue/components/common/src/compositions/use-dragula/use-dragula-common-rule.ts b/packages/mobile-ui-vue/components/common/src/compositions/use-dragula/use-dragula-common-rule.ts
index 8337fec1d1f..7c2eafa9df4 100644
--- a/packages/mobile-ui-vue/components/common/src/compositions/use-dragula/use-dragula-common-rule.ts
+++ b/packages/mobile-ui-vue/components/common/src/compositions/use-dragula/use-dragula-common-rule.ts
@@ -51,4 +51,4 @@ export function useDragulaCommonRule() {
     return {
         basalDragulaRuleForContainer
     };
-}
\ No newline at end of file
+}
diff --git a/packages/ui-vue/components/designer-canvas/src/composition/function/use-designer-component.ts b/packages/ui-vue/components/designer-canvas/src/composition/function/use-designer-component.ts
index 0c28cf311a3..9e3a624ec64 100644
--- a/packages/ui-vue/components/designer-canvas/src/composition/function/use-designer-component.ts
+++ b/packages/ui-vue/components/designer-canvas/src/composition/function/use-designer-component.ts
@@ -289,7 +289,7 @@ export function useDesignerComponent(
                             const pathArray = controlBasicInfoMap.get(componentId).parentPathName.split(' > ');
                             pathArray[0] = propertyValue;
                             controlBasicInfoMap.get(componentId).parentPathName = pathArray.join(' > ');
-                        })
+                        });
                     }
                 }
             }
diff --git a/packages/ui-vue/components/events-editor/src/components/bound-event-selector/bound-event-selector.component.tsx b/packages/ui-vue/components/events-editor/src/components/bound-event-selector/bound-event-selector.component.tsx
index 11c2ef004b4..1751ac6f224 100644
--- a/packages/ui-vue/components/events-editor/src/components/bound-event-selector/bound-event-selector.component.tsx
+++ b/packages/ui-vue/components/events-editor/src/components/bound-event-selector/bound-event-selector.component.tsx
@@ -236,7 +236,7 @@ export default defineComponent({
                 'f-vm-all': true,
                 ' h-100': true,
                 'has-page-list': shouldShowPageList.value
-            }
+            };
         });
         /** 获取所有模型下的命令 */
         function getAllCommands(formSchema: any) {
@@ -285,7 +285,7 @@ export default defineComponent({
                 viewModelData.value.map((viewModelDataItem: any) => {
                     viewModelDataItem.sourceComponent.map.map(mapItem => {
                         mapItem.hide = false;
-                        mapItem.active = false
+                        mapItem.active = false;
                     });
                 });
             }
diff --git a/packages/ui-vue/components/events-editor/src/types.ts b/packages/ui-vue/components/events-editor/src/types.ts
index 6f42427a0da..1822f59693c 100644
--- a/packages/ui-vue/components/events-editor/src/types.ts
+++ b/packages/ui-vue/components/events-editor/src/types.ts
@@ -215,6 +215,6 @@ export interface InteractionItem {
     communication?: Array<Communication>;
 
     /** 是否显示选择通讯命令的窗口*/
-    needSelectCommunicationCommand?: false;
+    needSelectCommunicationCommand?: boolean;
 }
 export * from "./components/combine-form/types";
-- 
Gitee