diff --git a/packages/core/client/src/schema-component/antd/expand-action/Expand.Action.tsx b/packages/core/client/src/schema-component/antd/expand-action/Expand.Action.tsx index 19a1a3aa5..2744ba40a 100644 --- a/packages/core/client/src/schema-component/antd/expand-action/Expand.Action.tsx +++ b/packages/core/client/src/schema-component/antd/expand-action/Expand.Action.tsx @@ -1,7 +1,8 @@ import { css } from '@emotion/css'; import { useFieldSchema } from '@formily/react'; import { Button } from 'antd'; -import React from 'react'; +import React, { forwardRef, createRef } from 'react'; +import { composeRef } from 'rc-util/lib/ref'; import { useCompile } from '../../hooks'; import { useTableBlockContext, useTableSelectorContext } from '../../../block-provider'; import { Icon } from '../../../icon'; @@ -46,7 +47,7 @@ const actionDesignerCss = css` } `; -export const ExpandAction = (props) => { +const InternalExpandAction = (props, ref) => { const schema = useFieldSchema(); const ctxSelector = useTableSelectorContext(); const ctxBlock = useTableBlockContext(); @@ -54,8 +55,11 @@ export const ExpandAction = (props) => { const ctx = isTableSelector ? ctxSelector : ctxBlock; const { titleExpand, titleCollapse, iconExpand, iconCollapse } = schema['x-component-props'] || {}; const compile = useCompile(); + const internalRef = createRef(); + const buttonRef = composeRef(ref, internalRef); return ( -
+ //@ts-ignore +
}> {ctx?.params['tree'] && (
); }; + +export const ExpandAction = forwardRef(InternalExpandAction); diff --git a/packages/core/client/src/schema-initializer/components/CreateRecordAction.tsx b/packages/core/client/src/schema-initializer/components/CreateRecordAction.tsx index 70387ce7c..097945644 100644 --- a/packages/core/client/src/schema-initializer/components/CreateRecordAction.tsx +++ b/packages/core/client/src/schema-initializer/components/CreateRecordAction.tsx @@ -2,7 +2,8 @@ import { DownOutlined } from '@ant-design/icons'; import { css } from '@emotion/css'; import { observer, RecursionField, useField, useFieldSchema, useForm } from '@formily/react'; import { Button, Dropdown, MenuProps } from 'antd'; -import React, { useEffect, useMemo, useState } from 'react'; +import React, { useEffect, useMemo, useState, forwardRef, createRef } from 'react'; +import { composeRef } from 'rc-util/lib/ref'; import { useDesignable } from '../../'; import { useACLRolesCheck, useRecordPkValue } from '../../acl/ACLProvider'; import { @@ -96,55 +97,55 @@ function useAclCheckFn() { return actionAclCheck; } -export const CreateRecordAction = observer( - (props: any) => { - const [visible, setVisible] = useState(false); - const collection = useCollection_deprecated(); - const fieldSchema = useFieldSchema(); - const field: any = useField(); - const [currentCollection, setCurrentCollection] = useState(collection.name); - const [currentCollectionDataSource, setCurrentCollectionDataSource] = useState(collection.dataSource); - const linkageRules: any[] = fieldSchema?.['x-linkage-rules'] || []; - const values = useRecord(); - const ctx = useActionContext(); - const variables = useVariables(); - const localVariables = useLocalVariables({ currentForm: { values } as any }); - useEffect(() => { - field.stateOfLinkageRules = {}; - linkageRules - .filter((k) => !k.disabled) - .forEach((v) => { - v.actions?.forEach((h) => { - linkageAction({ - operator: h.operator, - field, - condition: v.condition, - variables, - localVariables, - }); +const InternalCreateRecordAction = (props: any, ref) => { + const [visible, setVisible] = useState(false); + const collection = useCollection_deprecated(); + const fieldSchema = useFieldSchema(); + const field: any = useField(); + const [currentCollection, setCurrentCollection] = useState(collection.name); + const [currentCollectionDataSource, setCurrentCollectionDataSource] = useState(collection.dataSource); + const linkageRules: any[] = fieldSchema?.['x-linkage-rules'] || []; + const values = useRecord(); + const ctx = useActionContext(); + const variables = useVariables(); + const localVariables = useLocalVariables({ currentForm: { values } as any }); + useEffect(() => { + field.stateOfLinkageRules = {}; + linkageRules + .filter((k) => !k.disabled) + .forEach((v) => { + v.actions?.forEach((h) => { + linkageAction({ + operator: h.operator, + field, + condition: v.condition, + variables, + localVariables, }); }); - }, [field, linkageRules, localVariables, variables]); - return ( -
- - { - setVisible(true); - setCurrentCollection(collectionData.name); - setCurrentCollectionDataSource(collectionData.dataSource); - }} - /> - - - - -
- ); - }, - { displayName: 'CreateRecordAction' }, -); + }); + }, [field, linkageRules, localVariables, variables]); + const internalRef = createRef(); + const buttonRef = composeRef(ref, internalRef); + return ( + //@ts-ignore +
}> + + { + setVisible(true); + setCurrentCollection(collectionData.name); + setCurrentCollectionDataSource(collectionData.dataSource); + }} + /> + + + + +
+ ); +}; function getLinkageCollection(str, form, field) { const variablesCtx = { $form: form.values, $iteration: form.values }; @@ -283,6 +284,7 @@ function FinallyButton({ designable: boolean; }) { const { getCollection } = useCollectionManager_deprecated(); + if (inheritsCollections?.length > 0) { if (!linkageFromForm) { return allowAddToCurrent === undefined || allowAddToCurrent ? ( @@ -360,6 +362,7 @@ function FinallyButton({ onClick?.(collection); }} style={{ + ...props?.style, display: !designable && field?.data?.hidden && 'none', opacity: designable && field?.data?.hidden && 0.1, }} @@ -368,3 +371,5 @@ function FinallyButton({ ); } + +export const CreateRecordAction = forwardRef(InternalCreateRecordAction);