fix: clicking on field assignment does not display field configuration for the first time (#3484)

* fix: clicking on field assignment does not result in field configuration for the first time

* fix: fix AssignedFieldValues
This commit is contained in:
katherinehhh 2024-02-21 11:02:31 +08:00 committed by GitHub
parent 83a61cdad9
commit 65d1b41165
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 19 additions and 99 deletions

View File

@ -251,23 +251,16 @@ const getAllkeys = (data, result) => {
return result; return result;
}; };
function AssignedFieldValues() { export function AssignedFieldValues() {
const { dn } = useDesignable(); const { dn } = useDesignable();
const { t } = useTranslation(); const { t } = useTranslation();
const fieldSchema = useFieldSchema(); const fieldSchema = useFieldSchema();
const field = useField(); const initialSchema = {
const [initialSchema, setInitialSchema] = useState<ISchema>();
useEffect(() => {
const schemaUid = uid();
const schema: ISchema = {
type: 'void', type: 'void',
'x-uid': schemaUid, 'x-uid': uid(),
'x-component': 'Grid', 'x-component': 'Grid',
'x-initializer': 'CustomFormItemInitializers', 'x-initializer': 'CustomFormItemInitializers',
}; };
setInitialSchema(schema);
}, [field.address]);
const tips = { const tips = {
'customize:update': t( 'customize:update': t(
'After clicking the custom button, the following fields of the current record will be saved according to the following form.', 'After clicking the custom button, the following fields of the current record will be saved according to the following form.',
@ -289,7 +282,6 @@ function AssignedFieldValues() {
}, },
[dn, fieldSchema], [dn, fieldSchema],
); );
return ( return (
<FlagProvider isInAssignFieldValues={true}> <FlagProvider isInAssignFieldValues={true}>
<DefaultValueProvider isAllowToSetDefaultValue={() => false}> <DefaultValueProvider isAllowToSetDefaultValue={() => false}>

View File

@ -1,20 +1,18 @@
import React, { useCallback, useState, useEffect } from 'react'; import React from 'react';
import { import {
SchemaSettings, SchemaSettings,
ActionDesigner, ActionDesigner,
useSchemaToolbar, useSchemaToolbar,
useDesignable, useDesignable,
useCompile, useCompile,
DefaultValueProvider,
SchemaSettingsItemGroup, SchemaSettingsItemGroup,
SchemaSettingsModalItem, SchemaSettingsModalItem,
SchemaSettingsActionModalItem,
SchemaSettingsSelectItem, SchemaSettingsSelectItem,
FlagProvider, AssignedFieldValues,
} from '@nocobase/client'; } from '@nocobase/client';
import { isValid, uid } from '@formily/shared'; import { isValid } from '@formily/shared';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import { useField, useFieldSchema, ISchema } from '@formily/react'; import { useFieldSchema, ISchema } from '@formily/react';
const MenuGroup = (props) => { const MenuGroup = (props) => {
const fieldSchema = useFieldSchema(); const fieldSchema = useFieldSchema();
@ -122,61 +120,6 @@ function AfterSuccess() {
/> />
); );
} }
function AssignedFieldValues() {
const { dn } = useDesignable();
const { t } = useTranslation();
const fieldSchema = useFieldSchema();
const field = useField();
const [initialSchema, setInitialSchema] = useState<ISchema>();
useEffect(() => {
const schemaUid = uid();
const schema: ISchema = {
type: 'void',
'x-uid': schemaUid,
'x-component': 'Grid',
'x-initializer': 'CustomFormItemInitializers',
};
setInitialSchema(schema);
}, [field.address]);
const tips = {
'customize:update': t(
'After clicking the custom button, the following fields of the current record will be saved according to the following form.',
),
'customize:save': t(
'After clicking the custom button, the following fields of the current record will be saved according to the following form.',
),
};
const actionType = fieldSchema['x-action'] ?? '';
const onSubmit = useCallback(
(assignedValues) => {
fieldSchema['x-action-settings']['assignedValues'] = assignedValues;
dn.emit('patch', {
schema: {
['x-uid']: fieldSchema['x-uid'],
'x-action-settings': fieldSchema['x-action-settings'],
},
});
},
[dn, fieldSchema],
);
return (
<FlagProvider isInAssignFieldValues={true}>
<DefaultValueProvider isAllowToSetDefaultValue={() => false}>
<SchemaSettingsActionModalItem
title={t('Assign field values')}
maskClosable={false}
initialSchema={initialSchema}
initialValues={fieldSchema?.['x-action-settings']?.assignedValues}
modalTip={tips[actionType]}
uid={fieldSchema?.['x-action-settings']?.schemaUid}
onSubmit={onSubmit}
/>
</DefaultValueProvider>
</FlagProvider>
);
}
const bulkUpdateActionSettings = new SchemaSettings({ const bulkUpdateActionSettings = new SchemaSettings({
name: 'ActionSettings:customize:bulkUpdate', name: 'ActionSettings:customize:bulkUpdate',
@ -207,10 +150,10 @@ const bulkUpdateActionSettings = new SchemaSettings({
{ {
name: 'assignFieldValues', name: 'assignFieldValues',
Component: AssignedFieldValues, Component: AssignedFieldValues,
useVisible() { // useVisible() {
const fieldSchema = useFieldSchema(); // const fieldSchema = useFieldSchema();
return isValid(fieldSchema?.['x-action-settings']?.assignedValues); // return isValid(fieldSchema?.['x-action-settings']?.assignedValues);
}, // },
}, },
{ {
name: 'afterSuccess', name: 'afterSuccess',

View File

@ -1,17 +0,0 @@
import { SchemaComponentOptions } from '@nocobase/client';
import React from 'react';
import { CustomizeActionInitializer } from './CustomizeActionInitializer';
import { useCustomizeBulkUpdateActionProps } from './utils';
export const BulkUpdatePluginProvider = (props: any) => {
return (
<SchemaComponentOptions
components={{ CustomizeActionInitializer }}
scope={{
useCustomizeBulkUpdateActionProps,
}}
>
{props.children}
</SchemaComponentOptions>
);
};

View File

@ -1,9 +1,11 @@
import { Plugin, useCollection } from '@nocobase/client'; import { Plugin, useCollection } from '@nocobase/client';
import { BulkUpdatePluginProvider } from './BulkUpdatePluginProvider';
import { bulkUpdateActionSettings } from './BulkUpdateAction.Settings'; import { bulkUpdateActionSettings } from './BulkUpdateAction.Settings';
import { CustomizeActionInitializer } from './CustomizeActionInitializer';
import { useCustomizeBulkUpdateActionProps } from './utils';
export class BulkUpdatePlugin extends Plugin { export class BulkUpdatePlugin extends Plugin {
async load() { async load() {
this.app.use(BulkUpdatePluginProvider); this.app.addComponents({ CustomizeActionInitializer });
this.app.addScopes({ useCustomizeBulkUpdateActionProps });
this.app.schemaSettingsManager.add(bulkUpdateActionSettings); this.app.schemaSettingsManager.add(bulkUpdateActionSettings);
const initializerData = { const initializerData = {