fix:动作配置

Change-Id: Ia0bada12e46fe36044163b28e1ce1f9f4b9eaea6

packages/amis-editor/src/renderer/event-control/action-config-dialog.tsx

@@ -8,6 +8,7 @@ import React from 'react';
 import {ActionConfig, ComponentInfo} from './types';
 import ActionConfigPanel from './action-config-panel';
 import {BASE_ACTION_PROPS} from './comp-action-select';
+import { findActionNode } from './helper';
 
 interface ActionDialogProp {
   show: boolean;
@@ -39,7 +40,7 @@ export default class ActionDialog extends React.Component<ActionDialogProp> {
       array.forEach(node => {
         if (node.children) {
           getSearchList(result, node.children, keywords);
-        } else if (node.actionLabel.includes(keywords)) {
+        } else if (node.actionLabel!.includes(keywords)) {
           result.push({...node});
         }
       });
@@ -81,7 +82,7 @@ export default class ActionDialog extends React.Component<ActionDialogProp> {
                 autoFocus: true,
                 data: {
                   // 直接传入时内部有函数引用等解析会报错
-                  resultActionTree: JSON.parse(JSON.stringify(actionTree)),
+                  __resultActionTree: JSON.parse(JSON.stringify(actionTree)),
                 },
                 preventEnterSubmit: true,
                 // debug: true,
@@ -101,7 +102,7 @@ export default class ActionDialog extends React.Component<ActionDialogProp> {
                           },
                           {
                             type: 'input-text',
-                            name: 'keywords',
+                            name: '__keywords',
                             className: 'action-tree-search',
                             placeholder: '请搜索执行动作',
                             clearable: true,
@@ -113,9 +114,9 @@ export default class ActionDialog extends React.Component<ActionDialogProp> {
                             ) => {
                               if (value) {
                                 const list = this.getTreeSearchList(actionTree, value);
-                                form.setValueByName('resultActionTree', list);
+                                form.setValueByName('__resultActionTree', list);
                               } else {
-                                form.setValueByName('resultActionTree', actionTree);
+                                form.setValueByName('__resultActionTree', actionTree);
                               }
                             }
                           },
@@ -124,8 +125,8 @@ export default class ActionDialog extends React.Component<ActionDialogProp> {
                             name: 'actionType',
                             disabled: false,
                             onlyLeaf: true,
-                            highlightTxt: '${keywords}',
-                            source: '${resultActionTree}',
+                            highlightTxt: '${__keywords}',
+                            source: '${__resultActionTree}',
                             showIcon: false,
                             className: 'action-tree',
                             mode: 'normal',
@@ -182,20 +183,21 @@ export default class ActionDialog extends React.Component<ActionDialogProp> {
                                 __cmptActionType = 'enabled';
                               }
 
-                              const action = data.selectedOptions[0];
+                              const actionNode = findActionNode(actionTree, value);
+
                               form.setValues({
                                 ...removeKeys,
-                                resultActionTree: form.data.resultActionTree,
-                                keywords: form.data.keywords,
+                                __resultActionTree: form.data.__resultActionTree,
+                                __keywords: form.data.__keywords,
                                 componentId: form.data.componentId
                                   ? ''
                                   : undefined,
                                 __cmptActionType,
-                                __actionDesc: action.description,
-                                __actionSchema: action.schema,
-                                __subActions: action.actions,
-                                __cmptTreeSource: action.supportComponents
-                                  ? getComponents?.(action) ?? []
+                                __actionDesc: actionNode?.description,
+                                __actionSchema: actionNode?.schema,
+                                __subActions: actionNode?.actions,
+                                __cmptTreeSource: actionNode?.supportComponents
+                                  ? getComponents?.(actionNode) ?? []
                                   : []
                               });
                             }
@@ -254,7 +256,7 @@ export default class ActionDialog extends React.Component<ActionDialogProp> {
                                 label: '执行条件',
                                 mode: 'horizontal',
                                 size: 'lg',
-                                placeholder: '不设置条件，默认执行该动作',
+                                placeholder: '默认执行该动作',
                                 visibleOn: 'data.actionType'
                               }
                             ]

packages/amis-editor/src/renderer/event-control/action-config-panel.tsx

@@ -3,10 +3,11 @@
  */
 
 import {RendererProps, Schema} from 'amis-core';
-import {RendererPluginAction} from 'amis-editor-core';
+import {defaultValue, RendererPluginAction} from 'amis-editor-core';
 import React from 'react';
 import cx from 'classnames';
 import {COMMON_ACTION_SCHEMA_MAP, renderCmptActionSelect} from './helper';
+import { Button } from 'amis';
 
 export default class ActionConfigPanel extends React.Component<RendererProps> {
   render() {
@@ -18,26 +19,26 @@ export default class ActionConfigPanel extends React.Component<RendererProps> {
       ...COMMON_ACTION_SCHEMA_MAP,
       ...actionConfigItemsMap
     };
-    let schema: any = data.__actionSchema;
+    let schema: any = null;
 
-    // 找不到动作树中的动作schema的话，就从plugins或者通用动作配置中获取
-    if (!schema) {
-      // 组件特性动作从plugins里面获取
-      if (data.actionType === 'component') {
-        const subActionSchema =
-          pluginActions?.[data.__rendererName]?.find(
-            (item: RendererPluginAction) =>
-              item.actionType === data.__cmptActionType
-          )?.schema ?? commonActionConfig[data.__cmptActionType]?.schema;
-        const baseSchema = renderCmptActionSelect('选择组件', true);
-        // 追加到基础配置
-        schema = [
-          ...(Array.isArray(baseSchema) ? baseSchema : [baseSchema]),
-          ...(Array.isArray(subActionSchema)
-            ? subActionSchema
-            : [subActionSchema])
-        ];
-      }
+    if (data.actionType === 'component') {
+      // 获取组件动作配置
+      const subActionSchema =
+        pluginActions?.[data.__rendererName]?.find(
+          (item: RendererPluginAction) =>
+            item.actionType === data.__cmptActionType
+        )?.schema ?? commonActionConfig[data.__cmptActionType]?.schema;
+      const baseSchema = renderCmptActionSelect('选择组件', true);
+      // 追加到基础配置
+      schema = [
+        ...(Array.isArray(baseSchema) ? baseSchema : [baseSchema]),
+        ...(Array.isArray(subActionSchema)
+          ? subActionSchema
+          : [subActionSchema])
+      ];
+    }
+    else {
+      schema = data.__actionSchema;
     }
 
     return schema ? (

packages/amis-editor/src/renderer/event-control/actions.tsx

@@ -718,7 +718,9 @@ const ACTION_TYPE_TREE = (manager: any): RendererPluginAction[] => {
             return (
               <div>
                 提交
-                <span className="variable-right">{info?.__rendererLabel}</span>
+                <span className="variable-right">
+                  {info?.__rendererLabel}
+                </span>
                 的数据
               </div>
             );
@@ -734,7 +736,9 @@ const ACTION_TYPE_TREE = (manager: any): RendererPluginAction[] => {
             return (
               <div>
                 清空
-                <span className="variable-right">{info?.__rendererLabel}</span>
+                <span className="variable-right">
+                  {info?.__rendererLabel}
+                </span>
                 的数据
               </div>
             );
@@ -750,7 +754,9 @@ const ACTION_TYPE_TREE = (manager: any): RendererPluginAction[] => {
             return (
               <div>
                 重置
-                <span className="variable-right">{info?.__rendererLabel}</span>
+                <span className="variable-right">
+                  {info?.__rendererLabel}
+                </span>
                 的数据
               </div>
             );
@@ -766,7 +772,9 @@ const ACTION_TYPE_TREE = (manager: any): RendererPluginAction[] => {
             return (
               <div>
                 校验
-                <span className="variable-right">{info?.__rendererLabel}</span>
+                <span className="variable-right">
+                  {info?.__rendererLabel}
+                </span>
                 的数据
               </div>
             );
@@ -797,7 +805,9 @@ const ACTION_TYPE_TREE = (manager: any): RendererPluginAction[] => {
             return (
               <div>
                 复制内容：
-                <span className="variable-left">{info?.args?.content}</span>
+                <span className="variable-left">
+                  {info?.args?.content}
+                </span>
               </div>
             );
           },

packages/amis-editor/src/renderer/event-control/helper.tsx

@@ -430,11 +430,11 @@ export const getPropOfAcion = (
 };
 
 // 渲染组件选择配置项
-export function renderCmptSelect(
+export const renderCmptSelect = (
   componentLabel: string,
   required: boolean,
   onChange?: (value: string, oldVal: any, data: any, form: any) => void
-) {
+) => {
   return [
     {
       type: 'tree-select',
@@ -461,11 +461,11 @@ export function renderCmptSelect(
 }
 
 // 渲染组件特性动作配置项
-export function renderCmptActionSelect(
+export const renderCmptActionSelect = (
   componentLabel: string,
   required: boolean,
   onChange?: (value: string, oldVal: any, data: any, form: any) => void
-) {
+) => {
   return [
     ...renderCmptSelect(
       '选择组件',