130 lines
3.2 KiB
Vue
130 lines
3.2 KiB
Vue
<template>
|
|
<div>
|
|
|
|
<a-dropdown>
|
|
<div class="header-avatar" style="cursor: pointer">
|
|
<a-avatar class="avatar" size="small" shape="circle" :src="user.avatar" />
|
|
<span class="name">{{ user.nickname }}</span>
|
|
</div>
|
|
<a-menu :class="['avatar-menu']" slot="overlay">
|
|
<a-menu-item @click="adminUser" v-if="!isMiddleAdmin()">
|
|
<a-icon type="user" />
|
|
<span>用户管理</span>
|
|
</a-menu-item>
|
|
<a-menu-item @click="adminMiddle" v-else>
|
|
<a-icon type="user" />
|
|
<span>用户管理</span>
|
|
</a-menu-item>
|
|
<a-menu-item @click="adminRole" v-if="!isMiddleAdmin()">
|
|
<a-icon type="appstore" />
|
|
<span>权限管理</span>
|
|
</a-menu-item>
|
|
<a-menu-item @click="showCompany" v-if="!isMiddleAdmin()">
|
|
<a-icon type="compass" />
|
|
<span>切换公司</span>
|
|
</a-menu-item>
|
|
<a-menu-divider />
|
|
<a-menu-item @click="logout">
|
|
<a-icon style="margin-right: 8px;" type="poweroff" />
|
|
<span>退出登录</span>
|
|
</a-menu-item>
|
|
</a-menu>
|
|
</a-dropdown>
|
|
|
|
<switch-company v-model="companyShow" :data="companyData" @confirm="companyconfirm"
|
|
ref="switchCompany"></switch-company>
|
|
|
|
<login-actions ref="loginActions"></login-actions>
|
|
</div>
|
|
|
|
</template>
|
|
|
|
<script>
|
|
import { mapGetters } from 'vuex' // 加载vuex的mapGetters辅助函数
|
|
import { logout } from '@/services/base/user' // 加载退出登录的接口
|
|
|
|
import LoginActions from '@/components/login/loginActions.vue'
|
|
import { switchCompany, companyList } from '@/services/base/user'
|
|
import { USER_MODEL } from '@/services/base/api.js';
|
|
|
|
export default {
|
|
name: 'HeaderAvatar', // 组件名称 头部头像
|
|
components: { LoginActions },
|
|
computed: {
|
|
...mapGetters('account', ['user']), // 获取用户信息
|
|
},
|
|
|
|
data() {
|
|
return {
|
|
companyShow: false,
|
|
companyData: []
|
|
};
|
|
},
|
|
methods: {
|
|
adminMiddle() {
|
|
this.$router.push('/AdminUser/AdminUserList');
|
|
},
|
|
adminUser() {
|
|
this.$router.push('/BaseAdmin/BaseAdminList');
|
|
},
|
|
adminRole() {
|
|
this.$router.push('/BasePermission/RoleList');
|
|
},
|
|
logout() { // 退出登录
|
|
logout() // 调用退出登录接口
|
|
this.$router.push('/login') // 跳转到登录页
|
|
},
|
|
showCompany() {
|
|
this.companyShow = true;
|
|
|
|
companyList().then(result => {
|
|
result = result.data;
|
|
this.companyData = result.data.company_switch;
|
|
});
|
|
},
|
|
isMiddleAdmin() {
|
|
return USER_MODEL == "AdminUser";
|
|
},
|
|
companyconfirm({ row }) {
|
|
if (!row) {
|
|
return;
|
|
}
|
|
this.companyShow = false;
|
|
switchCompany(row.id).then(result => {
|
|
result = result.data;
|
|
this.$refs.loginActions.afterLoginSuccess({
|
|
token: result.data.access_token,
|
|
access_expire: result.data.access_expire,
|
|
uid: result.data.uid,
|
|
closeOthers : true,
|
|
msg: "切换成功"
|
|
});
|
|
});
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="less">
|
|
.header-avatar {
|
|
display: inline-flex;
|
|
|
|
.avatar,
|
|
.name {
|
|
align-self: center;
|
|
}
|
|
|
|
.avatar {
|
|
margin-right: 8px;
|
|
}
|
|
|
|
.name {
|
|
font-weight: 500;
|
|
}
|
|
}
|
|
|
|
.avatar-menu {
|
|
width: 150px;
|
|
}
|
|
</style>
|