feat(flowEditor): 动态生成节点上下文菜单项

master
钟良源 3 months ago
parent 81263bcbac
commit 23157941d1

@ -1,5 +1,5 @@
import React, { useEffect } from 'react';
import { Menu, Dropdown } from '@arco-design/web-react';
import { Menu } from '@arco-design/web-react';
import { Node } from '@xyflow/react';
interface NodeContextMenuProps {
@ -34,26 +34,53 @@ const NodeContextMenu: React.FC<NodeContextMenuProps> = ({
const handleEdit = () => {
onEdit && onEdit(node);
onCloseOpenModal(false);
onCloseOpenModal(true);
onCloseMenu(null);
};
// 根据节点类型和其他条件动态生成菜单项
const renderMenuItems = () => {
const menuItems = [];
// if (!useDefault) return;
// 对于非开始和结束节点,添加基本操作
if (!['start', 'end'].includes(node?.type)) {
if (!['AND', 'OR', 'JSON2STR', 'STR2JSON', 'IMAGE', 'RESULT', 'LOOP_START'].includes(node.data.type as string)) {
menuItems.push(
<Menu.Item key="edit" onClick={handleEdit}>
</Menu.Item>
);
}
menuItems.push(
<Menu.Item key="copy" onClick={handleCopy}>
</Menu.Item>
);
menuItems.push(
<Menu.Item key="delete" onClick={handleDelete}>
</Menu.Item>
);
}
// 可以根据节点类型添加特定的操作
if (node?.type === 'special') {
menuItems.push(
<Menu.Item key="special-action">
</Menu.Item>
);
}
return menuItems;
};
return (
<Menu>
<Menu.Item key="edit" onClick={handleEdit}>
</Menu.Item>
{(!['start', 'end'].includes(node?.type)) && (
<>
<Menu.Item key="copy" onClick={handleCopy}>
</Menu.Item>
<Menu.Item key="delete" onClick={handleDelete}>
</Menu.Item>
</>
)}
{renderMenuItems()}
</Menu>
);
};

Loading…
Cancel
Save