From 39dc0b8e403804ff9b335b7d399ffc4271373084 Mon Sep 17 00:00:00 2001
From: hyx <hanyuxia@iie.ac.cn>
Date: Tue, 6 Sep 2022 08:45:26 +0800
Subject: [PATCH] =?UTF-8?q?601=E8=A1=A8=E6=A0=BC=E6=8E=92=E5=BA=8F?=
 =?UTF-8?q?=E9=80=BB=E8=BE=91=E4=BF=AE=E6=94=B9=EF=BC=8C=E4=B8=94=E5=88=B7?=
 =?UTF-8?q?=E6=96=B0=E6=97=B6=EF=BC=8C=E8=A1=A8=E6=A0=BC=E5=8F=96=E6=B6=88?=
 =?UTF-8?q?=E6=8E=92=E5=BA=8F=E5=AD=97=E6=AE=B5=E7=9A=84=E9=AB=98=E4=BA=AE?=
 =?UTF-8?q?=E7=8A=B6=E6=80=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../networkOverview/NetworkOverviewTabs.vue   | 37 +++++++++++++++----
 1 file changed, 29 insertions(+), 8 deletions(-)

diff --git a/src/views/charts2/charts/networkOverview/NetworkOverviewTabs.vue b/src/views/charts2/charts/networkOverview/NetworkOverviewTabs.vue
index 2e8b9381..71597dd3 100644
--- a/src/views/charts2/charts/networkOverview/NetworkOverviewTabs.vue
+++ b/src/views/charts2/charts/networkOverview/NetworkOverviewTabs.vue
@@ -26,9 +26,9 @@
                   :header-cell-style="tableHeaderCellStyle"
                   :class="tableClass"
                   height="100%"
-                  :default-sort="{ prop: 'date', order: 'descending' }"
                   empty-text=" "
-                  @sort-change="sortChange"
+                  @sort-change="((column) => {sortChange(column,index)})"
+                  :key="index"
           >
             <template v-for="(item,index) in customTableTitles">
               <el-table-column
@@ -37,9 +37,10 @@
                       align="center"
                       :prop="item.prop"
                       class="data-column"
+                      :ref="item.prop"
               >
-                <template #header>
-                  <span class="data-column__span">{{$t(item.label)}}</span>
+                <template #header >
+                  <span class="data-column__span" >{{$t(item.label)}}</span>
                 </template>
                 <template  #default="scope" :column="item">
                   <template v-if="item.columnType === tableColumnType.chainRatio"  >
@@ -171,7 +172,7 @@ import { ref } from 'vue'
 import { operationType, unitTypes, networkTable, tableColumnType, networkDefaultLimit } from '@/utils/constants'
 import { get } from '@/utils/http'
 import unitConvert from '@/utils/unit-convert'
-import { getChainRatio, computeScore} from '@/utils/tools'
+import { getChainRatio, computeScore } from '@/utils/tools'
 import { getSecond } from '@/utils/date-util'
 import chartMixin from '@/views/charts2/chart-mixin'
 import ChartNoData from '@/views/charts/charts/ChartNoData'
@@ -221,7 +222,9 @@ export default {
       hasMetricSearch: true,
       activeTab: '',
       activeCustomize: '',
-      networkSearchUrl: {}
+      networkSearchUrl: {},
+      column: {},
+      index: 0
     }
   },
   props: {
@@ -281,6 +284,7 @@ export default {
   methods: {
     showMore () {
       this.showRecordNum = 50
+      this.sortChange(this.column, this.index)// 当前选中的tab？？？？
     },
     rowClass (row, column, rowIndex, columnIndex) {
       if (rowIndex === 49) {
@@ -301,7 +305,10 @@ export default {
       }
       return ['others', 999]
     },
-    sortChange (column) {
+    sortChange (column, index) {
+      this.index = index
+
+      this.column = column
       const arr = []
       this.tableData.slice(0, this.showRecordNum).forEach(val => {
         arr.push(val)
@@ -537,6 +544,21 @@ export default {
       })
     },
     initData () {
+      // 取消表格排序高亮的箭头
+      if (this.column.prop) {
+        const columns = this.$refs['dataTable_' + this.index]
+          ? (this.$refs['dataTable_' + this.index].$refs.tableHeader
+              ? this.$refs['dataTable_' + this.index].$refs.tableHeader.columns
+              : [])
+          : []
+        columns.forEach(item => {
+          item.order = ''
+        })
+        this.column = {}
+        this.index = 0
+      }
+
+      // 清除表格排序高亮的箭头
       const curTab = this.getCurTab()
       // 针对network overview – app list 点击标题触发下钻，相关内容处理
       const columnName = this.$store.getters.getBreadcrumbColumnName
@@ -719,7 +741,6 @@ export default {
                         item.scoreGroup = item.scoreGroup ? [...item.scoreGroup, 0] : [0]
                       }
                       if (scoreNum >= 5) {
-                        // self.tableData.forEach(data => {
                         let score = 0
                         item.scoreGroup.forEach(i => {
                           score = Number(score) + Number(i)