Skip to content

Commit 8f4ca2c

Browse files
scottsutscottsut
authored
Merge pull request #1232 from lyp000119/dateaggregation
Add Dateaggregation
2 parents f441f4e + d81ed82 commit 8f4ca2c

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

44 files changed

+1149
-164
lines changed

‎frontend/src/app/components/ChartDrill/ChartDrillContextMenu.tsx‎

Lines changed: 165 additions & 75 deletions
Original file line numberDiff line numberDiff line change
@@ -18,92 +18,182 @@
1818

1919
import { CheckOutlined } from '@ant-design/icons';
2020
import { Dropdown, Menu } from 'antd';
21+
import {
22+
ChartDataSectionType,
23+
ChartDataViewFieldCategory,
24+
interimDateAggregatedKey,
25+
} from 'app/constants';
2126
import useI18NPrefix from 'app/hooks/useI18NPrefix';
2227
import { DrillMode } from 'app/models/ChartDrillOption';
28+
import DateMeunItem from 'app/pages/ChartWorkbenchPage/components/ChartOperationPanel/components/ChartFieldAction/DateAggregationAction/DateMeunItem';
2329
import ChartDrillContext from 'app/pages/ChartWorkbenchPage/contexts/ChartDrillContext';
30+
import { ChartConfig, ChartDataSectionField } from 'app/types/ChartConfig';
31+
import { getInterimDateAggregateRows } from 'app/utils/chartHelper';
32+
import { updateBy } from 'app/utils/mutation';
2433
import classnames from 'classnames';
25-
import { FC, memo, useContext, useMemo } from 'react';
34+
import { FC, memo, useCallback, useContext, useMemo } from 'react';
2635
import styled from 'styled-components/macro';
2736
import { FONT_WEIGHT_MEDIUM, SPACE_SM } from 'styles/StyleConstants';
2837

29-
const ChartDrillContextMenu: FC<{}> = memo(({ children }) => {
30-
const t = useI18NPrefix(`viz.palette.drill`);
31-
const { drillOption, onDrillOptionChange } = useContext(ChartDrillContext);
38+
const ChartDrillContextMenu: FC<{ chartConfig?: ChartConfig }> = memo(
39+
({ children, chartConfig }) => {
40+
const t = useI18NPrefix(`viz.palette.drill`);
41+
const {
42+
drillOption,
43+
onDrillOptionChange,
44+
sourceSupportDateField,
45+
onChartDrillDataAggregationChange,
46+
} = useContext(ChartDrillContext);
47+
const currentFields = drillOption?.getCurrentFields();
48+
const currentDrillLevel = drillOption?.getCurrentDrillLevel();
3249

33-
const currentDrillLevel = drillOption?.getCurrentDrillLevel();
34-
const selectDrillStatusMenu = useMemo(() => {
35-
return (
36-
<Menu.Item key="selectDrillStatus">
37-
<StyledMenuSwitch
38-
className={classnames({ on: !!drillOption?.isSelectedDrill })}
39-
>
40-
<p>
41-
{drillOption?.isSelectedDrill
42-
? t('selectDrillOn')
43-
: t('selectDrillOff')}
44-
</p>
45-
<CheckOutlined className="icon" />
46-
</StyledMenuSwitch>
47-
</Menu.Item>
50+
const currentDrillField = useMemo(() => {
51+
if (!drillOption) {
52+
return;
53+
}
54+
const allFields = drillOption.getAllFields();
55+
const groupSection = chartConfig?.datas?.find(
56+
v => v.type === ChartDataSectionType.GROUP,
57+
);
58+
let rows: ChartDataSectionField[] | undefined = [];
59+
60+
if (currentFields) {
61+
rows = groupSection?.rows?.filter(v =>
62+
currentFields.some(val => val.uid === v.uid),
63+
);
64+
} else {
65+
rows = groupSection?.rows?.filter(v => v.uid === allFields[0].uid);
66+
}
67+
return getInterimDateAggregateRows(rows);
68+
}, [currentFields, drillOption, chartConfig?.datas]);
69+
70+
const handleChangeDataAggregate = useCallback(
71+
(config: ChartDataSectionField) => {
72+
const groupData = chartConfig?.datas?.find(
73+
v => v.type === ChartDataSectionType.GROUP,
74+
);
75+
76+
if (groupData) {
77+
const _groupData = updateBy(groupData, draft => {
78+
if (draft.rows) {
79+
const index = draft.rows.findIndex(v => v.uid === config.uid);
80+
const interimDateAggregatedValue =
81+
draft.rows[index][interimDateAggregatedKey];
82+
const deleteColName = interimDateAggregatedValue
83+
? interimDateAggregatedValue.colName
84+
: draft.rows[index].colName;
85+
86+
draft.rows[index][interimDateAggregatedKey] = config;
87+
draft.deleteColName = deleteColName;
88+
}
89+
});
90+
91+
onChartDrillDataAggregationChange?.('data', {
92+
needRefresh: true,
93+
ancestors: [0],
94+
value: _groupData,
95+
});
96+
}
97+
},
98+
[chartConfig?.datas, onChartDrillDataAggregationChange],
4899
);
49-
}, [drillOption?.isSelectedDrill, t]);
50-
const contextMenu = useMemo(() => {
51-
return (
52-
<StyledChartDrillMenu
53-
onClick={({ key }) => {
54-
if (!drillOption) {
55-
return;
56-
}
57-
if (key === 'selectDrillStatus') {
58-
drillOption?.toggleSelectedDrill(!drillOption?.isSelectedDrill);
59-
onDrillOptionChange?.(drillOption);
60-
} else if (key === DrillMode.Drill) {
61-
drillOption?.drillDown();
62-
onDrillOptionChange?.(drillOption);
63-
} else if (key === DrillMode.Expand) {
64-
drillOption?.expandDown();
65-
onDrillOptionChange?.(drillOption);
66-
} else {
67-
drillOption?.rollUp();
68-
onDrillOptionChange?.(drillOption);
69-
}
70-
}}
71-
>
72-
{!!currentDrillLevel && (
73-
<Menu.Item key={'rollUp'}>{t('rollUp')}</Menu.Item>
74-
)}
75-
{drillOption?.mode !== DrillMode.Expand &&
76-
!drillOption?.isBottomLevel && (
77-
<Menu.Item key={DrillMode.Drill}>{t('showNextLevel')}</Menu.Item>
78-
)}
79-
{drillOption?.mode !== DrillMode.Drill &&
80-
!drillOption?.isBottomLevel && (
81-
<Menu.Item key={DrillMode.Expand}>{t('expandNextLevel')}</Menu.Item>
100+
101+
const selectDrillStatusMenu = useMemo(() => {
102+
return (
103+
<Menu.Item key="selectDrillStatus">
104+
<StyledMenuSwitch
105+
className={classnames({ on: !!drillOption?.isSelectedDrill })}
106+
>
107+
<p>
108+
{drillOption?.isSelectedDrill
109+
? t('selectDrillOn')
110+
: t('selectDrillOff')}
111+
</p>
112+
<CheckOutlined className="icon" />
113+
</StyledMenuSwitch>
114+
</Menu.Item>
115+
);
116+
}, [drillOption?.isSelectedDrill, t]);
117+
const contextMenu = useMemo(() => {
118+
return (
119+
<StyledChartDrillMenu
120+
onClick={({ key }) => {
121+
if (!drillOption) {
122+
return;
123+
}
124+
if (key === 'selectDrillStatus') {
125+
drillOption?.toggleSelectedDrill(!drillOption?.isSelectedDrill);
126+
onDrillOptionChange?.(drillOption);
127+
} else if (key === DrillMode.Drill) {
128+
drillOption?.drillDown();
129+
onDrillOptionChange?.(drillOption);
130+
} else if (key === DrillMode.Expand) {
131+
drillOption?.expandDown();
132+
onDrillOptionChange?.(drillOption);
133+
} else if (key === 'rollUp') {
134+
drillOption?.rollUp();
135+
onDrillOptionChange?.(drillOption);
136+
}
137+
}}
138+
>
139+
{!!currentDrillLevel && (
140+
<Menu.Item key={'rollUp'}>{t('rollUp')}</Menu.Item>
82141
)}
83-
{drillOption?.mode !== DrillMode.Expand && selectDrillStatusMenu}
84-
</StyledChartDrillMenu>
142+
{drillOption?.mode !== DrillMode.Expand &&
143+
!drillOption?.isBottomLevel && (
144+
<Menu.Item key={DrillMode.Drill}>{t('showNextLevel')}</Menu.Item>
145+
)}
146+
{drillOption?.mode !== DrillMode.Drill &&
147+
!drillOption?.isBottomLevel && (
148+
<Menu.Item key={DrillMode.Expand}>
149+
{t('expandNextLevel')}
150+
</Menu.Item>
151+
)}
152+
{drillOption?.mode !== DrillMode.Expand && selectDrillStatusMenu}
153+
154+
{currentDrillField?.map((v, i) => {
155+
if (
156+
v.category === ChartDataViewFieldCategory.DateAggregationField
157+
) {
158+
return (
159+
<Menu.SubMenu key={i} title={v.colName}>
160+
<DateMeunItem
161+
sourceSupportDateField={sourceSupportDateField}
162+
config={v[interimDateAggregatedKey] || v}
163+
onChange={config => handleChangeDataAggregate(config)}
164+
/>
165+
</Menu.SubMenu>
166+
);
167+
}
168+
return false;
169+
})}
170+
</StyledChartDrillMenu>
171+
);
172+
}, [
173+
currentDrillLevel,
174+
t,
175+
drillOption,
176+
selectDrillStatusMenu,
177+
onDrillOptionChange,
178+
currentDrillField,
179+
handleChangeDataAggregate,
180+
sourceSupportDateField,
181+
]);
182+
183+
return (
184+
<StyledChartDrill className="chart-drill-menu-container">
185+
<Dropdown
186+
disabled={!drillOption}
187+
overlay={contextMenu}
188+
destroyPopupOnHide={true}
189+
trigger={['contextMenu']}
190+
>
191+
<div style={{ height: '100%' }}>{children}</div>
192+
</Dropdown>
193+
</StyledChartDrill>
85194
);
86-
}, [
87-
currentDrillLevel,
88-
t,
89-
drillOption,
90-
selectDrillStatusMenu,
91-
onDrillOptionChange,
92-
]);
93-
94-
return (
95-
<StyledChartDrill className="chart-drill-menu-container">
96-
<Dropdown
97-
disabled={!drillOption}
98-
overlay={contextMenu}
99-
destroyPopupOnHide={true}
100-
trigger={['contextMenu']}
101-
>
102-
<div style={{ height: '100%' }}>{children}</div>
103-
</Dropdown>
104-
</StyledChartDrill>
105-
);
106-
});
195+
},
196+
);
107197

108198
export default ChartDrillContextMenu;
109199

0 commit comments

Comments
 (0)