Merge branch 'next' into develop

This commit is contained in:
nocobase[bot] 2025-03-12 08:18:48 +00:00
commit a4e3de0780
11 changed files with 316 additions and 3 deletions

View File

@ -83,6 +83,8 @@ const CollectionFieldInternalField_deprecated: React.FC = (props: Props) => {
setRequired(field, fieldSchema, uiSchema);
// @ts-ignore
field.dataSource = uiSchema.enum;
field.data = field.data || {};
field.data.dataSource = uiSchema.enum;
const originalProps = compile(uiSchema['x-component-props']) || {};
field.componentProps = merge(originalProps, field.componentProps || {}, dynamicProps || {});
}, [uiSchemaOrigin]);
@ -109,6 +111,8 @@ const CollectionFieldInternalField = (props) => {
field.readPretty = true;
}
}, [field, fieldSchema]);
field.data = field.data || {};
field.data.dataSource = uiSchema.enum;
if (!uiSchema) return null;

View File

@ -0,0 +1,33 @@
/**
* This file is part of the NocoBase (R) project.
* Copyright (c) 2020-2024 NocoBase Co., Ltd.
* Authors: NocoBase Team.
*
* This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
* For more information, please refer to: https://www.nocobase.com/agreement.
*/
import { expect, test } from '@nocobase/test/e2e';
import { oneFormWithSelectField } from './templatesOfBug';
test.describe('options of Select field in linkage rule', () => {
test('options change with linkage rule ', async ({ page, mockPage }) => {
await mockPage(oneFormWithSelectField).goto();
// 联动规则控制选项
await page.getByLabel('block-item-CardItem-general-').hover();
await page.getByLabel('block-item-CollectionField-').click();
await expect(page.getByRole('option', { name: 'option2' })).toBeVisible();
await expect(page.getByRole('option', { name: 'option3' })).not.toBeVisible();
await page.getByRole('option', { name: 'option2' }).click();
// 去掉联动规则恢复选项
await page.getByLabel('block-item-CardItem-general-').hover();
await page.getByLabel('designer-schema-settings-CardItem-blockSettings:createForm-general').hover();
await page.getByRole('menuitem', { name: 'Linkage rules' }).click();
await page.getByRole('switch', { name: 'On Off' }).click();
await page.getByRole('button', { name: 'OK' }).click();
await page.reload();
await expect(page.getByRole('option', { name: 'option2' })).toBeVisible();
await expect(page.getByRole('option', { name: 'option3' })).toBeVisible();
});
});

View File

@ -7,6 +7,8 @@
* For more information, please refer to: https://www.nocobase.com/agreement.
*/
import { generalWithM2oSingleSelect } from '@nocobase/test/e2e';
export const T3867 = {
pageSchema: {
_isJSONSchemaObject: true,
@ -581,3 +583,176 @@ export const oneFormWithSubTableSelectField = {
},
],
};
export const oneFormWithSelectField = {
pageSchema: {
_isJSONSchemaObject: true,
version: '2.0',
type: 'void',
'x-component': 'Page',
properties: {
iza2br2wzq4: {
type: 'void',
'x-component': 'Grid',
'x-initializer': 'page:addBlock',
properties: {
dc4lkvej93w: {
_isJSONSchemaObject: true,
version: '2.0',
type: 'void',
'x-component': 'Grid.Row',
'x-app-version': '1.7.0-beta.1',
properties: {
jrfai5z5a4e: {
_isJSONSchemaObject: true,
version: '2.0',
type: 'void',
'x-component': 'Grid.Col',
'x-app-version': '1.7.0-beta.1',
properties: {
bph3a0yrmvp: {
_isJSONSchemaObject: true,
version: '2.0',
type: 'void',
'x-acl-action-props': {
skipScopeCheck: true,
},
'x-acl-action': 'general:create',
'x-decorator': 'FormBlockProvider',
'x-use-decorator-props': 'useCreateFormBlockDecoratorProps',
'x-decorator-props': {
dataSource: 'main',
collection: 'general',
},
'x-toolbar': 'BlockSchemaToolbar',
'x-settings': 'blockSettings:createForm',
'x-component': 'CardItem',
'x-app-version': '1.7.0-beta.1',
properties: {
'2ef5ea23d4b': {
_isJSONSchemaObject: true,
version: '2.0',
type: 'void',
'x-component': 'FormV2',
'x-use-component-props': 'useCreateFormBlockProps',
'x-app-version': '1.7.0-beta.1',
properties: {
grid: {
'x-uid': 'oqk574y4mx2',
_isJSONSchemaObject: true,
version: '2.0',
type: 'void',
'x-component': 'Grid',
'x-initializer': 'form:configureFields',
'x-app-version': '1.7.0-beta.1',
'x-linkage-rules': [
{
condition: {
$and: [],
},
actions: [
{
targetFields: ['singleSelect'],
operator: 'options',
value: {
value: ['option2'],
},
},
],
},
],
properties: {
'1ijfrrxqs4c': {
_isJSONSchemaObject: true,
version: '2.0',
type: 'void',
'x-component': 'Grid.Row',
'x-app-version': '1.7.0-beta.1',
properties: {
'8j09c65cp2x': {
_isJSONSchemaObject: true,
version: '2.0',
type: 'void',
'x-component': 'Grid.Col',
'x-app-version': '1.7.0-beta.1',
properties: {
singleSelect: {
_isJSONSchemaObject: true,
version: '2.0',
type: 'string',
'x-toolbar': 'FormItemSchemaToolbar',
'x-settings': 'fieldSettings:FormItem',
'x-component': 'CollectionField',
'x-decorator': 'FormItem',
'x-collection-field': 'general.singleSelect',
'x-component-props': {
style: {
width: '100%',
},
},
'x-app-version': '1.7.0-beta.1',
'x-uid': 'dxsbc80ewso',
'x-async': false,
'x-index': 1,
},
},
'x-uid': 'la6qedc9qwx',
'x-async': false,
'x-index': 1,
},
},
'x-uid': 'ijsbxa4yys7',
'x-async': false,
'x-index': 1,
},
},
'x-async': false,
'x-index': 1,
},
kpp1azsxbzy: {
_isJSONSchemaObject: true,
version: '2.0',
type: 'void',
'x-initializer': 'createForm:configureActions',
'x-component': 'ActionBar',
'x-component-props': {
layout: 'one-column',
},
'x-app-version': '1.7.0-beta.1',
'x-uid': '1n56lepnve8',
'x-async': false,
'x-index': 2,
},
},
'x-uid': 'lf74cpc3tub',
'x-async': false,
'x-index': 1,
},
},
'x-uid': 'mhxlfdk74jy',
'x-async': false,
'x-index': 1,
},
},
'x-uid': 'obyvsr0s0nx',
'x-async': false,
'x-index': 1,
},
},
'x-uid': 's6jd8p9h28q',
'x-async': false,
'x-index': 1,
},
},
name: '8btun7jzkrk',
'x-uid': 'eyjf89l83a1',
'x-async': true,
'x-index': 1,
},
},
'x-uid': 'hizrr7jzogr',
'x-async': true,
'x-index': 1,
},
collections: generalWithM2oSingleSelect,
};

View File

@ -14,6 +14,7 @@ import { isPlainObject } from '@nocobase/utils/client';
import type { SelectProps as AntdSelectProps } from 'antd';
import { Select as AntdSelect, Empty, Spin, Tag } from 'antd';
import React from 'react';
import { every } from 'lodash';
import { ReadPretty } from './ReadPretty';
import { FieldNames, defaultFieldNames, getCurrentOptions } from './utils';
import { BaseOptionType, DefaultOptionType } from 'antd/es/select';
@ -188,8 +189,13 @@ const InternalSelect = connect(
dataSource: 'options',
},
(props, field) => {
const { value, options } = props;
const result = every(options, (k) => k.value !== value)
? field?.data?.dataSource?.find?.((v) => v.value === value)?.label || value
: value;
return {
...props,
value: result,
fieldNames: { ...defaultFieldNames, ...props.fieldNames },
suffixIcon: field?.['loading'] || field?.['validating'] ? <LoadingOutlined /> : props.suffixIcon,
};

View File

@ -18,6 +18,7 @@ import { useTranslation } from 'react-i18next';
import { useCompile } from '../..';
import { DynamicComponent } from './DynamicComponent';
import { ValueDynamicComponent } from './ValueDynamicComponent';
import { OptionsComponent } from './OptionsComponent';
import { LinkageLogicContext, RemoveActionContext } from './context';
import { ActionType } from './type';
import { useValues } from './useValues';
@ -107,6 +108,14 @@ export const FormFieldLinkageRuleAction = observer(
collectionName={collectionName}
/>
)}
{[ActionType.Options].includes(operator) && (
<OptionsComponent
fieldValue={fieldValue}
schema={schema}
setValue={setValue}
collectionName={collectionName}
/>
)}
{!props.disabled && (
<a role="button" aria-label="icon-close">
<CloseCircleOutlined onClick={() => remove()} style={{ color: '#bfbfbf' }} />

View File

@ -0,0 +1,45 @@
/**
* This file is part of the NocoBase (R) project.
* Copyright (c) 2020-2024 NocoBase Co., Ltd.
* Authors: NocoBase Team.
*
* This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
* For more information, please refer to: https://www.nocobase.com/agreement.
*/
import { css } from '@emotion/css';
import React, { useCallback, useMemo } from 'react';
import { Select } from 'antd';
import { DynamicComponent } from './DynamicComponent';
export type InputModeType = 'constant' | 'express' | 'empty';
interface ValueDynamicComponentProps {
fieldValue: any;
schema: any;
setValue: (value: any) => void;
collectionName: string;
inputModes?: Array<InputModeType>;
}
export const OptionsComponent = (props: ValueDynamicComponentProps) => {
const { fieldValue, setValue, schema } = props;
const handleChangeOfConstant = useCallback(
(value) => {
setValue({
value,
});
},
[setValue],
);
return (
<Select
style={{ minWidth: 200, maxWidth: 500 }}
onChange={handleChangeOfConstant}
value={fieldValue?.value}
mode="multiple"
options={schema?.enum || []}
/>
);
};

View File

@ -27,6 +27,12 @@ export const useLinkageCollectionFieldOptions = (collectionName: string, readPre
{ label: t('Required'), value: ActionType.Required, selected: false, schema: {} },
{ label: t('Not required'), value: ActionType.InRequired, selected: false, schema: {} },
{ label: t('Value'), value: ActionType.Value, selected: false, schema: {} },
{
label: t('Options'),
value: ActionType.Options,
selected: false,
schema: {},
},
].filter((v) => {
if (readPretty) {
return [ActionType.Visible, ActionType.None, ActionType.Hidden].includes(v.value);
@ -48,7 +54,10 @@ export const useLinkageCollectionFieldOptions = (collectionName: string, readPre
operators:
operators?.filter?.((operator) => {
if (nested || children || ['formula', 'richText', 'sequence'].includes(fieldInterface.name)) {
return operator?.value !== ActionType.Value;
return operator?.value !== ActionType.Value && operator?.value !== ActionType.Options;
}
if (!['select', 'radioGroup', 'multipleSelect', 'checkboxGroup'].includes(fieldInterface.name)) {
return operator?.value !== ActionType.Options;
}
return true;
}) || [],

View File

@ -70,6 +70,7 @@ export function bindLinkageRulesToFiled(
required: field.initStateOfLinkageRules?.required || getTempFieldState(true, field.required || false),
pattern: field.initStateOfLinkageRules?.pattern || getTempFieldState(true, field.pattern),
value: field.initStateOfLinkageRules?.value || getTempFieldState(true, field.value || field.initialValue),
dataSource: field.initStateOfLinkageRules?.dataSource || getTempFieldState(true, field.dataSource || field.options),
};
return reaction(
@ -252,6 +253,17 @@ function getSubscriber(
state.display = 'visible';
});
});
} else if (fieldName === 'dataSource') {
if (_.every(lastState?.value, (v) => v.value !== field.value)) {
field.value = field.initialValue;
}
field[fieldName] = lastState?.value;
field.data = field.data || {};
requestAnimationFrame(() => {
field.setState((state) => {
state[fieldName] = lastState?.value;
});
});
} else {
field[fieldName] = lastState?.value;
field.data = field.data || {};
@ -290,6 +302,8 @@ function getFieldNameByOperator(operator: ActionType) {
return 'pattern';
case ActionType.Value:
return 'value';
case ActionType.Options:
return 'dataSource';
default:
return null;
}
@ -303,6 +317,7 @@ export const collectFieldStateOfLinkageRules = (
const displayResult = field?.stateOfLinkageRules?.display || [field?.initStateOfLinkageRules?.display];
const patternResult = field?.stateOfLinkageRules?.pattern || [field?.initStateOfLinkageRules?.pattern];
const valueResult = field?.stateOfLinkageRules?.value || [field?.initStateOfLinkageRules?.value];
const optionsResult = field?.stateOfLinkageRules?.dataSource || [field?.initStateOfLinkageRules?.dataSource];
const { evaluate } = evaluators.get('formula.js');
const paramsToGetConditionResult = { ruleGroup: condition, variables, localVariables, variableNameOfLeftCondition };
@ -376,6 +391,16 @@ export const collectFieldStateOfLinkageRules = (
};
}
break;
case ActionType.Options:
{
const data = field.data?.dataSource?.filter((v) => value.value.includes(v.value));
optionsResult.push(getTempFieldState(conditionAnalyses(paramsToGetConditionResult, jsonLogic), data || []));
field.stateOfLinkageRules = {
...field.stateOfLinkageRules,
dataSource: optionsResult,
};
}
break;
default:
return null;
}

View File

@ -22,6 +22,7 @@ export enum ActionType {
Color = 'color',
BackgroundColor = 'backgroundColor',
TextAlign = 'textAlign',
Options = 'options',
}
export enum LinkageRuleCategory {

View File

@ -46,7 +46,7 @@ export const useValues = (options) => {
const operators = option?.operators;
field.data.operators = operators?.filter((v) => {
if (dataIndex.length > 1) {
return v.value !== 'value';
return v.value !== 'value' && v.value !== 'options';
}
return true;
});

View File

@ -54,7 +54,6 @@ const InternalField: React.FC = (props) => {
}
field.required = true;
// @ts-ignore
field.dataSource = uiSchema.enum;
const originalProps = compile(uiSchema['x-component-props']) || {};
const componentProps = merge(originalProps, field.componentProps || {});
field.componentProps = componentProps;
@ -90,6 +89,7 @@ export const BulkEditField = (props: any) => {
const [value, setValue] = useState(null);
const { getField } = useCollection_deprecated();
const collectionField = getField(fieldSchema.name) || {};
const { uiSchema } = collectionField;
useEffect(() => {
field.value = toFormFieldValue({ [type]: value });
if (field.required) {
@ -102,6 +102,12 @@ export const BulkEditField = (props: any) => {
}
}, [field, type, value]);
useEffect(() => {
field.dataSource = field.dataSource || uiSchema.enum;
field.data = field.data || {};
field.data.dataSource = uiSchema.enum;
}, [uiSchema]);
useEffect(() => {
if (field.value === null) {
setValue(undefined);