diff --git a/src/app/shared/modules/dynamic-material-table/table/dynamic-mat-table.component.html b/src/app/shared/modules/dynamic-material-table/table/dynamic-mat-table.component.html index 5aa455aa5c..638c9a7865 100644 --- a/src/app/shared/modules/dynamic-material-table/table/dynamic-mat-table.component.html +++ b/src/app/shared/modules/dynamic-material-table/table/dynamic-mat-table.component.html @@ -128,7 +128,7 @@ cdkDragBoundary="mat-header-row" cdkDropListLockAxis="x" [ngClass]="headerClass(column)" - [cdkDragData]="{ name: column.name, columnIndex: i }" + [cdkDragData]="{ name: column.name }" [ngStyle]="column.style" [class.active-resize]="resizeColumn.columnIndex === i" [class.active-sort]="sort.direction && sort.active === column.name" diff --git a/src/app/shared/modules/dynamic-material-table/table/dynamic-mat-table.component.ts b/src/app/shared/modules/dynamic-material-table/table/dynamic-mat-table.component.ts index 5a954420dd..cd430e5838 100644 --- a/src/app/shared/modules/dynamic-material-table/table/dynamic-mat-table.component.ts +++ b/src/app/shared/modules/dynamic-material-table/table/dynamic-mat-table.component.ts @@ -1101,12 +1101,23 @@ export class DynamicMatTableComponent dragStarted(event: Event) {} dropListDropped(event: CdkDragDrop) { - const columnPreviousIndex = event.item.data.columnIndex; + const displayedColumnIndexMap = this.columns + .map((column, index) => ({ column, index })) + .filter( + ({ column }) => + column.display === undefined || + column.display === "visible" || + column.display === "prevent-hidden", + ); + const from = displayedColumnIndexMap[event.previousIndex]; + const to = displayedColumnIndexMap[event.currentIndex]; - if (event) { - this.dragDropData.dropColumnIndex = event.currentIndex; - this.moveColumn(columnPreviousIndex, event.currentIndex); + if (!from || !to || from.index === to.index) { + return; } + + this.dragDropData.dropColumnIndex = to.index; + this.moveColumn(from.index, to.index); } drop(event: CdkDragDrop) {