From 81a0e26f1ba5fd0b95381ee902caa1579a8ec043 Mon Sep 17 00:00:00 2001
From: web <candymxq888@outlook.com>
Date: 星期五, 11 四月 2025 17:31:47 +0800
Subject: [PATCH] fix:修改报警提示
---
src/utils/request.js | 4 +
src/api/screen/index.js | 13 ++++
src/main.js | 1
src/views/screen/pumpInfo/index.vue | 8 ++
vite.config.js | 2
src/utils/websocket.js | 115 ++++++++++++++++++++++++++++++++++++++
src/views/screen/home/index.vue | 4 +
src/warning.js | 20 ++++++
8 files changed, 162 insertions(+), 5 deletions(-)
diff --git a/src/api/screen/index.js b/src/api/screen/index.js
index c9b5e24..c3c67fa 100644
--- a/src/api/screen/index.js
+++ b/src/api/screen/index.js
@@ -13,7 +13,7 @@
}
/**
- * 获取报警信息
+ * 获取泵房报警信息
*/
export const getPumpWarning = (data) => {
return publicRequest({
@@ -21,4 +21,15 @@
method: 'post',
data
})
+}
+
+
+/**
+ * 获取报警code
+ */
+export const getWarningCode = () => {
+ return publicRequest({
+ url: '/heartbeatData/getByCode',
+ method: 'get'
+ })
}
\ No newline at end of file
diff --git a/src/main.js b/src/main.js
index bfb5348..45b0392 100644
--- a/src/main.js
+++ b/src/main.js
@@ -30,6 +30,7 @@
import elementIcons from '@/components/SvgIcon/svgicon'
import './permission' // permission control
+import './warning.js'
import { btnPerms } from './utils/permission'
import { parseTime, resetForm, addDateRange, handleTree, selectDictLabel, selectDictLabels } from '@/utils/ruoyi'
diff --git a/src/utils/request.js b/src/utils/request.js
index 052c672..dc7c3f5 100644
--- a/src/utils/request.js
+++ b/src/utils/request.js
@@ -1,6 +1,6 @@
import axios from 'axios'
import { ElNotification , ElMessageBox, ElMessage, ElLoading } from 'element-plus'
-import { getToken } from '@/utils/auth'
+import {getToken, removeToken} from '@/utils/auth'
import errorCode from '@/utils/errorCode'
import { tansParams, blobValidate } from '@/utils/ruoyi'
import cache from '@/plugins/cache'
@@ -91,6 +91,8 @@
isRelogin.show = true;
ElMessageBox.confirm('登录状态已过期，您可以继续留在该页面，或者重新登录', '系统提示', { confirmButtonText: '重新登录', cancelButtonText: '取消', type: 'warning' }).then(() => {
isRelogin.show = false;
+ removeToken()
+ window.location.reload();
// useUserStore().logOut().then(() => {
// location.href = '/index';
// })
diff --git a/src/utils/websocket.js b/src/utils/websocket.js
new file mode 100644
index 0000000..e44d091
--- /dev/null
+++ b/src/utils/websocket.js
@@ -0,0 +1,115 @@
+/**
+ * 监听报警
+ * 跟后端建websorcket通信，监听设备返回参数，如果一直在变则正常，不用报警，如果参数不变就考虑是断电等情况，需要报警
+ */
+import { ElMessage } from 'element-plus'
+import { getToken } from '@/utils/auth.js'
+
+let wsUrl = '';
+let socket = null;//实例对象
+let lockReconnect = false; //是否真正建立连接
+let timeout = 3 * 1000; //3秒一次心跳
+let timeoutObj = null; //心跳倒计时
+let serverTimeoutObj = null; //服务心跳倒计时
+let timeoutnum = null; //断开 重连倒计时
+
+// 初始
+const initWebsocket = (url) => {
+ if(url) wsUrl = url;
+ if("WebSocket" in window) {
+ socket = new WebSocket(wsUrl);
+ socket.onerror = webSocketOnError;
+ socket.onmessage = webSocketOnMessage;
+ socket.onclose = closeWebsocket;
+ socket.onopen = openWebsocket;
+ } else {
+ ElMessage.warning('你的浏览器不支持websocket，请更换浏览器')
+ }
+}
+
+//建立连接
+const openWebsocket = (e) => {
+ start();
+}
+
+const start = ()=> {
+ //开启心跳
+ timeoutObj && clearTimeout(timeoutObj);
+ serverTimeoutObj && clearTimeout(serverTimeoutObj);
+ timeoutObj = setTimeout(function() {
+ //这里发送一个心跳，后端收到后，返回一个心跳消息
+ if (socket.readyState == 1) {
+ //如果连接正常
+ // socket.send("heartbeat");
+ } else {
+ //否则重连
+ reconnect();
+ }
+ serverTimeoutObj = setTimeout(function() {
+ //超时关闭
+ socket.close();
+ }, timeout);
+ }, timeout);
+}
+
+//重置心跳
+const reset =() => {
+ //清除时间
+ clearTimeout(timeoutObj);
+ clearTimeout(serverTimeoutObj);
+ //重启心跳
+ start();
+}
+
+const sendWebsocket =(data) =>{
+ socket.send(data);
+}
+
+//服务器返回的数据
+const webSocketOnMessage=(e) => {
+ //判断是否登录
+ if (getToken()) {
+ //window自定义事件,addEventListener监听onmessageWS事件
+ window.dispatchEvent(
+ new CustomEvent("onmessageWS", {
+ detail: {
+ data: JSON.parse(e?.data),
+ },
+ })
+ );
+ }
+ reset();
+}
+
+//重新连接
+const reconnect =() => {
+ if (lockReconnect) {
+ return;
+ }
+ lockReconnect = true;
+ //没连接上会一直重连，设置延迟避免请求过多
+ timeoutnum && clearTimeout(timeoutnum);
+ timeoutnum = setTimeout(function() {
+ //新连接
+ initWebsocket();
+ lockReconnect = false;
+ }, 1000);
+}
+
+//断开连接
+const close =() => {
+ //WebSocket对象也有发送和关闭的两个方法，只需要在自定义方法中分别调用send()和close()即可实现。
+ socket.close();
+}
+
+const closeWebsocket=(e) => {
+ reconnect();
+}
+
+const webSocketOnError =(e) => {
+ reconnect();
+
+}
+
+
+export default { initWebsocket, sendWebsocket, webSocketOnMessage, close };
\ No newline at end of file
diff --git a/src/views/screen/home/index.vue b/src/views/screen/home/index.vue
index ff685fe..a77ce38 100644
--- a/src/views/screen/home/index.vue
+++ b/src/views/screen/home/index.vue
@@ -101,6 +101,10 @@
const getWarning = () => {
getPumpWarning({limit: 10, page:1}).then(res => {
warnList.value = res.data.list
+ }).catch(err => {
+ if(err.message.includes("timeout")){
+ clearInterval(timer)
+ }
})
}
diff --git a/src/views/screen/pumpInfo/index.vue b/src/views/screen/pumpInfo/index.vue
index 836f5d7..fb16372 100644
--- a/src/views/screen/pumpInfo/index.vue
+++ b/src/views/screen/pumpInfo/index.vue
@@ -46,6 +46,10 @@
}
})
list.value = newArr.splice(0,hasPump)
+ }).catch(err => {
+ if(err.message.includes("timeout")){
+ clearInterval(timer)
+ }
})
}
@@ -119,7 +123,7 @@
<div class="run">
<div class="run-item">
<div class="name">工作状态</div>
- <div :class="(item[`cB00${index+1}Start`] || item[`cB00${index+1}Run`]) === '开' ? 'val' : 'error'">{{(item[`cB00${index+1}Start`] || item[`cB00${index+1}Run`]) === '开' ? '启动' : '关闭'}}</div>
+ <div :class="(item[`cB00${index+1}Start`] === '开' || item[`cB00${index+1}Run`] === '开') ? 'val' : 'error'">{{(item[`cB00${index+1}Start`] === '开' || item[`cB00${index+1}Run`] === '开') ? '启动' : '关闭'}}</div>
</div>
<div class="run-item">
<div class="name">运行状态</div>
@@ -171,7 +175,7 @@
</div>
<div class="run-item">
<div class="name">单次运行时长</div>
- <div class="val">{{ item[`cB00${index+1}Time`] }}</div>
+ <div :class="item[`cB00${index+1}Time`].includes('时') ? 'error' : 'val'">{{ item[`cB00${index+1}Time`] }}</div>
</div>
<div class="run-item">
<div class="name">正向累计流量</div>
diff --git a/src/warning.js b/src/warning.js
new file mode 100644
index 0000000..c2331cf
--- /dev/null
+++ b/src/warning.js
@@ -0,0 +1,20 @@
+import {getPumpWarning} from '@/api/screen/index.js'
+import { ElNotification } from 'element-plus'
+
+let timeout = 1000 * 3;
+let timer = null;
+
+// timer = setInterval(() => {
+// getPumpWarning({limit: 1, page:1}).then(res => {
+// if (res.data.list.length > 0) {
+// ElNotification.closeAll()
+// ElNotification({
+// title: '错误',
+// message: res.data.list[0].description,
+// type: 'error',
+// duration: 0
+// })
+// }
+// })
+// }, timeout)
+
diff --git a/vite.config.js b/vite.config.js
index 7467f43..5731f79 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -25,7 +25,7 @@
},
// vite 相关配置
server: {
- port: 5036,
+ port: 8038,
host: true,
open: true,
proxy: {
--
Gitblit v1.9.3