根据角色登录后验证菜单权限

xuhongjie
许宏杰 1 month ago
parent bb0401c177
commit aeda19ab6e

@ -70,14 +70,14 @@ export const constantRoutes = [
path: "",
component: Layout,
redirect: "index",
children: [
{
path: "index",
component: () => import("@/views/index"),
name: "Index",
meta: { title: "统计分析", icon: "icon-tjfx-1", affix: true },
},
],
children: [],
},
{
path: "/index",
component: () => import("@/views/index"),
name: "Index",
meta: { title: "角色判断", icon: "icon-tjfx-1" },
hidden:true
},
{
path: "/user",

@ -1,186 +1,26 @@
<template>
<div></div>
<div class="grid-container">
<div class="grid-item item-1">
<!-- 整体项目情况 -->
<div class="allarea">
<AllArea />
</div>
</div>
<div class="grid-item item-2">
<!-- 消息通知 -->
<div class="itemhead">
<span>消息通知</span>
</div>
<div class="mainarea">
<Message />
</div>
</div>
<div class="grid-item item-3">
<!-- 功能区 -->
<div class="itemhead">
<span>功能区</span>
</div>
<div class="relaitem">
<div class="itemsall">
<span>384</span>
<span>项目总数</span>
</div>
<FunctionArea />
</div>
</div>
<div class="grid-item item-4">
<!-- 项目列表 -->
<div class="itemhead">
<span>项目列表</span>
</div>
<div class="mainarea">
<ProjectList />
</div>
</div>
<div class="grid-item item-5">
<!-- 投资区 -->
<div class="itemhead">
<span>投资主体</span>
</div>
<div class="relaitem">
<div class="itemsall">
<span>112</span>
<span>项目总数</span>
</div>
<InvestArea />
</div>
</div>
<div class="grid-item item-6">
<!-- 地图模块 -->
<div>
<MapArea />
</div>
</div>
</div>
</template>
<script>
import AllArea from '@/views/components/analysis/all.vue'
import FunctionArea from '@/views/components/analysis/function.vue'
import InvestArea from '@/views/components/analysis/invest.vue'
import Message from '@/views/components/analysis/message.vue'
import ProjectList from '@/views/components/analysis/projectList.vue'
import MapArea from '@/views/components/analysis/map.vue'
//
export default {
name: "Pc2FbEcharts",
components: {
AllArea,
FunctionArea,
InvestArea,
Message,
ProjectList,
MapArea,
},
name: "roleJudge",
data() {
return {};
},
mounted() {
},
methods: {
},
created(){
if(this.$auth.hasRoleOr(["admin", "common"])){//admin,
this.$router.push({path:"/statistics"})
}else{
//
this.$router.push({path:"/tongjifenxi"})
}
}
};
</script>
<style scoped>
.grid-container {
display: grid;
grid-template-columns: repeat(3, 1fr);
/* 三列 */
grid-template-rows: auto auto auto;
/* 三行 */
gap: 1rem;
/* 模块之间的间隔 */
padding: 1rem;
/* 容器内边距 */
}
.grid-item {
background-color: #FFFFFF;
border-radius: 0.5rem 0.5rem 0.5rem 0.5rem;
}
.itemhead {
width: 100%;
border-left: 0.25rem solid #2B62F1;
margin: 0.94rem 0;
height: 1.25rem;
display: flex;
align-items: center;
}
.relaitem{
position: relative;
}
.itemsall{
position: absolute;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
top: 5.5rem;
left: 7.2rem;
}
.itemsall span:nth-child(1){
font-family: DIN, DIN;
font-weight: 500;
font-size: 1.75rem;
color: #292C33;
line-height: 2.44rem;
text-align: left;
font-style: normal;
text-transform: none;
}
.itemsall span:nth-child(2){
font-family: AlibabaPuHuiTi, AlibabaPuHuiTi;
font-weight: 400;
font-size: 0.88rem;
color: #9E9E9E;
line-height: 1.25rem;
text-align: left;
font-style: normal;
text-transform: none;
}
.itemhead span {
margin-left: 1rem;
font-family: AlibabaPuHuiTi, AlibabaPuHuiTi;
font-weight: 600;
font-size: 1rem;
color: #3D424C;
line-height: 1.69rem;
text-align: left;
font-style: normal;
text-transform: none;
}
.mainarea{
padding: 0rem 0rem 0 1.4rem;
overflow: auto;
}
/* 第一行:第一个模块占两列 */
.item-1 {
grid-column: span 2;
background-image: url(../../src/assets/images/allbg.png);
background-size: 100% 100%;
background-repeat: no-repeat;
}
.allarea {
width: 100%;
height: 14.5rem;
padding: 1rem 1.5rem;
}
/* 最后一行:一个模块占一整行 */
.item-6 {
grid-column: span 3;
/* 占三列 */
}
</style>

@ -0,0 +1,186 @@
<template>
<div class="grid-container">
<div class="grid-item item-1">
<!-- 整体项目情况 -->
<div class="allarea">
<AllArea />
</div>
</div>
<div class="grid-item item-2">
<!-- 消息通知 -->
<div class="itemhead">
<span>消息通知</span>
</div>
<div class="mainarea">
<Message />
</div>
</div>
<div class="grid-item item-3">
<!-- 功能区 -->
<div class="itemhead">
<span>功能区</span>
</div>
<div class="relaitem">
<div class="itemsall">
<span>384</span>
<span>项目总数</span>
</div>
<FunctionArea />
</div>
</div>
<div class="grid-item item-4">
<!-- 项目列表 -->
<div class="itemhead">
<span>项目列表</span>
</div>
<div class="mainarea">
<ProjectList />
</div>
</div>
<div class="grid-item item-5">
<!-- 投资区 -->
<div class="itemhead">
<span>投资主体</span>
</div>
<div class="relaitem">
<div class="itemsall">
<span>112</span>
<span>项目总数</span>
</div>
<InvestArea />
</div>
</div>
<div class="grid-item item-6">
<!-- 地图模块 -->
<div>
<MapArea />
</div>
</div>
</div>
</template>
<script>
import AllArea from '@/views/components/analysis/all.vue'
import FunctionArea from '@/views/components/analysis/function.vue'
import InvestArea from '@/views/components/analysis/invest.vue'
import Message from '@/views/components/analysis/message.vue'
import ProjectList from '@/views/components/analysis/projectList.vue'
import MapArea from '@/views/components/analysis/map.vue'
export default {
name: "Pc2FbEcharts",
components: {
AllArea,
FunctionArea,
InvestArea,
Message,
ProjectList,
MapArea,
},
data() {
return {};
},
mounted() {
},
methods: {
},
};
</script>
<style scoped>
.grid-container {
display: grid;
grid-template-columns: repeat(3, 1fr);
/* 三列 */
grid-template-rows: auto auto auto;
/* 三行 */
gap: 1rem;
/* 模块之间的间隔 */
padding: 1rem;
/* 容器内边距 */
}
.grid-item {
background-color: #FFFFFF;
border-radius: 0.5rem 0.5rem 0.5rem 0.5rem;
}
.itemhead {
width: 100%;
border-left: 0.25rem solid #2B62F1;
margin: 0.94rem 0;
height: 1.25rem;
display: flex;
align-items: center;
}
.relaitem{
position: relative;
}
.itemsall{
position: absolute;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
top: 5.5rem;
left: 7.2rem;
}
.itemsall span:nth-child(1){
font-family: DIN, DIN;
font-weight: 500;
font-size: 1.75rem;
color: #292C33;
line-height: 2.44rem;
text-align: left;
font-style: normal;
text-transform: none;
}
.itemsall span:nth-child(2){
font-family: AlibabaPuHuiTi, AlibabaPuHuiTi;
font-weight: 400;
font-size: 0.88rem;
color: #9E9E9E;
line-height: 1.25rem;
text-align: left;
font-style: normal;
text-transform: none;
}
.itemhead span {
margin-left: 1rem;
font-family: AlibabaPuHuiTi, AlibabaPuHuiTi;
font-weight: 600;
font-size: 1rem;
color: #3D424C;
line-height: 1.69rem;
text-align: left;
font-style: normal;
text-transform: none;
}
.mainarea{
padding: 0rem 0rem 0 1.4rem;
overflow: auto;
}
/* 第一行:第一个模块占两列 */
.item-1 {
grid-column: span 2;
background-image: url('~@/assets/images/allbg.png');
background-size: 100% 100%;
background-repeat: no-repeat;
}
.allarea {
width: 100%;
height: 14.5rem;
padding: 1rem 1.5rem;
}
/* 最后一行:一个模块占一整行 */
.item-6 {
grid-column: span 3;
/* 占三列 */
}
</style>
Loading…
Cancel
Save