all
This commit is contained in:
我是个攻城狮
@@ -0,0 +1,229 @@
|
||||
<template>
|
||||
<!--
|
||||
作者：hah
|
||||
时间：2019-10-24
|
||||
描述：后台系统头部
|
||||
-->
|
||||
<div class="common-header">
|
||||
<div class="breadcrumb">
|
||||
<!--一般的标题显示-->
|
||||
<div class="baseInfo-left-base d-s-c">
|
||||
<span class="name">{{ menu_title }}</span>
|
||||
<!--插件切换-->
|
||||
<div class="el-tabs-container">
|
||||
<el-tabs v-model="activeValue" @tab-click="tabClick">
|
||||
<el-tab-pane :label="item.value" :name="item.key" v-for="(item, index) in tabList" :key="index"></el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="header-navbar">
|
||||
<!-- <div class="header-navbar-icon">
|
||||
<span class="gray">当前版本：{{baseInfo.version}}</span>
|
||||
</div> -->
|
||||
<div class="header-navbar-icon">
|
||||
<!-- <span class="ml4 icon iconfont icon-hiuyuan"></span> -->
|
||||
<span class="ml4 icon iconfont icon-geren9"></span>
|
||||
<span class="text ml4 blue">{{ baseInfo.user.user_name }}，欢迎您！</span>
|
||||
</div>
|
||||
<div class="header-navbar-icon"><span class="gray">|</span></div>
|
||||
<div class="header-navbar-icon" @click="passwordFunc()"><span class="text">修改密码</span></div>
|
||||
<div class="header-navbar-icon login-out" @click="login_out()">
|
||||
<span class="icon iconfont icon-tuichu"></span>
|
||||
<span class="text ml4">退出</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--修改密码-->
|
||||
<UpdatePassword v-if="is_password" @close="closeFunc"></UpdatePassword>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import bus from '@/utils/eventBus.js';
|
||||
import AuthApi from '@/api/auth.js';
|
||||
import UserApi from '@/api/user.js';
|
||||
import {
|
||||
setCookie,
|
||||
delCookie,
|
||||
getCookie,
|
||||
deleteSessionStorage
|
||||
} from '@/utils/base.js';
|
||||
import store from '@/store';
|
||||
import UpdatePassword from './part/UpdatePassword.vue';
|
||||
export default {
|
||||
components: {
|
||||
UpdatePassword
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
/*菜单名称*/
|
||||
menu_title: '菜单',
|
||||
/*切换菜单*/
|
||||
tabList: [],
|
||||
/*切换选中*/
|
||||
activeValue: 0,
|
||||
/*是否修改密码*/
|
||||
is_password: false,
|
||||
/*tab切换类别*/
|
||||
tab_type: ''
|
||||
};
|
||||
},
|
||||
inject: ['baseInfo'],
|
||||
created() {
|
||||
/*监听菜单传过来的值*/
|
||||
bus.$on('menuName', res => {
|
||||
this.menu_title = res;
|
||||
if(this.menu_title=='好游戏评分'){
|
||||
this.menu_title = '产品库';
|
||||
}
|
||||
if(this.menu_title=='基础数据管理'){
|
||||
this.menu_title = '用户管理';
|
||||
}
|
||||
});
|
||||
|
||||
/*监听传插件的值*/
|
||||
bus.$on('tabData', res => {
|
||||
this.tabList = res.list;
|
||||
this.activeValue = res.active;
|
||||
this.tab_type = res.tab_type;
|
||||
});
|
||||
|
||||
//发送给其它组件头部加载完成
|
||||
bus.$emit('headLoad', true);
|
||||
|
||||
},
|
||||
beforeDestroy() {
|
||||
bus.$off('menuName');
|
||||
bus.$off('tabData');
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
|
||||
/*退出登录*/
|
||||
login_out() {
|
||||
this.$confirm('此操作将退出登录, 是否继续?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
})
|
||||
.then(() => {
|
||||
UserApi.loginOut({}, true)
|
||||
.then(data => {
|
||||
/*删除登录状态*/
|
||||
delCookie('isLogin');
|
||||
/*删除基本信息*/
|
||||
delCookie('baseInfo');
|
||||
/*删除用户菜单*/
|
||||
deleteSessionStorage('rolelist');
|
||||
/*删除用户权限*/
|
||||
deleteSessionStorage('authlist');
|
||||
/*返回登录页*/
|
||||
this.$router.replace({
|
||||
path: '/login'
|
||||
});
|
||||
/*删除stores数据*/
|
||||
this.$store.commit('user/setState', {
|
||||
key: 'roles',
|
||||
val: null
|
||||
});
|
||||
/*刷新页面*/
|
||||
location.reload();
|
||||
})
|
||||
.catch(error => {});
|
||||
})
|
||||
.catch(() => {
|
||||
// this.$message({
|
||||
// type: 'info',
|
||||
// message: '已取消退出'
|
||||
// });
|
||||
});
|
||||
},
|
||||
|
||||
/*点击跳转*/
|
||||
tabClick(e) {
|
||||
/*分销*/
|
||||
if (this.tab_type == 'agent') {
|
||||
this.$router.push({
|
||||
path: '/plus/agent/index',
|
||||
query: {
|
||||
type: e.name
|
||||
}
|
||||
});
|
||||
}
|
||||
/*优惠券*/
|
||||
if (this.tab_type == 'coupon') {
|
||||
this.$router.push({
|
||||
path: '/plus/coupon/index',
|
||||
query: {
|
||||
type: e.name
|
||||
}
|
||||
});
|
||||
}
|
||||
/*积分商城*/
|
||||
if (this.tab_type == 'points') {
|
||||
this.$router.push({
|
||||
path: '/plus/points/index',
|
||||
query: {
|
||||
type: e.name
|
||||
}
|
||||
});
|
||||
}
|
||||
/*app设置*/
|
||||
if (this.tab_type == 'appopen') {
|
||||
this.$router.push({
|
||||
path: '/appsetting/appopen/event',
|
||||
query: {
|
||||
type: e.name
|
||||
}
|
||||
});
|
||||
}
|
||||
/*app设置*/
|
||||
if (this.tab_type == 'table') {
|
||||
this.$router.push({
|
||||
path: '/plus/table/event',
|
||||
query: {
|
||||
type: e.name
|
||||
}
|
||||
});
|
||||
}
|
||||
bus.$emit('activeValue', this.activeValue);
|
||||
},
|
||||
|
||||
/*修改密码*/
|
||||
passwordFunc() {
|
||||
this.is_password = true;
|
||||
},
|
||||
|
||||
/*关闭修改密码*/
|
||||
closeFunc() {
|
||||
this.is_password = false;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.common-header .el-tabs__nav-wrap::after {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.common-header .el-tabs-container {
|
||||
margin-left: 20px;
|
||||
padding-left: 20px;
|
||||
border-left: 1px solid #EEEEEE;
|
||||
}
|
||||
|
||||
.common-header .el-tabs__header {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.login-out .icon-tuichu {
|
||||
color: red;
|
||||
}
|
||||
|
||||
.header-navbar-icon .icon-geren9 {
|
||||
font-size: 20px;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user