fix: 编写政务项目、企业、政务端升降机静态

This commit is contained in:
cjp 2023-08-28 18:28:42 +08:00
parent 0a70144971
commit 061d729e2a
6 changed files with 128 additions and 111 deletions

View File

@ -63,7 +63,7 @@
}
.other-info {
position: absolute;
top: 240px;
top: 230px;
right: 0;
display: flex;
flex-direction: column;
@ -71,52 +71,21 @@
margin-bottom: 20px;
}
}
.common-info {
position: absolute;
top: 30px;
left: 0;
display: flex;
flex-direction: column;
> span {
margin-bottom: 20px;
}
}
img {
width: 357px;
height: 100%;
}
}
.common-info {
display: flex;
flex-wrap: wrap;
align-content: flex-start;
margin-left: 86px;
&-item {
flex-direction: column;
justify-content: center;
width: 184px;
height: 100px;
margin-right: 26px;
margin-bottom: 30px;
background: #ffffff;
border: 1px solid #ebebeb;
border-radius: 4px;
@include flex;
> div:first-child {
@include flex;
margin-bottom: 12px;
span {
margin-right: 7px;
font-family: "Source Han Sans CN-Medium", "Source Han Sans CN";
font-size: 18px;
font-weight: 500;
color: #333333;
}
img {
width: 20px;
height: 20px;
}
}
> div:last-child {
@include flex;
span {
font-family: "Source Han Sans CN-Medium", "Source Han Sans CN";
font-size: 18px;
font-weight: 500;
color: #00378f;
}
}
margin-right: 215px;
margin-left: 215px;
}
}
.monitor-aspect {

View File

@ -23,9 +23,9 @@
<span>额定下行速度: {{ equipInfo.towerHeight ? equipInfo.towerHeight : 0 }}m</span>
</div>
<div class="other-info">
<span>设备编号: {{ equipInfo.devNumber ? equipInfo.devNumber : "" }}</span>
<span>备案编号: TD2374693</span>
<span>安装日期: {{ equipInfo.installTime ? equipInfo.installTime : "" }}</span>
<!-- <span>终端编号: TD2374693</span> -->
<span>终端编号: TD2374693</span>
<span>更新时间: {{ equipInfo.realTime ? equipInfo.realTime : "" }}</span>
</div>
</div>

View File

@ -1,27 +1,29 @@
@mixin boxStyle {
border-radius: 8px;
background: #ffffff;
border-radius: 8px;
}
@mixin flex {
display: flex;
align-items: center;
}
.entire-box {
height: 100%;
width: 100%;
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
background-color: #f6f6f6;
.operate-box {
height: calc(100% - 112px);
padding: 0 20px 20px 20px;
padding: 0 20px 20px;
@include flex;
.alarm-data {
height: 100%;
// 页面的项目工程
.leftProject {
border-radius: 8px;
color: #333333;
border-radius: 8px;
// background-color: pink;
.projectName {
display: block;
@ -39,9 +41,9 @@
font-size: 12px;
}
img {
margin: 0 4px;
width: 12px;
height: 12px;
margin: 0 4px;
}
}
.bottom_item {
@ -54,10 +56,11 @@
.LeftMenu {
width: 300px;
height: 100%;
border-radius: 8px;
margin-right: 20px;
// box-shadow: 0 4px 4px 0 rgb(0 55 143 / 20%);
overflow-y: scroll;
margin-right: 20px;
border-radius: 8px;
:deep() {
.content {
height: calc(100% - 150px);
@ -67,21 +70,22 @@
}
.monitor-data {
@include boxStyle;
flex: 1;
height: 100%;
.monitor-title {
margin-top: 15px;
margin-left: 36px;
span:first-child {
margin-right: 20px;
font-family: "Source Han Sans CN-Bold", "Source Han Sans CN";
font-size: 30px;
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
font-weight: bold;
color: #333333;
margin-right: 20px;
}
span:last-child {
font-family: "Source Han Sans CN-Medium", "Source Han Sans CN";
font-size: 22px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #0f64da;
}
@ -94,8 +98,8 @@
.monitor-tool {
position: relative;
span {
font-family: "Source Han Sans CN-Regular", "Source Han Sans CN";
font-size: 18px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #000000;
}
@ -116,8 +120,18 @@
}
.other-info {
position: absolute;
top: 240px;
right: 0px;
top: 210px;
right: 0;
display: flex;
flex-direction: column;
> span {
margin-bottom: 20px;
}
}
.common-info {
position: absolute;
top: 30px;
left: 0;
display: flex;
flex-direction: column;
> span {
@ -125,35 +139,38 @@
}
}
img {
width: 688px;
width: 357px;
height: 100%;
margin-right: 170px;
margin-left: 180px;
}
}
.monitor-aspect {
margin-left: 56px;
display: flex;
flex-wrap: wrap;
align-content: flex-start;
margin-left: 56px;
&-item {
width: 184px;
height: 100px;
background: #ffffff;
border-radius: 4px;
border: 1px solid #ebebeb;
@include flex;
flex-direction: column;
justify-content: center;
width: 184px;
height: 100px;
margin-right: 26px;
margin-bottom: 30px;
background: #ffffff;
border: 1px solid #ebebeb;
border-radius: 4px;
@include flex;
> div:first-child {
@include flex;
margin-bottom: 12px;
span {
margin-right: 7px;
font-family: "Source Han Sans CN-Medium", "Source Han Sans CN";
font-size: 18px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #333333;
margin-right: 7px;
}
img {
width: 20px;
@ -163,8 +180,8 @@
> div:last-child {
@include flex;
span {
font-family: "Source Han Sans CN-Medium", "Source Han Sans CN";
font-size: 18px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #00378f;
}
@ -174,14 +191,15 @@
}
.monitor-equip {
margin-top: 31px;
margin-left: 36px;
margin-bottom: 16px;
margin-left: 36px;
@include flex;
.monitor-state:not(:last-child) {
margin-right: 26px;
}
.monitor-state {
@include flex;
flex-direction: column;
align-items: center;
> div {
@ -191,43 +209,45 @@
height: 100px;
}
span {
width: 32px;
height: 15px;
background: #008bff;
font-size: 10px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #ffffff;
text-align: center;
position: absolute;
top: 0;
right: 0;
width: 32px;
height: 15px;
font-family: "Source Han Sans CN-Regular", "Source Han Sans CN";
font-size: 10px;
font-weight: 400;
color: #ffffff;
text-align: center;
background: #008bff;
}
}
> span {
font-family: "Source Han Sans CN-Regular", "Source Han Sans CN";
font-size: 16px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #000000;
}
}
.active-class {
box-shadow: 0px 4px 8px 0px rgba(48, 62, 100, 0.2);
box-shadow: 0 4px 8px 0 rgb(48 62 100 / 20%);
}
}
}
.no-data {
@include boxStyle;
flex: 1;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
flex: 1;
flex-direction: column;
color: #999;
align-items: center;
justify-content: center;
height: 100%;
color: #999999;
}
.history-data {
@include boxStyle;
width: 300px;
height: 100%;
margin-left: 20px;
@ -241,6 +261,7 @@
}
.search-wrapper {
@include flex;
height: 50px;
padding: 0 10px;
background-color: #ffffff;
@ -253,12 +274,12 @@
&-item {
display: flex;
flex-direction: column;
border-bottom: 1px solid #e5e5e5;
padding: 12px;
border-bottom: 1px solid #e5e5e5;
> div {
span {
font-family: "Source Han Sans CN-Regular", "Source Han Sans CN";
font-size: 12px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #333333;
}
@ -275,14 +296,14 @@
&-item {
display: flex;
flex-direction: column;
border-bottom: 1px solid #e5e5e5;
padding: 12px;
border-bottom: 1px solid #e5e5e5;
> div:nth-child(1) {
margin-bottom: 10px;
font-family: "Source Han Sans CN-Medium", "Source Han Sans CN";
font-size: 16px;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #333333;
margin-bottom: 10px;
}
&-aspect {
display: flex;
@ -291,16 +312,16 @@
&-item {
margin-bottom: 8px;
span {
font-family: "Source Han Sans CN-Regular", "Source Han Sans CN";
font-size: 12px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
}
> span:nth-child(1) {
display: inline-block;
width: 36px;
height: 18px;
color: #606266;
margin-right: 20px;
color: #606266;
text-align: left;
}
> span:nth-child(2) {
@ -312,11 +333,11 @@
}
}
> div:last-child {
font-size: 10px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: rgba(102, 102, 102, 0.8);
margin-top: 5px;
font-family: "Source Han Sans CN-Regular", "Source Han Sans CN";
font-size: 10px;
font-weight: 400;
color: rgb(102 102 102 / 80%);
}
}
}

View File

@ -53,15 +53,21 @@
</div>
<div class="monitor-content">
<div class="monitor-tool">
<img src="@/assets/images/onlineSupervision/towerImg.png" alt="" />
<span class="property-one">尾臂长: {{ equipInfo.posteriorArmLength ? equipInfo.posteriorArmLength : 0 }}m</span>
<span class="property-two">臂长: {{ equipInfo.forearmLength ? equipInfo.forearmLength : 0 }}m</span>
<span class="property-three">塔身高: {{ equipInfo.towerHeight ? equipInfo.towerHeight : 0 }}m</span>
<img src="@/assets/images/onlineSupervision/liftImg.jpg" alt="" />
<div class="common-info">
<span>额定载重: {{ equipInfo.posteriorArmLength ? equipInfo.posteriorArmLength : 0 }}kg</span>
<span>额定人数: {{ equipInfo.forearmLength ? equipInfo.forearmLength : 0 }}</span>
<span>最大倾斜角度: {{ equipInfo.towerHeight ? equipInfo.towerHeight : 0 }}°</span>
<span>最大高度: {{ equipInfo.towerHeight ? equipInfo.towerHeight : 0 }}m</span>
<span>风级: {{ equipInfo.towerHeight ? equipInfo.towerHeight : 0 }}级风</span>
<span>额定上行速度: {{ equipInfo.towerHeight ? equipInfo.towerHeight : 0 }}m</span>
<span>额定下行速度: {{ equipInfo.towerHeight ? equipInfo.towerHeight : 0 }}m</span>
</div>
<div class="other-info">
<span>设备编号: {{ equipInfo.devNumber ? equipInfo.devNumber : "" }}</span>
<span>安装日期: {{ equipInfo.installTime ? equipInfo.installTime : "" }}</span>
<!-- <span>终端编号: TD2374693</span> -->
<span>更新时间: {{ equipInfo.realTime ? equipInfo.realTime : "" }}</span>
<span>备案编号: TD2374693</span>
<span>安装日期: 2022-12-01</span>
<span>终端编号: TD2374693</span>
<span>更新时间: 2023-05-23</span>
</div>
</div>
<div class="monitor-aspect">

View File

@ -63,7 +63,7 @@
}
.other-info {
position: absolute;
top: 240px;
top: 230px;
right: 0;
display: flex;
flex-direction: column;
@ -71,9 +71,21 @@
margin-bottom: 20px;
}
}
.common-info {
position: absolute;
top: 30px;
left: 0;
display: flex;
flex-direction: column;
> span {
margin-bottom: 20px;
}
}
img {
width: 357px;
height: 100%;
margin-right: 215px;
margin-left: 215px;
}
}
.monitor-aspect {

View File

@ -10,13 +10,22 @@
<div class="monitor-content">
<div class="monitor-tool">
<img src="@/assets/images/onlineSupervision/liftImg.jpg" alt="" />
<span class="property-one">尾臂长: {{ equipInfo.posteriorArmLength ? equipInfo.posteriorArmLength : 0 }}m</span>
<!-- <span class="property-one">尾臂长: {{ equipInfo.posteriorArmLength ? equipInfo.posteriorArmLength : 0 }}m</span>
<span class="property-two">臂长: {{ equipInfo.forearmLength ? equipInfo.forearmLength : 0 }}m</span>
<span class="property-three">塔身高: {{ equipInfo.towerHeight ? equipInfo.towerHeight : 0 }}m</span>
<span class="property-three">塔身高: {{ equipInfo.towerHeight ? equipInfo.towerHeight : 0 }}m</span> -->
<div class="common-info">
<span>额定载重: {{ equipInfo.posteriorArmLength ? equipInfo.posteriorArmLength : 0 }}kg</span>
<span>额定人数: {{ equipInfo.forearmLength ? equipInfo.forearmLength : 0 }}</span>
<span>最大倾斜角度: {{ equipInfo.towerHeight ? equipInfo.towerHeight : 0 }}°</span>
<span>最大高度: {{ equipInfo.towerHeight ? equipInfo.towerHeight : 0 }}m</span>
<span>风级: {{ equipInfo.towerHeight ? equipInfo.towerHeight : 0 }}级风</span>
<span>额定上行速度: {{ equipInfo.towerHeight ? equipInfo.towerHeight : 0 }}m</span>
<span>额定下行速度: {{ equipInfo.towerHeight ? equipInfo.towerHeight : 0 }}m</span>
</div>
<div class="other-info">
<span>设备编号: {{ equipInfo.devNumber ? equipInfo.devNumber : "" }}</span>
<span>备案编号: TD2374693</span>
<span>安装日期: {{ equipInfo.installTime ? equipInfo.installTime : "" }}</span>
<!-- <span>终端编号: TD2374693</span> -->
<span>终端编号: TD2374693</span>
<span>更新时间: {{ equipInfo.realTime ? equipInfo.realTime : "" }}</span>
</div>
</div>