ksh

src/views/ceshi/ceshi5.vue

@@ -10,14 +10,13 @@
         ref="seeksRelationGraph"
         :options="graphOptions"
         :on-line-click="lineClick"
+        :on-node-click="nodeClick"
       >
         <div
           slot="node"
           slot-scope="{ node }"
           @contextmenu.prevent.stop="contextmenu(node, $event)"
           @mousedown="isShowNodeMenuPanel = false"
-          @dblclick="dbClick(node)"
-          @click="nodeClick(node)"
           :class="{
             w100h100: true,
             gen: negativeHeightLine(node),
@@ -206,7 +205,6 @@
       <el-table
         :data="tableData3"
         style="width: 100%"
-        ref="mutipleTable"
         max-height="300px"
         border
         header-row-class-name="tableHeader"
@@ -403,7 +401,9 @@ export default {
       //模拟双击事件
       clickTimes: 0,
       //单击还是双击
-      leftClickType: ''
+      leftClickType: "",
+      //单击后保存表格选中状态
+      clickTableSelect: [],
     };
   },
   created() {
@@ -429,6 +429,9 @@ export default {
     this.setGraphData();
   },
   methods: {
+    mouseUp() {
+      console.log("mouseup");
+    },
     getValue(arr) {
       let textMap = arr.map((i) => i.text);
       return textMap.length > 0 ? textMap[0] : "";
@@ -443,6 +446,10 @@ export default {
       }
       //点击确定后裁剪假数据并且将节点选中的算子表存起来
       this.tableData = [];
+      //单击点击确认后存储选中状态，以便双击时获取
+      if (this.leftClickType == "click") {
+        this.clickTableSelect = this.tableSelect;
+      }
       if (this.leftClickObj.data.str) {
         let index = this.tableSelect.length;
         //从所有假数据中切割长度复制给 真正展示的假数据
@@ -494,9 +501,6 @@ export default {
     notServe() {
       this.tableShow2 = false;
     },
-    dbClick(node) {
-      console.log(node);
-    },
     searchTableData() {
       if (this.input4.trim()) {
         this.tableData = this.tableData.filter((i) => {
@@ -641,7 +645,7 @@ export default {
       this.isShowNodeMenuPanel = true;
       this.nodeMenuPanelPosition.x = $event.clientX - _base_position.x;
       this.nodeMenuPanelPosition.y = $event.clientY - _base_position.y;
-      // this.mutipleTableShow(nodeObject);
+      // this.mutipleTableShow(nodeObject); /////后续可能会用
     },
     handleClick(row) {
       let boo = this.nodeNameArr.includes(row.name);
@@ -878,12 +882,13 @@ export default {
     },
     //左键点击节点后
     nodeClick(nodeObject, $event) {
+      // if()
       let _this = this;
       this.clickTimes++;
       if (this.clickTimes === 2) {
         //当点击次数为2
-        this.clickTimes = 0; //记得清零
-        this.leftClickType = 'dbclick';
+        _this.clickTimes = 0; //记得清零
+        _this.leftClickType = "dbclick";
         //  触发双击事件...
         _this.leftClickObj = nodeObject;
         _this.selectNodeName = nodeObject.id;
@@ -892,7 +897,7 @@ export default {
       setTimeout(function () {
         if (_this.clickTimes === 1) {
           _this.clickTimes = 0; // 单击清零
-          this.leftClickType = 'click';
+          _this.leftClickType = "click";
           //  触发单击事件...
           _this.leftClickObj = nodeObject;
           _this.selectNodeName = nodeObject.id;
@@ -900,17 +905,20 @@ export default {
         }
       }, 250);
     },
-    //左键点击或者右键点击后表格变化状况
+    //左键点击后表格变化状况
     mutipleTableShow(nodeObject, type) {
       this.tableShow = false;
       this.tableShow2 = true;
+      let _this = this;
       this.$nextTick(() => {
+        this.$refs.mutipleTable.clearSelection();
+        this.tableSelect = [];
         if (type == "dbclick") {
-          // selectTable
+          _this.clickTableSelect.forEach((i) => {
+            _this.$refs.mutipleTable.toggleRowSelection(i, true);
+          });
           return;
         }
-        this.$refs.mutipleTable.clearSelection();
-        this.tableSelect = [];
         let id = nodeObject.id;
         let obj = this.defaultCheck.find((i) => i.key == id);
         if (obj && obj.value && obj.value.length > 0) {