Skip to content

Commit 738e573

Browse files
refactor(tree-grid): replace FOODS_DATA with orders data #2941 (#3232)
1 parent a38fedb commit 738e573

72 files changed

Lines changed: 780 additions & 496 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

live-editing/configs/ExportCsvConfigGenerator.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ export class ExportCsvConfigGenerator implements IConfigGenerator {
3131

3232
configs.push(new Config({
3333
component: 'TreeGridCsvExportSample1Component',
34-
additionalFiles: ["/src/app/tree-grid/data/foods.ts"],
34+
additionalFiles: ["/src/app/tree-grid/data/orders.ts"],
3535
appModuleConfig: new AppModuleConfig({
3636
imports: ['IgxTreeGridModule', 'IgxCsvExporterService', 'TreeGridCsvExportSample1Component'],
3737
ngDeclarations: ['TreeGridCsvExportSample1Component'],

live-editing/configs/ExportExcelConfigGenerator.ts

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,8 @@ import {
1010
import { AppModuleConfig, Config, IConfigGenerator } from 'igniteui-live-editing';
1111
export class ExportExcelConfigGenerator implements IConfigGenerator {
1212
public additionalImports = {
13-
PasteHandler: '../../src/app/grid/grid-paste/paste-handler.directive'
13+
PasteHandler: '../../src/app/grid/grid-paste/paste-handler.directive',
14+
IgxPreventDocumentScrollModule: '../../src/app/directives/prevent-scroll.directive'
1415
};
1516
public generateConfigs(): Config[] {
1617
const configs = new Array<Config>();
@@ -53,12 +54,12 @@ export class ExportExcelConfigGenerator implements IConfigGenerator {
5354

5455
configs.push(new Config({
5556
component: 'TreeGridExcelExportSample1Component',
56-
additionalFiles: ['/src/app/tree-grid/data/foods.ts'],
57+
additionalFiles: ['/src/app/tree-grid/data/orders.ts', '/src/app/directives/prevent-scroll.directive.ts',],
5758
appModuleConfig: new AppModuleConfig({
5859
imports: ['IgxTreeGridModule', 'IgxExcelExporterService', 'TreeGridExcelExportSample1Component',
59-
'IgxButtonModule'],
60+
'IgxButtonModule', 'IgxPreventDocumentScrollModule'],
6061
ngDeclarations: ['TreeGridExcelExportSample1Component'],
61-
ngImports: ['IgxTreeGridModule', 'IgxButtonModule'],
62+
ngImports: ['IgxTreeGridModule', 'IgxButtonModule', 'IgxPreventDocumentScrollModule'],
6263
ngProviders: ['IgxExcelExporterService']
6364
})
6465
}));

live-editing/configs/TreeGridConfigGenerator.ts

Lines changed: 33 additions & 36 deletions
Large diffs are not rendered by default.

src/app/services/export-csv/csv-export-tree-grid-sample/csv-export-tree-grid-sample.component.html

Lines changed: 13 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -8,23 +8,24 @@
88
</igx-grid-toolbar-actions>
99
</igx-grid-toolbar>
1010

11-
<igx-column field="ID" header="Product ID" [dataType]="'string'">
11+
<igx-column field="ID" header="Order ID">
1212
</igx-column>
13-
<igx-column field="Name" header="Product Name" [dataType]="'string'">
13+
<igx-column field="Name" header="Order Product">
1414
</igx-column>
15-
<igx-column field="UnitPrice" header="Unit Price" dataType="number">
16-
<ng-template igxCell let-cell="cell" let-val>
17-
<span *ngIf="cell.row.data.UnitPrice === 0">-</span>
18-
<span *ngIf="cell.row.data.UnitPrice !== 0">${{val}}</span>
19-
</ng-template>
15+
<igx-column field="Category" header="Category">
16+
</igx-column>
17+
<igx-column field="Units" header="Units" [dataType]="'number'">
18+
</igx-column>
19+
<igx-column field="UnitPrice" header="Unit Price" [dataType]="'currency'" [pipeArgs]="formatOptions" [sortable]="false">
20+
</igx-column>
21+
<igx-column field="Price" header="Price" [dataType]="'currency'" [pipeArgs]="formatOptions" [sortable]="false">
2022
</igx-column>
21-
<igx-column field="AddedDate" header="Added Date" [dataType]="'date'">
23+
<igx-column field="OrderDate" header="Order Date" [dataType]="'date'">
2224
</igx-column>
23-
<igx-column field="Discontinued" header="Discontinued" [dataType]="'boolean'">
25+
<igx-column field="Delivered" header="Delivered" [dataType]="'boolean'">
2426
<ng-template igxCell let-cell="cell" let-val>
25-
<span *ngIf="cell.row.data.UnitPrice === 0">-</span>
26-
<img *ngIf="cell.row.data.UnitPrice !== 0 && val" src="assets/images/grid/active.png" title="Continued" alt="Continued" />
27-
<img *ngIf="cell.row.data.UnitPrice !== 0 && !val" src="assets/images/grid/expired.png" title="Discontinued" alt="Discontinued" />
27+
<img *ngIf="val" src="assets/images/grid/active.png" title="Delivered" alt="Delivered"/>
28+
<img *ngIf="!val" src="assets/images/grid/expired.png" title="Undelivered" alt="Undelivered"/>
2829
</ng-template>
2930
</igx-column>
3031
</igx-tree-grid>

src/app/services/export-csv/csv-export-tree-grid-sample/csv-export-tree-grid-sample.component.ts

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { Component, OnInit, ViewChild } from '@angular/core';
22
import { IgxTreeGridComponent } from 'igniteui-angular';
3-
import { FOODS_DATA } from '../../../tree-grid/data/foods';
3+
import { ORDERS_DATA } from '../../../tree-grid/data/orders';
44

55
@Component({
66
selector: 'app-csv-export-tree-grid-sample',
@@ -14,11 +14,17 @@ export class TreeGridCsvExportSample1Component implements OnInit {
1414

1515
public data: any[];
1616

17+
public options = {
18+
digitsInfo: '1.2-2',
19+
currencyCode: 'USD'
20+
};
21+
public formatOptions = this.options;
22+
1723
constructor() {
1824
}
1925

2026
public ngOnInit(): void {
21-
this.data = FOODS_DATA();
27+
this.data = ORDERS_DATA;
2228
}
2329

2430
/*

src/app/services/export-excel/excel-export-tree-grid-sample/excel-export-tree-grid-sample.component.html

Lines changed: 14 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<p class="grid__wrapper">
2-
<igx-tree-grid [igxPreventDocumentScroll]="true" #igxTreeGrid1 [data]="data" [autoGenerate]="false" height="280px" width="100%"
2+
<igx-tree-grid #igxTreeGrid1 [igxPreventDocumentScroll]="true" [data]="data" [autoGenerate]="false" height="280px" width="100%"
33
primaryKey="ID" foreignKey="ParentID">
44
<igx-grid-toolbar>
55
<igx-grid-toolbar-actions>
@@ -8,23 +8,24 @@
88
</igx-grid-toolbar-actions>
99
</igx-grid-toolbar>
1010

11-
<igx-column field="ID" header="Product ID" [dataType]="'string'">
11+
<igx-column field="ID" header="Order ID">
1212
</igx-column>
13-
<igx-column field="Name" header="Product Name" [dataType]="'string'">
13+
<igx-column field="Name" header="Order Product">
1414
</igx-column>
15-
<igx-column field="UnitPrice" header="Unit Price" dataType="number">
16-
<ng-template igxCell let-cell="cell" let-val>
17-
<span *ngIf="cell.row.data.UnitPrice === 0">-</span>
18-
<span *ngIf="cell.row.data.UnitPrice !== 0">${{val}}</span>
19-
</ng-template>
15+
<igx-column field="Category" header="Category">
16+
</igx-column>
17+
<igx-column field="Units" header="Units" [dataType]="'number'">
18+
</igx-column>
19+
<igx-column field="UnitPrice" header="Unit Price" [dataType]="'currency'" [pipeArgs]="formatOptions" [sortable]="false">
20+
</igx-column>
21+
<igx-column field="Price" header="Price" [dataType]="'currency'" [pipeArgs]="formatOptions" [sortable]="false">
2022
</igx-column>
21-
<igx-column field="AddedDate" header="Added Date" [dataType]="'date'">
23+
<igx-column field="OrderDate" header="Order Date" [dataType]="'date'">
2224
</igx-column>
23-
<igx-column field="Discontinued" header="Discontinued" [dataType]="'boolean'">
25+
<igx-column field="Delivered" header="Delivered" [dataType]="'boolean'">
2426
<ng-template igxCell let-cell="cell" let-val>
25-
<span *ngIf="cell.row.data.UnitPrice === 0">-</span>
26-
<img *ngIf="cell.row.data.UnitPrice !== 0 && val" src="assets/images/grid/active.png" title="Continued" alt="Continued" />
27-
<img *ngIf="cell.row.data.UnitPrice !== 0 && !val" src="assets/images/grid/expired.png" title="Discontinued" alt="Discontinued" />
27+
<img *ngIf="val" src="assets/images/grid/active.png" title="Delivered" alt="Delivered"/>
28+
<img *ngIf="!val" src="assets/images/grid/expired.png" title="Undelivered" alt="Undelivered"/>
2829
</ng-template>
2930
</igx-column>
3031
</igx-tree-grid>

src/app/services/export-excel/excel-export-tree-grid-sample/excel-export-tree-grid-sample.component.ts

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { Component, OnInit, ViewChild } from '@angular/core';
22
import { IgxTreeGridComponent } from 'igniteui-angular';
3-
import { FOODS_DATA } from '../../../tree-grid/data/foods';
3+
import { ORDERS_DATA } from '../../../tree-grid/data/orders';
44

55
@Component({
66
selector: 'app-excel-export-tree-grid-sample',
@@ -14,10 +14,17 @@ export class TreeGridExcelExportSample1Component implements OnInit {
1414

1515
public data: any[];
1616

17+
public options = {
18+
digitsInfo: '1.2-2',
19+
currencyCode: 'USD'
20+
};
21+
public formatOptions = this.options;
22+
23+
1724
constructor() { }
1825

1926
public ngOnInit(): void {
20-
this.data = FOODS_DATA();
27+
this.data = ORDERS_DATA;
2128
}
2229
/*
2330
The following code demonstrates how to attach event handlers to exporter specific events

src/app/services/localization-samples/localization-all-resources/localization-all-resources.component.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
<div class="grid__wrapper">
22
<igx-grid #grid [data]="data" [autoGenerate]="false" height="520px" width="100%"
33
[allowFiltering]="true" [locale]="locale" [rowEditable]="true" [primaryKey]="'ProductID'">
4-
<igx-column field="ProductName" header="Product Name" [dataType]="'string'" [groupable]="true">
4+
<igx-column field="ProductName" header="Product Name" [groupable]="true">
55
</igx-column>
6-
<igx-column field="QuantityPerUnit" header="Quantity Per Unit" [dataType]="'string'" [groupable]="true">
6+
<igx-column field="QuantityPerUnit" header="Quantity Per Unit" [groupable]="true">
77
</igx-column>
88
<igx-column field="UnitPrice" header="Unit Price" [sortable]="true" [hasSummary]="true"
99
[dataType]="'currency'" [groupable]="true">

src/app/services/localization-samples/localization-sample-1/localization-sample-1.component.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
<div class="grid__wrapper">
22
<igx-grid [igxPreventDocumentScroll]="true" #grid1 [data]="data" [autoGenerate]="false" height="520px" width="100%" [allowFiltering]="true">
3-
<igx-column field="ProductName" header="Product Name" [dataType]="'string'" [groupable]="true">
3+
<igx-column field="ProductName" header="Product Name" [groupable]="true">
44
</igx-column>
5-
<igx-column field="QuantityPerUnit" header="Quantity Per Unit" [dataType]="'string'" [groupable]="true">
5+
<igx-column field="QuantityPerUnit" header="Quantity Per Unit" [groupable]="true">
66
</igx-column>
77
<igx-column field="UnitPrice" header="Unit Price" dataType="number" [groupable]="true">
88
<ng-template igxCell let-cell="cell" let-val let-row>

src/app/services/localization-samples/localization-sample-2/localization-sample-2.component.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
<div class="grid__wrapper">
22
<igx-grid [igxPreventDocumentScroll]="true" #grid1 [data]="data" [autoGenerate]="false" height="520px" width="100%" [allowFiltering]="true">
3-
<igx-column field="ProductName" header="Product Name" [dataType]="'string'" [groupable]="true">
3+
<igx-column field="ProductName" header="Product Name" [groupable]="true">
44
</igx-column>
5-
<igx-column field="QuantityPerUnit" header="Quantity Per Unit" [dataType]="'string'" [groupable]="true">
5+
<igx-column field="QuantityPerUnit" header="Quantity Per Unit" [groupable]="true">
66
</igx-column>
77
<igx-column field="UnitPrice" header="Unit Price" dataType="number" [groupable]="true">
88
<ng-template igxCell let-cell="cell" let-val let-row>

0 commit comments

Comments
 (0)