Skip to content

W
wisdom-components
Commit ac119607 authored by 陈龙's avatar 陈龙
Browse files
Options

feat: 回滚代码并修复

parent a32f6509
Show whitespace changes
Inline Side-by-side
Showing with 49 additions and 28 deletions
packages/extend-components/EC_HistoryView/src/SingleChart.js
View file @ ac119607
...@@ -14,7 +14,7 @@ const SimgleChart = memo((props) => { ...@@ -14,7 +14,7 @@ const SimgleChart = memo((props) => {
showGridLine = true, showGridLine = true,
deviceAlarmSchemes, deviceAlarmSchemes,
chartType, chartType,
// justLine, lineDataType,
showBoxOption, showBoxOption,
} = props; } = props;
const chartRef = useRef(); const chartRef = useRef();
...@@ -31,7 +31,7 @@ const SimgleChart = memo((props) => { ...@@ -31,7 +31,7 @@ const SimgleChart = memo((props) => {
// justLine, // justLine,
showBoxOption, showBoxOption,
}; };
return optionGenerator(dataSource, null, contrast, contrastOption, smooth, config); return optionGenerator(dataSource, null, contrast, contrastOption, smooth, config,lineDataType);
}, [dataSource, smooth, curveCenter,chartType]); }, [dataSource, smooth, curveCenter,chartType]);
useEffect(() => { useEffect(() => {
chartRef.current?.resize?.(); chartRef.current?.resize?.();
......
packages/extend-components/EC_HistoryView/src/apis/index.js
View file @ ac119607
...@@ -7,9 +7,6 @@ const baseUrl = typeof DUMI_TYPE !== 'undefined' && DUMI_TYPE === 'dumi' ? '/api ...@@ -7,9 +7,6 @@ const baseUrl = typeof DUMI_TYPE !== 'undefined' && DUMI_TYPE === 'dumi' ? '/api
const monitorDeviceUrl = `${baseUrl}/PandaMonitor/Monitor/Device`; const monitorDeviceUrl = `${baseUrl}/PandaMonitor/Monitor/Device`;
let _customRequest = (data) => {
return request({...data, headers: {spe: 1111}})
}
// 获取历史数据 // 获取历史数据
export function getHistoryInfo(data) { export function getHistoryInfo(data) {
......
packages/extend-components/EC_HistoryView/src/index.js
View file @ ac119607
...@@ -246,6 +246,7 @@ const timeColumn = { ...@@ -246,6 +246,7 @@ const timeColumn = {
}; };
const HistoryView = (props) => { const HistoryView = (props) => {
const [completeInit, setCompleteInit] = useState(false);
const {getPrefixCls} = useContext(ConfigProvider.ConfigContext); const {getPrefixCls} = useContext(ConfigProvider.ConfigContext);
const prefixCls = getPrefixCls('history-view'); const prefixCls = getPrefixCls('history-view');
const { const {
...@@ -833,18 +834,24 @@ const HistoryView = (props) => { ...@@ -833,18 +834,24 @@ const HistoryView = (props) => {
} }
// edit by zy 根据选择的时长控制抽稀频度 // edit by zy 根据选择的时长控制抽稀频度
if (diffYears > 0) { if (diffYears > 0) {
if (diffYears === 1) return {unit: 'h', zoom: '24'}
return {unit: 'h', zoom: '48'} return {unit: 'h', zoom: '48'}
} else if (diffYears === 0 && diffDays > 0) { } else if (diffYears === 0 && diffDays > 0) {
if (diffDays >= 30) return {unit: 'h', zoom: '24'} if (diffDays > 90) return {unit: 'h', zoom: '24'}
if (diffDays >= 15) return {unit: 'h', zoom: '4'} if (diffDays > 30) return {unit: 'h', zoom: '6'}
if (diffDays >= 7) return {unit: 'h', zoom: '1'} if (diffDays > 15) return {unit: 'h', zoom: '4'}
if (diffDays >= 3) return {unit: 'min', zoom: '30'} if (diffDays > 7) return {unit: 'h', zoom: '1'}
if (diffDays >= 1) return {unit: 'min', zoom: '15'} if (diffDays > 3) return {unit: 'min', zoom: '30'}
if (diffDays > 1) return {unit: 'min', zoom: '15'}
if (diffDays === 1) return {unit: 'min', zoom: '5'}
} else if (diffYears === 0 && diffDays === 0 && diffHours > 0) { } else if (diffYears === 0 && diffDays === 0 && diffHours > 0) {
if (diffHours >= 4) return {unit: 'min', zoom: '5'} if (diffHours > 12) return {unit: 'min', zoom: '5'}
if (diffHours > 0) return {unit: 'min', zoom: '0'} if (diffHours > 4) return {unit: 'min', zoom: '1'}
if (diffHours > 1) return {unit: 's', zoom: '30'}
if (diffHours > 0) return {unit: 's', zoom: '5'}
return {unit: 's', zoom: '5'}
} else { } else {
return {unit: 'min', zoom: '0'} return {unit: '', zoom: ''}
} }
}; };
...@@ -853,6 +860,7 @@ const HistoryView = (props) => { ...@@ -853,6 +860,7 @@ const HistoryView = (props) => {
const {dateRange, isDilute, ignoreOutliers, zoom, unit} = value; const {dateRange, isDilute, ignoreOutliers, zoom, unit} = value;
const requestArr = []; const requestArr = [];
const acrossTables = []; const acrossTables = [];
const zoomArray = [];
deviceParams deviceParams
.map((item) => { .map((item) => {
let _item = {...item}; let _item = {...item};
...@@ -886,6 +894,7 @@ const HistoryView = (props) => { ...@@ -886,6 +894,7 @@ const HistoryView = (props) => {
let diffDays = moment(item.dateTo).diff(moment(item.dateFrom), 'days'); let diffDays = moment(item.dateTo).diff(moment(item.dateFrom), 'days');
let diffHours = moment(item.dateTo).diff(moment(item.dateFrom), 'hours'); let diffHours = moment(item.dateTo).diff(moment(item.dateFrom), 'hours');
let zoomParam = activeTabKey === 'curve' ? handleDataThinKey(diffYears, diffDays, diffHours, lineDataType) : {}; let zoomParam = activeTabKey === 'curve' ? handleDataThinKey(diffYears, diffDays, diffHours, lineDataType) : {};
zoomArray.push(zoomParam);
requestArr.push(getHistoryInfo({...param, ...zoomParam})); requestArr.push(getHistoryInfo({...param, ...zoomParam}));
}); });
setLoading(true); setLoading(true);
...@@ -910,6 +919,10 @@ const HistoryView = (props) => { ...@@ -910,6 +919,10 @@ const HistoryView = (props) => {
if (dataItem) { if (dataItem) {
dataItem.dateFrom = dateFrom || ''; dataItem.dateFrom = dateFrom || '';
dataItem.dateTo = dateTo || ''; dataItem.dateTo = dateTo || '';
// 抽稀情况下，剔除掉为null的点
if (zoomArray[index]?.unit !== '' && zoomArray[index]?.zoom !== '') {
dataItem.dataModel = dataItem.dataModel.filter(item => item.pv !== null)
}
return dataItem; return dataItem;
} else { } else {
return {}; return {};
...@@ -930,6 +943,7 @@ const HistoryView = (props) => { ...@@ -930,6 +943,7 @@ const HistoryView = (props) => {
}; };
useEffect(() => { useEffect(() => {
if (!completeInit) return;
const {dataThin, ignoreOutliers, zoom, unit} = dataConfig; const {dataThin, ignoreOutliers, zoom, unit} = dataConfig;
beforChangeParams().finally(() => { beforChangeParams().finally(() => {
onChangeParams({ onChangeParams({
...@@ -941,7 +955,7 @@ const HistoryView = (props) => { ...@@ -941,7 +955,7 @@ const HistoryView = (props) => {
isBoxPlots: isBoxPlots, isBoxPlots: isBoxPlots,
}); });
}); });
}, [dateRange, dataConfig, deviceParams, chartType, lineDataType]); }, [dateRange, dataConfig, deviceParams, chartType, lineDataType, completeInit]);
const handleChange = (pagination, filter, sort) => { const handleChange = (pagination, filter, sort) => {
if (sort.field === 'time') { if (sort.field === 'time') {
setTimeOrder(sort.order) setTimeOrder(sort.order)
...@@ -1008,6 +1022,7 @@ const HistoryView = (props) => { ...@@ -1008,6 +1022,7 @@ const HistoryView = (props) => {
) : ( ) : (
<SimgleChart <SimgleChart
showBoxOption={showBoxOption} showBoxOption={showBoxOption}
lineDataType={lineDataType}
curveCenter={curveCenter} curveCenter={curveCenter}
showGridLine={chartGrid} showGridLine={chartGrid}
prefixCls={prefixCls} prefixCls={prefixCls}
...@@ -1047,6 +1062,7 @@ const HistoryView = (props) => { ...@@ -1047,6 +1062,7 @@ const HistoryView = (props) => {
return _item; return _item;
}); });
setCheckboxData(_checkboxData); setCheckboxData(_checkboxData);
setCompleteInit(true);
} }
}) })
}; };
......
packages/extend-components/EC_HistoryView/src/utils.js
View file @ ac119607
...@@ -306,7 +306,7 @@ export const buildDefaultLegend = (option) => { ...@@ -306,7 +306,7 @@ export const buildDefaultLegend = (option) => {
const headTemplate = (param, opt) => { const headTemplate = (param, opt) => {
if (!param) return ''; if (!param) return '';
const {name, axisValueLabel, axisType, axisValue} = param; const {name, axisValueLabel, axisType, axisValue} = param;
const timeFormat = opt && opt.contrast ? (opt.contrastOption === 'day' ? 'HH:mm:ss' : 'DD日') : 'YYYY-MM-DD HH:mm:ss'; const timeFormat = opt && opt.contrast ? (opt.contrastOption === 'day' ? 'HH:mm:ss' : 'DD日HH时') : '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;
return `<div style="border-bottom: 1px solid #F0F0F0; color: #808080; margin-bottom:${handlePx(5, 'px')}; padding-bottom: ${handlePx(5, 'px')};">${text}</div>`; return `<div style="border-bottom: 1px solid #F0F0F0; color: #808080; margin-bottom:${handlePx(5, 'px')}; padding-bottom: ${handlePx(5, 'px')};">${text}</div>`;
...@@ -322,34 +322,34 @@ const seriesTemplate = (param, unit) => { ...@@ -322,34 +322,34 @@ const seriesTemplate = (param, unit) => {
<span style="${isMobile() ? 'width: ' + handlePx(90, 'px') + ';overflow:hidden;text-overflow:ellipsis;white-space:nowrap' : ''}">${param.seriesName}</span> <span style="${isMobile() ? 'width: ' + handlePx(90, 'px') + ';overflow:hidden;text-overflow:ellipsis;white-space:nowrap' : ''}">${param.seriesName}</span>
<span style="display:inline-block;">：</span> <span style="display:inline-block;">：</span>
<span style="color:${color};margin: 0 ${handlePx(5, 'px')} 0 auto;">${value?.toFixed(3) ?? '-'}</span> <span style="color:${color};margin: 0 ${handlePx(5, 'px')} 0 auto;">${value?.toFixed(3) ?? '-'}</span>
<span style="font-size: ${handlePx(12, 'px')};">${_unit??''}</span> <span style="font-size: ${handlePx(12, 'px')};">${_unit ?? ''}</span>
</div>`; </div>`;
return param.componentSubType !== 'candlestick' return param.componentSubType !== 'candlestick'
? `<div style="display: flex; align-items: center;"> ? `<div style="display: flex; align-items: center;">
<span style="${isMobile() ? 'width: ' + handlePx(90, 'px') + ';overflow:hidden;text-overflow:ellipsis;white-space:nowrap' : ''}">${param.seriesName}</span><span style="display:inline-block;">：</span> <span style="${isMobile() ? 'width: ' + handlePx(90, 'px') + ';overflow:hidden;text-overflow:ellipsis;white-space:nowrap' : ''}">${param.seriesName}</span><span style="display:inline-block;">：</span>
<span style="color: ${COLOR.AVG};margin: 0 ${handlePx(5, 'px')} 0 auto;">${value[1] ?? '-'}</span> <span style="color: ${COLOR.AVG};margin: 0 ${handlePx(5, 'px')} 0 auto;">${value[1] ?? '-'}</span>
<span style="font-size: ${handlePx(12, 'px')};">${_unit??''}</span> <span style="font-size: ${handlePx(12, 'px')};">${_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 ${handlePx(5, 'px')} 0 auto;">${value[1] ?? '-'}</span> <span style="color: ${COLOR.AVG};margin: 0 ${handlePx(5, 'px')} 0 auto;">${value[1] ?? '-'}</span>
<span style="font-size: ${handlePx(12, 'px')};">${_unit??''}</span> <span style="font-size: ${handlePx(12, 'px')};">${_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 ${handlePx(5, 'px')} 0 auto;">${value[2] ?? '-'}</span> <span style="color: ${COLOR.AVG};margin: 0 ${handlePx(5, 'px')} 0 auto;">${value[2] ?? '-'}</span>
<span style="font-size: ${handlePx(12, 'px')};">${_unit??''}</span> <span style="font-size: ${handlePx(12, 'px')};">${_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 ${handlePx(5, 'px')} 0 auto;">${value[3] ?? '-'}</span> <span style="color: ${COLOR.AVG};margin: 0 ${handlePx(5, 'px')} 0 auto;">${value[3] ?? '-'}</span>
<span style="font-size: ${handlePx(12, 'px')};">${_unit??''}</span> <span style="font-size: ${handlePx(12, 'px')};">${_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 ${handlePx(5, 'px')} 0 auto;">${value[4] ?? '-'}</span> <span style="color: ${COLOR.AVG};margin: 0 ${handlePx(5, 'px')} 0 auto;">${value[4] ?? '-'}</span>
<span style="font-size: ${handlePx(12, 'px')};">${_unit??''}</span> <span style="font-size: ${handlePx(12, 'px')};">${_unit ?? ''}</span>
</div> </div>
`; `;
}; };
...@@ -454,7 +454,14 @@ const returnXAxis = ({ ...@@ -454,7 +454,14 @@ const returnXAxis = ({
.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),
); );
return {xAxis: {type: 'time', min, max}, series}; return {
xAxis: {
type: 'time', min, max, axisLabel: {
formatter: contrast ? (contrastOption === 'month' ? '{dd}日' : '{HH}:{mm}') : ''
}
}, series
};
} }
const handleDefault = (config, cusOption) => { const handleDefault = (config, cusOption) => {
const needUnit = _.get(config, 'needUnit', false); const needUnit = _.get(config, 'needUnit', false);
...@@ -685,7 +692,8 @@ const returnCustomSeries = (dataSource) => { ...@@ -685,7 +692,8 @@ const returnCustomSeries = (dataSource) => {
* @param {any} config 额外配置信息 * @param {any} config 额外配置信息
*/ */
const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth, config) => { const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth, config, lineDataType = '') => {
console.log('config:', config)
const { const {
needUnit, needUnit,
curveCenter, curveCenter,
...@@ -804,19 +812,19 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth ...@@ -804,19 +812,19 @@ const optionGenerator = (dataSource, cusOption, contrast, contrastOption, smooth
}</span><span style="display:inline-block;">：</span> }</span><span style="display:inline-block;">：</span>
<span style="color: ${COLOR.NORMAL};margin: 0 ${handlePx(5, 'px')} 0 auto;">${e[0]?.value?.[1] ?? '-' <span style="color: ${COLOR.NORMAL};margin: 0 ${handlePx(5, 'px')} 0 auto;">${e[0]?.value?.[1] ?? '-'
}</span> }</span>
<span style="font-size: ${handlePx(12, 'px')};">${_unit??''}</span> <span style="font-size: ${handlePx(12, 'px')};">${_unit ?? ''}</span>
</div> </div>
<div style="display: flex; align-items: center;"> <div style="display: ${lineDataType==='特征曲线'?'flex':'none'}; 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 ${handlePx(5, 'px')} 0 auto;">${e?.[1]?.value?.[1] ?? '-' <span style="color: ${COLOR.AVG};margin: 0 ${handlePx(5, 'px')} 0 auto;">${e?.[1]?.value?.[1] ?? '-'
}</span> }</span>
<span style="font-size: ${handlePx(12, 'px')};">${_unit??''}</span> <span style="font-size: ${handlePx(12, 'px')};">${_unit ?? ''}</span>
</div> </div>
<div style="display: flex; align-items: center;"> <div style="display: ${lineDataType==='特征曲线'?'flex':'none'}; 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 ${handlePx(5, 'px')} 0 auto;">${_maxValues[e?.[2]?.dataIndex] ?? '-' <span style="color: ${COLOR.AVG};margin: 0 ${handlePx(5, 'px')} 0 auto;">${_maxValues[e?.[2]?.dataIndex] ?? '-'
}</span> }</span>
<span style="font-size: ${handlePx(12, 'px')};">${_unit??''}</span> <span style="font-size: ${handlePx(12, 'px')};">${_unit ?? ''}</span>
</div> </div>
</div> </div>
</div>`; </div>`;
......
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