Commit fb4c9a27 authored by 李纪文's avatar 李纪文

fix: 发布历史曲线

parent e6ad7ff7
...@@ -22,5 +22,8 @@ ...@@ -22,5 +22,8 @@
}, },
"scripts": { "scripts": {
"test": "echo \"Error: run tests from root\" && exit 1" "test": "echo \"Error: run tests from root\" && exit 1"
},
"dependencies": {
"@babel/runtime": "^7.17.9"
} }
} }
...@@ -108,8 +108,8 @@ const timeIntervalList = [ ...@@ -108,8 +108,8 @@ const timeIntervalList = [
]; ];
const updateTime = (key) => { const updateTime = (key) => {
let start = '', let start = '';
end = ''; let end = '';
if (Array.isArray(key)) { if (Array.isArray(key)) {
start = moment(key[0]).format(timeFormat); start = moment(key[0]).format(timeFormat);
end = moment(key[1]).format(timeFormat); end = moment(key[1]).format(timeFormat);
...@@ -180,7 +180,7 @@ const timeColumn = { ...@@ -180,7 +180,7 @@ const timeColumn = {
align: 'center', align: 'center',
}; };
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');
...@@ -193,11 +193,11 @@ const HistoryView = props => { ...@@ -193,11 +193,11 @@ const HistoryView = props => {
const [timeValue, setTimeValue] = useState('customer'); const [timeValue, setTimeValue] = useState('customer');
// 自定义模式 // 自定义模式
const [customerChecked, setCustomerChecked] = useState(defaultChecked); // 时间快速选择类型值 const [customerChecked, setCustomerChecked] = useState(defaultChecked); // 时间快速选择类型值
const [customerTime, setCustomerTime] = useState(); // 自定义时间选择值 const [customerTime, setCustomerTime] = useState(); // 自定义时间选择值
// 同期对比模式 // 同期对比模式
const [contrastOption, setContrastOption] = useState('day'); // 对比时间类型: 日/月 const [contrastOption, setContrastOption] = useState('day'); // 对比时间类型: 日/月
const [datePickerArr, setDatePickerArr] = useState(DefaultDatePicker('day')); // 对比时间段配置值 const [datePickerArr, setDatePickerArr] = useState(DefaultDatePicker('day')); // 对比时间段配置值
const [checkboxData, setCheckboxData] = useState(CheckboxData); // 曲线设置项 const [checkboxData, setCheckboxData] = useState(CheckboxData); // 曲线设置项
...@@ -225,21 +225,24 @@ const HistoryView = props => { ...@@ -225,21 +225,24 @@ const HistoryView = props => {
unit: '', // 数据抽稀时间单位 unit: '', // 数据抽稀时间单位
}; };
// 曲线居中,过滤异常值,数据抽稀 // 曲线居中,过滤异常值,数据抽稀
const config = checkboxData.reduce((pre, item) => ((item.key !== 'curveCenter' && (pre[item.key] = item.checked)), pre), initial); const config = checkboxData.reduce(
(pre, item) => (item.key !== 'curveCenter' && (pre[item.key] = item.checked), pre),
initial,
);
// 数据抽稀时间单位 // 数据抽稀时间单位
const dataThin = timeIntervalList.find(item => item.key === dataThinKey); const dataThin = timeIntervalList.find((item) => item.key === dataThinKey);
config.zoom = activeTabKey === 'curve' ? '' : (dataThin?.zoom ?? ''); config.zoom = activeTabKey === 'curve' ? '' : dataThin?.zoom ?? '';
config.unit = activeTabKey === 'curve' ? '' : (dataThin?.unit ?? ''); config.unit = activeTabKey === 'curve' ? '' : dataThin?.unit ?? '';
config.dataThin = activeTabKey === 'curve' ? true : config.dataThin; // 曲线强制抽稀 config.dataThin = activeTabKey === 'curve' ? true : config.dataThin; // 曲线强制抽稀
return config; return config;
}, [checkboxData, dataThinKey, activeTabKey]); }, [checkboxData, dataThinKey, activeTabKey]);
// 图表居中 // 图表居中
const curveCenter = useMemo(() => checkboxData.find(item => item.key === 'curveCenter')?.checked, [checkboxData]); const curveCenter = useMemo(
() => checkboxData.find((item) => item.key === 'curveCenter')?.checked,
[checkboxData],
);
// 自定义模式: 快速选择 // 自定义模式: 快速选择
const onCustomerTimeChange = (key) => { const onCustomerTimeChange = (key) => {
...@@ -341,9 +344,7 @@ const HistoryView = props => { ...@@ -341,9 +344,7 @@ const HistoryView = props => {
<DatePicker <DatePicker
picker={contrastOption} picker={contrastOption}
value={child.value} value={child.value}
onChange={(date, dateString) => onChange={(date, dateString) => onContrastPickerChange(date, dateString, child)}
onContrastPickerChange(date, dateString, child)
}
/> />
{datePickerArr.length > 2 && ( {datePickerArr.length > 2 && (
<div <div
...@@ -383,10 +384,7 @@ const HistoryView = props => { ...@@ -383,10 +384,7 @@ const HistoryView = props => {
}; };
const renderCheckbox = (child) => ( const renderCheckbox = (child) => (
<Checkbox <Checkbox checked={child.checked} onChange={(e) => onCheckboxChange(e, child.key)}>
checked={child.checked}
onChange={(e) => onCheckboxChange(e, child.key)}
>
{child.label} {child.label}
</Checkbox> </Checkbox>
); );
...@@ -402,7 +400,12 @@ const HistoryView = props => { ...@@ -402,7 +400,12 @@ const HistoryView = props => {
</div> </div>
))} ))}
{activeTabKey === 'table' && ( {activeTabKey === 'table' && (
<Select value={dataThinKey} style={{ width: 90 }} onChange={onTimeIntervalChange} disabled={!dataConfig.dataThin}> <Select
value={dataThinKey}
style={{ width: 90 }}
onChange={onTimeIntervalChange}
disabled={!dataConfig.dataThin}
>
{timeIntervalList.map((child) => ( {timeIntervalList.map((child) => (
<Option key={child.key} unit={child.unit} value={child.key}> <Option key={child.key} unit={child.unit} value={child.key}>
{child.name} {child.name}
...@@ -411,11 +414,10 @@ const HistoryView = props => { ...@@ -411,11 +414,10 @@ const HistoryView = props => {
</Select> </Select>
)} )}
</div> </div>
) );
}; };
const exportExcelBtn = () => {};
const exportExcelBtn = () => { };
const handleTableData = (data) => { const handleTableData = (data) => {
const ignoreOutliers = checkboxData.find((item) => item.key === 'ignoreOutliers').checked; const ignoreOutliers = checkboxData.find((item) => item.key === 'ignoreOutliers').checked;
...@@ -459,13 +461,13 @@ const HistoryView = props => { ...@@ -459,13 +461,13 @@ const HistoryView = props => {
const dataIndex = dataIndexAccess(item, index); const dataIndex = dataIndexAccess(item, index);
obj[dataIndex] = '--'; obj[dataIndex] = '--';
}); });
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);
let time = formatTime; let time = formatTime;
if (timeValue === 'contrast') { if (timeValue === 'contrast') {
time = time.slice(contrastOption === 'day' ? 11 : 8, 16); time = time.slice(contrastOption === 'day' ? 11 : 8, 16);
...@@ -526,7 +528,7 @@ const HistoryView = props => { ...@@ -526,7 +528,7 @@ const HistoryView = props => {
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;
d.dateTo = dateTo; d.dateTo = dateTo;
}); });
...@@ -569,7 +571,7 @@ const HistoryView = props => { ...@@ -569,7 +571,7 @@ const HistoryView = props => {
</Button> </Button>
)} */} )} */}
</div> </div>
) ),
}} }}
> >
<Tabs.TabPane key="curve" tab="曲线"> <Tabs.TabPane key="curve" tab="曲线">
...@@ -578,17 +580,25 @@ const HistoryView = props => { ...@@ -578,17 +580,25 @@ const HistoryView = props => {
{renderCurveOption()} {renderCurveOption()}
</div> </div>
<div className={`${prefixCls}-content`}> <div className={`${prefixCls}-content`}>
{ {grid === true ? (
grid === true ? ( <GridChart
<GridChart prefixCls={prefixCls} dataSource={chartDataSource} contrast={timeValue === 'contrast'} contrastOption={contrastOption} /> prefixCls={prefixCls}
) : ( dataSource={chartDataSource}
<SimgleChart prefixCls={prefixCls} dataSource={chartDataSource} contrast={timeValue === 'contrast'} contrastOption={contrastOption} /> contrast={timeValue === 'contrast'}
) contrastOption={contrastOption}
} />
) : (
<SimgleChart
prefixCls={prefixCls}
dataSource={chartDataSource}
contrast={timeValue === 'contrast'}
contrastOption={contrastOption}
/>
)}
</div> </div>
</Tabs.TabPane> </Tabs.TabPane>
<Tabs.TabPane key="table" tab="表格"> <Tabs.TabPane key="table" tab="表格">
<div className={`${prefixCls}-options`}> <div className={`${prefixCls}-options`}>
{renderTimeOption()} {renderTimeOption()}
{renderCurveOption()} {renderCurveOption()}
</div> </div>
...@@ -613,13 +623,21 @@ const HistoryView = props => { ...@@ -613,13 +623,21 @@ const HistoryView = props => {
HistoryView.propTypes = { HistoryView.propTypes = {
grid: PropTypes.bool, grid: PropTypes.bool,
title: PropTypes.string, title: PropTypes.string,
defaultChecked: PropTypes.oneOf(['oneHour', 'fourHour', 'twelveHours', 'roundClock', 'yesterday']), defaultChecked: PropTypes.oneOf([
'oneHour',
'fourHour',
'twelveHours',
'roundClock',
'yesterday',
]),
tableProps: PropTypes.object, tableProps: PropTypes.object,
deviceParams: PropTypes.arrayOf(PropTypes.objectOf({ deviceParams: PropTypes.arrayOf(
deviceCode: PropTypes.string, PropTypes.objectOf({
sensors: PropTypes.string, deviceCode: PropTypes.string,
deviceType: PropTypes.string, sensors: PropTypes.string,
})) deviceType: PropTypes.string,
}),
),
}; };
HistoryView.defaultProps = { HistoryView.defaultProps = {
......
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