点击画布和关闭弹框时检查表单数据是否修改过

@@ -587,6 +587,7 @@ export default {
         type: null, // 操作方式 0:仅保存流程说明 1:删除,2:启用
       },
       showConfirmation: true,
+      node_attr: {},
     });
 
     /**
@@ -1203,6 +1204,24 @@ export default {
 
           state.more_attr = data.property; // 更多属性
 
+          // 初始化表单数据比较结构
+          state.field_extend.forEach(ele => {
+            state.field_auths.forEach(auth => {
+              if (ele.field_id === auth.field_id) {
+                ele.field_extend.visibled = auth.visible.checked;
+                ele.field_extend.editabled = auth.editable.checked;
+                ele.field_extend.readonly = auth.editable.disabled;
+              }
+            })
+          });
+          // 储存原始节点属性
+          state.node_attr = {
+            name: _.cloneDeep(state.node_name),
+            user: _.cloneDeep(state.userTags),
+            field: _.cloneDeep(state.field_extend),
+            property: _.cloneDeep(state.more_attr)
+          }
+
           // 开始节点不显示审批意见
           if (model_id ==='start-node') {
             state.more_attr = state.more_attr.filter((ele: any) => {
@@ -1262,8 +1281,25 @@ export default {
      *
      */
     function cancel() {
+      if (!checkFormEdited()) {
+        ElMessageBox.confirm(
+        '您刚才修改过表单内容还未保存，是否离开？',
+        '温馨提示',
+        {
+          confirmButtonText: '离开',
+          cancelButtonText: '取消',
+          type: 'warning',
+        }
+      )
+        .then(() => {
+          editor.closeModel()
+        })
+        .catch(() => {
+        })
+      } else {
         editor.closeModel()
       }
+    }
 
     /**
      * 打开更多属性细节回调
@@ -1502,9 +1538,40 @@ export default {
     }
 
     function onClickCanvas(e: myEvent) {
+      if (!checkFormEdited()) {
+        ElMessageBox.confirm(
+        '您刚才修改过表单内容还未保存，是否离开？',
+        '温馨提示',
+        {
+          confirmButtonText: '离开',
+          cancelButtonText: '取消',
+          type: 'warning',
+        }
+      )
+        .then(() => {
+          state.detailModel = null;
+          editor.closeModel()
+        })
+        .catch(() => {
+        })
+      } else {
         state.detailModel = null;
         editor.closeModel()
       }
+    }
+
+    const checkFormEdited = () => { // 检查表单是否修改过内容
+      state.field_extend.forEach(ele => {
+        state.field_auths.forEach(auth => {
+          if (ele.field_id === auth.field_id) {
+            ele.field_extend.visibled = auth.visible.checked;
+            ele.field_extend.editabled = auth.editable.checked;
+            ele.field_extend.readonly = auth.editable.disabled;
+          }
+        })
+      });
+      return  _.isEqual(state.node_attr, {name: state.node_name, user: state.userTags, field: state.field_extend, property: state.more_attr})
+    }
 
     /**
      * 拖动节点结束回调