Merge branch 'xuhongjie' of http://39.101.188.84:7000/suzhou-jichuang-lanhai/Gyyq-Upstairs
commit
ca0d7c4deb
@ -1,186 +1,26 @@
|
|||||||
<template>
|
<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>
|
</template>
|
||||||
|
|
||||||
<script>
|
<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 {
|
export default {
|
||||||
name: "Pc2FbEcharts",
|
name: "roleJudge",
|
||||||
components: {
|
|
||||||
AllArea,
|
|
||||||
FunctionArea,
|
|
||||||
InvestArea,
|
|
||||||
Message,
|
|
||||||
ProjectList,
|
|
||||||
MapArea,
|
|
||||||
},
|
|
||||||
data() {
|
data() {
|
||||||
return {};
|
return {};
|
||||||
},
|
},
|
||||||
mounted() {
|
created(){
|
||||||
|
if(this.$auth.hasRoleOr(["admin", "common"])){//admin,政务
|
||||||
},
|
this.$router.push({path:"/statistics"})
|
||||||
methods: {
|
}else{
|
||||||
|
//企业人员
|
||||||
},
|
this.$router.push({path:"/tongjifenxi"})
|
||||||
|
}
|
||||||
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</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…
Reference in new issue