Merge pull request #835 from SuanmoSuanyangTechnology/feature/ui_upgrade_zy

Feature/UI upgrade zy

web/src/views/KnowledgeBase/[knowledgeBaseId]/CreateDataset.tsx

@@ -94,7 +94,7 @@ const CreateDataset = () => {
   const [processingMethod, setProcessingMethod] = useState<ProcessingMethod>('directBlock');
   const [parameterSettings, setParameterSettings] = useState<ParameterSettings>('defaultSettings');
   const [pdfEnhancementEnabled, setPdfEnhancementEnabled] = useState<boolean>(true);
-  const [pdfEnhancementMethod, setPdfEnhancementMethod] = useState<string>('deepdoc');
+  const [pdfEnhancementMethod, setPdfEnhancementMethod] = useState<string>('mineru');
   const fileType = ['pdf', 'doc', 'docx', 'xls', 'xlsx', 'csv', 'md', 'htm', 'html', 'json', 'ppt', 'pptx', 'txt','png','jpg','mp3','mp4','mov','wav']
   const steps = useMemo(
     () => [

web/src/views/Workflow/components/PortClickHandler.tsx

@@ -34,9 +34,12 @@ const PortClickHandler: React.FC<PortClickHandlerProps> = ({ graph }) => {
     };
 
     window.addEventListener('port:click', handlePortClick as EventListener);
+    const handleBlankClick = () => handlePopoverClose();
+    window.addEventListener('blank:click', handleBlankClick);
     
     return () => {
       window.removeEventListener('port:click', handlePortClick as EventListener);
+      window.removeEventListener('blank:click', handleBlankClick);
     };
   }, []);
 

web/src/views/Workflow/hooks/useWorkflowGraph.ts

@@ -294,7 +294,8 @@ export const useWorkflowGraph = ({
                   x: nodeWidth,
                   y: portItemArgsY + portItemArgsY,
                 },
-                id: 'ERROR', attrs: { text: { text: t('workflow.config.http-request.errorBranch'), ...portTextAttrs }}}
+                id: 'ERROR', attrs: { text: { text: t('workflow.config.http-request.errorBranch'), ...portTextAttrs } }
+              }
             ]
           };
         }
@@ -444,9 +445,17 @@ export const useWorkflowGraph = ({
       setTimeout(() => {
         if (graphRef.current) {
           graphRef.current.centerContent()
-          // graphRef.current.getNodes().forEach(node => node.toFront());
+          graphRef.current.getNodes().forEach(node => {
+            if (!node.getData()?.cycle) node.toFront();
+          });
           // Bring edges to front first, then child nodes above edges; parent nodes stay behind
-          graphRef.current.getEdges().forEach(edge => edge.toFront());
+          graphRef.current.getEdges().forEach(edge => {
+            const sourceCell = graphRef.current?.getCellById(edge.getSourceCellId());
+            const targetCell = graphRef.current?.getCellById(edge.getTargetCellId());
+            if (sourceCell?.getData()?.cycle || targetCell?.getData()?.cycle) {
+              edge.toFront();
+            }
+          });
           graphRef.current.getNodes().forEach(node => {
             if (node.getData()?.cycle) node.toFront();
           });
@@ -575,6 +584,7 @@ export const useWorkflowGraph = ({
     clearEdgeSelect();
     graphRef.current?.cleanSelection();
     setSelectedNode(null);
+    window.dispatchEvent(new CustomEvent('blank:click'));
   };
   /**
    * Handle canvas scale/zoom event
@@ -975,7 +985,6 @@ export const useWorkflowGraph = ({
       if (!port) return;
       const portData = node.getPort(port);
       if (portData?.group !== 'right') return;
-      node.toFront();
       node.setPortProp(port, 'attrs/body/opacity', 0);
       node.setPortProp(port, 'attrs/hoverBody/opacity', 1);
       node.setPortProp(port, 'attrs/label/opacity', 1);
@@ -1028,33 +1037,28 @@ export const useWorkflowGraph = ({
     graphRef.current.on('scale', scaleEvent);
     // Listen to node move event
     graphRef.current.on('node:moved', nodeMoved);
-    // When parent (isGroup) node position changes, move children with it
-    graphRef.current.on('node:change:position', ({ node, current, previous }: { node: Node; current: { x: number; y: number }; previous: { x: number; y: number } }) => {
 
-      if (!(node.getData()?.type === 'iteration' && node.getData()?.type === 'loop') || !current || !previous) return;
-
-      const dx = current.x - previous.x;
-      const dy = current.y - previous.y;
-      const parentId = node.getData()?.id || node.id;
-      graphRef.current?.getNodes().forEach(child => {
-        if (child.getData()?.cycle === parentId) {
-          const cp = child.getPosition();
-          child.setPosition(cp.x + dx, cp.y + dy, { silent: true });
-        }
-      });
-    });
     graphRef.current.on('node:removed', blankClick)
     // When edge connected, bring connected nodes' ports to front
-    graphRef.current.on('edge:connected', ({ isNew, edge }) => {
+    graphRef.current.on('edge:connected', ({ isNew }) => {
       // Bring edge to front first, then bring child nodes above edges
       // Parent (loop/iteration) nodes stay behind to avoid covering edges
-      edge.toFront();
-      graphRef.current?.getNodes().forEach(node => {
-        if (node.getData()?.cycle) node.toFront();
-      });
       // Reset any port hover state left from dragging
       if (isNew) {
         graphRef.current?.getNodes().forEach(node => {
+          if (!node.getData()?.cycle) node.toFront();
+        });
+        graphRef.current?.getEdges().forEach(edge => {
+          const sourceCell = graphRef.current?.getCellById(edge.getSourceCellId());
+          const targetCell = graphRef.current?.getCellById(edge.getTargetCellId());
+          if (sourceCell?.getData()?.cycle || targetCell?.getData()?.cycle) {
+            edge.toFront();
+          }
+        });
+        graphRef.current?.getNodes().forEach(node => {
+          graphRef.current?.getNodes().forEach(node => {
+            if (node.getData()?.cycle) node.toFront();
+          });
           node.getPorts().filter(p => p.group === 'right').forEach(p => {
             node.setPortProp(p.id!, 'attrs/body/opacity', 1);
             node.setPortProp(p.id!, 'attrs/hoverBody/opacity', 0);
@@ -1100,7 +1104,6 @@ export const useWorkflowGraph = ({
         // Enter new
         if (found) {
           const { node, portId } = found;
-          node.toFront();
           node.setPortProp(portId, 'attrs/body/opacity', 0);
           node.setPortProp(portId, 'attrs/hoverBody/opacity', 1);
           node.setPortProp(portId, 'attrs/label/opacity', 1);