[ACA-3368] Update datatable columns when presetColumn schema changes (#5732)

* [ACA-3368] Update datatable columns when presetColumn schema changes

* [ACA-3368] Add presetColumn change detection for task list

* [ACA-3368] Improve unit tests, fix comments

* [ACA-3368] More unit test improvements
This commit is contained in:
arditdomi
2020-05-29 14:34:42 +01:00
committed by GitHub
parent d782b5c4d2
commit 3649e9239f
8 changed files with 163 additions and 64 deletions

View File

@@ -1228,6 +1228,21 @@ describe('DataTable', () => {
expect(dataTable.data.getRows().length).toEqual(2);
expect(dataTable.resolverFn).toHaveBeenCalledTimes(4);
});
it('should update data columns when columns input changes', () => {
const existingDataColumnsSchema = [new ObjectDataColumn({ key: 'id' })];
const existingData = [{ id: 'fake-data' }];
dataTable.data = new ObjectDataTableAdapter(
existingData,
existingDataColumnsSchema
);
const newDataColumnsSchema = { key: 'new-column'};
const columnsChange = new SimpleChange(null, [newDataColumnsSchema], false);
dataTable.ngOnChanges({ 'columns': columnsChange });
const expectedNewDataColumns = [new ObjectDataColumn(newDataColumnsSchema)];
expect(dataTable.data.getColumns()).toEqual(expectedNewDataColumns);
});
});
describe('Accesibility', () => {

View File

@@ -32,6 +32,7 @@ import { DataTableAdapter } from '../../data/datatable-adapter';
import { DataTableRowComponent } from '../datatable-row/datatable-row.component';
import { ObjectDataRow } from '../../data/object-datarow.model';
import { ObjectDataColumn } from '../../data/object-datacolumn.model';
import { ObjectDataTableAdapter } from '../../data/object-datatable-adapter';
import { DataCellEvent } from '../data-cell.event';
import { DataRowActionEvent } from '../data-row-action.event';
@@ -225,21 +226,23 @@ export class DataTableComponent implements AfterContentInit, OnChanges, DoCheck,
ngOnChanges(changes: SimpleChanges) {
this.initAndSubscribeClickStream();
if (this.isPropertyChanged(changes['data'])) {
if (this.isTableEmpty()) {
this.initTable();
} else {
this.data = changes['data'].currentValue;
this.resetSelection();
}
return;
}
if (this.isPropertyChanged(changes['rows'])) {
const dataChanges = changes['data'];
const rowChanges = changes['rows'];
const columnChanges = changes['columns'];
if (this.isPropertyChanged(dataChanges) || this.isPropertyChanged(rowChanges) || this.isPropertyChanged(columnChanges)) {
if (this.isTableEmpty()) {
this.initTable();
} else {
this.setTableRows(changes['rows'].currentValue);
if (dataChanges) {
this.data = changes['data'].currentValue;
this.resetSelection();
} else if (rowChanges) {
this.setTableRows(changes['rows'].currentValue);
} else {
this.setTableColumns(changes['columns'].currentValue);
}
}
return;
}
@@ -280,6 +283,10 @@ export class DataTableComponent implements AfterContentInit, OnChanges, DoCheck,
return rows.map((row) => new ObjectDataRow(row, row.isSelected));
}
convertToColumnsData(columns: any []): ObjectDataColumn[] {
return columns.map((column) => new ObjectDataColumn(column));
}
convertToDataSorting(sorting: any[]): DataSorting | null {
if (sorting && sorting.length > 0) {
return new DataSorting(sorting[0], sorting[1]);
@@ -366,7 +373,16 @@ export class DataTableComponent implements AfterContentInit, OnChanges, DoCheck,
private setTableRows(rows: any[]) {
if (this.data) {
this.resetSelection();
this.data.setRows(this.convertToRowsData(rows));
const rowsData = this.convertToRowsData(rows);
this.data.setRows(rowsData);
}
}
private setTableColumns(columns: any[]) {
if (this.data) {
this.resetSelection();
const columnsData = this.convertToColumnsData(columns);
this.data.setColumns(columnsData);
}
}