Fix datatable multirow resfresh (#1746)

Co-authored-by: Jose Alberto Hernandez <alberto@MacBook-Pro.local>
This commit is contained in:
José Alberto Hernández
2023-05-04 01:02:27 -06:00
committed by GitHub
co-authored by Jose Alberto Hernandez
parent 1c453d1b2c
commit 8f1417b570
2 changed files with 27 additions and 11 deletions
@@ -1,4 +1,4 @@
<div class="tab-container mat-typography" id="selector-{{datatableName}}"> <div class="tab-container mat-typography">
<div fxLayout="row" fxLayoutAlign="start"> <div fxLayout="row" fxLayoutAlign="start">
<div class="m-b-10"> <div class="m-b-10">
@@ -18,7 +18,7 @@
</div> </div>
</div> </div>
<div class="m-t-10" *ngIf="dataObject.data.length > 0"> <div class="m-t-10">
<table #dataTable mat-table [dataSource]="datatableData" class="mat-elevation-z1 m-b-25"> <table #dataTable mat-table [dataSource]="datatableData" class="mat-elevation-z1 m-b-25">
<ng-container *ngFor="let datatableColumn of datatableColumns;let i = index" [matColumnDef]="datatableColumn"> <ng-container *ngFor="let datatableColumn of datatableColumns;let i = index" [matColumnDef]="datatableColumn">
@@ -1,5 +1,5 @@
import { DecimalPipe } from '@angular/common'; import { DecimalPipe } from '@angular/common';
import { Component, Input, OnDestroy, OnInit, ViewChild } from '@angular/core'; import { Component, Input, OnChanges, OnDestroy, OnInit, SimpleChanges, ViewChild } from '@angular/core';
import { MatDialog } from '@angular/material/dialog'; import { MatDialog } from '@angular/material/dialog';
import { MatTable } from '@angular/material/table'; import { MatTable } from '@angular/material/table';
import { ActivatedRoute } from '@angular/router'; import { ActivatedRoute } from '@angular/router';
@@ -18,7 +18,7 @@ import { SystemService } from 'app/system/system.service';
templateUrl: './datatable-multi-row.component.html', templateUrl: './datatable-multi-row.component.html',
styleUrls: ['./datatable-multi-row.component.scss'] styleUrls: ['./datatable-multi-row.component.scss']
}) })
export class DatatableMultiRowComponent implements OnInit, OnDestroy { export class DatatableMultiRowComponent implements OnInit, OnDestroy, OnChanges {
/** Data Object */ /** Data Object */
@Input() dataObject: any; @Input() dataObject: any;
@@ -36,7 +36,7 @@ export class DatatableMultiRowComponent implements OnInit, OnDestroy {
showDeleteBotton: boolean; showDeleteBotton: boolean;
/** Data Table Reference */ /** Data Table Reference */
@ViewChild('dataTable', { static: true }) dataTableRef: MatTable<Element>; @ViewChild('dataTable') dataTableRef: MatTable<Element>;
/** /**
* Fetches center Id from parent route params. * Fetches center Id from parent route params.
@@ -65,10 +65,7 @@ export class DatatableMultiRowComponent implements OnInit, OnDestroy {
this.route.params.subscribe((routeParams: any) => { this.route.params.subscribe((routeParams: any) => {
this.datatableName = routeParams.datatableName; this.datatableName = routeParams.datatableName;
}); });
this.datatableColumns = this.dataObject.columnHeaders.map((columnHeader: any) => { this.setData();
return columnHeader.columnName;
});
this.datatableData = this.dataObject.data;
} }
ngOnDestroy(): void { ngOnDestroy(): void {
@@ -77,6 +74,21 @@ export class DatatableMultiRowComponent implements OnInit, OnDestroy {
this.datatableData = null; this.datatableData = null;
} }
ngOnChanges(changes: SimpleChanges): void {
this.setData();
}
setData() {
this.datatableColumns = this.dataObject.columnHeaders.map((columnHeader: any) => {
return columnHeader.columnName;
});
this.datatableData = this.dataObject.data;
if (this.dataTableRef) {
this.dataTableRef.renderRows();
}
}
/** /**
* Adds a new row to the given multi row data table. * Adds a new row to the given multi row data table.
*/ */
@@ -99,7 +111,9 @@ export class DatatableMultiRowComponent implements OnInit, OnDestroy {
this.systemService.addEntityDatatableEntry(this.entityId, this.datatableName, dataTableEntryObject).subscribe(() => { this.systemService.addEntityDatatableEntry(this.entityId, this.datatableName, dataTableEntryObject).subscribe(() => {
this.systemService.getEntityDatatable(this.entityId, this.datatableName).subscribe((dataObject: any) => { this.systemService.getEntityDatatable(this.entityId, this.datatableName).subscribe((dataObject: any) => {
this.datatableData = dataObject.data; this.datatableData = dataObject.data;
this.dataTableRef.renderRows(); if (this.dataTableRef) {
this.dataTableRef.renderRows();
}
}); });
}); });
} }
@@ -119,7 +133,9 @@ export class DatatableMultiRowComponent implements OnInit, OnDestroy {
this.systemService.getEntityDatatable(this.entityId, this.datatableName).subscribe((dataObject: any) => { this.systemService.getEntityDatatable(this.entityId, this.datatableName).subscribe((dataObject: any) => {
this.datatableData = dataObject.data; this.datatableData = dataObject.data;
this.showDeleteBotton = false; this.showDeleteBotton = false;
this.dataTableRef.renderRows(); if (this.dataTableRef) {
this.dataTableRef.renderRows();
}
}); });
}); });
} }