diff --git a/packages/xgen/components/edit/FlowBuilder/components/Canvas/index.tsx b/packages/xgen/components/edit/FlowBuilder/components/Canvas/index.tsx index 2cb55098..2a4a3a25 100644 --- a/packages/xgen/components/edit/FlowBuilder/components/Canvas/index.tsx +++ b/packages/xgen/components/edit/FlowBuilder/components/Canvas/index.tsx @@ -35,6 +35,7 @@ const Index = (props: IProps) => { value, nodes, setNodes, + setEdges, openPanel, setOpenPanel, showMask, @@ -63,6 +64,28 @@ const Index = (props: IProps) => { const hidePanel = () => { setOpenPanel(() => false) setShowMask(() => true) + + if (panelNode) { + setNodes((nodes) => { + return nodes.map((node) => { + if (node.id === panelNode.id) { + node.selected = false + } + return node + }) + }) + } + + if (panelEdge) { + setEdges((edges) => { + return edges.map((edge) => { + if (edge.id === panelEdge.id) { + edge.selected = false + } + return edge + }) + }) + } } const afterOpenChange = (open: boolean) => { diff --git a/packages/xgen/components/edit/FlowBuilder/components/Flow/Node/index.less b/packages/xgen/components/edit/FlowBuilder/components/Flow/Node/index.less index 02188a3a..b77681e9 100644 --- a/packages/xgen/components/edit/FlowBuilder/components/Flow/Node/index.less +++ b/packages/xgen/components/edit/FlowBuilder/components/Flow/Node/index.less @@ -8,6 +8,7 @@ text-overflow: ellipsis; white-space: nowrap; } + cursor: pointer; } } @@ -75,5 +76,12 @@ font-size: 12px; border-radius: 24px; background: var(--color_border_soft); + cursor: move; + } +} + +._type:hover { + :global { + background: var(--color_bg_menu); } } diff --git a/packages/xgen/components/edit/FlowBuilder/components/Flow/Node/index.tsx b/packages/xgen/components/edit/FlowBuilder/components/Flow/Node/index.tsx index 2e86fd6f..53d32097 100644 --- a/packages/xgen/components/edit/FlowBuilder/components/Flow/Node/index.tsx +++ b/packages/xgen/components/edit/FlowBuilder/components/Flow/Node/index.tsx @@ -17,7 +17,7 @@ type IProps = { } const CustomNode: FC = ({ id, data }: IProps) => { - const { onDelete, onAdd, onDuplicate, onSettingNode, running } = useBuilderContext() + const { onDelete, onAdd, onDuplicate, onSettingNode, running, setNodes } = useBuilderContext() data.showSourceHandle = data.showSourceHandle === undefined ? true : data.showSourceHandle data.showTargetHandle = data.showTargetHandle === undefined ? true : data.showTargetHandle @@ -41,7 +41,20 @@ const CustomNode: FC = ({ id, data }: IProps) => { onDuplicate(id)}> - onSettingNode(id)}> + { + setNodes((nodes) => { + return nodes.map((node) => { + if (node.id === id) { + node.selected = true + } + return node + }) + }) + onSettingNode(id) + }} + > @@ -63,7 +76,7 @@ const CustomNode: FC = ({ id, data }: IProps) => {
{data.error}
)} -
+
{data.icon && ( = ({ id, data }: IProps) => {
{data.typeLabel || data.type}
-
+
{ + event.stopPropagation() + setNodes((nodes) => { + return nodes.map((node) => { + if (node.id === id) { + node.selected = true + } + return node + }) + }) + onSettingNode(id) + }} + > {data.icon && data.running !== true && ( { return (
{ + if (!node.data) return node + node.dragHandle = '.item-drag-handle' + return node + })} edges={edges} onInit={setReactFlowInstance} onPaneClick={() => setHideContextMenu && setHideContextMenu(true)}