feat: onSuccess for action settings
This commit is contained in:
parent
6d917d36c2
commit
6b2d8fdd4a
@ -51,27 +51,23 @@ export const useCreateActionProps = () => {
|
|||||||
});
|
});
|
||||||
__parent?.service?.refresh?.();
|
__parent?.service?.refresh?.();
|
||||||
setVisible?.(false);
|
setVisible?.(false);
|
||||||
if (visible !== undefined) {
|
const onSuccess = actionSchema?.['x-action-settings']?.onSuccess;
|
||||||
|
if (!onSuccess?.successMessage) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
const onSuccess = field?.decoratorProps?.onSuccess;
|
Modal.success({
|
||||||
if (typeof onSuccess === 'function') {
|
title: onSuccess?.successMessage,
|
||||||
onSuccess({ form });
|
onOk: async () => {
|
||||||
} else {
|
await form.reset();
|
||||||
Modal.success({
|
if (onSuccess?.redirecting && onSuccess?.redirectTo) {
|
||||||
title: onSuccess?.successMessage || t('Submitted successfully!'),
|
if (isURL(onSuccess.redirectTo)) {
|
||||||
onOk: async () => {
|
window.location.href = onSuccess.redirectTo;
|
||||||
await form.reset();
|
} else {
|
||||||
if (onSuccess?.redirecting && onSuccess?.redirectTo) {
|
history.push(onSuccess.redirectTo);
|
||||||
if (isURL(onSuccess.redirectTo)) {
|
|
||||||
window.location.href = onSuccess.redirectTo;
|
|
||||||
} else {
|
|
||||||
history.push(onSuccess.redirectTo);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
});
|
},
|
||||||
}
|
});
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
@ -82,6 +78,7 @@ export const useUpdateActionProps = () => {
|
|||||||
const { resource, __parent } = useBlockRequestContext();
|
const { resource, __parent } = useBlockRequestContext();
|
||||||
const { setVisible } = useActionContext();
|
const { setVisible } = useActionContext();
|
||||||
const actionSchema = useFieldSchema();
|
const actionSchema = useFieldSchema();
|
||||||
|
const history = useHistory();
|
||||||
return {
|
return {
|
||||||
async onClick() {
|
async onClick() {
|
||||||
const skipValidator = actionSchema?.['x-action-settings']?.skipValidator;
|
const skipValidator = actionSchema?.['x-action-settings']?.skipValidator;
|
||||||
@ -101,6 +98,22 @@ export const useUpdateActionProps = () => {
|
|||||||
__parent?.__parent?.service?.refresh?.();
|
__parent?.__parent?.service?.refresh?.();
|
||||||
}
|
}
|
||||||
setVisible?.(false);
|
setVisible?.(false);
|
||||||
|
const onSuccess = actionSchema?.['x-action-settings']?.onSuccess;
|
||||||
|
if (onSuccess?.successMessage) {
|
||||||
|
Modal.success({
|
||||||
|
title: onSuccess?.successMessage,
|
||||||
|
onOk: async () => {
|
||||||
|
await form.reset();
|
||||||
|
if (onSuccess?.redirecting && onSuccess?.redirectTo) {
|
||||||
|
if (isURL(onSuccess.redirectTo)) {
|
||||||
|
window.location.href = onSuccess.redirectTo;
|
||||||
|
} else {
|
||||||
|
history.push(onSuccess.redirectTo);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
});
|
||||||
|
}
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
@ -1,5 +1,6 @@
|
|||||||
import { ISchema, useField, useFieldSchema } from '@formily/react';
|
import { ISchema, useField, useFieldSchema } from '@formily/react';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
import { useTranslation } from 'react-i18next';
|
||||||
import { useDesignable } from '../..';
|
import { useDesignable } from '../..';
|
||||||
import { GeneralSchemaDesigner, SchemaSettings } from '../../../schema-settings';
|
import { GeneralSchemaDesigner, SchemaSettings } from '../../../schema-settings';
|
||||||
|
|
||||||
@ -7,6 +8,7 @@ export const ActionDesigner = (props) => {
|
|||||||
const field = useField();
|
const field = useField();
|
||||||
const fieldSchema = useFieldSchema();
|
const fieldSchema = useFieldSchema();
|
||||||
const { dn } = useDesignable();
|
const { dn } = useDesignable();
|
||||||
|
const { t } = useTranslation();
|
||||||
const isPopupAction = ['create', 'update', 'view'].includes(fieldSchema['x-action'] || '');
|
const isPopupAction = ['create', 'update', 'view'].includes(fieldSchema['x-action'] || '');
|
||||||
return (
|
return (
|
||||||
<GeneralSchemaDesigner {...props}>
|
<GeneralSchemaDesigner {...props}>
|
||||||
@ -79,7 +81,7 @@ export const ActionDesigner = (props) => {
|
|||||||
)}
|
)}
|
||||||
{fieldSchema?.['x-action-settings'] && (
|
{fieldSchema?.['x-action-settings'] && (
|
||||||
<SchemaSettings.SwitchItem
|
<SchemaSettings.SwitchItem
|
||||||
title={'跳过表单校验'}
|
title={'跳过必填校验'}
|
||||||
checked={!!fieldSchema?.['x-action-settings']?.skipValidator}
|
checked={!!fieldSchema?.['x-action-settings']?.skipValidator}
|
||||||
onChange={(value) => {
|
onChange={(value) => {
|
||||||
fieldSchema['x-action-settings'].skipValidator = value;
|
fieldSchema['x-action-settings'].skipValidator = value;
|
||||||
@ -127,11 +129,66 @@ export const ActionDesigner = (props) => {
|
|||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
|
{fieldSchema?.['x-action-settings'] && (
|
||||||
|
<SchemaSettings.ModalItem
|
||||||
|
title={t('After successful submission')}
|
||||||
|
initialValues={fieldSchema?.['x-action-settings']?.['onSuccess']}
|
||||||
|
schema={
|
||||||
|
{
|
||||||
|
type: 'object',
|
||||||
|
title: t('After successful submission'),
|
||||||
|
properties: {
|
||||||
|
successMessage: {
|
||||||
|
// default: t('Submitted successfully!'),
|
||||||
|
title: 'Pop-up message',
|
||||||
|
'x-decorator': 'FormItem',
|
||||||
|
'x-component': 'Input.TextArea',
|
||||||
|
'x-component-props': {},
|
||||||
|
},
|
||||||
|
redirecting: {
|
||||||
|
title: t('Then'),
|
||||||
|
default: false,
|
||||||
|
enum: [
|
||||||
|
{ label: t('Stay on current page'), value: false },
|
||||||
|
{ label: t('Redirect to'), value: true },
|
||||||
|
],
|
||||||
|
'x-decorator': 'FormItem',
|
||||||
|
'x-component': 'Radio.Group',
|
||||||
|
'x-component-props': {},
|
||||||
|
'x-reactions': {
|
||||||
|
target: 'redirectTo',
|
||||||
|
fulfill: {
|
||||||
|
state: {
|
||||||
|
visible: '{{!!$self.value}}',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
redirectTo: {
|
||||||
|
title: t('Link'),
|
||||||
|
'x-decorator': 'FormItem',
|
||||||
|
'x-component': 'Input',
|
||||||
|
'x-component-props': {},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
} as ISchema
|
||||||
|
}
|
||||||
|
onSubmit={(onSuccess) => {
|
||||||
|
fieldSchema['x-action-settings']['onSuccess'] = onSuccess;
|
||||||
|
dn.emit('patch', {
|
||||||
|
schema: {
|
||||||
|
['x-uid']: fieldSchema['x-uid'],
|
||||||
|
'x-action-settings': fieldSchema['x-action-settings'],
|
||||||
|
},
|
||||||
|
});
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
<SchemaSettings.Divider />
|
<SchemaSettings.Divider />
|
||||||
<SchemaSettings.Remove
|
<SchemaSettings.Remove
|
||||||
removeParentsIfNoChildren
|
removeParentsIfNoChildren
|
||||||
breakRemoveOn={(s) => {
|
breakRemoveOn={(s) => {
|
||||||
return s['x-component'] === 'Space' || s['x-component'] === 'ActionBar';
|
return s['x-component'] === 'Space' || s['x-component'].endsWith('ActionBar');
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
</GeneralSchemaDesigner>
|
</GeneralSchemaDesigner>
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
import { ISchema, useField, useFieldSchema } from '@formily/react';
|
import { useField, useFieldSchema } from '@formily/react';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
import { useFormBlockContext } from '../../../block-provider';
|
import { useFormBlockContext } from '../../../block-provider';
|
||||||
@ -19,62 +19,6 @@ export const FormDesigner = () => {
|
|||||||
const { visible } = useActionContext();
|
const { visible } = useActionContext();
|
||||||
return (
|
return (
|
||||||
<GeneralSchemaDesigner template={template} title={title || name}>
|
<GeneralSchemaDesigner template={template} title={title || name}>
|
||||||
<SchemaSettings.ModalItem
|
|
||||||
hidden={visible !== undefined}
|
|
||||||
title={t('After successful submission')}
|
|
||||||
initialValues={fieldSchema['x-decorator-props']?.['onSuccess']}
|
|
||||||
schema={
|
|
||||||
{
|
|
||||||
type: 'object',
|
|
||||||
title: t('After successful submission'),
|
|
||||||
properties: {
|
|
||||||
successMessage: {
|
|
||||||
default: t('Submitted successfully!'),
|
|
||||||
title: 'Pop-up message',
|
|
||||||
'x-decorator': 'FormItem',
|
|
||||||
'x-component': 'Input.TextArea',
|
|
||||||
'x-component-props': {},
|
|
||||||
},
|
|
||||||
redirecting: {
|
|
||||||
title: t('Then'),
|
|
||||||
default: false,
|
|
||||||
enum: [
|
|
||||||
{ label: t('Stay on current page'), value: false },
|
|
||||||
{ label: t('Redirect to'), value: true },
|
|
||||||
],
|
|
||||||
'x-decorator': 'FormItem',
|
|
||||||
'x-component': 'Radio.Group',
|
|
||||||
'x-component-props': {},
|
|
||||||
'x-reactions': {
|
|
||||||
target: 'redirectTo',
|
|
||||||
fulfill: {
|
|
||||||
state: {
|
|
||||||
visible: '{{!!$self.value}}',
|
|
||||||
},
|
|
||||||
},
|
|
||||||
},
|
|
||||||
},
|
|
||||||
redirectTo: {
|
|
||||||
title: t('Link'),
|
|
||||||
'x-decorator': 'FormItem',
|
|
||||||
'x-component': 'Input',
|
|
||||||
'x-component-props': {},
|
|
||||||
},
|
|
||||||
},
|
|
||||||
} as ISchema
|
|
||||||
}
|
|
||||||
onSubmit={(onSuccess) => {
|
|
||||||
field.decoratorProps.onSuccess = onSuccess;
|
|
||||||
fieldSchema['x-decorator-props'] = fieldSchema['x-decorator-props'] || {};
|
|
||||||
fieldSchema['x-decorator-props']['onSuccess'] = onSuccess;
|
|
||||||
dn.emit('patch', {
|
|
||||||
schema: {
|
|
||||||
['x-uid']: fieldSchema['x-uid'],
|
|
||||||
'x-decorator-props': fieldSchema['x-decorator-props'],
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
{/* <SchemaSettings.Template componentName={'FormItem'} collectionName={name} /> */}
|
{/* <SchemaSettings.Template componentName={'FormItem'} collectionName={name} /> */}
|
||||||
<SchemaSettings.FormItemTemplate componentName={'FormItem'} collectionName={name} />
|
<SchemaSettings.FormItemTemplate componentName={'FormItem'} collectionName={name} />
|
||||||
<SchemaSettings.Divider />
|
<SchemaSettings.Divider />
|
||||||
|
@ -14,6 +14,9 @@ export const FormActionInitializers = {
|
|||||||
schema: {
|
schema: {
|
||||||
'x-action-settings': {
|
'x-action-settings': {
|
||||||
initialValues: {},
|
initialValues: {},
|
||||||
|
onSuccess: {
|
||||||
|
successMessage: 'Submitted successfully!',
|
||||||
|
},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
@ -36,6 +39,9 @@ export const FormActionInitializers = {
|
|||||||
'x-designer': 'Action.Designer',
|
'x-designer': 'Action.Designer',
|
||||||
'x-action-settings': {
|
'x-action-settings': {
|
||||||
initialValues: {},
|
initialValues: {},
|
||||||
|
onSuccess: {
|
||||||
|
successMessage: 'Submitted successfully!',
|
||||||
|
},
|
||||||
},
|
},
|
||||||
'x-component-props': {
|
'x-component-props': {
|
||||||
useProps: '{{ useCreateActionProps }}',
|
useProps: '{{ useCreateActionProps }}',
|
||||||
|
Loading…
Reference in New Issue
Block a user