Skip to content

Commit 0b9bd60

Browse files
dkamburovdkamburov
authored
Merge pull request #10620 from IgniteUI/mkirova/pivot-keys-config
Allow setting custom pivot keys via the configuration. Update all har…
2 parents 502bb29 + 8de928a commit 0b9bd60

File tree

8 files changed

+63
-57
lines changed

8 files changed

+63
-57
lines changed

‎projects/igniteui-angular/src/lib/grids/common/grid.interface.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ import { IGridGroupingStrategy, IGridSortingStrategy } from './strategy';
3434
import { IForOfState, IgxGridForOfDirective } from '../../directives/for-of/for_of.directive';
3535
import { OverlaySettings } from '../../services/overlay/utilities';
3636
import { IPinningConfig } from '../grid.common';
37-
import { IDimensionsChange, IPivotConfiguration, IPivotDimension, IPivotValue, IValuesChange } from '../pivot-grid/pivot-grid.interface';
37+
import { IDimensionsChange, IPivotConfiguration, IPivotDimension, IPivotKeys, IPivotValue, IValuesChange } from '../pivot-grid/pivot-grid.interface';
3838

3939

4040
export const IGX_GRID_BASE = new InjectionToken<GridType>('IgxGridBaseToken');
@@ -631,6 +631,7 @@ export interface PivotGridType extends GridType {
631631
resolveRowDimensionWidth(dim: IPivotDimension): number;
632632
dimensionsChange: EventEmitter<IDimensionsChange>;
633633
valuesChange: EventEmitter<IValuesChange>;
634+
pivotKeys: IPivotKeys;
634635
}
635636
export interface GridSVGIcon {
636637
name: string;

‎projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-grid.component.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@
3434
| pivotGridSort:pivotConfiguration:sortStrategy:id:pipeTrigger
3535
| pivotGridRow:pivotConfiguration:expansionStates:pipeTrigger:sortingExpressions
3636
| pivotGridColumn:pivotConfiguration:expansionStates:pipeTrigger:sortingExpressions
37-
| pivotGridColumnSort:sortingExpressions:sortStrategy:pipeTrigger
37+
| pivotGridColumnSort:sortingExpressions:sortStrategy:pipeTrigger:pivotKeys
3838
| pivotGridRowExpansion:pivotConfiguration:expansionStates:defaultExpandState:pipeTrigger"
3939
let-rowIndex="index" [igxForScrollOrientation]="'vertical'" [igxForScrollContainer]='verticalScroll'
4040
[igxForContainerSize]='calcHeight'

‎projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-grid.component.ts

Lines changed: 26 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -293,7 +293,9 @@ export class IgxPivotGridComponent extends IgxGridBaseDirective implements OnIni
293293

294294
public columnGroupStates = new Map<string, boolean>();
295295
public dimensionDataColumns;
296-
public pivotKeys: IPivotKeys = { aggregations: 'aggregations', records: 'records', children: 'children', level: 'level' };
296+
public get pivotKeys() {
297+
return this.pivotConfiguration.pivotKeys || {aggregations: 'aggregations', records: 'records', children: 'children', level: 'level'};
298+
}
297299
public isPivot = true;
298300

299301
/**
@@ -455,7 +457,7 @@ export class IgxPivotGridComponent extends IgxGridBaseDirective implements OnIni
455457
let currDim = dim;
456458
let shouldBreak = false;
457459
do {
458-
const key = PivotUtil.getRecordKey(record, currDim, prev);
460+
const key = PivotUtil.getRecordKey(record, currDim, prev, this.pivotKeys);
459461
if (this.selectionService.isPivotRowSelected(key) && !selectedRowIds.find(x => x === record)) {
460462
selectedRowIds.push(record);
461463
shouldBreak = true;
@@ -575,24 +577,24 @@ export class IgxPivotGridComponent extends IgxGridBaseDirective implements OnIni
575577
public getDimensionData(dim: IPivotDimension,
576578
dimExprTree: IFilteringExpressionsTree,
577579
done: (colVals: any[]) => void) {
578-
let columnValues = [];
579-
const data = this.gridAPI.get_data();
580-
const state = {
581-
expressionsTree: dimExprTree,
582-
strategy: this.filterStrategy || new DimensionValuesFilteringStrategy(),
583-
advancedFilteringExpressionsTree: this.advancedFilteringExpressionsTree
584-
};
585-
const filtered = DataUtil.filter(data, state, this);
586-
const allValuesHierarchy = PivotUtil.getFieldsHierarchy(
587-
filtered,
588-
[dim],
589-
PivotDimensionType.Column,
590-
{ aggregations: 'aggregations', records: 'records', children: 'children', level: 'level' }
591-
);
592-
const flatData = Array.from(allValuesHierarchy.values());
593-
columnValues = flatData.map(record => this.extractValue(record['value']));
594-
done(columnValues);
595-
return;
580+
let columnValues = [];
581+
const data = this.gridAPI.get_data();
582+
const state = {
583+
expressionsTree: dimExprTree,
584+
strategy: this.filterStrategy || new DimensionValuesFilteringStrategy(),
585+
advancedFilteringExpressionsTree: this.advancedFilteringExpressionsTree
586+
};
587+
const filtered = DataUtil.filter(data, state, this);
588+
const allValuesHierarchy = PivotUtil.getFieldsHierarchy(
589+
filtered,
590+
[dim],
591+
PivotDimensionType.Column,
592+
this.pivotKeys
593+
);
594+
const flatData = Array.from(allValuesHierarchy.values());
595+
columnValues = flatData.map(record => this.extractValue(record['value']));
596+
done(columnValues);
597+
return;
596598
}
597599

598600
/** @hidden */
@@ -1018,10 +1020,10 @@ export class IgxPivotGridComponent extends IgxGridBaseDirective implements OnIni
10181020
fieldsMap = this.generateFromData(filteredFields);
10191021
} else {
10201022
fieldsMap = PivotUtil.getFieldsHierarchy(
1021-
data,
1022-
this.columnDimensions,
1023-
PivotDimensionType.Column,
1024-
{ aggregations: 'aggregations', records: 'records', children: 'children', level: 'level' }
1023+
data,
1024+
this.columnDimensions,
1025+
PivotDimensionType.Column,
1026+
this.pivotKeys
10251027
);
10261028
}
10271029
columns = this.generateColumnHierarchy(fieldsMap, data);

‎projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-grid.interface.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -49,6 +49,7 @@ export interface IPivotConfiguration {
4949
values: IPivotValue[] | null;
5050
/** Dimensions to be displayed in the filter area. */
5151
filters?: IPivotDimension[] | null;
52+
pivotKeys?: IPivotKeys;
5253
}
5354

5455
export interface IPivotDimension {

‎projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-grid.pipes.ts

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -29,9 +29,9 @@ export class IgxPivotRowPipe implements PipeTransform {
2929
config: IPivotConfiguration,
3030
_: Map<any, boolean>,
3131
_pipeTrigger?: number,
32-
__?,
33-
pivotKeys: IPivotKeys = { aggregations: 'aggregations', records: 'records', children: 'children', level: 'level' }
32+
__?
3433
): any[] {
34+
const pivotKeys = config.pivotKeys || { aggregations: 'aggregations', records: 'records', children: 'children', level: 'level' };
3535
const enabledRows = config.rows.filter(x => x.enabled);
3636
const rowStrategy = config.rowStrategy || PivotRowDimensionsStrategy.instance();
3737
const data = cloneArray(collection, true);
@@ -57,8 +57,8 @@ export class IgxPivotRowExpansionPipe implements PipeTransform {
5757
defaultExpand: boolean,
5858
_pipeTrigger?: number,
5959
__?,
60-
pivotKeys: IPivotKeys = { aggregations: 'aggregations', records: 'records', children: 'children', level: 'level' }
6160
): any[] {
61+
const pivotKeys = config.pivotKeys || { aggregations: 'aggregations', records: 'records', children: 'children', level: 'level' };
6262
const enabledRows = config.rows.filter(x => x.enabled);
6363
const data = collection ? cloneArray(collection, true) : [];
6464
let totalLlv = 0;
@@ -103,9 +103,9 @@ export class IgxPivotColumnPipe implements PipeTransform {
103103
config: IPivotConfiguration,
104104
_: Map<any, boolean>,
105105
_pipeTrigger?: number,
106-
__?,
107-
pivotKeys: IPivotKeys = { aggregations: 'aggregations', records: 'records', children: 'children', level: 'level' }
106+
__?
108107
): any[] {
108+
const pivotKeys = config.pivotKeys || { aggregations: 'aggregations', records: 'records', children: 'children', level: 'level' };
109109
const enabledColumns = config.columns.filter(x => x.enabled);
110110
const enabledValues = config.values.filter(x => x.enabled);
111111

‎projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-row.component.ts

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -92,7 +92,7 @@ export class IgxPivotRowComponent extends IgxRowDirective implements OnChanges {
9292
*/
9393
public getRowDimensionKey(col: IgxColumnComponent) {
9494
const dimData = this.rowDimensionData.find(x => x.column.field === col.field);
95-
const key = PivotUtil.getRecordKey(this.data, dimData.dimension, dimData.prevDimensions);
95+
const key = PivotUtil.getRecordKey(this.data, dimData.dimension, dimData.prevDimensions, this.grid.pivotKeys);
9696
return key;
9797
}
9898

@@ -159,8 +159,7 @@ export class IgxPivotRowComponent extends IgxRowDirective implements OnChanges {
159159
currentLvl += level;
160160
const prev = [];
161161
for (const dim of rowDimConfig) {
162-
const dimData = PivotUtil.getDimensionLevel(dim, this.data,
163-
{ aggregations: 'aggregations', records: 'records', children: 'children', level: 'level'});
162+
const dimData = PivotUtil.getDimensionLevel(dim, this.data, this.grid.pivotKeys);
164163
dimIndex += dimData.level;
165164
currentLvl += dimData.level;
166165
const column = this.extractFromDimension(dimData.dimension, dimIndex, currentLvl, dim);
@@ -187,7 +186,7 @@ export class IgxPivotRowComponent extends IgxRowDirective implements OnChanges {
187186
ref.instance.header = header;
188187
ref.instance.width = this.grid.resolveRowDimensionWidth(rootDim) + 'px';
189188
(ref as any).instance._vIndex = this.grid.columns.length + index + this.index * this.grid.pivotConfiguration.rows.length;
190-
if (dim.childLevel && lvl >= PivotUtil.getTotalLvl(this.data)) {
189+
if (dim.childLevel && lvl >= PivotUtil.getTotalLvl(this.data, this.grid.pivotKeys)) {
191190
ref.instance.headerTemplate = this.headerTemplate;
192191
} else {
193192
ref.instance.headerTemplate = this.headerTemplateDefault;

‎projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-util.ts

Lines changed: 23 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -26,10 +26,10 @@ export class PivotUtil {
2626
this.extractValuesForRow(dimensions, rec, pivotKeys);
2727
for (const [key, val] of vals) { // this should go in depth also vals.children
2828
if (hierarchy.get(val.value) != null) {
29-
this.applyHierarchyChildren(hierarchy, val, rec, pivotKeys.records);
29+
this.applyHierarchyChildren(hierarchy, val, rec, pivotKeys);
3030
} else {
3131
hierarchy.set(val.value, cloneValue(val));
32-
this.applyHierarchyChildren(hierarchy, val, rec, pivotKeys.records);
32+
this.applyHierarchyChildren(hierarchy, val, rec, pivotKeys);
3333
}
3434
}
3535
}
@@ -91,7 +91,7 @@ export class PivotUtil {
9191
continue;
9292
}
9393
rec[field + '_' + pivotKeys.level] = currDimLvl;
94-
const expansionRowKey = PivotUtil.getRecordKey(rec, dim, prevDims);
94+
const expansionRowKey = PivotUtil.getRecordKey(rec, dim, prevDims, pivotKeys);
9595
const isExpanded = expansionStates.get(expansionRowKey) === undefined ?
9696
defaultExpandState :
9797
expansionStates.get(expansionRowKey);
@@ -243,7 +243,7 @@ export class PivotUtil {
243243
}
244244
for (const property in parentRec) {
245245
if (parentRec.hasOwnProperty(property) &&
246-
Object.keys(pivotKeys).indexOf(property) === -1) {
246+
Object.values(pivotKeys).indexOf(property) === -1) {
247247
siblingData.forEach(s => {
248248
s[property] = parentRec[property];
249249
});
@@ -347,23 +347,22 @@ export class PivotUtil {
347347
return leafs;
348348
}
349349

350-
public static getRecordKey(rec, currentDim: IPivotDimension, prevDims: IPivotDimension[]) {
350+
public static getRecordKey(rec, currentDim: IPivotDimension, prevDims: IPivotDimension[], pivotKeys: IPivotKeys) {
351351
const parentFields = [];
352352
const field = currentDim.memberName;
353353
const value = rec[field];
354354
for (const prev of prevDims) {
355-
const dimData = PivotUtil.getDimensionLevel(prev, rec,
356-
{ aggregations: 'aggregations', records: 'records', children: 'children', level: 'level' });
355+
const dimData = PivotUtil.getDimensionLevel(prev, rec, pivotKeys);
357356
parentFields.push(rec[prev.memberName] || rec[dimData.dimension.memberName]);
358357
}
359358
parentFields.push(value);
360359
return parentFields.join('_');
361360
}
362361

363-
public static getTotalLvl(rec) {
362+
public static getTotalLvl(rec, pivotKeys: IPivotKeys) {
364363
let total = 0;
365364
Object.keys(rec).forEach(key => {
366-
if (key.indexOf('_level') !== -1 && key.indexOf('level_') === -1 && key.indexOf('records') === -1) {
365+
if (key.indexOf('_' + pivotKeys.level) !== -1 && key.indexOf(pivotKeys.level + '_') === -1 && key.indexOf(pivotKeys.records) === -1) {
367366
total += rec[key] || 0;
368367
}
369368
});
@@ -408,10 +407,12 @@ export class PivotUtil {
408407
return result;
409408
}
410409

411-
private static applyHierarchyChildren(hierarchy, val, rec, recordsKey) {
412-
const childCollection = val.children;
413-
if (Array.isArray(hierarchy.get(val.value).children)) {
414-
hierarchy.get(val.value).children = new Map<string, any>();
410+
private static applyHierarchyChildren(hierarchy, val, rec, pivotKeys: IPivotKeys) {
411+
const recordsKey = pivotKeys.records;
412+
const childKey = pivotKeys.children;
413+
const childCollection = val[childKey];
414+
if (Array.isArray(hierarchy.get(val.value)[childKey])) {
415+
hierarchy.get(val.value)[childKey] = new Map<string, any>();
415416
}
416417
if (!childCollection || childCollection.size === 0) {
417418
const dim = hierarchy.get(val.value).dimension;
@@ -425,26 +426,26 @@ export class PivotUtil {
425426
}
426427
} else {
427428
for (const [key, child] of childCollection) {
428-
if (!hierarchy.get(val.value).children.get(child.value)) {
429-
hierarchy.get(val.value).children.set(child.value, child);
429+
if (!hierarchy.get(val.value)[childKey].get(child.value)) {
430+
hierarchy.get(val.value)[childKey].set(child.value, child);
430431
}
431432

432-
if (hierarchy.get(val.value).children.get(child.value)[recordsKey]) {
433+
if (hierarchy.get(val.value)[childKey].get(child.value)[recordsKey]) {
433434
const copy = Object.assign({}, rec);
434435
if (rec[recordsKey]) {
435436
// not all nested children are valid
436-
const nestedValue = hierarchy.get(val.value).children.get(child.value).value;
437-
const dimension = hierarchy.get(val.value).children.get(child.value).dimension;
437+
const nestedValue = hierarchy.get(val.value)[childKey].get(child.value).value;
438+
const dimension = hierarchy.get(val.value)[childKey].get(child.value).dimension;
438439
const validRecs = rec[recordsKey].filter(x => this.extractValueFromDimension(dimension, x) === nestedValue);
439440
copy[recordsKey] = validRecs;
440441
}
441-
hierarchy.get(val.value).children.get(child.value)[recordsKey].push(copy);
442+
hierarchy.get(val.value)[childKey].get(child.value)[recordsKey].push(copy);
442443
} else {
443-
hierarchy.get(val.value).children.get(child.value)[recordsKey] = [rec];
444+
hierarchy.get(val.value)[childKey].get(child.value)[recordsKey] = [rec];
444445
}
445446

446-
if (child.children && child.children.size > 0) {
447-
this.applyHierarchyChildren(hierarchy.get(val.value).children, child, rec, recordsKey);
447+
if (child[childKey] && child[childKey].size > 0) {
448+
this.applyHierarchyChildren(hierarchy.get(val.value)[childKey], child, rec, pivotKeys);
448449
}
449450
}
450451
}

‎src/app/pivot-grid/pivot-grid.sample.html

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
<div class="sample-flex-row">
2+
<div>
23
<igx-combo #combo class="combo" [itemsMaxHeight]="250" (selectionChanging)="handleChange($event)"
34
[data]="dimensions" [displayKey]="'memberName'" [(ngModel)]="selected"
45
placeholder="Dimension(s)" searchPlaceholder="Search...">
@@ -16,4 +17,5 @@
1617
[cellSelection]="'single'">
1718
</igx-pivot-grid>
1819
</div>
20+
</div>
1921

0 commit comments

Comments
 (0)