From f8bedc12094be3c0712bbe0cb7f35aeb68d78529 Mon Sep 17 00:00:00 2001 From: heheer Date: Tue, 30 Dec 2025 21:22:03 +0800 Subject: [PATCH] fix: workflow fixview padding & context menu position (#6169) --- packages/web/components/common/Icon/constants.ts | 2 +- .../icons/core/modules/{fixview.svg => fitView.svg} | 0 .../app/detail/Workflow/components/SearchButton.tsx | 2 +- .../Flow/components/ContextMenu.tsx | 11 +++++------ .../Flow/components/FlowController.tsx | 4 ++-- .../WorkflowComponents/Flow/hooks/useWorkflow.tsx | 2 +- .../app/detail/WorkflowComponents/Flow/index.tsx | 1 + .../Flow/nodes/render/NodeCard.tsx | 3 +-- .../context/workflowUtilsContext.tsx | 12 +----------- 9 files changed, 13 insertions(+), 24 deletions(-) rename packages/web/components/common/Icon/icons/core/modules/{fixview.svg => fitView.svg} (100%) diff --git a/packages/web/components/common/Icon/constants.ts b/packages/web/components/common/Icon/constants.ts index b65a8008ff..9d37bfeeb3 100644 --- a/packages/web/components/common/Icon/constants.ts +++ b/packages/web/components/common/Icon/constants.ts @@ -262,7 +262,7 @@ export const iconPaths = { 'core/dataset/yuqueDatasetColor': () => import('./icons/core/dataset/yuqueDatasetColor.svg'), 'core/dataset/yuqueDatasetOutline': () => import('./icons/core/dataset/yuqueDatasetOutline.svg'), 'core/modules/basicNode': () => import('./icons/core/modules/basicNode.svg'), - 'core/modules/fixview': () => import('./icons/core/modules/fixview.svg'), + 'core/modules/fitView': () => import('./icons/core/modules/fitView.svg'), 'core/modules/flowLight': () => import('./icons/core/modules/flowLight.svg'), 'core/modules/previewLight': () => import('./icons/core/modules/previewLight.svg'), 'core/modules/systemPlugin': () => import('./icons/core/modules/systemPlugin.svg'), diff --git a/packages/web/components/common/Icon/icons/core/modules/fixview.svg b/packages/web/components/common/Icon/icons/core/modules/fitView.svg similarity index 100% rename from packages/web/components/common/Icon/icons/core/modules/fixview.svg rename to packages/web/components/common/Icon/icons/core/modules/fitView.svg diff --git a/projects/app/src/pageComponents/app/detail/Workflow/components/SearchButton.tsx b/projects/app/src/pageComponents/app/detail/Workflow/components/SearchButton.tsx index a9a4118877..eb03653c79 100644 --- a/projects/app/src/pageComponents/app/detail/Workflow/components/SearchButton.tsx +++ b/projects/app/src/pageComponents/app/detail/Workflow/components/SearchButton.tsx @@ -64,7 +64,7 @@ const SearchButton = (props: ButtonProps) => { const searchedNode = searchResult[searchIndex] ?? searchResult[0]; if (searchedNode) { - fitView({ nodes: [searchedNode], padding: 0.4 }); + fitView({ nodes: [searchedNode], padding: 0.6 }); } return nodes.map((node) => ({ diff --git a/projects/app/src/pageComponents/app/detail/WorkflowComponents/Flow/components/ContextMenu.tsx b/projects/app/src/pageComponents/app/detail/WorkflowComponents/Flow/components/ContextMenu.tsx index d70073c518..986681526a 100644 --- a/projects/app/src/pageComponents/app/detail/WorkflowComponents/Flow/components/ContextMenu.tsx +++ b/projects/app/src/pageComponents/app/detail/WorkflowComponents/Flow/components/ContextMenu.tsx @@ -226,7 +226,7 @@ const ContextMenu = () => { }); setTimeout(() => { - fitView(); + fitView({ padding: 0.3 }); }); }, [fitView, getParentNodeSizeAndPosition, setEdges, setNodes]); @@ -302,9 +302,9 @@ const ContextMenu = () => { ); return ( - + { borderLeft="6px solid transparent" borderRight="6px solid transparent" borderBottom="6px solid white" - zIndex={2} + zIndex={10} filter="drop-shadow(0px -1px 2px rgba(0, 0, 0, 0.1))" /> fitView()} + onClick={() => fitView({ padding: 0.3 })} style={buttonStyle} className={`custom-workflow-fix_view ${styles.customControlButton}`} > - + diff --git a/projects/app/src/pageComponents/app/detail/WorkflowComponents/Flow/hooks/useWorkflow.tsx b/projects/app/src/pageComponents/app/detail/WorkflowComponents/Flow/hooks/useWorkflow.tsx index b9383f58a2..9a2f68bf3e 100644 --- a/projects/app/src/pageComponents/app/detail/WorkflowComponents/Flow/hooks/useWorkflow.tsx +++ b/projects/app/src/pageComponents/app/detail/WorkflowComponents/Flow/hooks/useWorkflow.tsx @@ -828,7 +828,7 @@ export const useWorkflow = () => { e.preventDefault(); setMenu({ - top: e.clientY - 64, + top: e.clientY + 6, left: e.clientX - 12 }); }, diff --git a/projects/app/src/pageComponents/app/detail/WorkflowComponents/Flow/index.tsx b/projects/app/src/pageComponents/app/detail/WorkflowComponents/Flow/index.tsx index c724087ec3..6ac9f13178 100644 --- a/projects/app/src/pageComponents/app/detail/WorkflowComponents/Flow/index.tsx +++ b/projects/app/src/pageComponents/app/detail/WorkflowComponents/Flow/index.tsx @@ -135,6 +135,7 @@ const Workflow = () => { { setTimeout(() => { fitView({ nodes: [{ id: nodeId }], - padding: 0.3, - duration: 300 + padding: 0.3 }); }, 100); }, [onChangeNode, setPresentationMode, fitView, nodeId]); diff --git a/projects/app/src/pageComponents/app/detail/WorkflowComponents/context/workflowUtilsContext.tsx b/projects/app/src/pageComponents/app/detail/WorkflowComponents/context/workflowUtilsContext.tsx index b8994e98a5..58c85a1565 100644 --- a/projects/app/src/pageComponents/app/detail/WorkflowComponents/context/workflowUtilsContext.tsx +++ b/projects/app/src/pageComponents/app/detail/WorkflowComponents/context/workflowUtilsContext.tsx @@ -196,19 +196,9 @@ export const WorkflowUtilsProvider = ({ children }: { children: ReactNode }) => // View move to the node that failed fitView({ nodes: nodes.filter((node) => checkResults.includes(node.data.nodeId)), - padding: 0.3, - duration: 300 + padding: 0.3 }); - setTimeout(() => { - const viewport = getViewport(); - setViewport({ - x: viewport.x, - y: viewport.y + 36, - zoom: viewport.zoom - }); - }, 300); - toast({ status: 'warning', title: t('common:core.workflow.Check Failed')