Bladeren bron

修改天气颜色

凉纪 1 jaar geleden
bovenliggende
commit
a22169a7ef
1 gewijzigde bestanden met toevoegingen van 18 en 9 verwijderingen
  1. 18 9
      src/components/weatherBox/index.vue

+ 18 - 9
src/components/weatherBox/index.vue

@@ -3,7 +3,7 @@
     <!--  天气消息  -->
     <div v-if="showNotice" class="notice-box">
       <div>
-        <van-notice-bar v-if="lists.length > 0" left-icon="volume-o" mode="closeable"  :color="color" :background="background">
+        <van-notice-bar v-if="lists.length > 0" left-icon="volume-o" mode="closeable"  :background="background">
           <van-swipe
             @change="changeColor"
             vertical
@@ -11,7 +11,9 @@
             :autoplay="8000"
             :show-indicators="false">
             <van-swipe-item v-for="item in lists" :key="item.id" @click="clickHandler(item)" >
-              {{item.alarmTitle}}
+              <span :style="{color:color,textShadow:'0 0 1px #666'}">
+                 {{item.alarmTitle}}
+              </span>
             </van-swipe-item>
           </van-swipe>
         </van-notice-bar>
@@ -128,25 +130,33 @@ export default {
       let alarmLevel = this.lists[index].alarmLevel;
       switch (alarmLevel){
         case '蓝色':
-          this.background = 'rgba(46,101,254,0.8)';
+          this.color= '#2E65FE';
+          this.background = '#f5f5f5';
+          //this.background = 'rgba(46,101,254,0.8)';
           //this.color = '#fff';
           break;
         case '黄色':
-          this.background = 'rgba(251,238,32,0.8)';
+          this.color = '#FBEE20';
+          this.background = '#f5f5f5';
+          //this.background = 'rgba(251,238,32,0.8)';
           //this.color = '#fdb0b1';
           break;
         case '橙色':
-          this.background = 'rgba(246,141,25,0.8)';
+          this.color = '#F68D19';
+          this.background = '#f5f5f5';
+          //this.background = 'rgba(246,141,25,0.8)';
           //this.color = '#fff';
           break;
         case '红色':
-          this.background = 'rgba(215,43,35,0.8)';
+          this.color = '#D72B23';
+          this.background = '#f5f5f5';
+          //this.background = 'rgba(215,43,35,0.8)';
         //this.color = '#fff';
       }
     },
     clickHandler(item) {
       this.info = item;
-      this.info.color = this.background;
+      this.info.color = this.color;
       this.show = true;
     },
   }
@@ -163,14 +173,13 @@ export default {
   line-height: 30px;
 }
 .van-swipe-item{
-  text-shadow: 0 0 2px #333;
+  -text-shadow: 0 0 2px #333;
 }
 </style>
 <style scoped lang="scss">
 
 .dialog-title{
   padding: 0 30px;
-  text-shadow: 0 0 2px #888;
 }
 .notice-box{
   width: 100%;