admin/zhgdyun
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

中建四局-指挥中心：优化页面样式

Browse Source
This commit is contained in:
Luck-Xiaomi 2022-09-15 13:39:10 +08:00
parent 7f3b45ebe6
commit 432c39bfd9
9 changed files with 118 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/header.vue
View File

@ -314,6 +314,12 @@ export default {
return
}
});
// 如果数组为空表示该用户没有权限访问
if (!arr2.length) {
return this.$message.warning('暂无权限');
}
let routeUrl = this.$router.resolve({
path: arr2[0].modulePath,
});

BIN
src/views/projectAdmin/zjsj/assets/images/command-center/map.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 573 KiB

After

Width:  |  Height:  |  Size: 238 KiB

BIN
src/views/projectAdmin/zjsj/assets/images/command-center/marker.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.7 KiB

107
src/views/projectAdmin/zjsj/command/center.vue
View File

@ -1,11 +1,14 @@
<template>
<div class="container">
<div class="image">
<img src="../assets/images/command-center/map.png" alt />
<img src="../assets/images/command-center/map.png" />
<!-- 标记点 -->
<div class="sign" @mouseenter="handleMouseenter" @mouseleave="handleMouseleave"></div>
<div class="sign" @mouseenter="handleMouseenter" @mouseleave="handleMouseleave">
<!-- <img src="../assets/images/command-center/marker.png" > -->
<div class="sign-item"></div>
</div>
<!-- 信息窗体 -->
<div v-show="open" class="information-form">
<div class="information-form">
<div class="form">
<div class="form-item" style="height: 30px;" v-for="(item, key) in informationForm" :key="key">
<span class="label">{{ item.label }}</span>
@ -115,16 +118,110 @@ export default {
// 标记点
.sign {
position: absolute;
right: 25.8%;
top: 33%;
right: 28%;
bottom: 15%;
width: 50px;
height: 50px;
cursor: pointer;
&:hover + .information-form,
.information-form:hover {
display: block !important;
}
&::before {
content: '';
display: block;
box-sizing: border-box;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
z-index: 8;
width: 20px;
height: 20px;
background-color: #328e99;
border-radius: 50%;
border: 2px solid #ff6700;
animation: change-small 1.1s ease-in-out infinite;
}
&::after {
content: '';
display: block;
box-sizing: border-box;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 20px;
height: 20px;
background-color: #328e99;
border-radius: 50%;
border: 2px solid #ff6700;
animation: change 2.2s ease-in-out infinite;
}
.sign-item {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
z-index: 9;
width: 20px;
height: 20px;
background-color: #ff6700;
border-radius: 50%;
&::before {
content: '';
display: block;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 10px;
height: 10px;
background-color: #7a5a4e;
border-radius: 50%;
}
}
}
@keyframes change-small {
from {
width: 20px;
height: 20px;
opacity: 0;
}
to {
width: 32px;
height: 32px;
opacity: 1;
}
}
@keyframes change {
from {
width: 20px;
height: 20px;
opacity: 0;
}
to {
width: 45px;
height: 45px;
opacity: 1;
}
}
// 信息窗体
.information-form {
display: none;
position: absolute;
right: 33%;
top: 23%;

2
src/views/projectAdmin/zjsj/command/leftOne.vue
View File

@ -79,7 +79,7 @@ export default {
padding: 9px 0;
width: 100%;
background-image: linear-gradient(to right, #3b7589, #182337);
font-size: 12px;
font-size: 14px;
font-weight: 500;
cursor: pointer;
transition: all 0.3s;

3
src/views/projectAdmin/zjsj/command/rightFour.vue
View File

@ -91,7 +91,6 @@ export default {
display: flex;
flex-direction: column;
color: #fff;
// overflow-y: scroll;
.list-item {
position: relative;
@ -102,7 +101,7 @@ export default {
padding: 7px 0;
width: 100%;
background-image: linear-gradient(to right, #3b7589, #182337);
font-size: 12px;
font-size: 14px;
font-weight: 500;
cursor: pointer;
transition: all 0.3s;

8
src/views/projectAdmin/zjsj/command/rightOne.vue
View File

@ -33,9 +33,7 @@
<div class="bottom">
<span class="label">起始日期：</span>
<div class="value">
<span>{{ startDate.year }} </span>年
<span>{{ startDate.month }} </span>月
<span>{{ startDate.day }} </span>日
<span>{{ startDate.year}}</span>年<span>{{ startDate.month}}</span>月<span>{{ startDate.day}}</span>日
</div>
</div>
</div>
@ -238,9 +236,9 @@ export default {
text-align: right;
display: flex;
color: #a5b2c0;
font-size: 12px;
font-size: 14px;
white-space: nowrap;
transform: scale(65%);
transform: translateX(-2px);
}
}
}

9
src/views/projectAdmin/zjsj/command/rightTwo.vue
View File

@ -22,7 +22,7 @@
</div>
<div v-else class="empty" style="position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);">
<img src="@/assets/images/noData3.png">
<div style="text-align: center;color: #5b626b;">暂无数据</div>
<div style="text-align: center;color: #5b626b;font-size: 14px;">暂无数据</div>
</div>
</vue-scroll>
</div>
@ -102,7 +102,7 @@ export default {
top: '55%',
textAlign: 'center',
textStyle: {
fontSize: '13',
fontSize: '14',
color: '#8f929b',
fontWeight: '400'
}
@ -222,7 +222,7 @@ export default {
display: flex;
padding: 5px 0;
color: #fff;
font-size: 12px;
font-size: 14px;
white-space: nowrap;
line-height: 25px;
.left {
@ -248,7 +248,7 @@ export default {
padding: 6px 0;
width: 100%;
background-image: linear-gradient(to right, #3b7589, #182337);
font-size: 12px;
font-size: 14px;
font-weight: 500;
cursor: pointer;
transition: all 0.3s;
@ -286,7 +286,6 @@ export default {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
transform: translateX(-5%) scale(90%);
}
.label {

2
src/views/projectAdmin/zjsj/components/Card.vue
View File

@ -32,7 +32,7 @@ export default {
background-size: 100% 100%;
}
.content {
height: calc(100% - 42px);
height: calc(100% - 34px);
}
}
</style>