Styling table with amounts

This commit is contained in:
Jose Alberto Hernandez
2022-12-15 09:14:43 -06:00
parent 01135bce3e
commit c5ece8d95d
5 changed files with 111 additions and 93 deletions
@@ -20,33 +20,33 @@
</ng-container>
<ng-container matColumnDef="transactionDate">
<th mat-header-cell *matHeaderCellDef> Transaction Date </th>
<th mat-header-cell class="center" *matHeaderCellDef> Transaction Date </th>
<td mat-cell *matCellDef="let transaction"> {{ transaction.date | dateFormat }} </td>
</ng-container>
<ng-container matColumnDef="transactionType">
<th mat-header-cell *matHeaderCellDef> Transaction Type </th>
<th mat-header-cell class="center" *matHeaderCellDef> Transaction Type </th>
<td mat-cell *matCellDef="let transaction"> {{ transaction.transactionType.value }} </td>
</ng-container>
<ng-container matColumnDef="debit">
<th mat-header-cell *matHeaderCellDef> Debit </th>
<td mat-cell *matCellDef="let transaction"> {{ isDebit(transaction.transactionType) ? transaction.amount : 'N/A'}} </td>
<th mat-header-cell class="r-amount" *matHeaderCellDef> Debit </th>
<td mat-cell class="r-amount" *matCellDef="let transaction"> {{ isDebit(transaction.transactionType) ? (transaction.amount | number) : 'N/A'}} </td>
</ng-container>
<ng-container matColumnDef="credit">
<th mat-header-cell *matHeaderCellDef> Credit </th>
<td mat-cell *matCellDef="let transaction"> {{ !isDebit(transaction.transactionType) ? transaction.amount : 'N/A' }} </td>
<th mat-header-cell class="r-amount" *matHeaderCellDef> Credit </th>
<td mat-cell class="r-amount" *matCellDef="let transaction"> {{ !isDebit(transaction.transactionType) ? (transaction.amount | number) : 'N/A' }} </td>
</ng-container>
<ng-container matColumnDef="balance">
<th mat-header-cell *matHeaderCellDef> Balance </th>
<td mat-cell *matCellDef="let transaction"> {{ transaction.runningBalance }} </td>
<th mat-header-cell class="r-amount" *matHeaderCellDef> Balance </th>
<td mat-cell class="r-amount" *matCellDef="let transaction"> {{ transaction.runningBalance | number }} </td>
</ng-container>
<ng-container matColumnDef="viewReciept">
<th mat-header-cell *matHeaderCellDef> View Reciept </th>
<td mat-cell *matCellDef="let transaction">
<th mat-header-cell class="center" *matHeaderCellDef> View Reciept </th>
<td mat-cell class="center" *matCellDef="let transaction">
<button class="account-action-button" mat-raised-button color="primary" (click)="routeEdit($event)" [routerLink]="[transaction.id, 'reciept']">
<i class="fa fa-file" matTooltip="View Reciept"></i>
</button>