fix(体系搜索): 监听窗口改变重新渲染

src/pages/regulatoryRepository/systemSearch/index.vue

@@ -1,18 +1,20 @@
 <template>
   <div class="root">
-    <div id="mountNode" ref="mountNode"></div>
+    <div id="mountNode" ref="mountNode" />
-    <DialogTable ref="DialogTableRef"></DialogTable>
+    <DialogTable ref="DialogTableRef" />
-    <loading :loading="loading">加载中...</loading>
+    <loading :loading="loading">
+      加载中...
+    </loading>
   </div>
 </template>
 
 <script>
 import G6 from '@antv/g6';
 
-import DialogTable from "./components/DialogTable";
+import DialogTable from './components/DialogTable';
 
 export default {
-  name: "systemSearch",
+  name: 'SystemSearch',
   components: {
     DialogTable
   },
@@ -194,7 +196,6 @@ export default {
         'polyline',
       );
 
-
       const graph = new G6.TreeGraph({
         container: 'mountNode', // String | HTMLElement，必须，在 Step 1 中创建的容器 id 或容器本身
         width: this.$refs.mountNode.scrollWidth, // Number，必须，图的宽度
@@ -315,10 +316,20 @@ export default {
       // graph.fitView()
       graph.fitCenter()
       // graph.focusItem(this.data.id)
+      // 添加事件监听
       this.initGraphEvent(graph)
+      // 监听窗口尺寸变化
+      window.addEventListener('resize', () => {
+        // 获取新的窗口尺寸
+        const newWidth = this.$refs.mountNode.offsetWidth;
+        const newHeight = this.$refs.mountNode.offsetHeight
+
+        // 更新 G6 图表的尺寸
+        graph.changeSize(newWidth, newHeight);
+      });
     },
     setCollapse () {
-      G6.Util.traverseTree(this.data, function (item) {
+      G6.Util.traverseTree(this.data, (item) => {
         if (item.level >= 2) {
           // collapsed为true时默认收起
           item.collapsed = true