From 8274fbad21191e34061be61d8de89ac2943ac4db Mon Sep 17 00:00:00 2001
From: chenos <chenlinxh@gmail.com>
Date: Wed, 6 Jan 2021 15:40:27 +0800
Subject: [PATCH] refactor: improve deep equals check

---
 packages/app/package.json                     |  2 ++
 .../components/form.fields/sub-table/Form.tsx | 26 +++++++++++++----
 .../src/components/views/Form/DrawerForm.tsx  | 28 +++++++++++++++----
 3 files changed, 44 insertions(+), 12 deletions(-)

diff --git a/packages/app/package.json b/packages/app/package.json
index a68f6ea37..67adc6448 100644
--- a/packages/app/package.json
+++ b/packages/app/package.json
@@ -37,8 +37,10 @@
     "@umijs/test": "^3.2.23",
     "ahooks": "^2.9.3",
     "array-move": "^3.0.1",
+    "clean-deep": "^3.4.0",
     "concurrently": "^5.3.0",
     "lint-staged": "^10.0.7",
+    "marked": "^1.2.7",
     "nodemon": "^2.0.6",
     "prettier": "^1.19.1",
     "react": "16.14.0",
diff --git a/packages/app/src/components/form.fields/sub-table/Form.tsx b/packages/app/src/components/form.fields/sub-table/Form.tsx
index 6ebf13b15..505a72f42 100644
--- a/packages/app/src/components/form.fields/sub-table/Form.tsx
+++ b/packages/app/src/components/form.fields/sub-table/Form.tsx
@@ -18,6 +18,7 @@ import { QuestionCircleOutlined } from '@ant-design/icons';
 import { useRequest } from 'umi';
 import api from '@/api-client';
 import { Spin } from '@nocobase/client';
+import cleanDeep from 'clean-deep';
 
 const actions = createFormActions();
 
@@ -54,16 +55,29 @@ export default forwardRef((props: any, ref) => {
       width={'40%'}
       onClose={() => {
         actions.getFormState(state => {
-          if (isEqual(state.initialValues, state.values)) {
+          const values = cleanDeep(state.values);
+          const others = Object.keys(data).length ? cleanDeep({...data}) : cleanDeep(state.initialValues);
+          if (isEqual(values, others)) {
             setVisible(false);
             return;
           }
-          Modal.confirm({
-            title: '表单内容发生变化，确定不保存吗？',
-            onOk() {
-              setVisible(false);
+          for (const key in values) {
+            if (Object.prototype.hasOwnProperty.call(values, key)) {
+              const value = values[key];
+              const other = others[key];
+              if (!isEqual(value, other)) {
+                // console.log(value, other, values, others, state.initialValues);
+                Modal.confirm({
+                  title: '表单内容发生变化，确定不保存吗？',
+                  onOk() {
+                    setVisible(false);
+                  }
+                });
+                return;
+              }
             }
-          });
+          }
+          setVisible(false);
         });
       }}
       title={title}
diff --git a/packages/app/src/components/views/Form/DrawerForm.tsx b/packages/app/src/components/views/Form/DrawerForm.tsx
index bf4085459..32c0fe9ef 100644
--- a/packages/app/src/components/views/Form/DrawerForm.tsx
+++ b/packages/app/src/components/views/Form/DrawerForm.tsx
@@ -20,6 +20,9 @@ import { useRequest } from 'umi';
 import api from '@/api-client';
 import { Spin } from '@nocobase/client';
 import isEqual from 'lodash/isEqual';
+import isEmpty from 'lodash/isEmpty';
+import get from 'lodash/get';
+import cleanDeep from 'clean-deep';
 
 const actions = createFormActions();
 
@@ -64,16 +67,29 @@ export const DrawerForm = forwardRef((props: any, ref) => {
       className={'noco-drawer'}
       onClose={() => {
         actions.getFormState(state => {
-          if (isEqual(state.initialValues, state.values)) {
+          const values = cleanDeep(state.values);
+          const others = Object.keys(data).length ? cleanDeep({...data, associatedKey}) : cleanDeep(state.initialValues);
+          if (isEqual(values, others)) {
             setVisible(false);
             return;
           }
-          Modal.confirm({
-            title: '表单内容发生变化，确定不保存吗？',
-            onOk() {
-              setVisible(false);
+          for (const key in values) {
+            if (Object.prototype.hasOwnProperty.call(values, key)) {
+              const value = values[key];
+              const other = others[key];
+              if (!isEqual(value, other)) {
+                // console.log(value, other, values, others, state.initialValues);
+                Modal.confirm({
+                  title: '表单内容发生变化，确定不保存吗？',
+                  onOk() {
+                    setVisible(false);
+                  }
+                });
+                return;
+              }
             }
-          });
+          }
+          setVisible(false);
         });
       }}
       title={title}