Skip to content

Commit

Permalink
Merge branch 'master' of https://github.com/IgniteUI/igniteui-angular …
Browse files Browse the repository at this point in the history 
…into ddincheva/percentTypeCol
  • Loading branch information
@ddincheva
ddincheva committed Feb 15, 2021
2 parents 563d88e + 8204afb commit 9106d80
Show file tree
Hide file tree
Showing 26 changed files with 1,602 additions and 1,578 deletions.
1 change: 1 addition & 0 deletions CHANGELOG.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ All notable changes for each version of this project will be documented in this
- Added support for exporting grouped data.
- `IgxGrid`, `IgxTreeGrid`, `IgxHierarchicalGrid`
- Support for `currency` type columns is added in the grid.
- Added support for filtering based on the formatted cell values using the `FormattedValuesFilteringStrategy` for `IgxGrid`/`IgxHierarchicalGrid` and `TreeGridFormattedValuesFilteringStrategy` for `IgxTreeGrid`.
- `IgxPaginator`
- `paging` and `pagingDone` events are now emitted.
- `IgxInput` now supports `type="file"` and its styling upon all themes.
Expand Down
2,505 changes: 1,130 additions & 1,375 deletions package-lock.json
View file

Large diffs are not rendered by default.

42 changes: 21 additions & 21 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,22 +46,22 @@
},
"private": true,
"dependencies": {
"@angular/animations": "^11.1.0",
"@angular/common": "^11.1.0",
"@angular/compiler": "^11.1.0",
"@angular/core": "^11.1.0",
"@angular/forms": "^11.1.0",
"@angular/platform-browser": "^11.1.0",
"@angular/platform-browser-dynamic": "^11.1.0",
"@angular/router": "^11.1.0",
"@angular/animations": "^11.2.0",
"@angular/common": "^11.2.0",
"@angular/compiler": "^11.2.0",
"@angular/core": "^11.2.0",
"@angular/forms": "^11.2.0",
"@angular/platform-browser": "^11.2.0",
"@angular/platform-browser-dynamic": "^11.2.0",
"@angular/router": "^11.2.0",
"@igniteui/material-icons-extended": "^2.4.0",
"@types/hammerjs": "^2.0.36",
"@types/source-map": "0.5.2",
"classlist.js": "^1.1.20150312",
"core-js": "^2.6.11",
"hammerjs": "^2.0.8",
"igniteui-trial-watermark": "^1.0.3",
"jszip": "^3.5.0",
"jszip": "^3.6.0",
"lodash.mergewith": "^4.6.2",
"resize-observer-polyfill": "^1.5.1",
"rxjs": "^6.6.3",
Expand All @@ -72,27 +72,27 @@
"zone.js": "~0.10.3"
},
"devDependencies": {
"@angular-devkit/build-angular": "~0.1101.1",
"@angular-devkit/schematics": "^11.1.1",
"@angular-devkit/build-angular": "~0.1102.0",
"@angular-devkit/schematics": "^11.2.0",
"@angular-eslint/builder": "1.1.0",
"@angular-eslint/eslint-plugin": "1.1.0",
"@angular-eslint/eslint-plugin-template": "1.1.0",
"@angular-eslint/schematics": "^1.1.0",
"@angular-eslint/schematics": "^1.2.0",
"@angular-eslint/template-parser": "1.1.0",
"@angular/cli": "~11.1.1",
"@angular/compiler-cli": "^11.1.0",
"@angular/language-service": "^11.1.0",
"@angular/cli": "~11.2.0",
"@angular/compiler-cli": "^11.2.0",
"@angular/language-service": "^11.2.0",
"@angularclass/hmr": "^2.1.3",
"@types/jasmine": "^3.3.16",
"@types/jasminewd2": "^2.0.8",
"@types/node": "^12.12.39",
"@types/node": "^12.20.0",
"@types/webpack-env": "^1.15.2",
"@typescript-eslint/eslint-plugin": "4.3.0",
"@typescript-eslint/parser": "4.3.0",
"browser-sync": "^2.26.12",
"codelyzer": "^6.0.0",
"coveralls": "^3.1.0",
"eslint": "^7.6.0",
"eslint": "^7.20.0",
"eslint-plugin-import": "2.22.1",
"eslint-plugin-jsdoc": "30.7.6",
"eslint-plugin-prefer-arrow": "1.2.2",
Expand Down Expand Up @@ -121,20 +121,20 @@
"karma-junit-reporter": "~2.0.1",
"karma-spec-reporter": "~0.0.32",
"lunr": "^2.3.8",
"ng-packagr": "^11.0.3",
"ng-packagr": "^11.2.1",
"pngcrush": "^2.0.1",
"protractor": "~7.0.0",
"sass-true": "^5.0.0",
"sassdoc": "^2.7.3",
"sassdoc-plugin-localization": "^1.4.1",
"stylelint": "^11.1.1",
"stylelint-scss": "^3.17.2",
"stylelint": "^13.10.0",
"stylelint-scss": "^3.19.0",
"themeleon": "^3.0.2",
"ts-node": "~7.0.1",
"tslint": "~6.1.0",
"typedoc": "^0.17.7",
"typedoc-plugin-localization": "^2.2.1",
"typescript": "~4.0.2",
"typescript": "^4.0.7",
"webpack-sources": "1.3.0"
}
}
38 changes: 33 additions & 5 deletions projects/igniteui-angular/src/lib/data-operations/filtering-strategy.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,15 +19,15 @@ export class NoopFilteringStrategy implements IFilteringStrategy {
return this._instance || (this._instance = new NoopFilteringStrategy());
}

public filter(data: any[], expressionsTree: IFilteringExpressionsTree, advancedExpressionsTree?: IFilteringExpressionsTree): any[] {
public filter(data: any[], _: IFilteringExpressionsTree, __?: IFilteringExpressionsTree): any[] {
return data;
}
}

export abstract class BaseFilteringStrategy implements IFilteringStrategy {
public findMatchByExpression(rec: any, expr: IFilteringExpression, isDate?: boolean): boolean {
public findMatchByExpression(rec: any, expr: IFilteringExpression, isDate?: boolean, grid?: GridType): boolean {
const cond = expr.condition;
const val = this.getFieldValue(rec, expr.fieldName, isDate);
const val = this.getFieldValue(rec, expr.fieldName, isDate, grid);
return cond.logic(val, expr.searchVal, expr.ignoreCase);
}

Expand Down Expand Up @@ -61,7 +61,7 @@ export abstract class BaseFilteringStrategy implements IFilteringStrategy {
const expression = expressions as IFilteringExpression;
const isDate = grid && grid.getColumnByName(expression.fieldName) ?
grid.getColumnByName(expression.fieldName).dataType === DateType : false;
return this.findMatchByExpression(rec, expression, isDate);
return this.findMatchByExpression(rec, expression, isDate, grid);
}
}

Expand All @@ -71,7 +71,7 @@ export abstract class BaseFilteringStrategy implements IFilteringStrategy {
public abstract filter(data: any[], expressionsTree: IFilteringExpressionsTree,
advancedExpressionsTree?: IFilteringExpressionsTree, grid?: GridType): any[];

protected abstract getFieldValue(rec: any, fieldName: string, isDate: boolean): any;
protected abstract getFieldValue(rec: any, fieldName: string, isDate?: boolean, grid?: GridType): any;
}

export class FilteringStrategy extends BaseFilteringStrategy {
Expand All @@ -91,6 +91,7 @@ export class FilteringStrategy extends BaseFilteringStrategy {
let rec;
const len = data.length;
const res: T[] = [];

if ((FilteringExpressionsTree.empty(expressionsTree) && FilteringExpressionsTree.empty(advancedExpressionsTree)) || !len) {
return data;
}
Expand All @@ -109,3 +110,30 @@ export class FilteringStrategy extends BaseFilteringStrategy {
return value;
}
}
export class FormattedValuesFilteringStrategy extends FilteringStrategy {
/**
* Creates a new instance of FormattedValuesFilteringStrategy.
*
* @param fields An array of column field names that should be formatted.
* If omitted the values of all columns which has formatter will be formatted.
*/
constructor(private fields?: string[]) {
super();
}

/** @hidden */
public shouldApplyFormatter(fieldName: string): boolean {
return !this.fields || this.fields.length === 0 || this.fields.some(f => f === fieldName);
}

protected getFieldValue(rec: any, fieldName: string, isDate: boolean = false, grid?: GridType): any {
const column = grid.getColumnByName(fieldName);
let value = resolveNestedPath(rec, fieldName);

value = column.formatter && this.shouldApplyFormatter(fieldName) ?
column.formatter(value) :
value && isDate ? parseDate(value) : value;

return value;
}
}
11 changes: 11 additions & 0 deletions projects/igniteui-angular/src/lib/grids/api.service.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -605,6 +605,17 @@ export class GridBaseAPIService <T extends IgxGridBaseDirective & GridType> {
public remove_grouping_expression(fieldName) {
}

public filterDataByExpressions(expressionsTree: IFilteringExpressionsTree): any[] {
let data = this.get_all_data();

if (expressionsTree.filteringOperands.length) {
const state = { expressionsTree, strategy: this.grid.filterStrategy };
data = DataUtil.filter(cloneArray(data), state, this.grid);
}

return data;
}

/**
* Updates related row of provided grid's data source with provided new row value
*
Expand Down
56 changes: 33 additions & 23 deletions ...iteui-angular/src/lib/grids/filtering/excel-style/grid.excel-style-filtering.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,15 +19,17 @@ import {
import { IgxOverlayService } from '../../../services/public_api';
import { IgxFilteringService, ExpressionUI } from '../grid-filtering.service';
import { FilteringExpressionsTree, IFilteringExpressionsTree } from '../../../data-operations/filtering-expressions-tree';
import { cloneArray, KEYS, resolveNestedPath, parseDate, uniqueDates } from '../../../core/utils';
import { DataType, DataUtil } from '../../../data-operations/data-util';
import { KEYS, resolveNestedPath, parseDate, uniqueDates } from '../../../core/utils';
import { DataType } from '../../../data-operations/data-util';
import { Subscription, Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
import { IgxColumnComponent } from '../../columns/column.component';
import { IgxGridBaseDirective } from '../../grid-base.directive';
import { DisplayDensity } from '../../../core/density';
import { GridSelectionMode } from '../../common/enums';
import { GridBaseAPIService } from '../../api.service';
import { FormattedValuesFilteringStrategy } from '../../../data-operations/filtering-strategy';
import { TreeGridFormattedValuesFilteringStrategy } from '../../tree-grid/tree-grid.filtering.strategy';
import { getLocaleCurrencyCode } from '@angular/common';

/**
Expand Down Expand Up @@ -536,22 +538,28 @@ export class IgxGridExcelStyleFilteringComponent implements OnDestroy {
});
}

private shouldFormatValues() {
return this.column.formatter &&
(this.grid.filterStrategy instanceof FormattedValuesFilteringStrategy ||
this.grid.filterStrategy instanceof TreeGridFormattedValuesFilteringStrategy) &&
this.grid.filterStrategy.shouldApplyFormatter(this.column.field);
}

private renderColumnValuesFromData() {
let data = this.column.gridAPI.get_all_data((this.grid as any).id);
const expressionsTree = this.getColumnFilterExpressionsTree();
const data = this.column.gridAPI.filterDataByExpressions(expressionsTree);

if (expressionsTree.filteringOperands.length) {
const state = { expressionsTree };
data = DataUtil.filter(cloneArray(data), state, this.grid);
}

const shouldFormatValues = this.shouldFormatValues();
const columnField = this.column.field;
const columnValues = (this.column.dataType === DataType.Date) ?
data.map(record => {
const value = (resolveNestedPath(record, columnField));
const label = this.getFilterItemLabel(value);
return { label, value };
}) : data.map(record => resolveNestedPath(record, columnField));
}) : data.map(record => {
const value = resolveNestedPath(record, columnField);
return shouldFormatValues ? this.column.formatter(value) : value;
});

this.renderValues(columnValues);
}
Expand Down Expand Up @@ -675,6 +683,8 @@ export class IgxGridExcelStyleFilteringComponent implements OnDestroy {
this.containsNullOrEmpty = false;
this.selectAllIndeterminate = false;

const applyFormatter = !this.shouldFormatValues();

this.uniqueValues.forEach(element => {
const hasValue = (element !== undefined && element !== null && element !== '' && this.column.dataType !== DataType.Date)
|| !!(element && element.label);
Expand All @@ -701,7 +711,7 @@ export class IgxGridExcelStyleFilteringComponent implements OnDestroy {
}

filterListItem.value = this.getFilterItemValue(element);
filterListItem.label = this.getFilterItemLabel(element);
filterListItem.label = this.getFilterItemLabel(element, applyFormatter);
filterListItem.indeterminate = false;
this.listData.push(filterListItem);
}
Expand Down Expand Up @@ -760,31 +770,31 @@ export class IgxGridExcelStyleFilteringComponent implements OnDestroy {
}
}

private getFilterItemLabel(element: any) {
private getFilterItemLabel(element: any, applyFormatter: boolean = true) {
if (this.column.dataType === DataType.Date) {
return element && element.label ? element.label : this.column.formatter ?
this.column.formatter(element) :
applyFormatter ? this.column.formatter(element) : element :
this.grid.datePipe.transform(element, this.column.pipeArgs.format, this.column.pipeArgs.timezone,
this.grid.locale);
}
if (this.column.dataType === DataType.Number) {
return this.column.formatter ?
this.column.formatter(element) :
applyFormatter ? this.column.formatter(element) : element :
this.grid.decimalPipe.transform(element, this.column.pipeArgs.digitsInfo, this.grid.locale);
}
if (this.column.dataType === DataType.Currency) {
return this.column.formatter ?
this.column.formatter(element) :
this.grid.currencyPipe.transform(element, this.column.pipeArgs.currencyCode ?
this.column.pipeArgs.currencyCode : getLocaleCurrencyCode(this.grid.locale),
this.column.pipeArgs.display, this.column.pipeArgs.digitsInfo, this.grid.locale);
return this.column.formatter ?
applyFormatter ? this.column.formatter(element) : element :
this.grid.currencyPipe.transform(element, this.column.pipeArgs.currencyCode ?
this.column.pipeArgs.currencyCode : getLocaleCurrencyCode(this.grid.locale),
this.column.pipeArgs.display, this.column.pipeArgs.digitsInfo, this.grid.locale);
}
if (this.column.dataType === DataType.Percent) {
return this.column.formatter ?
this.column.formatter(element) :
this.grid.percentPipe.transform(element, this.column.pipeArgs.digitsInfo, this.grid.locale);
}
return this.column.formatter ?
return this.column.formatter ?
applyFormatter ? this.column.formatter(element) : element :
this.grid.percentPipe.transform(element, this.column.pipeArgs.digitsInfo, this.grid.locale);
}
return this.column.formatter && applyFormatter ?
this.column.formatter(element) :
element;
}
Expand Down
4 changes: 2 additions & 2 deletions projects/igniteui-angular/src/lib/grids/grid/column-group.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1598,7 +1598,7 @@ const testColumnPinning = (column: IgxColumnComponent, isPinned: boolean) => {
type PinUnpinFunc = (component: ColumnGroupFourLevelTestComponent) => void;

class PinningTests {
static testColumnGroupPinning(pinGenInfoColFunc: PinUnpinFunc, unpinGenInfoColFunc: PinUnpinFunc) {
public static testColumnGroupPinning(pinGenInfoColFunc: PinUnpinFunc, unpinGenInfoColFunc: PinUnpinFunc) {
const fixture = TestBed.createComponent(ColumnGroupFourLevelTestComponent);
fixture.detectChanges();
const ci = fixture.componentInstance;
Expand Down Expand Up @@ -1634,7 +1634,7 @@ class PinningTests {
}

class NestedColGroupsTests {
static testHeadersRendering(fixture: ComponentFixture<NestedColumnGroupsGridComponent>) {
public static testHeadersRendering(fixture: ComponentFixture<NestedColumnGroupsGridComponent>) {
const ci = fixture.componentInstance;
const grid = ci.grid;
const firstSlaveColGroup = fixture.debugElement.query(By.css('.firstSlaveColGroup'));
Expand Down
Loading

0 comments on commit 9106d80

Please sign in to comment.