331 lines
13 KiB
JavaScript
331 lines
13 KiB
JavaScript
/**
|
|
* 顶部header
|
|
*/
|
|
Vue.component("screen-header", {
|
|
template: `
|
|
<div :class="red?'head-title red-head':'head-title'">
|
|
<div class="head-title-label">
|
|
数字化集成管控平台
|
|
</div>
|
|
<div class="head-title-tab">
|
|
<div v-for="(item,i) in menuData">
|
|
<div v-if="item.child.length==0" :class="chooseMenu.mainMenu == i?'head-nav active':'head-nav'" @click="pageJump(i,item.menuDeptUrl,item.menuProjectUrl)">{{item.menuName}}</div>
|
|
<header-btn :red="red" v-if="item.child.length!=0" :label="item.menuName" :nav="i" :index="i" :menu="item" @showsmallui="showsmallui" :list="item.child"></header-btn>
|
|
</div>
|
|
</div>
|
|
<div class="head-title-select" @mouseleave="hideScreenUl">
|
|
<div class="head-select">
|
|
<input type="text" :value="localStorage.text" @click="showScreenUl" placeholder="请选择项目" readonly>
|
|
</div>
|
|
<el-collapse-transition>
|
|
<ul class="header-screen-ul" v-show="show">
|
|
<li v-for="item in data" @click="setScreenLi(item)">{{item.text}}</li>
|
|
</ul>
|
|
</el-collapse-transition>
|
|
</div>
|
|
<div class="head-title-date">
|
|
<div class="head-title-weather">
|
|
<img :src="weatherImg">
|
|
<span>{{dayWeather}}</span>
|
|
<span>{{temperature}}</span>
|
|
</div>
|
|
<div class="head-title-time">
|
|
<div class="head-title-date-con">{{date}}</div>
|
|
<div class="head-title-time-con">{{time}}</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
`,
|
|
props: {
|
|
nav:{
|
|
type:Number
|
|
},
|
|
red:{
|
|
type:String
|
|
},
|
|
item:{
|
|
type:Number
|
|
},
|
|
},
|
|
data() {
|
|
return {
|
|
dayWeather: undefined,
|
|
weatherImg: undefined,
|
|
temperature: undefined,
|
|
chooseMenu:{},
|
|
show: false,
|
|
data: [],
|
|
timerID: undefined,
|
|
time: '',
|
|
date: '',
|
|
week: '',
|
|
menu: [],
|
|
localStorage: JSON.parse(localStorage.getItem("data")),
|
|
menuData:[],//菜单列表数据
|
|
}
|
|
},
|
|
mounted(){
|
|
this.timerID = setInterval(this.updateTime, 1000);
|
|
this.updateTime();
|
|
this.tableProject();
|
|
this.menuList();
|
|
this.init();
|
|
},
|
|
methods: {
|
|
init(){
|
|
this.localStorage=JSON.parse(localStorage.getItem("data"))
|
|
this.chooseMenu = localStorage.getItem("chooseMenu");
|
|
if(!this.chooseMenu){
|
|
this.chooseMenu = {}
|
|
} else {
|
|
this.chooseMenu = JSON.parse(localStorage.getItem("chooseMenu"))
|
|
}
|
|
this.getWeather();
|
|
},
|
|
//页面条状
|
|
pageJump(n,url,itemurl){
|
|
if(this.localStorage.type == 1){
|
|
if(url){
|
|
this.chooseMenu = {
|
|
mainMenu:n,
|
|
}
|
|
localStorage.setItem("chooseMenu",JSON.stringify(this.chooseMenu));
|
|
location.href = url
|
|
}else{
|
|
this.$notify({
|
|
title: '提示',
|
|
message: '功能升级中，敬请期待！',
|
|
type: 'warning'
|
|
});
|
|
}
|
|
}else{
|
|
if(itemurl){
|
|
this.chooseMenu = {
|
|
mainMenu:n
|
|
}
|
|
localStorage.setItem("chooseMenu",JSON.stringify(this.chooseMenu));
|
|
location.href = itemurl
|
|
}else{
|
|
this.$notify({
|
|
title: '提示',
|
|
message: '功能升级中，敬请期待！',
|
|
type: 'warning'
|
|
});
|
|
}
|
|
}
|
|
},
|
|
|
|
pageJumpOther(url) {
|
|
location.href = url
|
|
},
|
|
|
|
showScreenUl(){
|
|
this.show = true
|
|
this.$emit('showui',true);
|
|
},
|
|
hideScreenUl(){
|
|
this.show = false
|
|
this.$emit('showui',false);
|
|
},
|
|
/**
|
|
* 点击切换项目
|
|
* @param item
|
|
*/
|
|
setScreenLi(item){
|
|
localStorage.setItem("data",JSON.stringify(item));
|
|
this.localStorage = JSON.parse(localStorage.getItem("data"));
|
|
// this.$emit('itemdata',item);
|
|
this.show = false;
|
|
this.menuList1();
|
|
},
|
|
|
|
//时间方法
|
|
updateTime(){
|
|
var cd = new Date();
|
|
this.time = this.zeroPadding(cd.getHours(), 2) + ':' + this.zeroPadding(cd.getMinutes(), 2) + ':' + this.zeroPadding(cd.getSeconds(), 2);
|
|
this.date = this.zeroPadding(cd.getFullYear(), 4) + '年' + this.zeroPadding(cd.getMonth()+1, 2) + '月' + this.zeroPadding(cd.getDate(), 2)+'日';
|
|
},
|
|
zeroPadding(num, digit) {
|
|
var zero = '';
|
|
for(var i = 0; i < digit; i++) {
|
|
zero += '0';
|
|
}
|
|
return (zero + num).slice(-digit);
|
|
},
|
|
|
|
showsmallui(e){
|
|
this.$emit('showsmallui2',e);
|
|
},
|
|
|
|
/**
|
|
* 获取当前用户项目筛选列表
|
|
*/
|
|
tableProject() {
|
|
axios({
|
|
method: 'post',
|
|
url: "/weixin/screen/listProjectInfo",
|
|
}).then(res => {
|
|
if(res.data.code == 200) {
|
|
let flag = 0;
|
|
var data = res.data.data
|
|
data.map(x => {
|
|
if(x.id == '0'){
|
|
x.type = 1
|
|
}else{
|
|
x.type = 2
|
|
}
|
|
})
|
|
this.data = data
|
|
localStorage.setItem("projectList",JSON.stringify(data))
|
|
if(localStorage.getItem("data") == "{}" || localStorage.getItem("data") == null){
|
|
localStorage.setItem("data",JSON.stringify(data[0]));
|
|
this.localStorage = JSON.parse(localStorage.getItem("data"));
|
|
this.$emit('itemdata',data[0]);
|
|
} else {
|
|
for(let i = 0; i < data.length; i++){
|
|
if(JSON.parse(localStorage.getItem("data")).id == data[i].id){
|
|
if(
|
|
JSON.stringify(localStorage.getItem("data")).clxh == null
|
|
||
|
|
!JSON.stringify(localStorage.getItem("data")).clxh
|
|
)
|
|
{
|
|
localStorage.setItem("data",JSON.stringify(data[i]))
|
|
}
|
|
flag = 1;
|
|
break;
|
|
}
|
|
}
|
|
if(flag == 1){
|
|
//this.$emit('itemdata',data[0]);
|
|
} else {
|
|
localStorage.setItem("data",JSON.stringify(data[0]));
|
|
this.localStorage = JSON.parse(localStorage.getItem("data"));
|
|
this.$emit('itemdata',data[0]);
|
|
}
|
|
}
|
|
}
|
|
})
|
|
},
|
|
|
|
/**
|
|
* 获取大屏顶部菜单
|
|
*/
|
|
menuList() {
|
|
axios.post("/screen/menuconfig/getScreenMenuListByProjectId",{
|
|
projectId: JSON.parse(localStorage.getItem("data")).id
|
|
}).then(res => {
|
|
let datas = res.data.rows;
|
|
let dataParent = [];
|
|
for (let i = 0; i < datas.length; i++) {
|
|
if (datas[i].parentId == undefined || datas[i].parentId == null || datas[i].parentId == '') {
|
|
//父层级数据生成
|
|
dataParent.push(datas[i]);
|
|
}
|
|
}
|
|
//循环遍历父层级数据
|
|
for (let i = 0; i < dataParent.length; i++) {
|
|
let dataChild = [];
|
|
for (let k = 0; k < datas.length; k++) {
|
|
//匹配到子层级后
|
|
if (datas[k].parentId == dataParent[i].menuId) {
|
|
datas[k].text = datas[k].menuName;
|
|
datas[k].url = this.localStorage.type == 1?datas[k].menuDeptUrl:datas[k].menuProjectUrl;
|
|
dataChild.push(datas[k]);
|
|
}
|
|
}
|
|
dataParent[i].child = dataChild;
|
|
}
|
|
this.menuData = dataParent;
|
|
})
|
|
},
|
|
|
|
//根据当前选中项目获取大屏顶部菜单并刷新当前页面
|
|
menuList1() {
|
|
axios.post("/screen/menuconfig/getScreenMenuListByProjectId",{
|
|
projectId: JSON.parse(localStorage.getItem("data")).id
|
|
}).then(res => {
|
|
let url = "";
|
|
let datas = res.data.rows;
|
|
let dataParent = [];
|
|
for (let i = 0; i < datas.length; i++) {
|
|
if (datas[i].parentId == undefined || datas[i].parentId == null || datas[i].parentId == '') {
|
|
//父层级数据生成
|
|
dataParent.push(datas[i]);
|
|
if(this.localStorage.type == 1){
|
|
if(datas[i].menuDeptUrl != undefined && datas[i].menuDeptUrl != null && datas[i].menuDeptUrl != ''){
|
|
url = url == ""?datas[i].menuDeptUrl:url;
|
|
}
|
|
}else{
|
|
if(datas[i].menuProjectUrl != undefined && datas[i].menuProjectUrl != null && datas[i].menuProjectUrl != ''){
|
|
url = url == ""?datas[i].menuProjectUrl:url;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
//循环遍历父层级数据
|
|
for (let i = 0; i < dataParent.length; i++) {
|
|
let dataChild = [];
|
|
for (let k = 0; k < datas.length; k++) {
|
|
//匹配到子层级后
|
|
if (datas[k].parentId == dataParent[i].menuId) {
|
|
datas[k].text = datas[k].menuName;
|
|
datas[k].url = this.localStorage.type == 1?datas[k].menuDeptUrl:datas[k].menuProjectUrl;
|
|
dataChild.push(datas[k]);
|
|
if(this.localStorage.type == 1){
|
|
if(datas[k].menuDeptUrl != undefined && datas[k].menuDeptUrl != null && datas[k].menuDeptUrl != ''){
|
|
url = url == ""?datas[k].menuDeptUrl:url;
|
|
}
|
|
}else{
|
|
if(datas[k].menuProjectUrl != undefined && datas[k].menuProjectUrl != null && datas[k].menuProjectUrl != ''){
|
|
url = url == ""?datas[k].menuProjectUrl:url;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
dataParent[i].child = dataChild;
|
|
}
|
|
this.menuData = dataParent;
|
|
if(url){
|
|
location.href = url;
|
|
}
|
|
})
|
|
},
|
|
|
|
/**
|
|
* 查询公司级或项目级天气
|
|
*/
|
|
getWeather(){
|
|
if(
|
|
JSON.parse(localStorage.getItem("data")).id
|
|
&&
|
|
JSON.parse(localStorage.getItem("data")).type == 2
|
|
){
|
|
axios.post("/api/iot/power/getCityWeather",{
|
|
id: JSON.parse(localStorage.getItem("data")).id
|
|
}).then(res => {
|
|
if(res.data.code == 0){
|
|
var data = res.data.data;
|
|
this.weatherImg = data.showapi_res_body.f1.day_weather_pic
|
|
this.dayWeather = data.showapi_res_body.f1.day_weather
|
|
this.temperature = data.showapi_res_body.f1.night_air_temperature + "~" + data.showapi_res_body.f1.day_air_temperature + "℃"
|
|
}
|
|
})
|
|
}else{
|
|
axios({
|
|
method: 'get',
|
|
url: "/mkl/api/getEnvironmentOfCity?areaCode=xian",
|
|
}).then(res => {
|
|
this.dayWeather = res.data.data.f1_day_weather;
|
|
this.weatherImg = res.data.data.f1_day_weather_pic;
|
|
this.temperature = res.data.data.f1_night_air_temperature +"~"+res.data.data.f1_day_air_temperature+"℃" ;
|
|
})
|
|
}
|
|
},
|
|
},
|
|
watch:{
|
|
|
|
}
|
|
|
|
})
|