diff --git a/packages/core/client/src/schema-component/antd/filter/FilterGroup.tsx b/packages/core/client/src/schema-component/antd/filter/FilterGroup.tsx index 558e0e438..712eb091b 100644 --- a/packages/core/client/src/schema-component/antd/filter/FilterGroup.tsx +++ b/packages/core/client/src/schema-component/antd/filter/FilterGroup.tsx @@ -1,7 +1,7 @@ import { CloseCircleOutlined } from '@ant-design/icons'; import { ObjectField as ObjectFieldModel } from '@formily/core'; import { ArrayField, connect, useField } from '@formily/react'; -import { Select, Space } from 'antd'; +import { ConfigProvider, Select, Space } from 'antd'; import React, { useContext } from 'react'; import { Trans, useTranslation } from 'react-i18next'; import { FilterLogicContext, RemoveConditionContext } from './context'; @@ -20,84 +20,89 @@ export const FilterGroup = connect((props) => { [value]: [...(obj[logic] || [])], }; }; + const mergedDisabled = field.disabled; return ( - -
- {remove && ( - - remove()} - /> - - )} -
- - {'Meet '} - - {' conditions in the group'} - + + + -
- -
- - { - const value = field.value || {}; - const items = value[logic] || []; - items.push({}); - field.value = { - [logic]: items, - }; - }} - > - {t('Add condition')} - - { - const value = field.value || {}; - const items = value[logic] || []; - items.push({ - $and: [{}], - }); - field.value = { - [logic]: items, - }; - }} - > - {t('Add condition group')} - - -
- + + ); }); diff --git a/packages/core/client/src/schema-component/antd/filter/FilterItem.tsx b/packages/core/client/src/schema-component/antd/filter/FilterItem.tsx index 4c5201401..ef0b6975e 100644 --- a/packages/core/client/src/schema-component/antd/filter/FilterItem.tsx +++ b/packages/core/client/src/schema-component/antd/filter/FilterItem.tsx @@ -50,9 +50,11 @@ export const FilterItem = observer((props: any) => { setValue(value); }, })} - - remove()} style={{ color: '#bfbfbf' }} /> - + {!props.disabled && ( + + remove()} style={{ color: '#bfbfbf' }} /> + + )}
); diff --git a/packages/core/client/src/schema-component/antd/form-v2/Form.tsx b/packages/core/client/src/schema-component/antd/form-v2/Form.tsx index a8433a686..cc9deb74f 100644 --- a/packages/core/client/src/schema-component/antd/form-v2/Form.tsx +++ b/packages/core/client/src/schema-component/antd/form-v2/Form.tsx @@ -2,7 +2,7 @@ import { FormLayout } from '@formily/antd'; import { createForm, Field, onFormInputChange } from '@formily/core'; import { FieldContext, FormContext, observer, RecursionField, useField, useFieldSchema } from '@formily/react'; import { uid } from '@formily/shared'; -import { Spin } from 'antd'; +import { ConfigProvider, Spin } from 'antd'; import React, { useEffect, useMemo } from 'react'; import { useActionContext } from '..'; import { useAttach, useComponent } from '../..'; @@ -32,7 +32,7 @@ const FormComponent: React.FC = (props) => { const Def = (props: any) => props.children; const FormDecorator: React.FC = (props) => { - const { form, children, ...others } = props; + const { form, children, disabled, ...others } = props; const field = useField(); const fieldSchema = useFieldSchema(); // TODO: component 里 useField 会与当前 field 存在偏差 @@ -65,6 +65,7 @@ const WithForm = (props) => { setFormValueChanged?.(true); }); }); + form.disabled = props.disabled; return () => { form.removeEffects(id); }; @@ -78,6 +79,7 @@ const WithoutForm = (props) => { const form = useMemo( () => createForm({ + disabled: props.disabled, effects() { onFormInputChange((form) => { setFormValueChanged?.(true); @@ -95,12 +97,19 @@ const WithoutForm = (props) => { export const Form: React.FC & { Designer?: any; ReadPrettyDesigner?: any } = observer((props) => { const field = useField(); - const { form, ...others } = useProps(props); + const { form, disabled, ...others } = useProps(props); + const formDisabled = disabled || field.disabled; return ( -
- - {form ? : } - -
+ +
+ + {form ? ( + + ) : ( + + )} + +
+
); }); diff --git a/packages/core/client/src/schema-component/antd/form/Form.tsx b/packages/core/client/src/schema-component/antd/form/Form.tsx index 2bec679df..47a4cfbd7 100644 --- a/packages/core/client/src/schema-component/antd/form/Form.tsx +++ b/packages/core/client/src/schema-component/antd/form/Form.tsx @@ -2,8 +2,8 @@ import { FormLayout } from '@formily/antd'; import { createForm } from '@formily/core'; import { FieldContext, FormContext, observer, RecursionField, useField, useFieldSchema } from '@formily/react'; import { Options, Result } from 'ahooks/lib/useRequest/src/types'; -import { Spin } from 'antd'; -import React, { createContext, useContext, useMemo } from 'react'; +import { ConfigProvider, Spin } from 'antd'; +import React, { createContext, useContext, useEffect, useMemo } from 'react'; import { useAttach, useComponent } from '../..'; import { useRequest } from '../../../api-client'; import { useCollection } from '../../../collection-manager'; @@ -38,25 +38,30 @@ const FormComponent: React.FC = (props) => { const Def = (props: any) => props.children; const FormDecorator: React.FC = (props) => { - const { form, children, ...others } = props; + const { form, children, disabled, ...others } = props; const field = useField(); const fieldSchema = useFieldSchema(); // TODO: component 里 useField 会与当前 field 存在偏差 const f = useAttach(form.createVoidField({ ...field.props, basePath: '' })); const Component = useComponent(fieldSchema['x-component'], Def); + useEffect(() => { + form.disabled = disabled || field.disabled; + }, [disabled, field.disabled]); return ( - - - - - - - - - {/* {children} */} - - - + + + + + + + + + + {/* {children} */} + + + + ); }; diff --git a/packages/plugins/workflow/src/client/nodes/index.tsx b/packages/plugins/workflow/src/client/nodes/index.tsx index 8e0161f8f..bb23a7bb9 100644 --- a/packages/plugins/workflow/src/client/nodes/index.tsx +++ b/packages/plugins/workflow/src/client/nodes/index.tsx @@ -5,7 +5,7 @@ import { } from '@ant-design/icons'; import { css, cx } from '@emotion/css'; import { ISchema, useForm } from '@formily/react'; -import { Button, message, Modal, Tag } from 'antd'; +import { Button, message, Modal, Tag, Alert } from 'antd'; import { useTranslation } from 'react-i18next'; import parse from 'json-templates'; @@ -334,6 +334,7 @@ export function NodeDefaultView(props) { 'x-component': 'Action.Drawer', 'x-decorator': 'Form', 'x-decorator-props': { + disabled: workflow.executed, useValues(options) { const d = useNodeContext(); return useRequest(() => { @@ -354,7 +355,6 @@ export function NodeDefaultView(props) { name: 'config', 'x-component': 'fieldset', 'x-component-props': { - disabled: workflow.executed, className: css` .ant-select, .ant-cascader-picker, @@ -373,11 +373,16 @@ export function NodeDefaultView(props) { 'x-component': 'Action.Drawer.Footer', properties: workflow.executed ? { - close: { - title: '{{t("Close")}}', - 'x-component': 'Action', + alert: { + 'x-component': Alert, 'x-component-props': { - useAction: '{{ cm.useCancelAction }}', + type: 'warning', + showIcon: true, + message: `{{t("Node in executed workflow cannot be modified", { ns: "${NAMESPACE}" })}}`, + className: css` + width: 100%; + font-size: 85%; + ` }, } } diff --git a/packages/plugins/workflow/src/client/triggers/index.tsx b/packages/plugins/workflow/src/client/triggers/index.tsx index 6929a1ff9..428da8e82 100644 --- a/packages/plugins/workflow/src/client/triggers/index.tsx +++ b/packages/plugins/workflow/src/client/triggers/index.tsx @@ -1,7 +1,7 @@ import { css, cx } from "@emotion/css"; import { ISchema, useForm } from "@formily/react"; import { Registry } from "@nocobase/utils/client"; -import { message, Tag } from "antd"; +import { message, Tag, Alert } from "antd"; import React from "react"; import { useTranslation } from "react-i18next"; import { InfoOutlined } from '@ant-design/icons'; @@ -159,6 +159,7 @@ export const TriggerConfig = () => { 'x-component': 'Action.Drawer', 'x-decorator': 'Form', 'x-decorator-props': { + disabled: workflow.executed, useValues(options) { return useRequest(() => Promise.resolve({ data: { config }, @@ -185,11 +186,16 @@ export const TriggerConfig = () => { 'x-component': 'Action.Drawer.Footer', properties: executed ? { - close: { - title: '{{t("Close")}}', - 'x-component': 'Action', + alert: { + 'x-component': Alert, 'x-component-props': { - useAction: '{{ cm.useCancelAction }}', + type: 'warning', + showIcon: true, + message: `{{t("Trigger in executed workflow cannot be modified", { ns: "${NAMESPACE}" })}}`, + className: css` + width: 100%; + font-size: 85%; + ` }, } }