|  | @@ -19,118 +19,19 @@
 | 
											
												
													
														|  |        </div>
 |  |        </div>
 | 
											
												
													
														|  |      </div>
 |  |      </div>
 | 
											
												
													
														|  |  
 |  |  
 | 
											
												
													
														|  | -  <!--  天气消息  -->
 |  | 
 | 
											
												
													
														|  | -    <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-swipe
 |  | 
 | 
											
												
													
														|  | -            @change="onChange"
 |  | 
 | 
											
												
													
														|  | -            vertical
 |  | 
 | 
											
												
													
														|  | -            class="notice-swipe"
 |  | 
 | 
											
												
													
														|  | -            :autoplay="8000"
 |  | 
 | 
											
												
													
														|  | -            :show-indicators="false">
 |  | 
 | 
											
												
													
														|  | -            <van-swipe-item v-for="item in lists" :key="item.id" @click="clickHandler(item)" >
 |  | 
 | 
											
												
													
														|  | -              {{item.alarmTitle}}
 |  | 
 | 
											
												
													
														|  | -            </van-swipe-item>
 |  | 
 | 
											
												
													
														|  | -          </van-swipe>
 |  | 
 | 
											
												
													
														|  | -        </van-notice-bar>
 |  | 
 | 
											
												
													
														|  | -      </div>
 |  | 
 | 
											
												
													
														|  | -    </div>
 |  | 
 | 
											
												
													
														|  | -
 |  | 
 | 
											
												
													
														|  | -    <!-- 弹窗 -->
 |  | 
 | 
											
												
													
														|  | -    <van-dialog v-model="show" title="标题" :message="info.alarmContent" messageAlign="left">
 |  | 
 | 
											
												
													
														|  | -      <template #title>
 |  | 
 | 
											
												
													
														|  | -        <p class="dialog-title" :style="{color:background}">{{info.alarmTitle}}</p>
 |  | 
 | 
											
												
													
														|  | -      </template>
 |  | 
 | 
											
												
													
														|  | -    </van-dialog>
 |  | 
 | 
											
												
													
														|  | -
 |  | 
 | 
											
												
													
														|  | -
 |  | 
 | 
											
												
													
														|  | -<!--    <!– 天气预警 –>-->
 |  | 
 | 
											
												
													
														|  | -<!--    <van-swipe v-if="list.length > 0" style="height: 50px" vertical autoplay="2000">-->
 |  | 
 | 
											
												
													
														|  | -<!--      <van-swipe-item v-for="item in list" :key="item.id" @click="clickHandler(item)">-->
 |  | 
 | 
											
												
													
														|  | -<!--        <div class="color" :style="{ color: item.bgc, backgroundColor: '#fff' }">-->
 |  | 
 | 
											
												
													
														|  | -<!--          <van-icon name="warn-o" /> {{ item.alarmTitle }}-->
 |  | 
 | 
											
												
													
														|  | -<!--        </div>-->
 |  | 
 | 
											
												
													
														|  | -<!--      </van-swipe-item>-->
 |  | 
 | 
											
												
													
														|  | -
 |  | 
 | 
											
												
													
														|  | -<!--      <template #indicator>-->
 |  | 
 | 
											
												
													
														|  | -<!--        <div class="custom-indicator"></div>-->
 |  | 
 | 
											
												
													
														|  | -<!--      </template>-->
 |  | 
 | 
											
												
													
														|  | -<!--    </van-swipe>-->
 |  | 
 | 
											
												
													
														|  |    </div>
 |  |    </div>
 | 
											
												
													
														|  |  </template>
 |  |  </template>
 | 
											
												
													
														|  |  <script>
 |  |  <script>
 | 
											
												
													
														|  | -import { Icon } from 'vant'
 |  | 
 | 
											
												
													
														|  |  import { mapGetters } from 'vuex'
 |  |  import { mapGetters } from 'vuex'
 | 
											
												
													
														|  | -import { logout, getTheAreaWeather } from '@/api/public'
 |  | 
 | 
											
												
													
														|  | 
 |  | +import { logout } from '@/api/public'
 | 
											
												
													
														|  |  export default {
 |  |  export default {
 | 
											
												
													
														|  | -  components: {
 |  | 
 | 
											
												
													
														|  | -    [Icon.name]: Icon
 |  | 
 | 
											
												
													
														|  | -  },
 |  | 
 | 
											
												
													
														|  | -  props:{
 |  | 
 | 
											
												
													
														|  | -    showNotice:{
 |  | 
 | 
											
												
													
														|  | -      type:Boolean,
 |  | 
 | 
											
												
													
														|  | -      default:true
 |  | 
 | 
											
												
													
														|  | -    },
 |  | 
 | 
											
												
													
														|  | -  },
 |  | 
 | 
											
												
													
														|  |    data() {
 |  |    data() {
 | 
											
												
													
														|  | -    return {
 |  | 
 | 
											
												
													
														|  | -      show: false,
 |  | 
 | 
											
												
													
														|  | -      info: '',
 |  | 
 | 
											
												
													
														|  | -      lists:[],
 |  | 
 | 
											
												
													
														|  | -      active: this.defaultActive,
 |  | 
 | 
											
												
													
														|  | -      color: '#ecf9ff',
 |  | 
 | 
											
												
													
														|  | -      background: 'rgba(78,162,248,0.63)'
 |  | 
 | 
											
												
													
														|  | -    }
 |  | 
 | 
											
												
													
														|  | -  },
 |  | 
 | 
											
												
													
														|  | -  mounted() {
 |  | 
 | 
											
												
													
														|  | -    this.getList();
 |  | 
 | 
											
												
													
														|  | 
 |  | +    return {}
 | 
											
												
													
														|  |    },
 |  |    },
 | 
											
												
													
														|  |    computed: {
 |  |    computed: {
 | 
											
												
													
														|  |      ...mapGetters(['userName', 'orgName','roleList', 'orgId']),
 |  |      ...mapGetters(['userName', 'orgName','roleList', 'orgId']),
 | 
											
												
													
														|  |    },
 |  |    },
 | 
											
												
													
														|  |    methods: {
 |  |    methods: {
 | 
											
												
													
														|  | -    //获取天气数据
 |  | 
 | 
											
												
													
														|  | -    getList() {
 |  | 
 | 
											
												
													
														|  | -      if(!this.orgId)return [];
 |  | 
 | 
											
												
													
														|  | -      getTheAreaWeather(this.orgId).then(res => {
 |  | 
 | 
											
												
													
														|  | -        this.lists = res.data || [];
 |  | 
 | 
											
												
													
														|  | -        // let str = {
 |  | 
 | 
											
												
													
														|  | -        //   alarmContent:"周宁县气象台2023年12月13日10时27分继续发布大雾黄色预警信号:预计未来12小时,我县部分乡镇将出现能见度小于500米的雾。请注意防范!(预警信息来源:国家预警信息发布中心)",
 |  | 
 | 
											
												
													
														|  | -        //   alarmLevel:"黄色",
 |  | 
 | 
											
												
													
														|  | -        //   alarmTime:"2023-12-13 14:00:10",
 |  | 
 | 
											
												
													
														|  | -        //   alarmTitle:"周宁县气象台2023年12月13日10时27分继续发布大雾黄色预警信号",
 |  | 
 | 
											
												
													
														|  | -        //   alarmType:"大雾",
 |  | 
 | 
											
												
													
														|  | -        //   area:"周宁",
 |  | 
 | 
											
												
													
														|  | -        //   city:"宁德",
 |  | 
 | 
											
												
													
														|  | -        //   code:"101230305",
 |  | 
 | 
											
												
													
														|  | -        //   createTime:"2023-12-13 10:27:00",
 |  | 
 | 
											
												
													
														|  | -        //   id:"8",
 |  | 
 | 
											
												
													
														|  | -        //   province:"福建"
 |  | 
 | 
											
												
													
														|  | -        // }
 |  | 
 | 
											
												
													
														|  | -        // this.lists.push(str)
 |  | 
 | 
											
												
													
														|  | -      })
 |  | 
 | 
											
												
													
														|  | -    },
 |  | 
 | 
											
												
													
														|  | -    onChange(index){
 |  | 
 | 
											
												
													
														|  | -      let alarmLevel = this.list[index].alarmLevel;
 |  | 
 | 
											
												
													
														|  | -      switch (alarmLevel){
 |  | 
 | 
											
												
													
														|  | -        case '蓝色':
 |  | 
 | 
											
												
													
														|  | -          this.background = 'rgba(78,162,248,0.62)';
 |  | 
 | 
											
												
													
														|  | -          //this.color = '#fff';
 |  | 
 | 
											
												
													
														|  | -          break;
 |  | 
 | 
											
												
													
														|  | -        case '黄色':
 |  | 
 | 
											
												
													
														|  | -          this.background = 'rgba(238,227,103,0.63)';
 |  | 
 | 
											
												
													
														|  | -          //this.color = '#fff';
 |  | 
 | 
											
												
													
														|  | -          break;
 |  | 
 | 
											
												
													
														|  | -        case '橙色':
 |  | 
 | 
											
												
													
														|  | -          this.background = 'rgba(246,181,104,0.62)';
 |  | 
 | 
											
												
													
														|  | -          //this.color = '#fff';
 |  | 
 | 
											
												
													
														|  | -          break;
 |  | 
 | 
											
												
													
														|  | -        case '红色':
 |  | 
 | 
											
												
													
														|  | -          this.background = 'rgba(239,70,74,0.65)';
 |  | 
 | 
											
												
													
														|  | -          //this.color = '#fff';
 |  | 
 | 
											
												
													
														|  | -      }
 |  | 
 | 
											
												
													
														|  | -    },
 |  | 
 | 
											
												
													
														|  |      clickOutLogin() {
 |  |      clickOutLogin() {
 | 
											
												
													
														|  |        logout().then(res => {
 |  |        logout().then(res => {
 | 
											
												
													
														|  |          sessionStorage.clear();
 |  |          sessionStorage.clear();
 | 
											
										
											
												
													
														|  | @@ -138,27 +39,10 @@ export default {
 | 
											
												
													
														|  |          this.$toast('退出登录');
 |  |          this.$toast('退出登录');
 | 
											
												
													
														|  |        })
 |  |        })
 | 
											
												
													
														|  |      },
 |  |      },
 | 
											
												
													
														|  | -    clickHandler(item) {
 |  | 
 | 
											
												
													
														|  | -      console.log(121212)
 |  | 
 | 
											
												
													
														|  | -      this.info = item;
 |  | 
 | 
											
												
													
														|  | -      this.show = true;
 |  | 
 | 
											
												
													
														|  | -    },
 |  | 
 | 
											
												
													
														|  |    }
 |  |    }
 | 
											
												
													
														|  |  }
 |  |  }
 | 
											
												
													
														|  |  </script>
 |  |  </script>
 | 
											
												
													
														|  | -<style lang="scss">
 |  | 
 | 
											
												
													
														|  | -.van-notice-bar{
 |  | 
 | 
											
												
													
														|  | -  line-height:60px;
 |  | 
 | 
											
												
													
														|  | -  height: 60px;
 |  | 
 | 
											
												
													
														|  | -}
 |  | 
 | 
											
												
													
														|  | -.notice-swipe {
 |  | 
 | 
											
												
													
														|  | -  height: 30px;
 |  | 
 | 
											
												
													
														|  | -  line-height: 30px;
 |  | 
 | 
											
												
													
														|  | -}
 |  | 
 | 
											
												
													
														|  | -.van-swipe-item{
 |  | 
 | 
											
												
													
														|  | -  text-shadow: 0 0 3px #888;
 |  | 
 | 
											
												
													
														|  | -}
 |  | 
 | 
											
												
													
														|  | -</style>
 |  | 
 | 
											
												
													
														|  | 
 |  | +
 | 
											
												
													
														|  |  <style scoped lang="scss">
 |  |  <style scoped lang="scss">
 | 
											
												
													
														|  |  .top-bar-box{
 |  |  .top-bar-box{
 | 
											
												
													
														|  |    position: relative;
 |  |    position: relative;
 | 
											
										
											
												
													
														|  | @@ -176,9 +60,7 @@ export default {
 | 
											
												
													
														|  |      width: 100%;
 |  |      width: 100%;
 | 
											
												
													
														|  |    }
 |  |    }
 | 
											
												
													
														|  |  }
 |  |  }
 | 
											
												
													
														|  | -.dialog-title{
 |  | 
 | 
											
												
													
														|  | -  padding: 0 30px;
 |  | 
 | 
											
												
													
														|  | -}
 |  | 
 | 
											
												
													
														|  | 
 |  | +
 | 
											
												
													
														|  |  .top-box {
 |  |  .top-box {
 | 
											
												
													
														|  |    display: flex;
 |  |    display: flex;
 | 
											
												
													
														|  |    justify-content: space-between;
 |  |    justify-content: space-between;
 | 
											
										
											
												
													
														|  | @@ -187,12 +69,6 @@ export default {
 | 
											
												
													
														|  |      font-size: 40px;
 |  |      font-size: 40px;
 | 
											
												
													
														|  |    }
 |  |    }
 | 
											
												
													
														|  |  }
 |  |  }
 | 
											
												
													
														|  | -.notice-box{
 |  | 
 | 
											
												
													
														|  | -  width: 100%;
 |  | 
 | 
											
												
													
														|  | -  position: absolute;
 |  | 
 | 
											
												
													
														|  | -  bottom: -80;
 |  | 
 | 
											
												
													
														|  | -  z-index: 1000;
 |  | 
 | 
											
												
													
														|  | -}
 |  | 
 | 
											
												
													
														|  |  .bottom-box {
 |  |  .bottom-box {
 | 
											
												
													
														|  |    padding-top: 30px;
 |  |    padding-top: 30px;
 | 
											
												
													
														|  |    > div {
 |  |    > div {
 |