|
|
@ -22,7 +22,7 @@ |
|
|
|
<template v-for="(item, index) in sensorData" :key="index"> |
|
|
|
<div |
|
|
|
style="position: absolute" |
|
|
|
:style="{ left: item.styleText.left, bottom: item.styleText.bottom }"> |
|
|
|
:style="{ left: item?.styleText?.left, bottom: item?.styleText?.bottom }"> |
|
|
|
<singleModel :dataSource="item" /> |
|
|
|
</div> |
|
|
|
</template> |
|
|
@ -32,7 +32,7 @@ |
|
|
|
<template v-for="(item, index) in peopleData" :key="index"> |
|
|
|
<div |
|
|
|
style="position: absolute" |
|
|
|
:style="{ left: item.styleText.left, bottom: item.styleText.bottom }"> |
|
|
|
:style="{ left: item?.styleText?.left, bottom: item?.styleText?.bottom }"> |
|
|
|
<singleModel :dataSource="item" /> |
|
|
|
</div> |
|
|
|
</template> |
|
|
@ -43,8 +43,8 @@ |
|
|
|
<div |
|
|
|
style="position: absolute" |
|
|
|
:style="{ |
|
|
|
left: 'calc(' + item.styleText.left + ' - 14%)', |
|
|
|
bottom: 'calc(' + item.styleText.bottom + ' + 8%)', |
|
|
|
left: 'calc(' + item?.styleText?.left + ' - 14%)', |
|
|
|
bottom: 'calc(' + item?.styleText?.bottom + ' + 8%)', |
|
|
|
'z-index': 2, |
|
|
|
}"> |
|
|
|
<doubleSingleModel :dataSource="item" /> |
|
|
@ -52,14 +52,14 @@ |
|
|
|
<img |
|
|
|
style="width: 50px; height: 75px; position: absolute" |
|
|
|
:style="{ |
|
|
|
left: 'calc(' + item.styleText.left + ' - 2%)', |
|
|
|
bottom: 'calc(' + item.styleText.bottom + ' + 4%)', |
|
|
|
left: 'calc(' + item?.styleText?.left + ' - 2%)', |
|
|
|
bottom: 'calc(' + item?.styleText?.bottom + ' + 4%)', |
|
|
|
transform: 'rotateY(180deg)', |
|
|
|
}" |
|
|
|
src="../image/liftState/lift/line.png" /> |
|
|
|
<img |
|
|
|
style="width: 42px; height: 42px; position: absolute; z-index: 2" |
|
|
|
:style="{ left: item.styleText.left, bottom: item.styleText.bottom }" |
|
|
|
:style="{ left: item?.styleText?.left, bottom: item?.styleText?.bottom }" |
|
|
|
src="../image/airConditioningSystem/fan.png" /> |
|
|
|
</template> |
|
|
|
</div> |
|
|
@ -81,24 +81,26 @@ |
|
|
|
<div |
|
|
|
style="position: absolute; z-index: 2" |
|
|
|
:style="{ |
|
|
|
left: 'calc(' + item.styleText.left + (item.lineType === 1 ? ' - 12.8%)' : ' - 13%)'), |
|
|
|
left: |
|
|
|
'calc(' + item?.styleText?.left + (item.lineType === 1 ? ' - 12.8%)' : ' - 13%)'), |
|
|
|
bottom: |
|
|
|
'calc(' + item.styleText.bottom + (item.lineType === 1 ? ' + 7%)' : ' - 14%)'), |
|
|
|
'calc(' + item?.styleText?.bottom + (item.lineType === 1 ? ' + 7%)' : ' - 14%)'), |
|
|
|
}"> |
|
|
|
<doubleSingleModel :dataSource="item" /> |
|
|
|
</div> |
|
|
|
<img |
|
|
|
style="width: 50px; height: 75px; position: absolute" |
|
|
|
:style="{ |
|
|
|
left: 'calc(' + item.styleText.left + (item.lineType === 1 ? ' - 1.5%)' : ' - 1.8%)'), |
|
|
|
left: |
|
|
|
'calc(' + item?.styleText?.left + (item.lineType === 1 ? ' - 1.5%)' : ' - 1.8%)'), |
|
|
|
bottom: |
|
|
|
'calc(' + item.styleText.bottom + (item.lineType === 1 ? ' + 4.5%)' : ' - 9%)'), |
|
|
|
'calc(' + item?.styleText?.bottom + (item.lineType === 1 ? ' + 4.5%)' : ' - 9%)'), |
|
|
|
transform: item.lineType === 1 ? 'rotateY(180deg)' : 'rotate(180deg)', |
|
|
|
}" |
|
|
|
src="../image/liftState/lift/line.png" /> |
|
|
|
<img |
|
|
|
style="width: 42px; height: 42px; position: absolute; z-index: 2" |
|
|
|
:style="{ left: item.styleText.left, bottom: item.styleText.bottom }" |
|
|
|
:style="{ left: item?.styleText?.left, bottom: item?.styleText?.bottom }" |
|
|
|
src="../image/airConditioningSystem/conditioningIcon.png" /> |
|
|
|
</template> |
|
|
|
</div> |
|
|
@ -122,14 +124,14 @@ |
|
|
|
:key="index" |
|
|
|
style="display: flex" |
|
|
|
:style="{ |
|
|
|
width: item.styleText.width, |
|
|
|
height: item.styleText.height, |
|
|
|
background: item.styleText.color, |
|
|
|
marginLeft: item.styleText.mLeft, |
|
|
|
position: item.styleText.position, |
|
|
|
top: item.styleText.top, |
|
|
|
left: item.styleText.abLeft, |
|
|
|
border: item.styleText.border, |
|
|
|
width: item?.styleText?.width, |
|
|
|
height: item?.styleText?.height, |
|
|
|
background: item?.styleText?.color, |
|
|
|
marginLeft: item?.styleText?.mLeft, |
|
|
|
position: item?.styleText?.position, |
|
|
|
top: item?.styleText?.top, |
|
|
|
left: item?.styleText?.abLeft, |
|
|
|
border: item?.styleText?.border, |
|
|
|
}"> |
|
|
|
</div> |
|
|
|
</div> |
|
|
@ -148,23 +150,24 @@ |
|
|
|
style="position: absolute; z-index: 1" |
|
|
|
:style="{ |
|
|
|
left: |
|
|
|
'calc(' + item.styleText.left + (item.lineType === 1 ? ' - 12.9%)' : ' - 13.3%)'), |
|
|
|
'calc(' + item?.styleText?.left + (item.lineType === 1 ? ' - 12.9%)' : ' - 13.3%)'), |
|
|
|
bottom: |
|
|
|
'calc(' + item.styleText.bottom + (item.lineType === 1 ? ' + 8%)' : ' - 14%)'), |
|
|
|
'calc(' + item?.styleText?.bottom + (item.lineType === 1 ? ' + 8%)' : ' - 14%)'), |
|
|
|
}"> |
|
|
|
<doubleSingleModel :dataSource="item" /> |
|
|
|
</div> |
|
|
|
<img |
|
|
|
style="width: 50px; height: 75px; position: absolute" |
|
|
|
:style="{ |
|
|
|
left: 'calc(' + item.styleText.left + (item.lineType === 1 ? ' - 1.5%)' : ' - 2%)'), |
|
|
|
bottom: 'calc(' + item.styleText.bottom + (item.lineType === 1 ? ' + 4%)' : ' - 9%)'), |
|
|
|
left: 'calc(' + item?.styleText?.left + (item.lineType === 1 ? ' - 1.5%)' : ' - 2%)'), |
|
|
|
bottom: |
|
|
|
'calc(' + item?.styleText?.bottom + (item.lineType === 1 ? ' + 4%)' : ' - 9%)'), |
|
|
|
transform: item.lineType === 1 ? 'rotateY(180deg)' : 'rotate(180deg)', |
|
|
|
}" |
|
|
|
src="../image/liftState/lift/line.png" /> |
|
|
|
<img |
|
|
|
style="width: 42px; height: 42px; position: absolute; z-index: 1" |
|
|
|
:style="{ left: item.styleText.left, bottom: item.styleText.bottom }" |
|
|
|
:style="{ left: item?.styleText?.left, bottom: item?.styleText?.bottom }" |
|
|
|
src="../image/airConditioningSystem/floorHeatingIcon.png" /> |
|
|
|
</template> |
|
|
|
</div> |
|
|
@ -174,9 +177,9 @@ |
|
|
|
:key="index" |
|
|
|
style="display: flex" |
|
|
|
:style="{ |
|
|
|
width: item.styleText.width, |
|
|
|
background: item.styleText.color, |
|
|
|
border: item.styleText.border, |
|
|
|
width: item?.styleText?.width, |
|
|
|
background: item?.styleText?.color, |
|
|
|
border: item?.styleText?.border, |
|
|
|
}"> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|