修改样式

src/views/datascreen/assets/css/index.css

@@ -525,4 +525,74 @@ ul.h100 li:nth-of-type(n+6) .pmbar span {
 }
 .el-step__title.is-process{
     color: #fff;
+}
+
+
+
+.el-select-dropdown__item {
+    background: #254277 !important;
+    border: 0;
+    padding: 0;
+    color: #fff;
+    text-align: center;
+}
+
+
+
+.el-select--small .el-select__wrapper{
+    background: #254277 !important;
+    border: 0;
+}
+
+
+
+
+:deep(.el-input__wrapper) {
+    background: linear-gradient(90deg, #0b3571, rgba(11, 53, 113, 0) 100%);
+    box-shadow: 0 0 0 0 var(--el-input-border-color, var(--el-border-color)) inset;
+}
+
+:deep(.el-select:hover:not(.el-select--disabled) .el-input__wrapper) {
+    box-shadow: 0 0 0 0 var(--el-select-input-focus-border-color) inset !important;
+}
+
+:deep(.el-select .el-input.is-focus .el-input__wrapper) {
+    box-shadow: 0 0 0 0 var(--el-select-input-focus-border-color) inset !important;
+}
+
+:deep(.el-select:hover:not(.el-select--disabled) .el-input__wrapper) {
+    background: #0b3571;
+}
+
+:deep(.el-select .el-input__wrapper) {
+    background: #0b3571;
+}
+.el-popper.is-light.blueBack {
+    background-color: #254277 !important;
+    border: 1px solid #254277 !important;
+}
+
+.blueBack.el-popper[data-popper-placement^=bottom] .el-popper__arrow::before {
+    background: #254277 !important;
+    border: 1px solid #254277 !important;
+}
+
+.blueBack.el-popper[data-popper-placement^=top] .el-popper__arrow::before {
+    background: #254277 !important;
+    border: 1px solid #254277 !important;
+}
+
+.blueBack {
+    .el-select-dropdown__item.hover,
+    .el-select-dropdown__item:hover {
+        background: #2A77C6 !important;
+    }
+
+    .el-select-dropdown__item {
+        color: #fff !important;
+    }
+
+    .el-select-dropdown__item.selected {
+        background: #2A77C6 !important;
+    }
 }

src/views/datascreen/index.vue

@@ -109,14 +109,16 @@
               class="m-2"
               :placeholder="selectTrend"
               size="small"
-              style="width: 100px;z-index: 3000"
+              style="width: 100px;z-index: 3000;"
               @change="getMailTrend"
+              popper-class="blueBack"
           >
             <el-option
                 v-for="item in trendDayOptions"
                 :key="item.value"
                 :label="item.label"
                 :value="item.value"
+
             />
           </el-select>
         </div>
@@ -128,6 +130,7 @@
               size="small"
               style="width: 100px;z-index: 3000"
               @change="getMailTrend"
+              popper-class="blueBack"
           >
             <el-option
                 v-for="item in trendWeekOptions"
@@ -146,12 +149,14 @@
               size="small"
               style="width: 100px;z-index: 3000"
               @change="getMailTrend"
+              popper-class="blueBack"
           >
             <el-option
                 v-for="item in trendMonthOptions"
                 :key="item.value"
                 :label="item.label"
                 :value="item.value"
+                style="height:auto;max-height:300px;padding:0;background:red;"
             />
           </el-select>
         </div>
@@ -456,7 +461,7 @@ onMounted(() => {
   getMapDataList()
   getConsoleDataMap()
   startRateAutoSwitch();
-  startTrendAutoSwitch();
+  //startTrendAutoSwitch();
   startDutyAutoSwitch();
   dayEcharts()
   changsMap()
@@ -1184,6 +1189,6 @@ const closeDetails=()=>{
 }
 
 </script>
-<style>
+<style lang="less">
 
 </style>