fix/(linkages-action): detail block actions does not support linkage rules (#1504)

* fix: condiction suport empty

* fix: condiction suport empty

* fix: condiction suport empty

* fix: condiction suport empty

* feat: detailed operations support linkage rules

* fix: button linkage failed during page change of detail block

* fix: button linkage failed during page change of detail block

* fix: action automatically closes

* fix: action automatically closes

* fix: details block chang  page  action linkage failed

* fix: details block chang  page  action linkage failed

---------

Co-authored-by: chenos <chenlinxh@gmail.com>
This commit is contained in:
katherinehhh 2023-03-30 17:31:55 +08:00 committed by GitHub
parent 35d34bb427
commit e7d0e49b8e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 37 additions and 18 deletions

View File

@ -1,14 +1,14 @@
import { ISchema, useField, useFieldSchema } from '@formily/react'; import { ISchema, useField, useFieldSchema } from '@formily/react';
import { isValid, uid } from '@formily/shared'; import { isValid, uid } from '@formily/shared';
import { Menu, Select } from 'antd'; import { Menu } from 'antd';
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import { useDesignable } from '../..'; import { useDesignable } from '../..';
import { GeneralSchemaDesigner, SchemaSettings } from '../../../schema-settings'; import { useFormBlockContext } from '../../../block-provider/FormBlockProvider';
import { useCollection, useCollectionManager } from '../../../collection-manager'; import { useCollection, useCollectionManager } from '../../../collection-manager';
import { useRecord } from '../../../record-provider'; import { useRecord } from '../../../record-provider';
import { useFormBlockContext } from '../../../block-provider/FormBlockProvider';
import { OpenModeSchemaItems } from '../../../schema-items'; import { OpenModeSchemaItems } from '../../../schema-items';
import { GeneralSchemaDesigner, SchemaSettings } from '../../../schema-settings';
import { requestSettingsSchema } from './utils'; import { requestSettingsSchema } from './utils';
@ -49,7 +49,9 @@ export const ActionDesigner = (props) => {
const isUpdateModePopupAction = ['customize:bulkUpdate', 'customize:bulkEdit'].includes(fieldSchema['x-action']); const isUpdateModePopupAction = ['customize:bulkUpdate', 'customize:bulkEdit'].includes(fieldSchema['x-action']);
const [initialSchema, setInitialSchema] = useState<ISchema>(); const [initialSchema, setInitialSchema] = useState<ISchema>();
const actionType = fieldSchema['x-action'] ?? ''; const actionType = fieldSchema['x-action'] ?? '';
const isLinkageAction = Object.keys(useFormBlockContext()).length > 0 && Object.keys(useRecord()).length > 0; const isLinkageAction =
(Object.keys(useFormBlockContext()).length > 0 && Object.keys(useRecord()).length > 0) ||
fieldSchema?.parent?.['x-initializer'] === 'DetailsActionInitializers';
const isChildCollectionAction = getChildrenCollections(name).length > 0 && fieldSchema['x-action'] === 'create'; const isChildCollectionAction = getChildrenCollections(name).length > 0 && fieldSchema['x-action'] === 'create';
const isSupportEditButton = fieldSchema['x-action'] !== 'expandAll'; const isSupportEditButton = fieldSchema['x-action'] !== 'expandAll';
const isLink = fieldSchema['x-component'] === 'Action.Link'; const isLink = fieldSchema['x-component'] === 'Action.Link';

View File

@ -99,19 +99,23 @@ export const Action: ComposedAction = observer((props: any) => {
const { designable, } = useDesignable(); const { designable, } = useDesignable();
const tarComponent=useComponent(component)||component; const tarComponent=useComponent(component)||component;
useEffect(() => { useEffect(() => {
field.linkageProperty = {};
linkageRules.map((v) => { linkageRules.map((v) => {
return v.actions?.map((h) => { return v.actions?.map((h) => {
linkageAction(h.operator, field, v.condition, values, designable); linkageAction(h.operator, field, v.condition, values);
}); });
}); });
}, [linkageRules]); }, [linkageRules, values]);
const renderButton = () => ( const renderButton = () => (
<SortableItem <SortableItem
{...others} {...others}
loading={field?.data?.loading} loading={field?.data?.loading}
icon={<Icon type={icon} />} icon={<Icon type={icon} />}
disabled={disabled} disabled={disabled}
style={{ border: field?.data?.hidden && '1px dashed #ede9e9' }} style={{
display: !designable && field?.data?.hidden && 'none',
opacity: designable && field?.data?.hidden && 0.1,
}}
onClick={(e: React.MouseEvent) => { onClick={(e: React.MouseEvent) => {
if (!disabled) { if (!disabled) {
e.preventDefault(); e.preventDefault();
@ -138,6 +142,7 @@ export const Action: ComposedAction = observer((props: any) => {
<Designer {...designerProps} /> <Designer {...designerProps} />
</SortableItem> </SortableItem>
); );
return ( return (
<ActionContext.Provider <ActionContext.Provider
value={{ value={{

View File

@ -69,37 +69,49 @@ export const requestSettingsSchema: ISchema = {
}, },
}; };
export const linkageAction = (operator, field, condition, values, designable) => { export const linkageAction = (operator, field, condition, values) => {
const displayResult = [field.display]; const disableResult = field?.linkageProperty?.disabled || [false];
const disableResult = [field.disabled]; const displayResult = field?.linkageProperty?.display || ['visible'];
switch (operator) { switch (operator) {
case ActionType.Visible: case ActionType.Visible:
if (conditionAnalyse(condition, values)) { if (conditionAnalyse(condition, values)) {
displayResult.push(operator); displayResult.push(operator);
field.data = field.data || {};
field.data.hidden = false;
} }
field.linkageProperty = {
...field.linkageProperty,
required: displayResult,
};
field.display = last(displayResult); field.display = last(displayResult);
break; break;
case ActionType.Hidden: case ActionType.Hidden:
if (conditionAnalyse(condition, values)) { if (conditionAnalyse(condition, values)) {
if (!designable) { field.data = field.data || {};
displayResult.push(operator); field.data.hidden = true;
} else { } else {
field.data = field.data || {}; field.data = field.data || {};
field.data.hidden = true; field.data.hidden = false;
}
} }
field.display = last(displayResult);
break; break;
case ActionType.Disabled: case ActionType.Disabled:
if (conditionAnalyse(condition, values)) { if (conditionAnalyse(condition, values)) {
disableResult.push(true); disableResult.push(true);
} }
field.linkageProperty = {
...field.linkageProperty,
required: disableResult,
};
field.disabled = last(disableResult); field.disabled = last(disableResult);
break; break;
case ActionType.Active: case ActionType.Active:
if (conditionAnalyse(condition, values)) { if (conditionAnalyse(condition, values)) {
disableResult.push(false); disableResult.push(false);
} }
field.linkageProperty = {
...field.linkageProperty,
required: disableResult,
};
field.disabled = last(disableResult); field.disabled = last(disableResult);
break; break;
default: default:

View File

@ -821,7 +821,7 @@ export const createDetailsBlockSchema = (options) => {
useProps: '{{ useDetailsBlockProps }}', useProps: '{{ useDetailsBlockProps }}',
}, },
properties: { properties: {
actions: { [uid()]: {
type: 'void', type: 'void',
'x-initializer': actionInitializers, 'x-initializer': actionInitializers,
'x-component': 'ActionBar', 'x-component': 'ActionBar',