|
@@ -22,6 +22,12 @@ const showHBarrow = (value) => {
|
|
|
const showVal = (value) => {
|
|
|
return value ? Number(value).toFixed(2) : 0
|
|
|
}
|
|
|
+
|
|
|
+const getStyle = (value) => {
|
|
|
+ return {
|
|
|
+ color: value > 0 ? '#F0727A' : '#38c348'
|
|
|
+ }
|
|
|
+}
|
|
|
</script>
|
|
|
|
|
|
<template>
|
|
@@ -38,34 +44,34 @@ const showVal = (value) => {
|
|
|
<li class="box-wrap-item">
|
|
|
<div class="dess">瞬时 m³/h</div>
|
|
|
<div class="num">{{ showVal(screenData.jsSlq) }}</div>
|
|
|
- <div class="footer">{{ showHBarrow(screenData.ssJsHb) }}%</div>
|
|
|
+ <div class="footer" :style="getStyle(screenData.ssJsHb)">{{ showHBarrow(screenData.ssJsHb) }}%</div>
|
|
|
</li>
|
|
|
<li class="box-wrap-item">
|
|
|
<div class="dess">昨日累计 m³/d</div>
|
|
|
<div class="num">{{ showVal(screenData.zrZJSL) }}</div>
|
|
|
- <div class="footer">{{ showHBarrow(screenData.zrZJsHb) }}%</div>
|
|
|
+ <div class="footer" :style="getStyle(screenData.zrZJsHb)">{{ showHBarrow(screenData.zrZJsHb) }}%</div>
|
|
|
</li>
|
|
|
<li class="box-wrap-item">
|
|
|
<div class="dess">周均值 m³/d</div>
|
|
|
<div class="num">{{ showVal(screenData.szZJSAvg) }}</div>
|
|
|
- <div class="footer">{{ showHBarrow(screenData.szZJSHb) }}%</div>
|
|
|
+ <div class="footer" :style="getStyle(screenData.szZJSHb)">{{ showHBarrow(screenData.szZJSHb) }}%</div>
|
|
|
</li>
|
|
|
</ul>
|
|
|
<ul class="box-wrap-list" v-show="index === 1">
|
|
|
<li class="box-wrap-item">
|
|
|
<div class="dess">瞬时 m³/h</div>
|
|
|
<div class="num">{{ showVal(screenData.csSlqc) }}</div>
|
|
|
- <div class="footer">{{ showHBarrow(screenData.ssCsHb) }}%</div>
|
|
|
+ <div class="footer" :style="getStyle(screenData.ssCsHb)">{{ showHBarrow(screenData.ssCsHb) }}%</div>
|
|
|
</li>
|
|
|
<li class="box-wrap-item">
|
|
|
<div class="dess">昨日累计 m³/d</div>
|
|
|
<div class="num">{{ showVal(screenData.zrZCSL) }}</div>
|
|
|
- <div class="footer">{{ showHBarrow(screenData.zrZCsHb) }}%</div>
|
|
|
+ <div class="footer" :style="getStyle(screenData.zrZCsHb)">{{ showHBarrow(screenData.zrZCsHb) }}%</div>
|
|
|
</li>
|
|
|
<li class="box-wrap-item">
|
|
|
<div class="dess">周均值 m³/d</div>
|
|
|
<div class="num">{{ showVal(screenData.szZCSAvg) }}</div>
|
|
|
- <div class="footer">{{ showHBarrow(screenData.szZCSHb) }}%</div>
|
|
|
+ <div class="footer" :style="getStyle(screenData.szZCSHb)">{{ showHBarrow(screenData.szZCSHb) }}%</div>
|
|
|
</li>
|
|
|
</ul>
|
|
|
</div>
|