fix: 优化部分折线图表代码和逻辑

src/views/charts2/charts/dnsInsight/DnsTrafficLine.vue

@@ -473,18 +473,16 @@ export default {
       return this.sizes[sortIndex]
     },
     initData (data, val, active, show) {
-      let bytes = []
+      let lineData = []
-      let queries = []
       if (data !== undefined && data.length > 0) {
         data.forEach((item) => {
-          if (item.type.indexOf('bytes') > -1) {
+          if (item.type === 'bytes') {
-            bytes = Object.keys(item).map(t => {
+            item.type = 'Bits/s'
-              return {
+          } else if (item.type === 'queries') {
-                ...item[t]
+            item.type = 'Queries/s'
-              }
+          }
-            })
+          if (item.type === val) {
-          } else if (item.type.indexOf('queries') > -1) {
+            lineData = Object.keys(item).map(t => {
-            queries = Object.keys(item).map(t => {
               return {
                 ...item[t]
               }
@@ -492,13 +490,10 @@ export default {
           }
         })
       }
-      bytes.splice(0, 1)
+      lineData.splice(0, 1)
-      queries.splice(0, 1)
+      const mpackets = _.cloneDeep(this.mpackets)
-      if (val === 'Bits/s') {
+      if (val === 'Queries/s') {
-        this.legendInit(bytes, active, show, 'bps')
+        lineData.forEach((d, i) => {
-      } else if (val === 'Queries/s') {
-        const mpackets = _.cloneDeep(this.mpackets)
-        queries.forEach((d, i) => {
           mpackets[i].data = d.values
           mpackets[i].analysis = d.analysis
         })
@@ -513,16 +508,18 @@ export default {
         })
         this.mpackets = mpackets
         this.echartsInit(this.mpackets, true)
+      } else {
+        const unit = 'bps'
+        this.legendInit(lineData, active, show, unit, mpackets)
       }
     },
-    legendInit (data, active, show, type) {
+    legendInit (data, active, show, type, dnsData) {
-      const mpackets = _.cloneDeep(this.mpackets)
       data.forEach((d, i) => {
-        mpackets[i].data = d.values
+        dnsData[i].data = d.values
-        mpackets[i].analysis = d.analysis
+        dnsData[i].analysis = d.analysis
       })
       let num = 0
-      mpackets.forEach(e => {
+      dnsData.forEach(e => {
         e.unitType = type
         if (e.name !== 'network.total' && parseFloat(e.analysis.avg) === 0) {
           e.show = false
@@ -541,11 +538,11 @@ export default {
           }
         }
       })
-      this.mpackets = mpackets
+      this.mpackets = dnsData
       if (num === 3) {
-        mpackets[0].invertTab = false
+        dnsData[0].invertTab = false
         this.lineTab = 'total'
-        this.legendSelectChange(mpackets[0], 0)
+        this.legendSelectChange(dnsData[0], 0)
         this.echartsInit(this.mpackets)
       } else {
         this.echartsInit(this.mpackets, show)

src/views/charts2/charts/linkMonitor/LinkTrafficLine.vue

@@ -373,18 +373,16 @@ export default {
       return this.sizes[sortIndex]
     },
     initData (data, val, active, show) {
-      let bytes = []
+      let lineData = []
-      let packets = []
       if (data !== undefined && data.length > 0) {
         data.forEach((item) => {
-          if (item.type.indexOf('bytes') > -1) {
+          if (item.type === 'bytes') {
-            bytes = Object.keys(item).map(t => {
+            item.type = 'Bits/s'
-              return {
+          } else if (item.type === 'packets') {
-                ...item[t]
+            item.type = 'Packets/s'
-              }
+          }
-            })
+          if (item.type === val) {
-          } else if (item.type.indexOf('packets') > -1) {
+            lineData = Object.keys(item).map(t => {
-            packets = Object.keys(item).map(t => {
               return {
                 ...item[t]
               }
@@ -392,22 +390,18 @@ export default {
           }
         })
       }
-      bytes.splice(0, 1)
+      lineData.splice(0, 1)
-      packets.splice(0, 1)
-      if (val === 'Bits/s') {
-        this.legendInit(bytes, active, show, 'bps')
-      } else if (val === 'Packets/s') {
-        this.legendInit(packets, active, show, 'packets/s')
-      }
-    },
-    legendInit (data, active, show, type) {
       const mpackets = _.cloneDeep(this.mpackets)
+      const unit = val === 'Bits/s' ? 'bps' : 'packets/s'
+      this.legendInit(lineData, active, show, unit, mpackets)
+    },
+    legendInit (data, active, show, type, linkData) {
       data.forEach((d, i) => {
-        mpackets[i].data = d.values
+        linkData[i].data = d.values
-        mpackets[i].analysis = d.analysis
+        linkData[i].analysis = d.analysis
       })
       let num = 0
-      mpackets.forEach(e => {
+      linkData.forEach(e => {
         e.unitType = type
         if (e.name !== 'network.total' && parseFloat(e.analysis.avg) === 0) {
           e.show = false
@@ -426,11 +420,11 @@ export default {
           }
         }
       })
-      this.mpackets = mpackets
+      this.mpackets = linkData
       if (num === 3) {
-        mpackets[0].invertTab = false
+        linkData[0].invertTab = false
         this.lineTab = 'total'
-        this.legendSelectChange(mpackets[0], 0)
+        this.legendSelectChange(linkData[0], 0)
         this.$nextTick(() => {
           this.echartsInit(this.mpackets)
         })

src/views/charts2/charts/networkOverview/NetworkOverviewLine.vue

@@ -569,25 +569,18 @@ export default {
       return this.sizes[sortIndex]
     },
     initData (data, val, active, show, n) {
-      let bytes = []
+      let lineData = []
-      let packets = []
-      let sessions = []
       if (data !== undefined && data.length > 0) {
         data.forEach((item) => {
-          if (item.type.indexOf('bytes') > -1) {
+          if (item.type === 'bytes') {
-            bytes = Object.keys(item).map(t => {
+            item.type = 'Bits/s'
-              return {
+          } else if (item.type === 'packets') {
-                ...item[t]
+            item.type = 'Packets/s'
-              }
+          } else if (item.type === 'sessions') {
-            })
+            item.type = 'Sessions/s'
-          } else if (item.type.indexOf('packets') > -1) {
+          }
-            packets = Object.keys(item).map(t => {
+          if (item.type === val) {
-              return {
+            lineData = Object.keys(item).map(t => {
-                ...item[t]
-              }
-            })
-          } else if (item.type.indexOf('sessions') > -1) {
-            sessions = Object.keys(item).map(t => {
               return {
                 ...item[t]
               }
@@ -595,16 +588,10 @@ export default {
           }
         })
       }
-      bytes.splice(0, 1)
+      lineData.splice(0, 1)
-      packets.splice(0, 1)
+      if (val === 'Sessions/s') {
-      sessions.splice(0, 1)
-      if (val === 'Bits/s') {
-        this.legendInit(bytes, active, show, 'bps', n)
-      } else if (val === 'Packets/s') {
-        this.legendInit(packets, active, show, 'packets/s', n)
-      } else if (val === 'Sessions/s') {
         const mpackets = _.cloneDeep(this.mpackets)
-        sessions.forEach((d, i) => {
+        lineData.forEach((d, i) => {
           mpackets[i].data = d.values
           mpackets[i].analysis = d.analysis
         })
@@ -621,6 +608,9 @@ export default {
         this.$nextTick(() => {
           this.echartsInit(this.mpackets, true)
         })
+      } else {
+        const unit = val === 'Bits/s' ? 'bps' : 'packets/s'
+        this.legendInit(lineData, active, show, unit, n)
       }
     },
     legendInit (data, active, show, type, n) {