Browse Source

去掉设备监控页面温度T1, T7, 压力P10 P12;点击热量表显示进水温度、出水温度、瞬时热量、瞬时流量

gh_ers
selia-zx 2 weeks ago
parent
commit
527f22af11
  1. 6
      src/assets/styles/ruoyi.scss
  2. 178
      src/views/heatRecoverySys/deviceMonitor/monitorCenter.vue

6
src/assets/styles/ruoyi.scss

@ -88,9 +88,9 @@ h6 {
word-break: break-word; word-break: break-word;
} }
.el-dialog:not(.is-fullscreen) { // .el-dialog:not(.is-fullscreen) {
margin-top: 6vh !important; // margin-top: 6vh !important;
} // }
.el-dialog__wrapper.scrollbar .el-dialog .el-dialog__body { .el-dialog__wrapper.scrollbar .el-dialog .el-dialog__body {
overflow: auto; overflow: auto;

178
src/views/heatRecoverySys/deviceMonitor/monitorCenter.vue

@ -125,23 +125,37 @@
<div class="text p7">P7</div> <div class="text p7">P7</div>
<div class="text p8">P8</div> <div class="text p8">P8</div>
<div class="text p9">P9</div> <div class="text p9">P9</div>
<div class="text p10">P10</div> <!-- <div class="text p10">P10</div> -->
<div class="text p11">P11</div> <div class="text p11">P11</div>
<div class="text p12">P12</div> <!-- <div class="text p12">P12</div> -->
<div class="text t1">T1</div> <!-- <div class="text t1">T1</div> -->
<div class="text t2">T2</div> <div class="text t2">T2</div>
<div class="text t3">T3</div> <div class="text t3">T3</div>
<div class="text t4">T4</div> <div class="text t4">T4</div>
<div class="text t5">T5</div> <div class="text t5">T5</div>
<div class="text t6">T6</div> <div class="text t6">T6</div>
<div class="text t7">T7</div> <!-- <div class="text t7">T7</div> -->
<div class="text h1">热量表1</div> <div class="text h1" @click="hotListData(hotArrOne, '热量表1')">
<div class="text h2">热量表2</div> 热量表1
<div class="text h3">热量表3</div> </div>
<div class="text h4">热量表4</div> <div class="text h2" @click="hotListData(hotArrTwo, '热量表2')">
<div class="text h5">热量表5</div> 热量表2
<div class="text h6">热量表6</div> </div>
<div class="text h7">热量表7</div> <div class="text h3" @click="hotListData(hotArrThree, '热量表3')">
热量表3
</div>
<div class="text h4" @click="hotListData(hotArrFour, '热量表4')">
热量表4
</div>
<div class="text h5" @click="hotListData(hotArrFive, '热量表5')">
热量表5
</div>
<div class="text h6" @click="hotListData(hotArrSix, '热量表6')">
热量表6
</div>
<div class="text h7" @click="hotListData(hotArrSeven, '热量表7')">
热量表7
</div>
<!-- 可点击区域 --> <!-- 可点击区域 -->
<div <div
@ -184,102 +198,139 @@
<div class="text pres9"> <div class="text pres9">
{{ getTemPreData(pressureArr, "9号压力传感器") }}bar {{ getTemPreData(pressureArr, "9号压力传感器") }}bar
</div> </div>
<div class="text pres10"> <!-- <div class="text pres10">
{{ getTemPreData(pressureArr, "10号压力传感器") }}bar {{ getTemPreData(pressureArr, "10号压力传感器") }}bar
</div> </div> -->
<div class="text pres11"> <div class="text pres11">
{{ getTemPreData(pressureArr, "11号压力传感器") }}bar {{ getTemPreData(pressureArr, "11号压力传感器") }}bar
</div> </div>
<div class="text pres12"> <!-- <div class="text pres12">
{{ getTemPreData(pressureArr, "12号压力传感器") }}bar {{ getTemPreData(pressureArr, "12号压力传感器") }}bar
</div> </div> -->
<!-- 温度传感器 1-7 --> <!-- 温度传感器 1-7 -->
<div class="text tem1">{{ getTemPreData(temArr, "1号温度传感器") }}</div> <!-- <div class="text tem1">{{ getTemPreData(temArr, "1号温度传感器") }}</div> -->
<div class="text tem2">{{ getTemPreData(temArr, "2号温度传感器") }}</div> <div class="text tem2">{{ getTemPreData(temArr, "2号温度传感器") }}</div>
<div class="text tem3">{{ getTemPreData(temArr, "3号温度传感器") }}</div> <div class="text tem3">{{ getTemPreData(temArr, "3号温度传感器") }}</div>
<div class="text tem4">{{ getTemPreData(temArr, "4号温度传感器") }}</div> <div class="text tem4">{{ getTemPreData(temArr, "4号温度传感器") }}</div>
<div class="text tem5">{{ getTemPreData(temArr, "5号温度传感器") }}</div> <div class="text tem5">{{ getTemPreData(temArr, "5号温度传感器") }}</div>
<div class="text tem6">{{ getTemPreData(temArr, "6号温度传感器") }}</div> <div class="text tem6">{{ getTemPreData(temArr, "6号温度传感器") }}</div>
<div class="text tem7">{{ getTemPreData(temArr, "7号温度传感器") }}</div> <!-- <div class="text tem7">{{ getTemPreData(temArr, "7号温度传感器") }}</div> -->
<!-- 热量表1数据 --> <!-- 热量表1数据 -->
<div class="text intem1"> <div class="text intem1">
{{ getHotMeterTemp(hotArrOne, "进水温度",12) }} {{ getHotMeterTemp(hotArrOne, "进水温度", 12) }}
</div> </div>
<div class="text outtem1"> <div class="text outtem1">
{{ getHotMeterTemp(hotArrOne, "出水温度",12) }} {{ getHotMeterTemp(hotArrOne, "出水温度", 12) }}
</div> </div>
<div class="text nowhot1"> <div class="text nowhot1">
{{ getHotMeterTemp(hotArrOne, "瞬时热量",47) }}kwh {{ getHotMeterTemp(hotArrOne, "瞬时热量", 47) }}kw
</div> </div>
<!-- 热量表2数据 --> <!-- 热量表2数据 -->
<div class="text intem2"> <div class="text intem2">
{{ getHotMeterTemp(hotArrTwo, "进水温度",12) }} {{ getHotMeterTemp(hotArrTwo, "进水温度", 12) }}
</div> </div>
<div class="text outtem2"> <div class="text outtem2">
{{ getHotMeterTemp(hotArrTwo, "出水温度",12) }} {{ getHotMeterTemp(hotArrTwo, "出水温度", 12) }}
</div> </div>
<div class="text nowhot2"> <div class="text nowhot2">
{{ getHotMeterTemp(hotArrTwo, "瞬时热量",47) }}kwh {{ getHotMeterTemp(hotArrTwo, "瞬时热量", 47) }}kw
</div> </div>
<!-- 热量表3数据 --> <!-- 热量表3数据 -->
<div class="text intem3"> <div class="text intem3">
{{ getHotMeterTemp(hotArrThree, "进水温度",12) }} {{ getHotMeterTemp(hotArrThree, "进水温度", 12) }}
</div> </div>
<div class="text outtem3"> <div class="text outtem3">
{{ getHotMeterTemp(hotArrThree, "出水温度",12) }} {{ getHotMeterTemp(hotArrThree, "出水温度", 12) }}
</div> </div>
<div class="text nowhot3"> <div class="text nowhot3">
{{ getHotMeterTemp(hotArrThree, "瞬时热量",47) }}kwh {{ getHotMeterTemp(hotArrThree, "瞬时热量", 47) }}kw
</div> </div>
<!-- 热量表4数据 --> <!-- 热量表4数据 -->
<div class="text intem4"> <div class="text intem4">
{{ getHotMeterTemp(hotArrFour, "进水温度",12) }} {{ getHotMeterTemp(hotArrFour, "进水温度", 12) }}
</div> </div>
<div class="text outtem4"> <div class="text outtem4">
{{ getHotMeterTemp(hotArrFour, "出水温度",12) }} {{ getHotMeterTemp(hotArrFour, "出水温度", 12) }}
</div> </div>
<div class="text nowhot4"> <div class="text nowhot4">
{{ getHotMeterTemp(hotArrFour, "瞬时热量",47) }}kwh {{ getHotMeterTemp(hotArrFour, "瞬时热量", 47) }}kw
</div> </div>
<!-- 热量表5数据 --> <!-- 热量表5数据 -->
<div class="text intem5"> <div class="text intem5">
{{ getHotMeterTemp(hotArrFive, "进水温度",12) }} {{ getHotMeterTemp(hotArrFive, "进水温度", 12) }}
</div> </div>
<div class="text outtem5"> <div class="text outtem5">
{{ getHotMeterTemp(hotArrFive, "出水温度",12) }} {{ getHotMeterTemp(hotArrFive, "出水温度", 12) }}
</div> </div>
<div class="text nowhot5"> <div class="text nowhot5">
{{ getHotMeterTemp(hotArrFive, "瞬时热量",47) }}kwh {{ getHotMeterTemp(hotArrFive, "瞬时热量", 47) }}kw
</div> </div>
<!-- 热量表6数据 --> <!-- 热量表6数据 -->
<div class="text intem6"> <div class="text intem6">
{{ getHotMeterTemp(hotArrSix, "进水温度",12) }} {{ getHotMeterTemp(hotArrSix, "进水温度", 12) }}
</div> </div>
<div class="text outtem6"> <div class="text outtem6">
{{ getHotMeterTemp(hotArrSix, "出水温度",12) }} {{ getHotMeterTemp(hotArrSix, "出水温度", 12) }}
</div> </div>
<div class="text nowhot6"> <div class="text nowhot6">
{{ getHotMeterTemp(hotArrSix, "瞬时热量",47) }}kwh {{ getHotMeterTemp(hotArrSix, "瞬时热量", 47) }}kw
</div> </div>
<!-- 热量表7数据 --> <!-- 热量表7数据 -->
<div class="text intem7"> <div class="text intem7">
{{ getHotMeterTemp(hotArrSix, "进水温度",12) }} {{ getHotMeterTemp(hotArrSeven, "进水温度", 12) }}
</div> </div>
<div class="text outtem7"> <div class="text outtem7">
{{ getHotMeterTemp(hotArrSix, "出水温度",12) }} {{ getHotMeterTemp(hotArrSeven, "出水温度", 12) }}
</div> </div>
<div class="text nowhot7"> <div class="text nowhot7">
{{ getHotMeterTemp(hotArrSix, "瞬时热量",47) }}kwh {{ getHotMeterTemp(hotArrSeven, "瞬时热量", 47) }}kw
</div> </div>
<!-- 二通阀门 --> <!-- 二通阀门 -->
<div class="text valve1"> <div class="text valve1">
{{ getHotMeterTemp(valveOneArr, "开度反馈",4) }}% {{ getHotMeterTemp(valveOneArr, "开度反馈", 4) }}%
</div> </div>
<!-- 三通阀门 --> <!-- 三通阀门 -->
<div class="text valve2"> <div class="text valve2">
{{ getHotMeterTemp(valveTwoArr, "开度反馈",4) }}% {{ getHotMeterTemp(valveTwoArr, "开度反馈", 4) }}%
</div> </div>
</div> </div>
<!-- 控制弹框内容 -->
<el-dialog
:title="controlTitle"
:visible.sync="openHotDialog"
width="500px"
append-to-body
class="monitor-dialog"
>
<div class="hot-list">
<div class="hot-data">
<div class="hot-text">进水温度</div>
<div class="hot-details">
{{ getHotMeterTemp(hotDialogArr, "进水温度", 12) }}
</div>
</div>
<div class="hot-data">
<div class="hot-text">出水温度</div>
<div class="hot-details">
{{ getHotMeterTemp(hotDialogArr, "出水温度", 12) }}
</div>
</div>
<div class="hot-data">
<div class="hot-text">瞬时热量</div>
<div class="hot-details">
{{ getHotMeterTemp(hotDialogArr, "瞬时热量", 47) }}kw
</div>
</div>
<div class="hot-data">
<div class="hot-text">瞬时流量小时</div>
<div class="hot-details">
{{ getHotMeterTemp(hotDialogArr, "瞬时流量", 31) }}/h
</div>
</div>
</div>
</el-dialog>
</div> </div>
</template> </template>
@ -313,6 +364,10 @@ export default {
hotArrSeven: [], //7 hotArrSeven: [], //7
valveOneArr: [], // valveOneArr: [], //
valveTwoArr: [], // valveTwoArr: [], //
openHotDialog: false,
controlTitle: "热量表",
hotDialogArr: [],
}; };
}, },
computed: { computed: {
@ -538,7 +593,7 @@ export default {
console.log("热量表7数据:", this.hotArrSeven); console.log("热量表7数据:", this.hotArrSeven);
}, },
// / // /
getHotMeterTemp(arr, type,id) { getHotMeterTemp(arr, type, id) {
if (!arr || !Array.isArray(arr)) return null; if (!arr || !Array.isArray(arr)) return null;
// //
@ -697,6 +752,14 @@ export default {
// this.exitFullscreen(); // this.exitFullscreen();
this.$router.push("/alarm/alarmRecord"); this.$router.push("/alarm/alarmRecord");
}, },
//
hotListData(arr, title) {
this.hotDialogArr = [];
this.controlTitle = title;
this.hotDialogArr = arr;
console.log("当前热量表数据", this.hotDialogArr);
this.openHotDialog = true;
},
}, },
}; };
</script> </script>
@ -1299,6 +1362,7 @@ export default {
font-size: 0.16rem; font-size: 0.16rem;
padding: 0.06rem; padding: 0.06rem;
border: 0.01rem dashed #646866; border: 0.01rem dashed #646866;
cursor: pointer;
} }
.h2 { .h2 {
top: 3.15rem; top: 3.15rem;
@ -1307,6 +1371,7 @@ export default {
font-size: 0.16rem; font-size: 0.16rem;
padding: 0.06rem; padding: 0.06rem;
border: 0.01rem dashed #646866; border: 0.01rem dashed #646866;
cursor: pointer;
} }
.h3 { .h3 {
top: 4.25rem; top: 4.25rem;
@ -1315,6 +1380,7 @@ export default {
font-size: 0.16rem; font-size: 0.16rem;
padding: 0.06rem; padding: 0.06rem;
border: 0.01rem dashed #646866; border: 0.01rem dashed #646866;
cursor: pointer;
} }
.h4 { .h4 {
top: 5rem; top: 5rem;
@ -1323,6 +1389,7 @@ export default {
font-size: 0.16rem; font-size: 0.16rem;
padding: 0.06rem; padding: 0.06rem;
border: 0.01rem dashed #646866; border: 0.01rem dashed #646866;
cursor: pointer;
} }
.h5 { .h5 {
top: 7.9rem; top: 7.9rem;
@ -1331,6 +1398,7 @@ export default {
font-size: 0.16rem; font-size: 0.16rem;
padding: 0.06rem; padding: 0.06rem;
border: 0.01rem dashed #646866; border: 0.01rem dashed #646866;
cursor: pointer;
} }
.h6 { .h6 {
top: 8.35rem; top: 8.35rem;
@ -1339,6 +1407,7 @@ export default {
font-size: 0.16rem; font-size: 0.16rem;
padding: 0.06rem; padding: 0.06rem;
border: 0.01rem dashed #646866; border: 0.01rem dashed #646866;
cursor: pointer;
} }
.h7 { .h7 {
top: 5.5rem; top: 5.5rem;
@ -1347,6 +1416,33 @@ export default {
font-size: 0.16rem; font-size: 0.16rem;
padding: 0.06rem; padding: 0.06rem;
border: 0.01rem dashed #646866; border: 0.01rem dashed #646866;
cursor: pointer;
}
}
}
.hot-list {
display: flex;
flex-direction: column;
margin-left: 50px;
.hot-data {
display: flex;
flex-direction: row;
align-items: center;
margin-bottom: 10px;
.hot-text {
// text-align: center;
margin-right: 8px;
width: 100px;
}
.hot-details {
background-color: #1960a3;
border-radius: 10px;
padding: 8px 10px;
font-size: 16px;
width: 120px;
text-align: center;
font-weight: bold;
letter-spacing: 0.1em;
} }
} }
} }

Loading…
Cancel
Save