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
<template>
<a-layout class="home_layout index_body" style="width: 100%">
<a-layout>
<a-layout-content class="layout_container" style="background: #fff">
<div style="padding: 10px;">
<a-tabs type="card" :tabBarGutter="10" v-if="systemType" v-model="$store.state.activeKeyInfo"
@change="onChange">
<a-tab-pane v-for="(item, index) in menuList" :key="item.frontActionUrl">
<span slot="tab">
<span>{{ item.name }}<span>(0)</span></span>
</span>
</a-tab-pane>
<a-tab-pane :key="111">
<span slot="tab">
<span>{{ unitInfo.unitName }}</span>
</span>
</a-tab-pane>
</a-tabs>
<router-view></router-view>
</div>
</a-layout-content>
<div style="clear: both"></div>
</a-layout>
</a-layout>
</template>
<script>
import {getCookie} from "./utils/common";
import {menuTest} from "./utils/testDate";
export default {
data() {
return {
// 菜单
menuList: [],
// 选中的菜单
activeItem: [],
// tabs标签
tabs: [],
// 选中的tabs标签
activeKey: '',
showChildren: false,
menuTest,
unitInfo: {},
systemType: sessionStorage.getItem("systemType")
}
},
created() {
//获取妇幼权限和登录基本信息
let cookieToken = "29cc399b-af98-4fbd-8984-ecbd97f125b7";
if (process.env.NODE_ENV != "dev") {
cookieToken = getCookie('bGNnd3lwdF9hdA');
}
if (cookieToken) {
window.sessionStorage.setItem('token', 'bearer' + ' ' + cookieToken);
let query = this.$route.query;
let par = {menuId: query.menuId};
this.$api.fyManage.fetchFYLoginUser(par).then(({data}) => {
this.unitInfo = data.unitInfo;
window.sessionStorage.setItem('userInfo', JSON.stringify(data.userInfo));
window.sessionStorage.setItem('allEnum', JSON.stringify(data.enumValueList));
window.sessionStorage.setItem('unitInfo', JSON.stringify(data.unitInfo));
this.setInitMenuInfo()
this.showChildren = true
})
} else {
window.top.postMessage({messageType: "LOGOUT"}, '*')//给最顶层窗口发送token失效通知
}
},
methods: {
setInitMenuInfo() {//设置默认菜单和菜单缓存
this.menuList = this.menuTest;
},
// 点击tabs标签
onChange(activeKey) {
this.activeKey = activeKey;
window.sessionStorage.setItem('activeKey', this.activeKey);
this.$store.commit('changeActKey', this.activeKey)
console.log(this.$store.state.tabsInfo);
this.menuList.forEach((item, i) => {
console.log(item.frontActionUrl, item)
if (item.frontActionUrl === activeKey) {
this.activeItem = [item.frontActionUrl];
window.sessionStorage.setItem('activeItem', this.activeItem);
this.$router.push(item.frontActionUrl);
}
});
},
},
}
</script>
<style lang="less">
.index_body {
.ant-tabs-bar {
border-bottom: 1px solid rgba(255, 77, 128, .2) !important;
}
.ant-tabs-nav-scroll {
margin-left: 0px !important;
}
.ant-tabs.ant-tabs-card .ant-tabs-card-bar .ant-tabs-nav-container {
height: 35px !important;
}
.ant-tabs.ant-tabs-card .ant-tabs-card-bar .ant-tabs-tab {
height: 35px !important;
color: #F8F8FF !important;
line-height: 35px !important;
background: rgba(255, 77, 128, .5);
border-bottom: 0px solid #FF4D80;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
.ant-tabs.ant-tabs-card .ant-tabs-card-bar .ant-tabs-tab-active {
height: 35px !important;
color: #fff;
background: #FF4D80;
border-color: #FF4D80;
border-bottom: 0px solid #FF4D80;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
}
</style>