UserMenu.vue
4.11 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
146
147
148
149
<template>
<div class="user-wrapper" :class="theme">
<a-dropdown>
<span class="action action-full ant-dropdown-link user-dropdown-menu">
<a-avatar class="avatar" size="small" :src="getAvatar()"/>
<span v-if="isDesktop()">欢迎您，{{ nickname() }}</span>
</span>
<a-menu slot="overlay" class="user-dropdown-menu-wrapper">
<a-menu-item key="4" @click="updatePassword">
<a-icon type="setting"/>
<span>密码修改</span>
</a-menu-item>
<a-menu-item key="6" @click="clearCache">
<a-icon type="sync"/>
<span>清理缓存</span>
</a-menu-item>
</a-menu>
</a-dropdown>
<span class="action">
<a class="logout_title" href="javascript:;" @click="handleLogout">
<a-icon type="logout"/>
<span v-if="isDesktop()"> 退出登录</span>
</a>
</span>
<user-password ref="userPassword"></user-password>
</div>
</template>
<script>
import UserPassword from './UserPassword'
import { mapActions, mapGetters,mapState } from 'vuex'
import { mixinDevice } from '@/utils/mixin.js'
import { getFileAccessHttpUrl,getAction } from "@/api/manage"
import Vue from 'vue'
import { UI_CACHE_DB_DICT_DATA } from "@/store/mutation-types"
export default {
name: "UserMenu",
mixins: [mixinDevice],
data(){
return{
}
},
components: {
UserPassword
},
props: {
theme: {
type: String,
required: false,
default: 'dark'
}
},
created() {
},
mounted() {
//如果是单点登录模式
if (process.env.VUE_APP_SSO == 'true') {
let depart = this.userInfo().orgCode
if (!depart) {
}
}
},
computed: {
...mapState({
// 后台菜单
permissionMenuList: state => state.user.permissionList
})
},
methods: {
...mapActions(["Logout"]),
...mapGetters(["nickname", "avatar","userInfo"]),
getAvatar(){
return getFileAccessHttpUrl(this.avatar())
},
handleLogout() {
const that = this
this.$confirm({
title: '提示',
content: '真的要注销登录吗 ?',
onOk() {
return that.Logout({}).then(() => {
// update-begin author:wangshuai date:20200601 for: 退出登录跳转登录页面
that.$router.push({ path: '/user/login' });
window.location.reload()
// update-end author:wangshuai date:20200601 for: 退出登录跳转登录页面
}).catch(err => {
that.$message.error({
title: '错误',
description: err.message
})
})
},
onCancel() {
},
});
},
updatePassword(){
let username = this.userInfo().username
this.$refs.userPassword.show(username)
},
clearCache(){
getAction("sys/dict/refleshCache").then((res) => {
if (res.success) {
//重新加载缓存
getAction("sys/dict/queryAllDictItems").then((res) => {
if (res.success) {
Vue.ls.remove(UI_CACHE_DB_DICT_DATA)
Vue.ls.set(UI_CACHE_DB_DICT_DATA, res.result, 7 * 24 * 60 * 60 * 1000)
}
})
this.$message.success("刷新缓存完成！");
}
}).catch(e=>{
this.$message.warn("刷新缓存失败！");
console.log("刷新失败",e)
})
}
}
}
</script>
<style lang="less" scoped>
.user-wrapper .search-input {
width: 180px;
color: inherit;
/deep/ .ant-select-selection {
background-color: inherit;
border: 0;
border-bottom: 1px solid white;
&__placeholder, &__field__placeholder {
color: inherit;
}
}
}
/* update-end author:sunjianlei date:20191220 for: 解决全局样式冲突问题 */
/* update_end author:zhaoxin date:20191129 for: 让搜索框颜色能随主题颜色变换*/
</style>
<style scoped>
.logout_title {
color: inherit;
text-decoration: none;
}
</style>