style: 网络概况 select 样式调整

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

@@ -17,43 +17,26 @@
       margin-left: 3px;
       box-shadow: none;
       border-radius: 2px;
-      .option__select {
+      .el-input__inner {
-        pointer-events:none;
+        width: 80px;
-        .el-input__inner {
+        height: 24px;
-          width: 80px;
+        padding-left: 4px;
-          height: 24px;
+        line-height: 24px;
-          padding-left: 4px;
+        font-size: 12px;
+        color: #2C72C6;
+        font-weight: 400;
+      }
+      .el-input__suffix {
+        display: flex;
+        .el-input__suffix-inner {
           line-height: 24px;
-          font-size: 12px;
+          .el-select__caret {
-          color: #2C72C6;
-          font-weight: 400;
-        }
-        .el-input__suffix {
-          display: flex;
-          .el-input__suffix-inner {
             line-height: 24px;
-            .el-select__caret {
+            width: 16px;
-              line-height: 24px;
+            color: #575757;
-              width: 16px;
-              color: #575757;
-            }
           }
         }
       }
-      .option__select.select-column {
-        .el-input__inner {
-          width: 86px;
-          padding-left: 8px;
-        }
-      }
-      .icon-group-divide {
-        height: 14px;
-        width: 1px;
-        background-color: $--color-primary;
-      }
-      i {
-        font-size: 12px;
-      }
     }
   }
 
@@ -104,6 +87,40 @@
             margin-right: 4px;
           }
         }
+        .app-card-title-more {
+          position: relative;
+          .app-card-title-more-delete {
+            z-index: 1;
+            font-family: Helvetica;
+            position: absolute;
+            min-width: 96px;
+            line-height: 32px;
+            height: 32px;
+            top: 14px;
+            left: -68px;
+            background: #FFFFFF;
+            border: 1px solid #C5C5C5;
+            box-shadow: -1px 1px 10px -1px rgba(205,205,205,0.85);
+            border-radius: 2px;
+            font-size: 12px;
+            padding-left: 6.8px;
+            color: #353636;
+            font-weight: 400;
+            i {
+              margin-right: 5.67px;
+              font-size: 12px;
+              color: #575757;
+            }
+          }
+          .app-card-title-more-delete:hover {
+            background: #EBF1F4;
+            border: 1px solid rgba(0,0,0,0.15);
+          }
+          .app-card-title-more-delete:active {
+            background: #E0E7EA;
+            border: 1px solid rgba(0,0,0,0.15);
+          }
+        }
       }
       .app-card__bodys {
         display: flex;
@@ -326,7 +343,7 @@
     }
   }
 }
-.el-select__popper.select-top {
+.el-select__popper.app-metric {
   top: 27px !important;
 }
 .app-dropdown.el-popper.is-pure {

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

@@ -40,43 +40,26 @@
         margin-left: 3px;
         box-shadow: none;
         border-radius: 2px;
-        .option__select {
+        .el-input__inner {
-          pointer-events:none;
+          padding-left: 4px;
-          .el-input__inner {
+          line-height: 24px;
-            width: 80px;
+          height: 24px;
-            height: 24px;
+          width: 80px;
-            padding-left: 4px;
+          font-size: 12px;
+          color: #2C72C6;
+          font-weight: 400;
+        }
+        .el-input__suffix {
+          display: flex;
+          .el-input__suffix-inner {
             line-height: 24px;
-            font-size: 12px;
+            .el-select__caret {
-            color: #2C72C6;
-            font-weight: 400;
-          }
-          .el-input__suffix {
-            display: flex;
-            .el-input__suffix-inner {
               line-height: 24px;
-              .el-select__caret {
+              width: 16px;
-                line-height: 24px;
+              color: #575757;
-                width: 16px;
-                color: #575757;
-              }
             }
           }
         }
-        .option__select.select-column {
-          .el-input__inner {
-            width: 86px;
-            padding-left: 8px;
-          }
-        }
-        .icon-group-divide {
-          height: 14px;
-          width: 1px;
-          background-color: $--color-primary;
-        }
-        i {
-          font-size: 12px;
-        }
       }
     }
     .line-select-reference-line {

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

@@ -22,11 +22,11 @@
     overflow: auto;
     &>.vue-grid-layout {
       margin-top: -20px;
-      .header__operation--cancel:hover,.el-button:hover {
+      .header__operation--cancel:hover,.el-button:hover,.app-card-title-more-delete:hover {
         background: #EBF1F4;
         border: 1px solid rgba(0,0,0,0.15);
       }
-      .header__operation--cancel:active,.el-button:active {
+      .header__operation--cancel:active,.el-button:active,.app-card-title-more-delete:active {
         background: #E0E7EA;
         border: 1px solid rgba(0,0,0,0.15);
       }

src/views/charts2/charts/NetworkOverviewLine.vue

@@ -25,7 +25,6 @@
           <el-select
               size="mini"
               v-model="value1"
-              class="option__select select-topn"
               popper-class="metric"
               @change="metricSelectChange"
           >
@@ -39,7 +38,6 @@
           <el-select
               size="mini"
               v-model="value2"
-              class="option__select"
               :disabled="activeShow === 'total'"
               popper-class="reference-line"
           >