Sort all child data recursively.

Author: MKirova

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

@@ -33,7 +33,7 @@
         | pivotGridFilter:pivotConfiguration:filterStrategy:advancedFilteringExpressionsTree:filteringPipeTrigger:pipeTrigger
         | pivotGridRow:pivotConfiguration:expansionStates:pipeTrigger:sortingExpressions
         | pivotGridColumn:pivotConfiguration:expansionStates:pipeTrigger:sortingExpressions
-        | pivotGridColumnSort:sortingExpressions:sortStrategy:pipeTrigger:sortingExpressions
+        | pivotGridColumnSort:sortingExpressions:sortStrategy:pipeTrigger
         | pivotGridRowExpansion:pivotConfiguration:expansionStates:pipeTrigger"
             let-rowIndex="index" [igxForScrollOrientation]="'vertical'" [igxForScrollContainer]='verticalScroll'
             [igxForContainerSize]='calcHeight'

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

@@ -4,8 +4,10 @@ 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, IPivotDimension, IPivotKeys } from './pivot-grid.interface';
-import { DimensionValuesFilteringStrategy, PivotColumnDimensionsStrategy,
-     PivotRowDimensionsStrategy } from '../../data-operations/pivot-strategy';
+import {
+    DimensionValuesFilteringStrategy, PivotColumnDimensionsStrategy,
+    PivotRowDimensionsStrategy
+} from '../../data-operations/pivot-strategy';
 import { PivotUtil } from './pivot-util';
 import { FilteringLogic } from '../../data-operations/filtering-expression.interface';
 import { GridBaseAPIService, IgxGridBaseDirective } from '../hierarchical-grid/public_api';
@@ -29,18 +31,18 @@ export class IgxPivotRowPipe implements PipeTransform {
         _: Map<any, boolean>,
         _pipeTrigger?: number,
         __?,
-        pivotKeys: IPivotKeys = {aggregations: 'aggregations', records: 'records', children: 'children', level: 'level'}
+        pivotKeys: IPivotKeys = { aggregations: 'aggregations', records: 'records', children: 'children', level: 'level' }
     ): any[] {
         const enabledRows = config.rows.filter(x => x.enabled);
-        const rowStrategy = config.rowStrategy ||  PivotRowDimensionsStrategy.instance();
+        const rowStrategy = config.rowStrategy || PivotRowDimensionsStrategy.instance();
         return rowStrategy.process(collection.slice(0), enabledRows, config.values, pivotKeys);
     }
 }
 
 /**
  * @hidden
  */
- @Pipe({
+@Pipe({
     name: 'pivotGridRowExpansion',
     pure: true
 })
@@ -54,7 +56,7 @@ export class IgxPivotRowExpansionPipe implements PipeTransform {
         expansionStates: Map<any, boolean>,
         _pipeTrigger?: number,
         __?,
-        pivotKeys: IPivotKeys = {aggregations: 'aggregations', records: 'records', children: 'children', level: 'level'}
+        pivotKeys: IPivotKeys = { aggregations: 'aggregations', records: 'records', children: 'children', level: 'level' }
     ): any[] {
         const enabledRows = config.rows.filter(x => x.enabled);
         const data = collection ? collection.slice(0) : [];
@@ -99,7 +101,7 @@ export class IgxPivotColumnPipe implements PipeTransform {
         _: Map<any, boolean>,
         _pipeTrigger?: number,
         __?,
-        pivotKeys: IPivotKeys = {aggregations: 'aggregations', records: 'records', children: 'children', level: 'level'}
+        pivotKeys: IPivotKeys = { aggregations: 'aggregations', records: 'records', children: 'children', level: 'level' }
     ): any[] {
         const enabledColumns = config.columns.filter(x => x.enabled);
         const enabledValues = config.values.filter(x => x.enabled);
@@ -112,7 +114,7 @@ export class IgxPivotColumnPipe implements PipeTransform {
 /**
  * @hidden
  */
- @Pipe({
+@Pipe({
     name: 'pivotGridFilter',
     pure: true
 })
@@ -154,20 +156,25 @@ export class IgxPivotGridFilterPipe implements PipeTransform {
 /**
  * @hidden
  */
- @Pipe({
+@Pipe({
     name: 'pivotGridColumnSort',
     pure: true
 })
 export class IgxPivotGridSortingPipe implements PipeTransform {
 
-    public transform(collection: any[], expressions: ISortingExpression[], sorting: IGridSortingStrategy, pipeTrigger: number): any[] {
+    public transform(
+        collection: any[],
+        expressions: ISortingExpression[],
+        sorting: IGridSortingStrategy,
+        pipeTrigger: number,
+        pivotKeys: IPivotKeys = { aggregations: 'aggregations', records: 'records', children: 'children', level: 'level' }
+    ): any[] {
         let result: any[];
 
         if (!expressions.length) {
             result = collection;
         } else {
-            // TODO - sort recursively in all records collections.
-            result = DataUtil.sort(cloneArray(collection), expressions, sorting);
+            result = PivotUtil.sort(cloneArray(collection, true), expressions, sorting, pivotKeys);
         }
         return result;
     }

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

@@ -1,4 +1,7 @@
 import { cloneValue } from '../../core/utils';
+import { DataUtil } from '../../data-operations/data-util';
+import { ISortingExpression } from '../../data-operations/sorting-expression.interface';
+import { IGridSortingStrategy, IgxSorting } from '../../data-operations/sorting-strategy';
 import { IPivotConfiguration, IPivotDimension, IPivotKeys, IPivotValue, PivotDimensionType } from './pivot-grid.interface';
 
 export class PivotUtil {
@@ -21,6 +24,19 @@ export class PivotUtil {
         return hierarchy;
     }
 
+    public static sort(data: any[], expressions: ISortingExpression[], sorting: IGridSortingStrategy = new IgxSorting(), pivotKeys): any[] {
+        data.forEach(rec => {
+            const keys = Object.keys(rec);
+            keys.forEach(k => {
+                if (k.indexOf(pivotKeys.records) !== -1) {
+                    // sort all child record collections based on expression recursively.
+                    rec[k] = this.sort(rec[k], expressions, sorting, pivotKeys);
+                }
+            });
+        });
+        return DataUtil.sort(data, expressions, sorting);
+    }
+
     public static extractValueFromDimension(dim: IPivotDimension, recData: any) {
         return dim.memberFunction ? dim.memberFunction.call(null, recData) : recData[dim.memberName];
     }

src/app/pivot-grid-hierarchy/pivot-grid-hierarchy.sample.ts

@@ -22,28 +22,33 @@ export class PivotGridHierarchySampleComponent {
 
                 memberName: 'Product',
                 memberFunction: (data) => data.Product.Name,
-                enabled: true,
-                childLevel:
-                {
-                    memberName: 'City',
-                    memberFunction: (data) => data.Seller.City,
-                    enabled: true,
-                }
-
+                enabled: true
             }
         },
         ],
         rows: [{
             memberName: 'AllSeller',
-            memberFunction: () => 'All',
+            memberFunction: () => 'All Seller',
             enabled: true,
             childLevel:
             {
                 memberName: 'Seller',
                 memberFunction: (data) => data.Seller.Name,
                 enabled: true,
             }
-        }],
+        },
+        {
+            memberName: 'AllCity',
+            memberFunction: () => 'All City',
+            enabled: true,
+            childLevel:
+            {
+                memberName: 'City',
+                memberFunction: (data) => data.Seller.City,
+                enabled: true,
+            }
+        }
+        ],
         values: [
             {
                 member: 'NumberOfUnits',