From 14d118ba3e0ce9209e38f5a57532aba8d732f848 Mon Sep 17 00:00:00 2001
From: wisonic-s <shaochuan.wu@fit2cloud.com>
Date: Thu, 21 Dec 2023 15:24:42 +0800
Subject: [PATCH] =?UTF-8?q?fix(=E8=A7=86=E5=9B=BE-=E8=A1=A8=E6=A0=BC):=20?=
 =?UTF-8?q?=E4=BF=AE=E5=A4=8D=20Echarts=20=E8=A1=A8=E6=A0=BC=E5=86=BB?=
 =?UTF-8?q?=E7=BB=93=E5=88=97=E5=90=8E=E6=A0=B7=E5=BC=8F=E5=BC=82=E5=B8=B8?=
 =?UTF-8?q?=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../chart/components/table/TableNormal.vue    | 30 ++++++++-----------
 1 file changed, 12 insertions(+), 18 deletions(-)

diff --git a/core/frontend/src/views/chart/components/table/TableNormal.vue b/core/frontend/src/views/chart/components/table/TableNormal.vue
index 5e08ec6a6a..7b3859a247 100644
--- a/core/frontend/src/views/chart/components/table/TableNormal.vue
+++ b/core/frontend/src/views/chart/components/table/TableNormal.vue
@@ -239,7 +239,11 @@ export default {
     tableStyle() {
       return {
         width: '100%',
-        '--scroll-bar-color': this.scrollBarColor
+        '--scroll-bar-color': this.scrollBarColor,
+        '--footer-font-color': this.table_header_class.color,
+        '--footer-bg-color': this.table_header_class.background,
+        '--footer-font-size': this.table_header_class.fontSize,
+        '--footer-height': this.table_header_class.height
       }
     },
     ...mapState([
@@ -441,16 +445,14 @@ export default {
           this.table_item_class.fontSize = customAttr.size.tableItemFontSize + 'px'
           this.table_header_class.height = customAttr.size.tableTitleHeight + 'px'
           this.table_item_class.height = customAttr.size.tableItemHeight + 'px'
-
           const visibleColumn = this.$refs.plxTable.getTableColumn().fullColumn
           for (let i = 0, column = visibleColumn[i]; i < visibleColumn.length; i++) {
-            // 有变更才刷新
             if (column.type === 'index' && column.visible !== customAttr.size.showIndex) {
               column.visible = customAttr.size.showIndex
-              this.$refs.plxTable.refreshColumn()
               break
             }
           }
+          this.$refs.plxTable.refreshColumn()
           if (!customAttr.size.indexLabel) {
             this.indexLabel = ' '
           } else {
@@ -506,20 +508,6 @@ export default {
           this.bg_class.background = hexColorToRGBA(customStyle.background.color, customStyle.background.alpha)
         }
       }
-      // 修改footer合计样式
-      const table = document.getElementsByClassName(this.chart.id)
-      this.$refs.plxTable.updateFooter().then(() => {
-        for (let i = 0; i < table.length; i++) {
-          const s_table = table[i].getElementsByClassName('elx-table--footer')
-          let s = ''
-          for (const i in this.table_header_class) {
-            s += (i === 'fontSize' ? 'font-size' : i) + ':' + this.table_header_class[i] + ';'
-          }
-          for (let i = 0; i < s_table.length; i++) {
-            s_table[i].setAttribute('style', s)
-          }
-        }
-      })
     },
     getRowStyle({ row, rowIndex }) {
       if (rowIndex % 2 !== 0) {
@@ -828,6 +816,12 @@ export default {
     text-overflow: var(--text-overflow, 'ellipsis');
     white-space: var(--white-space, 'nowrap');
   }
+  ::v-deep .elx-table--footer {
+    color: var(--footer-font-color);
+    background: var(--footer-bg-color);
+    font-size: var(--footer-font-size);
+    height: var(--footer-height);
+  }
 }
 
 </style>