修改回退逻辑。优化边。

src/views/base/craftManagement/route/bindProcess.vue

@@ -65,6 +65,7 @@
             v-model:nodes="nodes"
             v-model:edges="edges"
             :apply-default="!editStatus && usableStatus"
+            @connect="onConnectMethod"
             @dragover="onDragOver"
             @dragleave="onDragLeave"
             @node-click="nodeClick($event)"
@@ -258,90 +259,80 @@ const changeStyle = () => {
   styleStatus.value = !styleStatus.value;
 };
 const addHistory = (type) => {
-  switch (type) {
-    // 1为nodes新增
-    case "1":
-      if (
-        flowData.nodes.length >
-        historyList.value[historyList.value.length - 1].nodes.length
-      ) {
-        historyList.value.push(JSON.parse(JSON.stringify(flowData)));
-      } else {
-        setTimeout(() => {
-          return addHistory("1");
-        }, 100);
-      }
-      break;
-    case "2":
-      if (
-        flowData.edges.length >
-        historyList.value[historyList.value.length - 1].edges.length
-      ) {
-        historyList.value.push(JSON.parse(JSON.stringify(flowData)));
-      } else {
-        setTimeout(() => {
-          return addHistory("2");
-        }, 100);
-      }
-      break;
-    default:
-      historyList.value.push(JSON.parse(JSON.stringify(flowData)));
-  }
+  nextTick(() => {
+    switch (type) {
+      // 1为nodes新增
+      case "1":
+        historyList.value.unshift(JSON.parse(JSON.stringify(flowData)));
+        break;
+      case "2":
+        historyList.value.unshift(JSON.parse(JSON.stringify(flowData)));
+        break;
+      default:
+        historyList.value.unshift(JSON.parse(JSON.stringify(flowData)));
+    }
+  });
 };
 const resetHistory = () => {
   historyList.value = [];
-  historyList.value.push(JSON.parse(JSON.stringify(flowData)));
+  historyList.value.unshift(JSON.parse(JSON.stringify(flowData)));
 };
 const nodesChange = (data) => {
   if (data.length > 0) {
-    if (data[0].type == "add") {
+    if (data[0].type === "add") {
       addHistory("1");
-    } else if (data.type == "remove") {
+    } else if (data.type === "remove") {
       addHistory();
     }
   }
 };
 const edgesChange = (data) => {
   if (data.length > 0) {
-    if (data[0].type == "add") {
+    if (data[0].type === "add") {
       addHistory("2");
-    } else if (data.type == "remove") {
+    } else if (data.type === "remove") {
       addHistory();
     }
   }
 };
 const nodeDragStart = () => {};
 const nodeDragStop = () => {
-  setTimeout(() => {
-    addHistory();
-  }, 0);
+  addHistory();
 };
 
 const goBack = () => {
-  if (historyList.value.length > 1) {
-    flowData.nodes = historyList.value[historyList.value.length - 2].nodes;
-    flowData.edges = historyList.value[historyList.value.length - 2].edges;
-    setTimeout(() => {
-      historyList.value.pop();
-    }, 0);
+  let firstHistory = historyList.value.shift();
+  if (firstHistory) {
+    flowData.nodes = firstHistory.nodes;
+    flowData.edges = firstHistory.edges;
   } else {
     ElMessage.warning("已是初始线路");
   }
+
+  // if (historyList.value.length > 1) {
+  //   flowData.nodes = historyList.value[historyList.value.length - 2].nodes;
+  //   flowData.edges = historyList.value[historyList.value.length - 2].edges;
+  //   se() => {
+  //     historyList.value.pop();
+  //   }, 0);
+  // } else {
+  //   ElMessage.warning("已是初始线路");
+  // }
 };
 const historyList = ref([]);
 const { capture } = useScreenshot();
 const { layout } = useLayout();
 const instance = useVueFlow();
-const {
-  onConnect,
-  addEdges,
-  vueFlowRef,
-  onEdgeUpdateEnd,
-  applyEdgeChanges,
-  fitView,
-} = instance;
+const { addEdges, vueFlowRef, onEdgeUpdateEnd, applyEdgeChanges, fitView } =
+  instance;
 const { onDragOver, onDrop, onDragLeave, isDragOver, onDragStart } =
   useDragAndDrop();
+// onConnect(addEdges);
+const onConnectMethod = (edge) => {
+  edge.type = "custom";
+  addEdges(edge);
+};
+
 const flowData = reactive({ edges: [], nodes: [] });
 const flowDataCopy = ref({ edges: [], nodes: [] });
 const currentProcess = ref({});
@@ -413,7 +404,7 @@ const handleKeydown = () => {
     selectLine.value = null;
   }
 };
-onConnect(addEdges);
+
 const getPng = () => {
   if (!vueFlowRef.value) {
     console.warn("VueFlow element not found");
@@ -607,9 +598,8 @@ const loadProcessesFlow = async () => {
       if (res.data.usable == 1) {
         usableStatus.value = false;
       }
-      setTimeout(() => {
-        resetHistory();
-      }, 0);
+
+      resetHistory();
     } else {
       cancelStatus.value = false;
     }
@@ -649,14 +639,14 @@ const getNameByDictType = (dictValue) => {
   return str;
 };
 
-watch(
-  () => flowData.edges,
-  () => {
-    flowData.edges.forEach((item) => {
-      item.type = "custom";
-    });
-  }
-);
+// watch(
+//   () => flowData.edges,
+//   () => {
+//     flowData.edges.forEach((item) => {
+//       item.type = "custom";
+//     });
+//   }
+// );
 
 watch(
   () => list1SearchGroupDictKey.value,