fix:修复disabled失效问题 (#4329)

* fix:修复disabled失效问题

* test:补充事件动作测试用例

__tests__/event-action/__snapshots__/disabled.test.tsx.snap

@@ -0,0 +1,150 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`EventAction:disabled 1`] = `
+<div>
+  <div
+    class="cxd-Page"
+  >
+    <div
+      class="cxd-Page-content"
+    >
+      <div
+        class="cxd-Page-main"
+      >
+        <div
+          class="cxd-Page-body"
+        >
+          <div
+            class="cxd-Button cxd-Button--default is-disabled"
+            disabled=""
+          >
+            <span>
+              按钮1
+            </span>
+          </div>
+          <button
+            class="cxd-Button cxd-Button--default"
+            type="button"
+          >
+            <span>
+              按钮2
+            </span>
+          </button>
+          <div
+            class="cxd-Button cxd-Button--default is-disabled"
+            disabled=""
+          >
+            <span>
+              按钮3
+            </span>
+          </div>
+          <button
+            class="cxd-Button cxd-Button--default"
+            type="button"
+          >
+            <span>
+              按钮4
+            </span>
+          </button>
+          <button
+            class="cxd-Button cxd-Button--default"
+            type="button"
+          >
+            <span>
+              按钮5
+            </span>
+          </button>
+          <button
+            class="cxd-Button cxd-Button--default"
+            type="button"
+          >
+            <span>
+              按钮6
+            </span>
+          </button>
+          <div
+            class="cxd-Panel cxd-Panel--default cxd-Panel--form"
+            style="position: relative;"
+          >
+            <div
+              class="cxd-Panel-heading"
+            >
+              <h3
+                class="cxd-Panel-title"
+              >
+                <span
+                  class="cxd-TplField"
+                >
+                  <span>
+                    表单
+                  </span>
+                </span>
+              </h3>
+            </div>
+            <div
+              class="cxd-Panel-body"
+            >
+              <form
+                class="cxd-Form cxd-Form--normal"
+                novalidate=""
+              >
+                <input
+                  style="display: none;"
+                  type="submit"
+                />
+                <div
+                  class="cxd-Button cxd-Button--default is-disabled ml-2"
+                  disabled=""
+                >
+                  <span>
+                    我的状态变了
+                  </span>
+                </div>
+              </form>
+            </div>
+            <div
+              class="resize-sensor"
+              style="position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px; overflow: scroll; z-index: -1; visibility: hidden;"
+            >
+              
+  
+              <div
+                class="resize-sensor-expand"
+                style="position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: scroll; z-index: -1; visibility: hidden;"
+              >
+                
+    
+                <div
+                  style="position: absolute; left: 0px; top: 0px; width: 10px; height: 10px;"
+                />
+                
+  
+              </div>
+              
+  
+              <div
+                class="resize-sensor-shrink"
+                style="position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: scroll; z-index: -1; visibility: hidden;"
+              >
+                
+    
+                <div
+                  style="position: absolute; left: 0; top: 0; width: 200%; height: 200%"
+                />
+                
+  
+              </div>
+              
+  
+              <div
+                class="resize-sensor-appear"
+                style="position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: scroll; z-index: -1; visibility: hidden;animation-name: apearSensor; animation-duration: 0.2s;"
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;

__tests__/event-action/__snapshots__/hidden.test.tsx.snap

@@ -0,0 +1,46 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`EventAction:hidden 1`] = `
+<div>
+  <div
+    class="cxd-Page"
+  >
+    <div
+      class="cxd-Page-content"
+    >
+      <div
+        class="cxd-Page-main"
+      >
+        <div
+          class="cxd-Page-body"
+        >
+          <button
+            class="cxd-Button cxd-Button--default"
+            type="button"
+          >
+            <span>
+              按钮2
+            </span>
+          </button>
+          <button
+            class="cxd-Button cxd-Button--default"
+            type="button"
+          >
+            <span>
+              按钮4
+            </span>
+          </button>
+          <button
+            class="cxd-Button cxd-Button--default"
+            type="button"
+          >
+            <span>
+              按钮5
+            </span>
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;

__tests__/event-action/disabled.test.tsx

@@ -0,0 +1,101 @@
+import {fireEvent, render} from '@testing-library/react';
+import '../../src/themes/default';
+import {render as amisRender} from '../../src/index';
+import {makeEnv} from '../helper';
+
+test('EventAction:disabled', async () => {
+  const {getByText, container}: any = render(
+    amisRender(
+      {
+        type: 'page',
+        data: {
+          btnDisabled: true,
+          btnNotDisabled: false
+        },
+        body: [
+          {
+            type: 'action',
+            label: '按钮1',
+            disabledOn: '${btnDisabled}'
+          },
+          {
+            type: 'action',
+            label: '按钮2',
+            disabledOn: '${btnNotDisabled}',
+            onEvent: {
+              click: {
+                actions: [
+                  {
+                    actionType: 'disabled',
+                    componentId: 'ui:button_test_3'
+                  }
+                ]
+              }
+            }
+          },
+          {
+            type: 'action',
+            label: '按钮3',
+            disabledOn: '${btnNotDisabled}',
+            id: 'ui:button_test_3'
+          },
+          {
+            type: 'action',
+            label: '按钮4',
+            disabledOn: '${btnNotDisabled}',
+            onEvent: {
+              click: {
+                actions: [
+                  {
+                    actionType: 'enabled',
+                    componentId: 'ui:button_test_5'
+                  }
+                ]
+              }
+            }
+          },
+          {
+            type: 'action',
+            label: '按钮5',
+            disabled: true,
+            id: 'ui:button_test_5'
+          },
+          {
+            type: 'action',
+            label: '按钮6',
+            onEvent: {
+              click: {
+                actions: [
+                  {
+                    actionType: 'disabled',
+                    componentId: 'ui:form_disable'
+                  }
+                ]
+              }
+            }
+          },
+          {
+            type: 'form',
+            id: 'ui:form_disable',
+            title: '表单',
+            body: [
+              {
+                type: 'button',
+                className: 'ml-2',
+                label: '我的状态变了'
+              }
+            ]
+          }
+        ]
+      },
+      {},
+      makeEnv({})
+    )
+  );
+
+  fireEvent.click(getByText(/按钮2/));
+  fireEvent.click(getByText(/按钮4/));
+  fireEvent.click(getByText(/按钮6/));
+
+  expect(container).toMatchSnapshot();
+});

__tests__/event-action/hidden.test.tsx

@@ -0,0 +1,74 @@
+import {fireEvent, render} from '@testing-library/react';
+import '../../src/themes/default';
+import {render as amisRender} from '../../src/index';
+import {makeEnv} from '../helper';
+
+test('EventAction:hidden', async () => {
+  const {getByText, container}: any = render(
+    amisRender(
+      {
+        type: 'page',
+        data: {
+          btnHidden: true,
+          btnNotHidden: false
+        },
+        body: [
+          {
+            type: 'action',
+            label: '按钮1',
+            hiddenOn: '${btnHidden}'
+          },
+          {
+            type: 'action',
+            label: '按钮2',
+            hiddenOn: '${btnNotHidden}',
+            onEvent: {
+              click: {
+                actions: [
+                  {
+                    actionType: 'hidden',
+                    componentId: 'ui:button_test_3'
+                  }
+                ]
+              }
+            }
+          },
+          {
+            type: 'action',
+            label: '按钮3',
+            hiddenOn: '${btnNotHidden}',
+            id: 'ui:button_test_3'
+          },
+          {
+            type: 'action',
+            label: '按钮4',
+            hiddenOn: '${btnNotHidden}',
+            onEvent: {
+              click: {
+                actions: [
+                  {
+                    actionType: 'show',
+                    componentId: 'ui:button_test_5'
+                  }
+                ]
+              }
+            }
+          },
+          {
+            type: 'action',
+            label: '按钮5',
+            hidden: true,
+            id: 'ui:button_test_5'
+          }
+        ]
+      },
+      {},
+      makeEnv({})
+    )
+  );
+
+  fireEvent.click(getByText(/按钮2/));
+  fireEvent.click(getByText(/按钮4/));
+
+  expect(container).toMatchSnapshot();
+});

src/Schema.ts

@@ -120,6 +120,7 @@ import {TabsTransferPickerControlSchema} from './renderers/Form/TabsTransferPick
 import {UserSelectControlSchema} from './renderers/Form/UserSelect';
 import {JSONSchemaEditorControlSchema} from './renderers/Form/JSONSchemaEditor';
 import {TableSchemaV2} from './renderers/Table-v2';
+import {ListenerAction} from './actions/Action';
 
 // 每加个类型，这补充一下。
 export type SchemaType =
@@ -779,6 +780,16 @@ export interface BaseSchema {
    * 组件唯一 id，主要用于日志采集
    */
   id?: string;
+
+  /**
+   * 事件动作配置
+   */
+  onEvent?: {
+    [propName: string]: {
+      weight?: number; // 权重
+      actions: ListenerAction[]; // 执行的动作集
+    };
+  };
 }
 
 export interface Option {

src/SchemaRenderer.tsx

@@ -391,12 +391,11 @@ export class SchemaRenderer extends React.Component<SchemaRendererProps, any> {
       ref: this.refFn,
       render: this.renderChild,
       rootStore: rootStore,
-      // disabled: disable ?? rest.disabled ?? restSchema.disabled,
       dispatchEvent: this.dispatchEvent
     };
 
-    if (disable) {
+    if (disable !== undefined) {
-      (props as any).disabled = true;
+      (props as any).disabled = disable;
     }
 
     // 自动解析变量模式，主要是方便直接引入第三方组件库，无需为了支持变量封装一层

src/renderers/Form/Item.tsx

@@ -34,7 +34,6 @@ import {
 } from '../../Schema';
 import {HocStoreFactory} from '../../WithStore';
 import {wrapControl} from './wrapControl';
-import type {OnEventProps} from '../../utils/renderer-event';
 import isEmpty from 'lodash/isEmpty';
 import debounce from 'lodash/debounce';
 import {isEffectiveApi} from '../../utils/api';
@@ -44,9 +43,7 @@ export type LabelAlign = 'right' | 'left';
 
 export type FormControlSchemaAlias = SchemaObject;
 
-export interface FormBaseControl
+export interface FormBaseControl extends Omit<BaseSchema, 'type'> {
-  extends Omit<BaseSchema, 'type'>,
-    OnEventProps {
   /**
    * 表单项类型
    */