From 735e7c51ba9a492b525ec3da698e4f13780aae80 Mon Sep 17 00:00:00 2001
From: wangwenrui <wangwenrui@zdjizhi.com>
Date: Thu, 20 Aug 2020 16:19:09 +0800
Subject: [PATCH] =?UTF-8?q?fix:=E4=BF=AE=E5=A4=8D=E5=9B=BE=E8=A1=A8resize?=
 =?UTF-8?q?=E9=A1=B5=E9=9D=A2=E5=8D=A1=E6=AD=BB=E7=9A=84=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/common/js/tools.js         | 22 ++++++++++++-------
 1 file changed, 14 insertions(+), 8 deletions(-)

diff --git a/nezha-fronted/src/components/common/js/tools.js b/nezha-fronted/src/components/common/js/tools.js
index 23c7b18a9..2f5bf3bef 100644
--- a/nezha-fronted/src/components/common/js/tools.js
+++ b/nezha-fronted/src/components/common/js/tools.js
@@ -368,6 +368,7 @@ export const chartResizeTool = {
   containerBlankWidth: 25, //容器空白占位宽度（#listContainer的padding）
   titleHeight: 28, //标题dom高度
   stepHeight: 50, //单元高度
+  timeouter:null,
   stepWidth(containerWidth) { //单元宽度，参数为容器总宽度
     return (containerWidth-this.containerBlankWidth)/12;
   },
@@ -379,6 +380,7 @@ export const chartResizeTool = {
     return height-this.chartBlankHeight;
   },
   start(vm, originalData, event) {
+    let $self=this;
     let data = JSON.parse(JSON.stringify(originalData)); //将初始对象复制，后续操作使用复制对象
     let shadow = vm.$refs.resizeShadow; //缩放时底部阴影dom
     if (!shadow) {
@@ -472,15 +474,19 @@ export const chartResizeTool = {
       }
 
       if (widthChange || heightChange) {
-        //step时chart重绘
-        if (box.classList.contains("resize-box-echarts")) { //echarts类型
-          vm.echartStore.resize({width: shadow.offsetWidth-16, height: shadow.offsetHeight-titleHeight-vm.$refs.legendArea.offsetHeight});
-        }
+        clearTimeout($self.timeouter)
+        $self.timeouter=setTimeout(()=>{
+          //step时chart重绘
+          if (box.classList.contains("resize-box-echarts")) { //echarts类型
+            vm.echartStore.resize({width: shadow.offsetWidth-16, height: shadow.offsetHeight-titleHeight-vm.$refs.legendArea.offsetHeight});
+          }
+        },500)
         //chart外层宽高调整
         let outerBox = document.getElementById(`chart-${data.id}`);
         outerBox.style.height = `${shadow.offsetHeight+chartPaddingTop}px`;
         outerBox.style.width = `${parseFloat(shadow.style.width.split("px")[0])+chartBlankWidth}px`;
       }
+
     }
   }
 };
@@ -556,7 +562,7 @@ export const tableSet = {
           case 'principal': return 'su.username';
           default : return prop;
         }
-        
+
       case 'alertMessage':
         switch(prop){
           case 'id': return'am.id';
@@ -567,7 +573,7 @@ export const tableSet = {
           case 'endAt': return'am.end_at';
           default : return prop;
         }
-        
+
       case 'project':
         switch(prop){
         case 'id': return'e.id';
@@ -579,7 +585,7 @@ export const tableSet = {
         // case 'path': return'e.path';
         default : return prop;
       }
-      
+
       case 'dc':
         switch(prop){
           case 'id': return'i.id';
@@ -587,7 +593,7 @@ export const tableSet = {
           case 'area': return'sa.name';
           default : return prop;
         }
-        
+
       case 'endpointTab':
         switch(prop){
           case 'id': return'e.id';