<template>
|
<div class="common-layout">
|
<div class="content">
|
<div class="top">
|
<div class="header">
|
<div type="link" class="btn" @click="handleLogout">退出</div>
|
<div type="link" class="btn" @click="handleClick('accountManage')" v-if="accountRole">账号管理
|
</div>
|
</div>
|
</div>
|
<div class="list">
|
<div class="item" v-for="item in newSyetemData" :key="item.code">
|
<div class="top">
|
<img src="@/assets/img/logo_png.png">
|
</div>
|
<p class="textStyle">{{item.name}}</p>
|
<el-button class="btnStyle" size="medium" type="primary" @click="handleClick(item.eName)"
|
:disabled="item.isEnabled ? false : true">
|
{{item.textTip}}
|
</el-button>
|
</div>
|
</div>
|
</div>
|
</div>
|
</template>
|
<script>
|
import Cookie from 'js-cookie'
|
import { mapActions } from 'vuex'
|
import AccountManageApi from '@/api/accountManage'
|
import systemData from "@/utils/systemConfig.js"
|
export default {
|
name: "platform",
|
data() {
|
return {
|
accountRole: false,// true:管理员角色 false:不是管理员角色
|
newSyetemData: systemData
|
};
|
},
|
created() {
|
this.getUserSyetemData();
|
},
|
methods: {
|
...mapActions(['clearLoginInfo']),
|
//获取当前用户平台权限、是否是管理员角色
|
async getUserSyetemData() {
|
this.initSyetemData('加载中');
|
const res = await AccountManageApi.getList()
|
if (res.code === '200' && res.data) {
|
let arr = res.data.systemIds && res.data.systemIds.length ? res.data.systemIds : [];
|
this.accountRole = res.data.accountRole;
|
if (arr && arr.length) {
|
Cookie.set('systemAuthIds', arr.join(','),{ expires: 0.5 })
|
}
|
this.updateSyetemData(arr);
|
} else {
|
this.$message.error(res.data.message);
|
}
|
},
|
//更新模块显示样式
|
updateSyetemData(arr) {
|
if (this.newSyetemData.length) {
|
this.newSyetemData.forEach((v1) => {
|
let isE = arr && arr.length ? arr.find((v2) => v2 === v1.code) : null;
|
//isEnabled:true开放权限 false:关闭权限
|
if (isE) {
|
v1.isEnabled = true;
|
v1.textTip = '进入';
|
} else {
|
v1.isEnabled = false;
|
v1.textTip = '暂无权限';
|
}
|
});
|
}
|
},
|
//初始化平台数据
|
initSyetemData(textTip) {
|
if (this.newSyetemData.length) {
|
this.newSyetemData.forEach((v1) => {
|
this.$set(v1, 'isEnabled', false);
|
this.$set(v1, 'textTip', textTip);
|
})
|
}
|
},
|
//点击跳转页面
|
handleClick(e) {
|
let map = {
|
supplyChain: '/dashboard/analysis',
|
operate: '/dash/home',
|
accountManage: '/accountManage'
|
}
|
if (e === 'supplyChain') {
|
let _url = null;
|
if (window.location.hostname === 'localhost') {
|
_url = `${process.env.VUE_APP_GYL_LOCAL_PATH}/#${map[e]}`
|
} else {
|
_url = `${process.env.VUE_APP_GYL_PATH}/#${map[e]}`
|
}
|
window.open(_url, '_self');
|
} else {
|
this.$router.push(map[e])
|
}
|
},
|
//退出
|
handleLogout() {
|
this.clearLoginInfo()
|
this.$router.push('/')
|
}
|
},
|
};
|
</script>
|
|
<style scoped lang="scss">
|
.common-layout {
|
display: flex;
|
flex-direction: column;
|
height: 100vh;
|
overflow: auto;
|
background-color: #f0f2f5;
|
background-image: url("../../assets/img/bg3.jpg");
|
background-repeat: no-repeat;
|
background-position-x: center;
|
// background-position-y: 110px;
|
background-size: 100%;
|
.content {
|
// padding: 32px 0;
|
flex: 1;
|
@media (min-width: 768px) {
|
// padding: 112px 0 24px;
|
}
|
}
|
.top {
|
text-align: center;
|
.header {
|
height: 44px;
|
line-height: 44px;
|
background: #fff;
|
margin-bottom: 20px;
|
display: flex;
|
flex-direction: row;
|
justify-content: space-between;
|
.btn {
|
width: 100px;
|
cursor: pointer;
|
color: rgba(0, 0, 0, 0.65);
|
font-size: 14px;
|
}
|
}
|
}
|
.list {
|
display: flex;
|
flex-direction: row;
|
justify-content: space-evenly;
|
padding: 20px 0;
|
.item {
|
text-align: center;
|
border-radius: 10px;
|
border: 1px solid #ccc;
|
background: #fff;
|
box-shadow: 0 0 10px rgb(145, 142, 142);
|
padding: 10px 5px;
|
.top {
|
img {
|
// width: 160px;
|
height: 140px;
|
border-radius: 10px;
|
}
|
}
|
}
|
}
|
.textStyle {
|
color: rgba(0, 0, 0, 0.65);
|
font-size: 14px;
|
}
|
.btnStyle {
|
margin-top: 8px;
|
}
|
}
|
</style>
|