diff --git a/packages/core/client/src/locale/en_US.ts b/packages/core/client/src/locale/en_US.ts index 3e736627c..bd7123038 100644 --- a/packages/core/client/src/locale/en_US.ts +++ b/packages/core/client/src/locale/en_US.ts @@ -286,6 +286,6 @@ export default { 'Execution History': 'History', 'Parallel branch': 'Branch', - 'Confirm': 'Confirm', - 'Form value changed tip': 'Are you sure to exit that Data unsaved', + 'Unsaved changes': 'Unsaved changes', + 'Are you sure you don\'t want to save?': 'Are you sure you don\'t want to save?', } diff --git a/packages/core/client/src/schema-component/antd/action/Action.Drawer.tsx b/packages/core/client/src/schema-component/antd/action/Action.Drawer.tsx index 6596c2f82..f571ebf34 100644 --- a/packages/core/client/src/schema-component/antd/action/Action.Drawer.tsx +++ b/packages/core/client/src/schema-component/antd/action/Action.Drawer.tsx @@ -1,6 +1,6 @@ import { css } from '@emotion/css'; import { observer, RecursionField, useField, useFieldSchema } from '@formily/react'; -import { Drawer, Modal as AntdModal } from 'antd'; +import { Drawer } from 'antd'; import classNames from 'classnames'; import React from 'react'; import { createPortal } from 'react-dom'; @@ -11,7 +11,7 @@ import { ComposedActionDrawer } from './types'; export const ActionDrawer: ComposedActionDrawer = observer((props) => { const { footerNodeName = 'Action.Drawer.Footer', ...others } = props; const { t } = useTranslation(); - const { visible, setVisible, formValueChanged, setFormValueChanged } = useActionContext(); + const { visible, setVisible } = useActionContext(); const schema = useFieldSchema(); const field = useField(); const footerSchema = schema.reduceProperties((buf, s) => { @@ -22,18 +22,7 @@ export const ActionDrawer: ComposedActionDrawer = observer((props) => { }); const closeHandler = () => { - if (!formValueChanged) { - setVisible(false); - return; - } - AntdModal.confirm({ - title: t('Unsaved changes'), - content: t("Are you sure you don't want to save?"), - async onOk() { - setFormValueChanged(false); - setVisible(false); - }, - }); + setVisible(false); }; return ( <> diff --git a/packages/core/client/src/schema-component/antd/action/hooks.ts b/packages/core/client/src/schema-component/antd/action/hooks.ts index d36f59834..173dd37eb 100644 --- a/packages/core/client/src/schema-component/antd/action/hooks.ts +++ b/packages/core/client/src/schema-component/antd/action/hooks.ts @@ -1,5 +1,7 @@ import { useForm } from '@formily/react'; +import { Modal as AntdModal } from 'antd'; import { useContext } from 'react'; +import { useTranslation } from 'react-i18next'; import { ActionContext } from './context'; export const useA = () => { @@ -10,12 +12,28 @@ export const useA = () => { export const useActionContext = () => { const ctx = useContext(ActionContext); + const { t } = useTranslation(); return { ...ctx, setVisible(visible: boolean) { if (ctx?.openMode !== 'page') { - ctx?.setVisible?.(visible); + if (!visible) { + if (ctx.formValueChanged) { + AntdModal.confirm({ + title: t('Unsaved changes'), + content: t("Are you sure you don't want to save?"), + async onOk() { + ctx.setFormValueChanged(false); + ctx.setVisible(false); + }, + }); + } else { + ctx.setVisible(false); + } + } else { + ctx?.setVisible?.(visible); + } } }, };