Fix/multirow data datatable (#1741)

* Fix charge payment method edition

* Fix DataTables due incorrect records shown

---------

Co-authored-by: Jose Alberto Hernandez <alberto@MacBook-Pro.local>
This commit is contained in:
José Alberto Hernández
2023-04-24 22:08:23 -06:00
committed by GitHub
co-authored by Jose Alberto Hernandez
parent 7306781db8
commit 625d75a0f5
2 changed files with 26 additions and 30 deletions
@@ -1,4 +1,4 @@
<div class="tab-container mat-typography">
<div class="tab-container mat-typography" id="selector-{{datatableName}}">
<div fxLayout="row" fxLayoutAlign="start">
<div class="m-b-10">
@@ -11,23 +11,25 @@
</button>
</span>
<span *mifosxHasPermission="'DELETE_' + datatableName">
<button class="delete-button" mat-raised-button color="warn" (click)="delete()" *ngIf="hasEntityData">
<button class="delete-button" mat-raised-button color="warn" (click)="delete()" *ngIf="dataObject.data.length > 0">
<fa-icon icon="trash" class="m-r-10"></fa-icon>Delete All
</button>
</span>
</div>
</div>
<table #dataTable mat-table [hidden]="!hasEntityData" [dataSource]="datatableData" class="mat-elevation-z1 m-b-25">
<div class="m-t-10" *ngIf="dataObject.data.length > 0">
<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">
<th mat-header-cell class="right" *matHeaderCellDef> {{datatableColumn}} </th>
<td mat-cell class="right" *matCellDef="let data">{{ formatValue(i, data.row[i]) }}</td>
</ng-container>
<ng-container *ngFor="let datatableColumn of datatableColumns;let i = index" [matColumnDef]="datatableColumn">
<th mat-header-cell class="right" *matHeaderCellDef> {{datatableColumn}} </th>
<td mat-cell class="right" *matCellDef="let data">{{ formatValue(i, data.row[i]) }}</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="datatableColumns"></tr>
<tr mat-row *matRowDef="let row; columns: datatableColumns;"></tr>
<tr mat-header-row *matHeaderRowDef="datatableColumns"></tr>
<tr mat-row *matRowDef="let row; columns: datatableColumns;"></tr>
</table>
</table>
</div>
</div>
@@ -34,7 +34,6 @@ export class DatatableMultiRowComponent implements OnInit, OnDestroy {
/** Toggle button visibility */
showDeleteBotton: boolean;
hasEntityData = false;
/** Data Table Reference */
@ViewChild('dataTable', { static: true }) dataTableRef: MatTable<Element>;
@@ -56,9 +55,7 @@ export class DatatableMultiRowComponent implements OnInit, OnDestroy {
private datatables: Datatables,
private dateFormat: DateFormatPipe,
private dateTimeFormat: DatetimeFormatPipe,
private numberFormat: DecimalPipe) {
}
private numberFormat: DecimalPipe) { }
/**
* Fetches data table name from route params.
@@ -72,17 +69,12 @@ export class DatatableMultiRowComponent implements OnInit, OnDestroy {
return columnHeader.columnName;
});
this.datatableData = this.dataObject.data;
this.hasEntityData = (this.datatableData && this.datatableData.length > 0);
console.log(this.hasEntityData);
console.log(this.dataObject.data);
}
ngOnDestroy(): void {
this.datatableName = null;
this.datatableColumns = null;
this.datatableData = null;
this.hasEntityData = false;
console.log(this.hasEntityData);
console.log(this.dataObject.data);
}
/**
@@ -135,16 +127,18 @@ export class DatatableMultiRowComponent implements OnInit, OnDestroy {
}
formatValue(index: number, value: any): any {
const columnDisplayType = this.dataObject.columnHeaders[index].columnDisplayType;
if (columnDisplayType === 'DATE') {
return this.dateFormat.transform(value);
} else if (columnDisplayType === 'DATETIME') {
return this.dateTimeFormat.transform(value);
} else if (columnDisplayType === 'INTEGER' || columnDisplayType === 'DECIMAL') {
if (typeof value === 'number') {
return this.numberFormat.transform(value);
} else {
return value;
if (this.dataObject.columnHeaders && this.dataObject.columnHeaders[index]) {
const columnDisplayType = this.dataObject.columnHeaders[index].columnDisplayType;
if (columnDisplayType === 'DATE') {
return this.dateFormat.transform(value);
} else if (columnDisplayType === 'DATETIME') {
return this.dateTimeFormat.transform(value);
} else if (columnDisplayType === 'INTEGER' || columnDisplayType === 'DECIMAL') {
if (typeof value === 'number') {
return this.numberFormat.transform(value);
} else {
return value;
}
}
}
return value;