index.vue
3.76 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
<template>
<div class="home">
<el-container class="home-box">
<el-header class="headers">
<img class="logoImg" src="../../assets/img/home/logo.png" alt="">
<div class="headRight">
<span>2019-11-15 16:50 星期一</span>
<img src="../../assets/img/home/user.png" alt="">
<span class="exit">退出<i class="el-icon-arrow-down"></i></span>
</div>
</el-header>
<el-container style="min-height:calc(100vh - 64px);">
<el-aside :width="menuwidth">
<menus @setTopBar="setTopBar" ref="leftmenu"></menus>
</el-aside>
<el-main>
<div class="nav">
<div class="nav-tag-box">
<el-tag
v-for="(tag,index) in topbarArr" :key="index"
closable
@close="closetag(tag,index)"
@click="toPath(tag)"
>
<i :class="tag.icon"></i>
{{tag.name}}
</el-tag>
</div>
</div>
<router-view></router-view>
</el-main>
</el-container>
</el-container>
</div>
</template>
<script>
// import HelloWorld from "@/components/HelloWorld.vue";
import menus from './menu'
export default {
name: "x",
data(){
return{
isCollapse: false,
conHeight:0,
menuwidth:"254px",
full:false,
topbarArr:[]
};
},
methods:{
setTopBar(data){
if(this.topbarArr.length < 1) {
this.topbarArr.push(data)
}
let hasBar = false;
for(let i = 0; i < this.topbarArr.length; i++) {
if(this.topbarArr[i].path == data.path){
hasBar = true
}
}
if(!hasBar) {
this.topbarArr.push(data)
}
},
toPath(data){
this.$refs.leftmenu.handleSelect(data.path)
},
closetag(data,index){
this.topbarArr.splice(index,1)
}
},
created(){
this.$api.device.getDev().then(m => {
if(m.length < 1) {
// this.infoFun('未发现运维服务，请联系相关人员')
this.$message({
message: '未发现运维服务，请联系相关人员',
type: 'error'
});
this.setDevunid('9cb6e39adc5176b81879f6c22f1d963')
return
}
this.setDevunid(m[0].dev_unid)
})
},
components:{
menus
},
mounted(){
console.log(this.permission_routers)
this.conHeight=window.innerHeight-65;
console.log(this.conHeight)
document.addEventListener("keydown", (event)=>{
var e = event || window.event || arguments.callee.caller.arguments[0];
if(e && e.keyCode==122 ){ // 按 Esc
if(this.full) {
this.menuwidth = "254px";
this.full = false
return
}
this.menuwidth = 0
this.full = true
}
});
},
beforeMount() {
//建立ws连接
let uid = localStorage.getItem('user_unid');
let clientid = localStorage.getItem('client_unid');
this.$api.device.getGlobalWs(uid, clientid).then(data => {
this.globalWs = new WebSocket(data.ws_url);
let ary = data.ws_url.split('/');
localStorage.setItem('cennect_unid',ary[ary.length-1])
//监听成功
this.globalWs.onopen = function() {
console.log('全局推送服务连接成功')
}
//监听断开
this.globalWs.onclose = function(){
console.log('全局推送服务连接断开')
}
//监听推送信息
// this.globalWs.onmessage = this.wsdeal;
//保持连接
var $this = this
setInterval(function() {
var send_mesage = '{"type":"request","id":"' + new Date().getTime() + '","mts":"' + new Date().getTime() + '","command": "get /wsapi/v1/users/'+localStorage.getItem('cennect_unid')+'/keep_alive"}'
$this.globalWs.send(send_mesage)
}, 20000)
})
},
};
</script>
<style lang="stylus" scoped>
</style>