109 lines
4.6 KiB
HTML
109 lines
4.6 KiB
HTML
<div class="container">
|
|
|
|
<div fxLayout="row" fxLayoutAlign="end" fxLayoutGap="20px" class="transaction-buttons">
|
|
<mat-checkbox [formControl]="hideAccrualsParam" (click)="hideAccruals()" class="accruals">Hide Accruals</mat-checkbox>
|
|
<button mat-raised-button color="primary">
|
|
Export
|
|
</button>
|
|
<button mat-raised-button color="primary">
|
|
View Journal Entries
|
|
</button>
|
|
</div>
|
|
|
|
<table mat-table [dataSource]="showTransactions">
|
|
|
|
<ng-container matColumnDef="id">
|
|
<th mat-header-cell *matHeaderCellDef> Date </th>
|
|
<td mat-cell *matCellDef="let ele" [ngClass]="{'strike': ele.manuallyReversed}"> {{ ele.id }} </td>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="office">
|
|
<th mat-header-cell *matHeaderCellDef> Office </th>
|
|
<td mat-cell *matCellDef="let ele" [ngClass]="{'strike': ele.manuallyReversed}"> {{ ele.officeName }} </td>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="transactionDate">
|
|
<th mat-header-cell *matHeaderCellDef> Transaction Date </th>
|
|
<td mat-cell *matCellDef="let ele" [ngClass]="{'strike': ele.manuallyReversed}"> {{ ele.date | date }} </td>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="transactionType">
|
|
<th mat-header-cell *matHeaderCellDef> Transaction Type </th>
|
|
<td mat-cell *matCellDef="let ele" [ngClass]="{'strike': ele.manuallyReversed}"> {{ ele.type.value }} </td>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="amount">
|
|
<th mat-header-cell *matHeaderCellDef> Amount </th>
|
|
<td mat-cell *matCellDef="let ele" [ngClass]="{'strike': ele.manuallyReversed}"> {{ ele.amount | number }} </td>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="principal">
|
|
<th mat-header-cell *matHeaderCellDef> Breakdown </th>
|
|
<td mat-cell *matCellDef="let ele" [ngClass]="{'strike': ele.manuallyReversed}"> {{ ele.principalPortion | number }} </td>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="interest">
|
|
<th mat-header-cell *matHeaderCellDef> </th>
|
|
<td mat-cell *matCellDef="let ele" [ngClass]="{'strike': ele.manuallyReversed}"> {{ ele.interestPortion | number }} </td>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="fee">
|
|
<th mat-header-cell *matHeaderCellDef> </th>
|
|
<td mat-cell *matCellDef="let ele" [ngClass]="{'strike': ele.manuallyReversed}"> {{ ele.feeChargesPortion | number }} </td>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="penalties">
|
|
<th mat-header-cell *matHeaderCellDef> </th>
|
|
<td mat-cell *matCellDef="let ele" [ngClass]="{'strike': ele.manuallyReversed}"> {{ ele.penaltyChargesPortion | number }} </td>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="loanBalance">
|
|
<th mat-header-cell *matHeaderCellDef> Loan Balance </th>
|
|
<td mat-cell *matCellDef="let ele" [ngClass]="{'strike': ele.manuallyReversed}"> {{ ele.outstandingLoanBalance | number }} </td>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="actions">
|
|
<th mat-header-cell *matHeaderCellDef> </th>
|
|
<td mat-cell *matCellDef="let ele" [ngClass]="{'strike': ele.manuallyReversed}">
|
|
<span *ngIf="!ele.manuallyReversedession">
|
|
<i class="fa fa-file-text fa fa-large" matTooltip="View Receipts"></i>
|
|
</span>
|
|
<span>
|
|
<i class="fa fa-arrow-circle-right fa fa-large coll" matTooltip="View Journal Entries" matTooltipPosition="left"></i>
|
|
</span>
|
|
</td>
|
|
</ng-container>
|
|
|
|
<!-- Sub header -->
|
|
<ng-container matColumnDef="header">
|
|
<th mat-header-cell *matHeaderCellDef [attr.colspan]="5"> </th>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="header-principal">
|
|
<th mat-header-cell *matHeaderCellDef [attr.colspan]="1"> Principal </th>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="header-interest">
|
|
<th mat-header-cell *matHeaderCellDef [attr.colspan]="1"> Interest </th>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="header-fees">
|
|
<th mat-header-cell *matHeaderCellDef [attr.colspan]="1"> Fees </th>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="header-penalties">
|
|
<th mat-header-cell *matHeaderCellDef [attr.colspan]="1"> Penalties </th>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="header-action">
|
|
<th mat-header-cell *matHeaderCellDef [attr.colspan]="2"> </th>
|
|
</ng-container>
|
|
|
|
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
|
|
<tr mat-header-row *matHeaderRowDef="['header', 'header-principal', 'header-interest', 'header-fees', 'header-penalties', 'header-action']"></tr>
|
|
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
|
|
|
|
</table>
|
|
|
|
</div>
|