From 5fb65ada8ccc28eabf823b284de70fbd3ca1f41e Mon Sep 17 00:00:00 2001
From: ZZJ <zzjdsg2300@163.com>
Date: 星期二, 28 九月 2021 18:29:36 +0800
Subject: [PATCH] 抓拍大图层级修复v1

---
 src/components/serfDiagram/index.vue |   69 +++++++++++++++++++---------------
 1 files changed, 38 insertions(+), 31 deletions(-)

diff --git a/src/components/serfDiagram/index.vue b/src/components/serfDiagram/index.vue
index b87364c..945e15d 100644
--- a/src/components/serfDiagram/index.vue
+++ b/src/components/serfDiagram/index.vue
@@ -33,7 +33,7 @@
     startX: Number,
     isShowHover: Boolean
   },
-  data () {
+  data() {
     return {
       nodeSize: 20,
       fontSize: 20,
@@ -41,12 +41,13 @@
       toolTipStyle: {
         display: "none",
         height: "30px",
-        width: "150px"
+        width: "186px",
+        borderColor: "#ccc"
       }
     };
   },
   computed: {
-    nodes () {
+    nodes() {
       let n = new Array();
       this.members.forEach((v, i) => {
         n.push({
@@ -63,7 +64,7 @@
 
       return n;
     },
-    links () {
+    links() {
       let arr = new Array();
       let dup = new Array(); // Deduplicate to ensure that two nodes have only one line
       const count = this.members.length;
@@ -98,7 +99,7 @@
 
       return arr;
     },
-    options () {
+    options() {
       return {
         force: 3000,
         nodeSize: this.nodeSize,
@@ -117,11 +118,11 @@
       };
     }
   },
-  created () {
+  created() {
     this.reset();
   },
   methods: {
-    nodeHover (event, node) {
+    nodeHover(event, node) {
       console.log(node);
       node._opacity = 1;
       node._size = 28;
@@ -130,61 +131,67 @@
         this.toolTipStyle.display = "block";
         this.toolTipStyle.top = node.y - 60 + "px";
         this.toolTipStyle.left = node.x + "px";
-        console.log(this.members[node.id])
+        console.log(this.members[node.id]);
+        let workName = '';
+        switch (this.members[node.id].workType) {
+          case '01':
+            workName = '鍒嗘瀽'
+            break;
+          case '02':
+            workName = '瀛樺偍'
+            break;
+          case '03':
+            workName = '鍒嗘瀽+瀛樺偍'
+            break;
+          case '04':
+            workName = '搴旂敤'
+            break;
+          default:
+            return;
+        }
         this.toolTipNode = this.members[node.id].nodeName;
-        this.toolTipAddr = this.members[node.id].Address;
+        this.toolTipAddr = `${this.members[node.id].Address}(${workName})`;
       }
 
     },
-    nodeOut (event, node) {
+    nodeOut(event, node) {
       node._opacity = node.opacity;
       node._size = node.size;
       this.toolTipStyle.display = "none";
     },
-    dragStart (event) {
+    dragStart(event) {
       if (event) {
         this.movement = event.timeStamp;
       }
     },
-    nodeClick (event, node) {
-      // if (this.nodeSelected[node.id]) {
-      //   this.unSelectNode(node.id)
-      //   // is not nodeSelected
-      // } else {
-      //   this.selectNode(node)
-
-      // }
-      // this.selectNodesLinks()
-      // this.$set(this.nodes, node.index, node)
-      console.log(event, node)
-      debugger
+    nodeClick(event, node) {
       if (event.timeStamp - this.movement < 200) {
         this.$emit("selected-node", event, this.members[node.id]);
       }
     },
-    reset () {
+    reset() {
       this.nodeSelected = {};
       this.linksSelected = {};
       (this.toolTipNode = ""), (this.toolTipAddr = ""), (this.movement = 0);
     },
-    unSelectNode (nodeId) {
+    unSelectNode(nodeId) {
       if (this.nodeSelected[nodeId]) {
         delete this.nodeSelected[nodeId];
       }
       this.selectNodesLinks();
     },
-    unSelectLink (linkId) {
+    unSelectLink(linkId) {
       if (this.linksSelected[linkId]) {
         delete this.linksSelected[linkId];
       }
     },
-    selectNode (node) {
+    selectNode(node) {
       this.nodeSelected[node.id] = node;
     },
-    selectLink (link) {
+    selectLink(link) {
       this.$set(this.linksSelected, link.id, link);
     },
-    selectNodesLinks () {
+    selectNodesLinks() {
       for (let link of this.links) {
         // node is nodeSelected
         if (this.nodeSelected[link.sid] || this.nodeSelected[link.tid]) {
@@ -263,7 +270,7 @@
   position: absolute;
   background: #fff;
   /* border: 1px solid #127862; */
-  border: 1px solid rgba(76, 78, 78, 0.7);
+  border: 1px solid #ccc;
   font-size: 11px;
   padding-left: 5px;
 }
@@ -279,7 +286,7 @@
   right: 50%;
   top: 100%;
   border: solid transparent;
-  content: ' ';
+  content: " ";
   height: 0;
   width: 0;
   position: absolute;

--
Gitblit v1.8.0