Browse Source

添加冷却塔水位值,水位报警值

dev
selia-zx 4 weeks ago
parent
commit
3e2f2d2c0c
  1. 80
      src/views/components/monitor/centerairMonitor.vue

80
src/views/components/monitor/centerairMonitor.vue

@ -302,6 +302,15 @@
@click="goControlList(coolingTowerOutlet, 2)"></div>
<div class="towerValve3" :class="{ startClass: towerValveControlClass(1) }"
@click="goControlList(coolingTowerOutlet, 1)"></div>
<!-- 冷却塔水位 -->
<div
class="coolingTowerWaterLevel"
v-if="getCoolingTowerWaterLevel() !== false"
:class="{ waterLevelAlarm: isWaterLevelAlarm() }"
:title="isWaterLevelAlarm() ? getWaterLevelAlarmText() : ''"
>
冷却塔水位{{ getCoolingTowerWaterLevel() }}
</div>
<!-- 冷冻蝶阀数据定位 -->
<div class="frozenValve1" :class="{ startClass: frozenValveControlClass(1) }"
@click="goControlList(frozenValve, 1)"></div>
@ -432,6 +441,7 @@ export default {
coolingValue: [], //
coolingTowerInlet: [], //
coolingTowerOutlet: [], //
coolingTowerWaterLevel: [], //
freezingManifold: [], //
allCapacity:[], //
calorimeter: [], //
@ -711,6 +721,7 @@ export default {
this.coolingValue = [];
this.coolingTowerInlet = [];
this.coolingTowerOutlet = [];
this.coolingTowerWaterLevel = [];
this.freezingManifold = [];
this.allCapacity = [];
@ -748,6 +759,10 @@ export default {
this.coolingTowerOutlet = this.processDeviceList(row.values);
console.log("冷却塔出水阀列表", this.coolingTowerOutlet);
break;
case "12":
this.coolingTowerWaterLevel = row.values;
console.log("冷却塔水位列表", this.coolingTowerWaterLevel);
break;
case "6":
this.allCapacity = row.values;
console.log("总冷量计列表", this.allCapacity);
@ -1252,6 +1267,33 @@ export default {
//
return false;
},
/** 获取冷却塔水位值,返回数值或 false */
getCoolingTowerWaterLevel() {
if (!this.coolingTowerWaterLevel || this.coolingTowerWaterLevel.length === 0) {
return false;
}
for (let i = 0; i < this.coolingTowerWaterLevel.length; i++) {
const item = this.coolingTowerWaterLevel[i];
if (item.deviceName && item.deviceName.includes('冷却塔水位') && item.paramType === '11') {
return Number(item.collectValue);
}
}
return false;
},
/** 冷却塔水位是否处于报警状态(大于0.65或小于0.55) */
isWaterLevelAlarm() {
const level = this.getCoolingTowerWaterLevel();
if (level === false) return false;
return level > 0.65 || level < 0.55;
},
/** 获取冷却塔水位报警文案,鼠标悬停时显示 */
getWaterLevelAlarmText() {
const level = this.getCoolingTowerWaterLevel();
if (level === false) return '';
if (level > 0.65) return `溢水报警(当前水位:${level}米,超出上限0.65米)`;
if (level < 0.55) return `缺水报警(当前水位:${level}米,低于下限0.55米)`;
return '';
},
//
towerValveControlClass(index) {
// this.coolingTowerOutlet deviceName index
@ -2652,6 +2694,44 @@ export default {
transform: rotateX(20deg) rotateY(-25deg) rotateZ(-5deg);
}
/** 冷却塔水位显示 */
.coolingTowerWaterLevel {
z-index: 10;
font-size: 0.16rem;
color: #46f1e3;
position: absolute;
top: 1.8rem;
left: 3.2rem;
font-weight: bold;
white-space: nowrap;
}
/** 冷却塔水位报警样式 - 红色闪烁 */
.coolingTowerWaterLevel.waterLevelAlarm {
color: #ff4444;
animation: waterLevelBlink 1s ease-in-out infinite;
cursor: pointer;
}
/** 冷却塔水位报警闪烁动画 */
@keyframes waterLevelBlink {
0%,
100% {
opacity: 1;
text-shadow: 0 0 4px #ff4444, 0 0 8px #ff4444;
}
25% {
opacity: 0.4;
text-shadow: 0 0 2px #ff4444;
}
50% {
opacity: 1;
text-shadow: 0 0 6px #ff4444, 0 0 12px #ff4444, 0 0 18px #ff0000;
}
75% {
opacity: 0.4;
text-shadow: 0 0 2px #ff4444;
}
}
/* 定义灯闪烁的动画 */
@keyframes blink {
0% {

Loading…
Cancel
Save