Commit b32e0a32 authored by 程恺文's avatar 程恺文

修改

parent 56a7c085
# Change Log # Change Log
All notable changes to this project will be documented in this file. All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
## [1.12.1](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/alarmscrollassembly@1.12.0...@wisdom-components/alarmscrollassembly@1.12.1) (2023-05-16) ## [1.12.1](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/alarmscrollassembly@1.12.0...@wisdom-components/alarmscrollassembly@1.12.1) (2023-05-16)
**Note:** Version bump only for package @wisdom-components/alarmscrollassembly **Note:** Version bump only for package @wisdom-components/alarmscrollassembly
# [1.12.0](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/alarmscrollassembly@1.11.2...@wisdom-components/alarmscrollassembly@1.12.0) (2023-05-12) # [1.12.0](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/alarmscrollassembly@1.11.2...@wisdom-components/alarmscrollassembly@1.12.0) (2023-05-12)
### Features ### Features
......
...@@ -190,7 +190,7 @@ AlarmScrollAssembly.defaultProps = { ...@@ -190,7 +190,7 @@ AlarmScrollAssembly.defaultProps = {
prefix: '', prefix: '',
showTotal: true, showTotal: true,
interval: 5, interval: 5,
userAccess:false userAccess: false,
}; };
AlarmScrollAssembly.propTypes = { AlarmScrollAssembly.propTypes = {
deviceType: PropTypes.string, deviceType: PropTypes.string,
......
...@@ -129,9 +129,9 @@ ...@@ -129,9 +129,9 @@
width: 120px; width: 120px;
max-width: 120px; max-width: 120px;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
color: #333333; color: #333333;
white-space: nowrap;
text-overflow: ellipsis;
} }
.location { .location {
...@@ -158,11 +158,11 @@ ...@@ -158,11 +158,11 @@
display: inline-block; display: inline-block;
width: 120px; width: 120px;
max-width: 120px; max-width: 120px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
margin-left: 10px; margin-left: 10px;
overflow: hidden;
color: #333333; color: #333333;
white-space: nowrap;
text-overflow: ellipsis;
} }
} }
......
# Change Log # Change Log
All notable changes to this project will be documented in this file. All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
## [1.5.7](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/basicchart@1.5.6...@wisdom-components/basicchart@1.5.7) (2023-05-16) ## [1.5.7](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/basicchart@1.5.6...@wisdom-components/basicchart@1.5.7) (2023-05-16)
**Note:** Version bump only for package @wisdom-components/basicchart **Note:** Version bump only for package @wisdom-components/basicchart
## [1.5.6](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/basicchart@1.5.5...@wisdom-components/basicchart@1.5.6) (2023-05-12) ## [1.5.6](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/basicchart@1.5.5...@wisdom-components/basicchart@1.5.6) (2023-05-12)
### Bug Fixes ### Bug Fixes
......
# Change Log # Change Log
All notable changes to this project will be documented in this file. All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
## [1.1.5](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/videoslidermodal@1.1.4...@wisdom-components/videoslidermodal@1.1.5) (2023-05-16) ## [1.1.5](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/videoslidermodal@1.1.4...@wisdom-components/videoslidermodal@1.1.5) (2023-05-16)
**Note:** Version bump only for package @wisdom-components/videoslidermodal **Note:** Version bump only for package @wisdom-components/videoslidermodal
## [1.1.4](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/videoslidermodal@1.1.3...@wisdom-components/videoslidermodal@1.1.4) (2023-05-16) ## [1.1.4](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/videoslidermodal@1.1.3...@wisdom-components/videoslidermodal@1.1.4) (2023-05-16)
**Note:** Version bump only for package @wisdom-components/videoslidermodal **Note:** Version bump only for package @wisdom-components/videoslidermodal
## [1.1.3](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/videoslidermodal@1.1.2...@wisdom-components/videoslidermodal@1.1.3) (2023-05-12) ## [1.1.3](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/videoslidermodal@1.1.2...@wisdom-components/videoslidermodal@1.1.3) (2023-05-12)
**Note:** Version bump only for package @wisdom-components/videoslidermodal **Note:** Version bump only for package @wisdom-components/videoslidermodal
......
# Change Log # Change Log
All notable changes to this project will be documented in this file. All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
## [1.2.2](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/VmsVideo@1.2.1...@wisdom-components/VmsVideo@1.2.2) (2023-05-16) ## [1.2.2](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/VmsVideo@1.2.1...@wisdom-components/VmsVideo@1.2.2) (2023-05-16)
**Note:** Version bump only for package @wisdom-components/VmsVideo **Note:** Version bump only for package @wisdom-components/VmsVideo
## [1.2.1](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/VmsVideo@1.2.0...@wisdom-components/VmsVideo@1.2.1) (2023-05-16) ## [1.2.1](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/VmsVideo@1.2.0...@wisdom-components/VmsVideo@1.2.1) (2023-05-16)
**Note:** Version bump only for package @wisdom-components/VmsVideo **Note:** Version bump only for package @wisdom-components/VmsVideo
# [1.2.0](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/VmsVideo@1.1.13...@wisdom-components/VmsVideo@1.2.0) (2023-05-12) # [1.2.0](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/VmsVideo@1.1.13...@wisdom-components/VmsVideo@1.2.0) (2023-05-12)
### Features ### Features
......
...@@ -42,8 +42,8 @@ group: ...@@ -42,8 +42,8 @@ group:
| address | 地址 | string | "123638446" | | address | 地址 | string | "123638446" |
| protocol | 协议类型 | string | "萤石 EZOPEN" | | protocol | 协议类型 | string | "萤石 EZOPEN" |
| gateway | 是否走网关 | boolean | false | | gateway | 是否走网关 | boolean | false |
| pandavmsHost | pandavms后端主机地址 eg | string | ws://172.16.19.19:8080/ | | pandavmsHost | pandavms 后端主机地址 eg | string | ws://172.16.19.19:8080/ |
| useFullUrl | 是否为完整 url,是,则取 fullUrl,否,则会用 pandavmsHostid 去拼接 | boolean | false | | useFullUrl | 是否为完整 url,是,则取 fullUrl,否,则会用 pandavmsHostid 去拼接 | boolean | false |
| id | 摄像头唯一标识,一串 GUID | string | "" | | id | 摄像头唯一标识,一串 GUID | string | "" |
| name | 摄像头名称 | string | "" | | name | 摄像头名称 | string | "" |
| dataRate | 码率,Main 为主码流,Sub 为辅码流,与消耗网络有关,主码流消耗最高,**由于拼接方式不定,改为是字符串传入** | string | 'Sub' | | dataRate | 码率,Main 为主码流,Sub 为辅码流,与消耗网络有关,主码流消耗最高,**由于拼接方式不定,改为是字符串传入** | string | 'Sub' |
......
...@@ -46,8 +46,8 @@ const Demo1 = (props) => { ...@@ -46,8 +46,8 @@ const Demo1 = (props) => {
dataRate: 'Sub', // Main 主码流 Sub 子码流 dataRate: 'Sub', // Main 主码流 Sub 子码流
pandavmsHost: `ws://192.168.8.27:9876/`, // pandavms后端主机地址 eg: ws://172.16.19.19:8080/ pandavmsHost: `ws://192.168.8.27:9876/`, // pandavms后端主机地址 eg: ws://172.16.19.19:8080/
address: '236644034', address: '236644034',
width:952, width: 952,
height:500, height: 500,
}; };
/* { /* {
......
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
* @Author: 634665781 634665781@qq.com * @Author: 634665781 634665781@qq.com
* @Date: 2023-04-11 13:40:18 * @Date: 2023-04-11 13:40:18
* @LastEditors: 634665781 634665781@qq.com * @LastEditors: 634665781 634665781@qq.com
* @LastEditTime: 2023-05-16 16:23:33 * @LastEditTime: 2023-05-17 09:45:01
* @FilePath: \wisdom-components\packages\base-components\VmsVideo\src\index.jsx * @FilePath: \wisdom-components\packages\base-components\VmsVideo\src\index.jsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/ */
...@@ -36,9 +36,9 @@ import style from './index.less'; ...@@ -36,9 +36,9 @@ import style from './index.less';
const Video = (props, ref) => { const Video = (props, ref) => {
const _video = useRef(null); const _video = useRef(null);
const Players = useRef(null); const Players = useRef(null);
const { VideoInfo, JessibucaObj,gateway } = props; const { VideoInfo, JessibucaObj, gateway } = props;
let baseUrl = `ws://${window.location.host}/jessica`; let baseUrl = `ws://${window.location.host}/jessica`;
let keyID =VideoInfo.id+'_'+new Date().getTime() let keyID = VideoInfo.id + '_' + new Date().getTime();
let _VideoInfo = { let _VideoInfo = {
title: '摄像头', title: '摄像头',
// dataRate: 1, // dataRate: 1,
...@@ -48,6 +48,7 @@ const Video = (props, ref) => { ...@@ -48,6 +48,7 @@ const Video = (props, ref) => {
}; };
const getToken = async () => { const getToken = async () => {
let PlayersA =''
axios axios
.post( .post(
`https://open.ys7.com/api/lapp/token/get?appKey=${VideoInfo.username}&appSecret=${VideoInfo.password}`, `https://open.ys7.com/api/lapp/token/get?appKey=${VideoInfo.username}&appSecret=${VideoInfo.password}`,
...@@ -61,14 +62,14 @@ const Video = (props, ref) => { ...@@ -61,14 +62,14 @@ const Video = (props, ref) => {
.then(function (response) { .then(function (response) {
let accessToken = response.data.data.accessToken; let accessToken = response.data.data.accessToken;
let PlayersA = new EZUIKit.EZUIKitPlayer({ PlayersA = new EZUIKit.EZUIKitPlayer({
id: keyID, // 视频容器ID id: keyID, // 视频容器ID
accessToken: accessToken, accessToken: accessToken,
url: `ezopen://open.ys7.com/${VideoInfo.address}/1.hd.live`, url: `ezopen://open.ys7.com/${VideoInfo.address}/1.hd.live`,
templete: 'simple', templete: 'simple',
footer: ['talk', 'broadcast', 'hd', 'fullScreen'], footer: ['talk', 'broadcast', 'hd', 'fullScreen'],
width:VideoInfo.width||952, width: VideoInfo.width || 952,
height:VideoInfo.height||500 height: VideoInfo.height || 500,
}); });
PlayersA.pause = PlayersA.stop; PlayersA.pause = PlayersA.stop;
...@@ -77,7 +78,7 @@ const Video = (props, ref) => { ...@@ -77,7 +78,7 @@ const Video = (props, ref) => {
.catch(function (error) { .catch(function (error) {
console.log(error); console.log(error);
PlayersA.stop() PlayersA.stop();
}); });
}; };
...@@ -89,7 +90,8 @@ const Video = (props, ref) => { ...@@ -89,7 +90,8 @@ const Video = (props, ref) => {
} else { } else {
getToken(); getToken();
} }
const CommonPath = (VideoInfo.gateway || window?.globalConfig?.hasGateWay) ? 'PandaCore/GateWay/Video/' : ''; // 配置了gateway或者pc端web配置中有gateway const CommonPath =
VideoInfo.gateway || window?.globalConfig?.hasGateWay ? 'PandaCore/GateWay/Video/' : ''; // 配置了gateway或者pc端web配置中有gateway
VideoInfo.url = VideoInfo.useFullUrl VideoInfo.url = VideoInfo.useFullUrl
? VideoInfo.fullUrl ? VideoInfo.fullUrl
: (VideoInfo.pandavmsHost || 'ws://' + location.host + '/') + : (VideoInfo.pandavmsHost || 'ws://' + location.host + '/') +
......
# Change Log # Change Log
All notable changes to this project will be documented in this file. All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
## [1.4.57](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/ec_configurationview@1.4.56...@wisdom-components/ec_configurationview@1.4.57) (2023-05-16) ## [1.4.57](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/ec_configurationview@1.4.56...@wisdom-components/ec_configurationview@1.4.57) (2023-05-16)
**Note:** Version bump only for package @wisdom-components/ec_configurationview **Note:** Version bump only for package @wisdom-components/ec_configurationview
## [1.4.56](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/ec_configurationview@1.4.55...@wisdom-components/ec_configurationview@1.4.56) (2023-05-15) ## [1.4.56](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/ec_configurationview@1.4.55...@wisdom-components/ec_configurationview@1.4.56) (2023-05-15)
### Bug Fixes ### Bug Fixes
......
# Change Log # Change Log
All notable changes to this project will be documented in this file. All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
## [1.11.1](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/ec_historyview@1.11.0...@wisdom-components/ec_historyview@1.11.1) (2023-05-16) ## [1.11.1](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/ec_historyview@1.11.0...@wisdom-components/ec_historyview@1.11.1) (2023-05-16)
**Note:** Version bump only for package @wisdom-components/ec_historyview **Note:** Version bump only for package @wisdom-components/ec_historyview
# [1.11.0](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/ec_historyview@1.10.0...@wisdom-components/ec_historyview@1.11.0) (2023-05-12) # [1.11.0](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/ec_historyview@1.10.0...@wisdom-components/ec_historyview@1.11.0) (2023-05-12)
### Features ### Features
......
...@@ -15,7 +15,7 @@ const SimgleChart = memo((props) => { ...@@ -15,7 +15,7 @@ const SimgleChart = memo((props) => {
deviceAlarmSchemes, deviceAlarmSchemes,
chartType, chartType,
// justLine, // justLine,
showBoxOption showBoxOption,
} = props; } = props;
const chartRef = useRef(); const chartRef = useRef();
...@@ -29,7 +29,7 @@ const SimgleChart = memo((props) => { ...@@ -29,7 +29,7 @@ const SimgleChart = memo((props) => {
showPoint: true, showPoint: true,
chartType, chartType,
// justLine, // justLine,
showBoxOption showBoxOption,
}; };
return optionGenerator(dataSource, null, contrast, contrastOption, smooth, config); return optionGenerator(dataSource, null, contrast, contrastOption, smooth, config);
}, [dataSource, smooth, curveCenter]); }, [dataSource, smooth, curveCenter]);
...@@ -44,9 +44,9 @@ const SimgleChart = memo((props) => { ...@@ -44,9 +44,9 @@ const SimgleChart = memo((props) => {
const option = cloneDeep(chart.getOption()); const option = cloneDeep(chart.getOption());
const needMarkLine = count === 1; const needMarkLine = count === 1;
// 需求变更:设备离线改用“是否在线”的数据,离线的状态标记的数据用该部分的数据。 2023年4月25日09:36:55 // 需求变更:设备离线改用“是否在线”的数据,离线的状态标记的数据用该部分的数据。 2023年4月25日09:36:55
let _tempDataArray = dataSource.filter(item => item.sensorName === '是否在线'); let _tempDataArray = dataSource.filter((item) => item.sensorName === '是否在线');
option.series.forEach((item, index) => { option.series.forEach((item, index) => {
let _data = _tempDataArray.find(offline => offline.stationCode === item.stationCode); let _data = _tempDataArray.find((offline) => offline.stationCode === item.stationCode);
let offlineAreas = offlineArea(_data); let offlineAreas = offlineArea(_data);
if (offlineAreas.data?.length) { if (offlineAreas.data?.length) {
option.markArea = null; option.markArea = null;
......
...@@ -23,11 +23,7 @@ const deviceParams = [ ...@@ -23,11 +23,7 @@ const deviceParams = [
}, },
]; ];
const Demo = () => { const Demo = () => {
return ( return <div style={{ height: 700 }}>{/*<HistoryView deviceParams={deviceParams} grid />*/}</div>;
<div style={{ height: 700 }}>
{/*<HistoryView deviceParams={deviceParams} grid />*/}
</div>
);
}; };
export default Demo; export default Demo;
import React, {useContext, useEffect, useMemo, useState} from 'react'; import React, { useContext, useEffect, useMemo, useState } from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import classNames from 'classnames'; import classNames from 'classnames';
import { import {
...@@ -23,14 +23,14 @@ import _ from 'lodash'; ...@@ -23,14 +23,14 @@ import _ from 'lodash';
import TimeRangePicker from '@wisdom-components/timerangepicker'; import TimeRangePicker from '@wisdom-components/timerangepicker';
import PandaEmpty from '@wisdom-components/empty'; import PandaEmpty from '@wisdom-components/empty';
import BasicTable from '@wisdom-components/basictable'; import BasicTable from '@wisdom-components/basictable';
import {getHistoryInfo, getDeviceAlarmScheme, getExportDeviceHistoryUrl} from './apis'; import { getHistoryInfo, getDeviceAlarmScheme, getExportDeviceHistoryUrl } from './apis';
import SimgleChart from './SingleChart'; import SimgleChart from './SingleChart';
import GridChart from './GridChart'; import GridChart from './GridChart';
import './index.less'; import './index.less';
import {globalConfig} from 'antd/lib/config-provider'; import { globalConfig } from 'antd/lib/config-provider';
const {RangePicker} = DatePicker; const { RangePicker } = DatePicker;
const {Option} = Select; const { Option } = Select;
const startFormat = 'YYYY-MM-DD 00:00:00'; const startFormat = 'YYYY-MM-DD 00:00:00';
const endFormat = 'YYYY-MM-DD 23:59:59'; const endFormat = 'YYYY-MM-DD 23:59:59';
...@@ -80,8 +80,8 @@ const CheckboxData = [ ...@@ -80,8 +80,8 @@ const CheckboxData = [
showInTable: true, showInTable: true,
tooltip: '本算法采用递推平均滤波法(滑动平均滤波法)对采样数据进行均值化平滑处理。', tooltip: '本算法采用递推平均滤波法(滑动平均滤波法)对采样数据进行均值化平滑处理。',
}, },
// 需求变更,剔除 // 需求变更,剔除
/* { /* {
key: 'justLine', key: 'justLine',
label: '仅查看曲线', label: '仅查看曲线',
type: '', type: '',
...@@ -221,7 +221,7 @@ const timeColumn = { ...@@ -221,7 +221,7 @@ const timeColumn = {
}; };
const HistoryView = (props) => { const HistoryView = (props) => {
const {getPrefixCls} = useContext(ConfigProvider.ConfigContext); const { getPrefixCls } = useContext(ConfigProvider.ConfigContext);
const prefixCls = getPrefixCls('history-view'); const prefixCls = getPrefixCls('history-view');
const { const {
...@@ -234,7 +234,8 @@ const HistoryView = (props) => { ...@@ -234,7 +234,8 @@ const HistoryView = (props) => {
showModels, showModels,
needMarkLine, needMarkLine,
} = props; } = props;
const isBoxPlots = deviceParams?.length === 1 && deviceParams[0]?.sensors?.split(',').length === 1; const isBoxPlots =
deviceParams?.length === 1 && deviceParams[0]?.sensors?.split(',').length === 1;
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [activeTabKey, setActiveTabKey] = useState(defaultModel); const [activeTabKey, setActiveTabKey] = useState(defaultModel);
...@@ -361,13 +362,13 @@ const HistoryView = (props) => { ...@@ -361,13 +362,13 @@ const HistoryView = (props) => {
onContrastChange(contrastOption); onContrastChange(contrastOption);
setShowBoxOption(false); setShowBoxOption(false);
setChartType('lineChart'); setChartType('lineChart');
onCheckboxChange({target: {value: false}}, 'chartType'); onCheckboxChange({ target: { value: false } }, 'chartType');
onCheckboxChange({target: {value: false}}, 'ignoreOutliers'); onCheckboxChange({ target: { value: false } }, 'ignoreOutliers');
} else { } else {
// 自定义 // 自定义
// 不需要处理 // 不需要处理
setShowBoxOption(true); setShowBoxOption(true);
onCheckboxChange({target: {value: true}}, 'chartType'); onCheckboxChange({ target: { value: true } }, 'chartType');
} }
}; };
...@@ -396,7 +397,7 @@ const HistoryView = (props) => { ...@@ -396,7 +397,7 @@ const HistoryView = (props) => {
)} )}
{timeValue === 'contrast' && ( // 同期对比 {timeValue === 'contrast' && ( // 同期对比
<> <>
<Select value={contrastOption} style={{width: 60}} onChange={onContrastChange}> <Select value={contrastOption} style={{ width: 60 }} onChange={onContrastChange}>
<Option value="day"></Option> <Option value="day"></Option>
<Option value="month"></Option> <Option value="month"></Option>
</Select> </Select>
...@@ -413,7 +414,7 @@ const HistoryView = (props) => { ...@@ -413,7 +414,7 @@ const HistoryView = (props) => {
className={classNames(`${prefixCls}-contrast-delete`)} className={classNames(`${prefixCls}-contrast-delete`)}
onClick={() => handleDeleteDatePicker(index)} onClick={() => handleDeleteDatePicker(index)}
> >
<CloseCircleFilled/> <CloseCircleFilled />
</div> </div>
)} )}
</div> </div>
...@@ -422,7 +423,7 @@ const HistoryView = (props) => { ...@@ -422,7 +423,7 @@ const HistoryView = (props) => {
)} )}
</div> </div>
))} ))}
{datePickerArr.length < 5 && <PlusCircleOutlined onClick={handleAddDatePicker}/>} {datePickerArr.length < 5 && <PlusCircleOutlined onClick={handleAddDatePicker} />}
</> </>
)} )}
</div> </div>
...@@ -433,15 +434,15 @@ const HistoryView = (props) => { ...@@ -433,15 +434,15 @@ const HistoryView = (props) => {
const onCheckboxChange = (e, key, showJustLine) => { const onCheckboxChange = (e, key, showJustLine) => {
let data = [...checkboxData]; let data = [...checkboxData];
// let _index = data.findIndex(item => item.key === 'justLine'); // 仅查看曲线会在勾选了数据滤波后展示 // let _index = data.findIndex(item => item.key === 'justLine'); // 仅查看曲线会在勾选了数据滤波后展示
let _index1 = data.findIndex(item => item.key === 'ignoreOutliers'); // 仅查看曲线会在勾选了数据滤波后展示 let _index1 = data.findIndex((item) => item.key === 'ignoreOutliers'); // 仅查看曲线会在勾选了数据滤波后展示
data.forEach((item) => { data.forEach((item) => {
if (item.key === key) { if (item.key === key) {
item.checked = e.target.checked; item.checked = e.target.checked;
} }
}); });
if (key === 'ignoreOutliers') { if (key === 'ignoreOutliers') {
// 需求变更,仅查看曲线剔除 // 需求变更,仅查看曲线剔除
/* if (showJustLine) { /* if (showJustLine) {
data[_index].showInCurve = e.target.checked; data[_index].showInCurve = e.target.checked;
data[_index].checked = e.target.checked; data[_index].checked = e.target.checked;
} else {*/ } else {*/
...@@ -478,7 +479,7 @@ const HistoryView = (props) => { ...@@ -478,7 +479,7 @@ const HistoryView = (props) => {
</Checkbox> </Checkbox>
{child.tooltip && ( {child.tooltip && (
<Tooltip title={child.tooltip}> <Tooltip title={child.tooltip}>
<QuestionCircleFilled className={`${prefixCls}-question`}/> <QuestionCircleFilled className={`${prefixCls}-question`} />
</Tooltip> </Tooltip>
)} )}
</> </>
...@@ -488,22 +489,32 @@ const HistoryView = (props) => { ...@@ -488,22 +489,32 @@ const HistoryView = (props) => {
const renderCurveOption = (isChart, isSingle) => { const renderCurveOption = (isChart, isSingle) => {
return ( return (
<div className={classNames(`${prefixCls}-cover`)} style={isChart && isSingle ? {width: '100%'} : {}}> <div
{ className={classNames(`${prefixCls}-cover`)}
isChart && isSingle && showBoxOption ? <> style={isChart && isSingle ? { width: '100%' } : {}}
>
{isChart && isSingle && showBoxOption ? (
<>
<div className={classNames(`${prefixCls}-label`)}>曲线形态</div> <div className={classNames(`${prefixCls}-label`)}>曲线形态</div>
<Radio.Group value={chartType} style={{marginRight: 16}} onChange={(e) => { <Radio.Group
value={chartType}
style={{ marginRight: 16 }}
onChange={(e) => {
let _value = e.target.value; let _value = e.target.value;
setChartType(_value); setChartType(_value);
onCheckboxChange({target: {value: _value !== 'boxChart'}}, 'chartType') onCheckboxChange({ target: { value: _value !== 'boxChart' } }, 'chartType');
}}> }}
>
<Radio.Button value={'lineChart'}>线形图</Radio.Button> <Radio.Button value={'lineChart'}>线形图</Radio.Button>
<Radio.Button value={'boxChart'}>箱线图</Radio.Button> <Radio.Button value={'boxChart'}>箱线图</Radio.Button>
</Radio.Group></> : '' </Radio.Group>
} </>
) : (
''
)}
<div className={classNames(`${prefixCls}-label`)}>曲线设置</div> <div className={classNames(`${prefixCls}-label`)}>曲线设置</div>
{checkboxData.map((child) => { {checkboxData.map((child) => {
const box = renderCheckbox(child, (isChart && isSingle)); const box = renderCheckbox(child, isChart && isSingle);
if (!box) return null; if (!box) return null;
return ( return (
<div key={child.key} className={`${prefixCls}-cover-item`}> <div key={child.key} className={`${prefixCls}-cover-item`}>
...@@ -514,7 +525,7 @@ const HistoryView = (props) => { ...@@ -514,7 +525,7 @@ const HistoryView = (props) => {
{activeTabKey === 'table' && ( {activeTabKey === 'table' && (
<Select <Select
value={dataThinKey} value={dataThinKey}
style={{width: 90}} style={{ width: 90 }}
onChange={onTimeIntervalChange} onChange={onTimeIntervalChange}
disabled={!dataConfig.dataThin} disabled={!dataConfig.dataThin}
> >
...@@ -552,15 +563,14 @@ const HistoryView = (props) => { ...@@ -552,15 +563,14 @@ const HistoryView = (props) => {
aDom.click(); aDom.click();
aDom.remove(); aDom.remove();
}) })
.catch((err) => { .catch((err) => {});
});
}); });
}; };
const handleTableData = (data) => { const handleTableData = (data) => {
const ignoreOutliers = checkboxData.find((item) => item.key === 'ignoreOutliers').checked; const ignoreOutliers = checkboxData.find((item) => item.key === 'ignoreOutliers').checked;
const dataIndexAccess = (dataItem, index) => { const dataIndexAccess = (dataItem, index) => {
const {stationCode, sensorName} = dataItem; const { stationCode, sensorName } = dataItem;
return `${stationCode}-${sensorName}-${index}`; return `${stationCode}-${sensorName}-${index}`;
}; };
...@@ -571,7 +581,7 @@ const HistoryView = (props) => { ...@@ -571,7 +581,7 @@ const HistoryView = (props) => {
// 处理表头数据 // 处理表头数据
const columnsData = data.map((item, index) => { const columnsData = data.map((item, index) => {
const {stationCode, equipmentName, sensorName, unit, dataModel} = item; const { stationCode, equipmentName, sensorName, unit, dataModel } = item;
const dataIndex = dataIndexAccess(item, index); const dataIndex = dataIndexAccess(item, index);
let col = { let col = {
title: `${equipmentName}-${sensorName}${unit ? `(${unit})` : ''}`, title: `${equipmentName}-${sensorName}${unit ? `(${unit})` : ''}`,
...@@ -594,7 +604,7 @@ const HistoryView = (props) => { ...@@ -594,7 +604,7 @@ const HistoryView = (props) => {
const timeData = {}; const timeData = {};
const buildDefaultData = (time) => { const buildDefaultData = (time) => {
const obj = {key: time, time: time}; const obj = { key: time, time: time };
data.forEach((item, index) => { data.forEach((item, index) => {
const dataIndex = dataIndexAccess(item, index); const dataIndex = dataIndexAccess(item, index);
obj[dataIndex] = ''; obj[dataIndex] = '';
...@@ -602,7 +612,7 @@ const HistoryView = (props) => { ...@@ -602,7 +612,7 @@ const HistoryView = (props) => {
return obj; return obj;
}; };
data.forEach((item, index) => { data.forEach((item, index) => {
const {stationCode, sensorName, dataModel} = item; const { stationCode, sensorName, dataModel } = item;
dataModel.forEach((data) => { dataModel.forEach((data) => {
const formatTime = moment(data.pt).format(format); const formatTime = moment(data.pt).format(format);
...@@ -617,7 +627,7 @@ const HistoryView = (props) => { ...@@ -617,7 +627,7 @@ const HistoryView = (props) => {
// 处理表格数据 // 处理表格数据
data.forEach((child, index) => { data.forEach((child, index) => {
const {dataModel} = child; const { dataModel } = child;
const dataIndex = dataIndexAccess(child, index); const dataIndex = dataIndexAccess(child, index);
dataModel.forEach((value, j) => { dataModel.forEach((value, j) => {
const formatTime = moment(value.pt).format(format); const formatTime = moment(value.pt).format(format);
...@@ -667,30 +677,35 @@ const HistoryView = (props) => { ...@@ -667,30 +677,35 @@ const HistoryView = (props) => {
const handleDataThinKey = (diffDays) => { const handleDataThinKey = (diffDays) => {
// edit by zy 根据选择的时长控制抽稀频度 // edit by zy 根据选择的时长控制抽稀频度
if (diffDays >= 7 && diffDays < 15) { if (diffDays >= 7 && diffDays < 15) {
return {unit: 'h', zoom: '2'}; return { unit: 'h', zoom: '2' };
} else if (diffDays >= 15 && diffDays < 30) { } else if (diffDays >= 15 && diffDays < 30) {
return {unit: 'h', zoom: '4'}; return { unit: 'h', zoom: '4' };
} else if (diffDays >= 30) { } else if (diffDays >= 30) {
return {unit: 'h', zoom: '6'}; return { unit: 'h', zoom: '6' };
} else if (diffDays < 7 && diffDays >= 2) { } else if (diffDays < 7 && diffDays >= 2) {
return {unit: 'min', zoom: '40'}; return { unit: 'min', zoom: '40' };
} else if (diffDays < 2 && diffDays >= 1) { } else if (diffDays < 2 && diffDays >= 1) {
return {unit: 'min', zoom: '30'}; return { unit: 'min', zoom: '30' };
} else { } else {
return {unit: 'min', zoom: '10'}; return { unit: 'min', zoom: '10' };
} }
}; };
// 处理接口服务参数的变化 // 处理接口服务参数的变化
const onChangeParams = (value = {}) => { const onChangeParams = (value = {}) => {
const {dateRange, isDilute, ignoreOutliers, zoom, unit} = value; const { dateRange, isDilute, ignoreOutliers, zoom, unit } = value;
const requestArr = []; const requestArr = [];
const acrossTables = []; const acrossTables = [];
deviceParams.map(item => { deviceParams
let _item = {...item}; .map((item) => {
_item.sensors = (item.sensors && !item.sensors.includes('是否在线')) ? item.sensors + ',是否在线' : item.sensors; let _item = { ...item };
_item.sensors =
item.sensors && !item.sensors.includes('是否在线')
? item.sensors + ',是否在线'
: item.sensors;
return _item; return _item;
}).forEach((i) => { })
.forEach((i) => {
if (i.sensors && i.deviceCode && i.deviceCode) if (i.sensors && i.deviceCode && i.deviceCode)
acrossTables.push(_.omit(i, ['pointAddressID'])); acrossTables.push(_.omit(i, ['pointAddressID']));
}); });
...@@ -710,18 +725,18 @@ const HistoryView = (props) => { ...@@ -710,18 +725,18 @@ const HistoryView = (props) => {
dateFrom: item.dateFrom, dateFrom: item.dateFrom,
dateTo: item.dateTo, dateTo: item.dateTo,
acrossTables, acrossTables,
isBoxPlots: isBoxPlots isBoxPlots: isBoxPlots,
}; };
let diffDays = moment(item.dateTo).diff(moment(item.dateFrom), 'days'); let diffDays = moment(item.dateTo).diff(moment(item.dateFrom), 'days');
let zoomParam = activeTabKey === 'curve' ? handleDataThinKey(diffDays) : {}; let zoomParam = activeTabKey === 'curve' ? handleDataThinKey(diffDays) : {};
requestArr.push(getHistoryInfo({...param, ...zoomParam})); requestArr.push(getHistoryInfo({ ...param, ...zoomParam }));
}); });
setLoading(true); setLoading(true);
Promise.all(requestArr).then((results) => { Promise.all(requestArr).then((results) => {
if (results.length) { if (results.length) {
let data = []; let data = [];
results.forEach((res, index) => { results.forEach((res, index) => {
const {dateFrom, dateTo} = dateRange?.[index] ?? {}; const { dateFrom, dateTo } = dateRange?.[index] ?? {};
if (res.code === 0 && res.data.length) { if (res.code === 0 && res.data.length) {
res.data.forEach((d) => { res.data.forEach((d) => {
d.dateFrom = dateFrom; d.dateFrom = dateFrom;
...@@ -750,7 +765,7 @@ const HistoryView = (props) => { ...@@ -750,7 +765,7 @@ const HistoryView = (props) => {
}; };
useEffect(() => { useEffect(() => {
const {dataThin, ignoreOutliers, zoom, unit} = dataConfig; const { dataThin, ignoreOutliers, zoom, unit } = dataConfig;
beforChangeParams().finally(() => { beforChangeParams().finally(() => {
onChangeParams({ onChangeParams({
isDilute: dataThin, isDilute: dataThin,
...@@ -758,7 +773,7 @@ const HistoryView = (props) => { ...@@ -758,7 +773,7 @@ const HistoryView = (props) => {
zoom, zoom,
unit, unit,
dateRange, dateRange,
isBoxPlots: isBoxPlots isBoxPlots: isBoxPlots,
}); });
}); });
}, [dateRange, dataConfig, deviceParams, chartType]); }, [dateRange, dataConfig, deviceParams, chartType]);
...@@ -769,11 +784,14 @@ const HistoryView = (props) => { ...@@ -769,11 +784,14 @@ const HistoryView = (props) => {
<> <>
<div className={`${prefixCls}-options`}> <div className={`${prefixCls}-options`}>
{renderTimeOption()} {renderTimeOption()}
{renderCurveOption(true, (deviceParams?.length === 1 && deviceParams[0]?.sensors?.split(',').length === 1))} {renderCurveOption(
true,
deviceParams?.length === 1 && deviceParams[0]?.sensors?.split(',').length === 1,
)}
</div> </div>
<div className={`${prefixCls}-content`}> <div className={`${prefixCls}-content`}>
{!chartDataSource.length ? ( {!chartDataSource.length ? (
<PandaEmpty/> <PandaEmpty />
) : grid === true ? ( ) : grid === true ? (
<GridChart <GridChart
curveCenter={curveCenter} curveCenter={curveCenter}
...@@ -815,11 +833,10 @@ const HistoryView = (props) => { ...@@ -815,11 +833,10 @@ const HistoryView = (props) => {
columns={columns} columns={columns}
{...tableProps} {...tableProps}
pagination={false} pagination={false}
onChange={() => { onChange={() => {}}
}}
/> />
) : ( ) : (
<PandaEmpty/> <PandaEmpty />
)} )}
</div> </div>
</> </>
...@@ -844,7 +861,7 @@ const HistoryView = (props) => { ...@@ -844,7 +861,7 @@ const HistoryView = (props) => {
<div className={`${prefixCls}-extra-right`}> <div className={`${prefixCls}-extra-right`}>
{activeTabKey === 'table' && ( {activeTabKey === 'table' && (
<Button type="link" onClick={exportExcelBtn}> <Button type="link" onClick={exportExcelBtn}>
<DownloadOutlined/> <DownloadOutlined />
下载 下载
</Button> </Button>
)} )}
......
import moment from 'moment'; import moment from 'moment';
import _, {isArray} from 'lodash'; import _, { isArray } from 'lodash';
/** 轴宽度, 用于计算多轴显示时, 轴线偏移和绘图区域尺寸 */ /** 轴宽度, 用于计算多轴显示时, 轴线偏移和绘图区域尺寸 */
const axisWidth = 40; const axisWidth = 40;
...@@ -22,7 +22,7 @@ const COLOR = { ...@@ -22,7 +22,7 @@ const COLOR = {
* @returns * @returns
*/ */
const nameFormatter = (data, contrast, contrastOption, nameWithSensor) => { const nameFormatter = (data, contrast, contrastOption, nameWithSensor) => {
const {equipmentName, sensorName, unit, dataModel, dateFrom, dateTo} = data; const { equipmentName, sensorName, unit, dataModel, dateFrom, dateTo } = data;
let name = nameWithSensor ? `${equipmentName}-${sensorName}` : equipmentName; let name = nameWithSensor ? `${equipmentName}-${sensorName}` : equipmentName;
if (contrast) { if (contrast) {
const time = dateFrom.slice(0, contrastOption === 'day' ? 10 : 7).replace(/-/g, ''); const time = dateFrom.slice(0, contrastOption === 'day' ? 10 : 7).replace(/-/g, '');
...@@ -40,10 +40,13 @@ const nameFormatter = (data, contrast, contrastOption, nameWithSensor) => { ...@@ -40,10 +40,13 @@ const nameFormatter = (data, contrast, contrastOption, nameWithSensor) => {
* @returns 图表系列数据, [[DateTime, value]] * @returns 图表系列数据, [[DateTime, value]]
*/ */
const dataAccessor = (data, contrast, contrastOption) => { const dataAccessor = (data, contrast, contrastOption) => {
const {dataModel} = data; const { dataModel } = data;
let _currentYear = moment().format('YYYY'); let _currentYear = moment().format('YYYY');
const formatStr = contrastOption === 'day' ? `${_currentYear}-01-01 HH:mm:00` : `${_currentYear}-01-DD HH:mm:00`; const formatStr =
return dataModel.filter(item => item.sensorName !== '是否在线').map((item) => { contrastOption === 'day' ? `${_currentYear}-01-01 HH:mm:00` : `${_currentYear}-01-DD HH:mm:00`;
return dataModel
.filter((item) => item.sensorName !== '是否在线')
.map((item) => {
const time = contrast ? moment(item.pt).format(formatStr) : item.pt; const time = contrast ? moment(item.pt).format(formatStr) : item.pt;
return [moment(time).valueOf(), item.pv]; return [moment(time).valueOf(), item.pv];
}); });
...@@ -56,7 +59,7 @@ const dataAccessor = (data, contrast, contrastOption) => { ...@@ -56,7 +59,7 @@ const dataAccessor = (data, contrast, contrastOption) => {
* @returns Null/areaStyle, 为null显示曲线图, 为areaStyle对象显示为面积图. * @returns Null/areaStyle, 为null显示曲线图, 为areaStyle对象显示为面积图.
*/ */
const areaStyleFormatter = (data) => { const areaStyleFormatter = (data) => {
const {sensorName} = data; const { sensorName } = data;
return sensorName && sensorName.indexOf('流量') > -1 ? {} : null; return sensorName && sensorName.indexOf('流量') > -1 ? {} : null;
}; };
...@@ -67,7 +70,7 @@ const areaStyleFormatter = (data) => { ...@@ -67,7 +70,7 @@ const areaStyleFormatter = (data) => {
* @returns * @returns
*/ */
const minMax = (data) => { const minMax = (data) => {
const {dataModel} = data; const { dataModel } = data;
let min = Number.MAX_SAFE_INTEGER; let min = Number.MAX_SAFE_INTEGER;
let max = Number.MIN_SAFE_INTEGER; let max = Number.MIN_SAFE_INTEGER;
dataModel.forEach((item) => { dataModel.forEach((item) => {
...@@ -98,7 +101,7 @@ const markLineItem = (name, value, color) => { ...@@ -98,7 +101,7 @@ const markLineItem = (name, value, color) => {
export const alarmMarkLine = (dataItem, index, dataSource, schemes) => { export const alarmMarkLine = (dataItem, index, dataSource, schemes) => {
// 只有一个数据曲线时显示markline // 只有一个数据曲线时显示markline
if (!dataItem || !schemes || dataSource.length !== 1) return {}; if (!dataItem || !schemes || dataSource.length !== 1) return {};
const {deviceType, stationCode, sensorName, decimalPoint} = dataItem; const { deviceType, stationCode, sensorName, decimalPoint } = dataItem;
const curSchemes = schemes.filter( const curSchemes = schemes.filter(
(item) => (item) =>
item.deviceCode === stationCode && item.deviceCode === stationCode &&
...@@ -107,7 +110,7 @@ export const alarmMarkLine = (dataItem, index, dataSource, schemes) => { ...@@ -107,7 +110,7 @@ export const alarmMarkLine = (dataItem, index, dataSource, schemes) => {
); );
const data = []; const data = [];
curSchemes.forEach((scheme) => { curSchemes.forEach((scheme) => {
const {hLimit, hhLimit, lLimit, llLimit} = scheme; const { hLimit, hhLimit, lLimit, llLimit } = scheme;
lLimit !== null && lLimit !== void 0 && data.push(markLineItem('低限', lLimit, '#fa8c16')); lLimit !== null && lLimit !== void 0 && data.push(markLineItem('低限', lLimit, '#fa8c16'));
hLimit !== null && hLimit !== void 0 && data.push(markLineItem('高限', hLimit, '#fa8c16')); hLimit !== null && hLimit !== void 0 && data.push(markLineItem('高限', hLimit, '#fa8c16'));
llLimit !== null && llLimit !== void 0 && data.push(markLineItem('低低限', llLimit, '#FF0000')); llLimit !== null && llLimit !== void 0 && data.push(markLineItem('低低限', llLimit, '#FF0000'));
...@@ -138,8 +141,8 @@ export const minMaxMarkPoint = (dataItem, index, dataSource) => { ...@@ -138,8 +141,8 @@ export const minMaxMarkPoint = (dataItem, index, dataSource) => {
// 只有一个数据曲线时显示markline // 只有一个数据曲线时显示markline
if (!dataItem || dataSource.length !== 1) return {}; if (!dataItem || dataSource.length !== 1) return {};
const data = []; const data = [];
data.push({type: 'min', name: '最小: ',}); data.push({ type: 'min', name: '最小: ' });
data.push({type: 'max', name: '最大: ',}); data.push({ type: 'max', name: '最大: ' });
return { return {
symbolSize: 1, symbolSize: 1,
symbolOffset: [0, '50%'], symbolOffset: [0, '50%'],
...@@ -209,7 +212,7 @@ export const decorateAxisGridLine = (axis, showGrid) => { ...@@ -209,7 +212,7 @@ export const decorateAxisGridLine = (axis, showGrid) => {
*/ */
export const offlineArea = (dataItem) => { export const offlineArea = (dataItem) => {
if (!dataItem) return {}; if (!dataItem) return {};
const {dataModel} = dataItem; const { dataModel } = dataItem;
let datas = new Array(); let datas = new Array();
let offlineData = []; let offlineData = [];
let hasOffline = false; let hasOffline = false;
...@@ -222,7 +225,7 @@ export const offlineArea = (dataItem) => { ...@@ -222,7 +225,7 @@ export const offlineArea = (dataItem) => {
}, },
]; ];
hasOffline = true; hasOffline = true;
} else if ((item.pv && hasOffline)) { } else if (item.pv && hasOffline) {
offlineData.push({ offlineData.push({
xAxis: new Date(item.pt), xAxis: new Date(item.pt),
}); });
...@@ -266,7 +269,7 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth ...@@ -266,7 +269,7 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth
// 一种指标一个y轴 // 一种指标一个y轴
const yAxisMap = new Map(); const yAxisMap = new Map();
dataSource.forEach((item, index) => { dataSource.forEach((item, index) => {
const {sensorName, unit} = item; const { sensorName, unit } = item;
const key = sensorName; const key = sensorName;
if (!yAxisMap.has(key)) { if (!yAxisMap.has(key)) {
...@@ -312,7 +315,7 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth ...@@ -312,7 +315,7 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth
const axis = yAxisMap.get(key); const axis = yAxisMap.get(key);
decorateAxisGridLine(axis, showGridLine); decorateAxisGridLine(axis, showGridLine);
}); });
const yAxis = yAxisMap.size > 0 ? [...yAxisMap.values()] : {type: 'value'}; const yAxis = yAxisMap.size > 0 ? [...yAxisMap.values()] : { type: 'value' };
// 根据y轴个数调整边距 // 根据y轴个数调整边距
const leftNum = Math.ceil(yAxisMap.size / 2); const leftNum = Math.ceil(yAxisMap.size / 2);
...@@ -321,11 +324,11 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth ...@@ -321,11 +324,11 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth
top: needUnit ? 80 : 60, top: needUnit ? 80 : 60,
left: 10 + leftNum * axisWidth, left: 10 + leftNum * axisWidth,
right: rightNum === 0 ? 20 : rightNum * axisWidth, right: rightNum === 0 ? 20 : rightNum * axisWidth,
bottom: 60 bottom: 60,
}; };
const headTemplate = (param) => { const headTemplate = (param) => {
if (!param) return ''; if (!param) return '';
const {name, axisValueLabel, axisType, axisValue} = param; const { name, axisValueLabel, axisType, axisValue } = param;
const timeFormat = 'YYYY-MM-DD HH:mm:ss'; const timeFormat = 'YYYY-MM-DD HH:mm:ss';
const text = const text =
axisType === 'xAxis.time' ? moment(axisValue).format(timeFormat) : name || axisValueLabel; axisType === 'xAxis.time' ? moment(axisValue).format(timeFormat) : name || axisValueLabel;
...@@ -334,20 +337,23 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth ...@@ -334,20 +337,23 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth
const seriesTemplate = (param, unit) => { const seriesTemplate = (param, unit) => {
if (!param) return ''; if (!param) return '';
console.log(param); console.log(param);
const {value, encode} = param; const { value, encode } = param;
// const val = value[encode.y[0]]; // const val = value[encode.y[0]];
const _unit = unit || 'Mpa'; const _unit = unit || 'Mpa';
const color = '#008CFF'; const color = '#008CFF';
if (!isArray(value)) return ` <div style="display: flex; align-items: center;"> if (!isArray(value))
return ` <div style="display: flex; align-items: center;">
<span>${param.seriesName}</span><span style="display:inline-block;">:</span> <span>${param.seriesName}</span><span style="display:inline-block;">:</span>
<span style="color:${color};margin: 0 5px 0 auto;">${value?.toFixed(3) ?? '-'}</span> <span style="color:${color};margin: 0 5px 0 auto;">${value?.toFixed(3) ?? '-'}</span>
<span style="font-size: 12px;">${_unit}</span> <span style="font-size: 12px;">${_unit}</span>
</div>`; </div>`;
return param.componentSubType !== 'candlestick' ? `<div style="display: flex; align-items: center;"> return param.componentSubType !== 'candlestick'
? `<div style="display: flex; align-items: center;">
<span>${param.seriesName}</span><span style="display:inline-block;">:</span> <span>${param.seriesName}</span><span style="display:inline-block;">:</span>
<span style="color: ${COLOR.AVG};margin: 0 5px 0 auto;">${value[1] ?? '-'}</span> <span style="color: ${COLOR.AVG};margin: 0 5px 0 auto;">${value[1] ?? '-'}</span>
<span style="font-size: 12px;">${_unit}</span> <span style="font-size: 12px;">${_unit}</span>
</div>` : ` </div>`
: `
<div style="display: flex; align-items: center;"> <div style="display: flex; align-items: center;">
<span>首值</span><span style="display:inline-block;">:</span> <span>首值</span><span style="display:inline-block;">:</span>
<span style="color: ${COLOR.AVG};margin: 0 5px 0 auto;">${value[1] ?? '-'}</span> <span style="color: ${COLOR.AVG};margin: 0 5px 0 auto;">${value[1] ?? '-'}</span>
...@@ -390,42 +396,48 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth ...@@ -390,42 +396,48 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth
<div>${tooltipContent}</div> <div>${tooltipContent}</div>
</div> </div>
`; `;
} },
} };
}; };
// 根据"指标名称"分类yAxis // 根据"指标名称"分类yAxis
const yAxisInterator = (() => { const yAxisInterator = (() => {
const map = new Map(); const map = new Map();
let current = -1; let current = -1;
const get = (name) => (map.has(name) ? map.get(name) : map.set(name, ++current).get(name)); const get = (name) => (map.has(name) ? map.get(name) : map.set(name, ++current).get(name));
return {get}; return { get };
})(); })();
let _offlineData = []; let _offlineData = [];
let series = dataSource.filter(item => { let series = dataSource
.filter((item) => {
if (item.sensorName === '是否在线') { if (item.sensorName === '是否在线') {
_offlineData.push(item); _offlineData.push(item);
} }
return item.sensorName !== '是否在线'; return item.sensorName !== '是否在线';
}).map((item, index) => { })
const {sensorName, unit} = item; .map((item, index) => {
const { sensorName, unit } = item;
const name = nameFormatter(item, contrast, contrastOption, nameWithSensor); const name = nameFormatter(item, contrast, contrastOption, nameWithSensor);
const data = dataAccessor(item, contrast, contrastOption); const data = dataAccessor(item, contrast, contrastOption);
const type = 'line'; const type = 'line';
const areaStyle = areaStyleFormatter(item); const areaStyle = areaStyleFormatter(item);
const yAxisIndex = yAxisInterator.get(sensorName); const yAxisIndex = yAxisInterator.get(sensorName);
const markLine = showMarkLine ? alarmMarkLine(item, index, dataSource, deviceAlarmSchemes) : {}; const markLine = showMarkLine
? alarmMarkLine(item, index, dataSource, deviceAlarmSchemes)
: {};
const markPoint = showPoint ? minMaxMarkPoint(item, index, dataSource) : {}; const markPoint = showPoint ? minMaxMarkPoint(item, index, dataSource) : {};
let markArea = null; let markArea = null;
// 需求变更:设备离线改用“是否在线”的数据,离线的状态标记的数据用该部分的数据。 2023年4月25日09:36:55 // 需求变更:设备离线改用“是否在线”的数据,离线的状态标记的数据用该部分的数据。 2023年4月25日09:36:55
let _offlineAreasData = _offlineData.map(item => { let _offlineAreasData = _offlineData
let _item = {...item}; .map((item) => {
_item.dataModel = item.dataModel.map(d => { let _item = { ...item };
let _d = {...d}; _item.dataModel = item.dataModel.map((d) => {
let _d = { ...d };
_d.pv = 0; _d.pv = 0;
return _d return _d;
});
return _item;
}) })
return _item .find((offline) => offline.stationCode === item.stationCode);
}).find(offline => offline.stationCode === item.stationCode)
let offlineAreas = offlineArea(_offlineAreasData); let offlineAreas = offlineArea(_offlineAreasData);
if (offlineAreas.data?.length) { if (offlineAreas.data?.length) {
restOption.markArea = null; restOption.markArea = null;
...@@ -454,7 +466,7 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth ...@@ -454,7 +466,7 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth
.map((item) => item.data?.[item.data.length - 1]?.[0]) .map((item) => item.data?.[item.data.length - 1]?.[0])
.filter((item) => item !== undefined), .filter((item) => item !== undefined),
); );
let xAxis = {type: 'time', min, max}; let xAxis = { type: 'time', min, max };
decorateAxisGridLine(xAxis, showGridLine); decorateAxisGridLine(xAxis, showGridLine);
const tooltipTimeFormat = !contrast const tooltipTimeFormat = !contrast
? 'YYYY-MM-DD HH:mm:ss' ? 'YYYY-MM-DD HH:mm:ss'
...@@ -471,22 +483,23 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth ...@@ -471,22 +483,23 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth
// 增加箱线图的逻辑,单曲线才存在 // 增加箱线图的逻辑,单曲线才存在
if (chartType && showBoxOption) { if (chartType && showBoxOption) {
if (chartType === 'boxChart') { if (chartType === 'boxChart') {
const otherData = dataSource?.[0]?.dataModel.map(item => { const otherData =
const {firstPV, lastPV, maxPV, minPV, pt} = item; dataSource?.[0]?.dataModel.map((item) => {
return [moment(pt).valueOf(), firstPV, lastPV, minPV, maxPV] const { firstPV, lastPV, maxPV, minPV, pt } = item;
return [moment(pt).valueOf(), firstPV, lastPV, minPV, maxPV];
}) || []; //当存在othersData的时候,只是单曲线 }) || []; //当存在othersData的时候,只是单曲线
// xAxis = {type: 'category', data: series[0].data.map(item => moment(item[0]).format('YYYY-MM-DD HH:mm:ss'))}; // xAxis = {type: 'category', data: series[0].data.map(item => moment(item[0]).format('YYYY-MM-DD HH:mm:ss'))};
xAxis = {type: 'time'}; xAxis = { type: 'time' };
decorateAxisGridLine(xAxis, showGridLine); decorateAxisGridLine(xAxis, showGridLine);
let unit = '' let unit = '';
series = series.map(item => { series = series.map((item) => {
if (item.unit) unit = item.unit; if (item.unit) unit = item.unit;
let _item = {...item, symbol: 'none'}; let _item = { ...item, symbol: 'none' };
/* _item.data = _item?.data?.map(d => { /* _item.data = _item?.data?.map(d => {
return d[1] || null return d[1] || null
}) || [];*/ }) || [];*/
return _item; return _item;
}) });
series.push({ series.push({
type: 'candlestick', type: 'candlestick',
name: '箱线图', name: '箱线图',
...@@ -496,30 +509,33 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth ...@@ -496,30 +509,33 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth
color: '#FFA200', color: '#FFA200',
color0: '#44CD00', color0: '#44CD00',
borderColor: '#FFA200', borderColor: '#FFA200',
borderColor0: '#44CD00' borderColor0: '#44CD00',
} },
}); });
tooltip = tooltipAccessor(unit) tooltip = tooltipAccessor(unit);
} else { } else {
let _maxData = []; let _maxData = [];
let _minData = []; let _minData = [];
let _currentYear = moment().format('YYYY'); let _currentYear = moment().format('YYYY');
const formatStr = contrastOption === 'day' ? `${_currentYear}-01-01 HH:mm:00` : `${_currentYear}-01-DD HH:mm:00`;// 用来做同期对比,把日期拉到同一区间 const formatStr =
contrastOption === 'day'
? `${_currentYear}-01-01 HH:mm:00`
: `${_currentYear}-01-DD HH:mm:00`; // 用来做同期对比,把日期拉到同一区间
let _maxValues = []; let _maxValues = [];
dataSource?.[0]?.dataModel.forEach(item => { dataSource?.[0]?.dataModel.forEach((item) => {
const {firstPV, lastPV, maxPV, minPV, pt} = item; const { firstPV, lastPV, maxPV, minPV, pt } = item;
_maxValues.push(maxPV); _maxValues.push(maxPV);
let time = contrast ? moment(pt).format(formatStr) : pt; let time = contrast ? moment(pt).format(formatStr) : pt;
_maxData.push([moment(time).valueOf(), (maxPV - minPV).toFixed(2)]); _maxData.push([moment(time).valueOf(), (maxPV - minPV).toFixed(2)]);
_minData.push([moment(time).valueOf(), minPV]); _minData.push([moment(time).valueOf(), minPV]);
}); //当存在othersData的时候,只是单曲线 }); //当存在othersData的时候,只是单曲线
// xAxis = {type: 'category', data: series[0].data.map(item => moment(item[0]).format('YYYY-MM-DD HH:mm:ss'))}; // xAxis = {type: 'category', data: series[0].data.map(item => moment(item[0]).format('YYYY-MM-DD HH:mm:ss'))};
xAxis = {type: 'time'}; xAxis = { type: 'time' };
decorateAxisGridLine(xAxis, showGridLine); decorateAxisGridLine(xAxis, showGridLine);
let _unit = '' let _unit = '';
series = series.map(item => { series = series.map((item) => {
_unit = item.unit; _unit = item.unit;
let _item = {...item, symbol: 'none'}; let _item = { ...item, symbol: 'none' };
/* _item.data = _item?.data?.map(d => { /* _item.data = _item?.data?.map(d => {
return d[1] || null return d[1] || null
}) || [];*/ }) || [];*/
...@@ -532,42 +548,52 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth ...@@ -532,42 +548,52 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth
type: 'line', type: 'line',
data: item, data: item,
lineStyle: { lineStyle: {
opacity: 0 opacity: 0,
}, },
...(index !== 0 ? { ...(index !== 0
? {
areaStyle: { areaStyle: {
color: series?.[0]?.itemStyle?.color ?? '#65a0d1', color: series?.[0]?.itemStyle?.color ?? '#65a0d1',
opacity: 0.2, opacity: 0.2,
},
} }
} : {}), : {}),
stack: 'confidence-band', stack: 'confidence-band',
symbol: 'none' symbol: 'none',
});
}); });
})
tooltip = { tooltip = {
formatter: (e) => { formatter: (e) => {
return `<div> return `<div>
${headTemplate(e[0])} ${headTemplate(e[0])}
<div> <div>
<div style="display: flex; align-items: center;"> <div style="display: flex; align-items: center;">
<span>${e[0].seriesName}</span><span style="display:inline-block;">:</span> <span>${
<span style="color: ${COLOR.NORMAL};margin: 0 5px 0 auto;">${e[0]?.value?.[1] ?? '-'}</span> e[0].seriesName
}</span><span style="display:inline-block;">:</span>
<span style="color: ${COLOR.NORMAL};margin: 0 5px 0 auto;">${
e[0]?.value?.[1] ?? '-'
}</span>
<span style="font-size: 12px;">${_unit}</span> <span style="font-size: 12px;">${_unit}</span>
</div> </div>
<div style="display: flex; align-items: center;"> <div style="display: flex; align-items: center;">
<span>最小值</span><span style="display:inline-block;">:</span> <span>最小值</span><span style="display:inline-block;">:</span>
<span style="color: ${COLOR.AVG};margin: 0 5px 0 auto;">${e[1]?.value?.[1] ?? '-'}</span> <span style="color: ${COLOR.AVG};margin: 0 5px 0 auto;">${
e[1]?.value?.[1] ?? '-'
}</span>
<span style="font-size: 12px;">${_unit}</span> <span style="font-size: 12px;">${_unit}</span>
</div> </div>
<div style="display: flex; align-items: center;"> <div style="display: flex; align-items: center;">
<span>最大值</span><span style="display:inline-block;">:</span> <span>最大值</span><span style="display:inline-block;">:</span>
<span style="color: ${COLOR.AVG};margin: 0 5px 0 auto;">${_maxValues[e[2].dataIndex] ?? '-'}</span> <span style="color: ${COLOR.AVG};margin: 0 5px 0 auto;">${
_maxValues[e[2].dataIndex] ?? '-'
}</span>
<span style="font-size: 12px;">${_unit}</span> <span style="font-size: 12px;">${_unit}</span>
</div> </div>
</div> </div>
</div>` </div>`;
} },
} };
} }
} }
restOption.dataZoom = [ restOption.dataZoom = [
...@@ -578,7 +604,7 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth ...@@ -578,7 +604,7 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth
end: 100, end: 100,
height: 28, height: 28,
type: 'inside', type: 'inside',
zoomOnMouseWheel: true zoomOnMouseWheel: true,
}, },
{ {
show: true, show: true,
...@@ -587,10 +613,10 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth ...@@ -587,10 +613,10 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth
end: 100, end: 100,
height: 28, height: 28,
type: 'slider', type: 'slider',
zoomOnMouseWheel: true zoomOnMouseWheel: true,
} },
]; ];
xAxis.minInterval = 3600 * 1 * 1000 xAxis.minInterval = 3600 * 1 * 1000;
return { return {
yAxis, yAxis,
grid, grid,
......
# Change Log # Change Log
All notable changes to this project will be documented in this file. All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
## [1.4.4](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/ec_quotaselect@1.4.3...@wisdom-components/ec_quotaselect@1.4.4) (2023-05-16) ## [1.4.4](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/ec_quotaselect@1.4.3...@wisdom-components/ec_quotaselect@1.4.4) (2023-05-16)
**Note:** Version bump only for package @wisdom-components/ec_quotaselect **Note:** Version bump only for package @wisdom-components/ec_quotaselect
## [1.4.3](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/ec_quotaselect@1.4.2...@wisdom-components/ec_quotaselect@1.4.3) (2023-05-15) ## [1.4.3](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/ec_quotaselect@1.4.2...@wisdom-components/ec_quotaselect@1.4.3) (2023-05-15)
### Bug Fixes ### Bug Fixes
......
...@@ -422,7 +422,8 @@ const QuotaSelect = ({ ...@@ -422,7 +422,8 @@ const QuotaSelect = ({
checked={item.checked} checked={item.checked}
disabled={ disabled={
((selectData.length > maximum || selectData.length === maximum) && ((selectData.length > maximum || selectData.length === maximum) &&
!item.checked)||disabledList.includes(item.title) !item.checked) ||
disabledList.includes(item.title)
} }
onChange={(e) => handleCheckboxChange(e, item)} onChange={(e) => handleCheckboxChange(e, item)}
> >
...@@ -481,7 +482,7 @@ QuotaSelect.defaultProps = { ...@@ -481,7 +482,7 @@ QuotaSelect.defaultProps = {
onModalOk: () => {}, onModalOk: () => {},
onModalClose: () => {}, onModalClose: () => {},
defaultSelect: 'emphasis', defaultSelect: 'emphasis',
disabledList:[], disabledList: [],
}; };
QuotaSelect.propTypes = { QuotaSelect.propTypes = {
......
# Change Log # Change Log
All notable changes to this project will be documented in this file. All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
## [1.6.1](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/ec_realtimeinfo@1.6.0...@wisdom-components/ec_realtimeinfo@1.6.1) (2023-05-16) ## [1.6.1](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/ec_realtimeinfo@1.6.0...@wisdom-components/ec_realtimeinfo@1.6.1) (2023-05-16)
**Note:** Version bump only for package @wisdom-components/ec_realtimeinfo **Note:** Version bump only for package @wisdom-components/ec_realtimeinfo
# [1.6.0](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/ec_realtimeinfo@1.5.0...@wisdom-components/ec_realtimeinfo@1.6.0) (2023-05-11) # [1.6.0](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/ec_realtimeinfo@1.5.0...@wisdom-components/ec_realtimeinfo@1.6.0) (2023-05-11)
### Features ### Features
......
...@@ -53,7 +53,8 @@ const RealTimeInfo = (props) => { ...@@ -53,7 +53,8 @@ const RealTimeInfo = (props) => {
const { getPrefixCls } = useContext(ConfigProvider.ConfigContext); const { getPrefixCls } = useContext(ConfigProvider.ConfigContext);
const prefixCls = getPrefixCls('realtime-info'); const prefixCls = getPrefixCls('realtime-info');
const { deviceParams, infoData, user, placeholder, defaultTargetValue, modalTitle, buttonText } = props; const { deviceParams, infoData, user, placeholder, defaultTargetValue, modalTitle, buttonText } =
props;
const [isModalVisible, setIsModalVisible] = useState(false); const [isModalVisible, setIsModalVisible] = useState(false);
const [targetValue, setTargetValue] = useState(defaultTargetValue); // 重点/全部 const [targetValue, setTargetValue] = useState(defaultTargetValue); // 重点/全部
...@@ -114,11 +115,13 @@ const RealTimeInfo = (props) => { ...@@ -114,11 +115,13 @@ const RealTimeInfo = (props) => {
if (infoData) { if (infoData) {
let devices = [infoData.aName]; let devices = [infoData.aName];
infoData.child?.forEach(function (val) { infoData.child?.forEach(function (val) {
let k = devices.find(function (a) { return a == val.aName }); let k = devices.find(function (a) {
return a == val.aName;
});
if (!k) { if (!k) {
devices.push(val.aName); devices.push(val.aName);
} }
}) });
deviceType = devices.join(','); deviceType = devices.join(',');
} else { } else {
deviceType = deviceType =
...@@ -127,7 +130,6 @@ const RealTimeInfo = (props) => { ...@@ -127,7 +130,6 @@ const RealTimeInfo = (props) => {
: '二供泵房,二供机组'; : '二供泵房,二供机组';
} }
const configReq = getMonitorConfig({ const configReq = getMonitorConfig({
params: { params: {
user, user,
...@@ -339,10 +341,10 @@ RealTimeInfo.defaultProps = { ...@@ -339,10 +341,10 @@ RealTimeInfo.defaultProps = {
user: null, user: null,
deviceParams: [], deviceParams: [],
deviceRealInfoParams: {}, deviceRealInfoParams: {},
deviceConfService: () => { }, deviceConfService: () => {},
pointAddressEntryService: () => { }, pointAddressEntryService: () => {},
sensorTypeService: () => { }, sensorTypeService: () => {},
deviceRealInfoService: () => { }, deviceRealInfoService: () => {},
}; };
RealTimeInfo.propTypes = { RealTimeInfo.propTypes = {
......
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