Skip to content

Commit cbe7648

Browse files
authored
Merge branch 'master' into set-width-hideallcolumns-master
2 parents 3641ab8 + 50955d6 commit cbe7648

File tree

12 files changed

+214
-81
lines changed

12 files changed

+214
-81
lines changed

projects/igniteui-angular/src/lib/core/styles/components/grid/_grid-theme.scss

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2064,6 +2064,10 @@
20642064
%igx-grid__loading-outlet {
20652065
z-index: 10003;
20662066

2067+
> %overlay-wrapper--modal {
2068+
background: none;
2069+
}
2070+
20672071
%circular-display {
20682072
width: rem(50);
20692073
height: rem(50);

projects/igniteui-angular/src/lib/grids/grid-base.directive.ts

Lines changed: 21 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -132,7 +132,7 @@ import { IgxGridToolbarCustomContentDirective } from './toolbar/toolbar.directiv
132132
import { IgxColumnComponent } from './columns/column.component';
133133
import { IgxColumnGroupComponent } from './columns/column-group.component';
134134
import { IGridSortingStrategy } from '../data-operations/sorting-strategy';
135-
import { IgxRowDragGhostDirective } from './row-drag.directive';
135+
import { IgxRowDragGhostDirective, IgxDragIndicatorIconDirective } from './row-drag.directive';
136136

137137
const MINIMUM_COLUMN_WIDTH = 136;
138138
const FILTER_ROW_HEIGHT = 50;
@@ -154,6 +154,7 @@ export const IgxGridTransaction = new InjectionToken<string>('IgxGridTransaction
154154
export class IgxGridBaseDirective extends DisplayDensityBase implements
155155
OnInit, DoCheck, OnDestroy, AfterContentInit, AfterViewInit {
156156
private _scrollWidth: number;
157+
private _customDragIndicatorIconTemplate: TemplateRef<any>;
157158
protected _init = true;
158159
private _cdrRequests = false;
159160
protected _cdrRequestRepaint = false;
@@ -2030,7 +2031,7 @@ export class IgxGridBaseDirective extends DisplayDensityBase implements
20302031
* @hidden
20312032
*/
20322033
public get parentRowOutletDirective() {
2033-
return this.outletDirective;
2034+
return null;
20342035
}
20352036

20362037
/**
@@ -2089,6 +2090,24 @@ export class IgxGridBaseDirective extends DisplayDensityBase implements
20892090
@ContentChild(IgxHeaderCollapseIndicatorDirective, { read: TemplateRef })
20902091
public headerCollapseIndicatorTemplate: TemplateRef<any> = null;
20912092

2093+
/**
2094+
* @hidden
2095+
* @internal
2096+
*/
2097+
@ContentChildren(IgxDragIndicatorIconDirective, { read: TemplateRef, descendants: false })
2098+
public dragIndicatorIconTemplates: QueryList<TemplateRef<any>>;
2099+
2100+
/**
2101+
* The custom template, if any, that should be used when rendering the row drag indicator icon
2102+
*/
2103+
public get dragIndicatorIconTemplate(): TemplateRef<any> {
2104+
return this._customDragIndicatorIconTemplate || this.dragIndicatorIconTemplates.first;
2105+
}
2106+
2107+
public set dragIndicatorIconTemplate(val: TemplateRef<any>) {
2108+
this._customDragIndicatorIconTemplate = val;
2109+
}
2110+
20922111
/**
20932112
* @hidden
20942113
*/

projects/igniteui-angular/src/lib/grids/grid-navigation.service.ts

Lines changed: 6 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -356,21 +356,15 @@ export class IgxGridNavigationService {
356356

357357
public goToFirstCell() {
358358
const verticalScroll = this.grid.verticalScrollContainer.getScroll();
359-
const horizontalScroll = this.grid.dataRowList.first.virtDirRow.getScroll();
360359
if (verticalScroll.scrollTop === 0) {
361360
this.onKeydownHome(this.grid.dataRowList.first.index);
362361
} else {
363-
if (!horizontalScroll.clientWidth || parseInt(horizontalScroll.scrollLeft, 10) <= 1 || this.grid.pinnedColumns.length) {
364-
this.navigateTop(0);
365-
} else {
366-
this.getFocusableGrid().nativeElement.focus({ preventScroll: true });
367-
this.horizontalScroll(this.grid.dataRowList.first.index).scrollTo(0);
368-
this.grid.parentVirtDir.onChunkLoad
369-
.pipe(first())
370-
.subscribe(() => {
371-
this.navigateTop(0);
372-
});
373-
}
362+
this.getFocusableGrid().nativeElement.focus({ preventScroll: true });
363+
this.grid.verticalScrollContainer.scrollTo(0);
364+
this.grid.verticalScrollContainer.onChunkLoad
365+
.pipe(first()).subscribe(() => {
366+
this.onKeydownHome(this.grid.dataRowList.first.index);
367+
});
374368
}
375369
}
376370

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

Lines changed: 0 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -480,27 +480,6 @@ export class IgxGridComponent extends IgxGridBaseDirective implements GridType,
480480
@ContentChild(IgxGridDetailTemplateDirective, { read: IgxGridDetailTemplateDirective, static: false })
481481
protected gridDetailsTemplate: IgxGridDetailTemplateDirective;
482482

483-
/**
484-
* The custom template, if any, that should be used when rendering the row drag indicator icon
485-
*
486-
* ```typescript
487-
* // Set in typescript
488-
* const myCustomTemplate: TemplateRef<any> = myComponent.customTemplate;
489-
* myComponent.dragIndicatorIconTemplate = myCustomTemplate;
490-
* ```
491-
* ```html
492-
* <!-- Set in markup -->
493-
* <igx-grid #grid>
494-
* ...
495-
* <ng-template igxDragIndicatorIcon>
496-
* <igx-icon fontSet="material">info</igx-icon>
497-
* </ng-template>
498-
* </igx-grid>
499-
* ```
500-
*/
501-
@ContentChild(IgxDragIndicatorIconDirective, { read: TemplateRef })
502-
public dragIndicatorIconTemplate: TemplateRef<any> = null;
503-
504483
@ViewChildren(IgxGridGroupByRowComponent, { read: IgxGridGroupByRowComponent })
505484
private _groupsRowList: QueryList<IgxGridGroupByRowComponent>;
506485

projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid-base.directive.ts

Lines changed: 0 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -100,27 +100,6 @@ export class IgxHierarchicalGridBaseDirective extends IgxGridBaseDirective {
100100
@ViewChild('dragIndicatorIconBase', { read: TemplateRef, static: true })
101101
public dragIndicatorIconBase: TemplateRef<any>;
102102

103-
104-
/**
105-
* The custom template, if any, that should be used when rendering the row drag indicator icon
106-
*
107-
* ```typescript
108-
* // Set in typescript
109-
* const myCustomTemplate: TemplateRef<any> = myComponent.customTemplate;
110-
* myComponent.dragIndicatorIconTemplate = myCustomTemplate;
111-
* ```
112-
* ```html
113-
* <!-- Set in markup -->
114-
* <igx-grid #grid>
115-
* ...
116-
* <ng-template igxDragIndicatorIcon>
117-
* <igx-icon fontSet="material">info</igx-icon>
118-
* </ng-template>
119-
* </igx-grid>
120-
* ```
121-
*/
122-
public dragIndicatorIconTemplate: TemplateRef<any> = null;
123-
124103
constructor(
125104
public selectionService: IgxGridSelectionService,
126105
crudService: IgxGridCRUDService,

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

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -366,6 +366,9 @@ export class IgxHierarchicalGridComponent extends IgxHierarchicalGridBaseDirecti
366366
this.rowSelectorsTemplates = this.parentIsland ?
367367
this.parentIsland.rowSelectorsTemplates :
368368
this.rowSelectorsTemplates;
369+
this.dragIndicatorIconTemplate = this.parentIsland ?
370+
this.parentIsland.dragIndicatorIconTemplate :
371+
this.dragIndicatorIconTemplate;
369372
this.rowExpandedIndicatorTemplate = this.rootGrid.rowExpandedIndicatorTemplate;
370373
this.rowCollapsedIndicatorTemplate = this.rootGrid.rowCollapsedIndicatorTemplate;
371374
this.headerCollapseIndicatorTemplate = this.rootGrid.headerCollapseIndicatorTemplate;
@@ -398,6 +401,13 @@ export class IgxHierarchicalGridComponent extends IgxHierarchicalGridBaseDirecti
398401
return this.rootGrid._outletDirective;
399402
}
400403

404+
/**
405+
* @hidden
406+
*/
407+
public get parentRowOutletDirective() {
408+
return this === this.rootGrid ? null : this.rootGrid.rowEditingOutletDirective;
409+
}
410+
401411
/**
402412
* @hidden
403413
*/

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

Lines changed: 0 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -314,27 +314,6 @@ export class IgxTreeGridComponent extends IgxGridBaseDirective implements GridTy
314314
@ContentChild(IgxRowLoadingIndicatorTemplateDirective, { read: IgxRowLoadingIndicatorTemplateDirective })
315315
protected rowLoadingTemplate: IgxRowLoadingIndicatorTemplateDirective;
316316

317-
/**
318-
* The custom template, if any, that should be used when rendering the row drag indicator icon
319-
*
320-
* ```typescript
321-
* // Set in typescript
322-
* const myCustomTemplate: TemplateRef<any> = myComponent.customTemplate;
323-
* myComponent.dragIndicatorIconTemplate = myCustomTemplate;
324-
* ```
325-
* ```html
326-
* <!-- Set in markup -->
327-
* <igx-grid #grid>
328-
* ...
329-
* <ng-template igxDragIndicatorIcon>
330-
* <igx-icon fontSet="material">info</igx-icon>
331-
* </ng-template>
332-
* </igx-grid>
333-
* ```
334-
*/
335-
@ContentChild(IgxDragIndicatorIconDirective, { read: TemplateRef })
336-
public dragIndicatorIconTemplate: TemplateRef<any> = null;
337-
338317
/**
339318
* An @Input property that provides a template for the row loading indicator when load on demand is enabled.
340319
* ```html

projects/igniteui-angular/src/lib/services/csv/csv-exporter-grid.spec.ts

Lines changed: 57 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,9 +15,11 @@ import { SampleTestData } from '../../test-utils/sample-test-data.spec';
1515
import { first } from 'rxjs/operators';
1616
import { DefaultSortingStrategy } from '../../data-operations/sorting-strategy';
1717
import { IgxStringFilteringOperand, IgxNumberFilteringOperand } from '../../data-operations/filtering-condition';
18-
18+
import { FilteringExpressionsTree } from '../../data-operations/filtering-expressions-tree';
19+
import { FilteringLogic } from '../../data-operations/filtering-expression.interface';
1920
import { configureTestSuite } from '../../test-utils/configure-suite';
2021
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
22+
import { wait } from '../../test-utils/ui-interactions.spec';
2123

2224
describe('CSV Grid Exporter', () => {
2325
configureTestSuite();
@@ -336,6 +338,37 @@ describe('CSV Grid Exporter', () => {
336338
wrapper.verifyData(wrapper.simpleGridDataFormatted, 'Columns\' formatter should not be skipped.');
337339
});
338340

341+
it('Should honor the Advanced filters when exporting', async() => {
342+
const fix = TestBed.createComponent(GridIDNameJobTitleComponent);
343+
fix.detectChanges();
344+
345+
const grid = fix.componentInstance.grid;
346+
const tree = new FilteringExpressionsTree(FilteringLogic.And);
347+
tree.filteringOperands.push({
348+
fieldName: 'Name',
349+
searchVal: 'a',
350+
condition: IgxStringFilteringOperand.instance().condition('contains'),
351+
ignoreCase: true
352+
});
353+
tree.filteringOperands.push({
354+
fieldName: 'Name',
355+
searchVal: 'r',
356+
condition: IgxStringFilteringOperand.instance().condition('contains'),
357+
ignoreCase: true
358+
});
359+
tree.filteringOperands.push({
360+
fieldName: 'ID',
361+
searchVal: 5,
362+
condition: IgxNumberFilteringOperand.instance().condition('greaterThan'),
363+
});
364+
365+
grid.advancedFilteringExpressionsTree = tree;
366+
fix.detectChanges();
367+
368+
expect(grid.filteredData.length).toBe(4);
369+
const wrapper = await getExportedData(grid, options);
370+
wrapper.verifyData(wrapper.gridWithAdvancedFilters, 'Should export only filtered data.');
371+
});
339372

340373
describe('', () => {
341374
let fix;
@@ -441,6 +474,29 @@ describe('CSV Grid Exporter', () => {
441474
wrapper = await getExportedData(treeGrid, options);
442475
wrapper.verifyData(wrapper.treeGridDataFormatted, 'Columns\' formatter should be applied.');
443476
});
477+
478+
it('Should honor the Advanced filters when exporting', async() => {
479+
const tree = new FilteringExpressionsTree(FilteringLogic.And);
480+
tree.filteringOperands.push({
481+
fieldName: 'Name',
482+
searchVal: 'a',
483+
condition: IgxStringFilteringOperand.instance().condition('contains'),
484+
ignoreCase: true
485+
});
486+
tree.filteringOperands.push({
487+
fieldName: 'Name',
488+
searchVal: 'r',
489+
condition: IgxStringFilteringOperand.instance().condition('contains'),
490+
ignoreCase: true
491+
});
492+
treeGrid.advancedFilteringExpressionsTree = tree;
493+
fix.detectChanges();
494+
await wait();
495+
expect(treeGrid.filteredData.length).toBe(5);
496+
497+
const wrapper = await getExportedData(treeGrid, options);
498+
wrapper.verifyData(wrapper.treeGridWithAdvancedFilters, 'Should export only filtered data!');
499+
});
444500
});
445501

446502
function getExportedData(grid, csvOptions: IgxCsvExporterOptions) {

projects/igniteui-angular/src/lib/services/csv/csv-verification-wrapper.spec.ts

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -188,6 +188,14 @@ export class CSVWrapper {
188188
`Eduardo Ramirez${this._delimiter}10${this._delimiter}Manager${this._eor}`;
189189
}
190190

191+
get gridWithAdvancedFilters() {
192+
return `ID${this._delimiter}Name${this._delimiter}JobTitle${this._eor}` +
193+
`6${this._delimiter}Erma Walsh${this._delimiter}CEO${this._eor}` +
194+
`7${this._delimiter}Debra Morton${this._delimiter}Associate Software Developer${this._eor}` +
195+
`8${this._delimiter}Erika Wells${this._delimiter}Software Development Team Lead${this._eor}` +
196+
`10${this._delimiter}Eduardo Ramirez${this._delimiter}Manager${this._eor}`;
197+
}
198+
191199
get treeGridData() {
192200
return `ID${this._delimiter}ParentID${this._delimiter}Name${this._delimiter}JobTitle${this._delimiter}Age${this._eor}` +
193201
`1${this._delimiter}-1${this._delimiter}Casey Houston${this._delimiter}Vice President${this._delimiter}32${this._eor}` +
@@ -245,4 +253,13 @@ export class CSVWrapper {
245253
`2${this._delimiter}1${this._delimiter}Gilberto Todd${this._delimiter}Director${this._delimiter}41${this._eor}` +
246254
`7${this._delimiter}2${this._delimiter}Debra Morton${this._delimiter}Associate Software Developer${this._delimiter}35${this._eor}`;
247255
}
256+
257+
get treeGridWithAdvancedFilters() {
258+
return `ID${this._delimiter}ParentID${this._delimiter}Name${this._delimiter}JobTitle${this._delimiter}Age${this._eor}` +
259+
`1${this._delimiter}-1${this._delimiter}Casey Houston${this._delimiter}Vice President${this._delimiter}32${this._eor}` +
260+
`2${this._delimiter}1${this._delimiter}Gilberto Todd${this._delimiter}Director${this._delimiter}41${this._eor}` +
261+
`7${this._delimiter}2${this._delimiter}Debra Morton${this._delimiter}Associate Software Developer${this._delimiter}35${this._eor}` +
262+
`6${this._delimiter}-1${this._delimiter}Erma Walsh${this._delimiter}CEO${this._delimiter}52${this._eor}` +
263+
`10${this._delimiter}-1${this._delimiter}Eduardo Ramirez${this._delimiter}Manager${this._delimiter}53${this._eor}`;
264+
}
248265
}

projects/igniteui-angular/src/lib/services/excel/excel-exporter-grid.spec.ts

Lines changed: 61 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,8 @@ import { IgxTreeGridModule, IgxTreeGridComponent } from '../../grids/tree-grid';
2121
import { IgxNumberFilteringOperand } from '../../data-operations/filtering-condition';
2222
import { wait } from '../../test-utils/ui-interactions.spec';
2323
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
24+
import { FilteringExpressionsTree } from '../../data-operations/filtering-expressions-tree';
25+
import { FilteringLogic } from '../../data-operations/filtering-expression.interface';
2426

2527
describe('Excel Exporter', () => {
2628
configureTestSuite();
@@ -464,6 +466,41 @@ describe('Excel Exporter', () => {
464466
});
465467
await exportAndVerify(grid, options, actualData.simpleGridData);
466468
});
469+
470+
it('Should honor Advanced filters when exporting', async () => {
471+
const fix = TestBed.createComponent(GridIDNameJobTitleComponent);
472+
fix.detectChanges();
473+
await wait();
474+
475+
const grid = fix.componentInstance.grid;
476+
const tree = new FilteringExpressionsTree(FilteringLogic.And);
477+
tree.filteringOperands.push({
478+
fieldName: 'Name',
479+
searchVal: 'a',
480+
condition: IgxStringFilteringOperand.instance().condition('contains'),
481+
ignoreCase: true
482+
});
483+
tree.filteringOperands.push({
484+
fieldName: 'Name',
485+
searchVal: 'r',
486+
condition: IgxStringFilteringOperand.instance().condition('contains'),
487+
ignoreCase: true
488+
});
489+
tree.filteringOperands.push({
490+
fieldName: 'ID',
491+
searchVal: 5,
492+
condition: IgxNumberFilteringOperand.instance().condition('greaterThan'),
493+
});
494+
495+
grid.advancedFilteringExpressionsTree = tree;
496+
fix.detectChanges();
497+
grid.cdr.detectChanges();
498+
await wait();
499+
expect(grid.filteredData.length).toBe(4);
500+
501+
// Export and verify
502+
await exportAndVerify(grid, options, actualData.gridWithAdvancedFilters);
503+
});
467504
});
468505

469506
describe('', () => {
@@ -600,6 +637,30 @@ describe('Excel Exporter', () => {
600637
treeGrid.cdr.detectChanges();
601638
await exportAndVerify(treeGrid, options, actualData.treeGridDataFormatted);
602639
});
640+
641+
it('Should honor Advanced filters when exporting', async () => {
642+
const tree = new FilteringExpressionsTree(FilteringLogic.And);
643+
tree.filteringOperands.push({
644+
fieldName: 'Age',
645+
searchVal: 40,
646+
condition: IgxNumberFilteringOperand.instance().condition('lessThan'),
647+
ignoreCase: true
648+
});
649+
tree.filteringOperands.push({
650+
fieldName: 'Name',
651+
searchVal: 'a',
652+
condition: IgxStringFilteringOperand.instance().condition('contains'),
653+
ignoreCase: true
654+
});
655+
656+
treeGrid.advancedFilteringExpressionsTree = tree;
657+
fix.detectChanges();
658+
treeGrid.cdr.detectChanges();
659+
await wait();
660+
expect(treeGrid.filteredData.length).toBe(5);
661+
662+
await exportAndVerify(treeGrid, options, actualData.treeGridWithAdvancedFilters);
663+
});
603664
});
604665

605666
function getExportedData(grid, exportOptions: IgxExcelExporterOptions) {

0 commit comments

Comments
 (0)