From 2f0fa3545b539e8b6f952ea82a1ca2350c64a0e8 Mon Sep 17 00:00:00 2001
From: web <candymxq888@outlook.com>
Date: 星期二, 22 四月 2025 17:28:48 +0800
Subject: [PATCH] fix:修改报警，添加参数
---
src/views/screen/temperature/home/index.vue | 46 ++++++++++++++++++++++++++++++++++------------
1 files changed, 34 insertions(+), 12 deletions(-)
diff --git a/src/views/screen/temperature/home/index.vue b/src/views/screen/temperature/home/index.vue
index 664e1f7..9fa20bc 100644
--- a/src/views/screen/temperature/home/index.vue
+++ b/src/views/screen/temperature/home/index.vue
@@ -2,25 +2,25 @@
<div class="home">
<div class="home-bg"></div>
<div class="home-c">
- <div class="point" v-for="(item, index) in pointList" :key="index" :style="{left: item.left, top: item.top}">
+ <div class="point" v-for="(item, index) in monitorList" :key="index" :style="{left: item.left, top: item.top}">
<div class="point-address" @click="handleShow(index)"></div>
<div class="point-message" v-show="item.showMsg">
<div class="msg-box">
- <div class="msg-t">{{ item.name }}</div>
+ <div class="msg-t">{{ item.pointName }}</div>
<div class="num">
<div class="item">
<div class="item-t">水温:</div>
- <div class="item-num"><span>{{item.temputer}}</span>°C</div>
+ <div class="item-num"><span>{{item.waterTemperature}}</span>°C</div>
</div>
<div class="item">
<div class="item-t">水位:</div>
- <div class="item-num"><span>{{ item.shuiwei }}</span>m</div>
+ <div class="item-num"><span>{{ item.waterLevel }}</span>m</div>
</div>
</div>
<div class="shebei">
监测设备：
- <span v-if="item.device === 1" style="color: #1ab394">监测设备运行正常(点击跳转)</span>
- <span v-else style="color: #ff0a0a">设备异常</span>
+ <span v-if="item.isOnline === 1">设备运作正常</span>
+ <span v-else style="color: red">设备运作异常</span>
</div>
</div>
</div>
@@ -31,16 +31,38 @@
<script setup>
+import pointApi from '@/api/facility/point.js'
+import {ref, onMounted} from "vue";
-const pointList = reactive([
- { name: '电站尾水出口水温监测点', temputer: 22, shuiwei: 1000, device: 1, left: '17%', top: '50%', showMsg: false },
- { name: '电站尾水出口水温监测点', temputer: 22, shuiwei: 1000, device: 2, left: '25%', top: '40%', showMsg: false },
-])
+const monitorList = ref([])
-const handleShow = (index) => {
- pointList[index].showMsg = !pointList[index].showMsg;
+// 标点配置
+const config = [
+ { left: '15%', top: '53%', showMsg: false },
+ { left: '12%', top: '68%', showMsg: false },
+]
+
+// 获取监控点列表
+const getMonitorList = () => {
+ pointApi().search({type: 1, page: 1, limit: 3}).then(res => {
+ let data = res.data.list.filter(el => el.parentId !== 0)
+ if(data.length > 2) data = data.splice(0, 1)
+ monitorList.value = data.map((item, index) => {
+ return {
+ ...item,
+ ...config[index]
+ }
+ })
+ })
}
+const handleShow = (index) => {
+ monitorList.value[index].showMsg = !monitorList.value[index].showMsg;
+}
+
+onMounted(() => {
+ getMonitorList()
+})
</script>
--
Gitblit v1.9.3