diff --git a/src/feui/alarm-notice/index.js b/src/feui/alarm-notice/index.js index 12c7cb7..e43eea5 100644 --- a/src/feui/alarm-notice/index.js +++ b/src/feui/alarm-notice/index.js @@ -1,61 +1,63 @@ -import React, { useState, useEffect, useRef } from 'react' -import PropTypes from 'prop-types' -import { connect } from 'dva' -import { Icon, Badge, Modal } from 'antd' -import { Scrollbars } from 'react-custom-scrollbars' -import IFComponent from '../common/IFComponent' -import Socket from '../utils/socket' -import { isEqual } from 'lodash' +import React, { useState, useEffect, useRef } from 'react'; +import PropTypes from 'prop-types'; +import { connect } from 'dva'; +import { Icon, Badge, Modal } from 'antd'; +import { Scrollbars } from 'react-custom-scrollbars'; +import IFComponent from '../common/IFComponent'; +import Socket from '../utils/socket'; +import { isEqual } from 'lodash'; function AlarmNotice(props) { - const [visible, setVisible] = useState(false) + const [visible, setVisible] = useState(false); const [msg, setMsg] = useState({ AlarmId: null, TotalCount: 0, - Message: '' - }) + Message: '', + }); - const loginRef = useRef(props.login) + const loginRef = useRef(props.login); useEffect(() => { - loginRef.current = props.login - }, [props.login]) + loginRef.current = props.login; + }, [props.login]); useEffect(() => { - let timer = -1 + let timer = -1; if (msg && !msg.TotalCount && !msg.Message && visible) { timer = setTimeout(() => { - setVisible(false) - }, 5000) + setVisible(false); + }, 5000); } - return () => { clearTimeout(timer) } - }, [msg, visible]) + return () => { + clearTimeout(timer); + }; + }, [msg, visible]); - const refOfMsg = useRef(msg) + const refOfMsg = useRef(msg); useEffect(() => { - refOfMsg.current = msg - }) + refOfMsg.current = msg; + }); - const socket = useRef() + const socket = useRef(); useEffect(() => { - const { userId: UserId, OrgId } = props.login + const { userId: UserId, OrgId } = props.login; if (UserId && OrgId) { const socketIns = new Socket({ url: props.webSocketHost, autoReconnect: true, onopen: handleSocketOpened, - onmessage: handleSocketOnMsg - }) - socket.current = socketIns + onmessage: handleSocketOnMsg, + }); + socket.current = socketIns; } return () => { - socket.current && socket.current.close() - } - }, [props.login.userId, props.login.OrgId, props.login.Tenant]) + socket.current && socket.current.close(); + }; + }, [props.login.userId, props.login.OrgId, props.login.Tenant]); const handleSocketOpened = (socketIns) => { - const { user, userId: UserId, OrgId, Tenant } = loginRef.current + const { user, userId: UserId, OrgId, Tenant } = loginRef.current; const openedPayload = { TypeCode: 'P0001', Tenant, @@ -64,28 +66,28 @@ function AlarmNotice(props) { UserName: user.NAME, OrgId, Tenant, - ClientType: 0 - }) - } - socketIns.send(JSON.stringify(openedPayload)) - handleSocketSendMsg({}, socketIns) - } + ClientType: 0, + }), + }; + socketIns.send(JSON.stringify(openedPayload)); + handleSocketSendMsg({}, socketIns); + }; const handleSocketOnMsg = (data) => { if (data) { - console.log('收到消息', data) - const { TypeCode, Data } = JSON.parse(data) + console.log('收到消息', data); + const { TypeCode, Data } = JSON.parse(data); if (TypeCode === 'M0003' && Data) { - Data.Message && !isEqual(Data.Message, refOfMsg.current.Message) && !visible && setVisible(true) - setMsg(Data) + Data.Message && !isEqual(Data.Message, refOfMsg.current.Message) && !visible && setVisible(true); + setMsg(Data); } else if (TypeCode === 'MQ02') { - console.log('触发权限变更通知', data) + console.log('触发权限变更通知', data); Modal.warning({ title: '权限变更通知', content: '当前用户权限已变更!', okText: '确认', onOk: () => { - const { userId, OrgId, Tenant } = loginRef.current + const { userId, OrgId, Tenant } = loginRef.current; props.dispatch({ type: 'login/getLoginInfo', payload: { @@ -93,61 +95,66 @@ function AlarmNotice(props) { OrgId, Tenant, onlyData: false, - noReload: true - } - }) - } - }) + noReload: true, + }, + }); + }, + }); } } - } + }; const handleSocketSendMsg = (Data, socketIns) => { - const { userId: UserId, OrgId, Tenant } = loginRef.current + const { userId: UserId, OrgId, Tenant } = loginRef.current; // 这里 Data 需要 JSON.stringify(Data) 是因为后端限制 - const payload = { TypeCode: 'M0003', Tenant, Data: JSON.stringify({ UserId, OrgId, ...Data }) } - socketIns = socketIns || socket.current - socketIns && socketIns.send(JSON.stringify(payload)) - } + const payload = { TypeCode: 'M0003', Tenant, Data: JSON.stringify({ UserId, OrgId, ...Data }) }; + socketIns = socketIns || socket.current; + socketIns && socketIns.send(JSON.stringify(payload)); + }; const handleNext = () => { - if (!msg.TotalCount) return - handleSocketSendMsg({ AlarmId: msg.AlarmId }) - } + if (!msg.TotalCount) return; + handleSocketSendMsg({ AlarmId: msg.AlarmId }); + }; const handleItemClick = (id) => { - props.onItemClick instanceof Function && props.onItemClick(id) - } + props.onItemClick instanceof Function && props.onItemClick(id); + }; return ( -
-
{ setVisible(!visible) }} className='alarm-notice__toogle'> - -
+
+
{ + setVisible(!visible); + }} + className="alarm-notice__toogle" + > + +
-
+
暂无报警信息}>

handleItemClick(msg.AlarmId)}>{msg.Message}

- +
- ) + ); } AlarmNotice.propTypes = { webSocketHost: PropTypes.string.isRequired, - onItemClick: PropTypes.func -} + onItemClick: PropTypes.func, +}; -export default connect(({ login }) => ({ login }))(AlarmNotice) +export default connect(({ login }) => ({ login }))(AlarmNotice);