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

修改

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