style: 网络概况 下拉样式调整

src/assets/css/components/views/charts2/networkOverviewApps.scss

@@ -145,8 +145,11 @@
     }
   }
 }
+.el-select__popper.select-top {
+  top: 27px !important;
+}
 .app-dropdown.el-popper.is-pure {
-  top: 720px !important;
+  top: 703px !important;
   .el-scrollbar {
     .el-scrollbar__wrap {
       .el-scrollbar__view.el-dropdown__list {

src/assets/css/components/views/charts2/networkOverviewLine.scss

@@ -7,6 +7,7 @@
   .chart-drawing {
     height: 100%;
     width: 100%;
+    z-index: 0;
     .echarts-tooltip.echarts-tooltip-dark {
       .cn-chart-tooltip {
         display: flex;
@@ -21,14 +22,14 @@
     }
   }
   .line-select {
-    line-height: 24px;
     top: 20px;
     right: 20px;
     display: flex;
     position: absolute;
     .line-select-metric,.line-select-reference-line {
       display: flex;
-      &>span {
+      align-items: center;
+      span {
         font-size: 12px;
         color: #575757;
         font-weight: 400;
@@ -152,16 +153,13 @@
     }
   }
 }
-.el-select__popper.metric {
-  top: 218px !important;
+.el-select__popper {
+  top: 216px !important;
   .el-popper__arrow {
     display: none;
   }
 }
-.reference-line.el-select__popper {
-  left: 1545px !important;
-}
-.option-popper.el-select-dropdown {
+.el-select-dropdown {
   .el-scrollbar {
     .el-select-dropdown__wrap {
       .el-scrollbar__view.el-select-dropdown__list {

src/views/charts2/charts/NetworkOverviewApps.vue

@@ -6,9 +6,10 @@
         <el-select
             size="mini"
             v-model="metricFilter"
-            class="option__select select-topn"
+            class="option__select select-top"
             placeholder=""
-            popper-class="option-popper"
+            popper-class="option-popper select-top"
+            :popper-append-to-body="false"
         >
           <el-option v-for="item in metricOptions" :key="item.value" :label="item.label" :value="item.value"></el-option>
         </el-select>

src/views/charts2/charts/NetworkOverviewLine.vue

@@ -26,7 +26,7 @@
               size="mini"
               v-model="value1"
               class="option__select select-topn"
-              popper-class="option-popper metric"
+              popper-class="metric"
               @change="metricSelectChange"
           >
             <el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value"></el-option>
@@ -39,9 +39,9 @@
           <el-select
               size="mini"
               v-model="value2"
-              class="option__select select-topn"
+              class="option__select"
               :disabled="activeShow === 'total'"
-              popper-class="option-popper reference-line"
+              popper-class="reference-line"
           >
             <el-option v-for="item in options2" :key="item.value" :label="item.label" :value="item.value"></el-option>
           </el-select>
@@ -84,7 +84,7 @@ export default {
           label: 'Sessions/s'
         }
       ],
-      value1: '',
+      value1: 'Bits/s',
       options2: [
         {
           value: 'Average',
@@ -99,7 +99,7 @@ export default {
           label: 'Maximum'
         }
       ],
-      value2: '',
+      value2: 'Average',
       mpackets: [
         { number: 0, name: 'network.total', class: 'total', show: true, positioning: 0 },
         { number: 2212, name: 'network.inbound', class: 'inbound', show: true, positioning: 1 },