From 03fe7a827fc7f03e5a33c65e9dd910f7c0984e82 Mon Sep 17 00:00:00 2001 From: zhaojianhui Date: Tue, 6 Dec 2022 10:55:10 +0800 Subject: [PATCH] =?UTF-8?q?amis-saas-8095=20[Improvement.]=20=E3=80=8C?= =?UTF-8?q?=E5=8A=A8=E4=BD=9C=E9=85=8D=E7=BD=AE=E3=80=8D=E6=98=BE=E9=9A=90?= =?UTF-8?q?/=E5=8F=AF=E7=94=A8=E7=A6=81=E7=94=A8=E5=88=86=E5=88=AB?= =?UTF-8?q?=E5=90=88=E5=B9=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Change-Id: Ia58683f2d059aa561147fe03c4f7b90c3447f834 --- .../event-control/action-config-dialog.tsx | 5 +- .../src/renderer/event-control/actions.tsx | 93 ++++++++++++++++++- .../src/renderer/event-control/helper.tsx | 24 +++++ .../src/renderer/event-control/index.tsx | 2 +- 4 files changed, 118 insertions(+), 6 deletions(-) diff --git a/packages/amis-editor/src/renderer/event-control/action-config-dialog.tsx b/packages/amis-editor/src/renderer/event-control/action-config-dialog.tsx index 51d82424f..394bdfc6b 100644 --- a/packages/amis-editor/src/renderer/event-control/action-config-dialog.tsx +++ b/packages/amis-editor/src/renderer/event-control/action-config-dialog.tsx @@ -109,14 +109,13 @@ export default class ActionDialog extends React.Component { ) { groupType = 'closeDialog'; } - - if (value === 'visibility' && !['show', 'hidden'].includes(groupType)) { + if (value === 'visibility' && !['show', 'hidden', 'visibility'].includes(groupType)) { groupType = 'show'; } if ( value === 'usability' && - !['enabled', 'disabled'].includes(groupType) + !['enabled', 'disabled', 'usability'].includes(groupType) ) { groupType = 'enabled'; } diff --git a/packages/amis-editor/src/renderer/event-control/actions.tsx b/packages/amis-editor/src/renderer/event-control/actions.tsx index 317b63456..bb7b522d5 100644 --- a/packages/amis-editor/src/renderer/event-control/actions.tsx +++ b/packages/amis-editor/src/renderer/event-control/actions.tsx @@ -637,6 +637,20 @@ const ACTION_TYPE_TREE = (manager: any): RendererPluginAction[] => { ); } + }, + { + actionType: 'visibility', + descDetail: (info: any) => { + return ( +
+ 组件 + + {info?.rendererLabel || '-'} + + 表达式已配置 +
+ ); + } } ], supportComponents: '*', @@ -644,13 +658,33 @@ const ACTION_TYPE_TREE = (manager: any): RendererPluginAction[] => { ...renderCmptSelect('目标组件', true), { type: 'radios', - label: '显示/隐藏', + label: '条件', name: 'groupType', mode: 'horizontal', + value: 'static', + required: true, + inputClassName: 'event-action-radio', + options: [ + { + label: '静态', + value: 'static' + }, + { + label: '表达式', + value: 'visibility' + } + ] + }, + { + type: 'radios', + label: '显示/隐藏', + name: '__statusType', + mode: 'horizontal', value: 'show', required: true, pipeIn: defaultValue('show'), inputClassName: 'event-action-radio', + visibleOn: "this.groupType === 'static'", options: [ { label: '显示', @@ -661,6 +695,17 @@ const ACTION_TYPE_TREE = (manager: any): RendererPluginAction[] => { value: 'hidden' } ] + }, + { + type: 'ae-expressionFormulaControl', + mode: 'horizontal', + label: '表达式', + required: true, + size: 'lg', + variables: '${variables}', + evalMode: true, + name: '__actionExpression', + visibleOn: "this.groupType === 'visibility'" } ] }, @@ -696,6 +741,20 @@ const ACTION_TYPE_TREE = (manager: any): RendererPluginAction[] => { ); } + }, + { + actionType: 'usability', + descDetail: (info: any) => { + return ( +
+ 组件 + + {info?.rendererLabel || '-'} + + 表达式已配置 +
+ ); + } } ], supportComponents: [ @@ -707,13 +766,33 @@ const ACTION_TYPE_TREE = (manager: any): RendererPluginAction[] => { ...renderCmptSelect('目标组件', true), { type: 'radios', - label: '启用/禁用', + label: '条件', name: 'groupType', mode: 'horizontal', inputClassName: 'event-action-radio', + value: 'static', + required: true, + options: [ + { + label: '静态', + value: 'static' + }, + { + label: '表达式', + value: 'usability' + } + ] + }, + { + type: 'radios', + label: '启用/禁用', + name: '__statusType', + mode: 'horizontal', + inputClassName: 'event-action-radio', value: 'enabled', required: true, pipeIn: defaultValue('enabled'), + visibleOn: "this.groupType === 'static'", options: [ { label: '启用', @@ -724,6 +803,16 @@ const ACTION_TYPE_TREE = (manager: any): RendererPluginAction[] => { value: 'disabled' } ] + }, + { + type: 'ae-expressionFormulaControl', + mode: 'horizontal', + label: '表达式', + required: true, + size: 'lg', + evalMode: true, + name: '__actionExpression', + visibleOn: "this.groupType === 'usability'" } ] }, diff --git a/packages/amis-editor/src/renderer/event-control/helper.tsx b/packages/amis-editor/src/renderer/event-control/helper.tsx index f193f3bca..490093cd2 100644 --- a/packages/amis-editor/src/renderer/event-control/helper.tsx +++ b/packages/amis-editor/src/renderer/event-control/helper.tsx @@ -1200,6 +1200,17 @@ export const getEventControlConfig = ( } } + if (['show', 'hidden', 'enabled', 'disabled'].includes(action.actionType)) { + // 兼容老逻辑，初始化actionType + config.__statusType = action.actionType; + config.__actionType = 'static'; + } + + if (['usability', 'visibility'].includes(action.actionType)) { + // 初始化条件参数 + config.__actionExpression = action.args?.value; + } + if ( action.actionType === 'ajax' && typeof action?.args?.api === 'string' @@ -1415,6 +1426,19 @@ export const getEventControlConfig = ( } } + // 转换下格式 + if (['visibility', 'usability'].includes(config.actionType)) { + action.args = + action.actionType !== 'static' + ? { + value: action.__actionExpression + } + : undefined; + action.actionType === 'static' && (action.actionType = config.__statusType); + delete action.__actionExpression; + delete action.__statusType; + }; + delete action.config; return action; diff --git a/packages/amis-editor/src/renderer/event-control/index.tsx b/packages/amis-editor/src/renderer/event-control/index.tsx index fc8c4678b..dc7acdf4a 100644 --- a/packages/amis-editor/src/renderer/event-control/index.tsx +++ b/packages/amis-editor/src/renderer/event-control/index.tsx @@ -541,7 +541,7 @@ export class EventControl extends React.Component< getContextSchemas, rawVariables, ...actionConfig, - groupType: action.actionType, + groupType: actionConfig?.__actionType || action.actionType, __actionDesc: actionNode!.description!, // 树节点描述 __actionSchema: actionNode!.schema, // 树节点schema __subActions: hasSubActionNode?.actions, // 树节点子动作