修改回退逻辑。

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

@@ -73,6 +73,7 @@
             @nodes-change="(data) => nodesChange(data)"
             @edges-change="(data) => edgesChange(data)"
             @node-drag-stop="nodeDragStop"
+            @node-drag-start="nodeDragStart"
           >
             <MiniMap style="background-color: grey" />
             <template #edge-custom="props">
@@ -259,45 +260,36 @@ const changeStyle = () => {
   styleStatus.value = !styleStatus.value;
 };
 const addHistory = (type) => {
-  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)));
-    }
-  });
+  historyList.value.unshift(JSON.parse(JSON.stringify(flowData)));
 };
 const resetHistory = () => {
   historyList.value = [];
-  historyList.value.unshift(JSON.parse(JSON.stringify(flowData)));
 };
 const nodesChange = (data) => {
-  if (data.length > 0) {
-    if (data[0].type === "add") {
-      addHistory("1");
-    } else if (data.type === "remove") {
-      addHistory();
-    }
+  if (
+    data.length > 0 &&
+    data[0].type &&
+    (data[0].type === "add" || data[0].type === "remove")
+  ) {
+    addHistory();
   }
 };
 const edgesChange = (data) => {
-  if (data.length > 0) {
-    if (data[0].type === "add") {
-      addHistory("2");
-    } else if (data.type === "remove") {
-      addHistory();
-    }
+  if (
+    data.length > 0 &&
+    data[0].type &&
+    (data[0].type === "add" || data[0].type === "remove")
+  ) {
+    addHistory();
   }
 };
-const nodeDragStart = () => {};
+
+let dragStartFlowData = null;
+const nodeDragStart = () => {
+  dragStartFlowData = JSON.parse(JSON.stringify(flowData));
+};
 const nodeDragStop = () => {
-  addHistory();
+  historyList.value.unshift(JSON.parse(JSON.stringify(dragStartFlowData)));
 };
 
 const goBack = () => {
@@ -308,16 +300,6 @@ const goBack = () => {
   } 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();
@@ -506,6 +488,7 @@ const cancelFlow = () => {
   resetHistory();
 };
 const deleteFlow = () => {
+  addHistory();
   if (selectNode.value != null) {
     flowData.nodes.forEach((item, index) => {
       if (item.id == selectNode.value.id) {
@@ -523,7 +506,6 @@ const deleteFlow = () => {
   selectNode.value = null;
   selectLine.value = null;
   ElMessage.success("删除成功");
-  addHistory();
 };
 
 const saveInfo = async () => {
@@ -658,16 +640,16 @@ watch(
 const { nodes } = toRefs(flowData); //ref(initialNodes);
 const { edges } = toRefs(flowData); //ref(initialEdges);
 async function layoutGraph(direction) {
+  addHistory();
   nodes.value = layout(nodes.value, edges.value, direction);
   nextTick(() => {
     fitView();
-    addHistory();
   });
 }
 // 转换为蛇形布局
 const convertToSnakeLayout = () => {
-  nodes.value = useSnakeLayoutHook(nodes.value, edges.value);
   addHistory();
+  nodes.value = useSnakeLayoutHook(nodes.value, edges.value);
 };
 </script>