iot处理

hchyun-ui/src/views/system/top/packages/topology/src/edge/dice-er-edge.js

@@ -55,7 +55,7 @@ export default {
             if (sourceNode.id !== targetNode.id) {
                 shape = group.addShape("path", {
                     attrs: {
-                        stroke: "#5B8FF9",
+                        stroke: "#53da3a",
                         path: [
                             ["M", startPoint.x, startPoint.y],
                             [
@@ -79,7 +79,7 @@ export default {
                 }
                 shape = group.addShape("path", {
                     attrs: {
-                        stroke: "#5B8FF9",
+                        stroke: "#53da3a",
                         path: [
                             ["M", startPoint.x, startPoint.y],
                             [

hchyun-ui/src/views/system/top/packages/topology/src/topology.vue

@@ -300,11 +300,12 @@ export default {
   },
   mounted() {
     Node.obj.Image.sendThis(this);
-    Behavior.obj.clickEventEdit.sendThis(this);
+    // Behavior.obj.clickEventEdit.sendThis(this);
-    Behavior.obj.dragAddEdge.sendThis(this);
+    // Behavior.obj.dragAddEdge.sendThis(this);
     Behavior.obj.dragEventEdit.sendThis(this);
     Behavior.obj.keyupEventEdit.sendThis(this);
-    Behavior.obj.hoverEventEdit.sendThis(this);
+    // Behavior.obj.hoverEventEdit.sendThis(this);
+    Behavior.obj
     this.clearHistoryData();
     // this.initTopo(this.graphData)
     // this.autoZoomHandler()

hchyun-ui/src/views/tool/top/packages/topology/src/behavior/click-event-edit.js

@@ -138,6 +138,7 @@ export default {
           };
         }
       } else if (event.item._cfg.type === "edge") {
+        console.log("jshdjhd")
         // 更新vm的data: selectedEdge 和 selectedEdgeParams
         let clickEdge = event.item;
         if (clickEdge.hasState("selected")) {

hchyun-ui/src/views/tool/top/packages/topology/src/behavior/dice-er-edge.js

@@ -4,3 +4,40 @@
  * @email: clay@hchyun.com
  * @description: node
  */
+let vm = null;
+const sendThis = (_this) => {
+  vm = _this;
+};
+
+export default {
+  sendThis,
+  name: 'dice-er-edge',
+  options: {
+    getDefaultCfg() {
+      return {
+        multiple: true,
+      };
+    },
+    getEvents() {
+      return {
+        "edge:click": "onEdgeClick",
+      }
+    },
+    onEdgeClick(event) {
+      let clickEdge = event.item;
+      console.log(789)
+      console.log(clickEdge);
+      clickEdge.setState("selected", !clickEdge.hasState("selected"));
+      console.log(clickEdge);
+      let model = clickEdge.getModel();
+      console.log(model);
+      model.label = "4564654"
+      model.stroke='#e2e2e2'
+      clickEdge.update(model)
+
+      // console.log(vm)
+      // vm.currentFocus = "edge";
+      this.updateVmData(event);
+    },
+  }
+}

hchyun-ui/src/views/tool/top/packages/topology/src/behavior/dice-er-node.js

@@ -77,10 +77,6 @@ export default {
       const {
         graph
       } = this;
-      const {
-        // eslint-disable-next-line no-unused-vars
-        y
-      } = e;
       const item = e.item;
       const shape = e.shape;
       if (!item) {
@@ -101,9 +97,9 @@ export default {
       }else {
        // eslint-disable-next-line no-unused-vars
        const model = item.getModel();
-       console.log(JSON.stringify(model));
+       // console.log(JSON.stringify(model));
-       console.log(model.style.default.fill = '#4eb922');
+       // console.log(model.style.default.fill = '#4eb922');
-       console.log(model.style.selected.shadowColor = '#4eb922');
+       // console.log(model.style.selected.shadowColor = '#4eb922');
 
      }
     },

hchyun-ui/src/views/tool/top/packages/topology/src/behavior/index.js

@@ -9,7 +9,8 @@ import hoverEventEdit from './hover-event-edit'
 import clickEventEdit from './click-event-edit'
 import dragEventEdit from './drag-event-edit'
 import keyupEventEdit from './keyup-event-edit'
-import diceErScroll from './dice-er-node'
+import diceErNode from './dice-er-node'
+import diceErEdge from './dice-er-edge'
 
 const obj = {
   // dragAddEdge,
@@ -17,7 +18,8 @@ const obj = {
   // clickEventEdit,
   dragEventEdit,
   keyupEventEdit,
-  diceErScroll
+  diceErNode,
+  diceErEdge
 }
 
 export default {

hchyun-ui/src/views/tool/top/packages/topology/src/edge/dice-er-edge.js

@@ -5,9 +5,13 @@
  * @description: node
  */
 import {Util} from '@antv/g6'
+import utils from "@/views/system/top/packages/topology/src/utils";
+
 export default {
   name: 'dice-er-edge',
   options: {
+
+
     draw(cfg, group) {
       //todo 画线
       // console.log("cfg",cfg,"group",group)
@@ -126,5 +130,9 @@ export default {
       });
       label.rotateAtStart(labelStyle.rotate);
     },
+    setState(name, value, item) {
+      // 设置边状态
+      utils.edge.setState(name, value, item)
+    }
   }
 }

hchyun-ui/src/views/tool/top/packages/topology/src/graph/index.js

@@ -54,18 +54,19 @@ const initGraph = {
       //     shadowOffsetY: 3
       //   }
       // },
-      edgeStateStyles: themeStyle.edgeStyle,
+      edgeStateStyles:{
-      // edgeStyle: {
+        edgeStyle: {
-      //   default: {
+          default: {
-      //     stroke: '#e2e2e2',
+            stroke: '#e2e2e2',
-      //     lineWidth: 3,
+            lineWidth: 3,
-      //     lineAppendWidth: 10
+            lineAppendWidth: 10
-      //   },
+          },
-      //   selected: {
+          selected: {
-      //     shadowColor: '#626262',
+            shadowColor: '#626262',
-      //     shadowBlur: 3
+            shadowBlur: 3
-      //   }
+          }
-      // },
+        },
+      },
       modes: options.modes
     })
     // 将 read 方法分解成 data() 和 render 方法，便于整个生命周期的管理

hchyun-ui/src/views/tool/top/packages/topology/src/node/dice-er-box.js

@@ -6,18 +6,15 @@
  */
 import utils from '../utils/index'
 
+let vm = null;
+const sendThis = (_this) => {
+  vm = _this;
+};
 const itemHeight = 30;
 export default {
+  sendThis,
   name: 'dice-er-box',
   options: {
-        setState(name, value, item,group) {
-            // 设置节点状态
-            // utils.node.setState(name, value, item,group);
-            // 设置锚点状态
-            utils.anchor.setState(name, value, item);
-            // //设置收缩状态
-            // utils.collapse.setState(item)
-        },
     draw(cfg, group) {
       const width = 250;
       const height = 316;
@@ -236,12 +233,6 @@ export default {
             });
 
 
-
-
-
-
-
-
           }
 
           listContainer.addShape("text", {
@@ -271,6 +262,14 @@ export default {
         [1, 0],
       ];
     },
+    setState(name, value, item) {
+      // 设置节点状态
+      // utils.node.setState(name, value, item)
+      // 设置锚点状态
+      // if (vm.graphMode === 'edit') {
+        utils.anchor.setState(name, value, item)
+      // }
+    },
   }
 }
 

hchyun-ui/src/views/tool/top/packages/topology/src/theme/default-style.js

@@ -71,13 +71,13 @@ export default {
   // 锚点样式
   anchorStyle: {
     default: {
-      r: 10,
+      r: 3,
-      // symbol: 'circle',
+      symbol: 'circle',
       fill: '#FFFFFF',
       fillOpacity: 0,
       stroke: '#1890FF',
       strokeOpacity: 0,
-      // cursor: 'crosshair'
+      cursor: 'crosshair'
     },
     hover: {
       fillOpacity: 1,
@@ -100,12 +100,12 @@ export default {
   anchorBgStyle: {
     default: {
       r: 10,
-      // symbol: 'circle',
+      symbol: 'circle',
       fill: '#1890FF',
       fillOpacity: 0,
       stroke: '#1890FF',
       strokeOpacity: 0,
-      // cursor: 'crosshair'
+      cursor: 'crosshair'
     },
     hover: {
       fillOpacity: 1,

hchyun-ui/src/views/tool/top/packages/topology/src/topology.vue

@@ -299,12 +299,14 @@ export default {
   created() {
   },
   mounted() {
-    Node.obj.Image.sendThis(this);
+    Node.obj.diceErBox.sendThis(this)
-    Behavior.obj.clickEventEdit.sendThis(this);
+    // Behavior.obj.clickEventEdit.sendThis(this);
-    Behavior.obj.dragAddEdge.sendThis(this);
+    // Behavior.obj.dragAddEdge.sendThis(this);
     Behavior.obj.dragEventEdit.sendThis(this);
     Behavior.obj.keyupEventEdit.sendThis(this);
-    Behavior.obj.hoverEventEdit.sendThis(this);
+    // Behavior.obj.hoverEventEdit.sendThis(this);
+    Behavior.obj.diceErEdge.sendThis(this)
+
     this.clearHistoryData();
     // this.initTopo(this.graphData)
     // this.autoZoomHandler()
@@ -465,7 +467,8 @@ export default {
           // "drag-event-edit",
           "keyup-event-edit",
           "drag-add-edge",
-          'dice-er-node'
+          'dice-er-node',
+          "dice-er-edge"
         ],
         addEdge: [
           "drag-canvas",

hchyun-ui/src/views/tool/top/packages/topology/src/utils/anchor/index.js

@@ -10,8 +10,6 @@ import setState from './set-state'
 // import update from './update'
 
 export default {
-  // draw,
   setState,
-  // update,
   erDrawLeft,
 }

hchyun-ui/src/views/tool/top/packages/topology/src/utils/anchor/set-state.js

@@ -8,8 +8,9 @@ import theme from '../../theme'
 
 export default function(name, value, item) {
   const themeStyle = theme.defaultStyle // todo...先使用默认主题，后期可能增加其它风格的主体
-  // console.log(item)
+  console.log(name)
   if (name === 'hover') {
+    console.log(456)
     let group = item.getContainer()
     let children = group.get('children')
     for (let i = 0, len = children.length; i < len; i++) {