|
@@ -10,10 +10,10 @@
|
|
|
</div>
|
|
|
<div class="item">
|
|
|
<div id="demo1">升温
|
|
|
- <div class="img" v-if="statusT == 0"></div>
|
|
|
+ <div class="imgHeatingUp" v-if="statusT == 0"></div>
|
|
|
</div>
|
|
|
<div>降温
|
|
|
- <div class="img2" v-if="statusT == 1"></div>
|
|
|
+ <div class="imgHeatingDown" v-if="statusT == 1"></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="item">
|
|
@@ -43,10 +43,10 @@
|
|
|
</div>
|
|
|
<div class="item">
|
|
|
<div id="demo1">加湿
|
|
|
- <div class="img" v-if="statusH === 0"></div>
|
|
|
+ <div class="imgHumidification" v-if="statusH === 0"></div>
|
|
|
</div>
|
|
|
<div>除湿
|
|
|
- <div class="img2" v-if="statusH === 1"></div>
|
|
|
+ <div class="imgDehumidification" v-if="statusH === 1"></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="item">
|
|
@@ -277,19 +277,34 @@ export default {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
}
|
|
|
- .img{
|
|
|
+ .imgHeatingUp{
|
|
|
width: 50%;
|
|
|
height: 80%;
|
|
|
margin-left: 10%;
|
|
|
- background: url(~@/assets/visualization/taiyang.png) no-repeat;
|
|
|
+ background: url(~@/assets/visualization/heatingUp.png) no-repeat;
|
|
|
background-size: contain;
|
|
|
}
|
|
|
- .img2{
|
|
|
+ .imgHeatingDown{
|
|
|
width: 50%;
|
|
|
height: 80%;
|
|
|
margin-left: 10%;
|
|
|
// border: 1px solid rgb(255, 255, 255);
|
|
|
- background: url(~@/assets/visualization/lvtaiyang.png) no-repeat;
|
|
|
+ background: url(~@/assets/visualization/heatingDown.png) no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ }
|
|
|
+ .imgHumidification{
|
|
|
+ width: 50%;
|
|
|
+ height: 80%;
|
|
|
+ margin-left: 10%;
|
|
|
+ background: url(~@/assets/visualization/humidification.png) no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ }
|
|
|
+ .imgDehumidification{
|
|
|
+ width: 50%;
|
|
|
+ height: 80%;
|
|
|
+ margin-left: 10%;
|
|
|
+ // border: 1px solid rgb(255, 255, 255);
|
|
|
+ background: url(~@/assets/visualization/dehumidification2.png) no-repeat;
|
|
|
background-size: contain;
|
|
|
}
|
|
|
</style>
|