From fd34f58b7b122146c401052597377c64aff462d8 Mon Sep 17 00:00:00 2001
From: changyongqiang <changyongqiang@geedgenetworks.com>
Date: Wed, 25 May 2022 14:52:30 +0800
Subject: [PATCH] =?UTF-8?q?CN-587=20feat:=20=E8=B0=83=E6=95=B4=E5=AE=9E?=
 =?UTF-8?q?=E4=BD=93detection=E5=88=97=E8=A1=A8=E6=97=A0=E6=95=B0=E6=8D=AE?=
 =?UTF-8?q?=E6=8F=90=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../css/components/views/charts/chart.scss    | 22 ++++++
 .../entityList/detail-overview.scss           | 10 +++
 src/views/charts/Chart.vue                    |  5 +-
 src/views/charts/PanelChart.vue               |  4 +-
 src/views/charts/PanelChartList.vue           |  3 +
 src/views/charts/charts/ChartNoData.vue       | 14 +++-
 src/views/charts/charts/ChartRelationShip.vue |  5 +-
 src/views/charts/charts/ChartTabs.vue         |  1 +
 .../charts/charts/chart-relation-ship.js      | 79 +++++++++++--------
 .../entityList/detailOverview/App.vue         |  6 +-
 .../entityList/detailOverview/Domain.vue      |  6 +-
 .../entityList/detailOverview/Ip.vue          |  6 +-
 12 files changed, 108 insertions(+), 53 deletions(-)

diff --git a/src/assets/css/components/views/charts/chart.scss b/src/assets/css/components/views/charts/chart.scss
index a22161f7..55dd612b 100644
--- a/src/assets/css/components/views/charts/chart.scss
+++ b/src/assets/css/components/views/charts/chart.scss
@@ -408,3 +408,25 @@
   cursor: pointer;
   z-index: 2;
 }
+.panel-chart__no-data.all-clear {
+  flex-direction: column;
+  .no-recent-alerts {
+    display: flex;
+    flex-direction: column;
+    color: #333333;
+    font-weight: 400;
+    text-align: center;
+    i {
+      color: #23BF9A;
+      font-size: 50px;
+    }
+    span {
+      font-size: 22px;
+      margin: 5px 0;
+    }
+  }
+  no-detection {
+    font-size: 12px;
+    color: #333;
+  }
+}
\ No newline at end of file
diff --git a/src/assets/css/components/views/entityExplorer/entityList/detail-overview.scss b/src/assets/css/components/views/entityExplorer/entityList/detail-overview.scss
index 884e4dfa..2506f819 100644
--- a/src/assets/css/components/views/entityExplorer/entityList/detail-overview.scss
+++ b/src/assets/css/components/views/entityExplorer/entityList/detail-overview.scss
@@ -55,6 +55,16 @@
         flex-wrap: wrap;
         padding: 2px 0;
         font-size: 14px;
+        .no-recent-alerts {
+          font-size: 12px;
+          color: #333333;
+          font-weight: 400;
+          line-height: 19px;
+          i {
+            color: #23BF9A;
+            margin-right: 4px;
+          }
+        }
 
         &.overview__row--small-font {
           font-size: 12px;
diff --git a/src/views/charts/Chart.vue b/src/views/charts/Chart.vue
index 23f6d557..a735ac4b 100644
--- a/src/views/charts/Chart.vue
+++ b/src/views/charts/Chart.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="cn-chart">
     <loading :loading="loading && !isTabs && !isBlock && !isGroup"></loading>
-    <chart-no-data v-if="isNoData"></chart-no-data>
+    <chart-no-data v-if="isNoData" :active-tab="activeTab"></chart-no-data>
     <template v-else>
       <chart-tabs
         ref="chart"
@@ -397,7 +397,8 @@ export default {
     table: Object,
     timeFilter: Object,
     orderPieTable: String,
-    tabHandleClickType: String
+    tabHandleClickType: String,
+    activeTab: Number
   },
   computed: {
     isNoData () {
diff --git a/src/views/charts/PanelChart.vue b/src/views/charts/PanelChart.vue
index 80889090..81cf7df4 100644
--- a/src/views/charts/PanelChart.vue
+++ b/src/views/charts/PanelChart.vue
@@ -36,6 +36,7 @@
         :loading="loading"
         :entity="entity"
         :table="table"
+        :active-tab="activeTab"
         :is-fullscreen="isFullscreen"
         :order-pie-table="orderPieTable"
         :time-filter="timeFilter"
@@ -102,7 +103,8 @@ export default {
     timeFilter: Object, // 时间范围
     isFullscreen: Boolean,
     panelLock: Boolean,
-    entity: Object
+    entity: Object,
+    activeTab: Number
   },
   data () {
     return {
diff --git a/src/views/charts/PanelChartList.vue b/src/views/charts/PanelChartList.vue
index 06ba52f9..0c80ffc3 100644
--- a/src/views/charts/PanelChartList.vue
+++ b/src/views/charts/PanelChartList.vue
@@ -32,6 +32,7 @@
             :chart-info="item"
             :time-filter="timeFilter"
             :entity="entity"
+            :active-tab="activeTab"
             @groupShow="groupShow"
             @showFullscreen="showFullscreen"
         ></panel-chart>
@@ -56,6 +57,7 @@
           :is-fullscreen="true"
           :panelLock="panelLock"
           :time-filter="timeFilter"
+          :active-tab="activeTab"
           @showFullscreen="showFullscreen"
       ></panel-chart>
     </el-dialog>
@@ -84,6 +86,7 @@ export default {
     panelLock: { type: Boolean, default: true },
     isGroup: Boolean,
     entity: Object,
+    activeTab: Number,
     dataList: Array // 看板中所有图表信息
   },
   data () {
diff --git a/src/views/charts/charts/ChartNoData.vue b/src/views/charts/charts/ChartNoData.vue
index 1396f5f0..344224bb 100644
--- a/src/views/charts/charts/ChartNoData.vue
+++ b/src/views/charts/charts/ChartNoData.vue
@@ -1,9 +1,19 @@
 <template>
-  <div class="panel-chart__no-data">No data</div>
+  <div v-if="!activeTab && activeTab !== 706 && activeTab !== 707" class="panel-chart__no-data">No data</div>
+  <div v-else class="panel-chart__no-data all-clear">
+    <div class="no-recent-alerts">
+      <i class="el-icon-success"></i>
+      <span>{{$t('detection.allClear')}}</span>
+    </div>
+    <div class="no-detection">{{$t('detection.noDetection')}}</div>
+  </div>
 </template>
 
 <script>
 export default {
-  name: 'ChartNoData'
+  name: 'ChartNoData',
+  props: {
+    activeTab: Number
+  }
 }
 </script>
diff --git a/src/views/charts/charts/ChartRelationShip.vue b/src/views/charts/charts/ChartRelationShip.vue
index e08b338c..4788b835 100644
--- a/src/views/charts/charts/ChartRelationShip.vue
+++ b/src/views/charts/charts/ChartRelationShip.vue
@@ -100,7 +100,7 @@
         <div class="ship-body-list-title">{{$t('relationShip.alert')}}</div>
         <div class="ship-body-list-value security">
           <template v-if="entityData.showShipServerity">
-            <template v-for="(item, index) in entityData.shipServerity" :key="index">
+            <template v-for="(item, index) in entityData.shipSeverity" :key="index">
               <template v-if="item.severityData && item.severityData.length > 0">
                 <span class="ship-body-list-security-alert" :class="iconClass(item)">{{ item.eventSeverity }}</span>
                 <span class="ship-body-list-security-length">{{ item.severityData.length }}</span>
@@ -137,6 +137,7 @@ export default {
         entityType: 'ip',
         trafficUrl: api.entityIpDetailTraffic,
         performanceUrl: api.entityIpDetailPerformance,
+        securityUrl: api.entityIpDetailSecurity,
         ServerOverviewUrl: api.entityIpRelatedServerIpOverview,
         basicProperties: api.entityIpDetailBasic
       },
@@ -144,6 +145,7 @@ export default {
         entityType: 'domain',
         trafficUrl: api.entityDomainDetailTraffic,
         performanceUrl: api.entityDomainDetailPerformance,
+        securityUrl: api.entityDomainDetailSecurity,
         ServerOverviewUrl: api.entityDomainRelatedServerDomainOverview,
         basicProperties: api.entityDomainDetailBasic
       },
@@ -151,6 +153,7 @@ export default {
         entityType: 'app',
         trafficUrl: api.entityAppDetailTraffic,
         performanceUrl: api.entityAppDetailPerformance,
+        securityUrl: api.entityAppDetailSecurity,
         ServerOverviewUrl: api.entityAppRelatedServerAppOverview,
         basicProperties: api.entityAppDetailBasic
       },
diff --git a/src/views/charts/charts/ChartTabs.vue b/src/views/charts/charts/ChartTabs.vue
index d71fa848..42378af6 100644
--- a/src/views/charts/charts/ChartTabs.vue
+++ b/src/views/charts/charts/ChartTabs.vue
@@ -15,6 +15,7 @@
           v-if="activeTab == tab.id"
           :time-filter="timeFilter"
           :data-list="tab.children"
+          :active-tab="activeTab"
           :panel-lock="true"
           :entity="entity"
       >
diff --git a/src/views/charts/charts/chart-relation-ship.js b/src/views/charts/charts/chart-relation-ship.js
index 90ce502c..37ba5a09 100644
--- a/src/views/charts/charts/chart-relation-ship.js
+++ b/src/views/charts/charts/chart-relation-ship.js
@@ -19,10 +19,13 @@ export default {
         chartOption: null,
         sentChart: null,
         receivedChart: null,
-        tableData: {}
+        tableData: {},
+        shipSeverity: []
       },
       chartOption: null,
-      echartsArray: []
+      echartsArray: [],
+      security: [],
+      performance: []
     }
   },
   computed: {
@@ -161,41 +164,47 @@ export default {
       })
     },
 
-    queryEntityDetailPerformance (urlObj, params, queryParams) {
+    queryEntityDetailAll (urlObj, params, queryParams) {
       this.loadingAlert = true
       get(urlObj.performanceUrl, queryParams).then(response => {
         if (response.code === 200) {
-          this.entityData.shipServerity = []
-          const criticalList = response.data.result.filter(item => item.eventSeverity === 'critical')
-          const highList = response.data.result.filter(item => item.eventSeverity === 'high')
-          const infoList = response.data.result.filter(item => item.eventSeverity === 'info')
-          const mediumList = response.data.result.filter(item => item.eventSeverity === 'medium')
-          const lowList = response.data.result.filter(item => item.eventSeverity === 'low')
-          this.entityData.shipServerity.push(
-            {
-              severityData: criticalList,
-              eventSeverity: 'critical'
-            }, {
-              severityData: highList,
-              eventSeverity: 'high'
-            }, {
-              severityData: infoList,
-              eventSeverity: 'info'
-            }, {
-              severityData: mediumList,
-              eventSeverity: 'medium'
-            }, {
-              severityData: lowList,
-              eventSeverity: 'low'
-            }
-          )
-          this.entityData.shipServerity.forEach(item => {
-            if (item.severityData.length > 0) {
-              this.entityData.showShipServerity = true
-            } else {
-              this.entityData.showShipServerity = false
-            }
-          })
+          this.performance = response.data.result
+        }
+      })
+      get(urlObj.securityUrl, queryParams).then(response => {
+        this.security = response.data.result
+      })
+      const severity = [...this.security, ...this.performance]
+      const criticalList = severity.filter(item => item.eventSeverity === 'critical')
+      const highList = severity.filter(item => item.eventSeverity === 'high')
+      const infoList = severity.filter(item => item.eventSeverity === 'info')
+      const mediumList = severity.filter(item => item.eventSeverity === 'medium')
+      const lowList = severity.filter(item => item.eventSeverity === 'low')
+      this.entityData.shipSeverity[0] = {
+        severityData: criticalList,
+        eventSeverity: 'critical'
+      }
+      this.entityData.shipSeverity[1] = {
+        severityData: highList,
+        eventSeverity: 'high'
+      }
+      this.entityData.shipSeverity[2] = {
+        severityData: infoList,
+        eventSeverity: 'info'
+      }
+      this.entityData.shipSeverity[3] = {
+        severityData: mediumList,
+        eventSeverity: 'medium'
+      }
+      this.entityData.shipSeverity[4] = {
+        severityData: lowList,
+        eventSeverity: 'low'
+      }
+      this.entityData.shipSeverity.forEach(item => {
+        if (item.severityData.length > 0) {
+          this.entityData.showShipServerity = true
+        } else {
+          this.entityData.showShipServerity = false
         }
         this.loadingAlert = false
       })
@@ -245,7 +254,7 @@ export default {
       this.entityData.tableData.symbol = params.data.symbol.slice(8)
       this.entityData.tableData.type = urlObj.entityType
       this.queryEntityDetailTraffic(urlObj, params, queryParams)
-      this.queryEntityDetailPerformance(urlObj, params, queryParams)
+      this.queryEntityDetailAll(urlObj, params, queryParams)
       this.queryEntityDetaServerOverview(urlObj, params, queryParams)
       this.getBasicProperties(urlObj, params, queryParams)
     },
diff --git a/src/views/entityExplorer/entityList/detailOverview/App.vue b/src/views/entityExplorer/entityList/detailOverview/App.vue
index 28b0bd04..b9e3c8c1 100644
--- a/src/views/entityExplorer/entityList/detailOverview/App.vue
+++ b/src/views/entityExplorer/entityList/detailOverview/App.vue
@@ -145,8 +145,7 @@
     <div class="overview__content overview__content-loading">
       <loading :loading="loadingAlert"></loading>
       <div class="overview__row">
-        <div class="row__label">{{$t('entities.recentAlert')}}</div>
-        <div class="row__content">{{entityData.performanceNum}}</div>
+        <span v-if="performanceData.length === 0" class="no-recent-alerts"><i class="el-icon-success"></i>{{$t('relationShip.noRecentAlerts')}}</span>
       </div>
       <div class="overview__row overview__row--small-font"   v-for="(performance, index) in entityData.performanceList" :key="index">
         <div class="row__label row__label--width160">{{dateFormatByAppearance(performance.startTime) || '-'}}</div>
@@ -166,8 +165,7 @@
     <div class="overview__content overview__content-loading">
       <loading :loading="loadingSecurityEvents"></loading>
       <div class="overview__row">
-        <div class="row__label">{{$t('entities.recentSecurity')}}</div>
-        <div class="row__content">{{entityData.securityNum}}</div>
+        <span v-if="entityData.securityList.length <= 0" class="no-recent-alerts"><i class="el-icon-success"></i>{{$t('relationShip.noRecentAlerts')}}</span>
       </div>
       <div class="overview__row overview__row--small-font"   v-for="(security, index) in entityData.securityList" :key="index">
         <div class="row__label row__label--width160">{{dateFormatByAppearance(security.startTime) || '-'}}</div>
diff --git a/src/views/entityExplorer/entityList/detailOverview/Domain.vue b/src/views/entityExplorer/entityList/detailOverview/Domain.vue
index b13d0fa3..86f99210 100644
--- a/src/views/entityExplorer/entityList/detailOverview/Domain.vue
+++ b/src/views/entityExplorer/entityList/detailOverview/Domain.vue
@@ -149,8 +149,7 @@
     <div class="overview__content overview__content-loading">
       <loading :loading="loadingAlert"></loading>
       <div class="overview__row">
-        <div class="row__label">{{$t('entities.recentAlert')}}</div>
-        <div class="row__content">{{entityData.performanceNum}}</div>
+        <span v-if="performanceData.length === 0" class="no-recent-alerts"><i class="el-icon-success"></i>{{$t('relationShip.noRecentAlerts')}}</span>
       </div>
       <div class="overview__row overview__row--small-font" v-for="(performance, index) in entityData.performanceList" :key="index">
         <div class="row__label row__label--width160">{{dateFormatByAppearance(performance.startTime) || '-'}}</div>
@@ -170,8 +169,7 @@
     <div class="overview__content overview__content-loading">
       <loading :loading="loadingSecurityEvents"></loading>
       <div class="overview__row">
-        <div class="row__label">{{$t('entities.recentSecurity')}}</div>
-        <div class="row__content">{{entityData.securityNum}}</div>
+        <span v-if="securityData.length === 0" class="no-recent-alerts"><i class="el-icon-success"></i>{{$t('relationShip.noRecentAlerts')}}</span>
       </div>
       <div class="overview__row overview__row--small-font" v-for="(security, i) in entityData.securityList" :key="i">
         <div class="row__label row__label--width160">{{dateFormatByAppearance(getMillisecond(security.startTime)) || '-'}}</div>
diff --git a/src/views/entityExplorer/entityList/detailOverview/Ip.vue b/src/views/entityExplorer/entityList/detailOverview/Ip.vue
index 46e19444..d95f3af2 100644
--- a/src/views/entityExplorer/entityList/detailOverview/Ip.vue
+++ b/src/views/entityExplorer/entityList/detailOverview/Ip.vue
@@ -172,8 +172,7 @@
     <div class="overview__content overview__content-loading">
       <loading :loading="loadingAlert"></loading>
       <div class="overview__row">
-        <div class="row__label">{{$t('entities.recentAlert')}}</div>
-        <div class="row__content">{{entityData.performanceNum}}</div>
+        <span v-if="performanceData.length === 0" class="no-recent-alerts"><i class="el-icon-success"></i>{{$t('relationShip.noRecentAlerts')}}</span>
       </div>
       <div class="overview__row overview__row--small-font" v-for="(performance, index) in entityData.performanceList" :key="index">
         <div class="row__label row__label--width160">{{dateFormatByAppearance(performance.startTime) || '-'}}</div>
@@ -193,8 +192,7 @@
     <div class="overview__content overview__content-loading">
       <loading :loading="loadingSecurityEvents"></loading>
       <div class="overview__row">
-        <div class="row__label">{{$t('entities.recentSecurity')}}</div>
-        <div class="row__content">{{entityData.securityNum}}</div>
+        <span v-if="securityData.length === 0" class="no-recent-alerts"><i class="el-icon-success"></i>{{$t('relationShip.noRecentAlerts')}}</span>
       </div>
       <div class="overview__row overview__row--small-font" v-for="(security, index) in entityData.securityList" :key="index">
         <div class="row__label row__label--width160">{{dateFormatByAppearance(security.startTime) || '-'}}</div>