Merge pull request #10655 from IgniteUI/mkirova/pivot-keys-separators

Add additional settable pivot keys: columnDimensionSeparator, rowDimensionSeparator.

Author: dkamburov

projects/igniteui-angular/src/lib/data-operations/pivot-strategy.ts

@@ -1,6 +1,6 @@
 
 import { GridType, PivotGridType } from '../grids/common/grid.interface';
-import { IPivotDimension, IPivotDimensionStrategy, IPivotKeys, IPivotValue, PivotDimensionType } from '../grids/pivot-grid/pivot-grid.interface';
+import { DEFAULT_PIVOT_KEYS, IPivotDimension, IPivotDimensionStrategy, IPivotKeys, IPivotValue, PivotDimensionType } from '../grids/pivot-grid/pivot-grid.interface';
 import { PivotUtil } from '../grids/pivot-grid/pivot-util';
 import { FilteringStrategy } from './filtering-strategy';
 import { GridColumnDataType } from './data-util';
@@ -31,8 +31,7 @@ export class PivotRowDimensionsStrategy implements IPivotDimensionStrategy {
         collection: any,
         rows: IPivotDimension[],
         values?: IPivotValue[],
-        pivotKeys: IPivotKeys =
-            { aggregations: 'aggregations', records: 'records', children: 'children', level: 'level' }
+        pivotKeys: IPivotKeys = DEFAULT_PIVOT_KEYS
     ): any[] {
         let hierarchies;
         let data;
@@ -98,7 +97,7 @@ export class PivotColumnDimensionsStrategy implements IPivotDimensionStrategy {
         collection: any[],
         columns: IPivotDimension[],
         values: IPivotValue[],
-        pivotKeys: IPivotKeys = { aggregations: 'aggregations', records: 'records', children: 'children', level: 'level' }
+        pivotKeys: IPivotKeys = DEFAULT_PIVOT_KEYS
     ): any[] {
         const res = this.processHierarchy(collection, columns, values, pivotKeys);
         return res;

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

@@ -33,7 +33,7 @@ import { IgxForOfSyncService, IgxForOfScrollSyncService } from '../../directives
 import { GridServiceType, GridType, IGX_GRID_BASE, IGX_GRID_SERVICE_BASE, RowType } from '../common/grid.interface';
 import { IgxGridCRUDService } from '../common/crud.service';
 import { IgxGridSummaryService } from '../summaries/grid-summary.service';
-import { IDimensionsChange, IPivotConfiguration, IPivotDimension, IPivotKeys, IValuesChange, PivotDimensionType } from './pivot-grid.interface';
+import { DEFAULT_PIVOT_KEYS, IDimensionsChange, IPivotConfiguration, IPivotDimension, IPivotKeys, IValuesChange, PivotDimensionType } from './pivot-grid.interface';
 import { IgxPivotHeaderRowComponent } from './pivot-header-row.component';
 import { IgxColumnGroupComponent } from '../columns/column-group.component';
 import { IgxColumnComponent } from '../columns/column.component';
@@ -294,7 +294,7 @@ export class IgxPivotGridComponent extends IgxGridBaseDirective implements OnIni
     public columnGroupStates = new Map<string, boolean>();
     public dimensionDataColumns;
     public get pivotKeys() {
-        return this.pivotConfiguration.pivotKeys || {aggregations: 'aggregations', records: 'records', children: 'children', level: 'level'};
+        return this.pivotConfiguration.pivotKeys || DEFAULT_PIVOT_KEYS;
     }
     public isPivot = true;
 
@@ -577,24 +577,24 @@ export class IgxPivotGridComponent extends IgxGridBaseDirective implements OnIni
     public getDimensionData(dim: IPivotDimension,
         dimExprTree: IFilteringExpressionsTree,
         done: (colVals: any[]) => void) {
-            let columnValues = [];
-            const data = this.gridAPI.get_data();
-            const state = {
-                expressionsTree: dimExprTree,
-                strategy: this.filterStrategy || new DimensionValuesFilteringStrategy(),
-                advancedFilteringExpressionsTree: this.advancedFilteringExpressionsTree
-            };
-            const filtered = DataUtil.filter(data, state, this);
-            const allValuesHierarchy = PivotUtil.getFieldsHierarchy(
-                filtered,
-                [dim],
-                PivotDimensionType.Column,
-                this.pivotKeys
-                );
-            const flatData = Array.from(allValuesHierarchy.values());
-            columnValues = flatData.map(record => this.extractValue(record['value']));
-            done(columnValues);
-            return;
+        let columnValues = [];
+        const data = this.gridAPI.get_data();
+        const state = {
+            expressionsTree: dimExprTree,
+            strategy: this.filterStrategy || new DimensionValuesFilteringStrategy(),
+            advancedFilteringExpressionsTree: this.advancedFilteringExpressionsTree
+        };
+        const filtered = DataUtil.filter(data, state, this);
+        const allValuesHierarchy = PivotUtil.getFieldsHierarchy(
+            filtered,
+            [dim],
+            PivotDimensionType.Column,
+            this.pivotKeys
+        );
+        const flatData = Array.from(allValuesHierarchy.values());
+        columnValues = flatData.map(record => this.extractValue(record['value']));
+        done(columnValues);
+        return;
     }
 
     /** @hidden */
@@ -695,7 +695,7 @@ export class IgxPivotGridComponent extends IgxGridBaseDirective implements OnIni
     }
 
     public resolveRowDimensionWidth(dim: IPivotDimension): number {
-        if(!dim.width) {
+        if (!dim.width) {
             return MINIMUM_COLUMN_WIDTH;
         }
         const isPercent = dim.width && dim.width.indexOf('%') !== -1;
@@ -1026,14 +1026,15 @@ export class IgxPivotGridComponent extends IgxGridBaseDirective implements OnIni
             const rowFields = PivotUtil.flatten(this.pivotConfiguration.rows).map(x => x.memberName);
             const keyFields = Object.values(this.pivotKeys);
             const filteredFields = fields.filter(x => rowFields.indexOf(x) === -1 && keyFields.indexOf(x) === -1 &&
-                x.indexOf('_level') === -1 && x.indexOf('_records') === -1);
+                x.indexOf(this.pivotKeys.rowDimensionSeparator + this.pivotKeys.level) === -1 &&
+                x.indexOf(this.pivotKeys.rowDimensionSeparator + this.pivotKeys.records) === -1);
             fieldsMap = this.generateFromData(filteredFields);
         } else {
             fieldsMap = PivotUtil.getFieldsHierarchy(
-            data,
-            this.columnDimensions,
-            PivotDimensionType.Column,
-            this.pivotKeys
+                data,
+                this.columnDimensions,
+                PivotDimensionType.Column,
+                this.pivotKeys
             );
         }
         columns = this.generateColumnHierarchy(fieldsMap, data);
@@ -1062,17 +1063,18 @@ export class IgxPivotGridComponent extends IgxGridBaseDirective implements OnIni
     }
 
     protected generateFromData(fields: string[]) {
-        const dataArr = fields.map(x => x.split('-')).sort(x => x.length);
+        const separator = this.pivotKeys.columnDimensionSeparator;
+        const dataArr = fields.map(x => x.split(separator)).sort(x => x.length);
         const hierarchy = new Map<string, any>();
         dataArr.forEach(arr => {
             let currentHierarchy = hierarchy;
             const path = [];
             for (const val of arr) {
                 path.push(val);
-                let h = currentHierarchy.get(path.join('-'));
+                let h = currentHierarchy.get(path.join(separator));
                 if (!h) {
-                    currentHierarchy.set(path.join('-'), { expandable: true, children: new Map<string, any>() });
-                    h = currentHierarchy.get(path.join('-'));
+                    currentHierarchy.set(path.join(separator), { expandable: true, children: new Map<string, any>(), dimension: this.columnDimensions[0] });
+                    h = currentHierarchy.get(path.join(separator));
                 }
                 currentHierarchy = h.children;
             }
@@ -1111,7 +1113,7 @@ export class IgxPivotGridComponent extends IgxGridBaseDirective implements OnIni
                 const ref = this.hasMultipleValues ?
                     factoryColumnGroup.create(this.viewRef.injector) :
                     factoryColumn.create(this.viewRef.injector);
-                ref.instance.header = parent != null ? key.split(parent.header + '-')[1] : key;
+                ref.instance.header = parent != null ? key.split(parent.header + this.pivotKeys.columnDimensionSeparator)[1] : key;
                 ref.instance.field = key;
                 ref.instance.parent = parent;
                 ref.instance.width = value.dimension?.width || MINIMUM_COLUMN_WIDTH + 'px';
@@ -1131,7 +1133,7 @@ export class IgxPivotGridComponent extends IgxGridBaseDirective implements OnIni
                 ref.instance.parent = parent;
                 ref.instance.field = key;
                 ref.instance.sortable = true;
-                ref.instance.header = parent != null ? key.split(parent.header + '-')[1] : key;
+                ref.instance.header = parent != null ? key.split(parent.header + this.pivotKeys.columnDimensionSeparator)[1] : key;
                 if (value.expandable) {
                     ref.instance.headerTemplate = this.headerTemplate;
                 }
@@ -1147,7 +1149,7 @@ export class IgxPivotGridComponent extends IgxGridBaseDirective implements OnIni
                     columns = columns.concat(children);
                     if (value.dimension.childLevel) {
                         const refSibling = factoryColumnGroup.create(this.viewRef.injector);
-                        refSibling.instance.header = parent != null ? key.split(parent.header + '-')[1] : key;
+                        refSibling.instance.header = parent != null ? key.split(parent.header + this.pivotKeys.columnDimensionSeparator)[1] : key;
                         refSibling.instance.field = key;
                         refSibling.instance.parent = parent;
                         ref.instance.width = value.dimension?.width || MINIMUM_COLUMN_WIDTH + 'px';
@@ -1166,7 +1168,7 @@ export class IgxPivotGridComponent extends IgxGridBaseDirective implements OnIni
                     columns = columns.concat(children);
                     if (value.dimension.childLevel) {
                         const refSibling = factoryColumn.create(this.viewRef.injector);
-                        refSibling.instance.header = parent != null ? key.split(parent.header + '-')[1] : key;
+                        refSibling.instance.header = parent != null ? key.split(parent.header + this.pivotKeys.columnDimensionSeparator)[1] : key;
                         refSibling.instance.field = key;
                         refSibling.instance.parent = parent;
                         ref.instance.width = value.dimension?.width || MINIMUM_COLUMN_WIDTH + 'px';
@@ -1190,7 +1192,7 @@ export class IgxPivotGridComponent extends IgxGridBaseDirective implements OnIni
         this.values.forEach(val => {
             const ref = colFactory.create(this.viewRef.injector);
             ref.instance.header = val.displayName || val.member;
-            ref.instance.field = parent.field + '-' + val.member;
+            ref.instance.field = parent.field + this.pivotKeys.columnDimensionSeparator + val.member;
             ref.instance.parent = parent;
             ref.instance.width = isPercent ? width + '%' : width + 'px';
             ref.instance.hidden = hidden;
@@ -1203,6 +1205,6 @@ export class IgxPivotGridComponent extends IgxGridBaseDirective implements OnIni
         return cols;
     }
     private extractValue(value) {
-        return value.split('-')[value.split('-').length - 1];
+        return value.split(this.pivotKeys.columnDimensionSeparator)[value.split(this.pivotKeys.columnDimensionSeparator).length - 1];
     }
 }

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

@@ -3,6 +3,11 @@ import { FilteringExpressionsTree } from '../../data-operations/filtering-expres
 import { SortingDirection } from '../../data-operations/sorting-strategy';
 import { ColumnType } from '../common/grid.interface';
 
+export const DEFAULT_PIVOT_KEYS = {
+    aggregations: 'aggregations', records: 'records', children: 'children', level: 'level',
+    rowDimensionSeparator: '_', columnDimensionSeparator: '-'
+};
+
 export interface IDimensionsChange {
     dimensions: IPivotDimension[],
     dimensionCollectionType: PivotDimensionType
@@ -98,6 +103,8 @@ export interface IPivotKeys {
     records: string;
     aggregations: string;
     level: string;
+    columnDimensionSeparator: string;
+    rowDimensionSeparator: string;
 }
 
 export enum PivotDimensionType {

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

@@ -3,16 +3,19 @@ import { cloneArray } from '../../core/utils';
 import { DataUtil } from '../../data-operations/data-util';
 import { FilteringExpressionsTree, IFilteringExpressionsTree } from '../../data-operations/filtering-expressions-tree';
 import { IFilteringStrategy } from '../../data-operations/filtering-strategy';
-import { IPivotConfiguration, IPivotKeys } from './pivot-grid.interface';
-import { DefaultPivotSortingStrategy, DimensionValuesFilteringStrategy, PivotColumnDimensionsStrategy,
-     PivotRowDimensionsStrategy } from '../../data-operations/pivot-strategy';
+import { DEFAULT_PIVOT_KEYS, IPivotConfiguration, IPivotKeys } from './pivot-grid.interface';
+import {
+    DefaultPivotSortingStrategy, DimensionValuesFilteringStrategy, PivotColumnDimensionsStrategy,
+    PivotRowDimensionsStrategy
+} from '../../data-operations/pivot-strategy';
 import { PivotUtil } from './pivot-util';
 import { FilteringLogic } from '../../data-operations/filtering-expression.interface';
 import { ISortingExpression, SortingDirection } from '../../data-operations/sorting-strategy';
 import { GridType } from '../common/grid.interface';
 import { GridBaseAPIService } from '../api.service';
 import { IgxGridBaseDirective } from '../grid-base.directive';
 import { IGridSortingStrategy } from '../common/strategy';
+
 /**
  * @hidden
  */
@@ -31,7 +34,7 @@ export class IgxPivotRowPipe implements PipeTransform {
         _pipeTrigger?: number,
         __?
     ): any[] {
-        const pivotKeys = config.pivotKeys || { aggregations: 'aggregations', records: 'records', children: 'children', level: 'level' };
+        const pivotKeys = config.pivotKeys || DEFAULT_PIVOT_KEYS;
         const enabledRows = config.rows.filter(x => x.enabled);
         const rowStrategy = config.rowStrategy || PivotRowDimensionsStrategy.instance();
         const data = cloneArray(collection, true);
@@ -58,7 +61,7 @@ export class IgxPivotRowExpansionPipe implements PipeTransform {
         _pipeTrigger?: number,
         __?,
     ): any[] {
-        const pivotKeys = config.pivotKeys || { aggregations: 'aggregations', records: 'records', children: 'children', level: 'level' };
+        const pivotKeys = config.pivotKeys || DEFAULT_PIVOT_KEYS;
         const enabledRows = config.rows.filter(x => x.enabled);
         const data = collection ? cloneArray(collection, true) : [];
         let totalLlv = 0;
@@ -105,7 +108,7 @@ export class IgxPivotColumnPipe implements PipeTransform {
         _pipeTrigger?: number,
         __?
     ): any[] {
-        const pivotKeys = config.pivotKeys || { aggregations: 'aggregations', records: 'records', children: 'children', level: 'level' };
+        const pivotKeys = config.pivotKeys || DEFAULT_PIVOT_KEYS;
         const enabledColumns = config.columns.filter(x => x.enabled);
         const enabledValues = config.values.filter(x => x.enabled);
 
@@ -171,7 +174,7 @@ export class IgxPivotGridColumnSortingPipe implements PipeTransform {
         expressions: ISortingExpression[],
         sorting: IGridSortingStrategy,
         pipeTrigger: number,
-        pivotKeys: IPivotKeys = { aggregations: 'aggregations', records: 'records', children: 'children', level: 'level' }
+        pivotKeys: IPivotKeys = DEFAULT_PIVOT_KEYS
     ): any[] {
         let result: any[];
 
@@ -187,7 +190,7 @@ export class IgxPivotGridColumnSortingPipe implements PipeTransform {
 /**
  * @hidden
  */
- @Pipe({
+@Pipe({
     name: 'pivotGridSort',
     pure: true
 })

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

@@ -101,7 +101,7 @@ export class IgxPivotRowComponent extends IgxRowDirective implements OnChanges {
     }
 
     public getLevel(col: IgxColumnComponent) {
-        return this.data[col.field + '_level'];
+        return this.data[col.field + this.grid.pivotKeys.rowDimensionSeparator + this.grid.pivotKeys.level];
     }
 
 
@@ -119,8 +119,7 @@ export class IgxPivotRowComponent extends IgxRowDirective implements OnChanges {
         }
         if (changes.pivotRowWidths && this.rowDimensionData) {
             for (const dim of rowDimConfig) {
-                const dimData = PivotUtil.getDimensionLevel(dim, this.data,
-                      { aggregations: 'aggregations', records: 'records', children: 'children', level: 'level'});
+                const dimData = PivotUtil.getDimensionLevel(dim, this.data, this.grid.pivotKeys);
                 const data = this.rowDimensionData.find(x => x.dimension.memberName === dimData.dimension.memberName);
                 data.column.width = this.grid.resolveRowDimensionWidth(dim) + 'px';
             }
@@ -132,7 +131,7 @@ export class IgxPivotRowComponent extends IgxRowDirective implements OnChanges {
         if (configuration.values.length === 1) {
             return configuration.values[0].styles;
         }
-        const colName = col.field.split('-');
+        const colName = col.field.split(this.grid.pivotKeys.columnDimensionSeparator);
         const measureName = colName[colName.length - 1];
         return this.grid.pivotConfiguration.values.find(v => v.member === measureName)?.styles;
     }