From aebf5291c6f2b8c0f00fdaa53d9218999cc3e62e Mon Sep 17 00:00:00 2001
From: qin_jun_yan <qinjunyan1@huawei.com>
Date: Tue, 2 Jun 2020 16:44:18 +0800
Subject: [PATCH] Modify the operation to change the page size, after clicking
 the unhide button, the width and height of the echart diagram are not set
 correctly

---
 .../ui/src/views/train-manage/data-traceback.vue | 16 ++++++++++++++--
 .../src/views/train-manage/model-traceback.vue   |  5 ++++-
 2 files changed, 18 insertions(+), 3 deletions(-)

diff --git a/mindinsight/ui/src/views/train-manage/data-traceback.vue b/mindinsight/ui/src/views/train-manage/data-traceback.vue
index 2bf0f44..2b62566 100644
--- a/mindinsight/ui/src/views/train-manage/data-traceback.vue
+++ b/mindinsight/ui/src/views/train-manage/data-traceback.vue
@@ -811,6 +811,9 @@ export default {
     unhideRecords() {
       this.showEchartPic = true;
       this.$refs.table.clearSelection();
+      if (this.parallelEchart) {
+        this.parallelEchart.clear();
+      }
       this.$store.commit('setHidenDirChecked', []);
       if (this.hidenDirChecked.length) {
         this.checkedSummary = [];
@@ -1421,8 +1424,11 @@ export default {
                   this.echart.showData = this.echart.brushData;
                   this.showEchartPic = true;
                 }
+                this.resizeChart();
                 this.setEchartValue();
-                this.initChart();
+                this.$nextTick(() => {
+                  this.initChart();
+                });
                 // Total number of pages in the table
                 this.pagination.total = res.data.count;
                 // Data encapsulation of the table
@@ -1469,7 +1475,13 @@ export default {
      *  The window size changes. Resizing Chart
      */
     resizeChart() {
-      this.parallelEchart.resize();
+      if (
+        document.getElementById('data-echart') &&
+        document.getElementById('data-echart').style.display !== 'none' &&
+        this.parallelEchart
+      ) {
+        this.parallelEchart.resize();
+      }
     },
 
     /**
diff --git a/mindinsight/ui/src/views/train-manage/model-traceback.vue b/mindinsight/ui/src/views/train-manage/model-traceback.vue
index d9c92d4..a2cf2e5 100644
--- a/mindinsight/ui/src/views/train-manage/model-traceback.vue
+++ b/mindinsight/ui/src/views/train-manage/model-traceback.vue
@@ -1386,7 +1386,10 @@ export default {
               this.echart.allData = list;
               this.echart.brushData = list;
               this.echart.showData = this.echart.brushData;
-              this.initChart();
+              this.$nextTick(() => {
+                this.resizeChart();
+                this.initChart();
+              });
               const showList = list.slice(
                   (this.pagination.currentPage - 1) * this.pagination.pageSize,
                   this.pagination.currentPage * this.pagination.pageSize,
-- 
GitLab