Skip to content

Commit e14e7c6

Browse files
SoarBlueSkySoarBlueSky
committed
feat: Add Date aggregate field
1 parent 4016bd9 commit e14e7c6

File tree

20 files changed

+386
-79
lines changed

20 files changed

+386
-79
lines changed

‎frontend/src/app/components/ChartEditor.tsx‎

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@
1818

1919
import { ExclamationCircleOutlined } from '@ant-design/icons';
2020
import { Modal } from 'antd';
21+
import { ChartDataViewFieldCategory } from 'app/constants';
2122
import useI18NPrefix from 'app/hooks/useI18NPrefix';
2223
import useMount from 'app/hooks/useMount';
2324
import { ChartDataRequestBuilder } from 'app/models/ChartDataRequestBuilder';
@@ -33,6 +34,7 @@ import {
3334
currentDataViewSelector,
3435
datasetsSelector,
3536
shadowChartConfigSelector,
37+
sourceSupportDateFieldSelector,
3638
} from 'app/pages/ChartWorkbenchPage/slice/selectors';
3739
import {
3840
initWorkbenchAction,
@@ -51,6 +53,7 @@ import { IChart } from 'app/types/Chart';
5153
import { ChartDTO } from 'app/types/ChartDTO';
5254
import { makeDownloadDataTask } from 'app/utils/fetch';
5355
import { transferChartConfigs } from 'app/utils/internalChartHelper';
56+
import { updateBy } from 'app/utils/mutation';
5457
import { CommonFormTypes } from 'globalConstants';
5558
import { FC, useCallback, useEffect, useMemo, useState } from 'react';
5659
import { useDispatch, useSelector } from 'react-redux';
@@ -115,6 +118,7 @@ export const ChartEditor: FC<ChartEditorProps> = ({
115118
const shadowChartConfig = useSelector(shadowChartConfigSelector);
116119
const backendChart = useSelector(backendChartSelector);
117120
const aggregation = useSelector(aggregationSelector);
121+
const sourceSupportDateField = useSelector(sourceSupportDateFieldSelector);
118122
const [chart, setChart] = useState<IChart>();
119123
const [allowQuery, setAllowQuery] = useState<boolean>(false);
120124
const history = useHistory();
@@ -288,6 +292,56 @@ export const ChartEditor: FC<ChartEditorProps> = ({
288292
return true;
289293
}
290294

295+
const dateAggregationField = payload.value.rows.filter(
296+
v => v.category === ChartDataViewFieldCategory.DateAggregationField,
297+
);
298+
const deleteColName = payload.value.deleteColName;
299+
300+
/**
301+
* Date aggregation field added to function Columns
302+
*/
303+
if (dateAggregationField.length) {
304+
const expressionList: any = [];
305+
const newComputedFields: any = dataview?.computedFields
306+
? CloneValueDeep(dataview?.computedFields)
307+
: [];
308+
309+
newComputedFields.forEach(v => {
310+
if (v.category === ChartDataViewFieldCategory.DateAggregationField) {
311+
expressionList.push(v.expression);
312+
}
313+
});
314+
315+
dateAggregationField.forEach(v => {
316+
if (!expressionList.includes(v.expression)) {
317+
newComputedFields.push({
318+
category: v.category,
319+
id: v.colName,
320+
type: v.type,
321+
expression: v.expression,
322+
});
323+
}
324+
});
325+
326+
dispatch(
327+
workbenchSlice.actions.updateCurrentDataViewComputedFields(
328+
newComputedFields,
329+
),
330+
);
331+
}
332+
if (deleteColName) {
333+
const newComputedFields: any = dataview?.computedFields?.filter(
334+
v => v.id !== deleteColName,
335+
);
336+
dispatch(
337+
workbenchSlice.actions.updateCurrentDataViewComputedFields(
338+
newComputedFields,
339+
),
340+
);
341+
payload = updateBy(payload, draft => {
342+
delete draft.value.deleteColName;
343+
});
344+
}
291345
dispatch(
292346
updateChartConfigAndRefreshDatasetAction({
293347
type,
@@ -518,6 +572,7 @@ export const ChartEditor: FC<ChartEditorProps> = ({
518572
defaultViewId={defaultViewId}
519573
expensiveQuery={expensiveQuery}
520574
allowQuery={allowQuery}
575+
sourceSupportDateField={sourceSupportDateField}
521576
onChartChange={handleChartChange}
522577
onChartConfigChange={handleChartConfigChange}
523578
onDataViewChange={handleDataViewChanged}

‎frontend/src/app/constants.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -75,6 +75,7 @@ export enum ChartDataViewFieldCategory {
7575
Variable = 'variable',
7676
ComputedField = 'computedField',
7777
AggregateComputedField = 'aggregateComputedField',
78+
DateAggregationField = 'dateAggregationField',
7879
}
7980

8081
export enum SortActionType {

‎frontend/src/app/models/ChartDataRequestBuilder.ts‎

Lines changed: 3 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -99,9 +99,7 @@ export class ChartDataRequestBuilder {
9999

100100
if (
101101
cur.type === ChartDataSectionType.MIXED &&
102-
cur.rows?.findIndex(
103-
v => v.type === DataViewFieldType.NUMERIC,
104-
) !== -1
102+
cur.rows?.findIndex(v => v.type === DataViewFieldType.NUMERIC) !== -1
105103
) {
106104
return acc.concat(
107105
cur.rows.filter(v => v.type === DataViewFieldType.NUMERIC),
@@ -142,10 +140,7 @@ export class ChartDataRequestBuilder {
142140
if (
143141
cur.type === ChartDataSectionType.MIXED &&
144142
cur.rows?.find(v =>
145-
[
146-
DataViewFieldType.DATE,
147-
DataViewFieldType.STRING,
148-
].includes(v.type),
143+
[DataViewFieldType.DATE, DataViewFieldType.STRING].includes(v.type),
149144
)
150145
) {
151146
//zh: 判断数据中是否含有 DATE 和 STRING 类型 en: Determine whether the data contains DATE and STRING types
@@ -335,6 +330,7 @@ export class ChartDataRequestBuilder {
335330
}
336331
return expression.replaceAll('[', '').replaceAll(']', '');
337332
};
333+
338334
return (this.dataView.computedFields || []).map(f => ({
339335
alias: f.id!,
340336
snippet: _removeSquareBrackets(f.expression),

‎frontend/src/app/pages/ChartWorkbenchPage/components/ChartOperationPanel/components/ChartConfigPanel/ChartConfigPanel.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -204,11 +204,11 @@ const StyledChartDataViewPanel = styled.div`
204204

205205
const ConfigBlock = styled.div`
206206
display: flex;
207+
flex: 1;
207208
flex-direction: column;
208209
min-height: 0;
209-
flex: 1;
210-
border-radius: ${BORDER_RADIUS};
211210
background-color: ${p => p.theme.componentBackground};
211+
border-radius: ${BORDER_RADIUS};
212212
213213
.tabs {
214214
flex-shrink: 0;

‎frontend/src/app/pages/ChartWorkbenchPage/components/ChartOperationPanel/components/ChartDataViewPanel/ChartDataViewPanel.tsx‎

Lines changed: 26 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -19,10 +19,7 @@
1919
import { FormOutlined, PlusOutlined } from '@ant-design/icons';
2020
import { message, Popover, Tooltip, TreeSelect } from 'antd';
2121
import { ToolbarButton } from 'app/components';
22-
import {
23-
ChartDataViewFieldCategory,
24-
DataViewFieldType,
25-
} from 'app/constants';
22+
import { ChartDataViewFieldCategory, DataViewFieldType } from 'app/constants';
2623
import useI18NPrefix from 'app/hooks/useI18NPrefix';
2724
import useMount from 'app/hooks/useMount';
2825
import useStateModal, { StateModalSize } from 'app/hooks/useStateModal';
@@ -32,7 +29,10 @@ import {
3229
dataviewsSelector,
3330
makeDataviewTreeSelector,
3431
} from 'app/pages/ChartWorkbenchPage/slice/selectors';
35-
import { fetchViewDetailAction } from 'app/pages/ChartWorkbenchPage/slice/thunks';
32+
import {
33+
fetchsourceSupportDateField,
34+
fetchViewDetailAction,
35+
} from 'app/pages/ChartWorkbenchPage/slice/thunks';
3636
import { useAccess, useCascadeAccess } from 'app/pages/MainPage/Access';
3737
import {
3838
PermissionLevels,
@@ -43,7 +43,7 @@ import ChartDataView from 'app/types/ChartDataView';
4343
import { ChartDataViewMeta } from 'app/types/ChartDataViewMeta';
4444
import { checkComputedFieldAsync } from 'app/utils/fetch';
4545
import { updateByKey } from 'app/utils/mutation';
46-
import { FC, memo, useCallback, useMemo } from 'react';
46+
import { FC, memo, useCallback, useEffect, useMemo } from 'react';
4747
import { useDispatch, useSelector } from 'react-redux';
4848
import { useHistory } from 'react-router';
4949
import styled from 'styled-components/macro';
@@ -94,19 +94,17 @@ const ChartDataViewPanel: FC<{
9494
const history = useHistory();
9595

9696
const handleDataViewChange = useCallback(
97-
value => {
97+
async value => {
9898
if (dataView?.id === value) {
9999
return false;
100100
}
101-
102101
let Data = chartConfig?.datas?.filter(v => v.rows && v.rows.length);
103-
104102
if (Data?.length) {
105103
(showModal as Function)({
106104
title: '',
107105
modalSize: StateModalSize.XSMALL,
108106
content: () => t('toggleViewTip'),
109-
onOk: () => {
107+
onOk: async () => {
110108
onDataViewChange?.();
111109
dispatch(fetchViewDetailAction(value));
112110
},
@@ -231,17 +229,20 @@ const ChartDataViewPanel: FC<{
231229
};
232230

233231
const getSortedFields = (dataView?: ChartDataView) => {
232+
const computedFields = dataView?.computedFields?.filter(
233+
v => v.category !== ChartDataViewFieldCategory.DateAggregationField,
234+
);
234235
const stringFields =
235236
(dataView?.meta || [])
236-
.concat(dataView?.computedFields || [])
237+
.concat(computedFields || [])
237238
?.filter(f => f.type === DataViewFieldType.STRING) || [];
238239
const numericFields =
239240
(dataView?.meta || [])
240-
.concat(dataView?.computedFields || [])
241+
.concat(computedFields || [])
241242
?.filter(f => f.type === DataViewFieldType.NUMERIC) || [];
242243
const dateFields =
243244
(dataView?.meta || [])
244-
.concat(dataView?.computedFields || [])
245+
.concat(computedFields || [])
245246
?.filter(f => f.type === DataViewFieldType.DATE) || [];
246247
return [...dateFields, ...stringFields, ...numericFields];
247248
};
@@ -252,12 +253,6 @@ const ChartDataViewPanel: FC<{
252253
history.push(`/organizations/${orgId}/views/${viewId}`);
253254
}, [dataView?.id, dataView?.orgId, history]);
254255

255-
useMount(() => {
256-
if (defaultViewId) {
257-
handleDataViewChange(defaultViewId);
258-
}
259-
});
260-
261256
const handleConfirmVisible = useCallback(() => {
262257
(showModal as Function)({
263258
title: '',
@@ -267,6 +262,18 @@ const ChartDataViewPanel: FC<{
267262
});
268263
}, [editView, showModal, t]);
269264

265+
useMount(() => {
266+
if (defaultViewId) {
267+
handleDataViewChange(defaultViewId);
268+
}
269+
});
270+
271+
useEffect(() => {
272+
if (dataView) {
273+
dispatch(fetchsourceSupportDateField({ sourceId: dataView.sourceId }));
274+
}
275+
}, [dataView, dispatch]);
276+
270277
return (
271278
<StyledChartDataViewPanel>
272279
<Header>

0 commit comments

Comments
 (0)