diff --git a/live-editing/configs/GridConfigGenerator.ts b/live-editing/configs/GridConfigGenerator.ts index 2c55df305a..6d9cb51246 100644 --- a/live-editing/configs/GridConfigGenerator.ts +++ b/live-editing/configs/GridConfigGenerator.ts @@ -42,6 +42,7 @@ import { import { GridAdvancedFilteringStyleComponent } from "../../src/app/grid/grid-advanced-filtering-style/grid-advanced-filtering-style.component"; +import { GridAllDataSummaryComponent } from "../../src/app/grid/grid-allData-summary/grid-allData-summary.component"; import { GridBatchEditingSampleComponent } from "../../src/app/grid/grid-batch-editing/grid-batch-editing-sample.component"; @@ -1158,6 +1159,16 @@ export class GridConfigGenerator implements IConfigGenerator { ngProviders: [] }) })); + + configs.push(new Config({ + component: GridAllDataSummaryComponent, + additionalFiles: ["/src/app/data/nwindData.ts"], + appModuleConfig: new AppModuleConfig({ + imports: [GridAllDataSummaryComponent, IgxGridModule ], + ngDeclarations: [GridAllDataSummaryComponent], + ngImports: [IgxGridModule] + }) + })); return configs; } } diff --git a/live-editing/configs/HierarchicalGridConfigGenerator.ts b/live-editing/configs/HierarchicalGridConfigGenerator.ts index 9f76307503..803808e575 100644 --- a/live-editing/configs/HierarchicalGridConfigGenerator.ts +++ b/live-editing/configs/HierarchicalGridConfigGenerator.ts @@ -20,6 +20,7 @@ import { IgxSparklineCoreModule} from "igniteui-angular-charts/ES5/igx-sparkline import { IgxSparklineModule} from "igniteui-angular-charts/ES5/igx-sparkline-module"; import { HGridAdvancedFilteringStyleComponent } from "../../src/app/hierarchical-grid/hierarchical-grid-advanced-filtering-style/hierarchical-grid-advanced-filtering-style.component"; import { HGridAdvancedFilteringSampleComponent } from "../../src/app/hierarchical-grid/hierarchical-grid-advanced-filtering/hierarchical-grid-advanced-filtering.component"; +import { HGridAllDataSummaryComponent } from "../../src/app/hierarchical-grid/hierarchical-grid-allData-summary/hierarchical-grid-allData-summary.component"; import { HGridBatchEditingSampleComponent } from "../../src/app/hierarchical-grid/hierarchical-grid-batch-editing/hierarchical-grid-batch-editing.component"; import { HierarchicalGridWithTransactionsComponent } from "../../src/app/hierarchical-grid/hierarchical-grid-batch-editing/hierarchical-grid-transactions.component"; import { HierarchicalGridColumnHidingToolbarStyleComponent } from "../../src/app/hierarchical-grid/hierarchical-grid-column-hiding-toolbar-style/hierarchical-grid-column-hiding-toolbar-style.component"; @@ -670,6 +671,16 @@ export class HierarchicalGridConfigGenerator implements IConfigGenerator { component: HGridSelectionTemplateNumbersSampleComponent })); + configs.push(new Config({ + additionalFiles: ["/src/app/hierarchical-grid/data.ts"], + appModuleConfig: new AppModuleConfig({ + imports: [IgxHierarchicalGridModule, HGridAllDataSummaryComponent], + ngDeclarations: [HGridAllDataSummaryComponent], + ngImports: [IgxHierarchicalGridModule] + }), + component: HGridAllDataSummaryComponent + })); + return configs; } } diff --git a/live-editing/configs/TreeGridConfigGenerator.ts b/live-editing/configs/TreeGridConfigGenerator.ts index 5d0bdcbb60..64af1b800a 100644 --- a/live-editing/configs/TreeGridConfigGenerator.ts +++ b/live-editing/configs/TreeGridConfigGenerator.ts @@ -41,20 +41,18 @@ import { TreeGridAdvancedFilteringSampleComponent } from "../../src/app/tree-gri import { TreeGridAdvancedFilteringStyleComponent } from "../../src/app/tree-grid/tree-grid-advanced-filtering-style/tree-grid-advanced-filtering-style.component"; import { TreeGridCellSelectionComponent } from "../../src/app/tree-grid/tree-grid-cellSelection-sample/tree-grid-cellSelection.component"; import { TreeGridColumnResizingSampleComponent } from "../../src/app/tree-grid/tree-grid-column-resizing-sample/tree-grid-column-resizing-sample.component"; -import { TreeGridConditionalCellStyleComponent } from "../../src/app/tree-grid/tree-grid-conditional-cell-style-sample/tree-grid-conditional-cell-style-sample.component"; -import { - TreeGridConditionalRowSelectorsSampleComponent -} from "../../src/app/tree-grid/tree-grid-conditional-row-selectors/tree-grid-conditional-row-selectors.component"; // tslint:disable-next-line: ordered-imports import { TreeGridConditionalCellStyle2Component } from "../../src/app/tree-grid/tree-grid-conditional-cell-style-2/tree-grid-conditional-cell-style-2.component"; +import { TreeGridConditionalCellStyleComponent } from "../../src/app/tree-grid/tree-grid-conditional-cell-style-sample/tree-grid-conditional-cell-style-sample.component"; +import { + TreeGridConditionalRowSelectorsSampleComponent +} from "../../src/app/tree-grid/tree-grid-conditional-row-selectors/tree-grid-conditional-row-selectors.component"; import { TreeGridDisplaydensitySampleComponent } from "../../src/app/tree-grid/tree-grid-displaydensity-sample/tree-grid-displaydensity-sample.component"; import { TreeGridEditingEventsComponent } from "../../src/app/tree-grid/tree-grid-editing-events/tree-grid-editing-events.component"; import { TreeGridEditingSampleComponent } from "../../src/app/tree-grid/tree-grid-editing-sample/tree-grid-editing-sample.component"; import { TreeGridEditingStyleComponent } from "../../src/app/tree-grid/tree-grid-editing-style/tree-grid-editing-sample.component"; -import { TreeGridExternalAdvancedFilteringComponent } from "../../src/app/tree-grid/tree-grid-external-advanced-filtering/tree-grid-external-advanced-filtering.component"; -import { TreeGridExternalExcelStyleFilteringComponent } from "../../src/app/tree-grid/tree-grid-external-excel-style-filtering/tree-grid-external-excel-style-filtering.component"; import { RemoteValuesService } from "../../src/app/tree-grid/tree-grid-excel-style-filtering-load-on-demand/remoteValues.service"; import { TreeGridExcelStyleFilteringLoadOnDemandComponent } from "../../src/app/tree-grid/tree-grid-excel-style-filtering-load-on-demand/tree-grid-excel-style-filtering-load-on-demand.component"; import { @@ -69,6 +67,8 @@ import { import { TreeGridExcelStyleFilteringStyleComponent } from "../../src/app/tree-grid/tree-grid-excel-style-filtering-style/tree-grid-excel-style-filtering-style.component"; +import { TreeGridExternalAdvancedFilteringComponent } from "../../src/app/tree-grid/tree-grid-external-advanced-filtering/tree-grid-external-advanced-filtering.component"; +import { TreeGridExternalExcelStyleFilteringComponent } from "../../src/app/tree-grid/tree-grid-external-excel-style-filtering/tree-grid-external-excel-style-filtering.component"; import { TreeGridFilteringCustomSampleComponent } from "../../src/app/tree-grid/tree-grid-filtering-custom-sample/tree-grid-filtering-custom-sample.component"; import { TreeGridFilteringSampleComponent } from "../../src/app/tree-grid/tree-grid-filtering-sample/tree-grid-filtering-sample.component"; import { TreeGridFilteringStyleComponent } from "../../src/app/tree-grid/tree-grid-filtering-style/tree-grid-filtering-style.component"; @@ -108,6 +108,7 @@ import { TreeGridToolbarSample3Component } from "../../src/app/tree-grid/tree-gr import { TreeGridToolbarSample4Component } from "../../src/app/tree-grid/tree-grid-toolbar-sample-4/tree-grid-toolbar-sample-4.component"; import { TreeGridToolbarStyleComponent } from "../../src/app/tree-grid/tree-grid-toolbar-style/tree-grid-toolbar-style.component"; import { TreeGridVirtualizationSampleComponent } from "../../src/app/tree-grid/tree-grid-virtualization-sample/tree-grid-virtualization-sample.component"; +import { TreeGridAllDataSummaryComponent } from "../../src/app/tree-grid/treegrid-allData-summary/treegrid-allData-summary.component"; import { AppModuleConfig } from "./core/AppModuleConfig"; import { Config } from "./core/Config"; import { IConfigGenerator } from "./core/IConfigGenerator"; @@ -918,6 +919,18 @@ export class TreeGridConfigGenerator implements IConfigGenerator { }) })); + configs.push(new Config({ + additionalFiles: [ + "/src/app/tree-grid/data/employees-flat.ts" + ], + appModuleConfig: new AppModuleConfig({ + imports: [IgxTreeGridModule, TreeGridAllDataSummaryComponent], + ngDeclarations: [TreeGridAllDataSummaryComponent], + ngImports: [IgxTreeGridModule] + }), + component: TreeGridAllDataSummaryComponent + })); + return configs; } } diff --git a/src/app/data/nwindData.ts b/src/app/data/nwindData.ts index c4bc643821..73fa95866e 100644 --- a/src/app/data/nwindData.ts +++ b/src/app/data/nwindData.ts @@ -21,7 +21,7 @@ export const DATA: any[] = [{ UnitsInStock: 17, UnitsOnOrder: 40, ReorderLevel: 25, - Discontinued: false, + Discontinued: true, OrderDate: new Date("2003-03-17") }, { ProductID: 3, diff --git a/src/app/grid/grid-allData-summary/grid-allData-summary.component.html b/src/app/grid/grid-allData-summary/grid-allData-summary.component.html new file mode 100644 index 0000000000..d11301f11d --- /dev/null +++ b/src/app/grid/grid-allData-summary/grid-allData-summary.component.html @@ -0,0 +1,17 @@ +
+ + + + + + + + + + + + + + +
diff --git a/src/app/grid/grid-allData-summary/grid-allData-summary.component.scss b/src/app/grid/grid-allData-summary/grid-allData-summary.component.scss new file mode 100644 index 0000000000..e69de29bb2 diff --git a/src/app/grid/grid-allData-summary/grid-allData-summary.component.ts b/src/app/grid/grid-allData-summary/grid-allData-summary.component.ts new file mode 100644 index 0000000000..f1a95a0ca4 --- /dev/null +++ b/src/app/grid/grid-allData-summary/grid-allData-summary.component.ts @@ -0,0 +1,58 @@ +import { Component, OnInit, ViewChild } from "@angular/core"; +import { + IgxGridComponent, + IgxNumberSummaryOperand, + IgxSummaryResult } from "igniteui-angular"; +import { DATA } from "../../data/nwindData"; + +class DiscontinuedSummary extends IgxNumberSummaryOperand { + + constructor() { + super(); + } + + public operate(data?: any[], allData = [], fieldName = ""): IgxSummaryResult[] { + const result = []; + result.push({ + key: "products", + label: "Producs", + summaryResult: data.length + }); + result.push({ + key: "total", + label: "Total Items", + summaryResult: IgxNumberSummaryOperand.sum(data) + }); + result.push({ + key: "discontinued", + label: "Discontinued Producs", + summaryResult: allData.map(r => r["Discontinued"]).filter((rec) => rec).length + }); + result.push({ + key: "totalDiscontinued", + label: "Total Discontinued Items", + summaryResult: IgxNumberSummaryOperand.sum(allData.filter((rec) => rec["Discontinued"]).map(r => r[fieldName])) + }); + return result; + } +} +@Component({ + selector: "grid-allData-summary", + styleUrls: ["./grid-allData-summary.component.scss"], + templateUrl: "./grid-allData-summary.component.html" +}) +export class GridAllDataSummaryComponent implements OnInit { + + @ViewChild("grid1", { read: IgxGridComponent, static: true }) + public grid1: IgxGridComponent; + public discontinuedSummary = DiscontinuedSummary; + public data; + + constructor() { + this.data = DATA; + } + + public ngOnInit() { + } + +} diff --git a/src/app/grid/grid-routes-data.ts b/src/app/grid/grid-routes-data.ts index c9ed90bec0..f477c8b778 100644 --- a/src/app/grid/grid-routes-data.ts +++ b/src/app/grid/grid-routes-data.ts @@ -86,6 +86,7 @@ export const gridsRoutesData = { { displayName: "Grid Excel Style Filtering Load On Demand", parentName: "Grid" }, "grid-conditional-row-selectors": { displayName: "Grid Conditional Row Selectors", parentName: "Grid" }, "grid-dynamic-chart-data": { displayName: "Grid Dynamic Chart Data", parentName: "Grid" }, - "grid-master-detail": { displayName: "Grid Master Detail", parentName: "Grid" }, - "grid-multiple-row-drag": { displayName: "Grid Multi Row Drag", parentName: "Grid"} + "grid-multiple-row-drag": { displayName: "Grid Multi Row Drag", parentName: "Grid"}, + "grid-alldata-summaries": {displayName: "Grid AllData Summaries", parentName: "Grid"}, + "grid-master-detail": { displayName: "Grid Master Detail", parentName: "Grid" } }; diff --git a/src/app/grid/grids-routing.module.ts b/src/app/grid/grids-routing.module.ts index fcc47293f1..783d7095c3 100644 --- a/src/app/grid/grids-routing.module.ts +++ b/src/app/grid/grids-routing.module.ts @@ -76,6 +76,7 @@ import { GridMultiColumnHeadersComponent } from "./multi-column-headers/multi-co import { CustomGridPagingStyleSample } from "./custom-grid-paging-style/custom-grid-paging-style.component"; import { GridAdvancedFilteringSampleComponent } from "./grid-advanced-filtering-sample/grid-advanced-filtering-sample.component"; import { GridAdvancedFilteringStyleComponent } from "./grid-advanced-filtering-style/grid-advanced-filtering-style.component"; +import { GridAllDataSummaryComponent } from "./grid-allData-summary/grid-allData-summary.component"; import { GridCellSelectionComponent } from "./grid-cellSelection-sample/grid-cellSelection.component"; import { GridConditionalRowSelectorsComponent @@ -516,6 +517,11 @@ export const gridsRoutes: Routes = [ data: gridsRoutesData["grid-dynamic-chart-data"], path: "grid-dynamic-chart-data" }, + { + component: GridAllDataSummaryComponent, + data: gridsRoutesData["grid-alldata-summaries"], + path: "grid-alldata-summaries" + }, { component: GridMasterDetailSampleComponent, data: gridsRoutesData["grid-master-detail"], diff --git a/src/app/grid/grids.module.ts b/src/app/grid/grids.module.ts index 77f13c1e15..ad92c30da7 100644 --- a/src/app/grid/grids.module.ts +++ b/src/app/grid/grids.module.ts @@ -41,6 +41,7 @@ import { IgxSparklineModule } from "igniteui-angular-charts/ES5/igx-sparkline-mo import { CustomGridPagingStyleSample } from "./custom-grid-paging-style/custom-grid-paging-style.component"; import { GridAdvancedFilteringSampleComponent } from "./grid-advanced-filtering-sample/grid-advanced-filtering-sample.component"; import { GridAdvancedFilteringStyleComponent } from "./grid-advanced-filtering-style/grid-advanced-filtering-style.component"; +import { GridAllDataSummaryComponent } from "./grid-allData-summary/grid-allData-summary.component"; import { GridBatchEditingSampleComponent } from "./grid-batch-editing/grid-batch-editing-sample.component"; import { GridWithTransactionsComponent } from "./grid-batch-editing/grid-transaction.component"; import { GridComponent } from "./grid-boston-marathon/grid.component"; @@ -223,8 +224,9 @@ import { DataService } from "./services/data.service"; GridMultipleRowDragComponent, ChartHostDirective, ChartArgsPipe, - GridMasterDetailSampleComponent, - GridExternalAdvancedFilteringComponent + GridExternalAdvancedFilteringComponent, + GridAllDataSummaryComponent, + GridMasterDetailSampleComponent ], imports: [ CommonModule, diff --git a/src/app/hierarchical-grid/hierarchical-grid-allData-summary/hierarchical-grid-allData-summary.component.html b/src/app/hierarchical-grid/hierarchical-grid-allData-summary/hierarchical-grid-allData-summary.component.html new file mode 100644 index 0000000000..7e3b0d30ea --- /dev/null +++ b/src/app/hierarchical-grid/hierarchical-grid-allData-summary/hierarchical-grid-allData-summary.component.html @@ -0,0 +1,29 @@ +
+ + + + +
+ +
+ + + + + + + + + + + + + + + + + + + +
\ No newline at end of file diff --git a/src/app/hierarchical-grid/hierarchical-grid-allData-summary/hierarchical-grid-allData-summary.component.scss b/src/app/hierarchical-grid/hierarchical-grid-allData-summary/hierarchical-grid-allData-summary.component.scss new file mode 100644 index 0000000000..e69de29bb2 diff --git a/src/app/hierarchical-grid/hierarchical-grid-allData-summary/hierarchical-grid-allData-summary.component.ts b/src/app/hierarchical-grid/hierarchical-grid-allData-summary/hierarchical-grid-allData-summary.component.ts new file mode 100644 index 0000000000..519cd51702 --- /dev/null +++ b/src/app/hierarchical-grid/hierarchical-grid-allData-summary/hierarchical-grid-allData-summary.component.ts @@ -0,0 +1,73 @@ +import { Component, OnInit, ViewChild } from "@angular/core"; +import { IgxHierarchicalGridComponent, + IgxNumberSummaryOperand, + IgxSummaryOperand, + IgxSummaryResult } from "igniteui-angular"; +import { SINGERS } from "../data"; + +class CustomNumberSummary extends IgxNumberSummaryOperand { + + constructor() { + super(); + } + + public operate(data?: any[]): IgxSummaryResult[] { + const result = super.operate(data); + result.pop(); + result.pop(); + return result; + } +} + +class GrammySummary extends IgxSummaryOperand { + + constructor() { + super(); + } + + public operate(data?: any[], allData = [], fieldName = ""): IgxSummaryResult[] { + const result = []; + result.push({ + key: "nominatedSingers", + label: "Nominated Singers", + summaryResult: allData.filter((rec) => rec["GrammyNominations"] > 0).length + }); + result.push({ + key: "singersWithAwards", + label: "Singers with Awards", + summaryResult: allData.filter((rec) => rec["GrammyAwards"] > 0).length + }); + result.push({ + key: "nominations", + label: "Total Nominations", + summaryResult: IgxNumberSummaryOperand.sum(allData.map(r => r["GrammyNominations"])) + }); + result.push({ + key: "awards", + label: "Total Awards", + summaryResult: IgxNumberSummaryOperand.sum(allData.map(r => r["GrammyAwards"])) + }); + return result; + } +} + +@Component({ + selector: "hierarchical-grid-allData-summary", + styleUrls: ["./hierarchical-grid-allData-summary.component.scss"], + templateUrl: "hierarchical-grid-allData-summary.component.html" +}) + +export class HGridAllDataSummaryComponent implements OnInit { + public localdata; + public grammySummary = GrammySummary; + public numberSummary = CustomNumberSummary; + + @ViewChild("hierarchicalGrid", { static: true }) + private hierarchicalGrid: IgxHierarchicalGridComponent; + + constructor() {} + + public ngOnInit(): void { + this.localdata = SINGERS; + } +} diff --git a/src/app/hierarchical-grid/hierarchical-grid-routes-data.ts b/src/app/hierarchical-grid/hierarchical-grid-routes-data.ts index 0f09c25644..e8200dea07 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-routes-data.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-routes-data.ts @@ -54,5 +54,6 @@ export const hierarchicalGridRoutesData = { "hierarchical-grid-advanced-filtering": { displayName: "Hierarchical Grid Advanced Filtering", parentName: "Hierarchical Grid" }, "hierarchical-grid-advanced-filtering-style": { displayName: "Hierarchical Grid Advanced Filtering Style", parentName: "Hierarchical Grid" }, "hierarchical-grid-filtering-style": { displayName: "HGrid Filtering Style", parentName: "Hierarchical Grid" }, - "hierarchical-grid-conditional-row-selectors": { displayName: "HGrid Conditional Row Selectors", parentName: "Hierarchical Grid" } + "hierarchical-grid-conditional-row-selectors": { displayName: "HGrid Conditional Row Selectors", parentName: "Hierarchical Grid" }, + "hierarchical-grid-allData-summary": {displayName: "HGrid All Data Custom Summaries", parentName: "Hierarchical Grid"} }; diff --git a/src/app/hierarchical-grid/hierarchical-grid-routing.module.ts b/src/app/hierarchical-grid/hierarchical-grid-routing.module.ts index 9c42eea218..cf016b65d7 100644 --- a/src/app/hierarchical-grid/hierarchical-grid-routing.module.ts +++ b/src/app/hierarchical-grid/hierarchical-grid-routing.module.ts @@ -4,6 +4,7 @@ import { RouterModule, Routes } from "@angular/router"; import { HGridAdvancedFilteringStyleComponent } from "./hierarchical-grid-advanced-filtering-style/hierarchical-grid-advanced-filtering-style.component"; import { HGridAdvancedFilteringSampleComponent } from "./hierarchical-grid-advanced-filtering/hierarchical-grid-advanced-filtering.component"; +import { HGridAllDataSummaryComponent } from "./hierarchical-grid-allData-summary/hierarchical-grid-allData-summary.component"; import { HGridBatchEditingSampleComponent } from "./hierarchical-grid-batch-editing/hierarchical-grid-batch-editing.component"; import { HierarchicalGridColumnHidingToolbarStyleComponent } from "./hierarchical-grid-column-hiding-toolbar-style/hierarchical-grid-column-hiding-toolbar-style.component"; import { HGridCostumHidingSampleComponent } from "./hierarchical-grid-column-hiding/hierarchical-grid-custom-hiding.component"; @@ -384,6 +385,11 @@ export const hierarchicalGridRoutes: Routes = [ component: HGridConditionalRowSelectorsComponent, data: hierarchicalGridRoutesData["hierarchical-grid-conditional-row-selectors"], path: "hierarchical-grid-conditional-row-selectors" + }, + { + component: HGridAllDataSummaryComponent, + data: hierarchicalGridRoutesData["hierarchical-grid-allData-summary"], + path: "hierarchical-grid-allData-summary" } ]; diff --git a/src/app/hierarchical-grid/hierarchical-grid.module.ts b/src/app/hierarchical-grid/hierarchical-grid.module.ts index 19f142404e..22351a1f4e 100644 --- a/src/app/hierarchical-grid/hierarchical-grid.module.ts +++ b/src/app/hierarchical-grid/hierarchical-grid.module.ts @@ -12,6 +12,7 @@ import { IgxSparklineCoreModule } from "igniteui-angular-charts/ES5/igx-sparklin import { IgxSparklineModule } from "igniteui-angular-charts/ES5/igx-sparkline-module"; import { HGridAdvancedFilteringStyleComponent } from "./hierarchical-grid-advanced-filtering-style/hierarchical-grid-advanced-filtering-style.component"; import { HGridAdvancedFilteringSampleComponent } from "./hierarchical-grid-advanced-filtering/hierarchical-grid-advanced-filtering.component"; +import { HGridAllDataSummaryComponent } from "./hierarchical-grid-allData-summary/hierarchical-grid-allData-summary.component"; import { HGridBatchEditingSampleComponent } from "./hierarchical-grid-batch-editing/hierarchical-grid-batch-editing.component"; import { HierarchicalGridWithTransactionsComponent } from "./hierarchical-grid-batch-editing/hierarchical-grid-transactions.component"; import { HierarchicalGridColumnHidingToolbarStyleComponent } from "./hierarchical-grid-column-hiding-toolbar-style/hierarchical-grid-column-hiding-toolbar-style.component"; @@ -127,7 +128,8 @@ import { HGridToolbarTitleSampleComponent } from "./hierarchical-grid-toolbar/hi HGridStylingComponent, HGridConditionalRowSelectorsComponent, HGridExternalAdvancedFilteringComponent, - HGridExternalExcelStyleFilteringComponent + HGridExternalExcelStyleFilteringComponent, + HGridAllDataSummaryComponent ], imports: [ CommonModule, diff --git a/src/app/tree-grid/tree-grid-routes-data.ts b/src/app/tree-grid/tree-grid-routes-data.ts index c4817c0eb1..d28736ad1c 100644 --- a/src/app/tree-grid/tree-grid-routes-data.ts +++ b/src/app/tree-grid/tree-grid-routes-data.ts @@ -92,5 +92,6 @@ export const treeGridRoutesData = { "treegrid-cell-selection": { displayName: "TreeGrid Cell Selection", parentName: "TreeGrid" }, "treegrid-conditional-row-selectors": { displayName: "TreeGrid Conditional Row Selectors", parentName: "TreeGrid" }, "treegrid-style": { displayName: "TreeGrid Style", parentName: "TreeGrid" }, - "tree-grid-cell-cellStyling": { displayName: "TreeGrid Conditional Cell Styling", parentName: "TreeGrid" } + "tree-grid-cell-cellStyling": { displayName: "TreeGrid Conditional Cell Styling", parentName: "TreeGrid" }, + "tree-grid-allData-summary": { displayName: "TreeGrid All Data Custom Summaries", parentName: "TreeGrid" } }; diff --git a/src/app/tree-grid/tree-grid-routing.module.ts b/src/app/tree-grid/tree-grid-routing.module.ts index 25f33e7143..cd9062117e 100644 --- a/src/app/tree-grid/tree-grid-routing.module.ts +++ b/src/app/tree-grid/tree-grid-routing.module.ts @@ -151,6 +151,7 @@ import { TreeGridToolbarStyleComponent } from "./tree-grid-toolbar-style/tree-gr import { TreeGridVirtualizationSampleComponent } from "./tree-grid-virtualization-sample/tree-grid-virtualization-sample.component"; +import { TreeGridAllDataSummaryComponent } from "./treegrid-allData-summary/treegrid-allData-summary.component"; export const treeGridRoutes: Routes = [ { @@ -487,6 +488,11 @@ export const treeGridRoutes: Routes = [ component: TreeGridConditionalCellStyle2Component, data: treeGridRoutesData["tree-grid-cell-cellStyling"], path: "tree-grid-cell-cellStyling" + }, + { + component: TreeGridAllDataSummaryComponent, + data: treeGridRoutesData["tree-grid-allData-summary"], + path: "tree-grid-allData-summary" } ]; diff --git a/src/app/tree-grid/tree-grid.module.ts b/src/app/tree-grid/tree-grid.module.ts index 9d50435763..0389b48510 100644 --- a/src/app/tree-grid/tree-grid.module.ts +++ b/src/app/tree-grid/tree-grid.module.ts @@ -178,6 +178,7 @@ import { TreeGridToolbarStyleComponent } from "./tree-grid-toolbar-style/tree-gr import { TreeGridVirtualizationSampleComponent } from "./tree-grid-virtualization-sample/tree-grid-virtualization-sample.component"; +import { TreeGridAllDataSummaryComponent } from "./treegrid-allData-summary/treegrid-allData-summary.component"; @NgModule({ declarations: [ TreeGridChilddatakeySampleComponent, @@ -248,7 +249,8 @@ import { TreeGridStyleComponent, TreeGridExternalExcelStyleFilteringComponent, TreeGridExternalAdvancedFilteringComponent, - TreeGridConditionalCellStyle2Component + TreeGridConditionalCellStyle2Component, + TreeGridAllDataSummaryComponent ], imports: [ CommonModule, diff --git a/src/app/tree-grid/treegrid-allData-summary/treegrid-allData-summary.component.html b/src/app/tree-grid/treegrid-allData-summary/treegrid-allData-summary.component.html new file mode 100644 index 0000000000..f597f198e1 --- /dev/null +++ b/src/app/tree-grid/treegrid-allData-summary/treegrid-allData-summary.component.html @@ -0,0 +1,12 @@ +
+
+ + + + + + + +
+
\ No newline at end of file diff --git a/src/app/tree-grid/treegrid-allData-summary/treegrid-allData-summary.component.scss b/src/app/tree-grid/treegrid-allData-summary/treegrid-allData-summary.component.scss new file mode 100644 index 0000000000..e69de29bb2 diff --git a/src/app/tree-grid/treegrid-allData-summary/treegrid-allData-summary.component.ts b/src/app/tree-grid/treegrid-allData-summary/treegrid-allData-summary.component.ts new file mode 100644 index 0000000000..b5ae419e72 --- /dev/null +++ b/src/app/tree-grid/treegrid-allData-summary/treegrid-allData-summary.component.ts @@ -0,0 +1,64 @@ +import { Component, OnInit, ViewChild } from "@angular/core"; +import { IgxSummaryOperand, IgxSummaryResult, IgxTreeGridComponent } from "igniteui-angular"; +import { generateEmployeeFlatData } from "../data/employees-flat"; + +class PTOSummary extends IgxSummaryOperand { + + constructor() { + super(); + } + + public operate(data?: any[], allData = [], fieldName = ""): IgxSummaryResult[] { + const result = []; + result.push({ + key: "totalOnPTO", label: "Employees On PTO", + summaryResult: IgxSummaryOperand.count(allData.filter((rec) => rec["OnPTO"]).map(r => r[fieldName])) + }); + result.push({ + key: "devs", label: "Developers", + summaryResult: IgxSummaryOperand.count( + allData.filter((rec) => rec[fieldName].includes("Developer") && rec["OnPTO"]).map(r => r[fieldName])) + }); + result.push({ + key: "tl", label: "Team Leads", + summaryResult: IgxSummaryOperand.count( + allData.filter((rec) => rec[fieldName].includes("Team Lead") && rec["OnPTO"]).map(r => r[fieldName])) + }); + result.push({ + key: "managers", label: "Managers/Directors", + summaryResult: IgxSummaryOperand.count( + allData.filter((rec) => + (rec[fieldName].includes("Manager") || rec[fieldName].includes("Director")) && rec["OnPTO"]) + .map(r => r[fieldName])) + }); + result.push({ + key: "ceo", label: "CEO/President", + summaryResult: IgxSummaryOperand.count( + allData.filter((rec) => + (rec[fieldName].includes("CEO") || rec[fieldName].includes("President")) && rec["OnPTO"]) + .map(r => r[fieldName])) + }); + return result; + } +} + +@Component({ + selector: "treegrid-allData-summary-sample", + styleUrls: ["./treegrid-allData-summary.component.scss"], + templateUrl: "./treegrid-allData-summary.component.html" +}) +export class TreeGridAllDataSummaryComponent implements OnInit { + + @ViewChild("treegrid1", { read: IgxTreeGridComponent, static: true }) + public grid1: IgxTreeGridComponent; + public data; + public d; + public ptoSummary = PTOSummary; + + constructor() { } + + public ngOnInit() { + this.data = generateEmployeeFlatData(); + this.data.forEach(rec => rec.Title = rec.Title.includes("Localiza") ? "Software Developer" : rec.Title); + } +}