Refactor(Editor): Add a prompt to leave the page

Add a prompt to leave the page when content has been changed

src/pages/System/Tools/Template.tsx

@@ -71,6 +71,19 @@ const Template = () => {
     const [templateDetailLoading, setTemplateDetailLoading] = useState<Record<string, boolean>>({})
     const [tsconfig, setTsconfig] = useState<ITsconfig>()
 
+    useBeforeUnload(
+        useCallback(
+            (event) => {
+                if (Object.keys(hasEdited).length) {
+                    event.preventDefault()
+                    event.returnValue = ''
+                }
+            },
+            [hasEdited]
+        ),
+        { capture: true }
+    )
+
     const handleOnTableChange = (
         pagination: _TablePaginationConfig,
         filters: Record<string, _FilterValue | null>,
@@ -97,19 +110,6 @@ const Template = () => {
         }
     }
 
-    useBeforeUnload(
-        useCallback(
-            (event) => {
-                if (Object.keys(hasEdited).length) {
-                    event.preventDefault()
-                    event.returnValue = ''
-                }
-            },
-            [hasEdited]
-        ),
-        { capture: true }
-    )
-
     const handleOnAddBtnClick = () => {
         setIsDrawerEdit(false)
         setIsDrawerOpen(true)
@@ -1078,6 +1078,12 @@ const Template = () => {
                 title={'未保存'}
                 onOk={() => blocker.proceed?.()}
                 onCancel={() => blocker.reset?.()}
+                footer={(_, { OkBtn, CancelBtn }) => (
+                    <>
+                        <OkBtn />
+                        <CancelBtn />
+                    </>
+                )}
             >
                 离开此页面将丢失所有未保存数据，是否继续？
             </AntdModal>