|
|
@@ -1,22 +1,21 @@
|
|
|
<template>
|
|
|
<div>
|
|
|
+ <div class="top-bar">
|
|
|
+ <div class="top-box">
|
|
|
+ <span>移动安全保卫管理平台</span>
|
|
|
+ <van-icon name="setting-o" size="26" @click="clickOutLogin" />
|
|
|
+ </div>
|
|
|
+ <div class="bottom-box">
|
|
|
+ <div>
|
|
|
+
|
|
|
+ <p class="user-name">{{ userName }}</p>
|
|
|
|
|
|
-
|
|
|
- <div class="top-bar">
|
|
|
- <div class="top-box">
|
|
|
- <span>移动安全保卫管理平台</span>
|
|
|
- <van-icon name="setting-o" size="26" @click="clickOutLogin" />
|
|
|
- </div>
|
|
|
- <div class="bottom-box">
|
|
|
- <div>
|
|
|
- <p class="user-name">{{userName}}</p>
|
|
|
- <p class="introduce-info" v-for="item in rolesList" :key="item.roleId">{{orgName}} · {{item.roleName}}</p>
|
|
|
+ <p class="introduce-info" v-for="item in rolesList" :key="item.roleId">{{ orgName }} · {{ item.roleName }}</p>
|
|
|
+ </div>
|
|
|
+ <van-icon name="arrow" size="20" />
|
|
|
</div>
|
|
|
- <van-icon name="arrow" size="20" />
|
|
|
</div>
|
|
|
-
|
|
|
- </div>
|
|
|
-
|
|
|
+
|
|
|
<!-- 天气预警 -->
|
|
|
<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)">
|
|
|
@@ -32,12 +31,12 @@
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
-import { Icon } from 'vant';
|
|
|
-import {mapGetters} from "vuex";
|
|
|
-import {logout,getTheAreaWeather} from "@/api/public";
|
|
|
+import { Icon } from 'vant'
|
|
|
+import { mapGetters } from 'vuex'
|
|
|
+import { logout, getTheAreaWeather } from '@/api/public'
|
|
|
export default {
|
|
|
components: {
|
|
|
- [Icon.name]: Icon,
|
|
|
+ [Icon.name]: Icon
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
@@ -45,23 +44,25 @@ export default {
|
|
|
show: false,
|
|
|
info: '',
|
|
|
active: this.defaultActive,
|
|
|
- rolesList:[]
|
|
|
+ rolesList: []
|
|
|
}
|
|
|
},
|
|
|
computed: {
|
|
|
- ...mapGetters(['userName','orgName','orgId'])
|
|
|
+ ...mapGetters(['userName', 'orgName', 'orgId'])
|
|
|
},
|
|
|
- created(){
|
|
|
- this.rolesList=JSON.parse(window.sessionStorage.getItem('SET_USER_ROLELIST'))
|
|
|
-
|
|
|
+ created() {
|
|
|
this.getTheWeather()
|
|
|
},
|
|
|
+ mounted() {
|
|
|
+ // console.log(this.rolesList);
|
|
|
+ // this.rolesList=JSON.parse(window.sessionStorage.getItem('SET_USER_ROLELIST'))||[]
|
|
|
+ },
|
|
|
methods: {
|
|
|
- clickOutLogin(){
|
|
|
- logout().then(res=>{
|
|
|
- sessionStorage.clear();
|
|
|
- this.$router.replace('/login');
|
|
|
- this.$toast('退出登录');
|
|
|
+ clickOutLogin() {
|
|
|
+ logout().then(res => {
|
|
|
+ sessionStorage.clear()
|
|
|
+ this.$router.replace('/login')
|
|
|
+ this.$toast('退出登录')
|
|
|
})
|
|
|
},
|
|
|
clickHandler(item) {
|
|
|
@@ -72,8 +73,7 @@ export default {
|
|
|
//获取天气数据
|
|
|
getTheWeather() {
|
|
|
getTheAreaWeather(this.orgId).then(res => {
|
|
|
-
|
|
|
- this.list = res.data||[]
|
|
|
+ this.list = res.data || []
|
|
|
this.list.forEach(item => {
|
|
|
if (item.alarmLevel == '橙色') {
|
|
|
item.bgc = '#fa8e00'
|
|
|
@@ -85,21 +85,26 @@ export default {
|
|
|
item.bgc = '#e9fa00'
|
|
|
}
|
|
|
})
|
|
|
+ setTimeout(() => {
|
|
|
+
|
|
|
+ this.rolesList = JSON.parse(window.sessionStorage.getItem('SET_USER_ROLELIST')) || []
|
|
|
+ }, 100);
|
|
|
+ console.log(this.rolesList);
|
|
|
})
|
|
|
- },
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
-.top-bar{
|
|
|
+.top-bar {
|
|
|
height: 300px;
|
|
|
width: 100%;
|
|
|
- background: url("../assets/img/banner.png") no-repeat center;
|
|
|
+ background: url('../assets/img/banner.png') no-repeat center;
|
|
|
background-size: 100% 100%;
|
|
|
padding: 40px;
|
|
|
box-shadow: 0 1px 8px #ccc;
|
|
|
- >div{
|
|
|
+ > div {
|
|
|
width: 100%;
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
@@ -107,19 +112,19 @@ export default {
|
|
|
color: #fff;
|
|
|
}
|
|
|
}
|
|
|
-.top-box{
|
|
|
- >span{
|
|
|
+.top-box {
|
|
|
+ > span {
|
|
|
font-size: 40px;
|
|
|
}
|
|
|
}
|
|
|
-.bottom-box{
|
|
|
- padding-top:50px;
|
|
|
- >div{
|
|
|
- .user-name{
|
|
|
+.bottom-box {
|
|
|
+ padding-top: 50px;
|
|
|
+ > div {
|
|
|
+ .user-name {
|
|
|
font-size: 30px;
|
|
|
margin-bottom: 20px;
|
|
|
}
|
|
|
- .introduce-info{
|
|
|
+ .introduce-info {
|
|
|
font-size: 20px;
|
|
|
}
|
|
|
}
|