fix(variable): should have currentObject in sub-blocks (#2823)
* chore: avoid crashing * fix(variable): should have currentObject in sub-blocks
This commit is contained in:
parent
24d914b0ef
commit
9db9b9e7af
@ -1,4 +1,4 @@
|
|||||||
import React, { useMemo } from 'react';
|
import React from 'react';
|
||||||
|
|
||||||
export interface FlagProviderProps {
|
export interface FlagProviderProps {
|
||||||
/**
|
/**
|
||||||
@ -13,19 +13,19 @@ export interface FlagProviderProps {
|
|||||||
* 是否存在于 `表单数据模板` 中
|
* 是否存在于 `表单数据模板` 中
|
||||||
*/
|
*/
|
||||||
isInFormDataTemplate?: boolean;
|
isInFormDataTemplate?: boolean;
|
||||||
|
/**
|
||||||
|
* 是否存在于 `子表格` 中
|
||||||
|
*/
|
||||||
|
isInSubTable?: boolean;
|
||||||
|
/**
|
||||||
|
* 是否存在于 `子表单` 中
|
||||||
|
*/
|
||||||
|
isInSubForm?: boolean;
|
||||||
children: any;
|
children: any;
|
||||||
}
|
}
|
||||||
|
|
||||||
export const FlagContext = React.createContext<Omit<FlagProviderProps, 'children'>>(null);
|
export const FlagContext = React.createContext<Omit<FlagProviderProps, 'children'>>(null);
|
||||||
|
|
||||||
export const FlagProvider = (props: FlagProviderProps) => {
|
export const FlagProvider = (props: FlagProviderProps) => {
|
||||||
const value = useMemo(() => {
|
return <FlagContext.Provider value={props}>{props.children}</FlagContext.Provider>;
|
||||||
return {
|
|
||||||
isInAssignFieldValues: props.isInAssignFieldValues,
|
|
||||||
isInSetDefaultValueDialog: props.isInSetDefaultValueDialog,
|
|
||||||
isInFormDataTemplate: props.isInFormDataTemplate,
|
|
||||||
};
|
|
||||||
}, [props.isInAssignFieldValues, props.isInFormDataTemplate, props.isInSetDefaultValueDialog]);
|
|
||||||
|
|
||||||
return <FlagContext.Provider value={value}>{props.children}</FlagContext.Provider>;
|
|
||||||
};
|
};
|
||||||
|
@ -9,6 +9,7 @@ import { Button, Card, Divider, Tooltip } from 'antd';
|
|||||||
import React, { useCallback, useContext } from 'react';
|
import React, { useCallback, useContext } from 'react';
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
import { FormActiveFieldsProvider } from '../../../block-provider';
|
import { FormActiveFieldsProvider } from '../../../block-provider';
|
||||||
|
import { FlagProvider } from '../../../flag-provider';
|
||||||
import { RecordIndexProvider, RecordProvider } from '../../../record-provider';
|
import { RecordIndexProvider, RecordProvider } from '../../../record-provider';
|
||||||
import { isPatternDisabled, isSystemField } from '../../../schema-settings';
|
import { isPatternDisabled, isSystemField } from '../../../schema-settings';
|
||||||
import {
|
import {
|
||||||
@ -23,10 +24,18 @@ import { useAssociationFieldContext } from './hooks';
|
|||||||
export const Nester = (props) => {
|
export const Nester = (props) => {
|
||||||
const { options } = useContext(AssociationFieldContext);
|
const { options } = useContext(AssociationFieldContext);
|
||||||
if (['hasOne', 'belongsTo'].includes(options.type)) {
|
if (['hasOne', 'belongsTo'].includes(options.type)) {
|
||||||
return <ToOneNester {...props} />;
|
return (
|
||||||
|
<FlagProvider isInSubForm>
|
||||||
|
<ToOneNester {...props} />
|
||||||
|
</FlagProvider>
|
||||||
|
);
|
||||||
}
|
}
|
||||||
if (['hasMany', 'belongsToMany'].includes(options.type)) {
|
if (['hasMany', 'belongsToMany'].includes(options.type)) {
|
||||||
return <ToManyNester {...props} />;
|
return (
|
||||||
|
<FlagProvider isInSubForm>
|
||||||
|
<ToManyNester {...props} />
|
||||||
|
</FlagProvider>
|
||||||
|
);
|
||||||
}
|
}
|
||||||
return null;
|
return null;
|
||||||
};
|
};
|
||||||
|
@ -8,6 +8,7 @@ import { isArr } from '@formily/shared';
|
|||||||
import { Button } from 'antd';
|
import { Button } from 'antd';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { FormActiveFieldsProvider } from '../../../block-provider';
|
import { FormActiveFieldsProvider } from '../../../block-provider';
|
||||||
|
import { FlagProvider } from '../../../flag-provider';
|
||||||
import { useSubTableSpecialCase } from '../form-item/hooks/useSpecialCase';
|
import { useSubTableSpecialCase } from '../form-item/hooks/useSpecialCase';
|
||||||
import { Table } from '../table-v2/Table';
|
import { Table } from '../table-v2/Table';
|
||||||
import { useAssociationFieldContext } from './hooks';
|
import { useAssociationFieldContext } from './hooks';
|
||||||
@ -62,46 +63,48 @@ export const SubTable: any = observer(
|
|||||||
}
|
}
|
||||||
`}
|
`}
|
||||||
>
|
>
|
||||||
<FormActiveFieldsProvider name="nester">
|
<FlagProvider isInSubTable>
|
||||||
<Table
|
<FormActiveFieldsProvider name="nester">
|
||||||
className={css`
|
<Table
|
||||||
.ant-formily-item.ant-formily-item-feedback-layout-loose {
|
className={css`
|
||||||
margin-bottom: 0px !important;
|
.ant-formily-item.ant-formily-item-feedback-layout-loose {
|
||||||
|
margin-bottom: 0px !important;
|
||||||
|
}
|
||||||
|
.ant-formily-editable {
|
||||||
|
vertical-align: sub;
|
||||||
|
}
|
||||||
|
`}
|
||||||
|
bordered
|
||||||
|
size={'small'}
|
||||||
|
field={field}
|
||||||
|
showIndex
|
||||||
|
dragSort={field.editable}
|
||||||
|
showDel={field.editable}
|
||||||
|
pagination={false}
|
||||||
|
rowSelection={{ type: 'none', hideSelectAll: true }}
|
||||||
|
footer={() =>
|
||||||
|
field.editable && (
|
||||||
|
<Button
|
||||||
|
type={'text'}
|
||||||
|
block
|
||||||
|
className={css`
|
||||||
|
display: block;
|
||||||
|
`}
|
||||||
|
onClick={() => {
|
||||||
|
field.value = field.value || [];
|
||||||
|
field.value.push({});
|
||||||
|
field.onInput(field.value);
|
||||||
|
}}
|
||||||
|
icon={<PlusOutlined />}
|
||||||
|
>
|
||||||
|
{/* {t('Add new')} */}
|
||||||
|
</Button>
|
||||||
|
)
|
||||||
}
|
}
|
||||||
.ant-formily-editable {
|
isSubTable={true}
|
||||||
vertical-align: sub;
|
/>
|
||||||
}
|
</FormActiveFieldsProvider>
|
||||||
`}
|
</FlagProvider>
|
||||||
bordered
|
|
||||||
size={'small'}
|
|
||||||
field={field}
|
|
||||||
showIndex
|
|
||||||
dragSort={field.editable}
|
|
||||||
showDel={field.editable}
|
|
||||||
pagination={false}
|
|
||||||
rowSelection={{ type: 'none', hideSelectAll: true }}
|
|
||||||
footer={() =>
|
|
||||||
field.editable && (
|
|
||||||
<Button
|
|
||||||
type={'text'}
|
|
||||||
block
|
|
||||||
className={css`
|
|
||||||
display: block;
|
|
||||||
`}
|
|
||||||
onClick={() => {
|
|
||||||
field.value = field.value || [];
|
|
||||||
field.value.push({});
|
|
||||||
field.onInput(field.value);
|
|
||||||
}}
|
|
||||||
icon={<PlusOutlined />}
|
|
||||||
>
|
|
||||||
{/* {t('Add new')} */}
|
|
||||||
</Button>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
isSubTable={true}
|
|
||||||
/>
|
|
||||||
</FormActiveFieldsProvider>
|
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
|
@ -78,7 +78,7 @@ import {
|
|||||||
isSameCollection,
|
isSameCollection,
|
||||||
useSupportedBlocks,
|
useSupportedBlocks,
|
||||||
} from '../filter-provider/utils';
|
} from '../filter-provider/utils';
|
||||||
import { FlagProvider } from '../flag-provider';
|
import { FlagProvider, useFlag } from '../flag-provider';
|
||||||
import { useCollectMenuItem, useCollectMenuItems, useMenuItem } from '../hooks/useMenuItem';
|
import { useCollectMenuItem, useCollectMenuItems, useMenuItem } from '../hooks/useMenuItem';
|
||||||
import { getTargetKey } from '../schema-component/antd/association-filter/utilts';
|
import { getTargetKey } from '../schema-component/antd/association-filter/utilts';
|
||||||
import { DynamicComponentProps } from '../schema-component/antd/filter/DynamicComponent';
|
import { DynamicComponentProps } from '../schema-component/antd/filter/DynamicComponent';
|
||||||
@ -1555,6 +1555,7 @@ SchemaSettings.DefaultValue = function DefaultValueConfigure(props: { fieldSchem
|
|||||||
const record = useRecord();
|
const record = useRecord();
|
||||||
const { form } = useFormBlockContext();
|
const { form } = useFormBlockContext();
|
||||||
const currentFormFields = useCollectionFilterOptions(collection);
|
const currentFormFields = useCollectionFilterOptions(collection);
|
||||||
|
const { isInSubForm, isInSubTable } = useFlag() || {};
|
||||||
|
|
||||||
const { name } = collection;
|
const { name } = collection;
|
||||||
const collectionField = getField(fieldSchema['name']) || getCollectionJoinField(fieldSchema['x-collection-field']);
|
const collectionField = getField(fieldSchema['name']) || getCollectionJoinField(fieldSchema['x-collection-field']);
|
||||||
@ -1596,7 +1597,7 @@ SchemaSettings.DefaultValue = function DefaultValueConfigure(props: { fieldSchem
|
|||||||
FormLayout,
|
FormLayout,
|
||||||
VariableInput: (props) => {
|
VariableInput: (props) => {
|
||||||
return (
|
return (
|
||||||
<FlagProvider isInSetDefaultValueDialog={true}>
|
<FlagProvider isInSubForm={isInSubForm} isInSubTable={isInSubTable} isInSetDefaultValueDialog>
|
||||||
<VariableInput {...props} />
|
<VariableInput {...props} />
|
||||||
</FlagProvider>
|
</FlagProvider>
|
||||||
);
|
);
|
||||||
@ -1825,6 +1826,7 @@ SchemaSettings.DataScope = function DataScopeConfigure(props: DataScopeProps) {
|
|||||||
const variables = useVariables();
|
const variables = useVariables();
|
||||||
const localVariables = useLocalVariables();
|
const localVariables = useLocalVariables();
|
||||||
const { getAllCollectionsInheritChain } = useCollectionManager();
|
const { getAllCollectionsInheritChain } = useCollectionManager();
|
||||||
|
const { isInSubForm, isInSubTable } = useFlag() || {};
|
||||||
|
|
||||||
const dynamicComponent = (props: DynamicComponentProps) => {
|
const dynamicComponent = (props: DynamicComponentProps) => {
|
||||||
return (
|
return (
|
||||||
@ -1855,7 +1857,13 @@ SchemaSettings.DataScope = function DataScopeConfigure(props: DataScopeProps) {
|
|||||||
properties: {
|
properties: {
|
||||||
filter: {
|
filter: {
|
||||||
enum: props.collectionFilterOption || options,
|
enum: props.collectionFilterOption || options,
|
||||||
'x-decorator': BaseVariableProvider,
|
'x-decorator': (props) => (
|
||||||
|
<BaseVariableProvider {...props}>
|
||||||
|
<FlagProvider isInSubForm={isInSubForm} isInSubTable={isInSubTable}>
|
||||||
|
{props.children}
|
||||||
|
</FlagProvider>
|
||||||
|
</BaseVariableProvider>
|
||||||
|
),
|
||||||
'x-decorator-props': {
|
'x-decorator-props': {
|
||||||
isDisabled,
|
isDisabled,
|
||||||
},
|
},
|
||||||
|
@ -2,7 +2,7 @@ import { Form } from '@formily/core';
|
|||||||
import { ISchema, Schema } from '@formily/react';
|
import { ISchema, Schema } from '@formily/react';
|
||||||
import { useMemo } from 'react';
|
import { useMemo } from 'react';
|
||||||
import { useFormBlockType } from '../../../block-provider/FormBlockProvider';
|
import { useFormBlockType } from '../../../block-provider/FormBlockProvider';
|
||||||
import { CollectionFieldOptions } from '../../../collection-manager';
|
import { CollectionFieldOptions, useCollection } from '../../../collection-manager';
|
||||||
import { useFlag } from '../../../flag-provider';
|
import { useFlag } from '../../../flag-provider';
|
||||||
import { useBlockCollection } from './useBlockCollection';
|
import { useBlockCollection } from './useBlockCollection';
|
||||||
import { useDateVariable } from './useDateVariable';
|
import { useDateVariable } from './useDateVariable';
|
||||||
@ -46,10 +46,9 @@ export const useVariableOptions = ({
|
|||||||
targetFieldSchema,
|
targetFieldSchema,
|
||||||
}: Props) => {
|
}: Props) => {
|
||||||
const { name: blockCollectionName } = useBlockCollection();
|
const { name: blockCollectionName } = useBlockCollection();
|
||||||
const { isInSetDefaultValueDialog } = useFlag() || {};
|
const { isInSubForm, isInSubTable } = useFlag() || {};
|
||||||
const { type: formBlockType } = useFormBlockType();
|
const { type: formBlockType } = useFormBlockType();
|
||||||
|
const { name } = useCollection();
|
||||||
const fieldCollectionName = collectionField?.collectionName;
|
|
||||||
const userVariable = useUserVariable({
|
const userVariable = useUserVariable({
|
||||||
maxDepth: 3,
|
maxDepth: 3,
|
||||||
uiSchema: uiSchema,
|
uiSchema: uiSchema,
|
||||||
@ -66,7 +65,7 @@ export const useVariableOptions = ({
|
|||||||
targetFieldSchema,
|
targetFieldSchema,
|
||||||
});
|
});
|
||||||
const iterationVariable = useIterationVariable({
|
const iterationVariable = useIterationVariable({
|
||||||
currentCollection: fieldCollectionName,
|
currentCollection: name,
|
||||||
collectionField,
|
collectionField,
|
||||||
schema: uiSchema,
|
schema: uiSchema,
|
||||||
noDisabled,
|
noDisabled,
|
||||||
@ -85,12 +84,7 @@ export const useVariableOptions = ({
|
|||||||
userVariable,
|
userVariable,
|
||||||
dateVariable,
|
dateVariable,
|
||||||
form && !form.readPretty && formVariable,
|
form && !form.readPretty && formVariable,
|
||||||
form &&
|
(isInSubForm || isInSubTable) && iterationVariable,
|
||||||
fieldCollectionName &&
|
|
||||||
blockCollectionName &&
|
|
||||||
fieldCollectionName !== blockCollectionName &&
|
|
||||||
isInSetDefaultValueDialog &&
|
|
||||||
iterationVariable,
|
|
||||||
formBlockType === 'update' && currentRecordVariable,
|
formBlockType === 'update' && currentRecordVariable,
|
||||||
].filter(Boolean);
|
].filter(Boolean);
|
||||||
}, [
|
}, [
|
||||||
@ -98,9 +92,8 @@ export const useVariableOptions = ({
|
|||||||
dateVariable,
|
dateVariable,
|
||||||
form,
|
form,
|
||||||
formVariable,
|
formVariable,
|
||||||
fieldCollectionName,
|
isInSubForm,
|
||||||
blockCollectionName,
|
isInSubTable,
|
||||||
isInSetDefaultValueDialog,
|
|
||||||
iterationVariable,
|
iterationVariable,
|
||||||
currentRecordVariable,
|
currentRecordVariable,
|
||||||
]);
|
]);
|
||||||
|
Loading…
Reference in New Issue
Block a user