fix:修改报警提示

web

8 天以前 81a0e26f1ba5fd0b95381ee902caa1579a8ec043

fix:修改报警提示

 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'
    })
}

 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'

 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';
          // })

 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 };

 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)
        }
    })
}


 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>

 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)


 vite.config.js

@@ -25,7 +25,7 @@
    },
    // vite 相关配置
    server: {
      port: 5036,
      port: 8038,
      host: true,
      open: true,
      proxy: {