Merge branch 'develop' of http://117.78.60.236:8000/csbr-daop/fe-data-asset-management into develop

@@ -82,7 +82,7 @@ watch(() => props.treeData, (val) => {
 
 const renderGraph = (graph: any, lineageData: any) => {
   if (!graph || !lineageData) return;
-  graph.setMinZoom(0.7);
+  graph.setMinZoom(1);
   graph.setMaxZoom(1);
   graph.data(lineageData);
   graph.render();
@@ -230,7 +230,7 @@ const initGraph = () => {
     container: container,
     width,
     height,
-   // animate: false,
+    // animate: false,
     plugins: [contextMenu, tooltip.value],
     fitCenter: true,
     fitView: true,
@@ -247,6 +247,11 @@ const initGraph = () => {
             }
             const data = item.getModel();
             data.collapsed = collapsed;
+            setTimeout(() => {
+              graph.focusItem(item, true, {
+                duration: 400 // 动画时长为500ms
+              });
+            }, 500)
             return true;
           },
           shouldBegin: (e) => {
@@ -260,7 +265,7 @@ const initGraph = () => {
       ],
     },
     defaultNode: {
-      size: 24,
+      size: 20,
       anchorPoints: [
         [0, 0.5],
         [1, 0.5],
@@ -287,7 +292,7 @@ const initGraph = () => {
         return 16;
       },
       getVGap: function getVGap() {
-        return 25;
+        return 15;
       },
       getHGap: function getHGap() {
         return 120;
@@ -301,7 +306,7 @@ const initGraph = () => {
       label: handleLabelLength((node.isField ? node.metaStandardId : node.standardName) as string),
       collapsed: node.children?.length ? false : true,
       labelCfg: {
-        offset: 10,
+        offset: 7,
         style: {
           fontSize: 13,
           fill: '#212121',
@@ -364,7 +369,7 @@ const observeResize = () => {
           return;
         }
         graphRef.value.changeSize(width, height);
-        graphRef.value.setMinZoom(0.7);
+        graphRef.value.setMinZoom(1);
         graphRef.value.setMaxZoom(1);
         graphRef.value.fitView(40, { direction: 'both' });
         graphRef.value.fitCenter();
@@ -380,7 +385,7 @@ const observeResize = () => {
       return;
     }
     graphRef.value.changeSize(width, height);
-    graphRef.value.setMinZoom(0.7);
+    graphRef.value.setMinZoom(1);
     graphRef.value.setMaxZoom(1);
     graphRef.value.fitView(40, { direction: 'both' });
     graphRef.value.fitCenter();
@@ -472,7 +477,9 @@ const bindEvents = () => {
         }
       });
       lastSelectNode.value = item;
-      detailInfo.value.guid = model.guid;
+      detailInfo.value = {};
+      //   detailInfo.value.guid = model.guid;
+      detailInfoLabel.value = model.label || {};
       updateTooltipPosition(evt);
 
       detailLoading.value = true;
@@ -600,7 +607,7 @@ defineExpose({
   overflow-y: auto;
 
   .title {
-    font-size: 16px;
+    font-size: 14px;
     color: #212121;
     line-height: 24px;
     font-weight: 600;
@@ -608,7 +615,7 @@ defineExpose({
 
   .row {
     margin-top: 8px;
-    font-size: 14px;
+    font-size: 12px;
     color: #666666;
     word-break: break-all;
     line-height: 21px;

@@ -78,6 +78,7 @@ const sankeyInstance: any = ref();
 const containerRef = ref();
 
 const setChartsOption = () => {
+
   let option = {
     tooltip: {
       trigger: 'item',
@@ -85,19 +86,33 @@ const setChartsOption = () => {
         if (params.data.name) {
           return null;
         }
-        return params.data.source + '     -->     ' + params.data.target
+        return params.data.source + '      >      ' + params.data.target
       }
     },
     color: ["#3DBCBE", "#6b67d1", "#7BBCE0", "#2B8EF3", "#51dca2", "#E19D46"],
     series: [
       {
         type: 'sankey',
-        top: 80,
-        bottom: 40,
+        top: 60,
+        bottom: 20,
         draggable: false,
-        left: 40,
-        right: 80,
-        data: props.names,
+        left: 50,
+        right: 100,
+        label: {
+          fontSize: 10,
+        },
+        data: props.names?.map(n => {
+          if (n.isLast) {
+            return {
+              ...n,
+              label: {
+                width: 97,
+                overflow: 'breakAll'
+              }
+            }
+          }
+          return n;
+        }),
         links: props.treeData,
         lineStyle: {
           color: 'source',
@@ -113,10 +128,9 @@ const setChartsOption = () => {
 const resizeObserver = ref();
 
 const observeResize = () => {
-  resizeObserver.value = new ResizeObserver(() => {
+  window.addEventListener('resize', (e) => {
     sankeyInstance.value?.resize();
   });
-  resizeObserver.value.observe(containerRef.value);
 }
 
 onMounted(() => {

@@ -7,8 +7,8 @@
     <div className='g6-component-topbar'>
       <graphTopbar ref="topBarRef" @displaySwitchChange="displaySwitchChange" :isGraphDisplay="isGraphDisplay" />
     </div>
-    <RelationNetwork v-show="graphTreeData?.guid && isGraphDisplay" ref="relationNetworkRef" :tree-data="graphTreeData" :noContextMenu="true"
-      @nodeItemClick="handleNodeItemClick">
+    <RelationNetwork v-show="graphTreeData?.guid && isGraphDisplay" ref="relationNetworkRef" :tree-data="graphTreeData"
+      :noContextMenu="true" @nodeItemClick="handleNodeItemClick">
     </RelationNetwork>
     <Sankey v-show="!isGraphDisplay && (sankeyNames?.length || sankeyDataLoading)" v-loading="sankeyDataLoading"
       :tree-data="sankeyData" :names="sankeyNames">
@@ -112,8 +112,8 @@ const handleNodeItemClick = (graph, nodeItem) => {
       nodeItem.getModel().collapsed = false;
       parentData.collapsed = false;
       graph.updateItem(nodeItem, {
-          ...nodeItem.getModel(),
-          collapsed: false
+        ...nodeItem.getModel(),
+        collapsed: false
       });
       graph.layout();
       setTimeout(() => {
@@ -128,6 +128,9 @@ const handleNodeItemClick = (graph, nodeItem) => {
         graph.layout();
         graph.setMinZoom(0.5);
         graph.setMaxZoom(5);
+            graph.focusItem(nodeItem, true, {
+    duration: 400 // 动画时长为500ms
+  });
       }, 500);
     } else {
       parentData.isLoading = false;
@@ -144,20 +147,20 @@ onBeforeMount(() => {
       const data = res.data || [];
       let resultData = data?.[0] || {};
       if (!resultData?.children?.length && resultData.isHaveData == 'Y') {
-         graphDataLoading.value = true;
-  getMetaStandardField(resultData.guid).then((res: any) => {
-    graphDataLoading.value = false;
-    if (res?.code == proxy.$passCode) {
-      resultData.children = res.data || [];
-      graphTreeData.value = resultData;
+        graphDataLoading.value = true;
+        getMetaStandardField(resultData.guid).then((res: any) => {
+          graphDataLoading.value = false;
+          if (res?.code == proxy.$passCode) {
+            resultData.children = res.data || [];
+            graphTreeData.value = resultData;
+          } else {
+            graphTreeData.value = resultData;
+            ElMessage.error(res.msg);
+          }
+        });
       } else {
         graphTreeData.value = resultData;
-      ElMessage.error(res.msg);
-    }
-      });
-    } else {
-      graphTreeData.value = resultData;
-    }
+      }
     } else {
       ElMessage.error(res.msg);
     }

@@ -204,6 +204,9 @@ const handleNodeItemClick = (graph, nodeItem) => {
         graph.layout();
         graph.setMinZoom(0.5);
         graph.setMaxZoom(5);
+        graph.focusItem(nodeItem, true, {
+    duration: 500 // 动画时长为500ms
+  });
       }, 500);
     } else {
       parentData.isLoading = false;