Преглед на файлове

fix: 人员节点禁止查看详情,右键菜单整体置灰不可点击

- 人员节点右键菜单通过自定义 getContent 输出 is-disabled 菜单项,不写 value,点击不触发动作。- handleContextMenuClick 对人员节点直接返回;节点单击仍只做选中,不再进入详情。- 增加插件菜单禁用态样式(灰色、not-allowed、无 hover)。
cc преди 2 дни
родител
ревизия
b638afcbf6
променени са 1 файла, в които са добавени 35 реда и са изтрити 1 реда
  1. 35 1
      ai-electron/frontend/src/ai/components/graph/GraphAnalysisViewer.vue

+ 35 - 1
ai-electron/frontend/src/ai/components/graph/GraphAnalysisViewer.vue

@@ -899,6 +899,8 @@
   const contextMenuId = (event: any) =>
     String(event?.target?.id || event?.target?.getAttribute?.('id') || event?.target?.attributes?.id || '');
 
+  const isPersonNode = (elementId: string) => nodeById.value.get(elementId)?.kind === 'person';
+
   const getContextMenuItems = (event: any) => {
     const id = contextMenuId(event);
     contextMenuElementId.value = id;
@@ -930,11 +932,30 @@
     ];
   };
 
+  /** 人员节点:不提供查看详情,右键菜单整体置灰且不可点击 */
+  const buildContextMenuContent = (items: Array<{ name: string; value: string }>, disabled = false) => `
+    <ul class="g6-contextmenu-ul">
+      ${items
+        .map(
+          (item) =>
+            `<li class="g6-contextmenu-li${disabled ? ' is-disabled' : ''}"${
+              disabled ? ' aria-disabled="true"' : ` value="${item.value}"`
+            }>${item.name}</li>`,
+        )
+        .join('')}
+    </ul>
+  `;
+
   const createContextMenuPlugin = () => ({
     type: 'contextmenu',
     key: 'ai-graph-contextmenu',
     className: 'g6-editor-contextmenu',
-    getItems: (event: any) => getContextMenuItems(event),
+    getContent: (event: any) => {
+      const id = contextMenuId(event);
+      const items = getContextMenuItems(event);
+      // 人员节点不允许查看详情:整个菜单项置灰,不写 value,点击不会触发动作
+      return buildContextMenuContent(items, isPersonNode(id));
+    },
     onClick: (value: string, _target: HTMLElement, current: any) => {
       void handleContextMenuClick(value, current);
     },
@@ -942,6 +963,8 @@
 
   const handleContextMenuClick = async (value: string, current: any) => {
     const id = String(current?.id || contextMenuElementId.value || '');
+    // 人员节点右键菜单整体禁用,不响应任何菜单动作
+    if (isPersonNode(id)) return;
     const kind: 'node' | 'edge' | null = nodeById.value.has(id) ? 'node' : edgeById.value.has(id) ? 'edge' : null;
     if (value === 'fitView') {
       await fitView();
@@ -2275,3 +2298,14 @@
     }
   }
 </style>
+
+<style lang="less">
+  /* 人员节点右键菜单整体禁用态;插件 DOM 挂到画布容器上,不能用 scoped */
+  .g6-editor-contextmenu .g6-contextmenu-li.is-disabled,
+  .g6-editor-contextmenu .g6-contextmenu-li.is-disabled:hover {
+    color: #94a3b8;
+    background: transparent;
+    cursor: not-allowed;
+    user-select: none;
+  }
+</style>