Commit f495636f authored by 陈龙's avatar 陈龙

feat: 变更设备报警的实现方式

parent 60c22585
import { request } from '@wisdom-utils/utils'; import {request} from '@wisdom-utils/utils';
import * as constants from '../../constants'; import * as constants from '../../constants';
const MonitorDevice = '/PandaMonitor/Monitor/Device'; const MonitorDevice = '/PandaMonitor/Monitor/Device';
const API = { const API = {
GET_ALARM_LIST_REAL_TIME: `${MonitorDevice}/GetAlarmListRealTime`, GET_ALARM_LIST_REAL_TIME: `${MonitorDevice}/GetAlarmListRealTime`,
GET_DEVICE_QUOTA_LIST: `${MonitorDevice}/GetQuotaList`, // GET_DEVICE_QUOTA_LIST: `${MonitorDevice}/GetQuotaList`, //
GET_EQUIPMENT_INFO: `${MonitorDevice}/GetEquipmentInfo`, // 获取设备树
}; };
const monitorServices = { const monitorServices = {
GetAlarmListRealTime: { GetAlarmListRealTime: {
...@@ -17,5 +18,10 @@ const monitorServices = { ...@@ -17,5 +18,10 @@ const monitorServices = {
method: constants.REQUEST_METHOD_GET, method: constants.REQUEST_METHOD_GET,
type: constants.REQUEST_HTTP, type: constants.REQUEST_HTTP,
}, },
getEquipmentInfo: {
url: API.GET_EQUIPMENT_INFO,
method: constants.REQUEST_METHOD_POST,
type: constants.REQUEST_HTTP,
},
}; };
export default monitorServices; export default monitorServices;
import React, { useState, useEffect, useRef } from 'react'; import React, {useState, useEffect, useRef} from 'react';
import styles from './index.less'; import styles from './index.less';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import { Tag, Tooltip, Modal } from 'antd'; import {Tag, Tooltip, Modal} from 'antd';
import { EnvironmentOutlined } from '@ant-design/icons'; import {EnvironmentOutlined} from '@ant-design/icons';
import { monitorService } from './api'; import {monitorService} from './api';
import moment from 'moment'; import moment from 'moment';
import classnames from 'classnames'; import classnames from 'classnames';
import { switchTimeToPeriod } from './utils'; import {switchTimeToPeriod} from './utils';
import NormChart from './NormChart/NormChart'; import NormChart from './NormChart/NormChart';
import { Swiper, SwiperSlide } from 'swiper/react'; import {Swiper, SwiperSlide} from 'swiper/react';
import 'swiper/swiper.min.css'; import 'swiper/swiper.min.css';
import 'swiper/components/pagination/pagination.min.css'; import 'swiper/components/pagination/pagination.min.css';
import 'swiper/components/navigation/navigation.min.css'; import 'swiper/components/navigation/navigation.min.css';
import SwiperCore, { Autoplay, Pagination, Navigation } from 'swiper/core'; import SwiperCore, {Autoplay, Pagination, Navigation} from 'swiper/core';
SwiperCore.use([Autoplay, Pagination, Navigation]); SwiperCore.use([Autoplay, Pagination, Navigation]);
/* /*
...@@ -21,7 +21,7 @@ SwiperCore.use([Autoplay, Pagination, Navigation]); ...@@ -21,7 +21,7 @@ SwiperCore.use([Autoplay, Pagination, Navigation]);
* 3. 初始化进入时,取截止到当前时间为止的所有的实时报警数据。 * 3. 初始化进入时,取截止到当前时间为止的所有的实时报警数据。
* 4. 播放结束后,重新获取实时报警数据进行第二轮的播放。 * 4. 播放结束后,重新获取实时报警数据进行第二轮的播放。
* */ * */
const InfoItem = ({ info }) => { const InfoItem = ({info}) => {
const returnClassName = (type, key) => { const returnClassName = (type, key) => {
let _className = ''; let _className = '';
if (type === '普通') { if (type === '普通') {
...@@ -31,7 +31,7 @@ const InfoItem = ({ info }) => { ...@@ -31,7 +31,7 @@ const InfoItem = ({ info }) => {
} }
return `${_className}${key}`; return `${_className}${key}`;
}; };
const { alertLevel, startTime, stationName, alertMsg, deviceAddress } = info; const {alertLevel, startTime, stationName, alertMsg, deviceAddress} = info;
return ( return (
<div className={styles[returnClassName(alertLevel, 'Wrapper')]}> <div className={styles[returnClassName(alertLevel, 'Wrapper')]}>
<Tag className={styles[returnClassName(alertLevel, 'Tag')]}>{alertLevel}</Tag> <Tag className={styles[returnClassName(alertLevel, 'Tag')]}>{alertLevel}</Tag>
...@@ -39,7 +39,7 @@ const InfoItem = ({ info }) => { ...@@ -39,7 +39,7 @@ const InfoItem = ({ info }) => {
<Tooltip title={deviceAddress} placement={'topLeft'}> <Tooltip title={deviceAddress} placement={'topLeft'}>
<span className={styles.location}> <span className={styles.location}>
<EnvironmentOutlined <EnvironmentOutlined
style={{ fontSize: 12, color: '#666666', marginRight: 5, verticalAlign: 'middle' }} style={{fontSize: 12, color: '#666666', marginRight: 5, verticalAlign: 'middle'}}
/> />
{deviceAddress} {deviceAddress}
</span> </span>
...@@ -63,18 +63,27 @@ const AlarmScrollAssembly = (props) => { ...@@ -63,18 +63,27 @@ const AlarmScrollAssembly = (props) => {
userAccess: true, userAccess: true,
}); });
const [realTimeDataList, setRealTimeDataList] = useState(null); const [realTimeDataList, setRealTimeDataList] = useState(null);
const getDeviceNumber = () => {
return monitorService.getEquipmentInfo({
deviceTypes: props.deviceType,
pageIndex: 1,
pageSize: 1,
...constanceRef.current,
})
};
const getRealTimeData = (pagination) => { const getRealTimeData = (pagination) => {
return monitorService.GetAlarmListRealTime({ return monitorService.GetAlarmListRealTime({
deviceType: props.deviceType, deviceType: props.deviceType,
...constanceRef.current, ...constanceRef.current,
pageIndex: pagination.pageIndex, pageIndex: pagination.pageIndex,
pageSize: pagination.pageSize, pageSize: pagination.pageSize,
dateFrom: moment().subtract(1, 'days').format('YYYY-MM-DD 00:00:00'), userAccess: props.userAccess === void 0 ? true : props.userAccess,
dateTo: moment().format('YYYY-MM-DD 23:59:59'), /* dateFrom: moment().subtract(1, 'days').format('YYYY-MM-DD 00:00:00'),
dateTo: moment().format('YYYY-MM-DD 23:59:59'),*/
}); });
}; };
const getData = async () => { const getData = async () => {
let firstRequest = await getRealTimeData({ pageSize: 1, pageIndex: 1 }); let firstRequest = await getDeviceNumber();
let secondRequest = await getRealTimeData({ let secondRequest = await getRealTimeData({
pageIndex: 1, pageIndex: 1,
pageSize: firstRequest.data.totalCount, pageSize: firstRequest.data.totalCount,
...@@ -118,7 +127,7 @@ const AlarmScrollAssembly = (props) => { ...@@ -118,7 +127,7 @@ const AlarmScrollAssembly = (props) => {
setModalVisible(true); setModalVisible(true);
}} }}
> >
<InfoItem key={index} info={item} /> <InfoItem key={index} info={item}/>
</SwiperSlide> </SwiperSlide>
); );
})} })}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment