From 67e2b3851ced6c53c21f6b375adb5ce46bf321aa Mon Sep 17 00:00:00 2001
From: jiangchu <jiangchu.wzy@antgroup.com>
Date: Mon, 23 Oct 2023 12:08:45 +0800
Subject: [PATCH] =?UTF-8?q?:sparkles:=20feat:=20edge=20=E5=B1=95=E7=A4=BAl?=
 =?UTF-8?q?evel=E5=8C=BA=E5=88=86=E4=BC=98=E5=85=88=E7=BA=A7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/ProFlow/demos/ProFlowDemo.tsx |  4 +--
 src/ProFlow/helper.tsx            | 48 ++++++++++++++++++++++++-------
 2 files changed, 39 insertions(+), 13 deletions(-)

diff --git a/src/ProFlow/demos/ProFlowDemo.tsx b/src/ProFlow/demos/ProFlowDemo.tsx
index d2e34f2..875d52e 100644
--- a/src/ProFlow/demos/ProFlowDemo.tsx
+++ b/src/ProFlow/demos/ProFlowDemo.tsx
@@ -124,7 +124,7 @@ const nodes: ProFlowNode[] = [
   {
     id: 'd1',
     group: true,
-    select: NodeSelect.WARNING,
+    select: NodeSelect.SUB_SELECT,
     label: '456',
     data: [
       {
@@ -198,7 +198,7 @@ const edges = [
   {
     id: 'a1-b1',
     source: 'a1',
-    select: NodeSelect.WARNING,
+    select: NodeSelect.SUB_WARNING,
     target: 'b1',
     type: EdgeType.default,
   },
diff --git a/src/ProFlow/helper.tsx b/src/ProFlow/helper.tsx
index d50ca0d..78f98d9 100644
--- a/src/ProFlow/helper.tsx
+++ b/src/ProFlow/helper.tsx
@@ -115,18 +115,44 @@ function getEdgeClsFromNodeSelect(select: NodeSelect) {
   }
 }
 
+function getEdgeLevel(select: NodeSelect) {
+  switch (select) {
+    case NodeSelect.SELECT:
+      return 6;
+    case NodeSelect.SUB_SELECT:
+      return 5;
+    case NodeSelect.DANGER:
+      return 4;
+    case NodeSelect.SUB_DANGER:
+      return 3;
+    case NodeSelect.WARNING:
+      return 2;
+    case NodeSelect.SUB_WARNING:
+      return 1;
+    default:
+      return 0;
+  }
+}
+
 export function getRenderEdges(edges: ProFlowEdge[]) {
-  return edges.map((edge) => {
-    const { source, target, select = NodeSelect.DEFAULT } = edge;
-
-    return {
-      id: `${source}-${target}`,
-      source,
-      target,
-      type: 'radiusEdge',
-      className: getEdgeClsFromNodeSelect(select),
-    };
-  });
+  console.log(edges);
+  return edges
+    .sort((a, b) => {
+      const aLevel = a.select ? getEdgeLevel(a.select) : 0;
+      const bLevel = b.select ? getEdgeLevel(b.select) : 0;
+      return aLevel - bLevel;
+    })
+    .map((edge) => {
+      const { source, target, select = NodeSelect.DEFAULT } = edge;
+
+      return {
+        id: `${source}-${target}`,
+        source,
+        target,
+        type: 'radiusEdge',
+        className: getEdgeClsFromNodeSelect(select),
+      };
+    });
 }
 
 export const getRenderData = (