AAE-27309 Add selectable property to datatable row (#10368)

* AAE-27309 Add selectable property to datatable row

* AAE-27309 Update documentation
This commit is contained in:
Diogo Bastos 2024-11-06 13:39:18 +00:00 committed by GitHub
parent 258f01803c
commit db22c6aac9
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
6 changed files with 38 additions and 7 deletions

View File

@ -81,6 +81,7 @@ An array of [`DataRow`](../../../lib/core/src/lib/datatable/data/data-row.model.
```ts ```ts
interface DataRow { interface DataRow {
isSelected: boolean; isSelected: boolean;
isSelectable?: boolean;
isDropTarget?: boolean; isDropTarget?: boolean;
cssClass?: string; cssClass?: string;
hasValue(key: string): boolean; hasValue(key: string): boolean;

View File

@ -213,6 +213,7 @@
tabindex="0"> tabindex="0">
<mat-checkbox <mat-checkbox
[id]="'select-file-' + idx" [id]="'select-file-' + idx"
[disabled]="!row?.isSelectable"
[class.adf-datatable-checkbox-selected]="row.isSelected" [class.adf-datatable-checkbox-selected]="row.isSelected"
[class.adf-datatable-hover-only]="displayCheckboxesOnHover" [class.adf-datatable-hover-only]="displayCheckboxesOnHover"
[checked]="row.isSelected" [checked]="row.isSelected"

View File

@ -919,6 +919,34 @@ describe('DataTable', () => {
} }
}); });
it('should update only selectable rows on "select all" click', () => {
const data = new ObjectDataTableAdapter([{}, {}, {}], []);
const rows = data.getRows();
rows[0].isSelectable = false;
dataTable.data = data;
dataTable.multiselect = true;
dataTable.ngAfterContentInit();
dataTable.onSelectAllClick({ checked: true } as MatCheckboxChange);
expect(dataTable.isSelectAllChecked).toBe(true);
for (let i = 0; i < rows.length; i++) {
if (i === 0) {
expect(rows[i].isSelected).toBe(false);
continue;
}
expect(rows[i].isSelected).toBe(true);
}
dataTable.onSelectAllClick({ checked: false } as MatCheckboxChange);
expect(dataTable.isSelectAllChecked).toBe(false);
for (let i = 0; i < rows.length; i++) {
expect(rows[i].isSelected).toBe(false);
}
});
it('should allow "select all" calls with no rows', () => { it('should allow "select all" calls with no rows', () => {
dataTable.multiselect = true; dataTable.multiselect = true;
dataTable.ngOnChanges({ data: new SimpleChange('123', {}, true) }); dataTable.ngOnChanges({ data: new SimpleChange('123', {}, true) });

View File

@ -446,7 +446,7 @@ export class DataTableComponent implements OnInit, AfterContentInit, OnChanges,
} }
convertToRowsData(rows: any[]): ObjectDataRow[] { convertToRowsData(rows: any[]): ObjectDataRow[] {
return rows.map((row) => new ObjectDataRow(row, row.isSelected)); return rows.map((row) => new ObjectDataRow(row, row.isSelected, row?.isSelectable));
} }
convertToColumnsData(columns: any[]): ObjectDataColumn[] { convertToColumnsData(columns: any[]): ObjectDataColumn[] {
@ -589,7 +589,7 @@ export class DataTableComponent implements OnInit, AfterContentInit, OnChanges,
} }
private handleRowSelection(row: DataRow, e: KeyboardEvent | MouseEvent) { private handleRowSelection(row: DataRow, e: KeyboardEvent | MouseEvent) {
if (!this.data) { if (!this.data || !row?.isSelectable) {
return; return;
} }
@ -713,10 +713,10 @@ export class DataTableComponent implements OnInit, AfterContentInit, OnChanges,
this.isSelectAllIndeterminate = false; this.isSelectAllIndeterminate = false;
if (this.multiselect) { if (this.multiselect) {
const rows = this.data.getRows(); const selectableRows = this.data.getRows().filter(row => row?.isSelectable);
if (rows && rows.length > 0) { if (selectableRows && selectableRows.length > 0) {
for (let i = 0; i < rows.length; i++) { for (let i = 0; i < selectableRows.length; i++) {
this.selectRow(rows[i], matCheckboxChange.checked); this.selectRow(selectableRows[i], matCheckboxChange.checked);
} }
} }

View File

@ -19,6 +19,7 @@ export interface DataRow {
[key: string]: any; [key: string]: any;
isSelected: boolean; isSelected: boolean;
isSelectable?: boolean;
isDropTarget?: boolean; isDropTarget?: boolean;
cssClass?: string; cssClass?: string;
id?: string; id?: string;

View File

@ -21,7 +21,7 @@ import { DataRow } from './data-row.model';
// Simple implementation of the DataRow interface. // Simple implementation of the DataRow interface.
export class ObjectDataRow implements DataRow { export class ObjectDataRow implements DataRow {
constructor(private obj: any, public isSelected: boolean = false) { constructor(private obj: any, public isSelected: boolean = false, public isSelectable: boolean = true) {
if (!obj) { if (!obj) {
throw new Error('Object source not found'); throw new Error('Object source not found');
} }