From c30f6e642a9d70858cd5013904fad226e8e8657d Mon Sep 17 00:00:00 2001
From: hyx <hanyuxia@iie.ac.cn>
Date: Wed, 16 Nov 2022 16:59:52 +0800
Subject: [PATCH] =?UTF-8?q?CN-799=20=E9=83=A8=E5=88=86=E6=8E=A5=E5=8F=A3pa?=
 =?UTF-8?q?ram=E5=8F=82=E6=95=B0=E5=86=85=E5=AE=B9=E6=9C=AC=E8=BA=AB?=
 =?UTF-8?q?=E5=B8=A6=E9=80=97=E5=8F=B7=E6=97=B6=E6=9F=A5=E8=AF=A2=E4=B8=8D?=
 =?UTF-8?q?=E5=87=86=E7=A1=AE=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/layout/Header.vue              |  5 +-
 src/utils/constants.js                        | 48 +++++++++++++++++++
 .../networkOverview/NetworkOverviewTabs.vue   | 14 ++++--
 3 files changed, 59 insertions(+), 8 deletions(-)

diff --git a/src/components/layout/Header.vue b/src/components/layout/Header.vue
index ebdf3496..b502d0c9 100644
--- a/src/components/layout/Header.vue
+++ b/src/components/layout/Header.vue
@@ -510,13 +510,10 @@ export default {
       }
       this.curTabProp = this.$route.query.dimensionType ? this.$route.query.dimensionType : null
       document.getElementById('breadcrumbValue').innerText = value
-      // document.getElementById('breadcrumbButton').setAttribute('title', valName)
       document.getElementById(this.valueMenuId).setAttribute('title', valName)
       document.getElementById('breadcrumbButton').click()
-      // const columnName = this.$store.getters.getBreadcrumbColumnName
       const columnName = this.getUrlParam(this.curTabState.thirdMenu, '')
-      // const tabObjGroup = networkOverviewTabList.filter(item => item.label == columnName)
-      const curTab = this.getCurTabByLabel()
+      const curTab = this.getCurTabByLabel(columnName)
       if (curTab) {
         const queryCondition = []
         const searchProps = curTab.dillDownProp
diff --git a/src/utils/constants.js b/src/utils/constants.js
index 1b005413..a3812342 100644
--- a/src/utils/constants.js
+++ b/src/utils/constants.js
@@ -748,6 +748,22 @@ export const networkOverviewTabList = [
     checked: false,
     disabled: false,
     panelId: drillDownPanelTypeMapping.networkOverview
+  }, {
+    label: 'network.clientAsns',
+    prop: 'clientAsn',
+    queryCycleTotalProp: 'clientAsns',
+    dillDownProp: ['client_asn'],
+    checked: false,
+    disabled: false,
+    panelId: drillDownPanelTypeMapping.networkOverview
+  }, {
+    label: 'network.serverAsns',
+    prop: 'serverAsn',
+    queryCycleTotalProp: 'serverAsns',
+    dillDownProp: ['server_asn'],
+    checked: false,
+    disabled: false,
+    panelId: drillDownPanelTypeMapping.networkOverview
   }
 ]
 
@@ -976,6 +992,22 @@ export const networkAppPerformanceTabList = [
     checked: false,
     disabled: false,
     panelId: drillDownPanelTypeMapping.npmOverviewCommon
+  }, {
+    label: 'network.clientAsns',
+    prop: 'clientAsn',
+    queryCycleTotalProp: 'clientAsns',
+    dillDownProp: ['client_asn'],
+    checked: false,
+    disabled: false,
+    panelId: drillDownPanelTypeMapping.npmOverviewCommon
+  }, {
+    label: 'network.serverAsns',
+    prop: 'serverAsn',
+    queryCycleTotalProp: 'serverAsns',
+    dillDownProp: ['server_asn'],
+    checked: false,
+    disabled: false,
+    panelId: drillDownPanelTypeMapping.npmOverviewCommon
   }
 ]
 export const linkMonitorTabList = [
@@ -1203,6 +1235,22 @@ export const linkMonitorTabList = [
     checked: false,
     disabled: false,
     panelId: drillDownPanelTypeMapping.linkMonitor
+  }, {
+    label: 'network.clientAsns',
+    prop: 'clientAsn',
+    queryCycleTotalProp: 'clientAsns',
+    dillDownProp: ['client_asn'],
+    checked: false,
+    disabled: false,
+    panelId: drillDownPanelTypeMapping.linkMonitor
+  }, {
+    label: 'network.serverAsns',
+    prop: 'serverAsn',
+    queryCycleTotalProp: 'serverAsns',
+    dillDownProp: ['server_asn'],
+    checked: false,
+    disabled: false,
+    panelId: drillDownPanelTypeMapping.linkMonitor
   }
 ]
 export const dnsServiceInsightsTabList = [
diff --git a/src/views/charts2/charts/networkOverview/NetworkOverviewTabs.vue b/src/views/charts2/charts/networkOverview/NetworkOverviewTabs.vue
index 2c6a21bd..a82f9f8b 100644
--- a/src/views/charts2/charts/networkOverview/NetworkOverviewTabs.vue
+++ b/src/views/charts2/charts/networkOverview/NetworkOverviewTabs.vue
@@ -613,8 +613,14 @@ export default {
         endTime: getSecond(this.timeFilter.endTime)
       }
       if (tabList.length > 0) {
-        const conditionStr = tabList.filter(item => item != '')
-        queryParams.params = conditionStr.toString().replaceAll("'", "\\\\'")
+        let conditionGroup = tabList.filter(item => item != '')
+        let conditionHandleRlt = []
+        conditionGroup.forEach(condition => {
+          condition = condition.replaceAll("'", "\\\\'")
+          condition = "'"+condition+ "'"
+          conditionHandleRlt.push(condition)
+        })
+        queryParams.params = conditionHandleRlt.join(",")
         queryParams.type = curTab.prop
       }
 
@@ -1079,7 +1085,7 @@ export default {
       } else {
         if (tab.queryCondition) {
           tab.queryCondition.forEach(item => {
-            queryCondition.push(item.replace('$param', value))
+            queryCondition.push(item.replaceAll('$param', value))
           })
         } else {
           if (tab.dillDownProp) {
@@ -1237,7 +1243,7 @@ export default {
       } else {
         if (curTab.queryCondition) {
           curTab.queryCondition.forEach(item => {
-            queryCondition.push(item.replace('$param', columnValue))
+            queryCondition.push(item.replaceAll('$param', columnValue))
           })
         } else {
           if (curTab.dillDownProp) {