Commit 8c7dd0a4 authored by 陈龙's avatar 陈龙

fix: 修复被回退的代码

parent 3ec8e3f6
...@@ -13,6 +13,9 @@ const SimgleChart = memo((props) => { ...@@ -13,6 +13,9 @@ const SimgleChart = memo((props) => {
curveCenter, curveCenter,
showGridLine = false, showGridLine = false,
deviceAlarmSchemes, deviceAlarmSchemes,
chartType,
justLine
} = props; } = props;
const chartRef = useRef(); const chartRef = useRef();
...@@ -24,6 +27,8 @@ const SimgleChart = memo((props) => { ...@@ -24,6 +27,8 @@ const SimgleChart = memo((props) => {
deviceAlarmSchemes, deviceAlarmSchemes,
showMarkLine: true, showMarkLine: true,
showPoint: true, showPoint: true,
chartType,
justLine
}; };
return optionGenerator(dataSource, null, contrast, contrastOption, smooth, config); return optionGenerator(dataSource, null, contrast, contrastOption, smooth, config);
}, [dataSource, smooth, curveCenter]); }, [dataSource, smooth, curveCenter]);
......
...@@ -25,7 +25,7 @@ const deviceParams = [ ...@@ -25,7 +25,7 @@ const deviceParams = [
const Demo = () => { const Demo = () => {
return ( return (
<div style={{ height: 700 }}> <div style={{ height: 700 }}>
<HistoryView deviceParams={deviceParams} grid /> {/*<HistoryView deviceParams={deviceParams} grid />*/}
</div> </div>
); );
}; };
......
...@@ -2,18 +2,19 @@ import React from 'react'; ...@@ -2,18 +2,19 @@ import React from 'react';
import HistoryView from '../index'; import HistoryView from '../index';
const deviceParams = [ const deviceParams = [
// {
// deviceCode: 'EGBF00000146',
// sensors: '进水压力,出水瞬时流量,出水累计流量',
// deviceType: '二供泵房',
// pointAddressID: 4,
// },
{ {
deviceCode: 'EGBF00000146', // deviceCode: 'EGBF00000002',
sensors: '进水压力,出水瞬时流量,出水累计流量', deviceCode: 'EGBF00000082',
sensors: '进水压力',
deviceType: '二供泵房', deviceType: '二供泵房',
pointAddressID: 4, pointAddressID: 4,
}, },
{
deviceCode: 'EGJZ00001113',
sensors: '出水瞬时流量,出水压力,泵1状态',
deviceType: '二供机组',
pointAddressID: 4,
},
// { // {
// deviceCode: 'EGJZ00001113', // deviceCode: 'EGJZ00001113',
// sensors: '出水压力', // sensors: '出水压力',
......
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,21 +23,20 @@ import _ from 'lodash'; ...@@ -23,21 +23,20 @@ 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';
const timeFormat = 'YYYY-MM-DD HH:mm:ss'; const timeFormat = 'YYYY-MM-DD HH:mm:ss';
const dateFormat = 'YYYYMMDD'; const dateFormat = 'YYYYMMDD';
// 时间列表
const timeList = [ const timeList = [
{ {
key: 'twelveHours', key: 'twelveHours',
...@@ -221,7 +220,7 @@ const timeColumn = { ...@@ -221,7 +220,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,8 +233,7 @@ const HistoryView = (props) => { ...@@ -234,8 +233,7 @@ const HistoryView = (props) => {
showModels, showModels,
needMarkLine, needMarkLine,
} = props; } = props;
const isBoxPlots = const isBoxPlots = deviceParams?.length === 1 && deviceParams[0]?.sensors?.split(',').length === 1;
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);
...@@ -390,7 +388,7 @@ const HistoryView = (props) => { ...@@ -390,7 +388,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>
...@@ -407,7 +405,7 @@ const HistoryView = (props) => { ...@@ -407,7 +405,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>
...@@ -416,7 +414,7 @@ const HistoryView = (props) => { ...@@ -416,7 +414,7 @@ const HistoryView = (props) => {
)} )}
</div> </div>
))} ))}
{datePickerArr.length < 5 && <PlusCircleOutlined onClick={handleAddDatePicker} />} {datePickerArr.length < 5 && <PlusCircleOutlined onClick={handleAddDatePicker}/>}
</> </>
)} )}
</div> </div>
...@@ -426,8 +424,8 @@ const HistoryView = (props) => { ...@@ -426,8 +424,8 @@ const HistoryView = (props) => {
// 曲线设置项选择/取消 // 曲线设置项选择/取消
const onCheckboxChange = (e, key) => { const onCheckboxChange = (e, key) => {
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;
...@@ -465,7 +463,7 @@ const HistoryView = (props) => { ...@@ -465,7 +463,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>
)} )}
</> </>
...@@ -475,26 +473,19 @@ const HistoryView = (props) => { ...@@ -475,26 +473,19 @@ const HistoryView = (props) => {
const renderCurveOption = (isChart, isSingle) => { const renderCurveOption = (isChart, isSingle) => {
return ( return (
<div className={classNames(`${prefixCls}-cover`)}> <div className={classNames(`${prefixCls}-cover`)} style={isChart && isSingle ? {width: '100%'} : {}}>
{isChart && isSingle ? ( {
<> isChart && isSingle ? <>
<div className={classNames(`${prefixCls}-label`)}>曲线形态</div> <div className={classNames(`${prefixCls}-label`)}>曲线形态</div>
<Radio.Group <Radio.Group value={chartType} style={{marginRight: 16}} onChange={(e) => {
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); const box = renderCheckbox(child);
...@@ -508,7 +499,7 @@ const HistoryView = (props) => { ...@@ -508,7 +499,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}
> >
...@@ -546,14 +537,15 @@ const HistoryView = (props) => { ...@@ -546,14 +537,15 @@ 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}`;
}; };
...@@ -564,7 +556,7 @@ const HistoryView = (props) => { ...@@ -564,7 +556,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})` : ''}`,
...@@ -587,7 +579,7 @@ const HistoryView = (props) => { ...@@ -587,7 +579,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] = '';
...@@ -595,7 +587,7 @@ const HistoryView = (props) => { ...@@ -595,7 +587,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);
...@@ -610,7 +602,7 @@ const HistoryView = (props) => { ...@@ -610,7 +602,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);
...@@ -660,23 +652,23 @@ const HistoryView = (props) => { ...@@ -660,23 +652,23 @@ 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.forEach((i) => { deviceParams.forEach((i) => {
...@@ -689,7 +681,7 @@ const HistoryView = (props) => { ...@@ -689,7 +681,7 @@ const HistoryView = (props) => {
return; return;
} }
dateRange.forEach((item) => { dateRange.forEach((item) => {
let _showLine = checkboxData.find((item) => item.key === 'justLine'); let _showLine = checkboxData.find(item => item.key === 'justLine');
const param = { const param = {
isDilute, isDilute,
zoom, zoom,
...@@ -699,20 +691,19 @@ const HistoryView = (props) => { ...@@ -699,20 +691,19 @@ 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) {
debugger;
res.data.forEach((d) => { res.data.forEach((d) => {
d.dateFrom = dateFrom; d.dateFrom = dateFrom;
d.dateTo = dateTo; d.dateTo = dateTo;
...@@ -740,7 +731,7 @@ const HistoryView = (props) => { ...@@ -740,7 +731,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,
...@@ -748,7 +739,7 @@ const HistoryView = (props) => { ...@@ -748,7 +739,7 @@ const HistoryView = (props) => {
zoom, zoom,
unit, unit,
dateRange, dateRange,
isBoxPlots: isBoxPlots, isBoxPlots: isBoxPlots
}); });
}); });
}, [dateRange, dataConfig, deviceParams, chartType]); }, [dateRange, dataConfig, deviceParams, chartType]);
...@@ -759,14 +750,11 @@ const HistoryView = (props) => { ...@@ -759,14 +750,11 @@ const HistoryView = (props) => {
<> <>
<div className={`${prefixCls}-options`}> <div className={`${prefixCls}-options`}>
{renderTimeOption()} {renderTimeOption()}
{renderCurveOption( {renderCurveOption(true, (deviceParams?.length === 1 && deviceParams[0]?.sensors?.split(',').length === 1))}
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}
...@@ -782,7 +770,7 @@ const HistoryView = (props) => { ...@@ -782,7 +770,7 @@ const HistoryView = (props) => {
showGridLine={chartGrid} showGridLine={chartGrid}
prefixCls={prefixCls} prefixCls={prefixCls}
dataSource={chartDataSource} dataSource={chartDataSource}
justLine={!!checkboxData.find((item) => item.key === 'justLine' && item.checked)} justLine={!!checkboxData.find(item => item.key === 'justLine' && item.checked)}
chartType={isBoxPlots ? chartType : null} chartType={isBoxPlots ? chartType : null}
contrast={timeValue === 'contrast'} contrast={timeValue === 'contrast'}
contrastOption={contrastOption} contrastOption={contrastOption}
...@@ -807,10 +795,11 @@ const HistoryView = (props) => { ...@@ -807,10 +795,11 @@ const HistoryView = (props) => {
columns={columns} columns={columns}
{...tableProps} {...tableProps}
pagination={false} pagination={false}
onChange={() => {}} onChange={() => {
}}
/> />
) : ( ) : (
<PandaEmpty /> <PandaEmpty/>
)} )}
</div> </div>
</> </>
...@@ -835,7 +824,7 @@ const HistoryView = (props) => { ...@@ -835,7 +824,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>
)} )}
......
...@@ -459,7 +459,7 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth ...@@ -459,7 +459,7 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth
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: null}; 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
}) || []; }) || [];
...@@ -468,7 +468,7 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth ...@@ -468,7 +468,7 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth
series.push({ series.push({
type: 'candlestick', type: 'candlestick',
name: '箱线图', name: '箱线图',
symbol: null, symbol: 'none',
data: otherData, data: otherData,
}); });
tooltip = tooltipAccessor(unit) tooltip = tooltipAccessor(unit)
...@@ -482,7 +482,7 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth ...@@ -482,7 +482,7 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth
}); //当存在othersData的时候,只是单曲线 }); //当存在othersData的时候,只是单曲线
xAxis = {type: 'category', data: series[0].data.map(item => moment(item[0]).format('YYYY-MM-DD'))}; xAxis = {type: 'category', data: series[0].data.map(item => moment(item[0]).format('YYYY-MM-DD'))};
series = series.map(item => { series = series.map(item => {
let _item = {...item, symbol: false}; 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
}) || []; }) || [];
......
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