Skip to content

Commit 57dbaaf

Browse files
onlyexeptiongedinakovakdinev
authored
fix(exporter): correctly export hgrid with multi col headers only in island (#10776)
* fix(exporter): correctly export hgrid with multi col headers only in island Co-authored-by: Galina Edinakova <[email protected]> Co-authored-by: Konstantin Dinev <[email protected]>
1 parent 03628e1 commit 57dbaaf

File tree

6 files changed

+256
-6
lines changed

6 files changed

+256
-6
lines changed

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

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,7 @@ import { NoopAnimationsModule } from '@angular/platform-browser/animations';
3232
import { FilteringExpressionsTree } from '../../data-operations/filtering-expressions-tree';
3333
import { FilteringLogic } from '../../data-operations/filtering-expression.interface';
3434
import { IgxHierarchicalGridExportComponent,
35+
IgxHierarchicalGridMultiColumnHeaderIslandsExportComponent,
3536
IgxHierarchicalGridMultiColumnHeadersExportComponent
3637
} from '../../test-utils/hierarchical-grid-components.spec';
3738
import { IgxHierarchicalGridModule,
@@ -60,7 +61,8 @@ describe('Excel Exporter', () => {
6061
IgxHierarchicalGridExportComponent,
6162
MultiColumnHeadersExportComponent,
6263
IgxHierarchicalGridMultiColumnHeadersExportComponent,
63-
ColumnsAddedOnInitComponent
64+
ColumnsAddedOnInitComponent,
65+
IgxHierarchicalGridMultiColumnHeaderIslandsExportComponent
6466
],
6567
imports: [IgxGridModule, IgxTreeGridModule, IgxHierarchicalGridModule, NoopAnimationsModule]
6668
}).compileComponents();
@@ -857,6 +859,15 @@ describe('Excel Exporter', () => {
857859
await exportAndVerify(hGrid, options, actualData.exportHierarchicalDataWithMultiColumnHeaders);
858860
});
859861

862+
it('should export hierarchical grid with multi column headers only in the row island', async () => {
863+
const fix = TestBed.createComponent(IgxHierarchicalGridMultiColumnHeaderIslandsExportComponent);
864+
fix.detectChanges();
865+
866+
const hGrid = fix.componentInstance.hGrid;
867+
options = createExportOptions('HierarchicalGridMCHExcelExport');
868+
await exportAndVerify(hGrid, options, actualData.exportHierarchicalDataWithMultiColumnHeadersOnlyInIsland);
869+
});
870+
860871
it('should export hierarchical grid with multi column headers and skipped column', async () => {
861872
const fix = TestBed.createComponent(IgxHierarchicalGridMultiColumnHeadersExportComponent);
862873
fix.detectChanges();

‎projects/igniteui-angular/src/lib/services/excel/excel-files.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -94,7 +94,7 @@ export class WorksheetFile implements IExcelFile {
9494
} else {
9595
const owner = worksheetData.owner;
9696
const isHierarchicalGrid = worksheetData.data[0].type === ExportRecordType.HierarchicalGridRecord;
97-
const hasMultiColumnHeader = owner.columns.some(col => !col.skip && col.headerType === HeaderType.MultiColumnHeader);
97+
const hasMultiColumnHeader = worksheetData.hasMultiColumnHeader;
9898
const hasUserSetIndex = owner.columns.some(col => col.exportIndex !== undefined);
9999

100100
const height = worksheetData.options.rowHeight;
@@ -246,7 +246,7 @@ export class WorksheetFile implements IExcelFile {
246246

247247
if (record.type === ExportRecordType.HeaderRecord) {
248248
const recordOwner = worksheetData.owners.get(record.owner);
249-
const hasMultiColumnHeaders = recordOwner.columns.some(c => c.headerType === HeaderType.MultiColumnHeader);
249+
const hasMultiColumnHeaders = recordOwner.columns.some(c => !c.skip && c.headerType === HeaderType.MultiColumnHeader);
250250

251251
if (hasMultiColumnHeaders) {
252252
this.hGridPrintMultiColHeaders(worksheetData, rowDataArr, record, recordOwner);

‎projects/igniteui-angular/src/lib/services/excel/test-data.service.spec.ts

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1467,4 +1467,18 @@ export class FileContentData {
14671467

14681468
return this.createData();
14691469
}
1470+
1471+
public get exportHierarchicalDataWithMultiColumnHeadersOnlyInIsland() {
1472+
this._sharedStringsData =
1473+
`count="34" uniqueCount="29"><si><t>CompanyName</t></si><si><t>Alfreds Futterkiste</t></si><si><t>General Information</t></si><si><t>Address Information</t></si><si><t>Personal Details</t></si><si><t>Location</t></si><si><t>Contact Information</t></si><si><t>ContactName</t></si><si><t>ContactTitle</t></si><si><t>Address</t></si><si><t>City</t></si><si><t>PostalCode</t></si><si><t>Country</t></si><si><t>Phone</t></si><si><t>Fax</t></si><si><t>Ana Trujillo Emparedados y helados</t></si><si><t>Ana Trujillo</t></si><si><t>Owner</t></si><si><t>Avda. de la Constitución 2222</t></si><si><t>México D.F.</t></si><si><t>05021</t></si><si><t>Mexico</t></si><si><t>(5) 555-4729</t></si><si><t>(5) 555-3745</t></si><si><t>Antonio Moreno Taquería</t></si><si><t>Antonio Moreno</t></si><si><t>Mataderos 2312</t></si><si><t>05023</t></si><si><t>(5) 555-3932</t></si>`;
1474+
1475+
this._worksheetData =
1476+
`<sheetPr><outlinePr summaryBelow="0"/></sheetPr>
1477+
<sheetViews><sheetView tabSelected="1" workbookViewId="0"></sheetView></sheetViews>
1478+
<sheetFormatPr defaultRowHeight="15" outlineLevelRow="1" x14ac:dyDescent="0.25"/>
1479+
<cols><col min="1" max="15" width="20" customWidth="1"/></cols>
1480+
<sheetData><row r="1"><c r="A1" s="3" t="s"><v>0</v></c></row><row r="2"><c r="A2" t="s"><v>1</v></c></row><row r="3" outlineLevel="1" hidden="1"><c r="B3" s="3" t="s"><v>2</v></c><c r="C3" s="3" /><c r="D3" s="3" /><c r="E3" s="3" t="s"><v>3</v></c><c r="F3" s="3" /><c r="G3" s="3" /><c r="H3" s="3" /><c r="I3" s="3" /><c r="J3" s="3" /></row><row r="4" outlineLevel="1" hidden="1"><c r="B4" s="3" t="s"><v>0</v></c><c r="C4" s="3" t="s"><v>4</v></c><c r="D4" s="3" /><c r="E4" s="3" t="s"><v>5</v></c><c r="F4" s="3" /><c r="G4" s="3" /><c r="H4" s="3" /><c r="I4" s="3" t="s"><v>6</v></c><c r="J4" s="3" /></row><row r="5" outlineLevel="1" hidden="1"><c r="B5" t="s" s="3"><v>0</v></c><c r="C5" t="s" s="3"><v>7</v></c><c r="D5" t="s" s="3"><v>8</v></c><c r="E5" t="s" s="3"><v>9</v></c><c r="F5" t="s" s="3"><v>10</v></c><c r="G5" t="s" s="3"><v>11</v></c><c r="H5" t="s" s="3"><v>12</v></c><c r="I5" t="s" s="3"><v>13</v></c><c r="J5" t="s" s="3"><v>14</v></c></row><row r="6" outlineLevel="1" hidden="1"><c r="B6" t="s"><v>15</v></c><c r="C6" t="s"><v>16</v></c><c r="D6" t="s"><v>17</v></c><c r="E6" t="s"><v>18</v></c><c r="F6" t="s"><v>19</v></c><c r="G6" t="s"><v>20</v></c><c r="H6" t="s"><v>21</v></c><c r="I6" t="s"><v>22</v></c><c r="J6" t="s"><v>23</v></c></row><row r="7" outlineLevel="1" hidden="1"><c r="B7" t="s"><v>24</v></c><c r="C7" t="s"><v>25</v></c><c r="D7" t="s"><v>17</v></c><c r="E7" t="s"><v>26</v></c><c r="F7" t="s"><v>19</v></c><c r="G7" t="s"><v>27</v></c><c r="H7" t="s"><v>21</v></c><c r="I7" t="s"><v>28</v></c><c r="J7" s="1"/></row></sheetData><mergeCells count="6"> <mergeCell ref="B3:D3" /> <mergeCell ref="E3:J3" /> <mergeCell ref="B4:B5" /> <mergeCell ref="C4:D4" /> <mergeCell ref="E4:H4" /> <mergeCell ref="I4:J4" /></mergeCells>`;
1481+
1482+
return this.createData();
1483+
}
14701484
}

‎projects/igniteui-angular/src/lib/services/excel/worksheet-data.ts

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ export class WorksheetData {
88
private _rowCount: number;
99
private _dataDictionary: WorksheetDataDictionary;
1010
private _isSpecialData: boolean;
11+
private _hasMultiColumnHeader: boolean;
1112

1213
constructor(private _data: IExportRecord[],
1314
public options: IgxExcelExporterOptions,
@@ -41,15 +42,22 @@ export class WorksheetData {
4142
return this._dataDictionary;
4243
}
4344

45+
public get hasMultiColumnHeader(): boolean {
46+
return this._hasMultiColumnHeader;
47+
}
48+
4449
private initializeData() {
4550
if (!this._data || this._data.length === 0) {
4651
return;
4752
}
4853

49-
const isMultiColumnHeader = this.owner.columns.some(col => !col.skip && col.headerType === HeaderType.MultiColumnHeader);
54+
this._hasMultiColumnHeader = Array.from(this.owners.values())
55+
.some(o => o.columns.some(col => !col.skip && col.headerType === HeaderType.MultiColumnHeader));
56+
57+
5058
const hasHierarchicalGridRecord = this._data[0].type === ExportRecordType.HierarchicalGridRecord;
5159

52-
if (hasHierarchicalGridRecord || (isMultiColumnHeader && !this.options.ignoreMultiColumnHeaders)) {
60+
if (hasHierarchicalGridRecord || (this._hasMultiColumnHeader && !this.options.ignoreMultiColumnHeaders)) {
5361
this.options.exportAsTable = false;
5462
}
5563

‎projects/igniteui-angular/src/lib/test-utils/hierarchical-grid-components.spec.ts

Lines changed: 36 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import { IgxRowIslandComponent } from '../grids/hierarchical-grid/row-island.com
66
import { IPinningConfig } from '../grids/grid.common';
77
import { ColumnPinningPosition, RowPinningPosition } from '../grids/common/enums';
88
import { IgxActionStripComponent } from '../action-strip/public_api';
9-
import { HIERARCHICAL_SAMPLE_DATA } from 'src/app/shared/sample-data';
9+
import { HIERARCHICAL_SAMPLE_DATA, HIERARCHICAL_SAMPLE_DATA_SHORT } from 'src/app/shared/sample-data';
1010
import { IgxHierarchicalTransactionServiceFactory } from '../grids/hierarchical-grid/hierarchical-grid-base.directive';
1111

1212
@Component({
@@ -465,3 +465,38 @@ export class IgxHierarchicalGridMultiColumnHeadersExportComponent {
465465
@ViewChild('hierarchicalGrid', { read: IgxHierarchicalGridComponent, static: true }) public hGrid: IgxHierarchicalGridComponent;
466466
public data = HIERARCHICAL_SAMPLE_DATA;
467467
}
468+
469+
@Component({
470+
template: `
471+
<igx-hierarchical-grid [data]="data" [height]="'1200px'" [width]="'700px'" #hierarchicalGrid>
472+
<igx-column field="CompanyName" [movable]="true" [sortable]="true" [resizable]="true"></igx-column>
473+
474+
<igx-row-island [key]="'ChildCompanies'" [autoGenerate]="false">
475+
<igx-column-group [movable]="true" [pinned]="false" header="General Information">
476+
<igx-column field="CompanyName" [movable]="true" [sortable]="true" [resizable]="true"></igx-column>
477+
<igx-column-group [movable]="true" header="Personal Details">
478+
<igx-column field="ContactName" [movable]="true" [sortable]="true" [resizable]="true"></igx-column>
479+
<igx-column field="ContactTitle" [movable]="true" [sortable]="true" [resizable]="true"></igx-column>
480+
</igx-column-group>
481+
</igx-column-group>
482+
<igx-column-group header="Address Information">
483+
<igx-column-group header="Location">
484+
<igx-column field="Address" [movable]="true" [sortable]="true" [resizable]="true"></igx-column>
485+
<igx-column field="City" [movable]="true" [sortable]="true" [resizable]="true"></igx-column>
486+
<igx-column field="PostalCode" [movable]="true" [sortable]="true" [resizable]="true"></igx-column>
487+
<igx-column field="Country" [movable]="true" [sortable]="true" [resizable]="true"></igx-column>
488+
</igx-column-group>
489+
<igx-column-group header="Contact Information">
490+
<igx-column field="Phone" [sortable]="true" [resizable]="true"></igx-column>
491+
<igx-column field="Fax" [sortable]="true" [resizable]="true"></igx-column>
492+
</igx-column-group>
493+
</igx-column-group>
494+
</igx-row-island>
495+
</igx-hierarchical-grid>
496+
`
497+
})
498+
export class IgxHierarchicalGridMultiColumnHeaderIslandsExportComponent {
499+
@ViewChild('hierarchicalGrid', { read: IgxHierarchicalGridComponent, static: true }) public hGrid: IgxHierarchicalGridComponent;
500+
public data = HIERARCHICAL_SAMPLE_DATA_SHORT;
501+
}
502+

‎src/app/shared/sample-data.ts

Lines changed: 182 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -821,3 +821,185 @@ export const HIERARCHICAL_SAMPLE_DATA = [
821821
Fax: '011-4988261'
822822
}
823823
];
824+
825+
export const HIERARCHICAL_SAMPLE_DATA_SHORT = [
826+
{
827+
CompanyName: 'Alfreds Futterkiste',
828+
ChildCompanies: [
829+
{
830+
ID: 'ANATR',
831+
CompanyName: 'Ana Trujillo Emparedados y helados',
832+
ContactName: 'Ana Trujillo',
833+
ContactTitle: 'Owner',
834+
Address: 'Avda. de la Constitución 2222',
835+
City: 'México D.F.',
836+
Region: null,
837+
PostalCode: '05021',
838+
Country: 'Mexico',
839+
Phone: '(5) 555-4729',
840+
Fax: '(5) 555-3745',
841+
ChildCompanies: [
842+
{
843+
ID: 'AROUT',
844+
CompanyName: 'Around the Horn',
845+
ContactName: 'Thomas Hardy',
846+
ContactTitle: 'Sales Representative',
847+
Address: '120 Hanover Sq.',
848+
City: 'London',
849+
Region: null,
850+
PostalCode: 'WA1 1DP',
851+
Country: 'UK',
852+
Phone: '(171) 555-7788',
853+
Fax: '(171) 555-6750'
854+
},
855+
{
856+
ID: 'BERGS',
857+
CompanyName: 'Berglunds snabbköp',
858+
ContactName: 'Christina Berglund',
859+
ContactTitle: 'Order Administrator',
860+
Address: 'Berguvsvägen 8',
861+
City: 'Luleå',
862+
Region: null,
863+
PostalCode: 'S-958 22',
864+
Country: 'Sweden',
865+
Phone: '0921-12 34 65',
866+
Fax: '0921-12 34 67'
867+
},
868+
{
869+
ID: 'BLAUS',
870+
CompanyName: 'Blauer See Delikatessen',
871+
ContactName: 'Hanna Moos',
872+
ContactTitle: 'Sales Representative',
873+
Address: 'Forsterstr. 57',
874+
City: 'Mannheim',
875+
Region: null,
876+
PostalCode: '68306',
877+
Country: 'Germany',
878+
Phone: '0621-08460',
879+
Fax: '0621-08924'
880+
},
881+
{
882+
ID: 'BLONP',
883+
CompanyName: 'Blondesddsl père et fils',
884+
ContactName: 'Frédérique Citeaux',
885+
ContactTitle: 'Marketing Manager',
886+
Address: '24, place Kléber',
887+
City: 'Strasbourg',
888+
Region: null,
889+
PostalCode: '67000',
890+
Country: 'France',
891+
Phone: '88.60.15.31',
892+
Fax: '88.60.15.32'
893+
},
894+
{
895+
ID: 'BOLID',
896+
CompanyName: 'Bólido Comidas preparadas',
897+
ContactName: 'Martín Sommer',
898+
ContactTitle: 'Owner',
899+
Address: 'C/ Araquil, 67',
900+
City: 'Madrid',
901+
Region: null,
902+
PostalCode: '28023',
903+
Country: 'Spain',
904+
Phone: '(91) 555 22 82',
905+
Fax: '(91) 555 91 99'
906+
},
907+
{
908+
ID: 'BONAP',
909+
CompanyName: 'Bon app',
910+
ContactName: 'Laurence Lebihan',
911+
ContactTitle: 'Owner',
912+
Address: '12, rue des Bouchers',
913+
City: 'Marseille',
914+
Region: null,
915+
PostalCode: '13008',
916+
Country: 'France',
917+
Phone: '91.24.45.40',
918+
Fax: '91.24.45.41'
919+
},
920+
{
921+
ID: 'BOTTM',
922+
CompanyName: 'Bottom-Dollar Markets',
923+
ContactName: 'Elizabeth Lincoln',
924+
ContactTitle: 'Accounting Manager',
925+
Address: '23 Tsawassen Blvd.',
926+
City: 'Tsawassen',
927+
Region: 'BC',
928+
PostalCode: 'T2F 8M4',
929+
Country: 'Canada',
930+
Phone: '(604) 555-4729',
931+
Fax: '(604) 555-3745'
932+
},
933+
{
934+
ID: 'BSBEV',
935+
CompanyName: 'Beverages',
936+
ContactName: 'Victoria Ashworth',
937+
ContactTitle: 'Sales Representative',
938+
Address: 'Fauntleroy Circus',
939+
City: 'London',
940+
Region: null,
941+
PostalCode: 'EC2 5NT',
942+
Country: 'UK',
943+
Phone: '(171) 555-1212',
944+
Fax: null
945+
},
946+
]
947+
},
948+
{
949+
ID: 'ANTON',
950+
CompanyName: 'Antonio Moreno Taquería',
951+
ContactName: 'Antonio Moreno',
952+
ContactTitle: 'Owner',
953+
Address: 'Mataderos 2312',
954+
City: 'México D.F.',
955+
Region: null,
956+
PostalCode: '05023',
957+
Country: 'Mexico',
958+
Phone: '(5) 555-3932',
959+
Fax: null,
960+
ChildCompanies: [
961+
{
962+
ID: 'CACTU',
963+
CompanyName:
964+
'Cactus Comidas para llevar',
965+
ContactName: 'Patricio Simpson',
966+
ContactTitle: 'Sales Agent',
967+
Address: 'Cerrito 333',
968+
City: 'Buenos Aires',
969+
Region: null,
970+
PostalCode: '1010',
971+
Country: 'Argentina',
972+
Phone: '(1) 135-5555',
973+
Fax: '(1) 135-4892'
974+
},
975+
{
976+
ID: 'CENTC',
977+
CompanyName: 'Centro comercial Moctezuma',
978+
ContactName: 'Francisco Chang',
979+
ContactTitle: 'Marketing Manager',
980+
Address: 'Sierras de Granada 9993',
981+
City: 'México D.F.',
982+
Region: null,
983+
PostalCode: '05022',
984+
Country: 'Mexico',
985+
Phone: '(5) 555-3392',
986+
Fax: '(5) 555-7293'
987+
},
988+
{
989+
ID: 'CHOPS',
990+
CompanyName: 'Chop-suey Chinese',
991+
ContactName: 'Yang Wang',
992+
ContactTitle: 'Owner',
993+
Address: 'Hauptstr. 29',
994+
City: 'Bern',
995+
Region: null,
996+
PostalCode: '3012',
997+
Country: 'Switzerland',
998+
Phone: '0452-076545',
999+
Fax: null
1000+
},
1001+
]
1002+
},
1003+
]
1004+
},
1005+
];

0 commit comments

Comments
 (0)