From ad7c33a7d68053eea084c6c0d1bacd3e2fdf873d Mon Sep 17 00:00:00 2001
From: dap <15891557205@163.com>
Date: Tue, 8 Apr 2025 20:55:34 +0800
Subject: [PATCH] =?UTF-8?q?refactor:=20=E6=B5=81=E7=A8=8B=E5=88=86?=
 =?UTF-8?q?=E7=B1=BB=20useBeforeCloseDiff?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../workflow/category/category-modal.vue      | 29 ++++++++++++-------
 1 file changed, 18 insertions(+), 11 deletions(-)

diff --git a/apps/web-antd/src/views/workflow/category/category-modal.vue b/apps/web-antd/src/views/workflow/category/category-modal.vue
index 06938e84..c2816b44 100644
--- a/apps/web-antd/src/views/workflow/category/category-modal.vue
+++ b/apps/web-antd/src/views/workflow/category/category-modal.vue
@@ -17,6 +17,7 @@ import {
   categoryList,
   categoryUpdate,
 } from '#/api/workflow/category';
+import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
 
 import { modalSchema } from './data';
 
@@ -65,9 +66,17 @@ async function setupCategorySelect() {
   ]);
 }
 
+const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
+  {
+    initializedGetter: defaultFormValueGetter(formApi),
+    currentGetter: defaultFormValueGetter(formApi),
+  },
+);
+
 const [BasicModal, modalApi] = useVbenModal({
   fullscreenButton: false,
-  onCancel: handleCancel,
+  onBeforeClose,
+  onClosed: handleClosed,
   onConfirm: handleConfirm,
   onOpenChange: async (isOpen) => {
     if (!isOpen) {
@@ -89,6 +98,7 @@ const [BasicModal, modalApi] = useVbenModal({
       await formApi.setValues({ parentId });
     }
     await setupCategorySelect();
+    await markInitialized();
 
     modalApi.modalLoading(false);
   },
@@ -96,7 +106,7 @@ const [BasicModal, modalApi] = useVbenModal({
 
 async function handleConfirm() {
   try {
-    modalApi.modalLoading(true);
+    modalApi.lock(true);
     const { valid } = await formApi.validate();
     if (!valid) {
       return;
@@ -104,27 +114,24 @@ async function handleConfirm() {
     // getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
     const data = cloneDeep(await formApi.getValues());
     await (isUpdate.value ? categoryUpdate(data) : categoryAdd(data));
+    resetInitialized();
     emit('reload');
-    await handleCancel();
+    modalApi.close();
   } catch (error) {
     console.error(error);
   } finally {
-    modalApi.modalLoading(false);
+    modalApi.lock(false);
   }
 }
 
-async function handleCancel() {
-  modalApi.close();
+async function handleClosed() {
   await formApi.resetForm();
+  resetInitialized();
 }
 </script>
 
 <template>
-  <BasicModal
-    :close-on-click-modal="false"
-    :title="title"
-    class="min-h-[500px]"
-  >
+  <BasicModal :title="title" class="min-h-[500px]">
     <BasicForm />
   </BasicModal>
 </template>