fix:修改新风系统弹窗 优化页面展示
This commit is contained in:
@@ -4,11 +4,23 @@
|
||||
<div class="box-title title">
|
||||
{{ dataSource.title }}
|
||||
</div>
|
||||
<div style="width: 100%; height: 50px; position: relative; display: flex">
|
||||
<div style="width: auto; height: 50px; position: relative; display: flex">
|
||||
<img class="box-img" :src="dataSource.url" />
|
||||
<div class="box-type"> {{ dataSource.type }}</div>
|
||||
<div class="box-number">{{ dataSource.number }}</div>
|
||||
<div class="box-unit"> {{ dataSource.unit }}</div>
|
||||
<div
|
||||
class="box-type"
|
||||
:style="{
|
||||
fontSize: dataSource.type === '二氧化碳' ? '8px' : '10px',
|
||||
}">
|
||||
{{ dataSource.type }}</div
|
||||
>
|
||||
<div
|
||||
class="box-number"
|
||||
:style="{
|
||||
left: dataSource.type === '二氧化碳' ? '95px' : '90px',
|
||||
}"
|
||||
>{{ dataSource.number }}</div
|
||||
>
|
||||
<div v-if="dataSource?.unit" class="box-unit"> {{ dataSource.unit }}</div>
|
||||
<div style="position: absolute; bottom: -16px">
|
||||
<img style="width: 12px" src="../image/airConditioningSystem/triangle.png" />
|
||||
</div>
|
||||
@@ -27,7 +39,7 @@
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.box {
|
||||
min-width: 130px;
|
||||
min-width: 100px;
|
||||
width: auto;
|
||||
height: 80px;
|
||||
background-color: #213479;
|
||||
@@ -70,27 +82,39 @@
|
||||
font-size: 10px;
|
||||
left: 50px;
|
||||
top: 53%;
|
||||
transform: translateY(-50%);
|
||||
position: absolute;
|
||||
width: auto;
|
||||
height: 100%;
|
||||
line-height: 50px;
|
||||
margin-left: 50px;
|
||||
min-width: 30px;
|
||||
margin-right: 4px;
|
||||
}
|
||||
.box-number {
|
||||
color: #0dffa4;
|
||||
font-size: 18px;
|
||||
left: 90px;
|
||||
left: 72%;
|
||||
top: 45%;
|
||||
transform: translate(-50%, -50%);
|
||||
position: absolute;
|
||||
width: auto;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
box-sizing: border-box;
|
||||
font-style: italic;
|
||||
width: auto;
|
||||
height: 100%;
|
||||
line-height: 48px;
|
||||
min-width: 20px;
|
||||
}
|
||||
.box-unit {
|
||||
color: white;
|
||||
font-size: 8px;
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 53%;
|
||||
transform: translateY(-50%);
|
||||
min-width: 20px;
|
||||
width: auto;
|
||||
height: 100%;
|
||||
line-height: 55px;
|
||||
margin-left: 5px;
|
||||
text-align: center;
|
||||
margin-right: 8px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
Reference in New Issue
Block a user