diff --git a/src/assets/css/components/views/charts2/networkOverviewApps.scss b/src/assets/css/components/views/charts2/networkOverviewApps.scss
index d2c68e06..77df3141 100644
--- a/src/assets/css/components/views/charts2/networkOverviewApps.scss
+++ b/src/assets/css/components/views/charts2/networkOverviewApps.scss
@@ -155,6 +155,9 @@
         font-size: 12px;
         color: #353636;
         font-weight: 400;
+        div:nth-of-type(1) {
+          margin-right: 5px;
+        }
       }
       .chart__drawing {
         flex: 1;
@@ -249,7 +252,7 @@
           overflow: auto;
           display: grid;
           grid-template-rows: repeat(auto-fill, 120px);
-          grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
+          grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
           grid-gap: 20px;
 
           &::-webkit-scrollbar-thumb {
diff --git a/src/views/charts2/charts/NetworkOverviewApps.vue b/src/views/charts2/charts/NetworkOverviewApps.vue
index dc1d1aa5..31e5e9e9 100644
--- a/src/views/charts2/charts/NetworkOverviewApps.vue
+++ b/src/views/charts2/charts/NetworkOverviewApps.vue
@@ -609,35 +609,48 @@ export default {
     },
     addApp () {
       this.showAddApp = true
+      this.searcherApp = ''
       const letter = 'abcdefghijklmnopqrstuvwxyz'
+      const appOptions = []
+      const providerOptions = []
       for (let i = 0; i < 100; i++) {
-        this.appOptions.push({
+        appOptions.push({
           name: letter[i % 26] + i,
           desc: 'this is a really nice app',
           appShow: false
         })
-        this.providerOptions.push({
+        providerOptions.push({
           name: letter[i % 26] + i,
           desc: 'this is a really nice provider',
           provideShow: false
         })
       }
+      this.appOptions = appOptions
+      this.providerOptions = providerOptions
       this.initialAppOptionsData = this.appOptions
       this.initialProviderOptionsData = this.providerOptions
     },
     cancelApp () {
       this.showAddApp = false
     },
-    appTypeTabChange () {
+    appTypeTabChange (val) {
+      this.appShowTypeTab = val.index
       this.searcherApp = ''
+      this.searcherAppChange(this.searcherApp)
     },
     searcherAppChange (val) {
       if (val) {
-        this.providerOptions = this.initialProviderOptionsData.filter(t => t.name.indexOf(val) > -1)
-        this.appOptions = this.initialAppOptionsData.filter(t => t.name.indexOf(val) > -1)
+        if (this.appShowTypeTab == 0) {
+          this.providerOptions = this.initialProviderOptionsData.filter(t => t.name.indexOf(val) > -1)
+        } else if (this.appShowTypeTab == 1) {
+          this.appOptions = this.initialAppOptionsData.filter(t => t.name.indexOf(val) > -1)
+        }
       } else {
-        this.providerOptions = this.initialProviderOptionsData
-        this.appOptions = this.initialAppOptionsData
+        if (this.appShowTypeTab == 0) {
+          this.providerOptions = this.initialProviderOptionsData
+        } else if (this.appShowTypeTab == 1) {
+          this.appOptions = this.initialAppOptionsData
+        }
       }
     },
     appCheckedChange (app, num) {
diff --git a/src/views/charts2/charts/options/echartOption.js b/src/views/charts2/charts/options/echartOption.js
index 9e89a047..6e69bcb7 100644
--- a/src/views/charts2/charts/options/echartOption.js
+++ b/src/views/charts2/charts/options/echartOption.js
@@ -203,22 +203,3 @@ export const appListChartOption = {
     }
   ]
 }
-
-function symbolSizeSortChange (index, time) {
-  const totalData = stackedLineChartOption.series[0].data.find(t => t[0] === time) // [time, value]
-  const inboundData = stackedLineChartOption.series[1].data.find(t => t[0] === time)
-  const outboundData = stackedLineChartOption.series[2].data.find(t => t[0] === time)
-  const internalData = stackedLineChartOption.series[3].data.find(t => t[0] === time)
-  const throughData = stackedLineChartOption.series[4].data.find(t => t[0] === time)
-  const otherData = stackedLineChartOption.series[5].data.find(t => t[0] === time)
-  totalData[2] = 0
-  inboundData[2] = 1
-  outboundData[2] = 2
-  internalData[2] = 3
-  throughData[2] = 4
-  otherData[2] = 5
-  const dataIntegrationArray = [totalData, inboundData, outboundData, internalData, throughData, otherData]
-  dataIntegrationArray.sort((a, b) => { return a[1] - b[1] })
-  const sortIndex = dataIntegrationArray.findIndex(a => a[2] === index)
-  return sizes[sortIndex]
-}