فهرست منبع

node右键事件;点击连接线事件;

lichunyang 7 ماه پیش
والد
کامیت
3d3ecb7ee5
1فایلهای تغییر یافته به همراه37 افزوده شده و 19 حذف شده
  1. 37 19
      src/views/vuetree/index.vue

+ 37 - 19
src/views/vuetree/index.vue

@@ -174,6 +174,12 @@ const changeName = ref({
   
 })
 
+onNodeContextMenu((e) => {
+  noid.value = e.node;
+  changeName.value.name = e.node.data.label;
+  changeNameshow.value = true;
+})
+
 onConnect((connection) => {
   console.log(connection);
   connection.type = 'smoothstep';//  smoothstep straight
@@ -328,34 +334,46 @@ let onPythonlist=ref(['Python','Branin','Rosenbrock','Rastrigin','G9','Forrester
 
 // 监听线
 function onEdgeClick(e) {
+  if (seledge.value) {
+    seledge.value.style = {
+      ...seledge.value.style,
+      stroke:'#b1b1b7',
+      strokeWidth: 1,
+    }
+  }
   Edgeid.value = e.edge.id;
   seledge.value= e.edge;
-   //seledge.value.style.stroke = 'red';
+  seledge.value.style = {
+    ...seledge.value.style,
+    stroke:'#2267B1',
+    strokeWidth: 2,
+  }
+  
 }
 function logEvent(name, event) {
   console.log(2222)
 }
 
 // 右键更改名字
-const onContextMenu = (e) => {
-      e.preventDefault();  // 阻止浏览器默认的右键菜单
-
-      const node = e.target.closest(".vue-flow__node");
-      console.log("nodes:",nodes);
-      console.log("node:",node);
-      if (node) {
-        // 获取当前右键点击的节点
-        const nodeId = node.getAttribute("data-id");
-        const clickedNode = nodes.value.find((n) => n.id === nodeId);
-        console.log("clickedNode:",clickedNode);
+// const onContextMenu = (e) => {
+//       e.preventDefault();  // 阻止浏览器默认的右键菜单
+
+//       const node = e.target.closest(".vue-flow__node");
+//       console.log("nodes:",nodes);
+//       console.log("node:",node);
+//       if (node) {
+//         // 获取当前右键点击的节点
+//         const nodeId = node.getAttribute("data-id");
+//         const clickedNode = nodes.value.find((n) => n.id === nodeId);
+//         console.log("clickedNode:",clickedNode);
         
-        if (clickedNode) {
-          noid.value = clickedNode;
-          changeName.value.name = clickedNode.label;  // 将当前节点的label放入弹窗中
-          changeNameshow.value = true;  // 显示弹窗
-        }
-      }
-};
+//         if (clickedNode) {
+//           noid.value = clickedNode;
+//           changeName.value.name = clickedNode.label;  // 将当前节点的label放入弹窗中
+//           changeNameshow.value = true;  // 显示弹窗
+//         }
+//       }
+// };
 onInit((vueFlowInstance) => {
   vueFlowInstance.fitView()
 })