feat:样式冲突

src/assets/style/pageCommon.component.scss

@@ -3009,7 +3009,7 @@ i.red-cycle {
 }
 
 .el-checkbox__label {
-  color: #FFFFFF;
+  // color: #FFFFFF;
 }
 
 .center-right {

src/components/center/centerSide.component.html

@@ -4,7 +4,7 @@
             重大危险源包保责任制履职情况
         </title-component>
         <div class="echarts-box">
-            <el-select class="common-select" v-model="resumptionParams.type" placeholder="请选择"
+            <el-select class="screen-select" v-model="resumptionParams.type" placeholder="请选择"
                 @change="dataChange($event,'type')" :popper-append-to-body="false">
                 <el-option v-for="item in type" :key="item.value" :label="item.label" :value="item.value">
                 </el-option>
@@ -38,7 +38,7 @@
             个人隐患任务执行情况/近3月
         </title-component>
         <div class="echarts-box">
-            <el-select class="common-select" v-model="personalParams.userId" placeholder="请选择"
+            <el-select class="screen-select" v-model="personalParams.userId" placeholder="请选择" :popper-append-to-body="false"
                 @change="dataUserChange()">
                 <el-option v-for="item in member" :key="item.value" :label="item.label" :value="item.value">
                 </el-option>

src/components/center/centerSide.component.scss

@@ -10,7 +10,7 @@
   .echarts {
     width: 100%;
   }
-  .common-select {
+  .screen-select {
     position: absolute;
     top: 0;
     width: 110px;
@@ -18,14 +18,21 @@
     background: rgba(0, 0, 0, 0.5);
     z-index: 1;
     border-radius: 12px;
-    .el-input__inner {
+    ::v-deep {
-      width: 110px;
+      .el-input__inner {
-      height: 20px;
+        width: 110px;
-      background: rgba(0, 0, 0, 0.5);
+        height: 20px;
-      border: 1px solid rgba(255, 255, 255, 0.6);
+        background: rgba(0, 0, 0, 0.5);
-      border-radius: 12px;
+        border: 1px solid rgba(255, 255, 255, 0.6);
-      font-size: 8px;
+        border-radius: 12px;
-      color: #fff;
+        font-size: 8px;
+        color: #fff;
+      }
+      .el-input__icon {
+        width: 16px;
+        height: 16px;
+        line-height: 14px;
+      }
     }
     .el-input__icon {
       width: 16px;
@@ -167,22 +174,6 @@
     }
   }
 }
-.el-select-dropdown {
-  background: rgba(0, 0, 0, 0.5);
-  border: 0px solid #fff;
-  .el-select-dropdown__item {
-    color: #fff;
-    &:hover {
-      color: rgba(0, 0, 0, 0.8);
-    }
-  }
-  .el-select-dropdown__item.hover {
-    color: rgba(0, 0, 0, 0.8);
-  }
-  .el-select-dropdown__item.selected {
-    color: #409eff;
-  }
-}
 
 .popperDateClass {
   width: 520px;
@@ -237,3 +228,28 @@
     }
   }
 }
+
+.el-select-dropdown {
+  background: rgba(0, 0, 0, 0.5) !important;
+  border: 0px solid #fff;
+  .el-scrollbar__wrap {
+    background: rgba(0, 0, 0, 0.5);
+  }
+  .el-select-dropdown__item {
+    color: #fff;
+    &:hover {
+      color: rgba(0, 0, 0, 0.8);
+    }
+  }
+  .el-select-dropdown__item.hover {
+    color: rgba(0, 0, 0, 0.8);
+  }
+  .el-select-dropdown__item.selected {
+    color: #409eff;
+  }
+}
+
+.el-select-dropdown .el-popper{
+  background: rgba(0, 0, 0, 0.5) !important;
+  border: 0px solid #fff;
+}

src/components/center/centerSide.component.vue

@@ -511,7 +511,7 @@ export default class CenterSideComponent extends Vue {
         { value: res.data.completeNumber, name: "已完成数" },
         { value: res.data.taskNumber, name: "未完成" },
       ];
-      const  personalTaskOption = this.statisticalPresonalTaskChart(personalTasksData)
+      const personalTaskOption = this.statisticalPresonalTaskChart(personalTasksData)
       if (this.personaltaskchart) {
         this.personaltaskchart.clear();
         this.personaltaskchart.setOption(personalTaskOption);
@@ -522,7 +522,7 @@ export default class CenterSideComponent extends Vue {
    * 个人排查任务执行情况  环形图
    * @returns
    */
-  public statisticalPresonalTaskChart(personalTasksData:any) {
+  public statisticalPresonalTaskChart(personalTasksData: any) {
     return {
       tooltip: {},
       color: ["#C9FFD7 ", "#FADFA4"],
@@ -614,13 +614,39 @@ export default class CenterSideComponent extends Vue {
 
 
 </script>
+<style scoped lang="scss" src="../../assets/style/pageCommon.component.scss"></style>
+<style scoped lang="scss" src="./centerSide.component.scss"></style>
+<style scoped lang="scss">
+::v-deep {
+  .screen-select {
+    .el-select-dropdown {
+      background: rgba(0, 0, 0, 0.5) !important;
+      border: 0px solid #fff;
 
-<style scoped lang="scss" src="./centerSide.component.scss">
+      .el-scrollbar__wrap {
+        background: rgba(0, 0, 0, 0.5);
+      }
 
+      .el-select-dropdown__item {
+        color: #fff;
+
+        &:hover {
+          color: rgba(0, 0, 0, 0.8);
+        }
+      }
+
+      .el-select-dropdown__item.hover {
+        color: rgba(0, 0, 0, 0.8);
+      }
+
+      .el-select-dropdown__item.selected {
+        color: #409eff;
+      }
+
+      .el-select-dropdown__list {
+        max-height: 200px;
+      }
+    }
+  }
+}
 </style>
-<style scoped lang="scss" src="../../assets/style/pageCommon.component.scss">
-
-</style>
-
-
-

src/views/risk/area/area.component.vue

@@ -278,8 +278,9 @@ export default class AreaManagerComponent extends BaseRecordComponent<any> {
                 "重大危险源名称": row.majorHazardName
             }
         }).then((res: any) => {
-            this.showQrCode = true;
             this.qrUrl = res.data.url;
+            this.showQrCode = true;
+
         })
     }