Display Savings account transaction reversed

src/app/deposits/fixed-deposits/fixed-deposit-account-view/transactions-tab/transactions-tab.component.html

@@ -13,6 +13,11 @@
 
     <table mat-table [dataSource]="dataSource">
 
+      <ng-container matColumnDef="row">
+        <th mat-header-cell *matHeaderCellDef> # </th>
+        <td mat-cell *matCellDef="let idx = index;">{{(idx + 1)}}</td>
+      </ng-container>
+
       <ng-container matColumnDef="id">
         <th mat-header-cell *matHeaderCellDef> {{"labels.inputs.ID" | translate }} </th>
         <td mat-cell *matCellDef="let transaction"> {{ transaction.id }} </td>

src/app/deposits/fixed-deposits/fixed-deposit-account-view/transactions-tab/transactions-tab.component.ts

@@ -22,7 +22,7 @@ export class TransactionsTabComponent implements OnInit {
   /** Form control to handle accural parameter */
   hideAccrualsParam: UntypedFormControl;
   /** Columns to be displayed in transactions table. */
-  displayedColumns: string[] = ['id', 'transactionDate', 'transactionType', 'debit', 'credit', 'balance', 'actions'];
+  displayedColumns: string[] = ['row', 'id', 'transactionDate', 'transactionType', 'debit', 'credit', 'balance', 'actions'];
   /** Data source for transactions table. */
   dataSource: MatTableDataSource<any>;
 

src/app/deposits/recurring-deposits/recurring-deposits-account-view/transactions-tab/transactions-tab.component.html

@@ -13,6 +13,11 @@
 
     <table mat-table [dataSource]="dataSource">
 
+      <ng-container matColumnDef="row">
+        <th mat-header-cell *matHeaderCellDef> # </th>
+        <td mat-cell *matCellDef="let idx = index;">{{(idx + 1)}}</td>
+      </ng-container>
+
       <ng-container matColumnDef="id">
         <th mat-header-cell *matHeaderCellDef> {{"labels.inputs.ID" | translate }} </th>
         <td mat-cell *matCellDef="let transaction" [ngClass]="{'strike': transaction.reversed}"> {{ transaction.id }} </td>

src/app/deposits/recurring-deposits/recurring-deposits-account-view/transactions-tab/transactions-tab.component.ts

@@ -23,7 +23,7 @@ export class TransactionsTabComponent implements OnInit {
   /** Form control to handle accural parameter */
   hideAccrualsParam: UntypedFormControl;
   /** Columns to be displayed in transactions table. */
-  displayedColumns: string[] = ['id', 'transactionDate', 'transactionType', 'debit', 'credit', 'balance'];
+  displayedColumns: string[] = ['row', 'id', 'transactionDate', 'transactionType', 'debit', 'credit', 'balance'];
   /** Data source for transactions table. */
   dataSource: MatTableDataSource<any>;
 

src/app/loans/loans-view/transactions-tab/transactions-tab.component.html

@@ -13,6 +13,11 @@
 
   <table mat-table [dataSource]="dataSource" matSort>
 
+    <ng-container matColumnDef="row">
+      <th mat-header-cell *matHeaderCellDef mat-sort-header> # </th>
+      <td mat-cell *matCellDef="let idx = index;">{{(idx + 1)}}</td>
+    </ng-container>
+
     <ng-container matColumnDef="id">
       <th mat-header-cell *matHeaderCellDef mat-sort-header> {{"labels.inputs.Id" | translate}} </th>
       <td mat-cell *matCellDef="let transaction" [ngClass]="loanTransactionColor(transaction)"> {{ transaction.id }}

src/app/loans/loans-view/transactions-tab/transactions-tab.component.ts

@@ -27,7 +27,7 @@ export class TransactionsTabComponent implements OnInit {
   /** Stores the status of the loan account */
   status: string;
   /** Columns to be displayed in original schedule table. */
-  displayedColumns: string[] = ['id', 'office', 'externalId', 'date', 'transactionType', 'amount', 'principal', 'interest', 'fee', 'penalties', 'loanBalance', 'actions'];
+  displayedColumns: string[] = ['row', 'id', 'office', 'externalId', 'date', 'transactionType', 'amount', 'principal', 'interest', 'fee', 'penalties', 'loanBalance', 'actions'];
 
   dataSource: MatTableDataSource<any>;
   @ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;

src/app/savings/models/savings-account-transaction.model.ts

@@ -0,0 +1,57 @@
+import { Currency } from 'app/shared/models/general.model';
+
+export interface SavingsAccountTransaction {
+    id:                    number;
+    transactionType:       SavingsAccountTransactionType;
+    entryType:             string;
+    accountId:             number;
+    accountNo:             string;
+    date:                  number[];
+    currency:              Currency;
+    amount:                number;
+    runningBalance:        number;
+    reversed:              boolean;
+    transfer:              Transfer;
+    submittedOnDate:       number[];
+    interestedPostedAsOn:  boolean;
+    submittedByUsername:   string;
+    isManualTransaction:   boolean;
+    isReversal:            boolean;
+    originalTransactionId: number;
+    lienTransaction:       boolean;
+    releaseTransactionId:  number;
+    chargesPaidByData:     any[];
+}
+
+
+export interface SavingsAccountTransactionType {
+    id:                number;
+    code:              string;
+    value:             string;
+    deposit:           boolean;
+    dividendPayout:    boolean;
+    withdrawal:        boolean;
+    interestPosting:   boolean;
+    feeDeduction:      boolean;
+    initiateTransfer:  boolean;
+    approveTransfer:   boolean;
+    withdrawTransfer:  boolean;
+    rejectTransfer:    boolean;
+    overdraftInterest: boolean;
+    writtenoff:        boolean;
+    overdraftFee:      boolean;
+    withholdTax:       boolean;
+    escheat:           boolean;
+    amountHold:        boolean;
+    amountRelease:     boolean;
+    accrual:           boolean;
+}
+
+export interface Transfer {
+    id:                  number;
+    reversed:            boolean;
+    currency:            Currency;
+    transferAmount:      number;
+    transferDate:        number[];
+    transferDescription: string;
+}

src/app/savings/savings-account-view/transactions-tab/transactions-tab.component.html

@@ -7,6 +7,8 @@
         <h3>All Transactions</h3>
       </div>
       <div class="action-button m-b-20" fxLayout="row" fxLayoutGap="20px" *ngIf="checkStatus()">
+        <mat-checkbox [formControl]="hideReversedParam" (click)="hideReversed()" class="accruals">
+          {{"labels.inputs.Hide Reversed" | translate}}</mat-checkbox>
         <mat-checkbox [formControl]="hideAccrualsParam" (click)="hideAccruals()" class="accruals">
           {{"labels.inputs.Hide Accruals" | translate}}</mat-checkbox>
         <button mat-raised-button color="primary" [routerLink]="['/accounting', 'journal-entries']">View Journal Entries</button>
@@ -16,6 +18,11 @@
 
     <table mat-table [dataSource]="dataSource" matSort>
 
+      <ng-container matColumnDef="row">
+        <th mat-header-cell *matHeaderCellDef mat-sort-header> # </th>
+        <td mat-cell *matCellDef="let idx = index;">{{(idx + 1)}}</td>
+      </ng-container>
+
       <ng-container matColumnDef="id">
         <th mat-header-cell *matHeaderCellDef mat-sort-header> Id </th>
         <td mat-cell *matCellDef="let transaction" [ngClass]="{'strike': transaction.reversed}"> {{ transaction.id }} </td>

src/app/savings/savings-account-view/transactions-tab/transactions-tab.component.scss

@@ -23,3 +23,8 @@
     }
   }
 }
+
+.strike {
+  text-decoration: line-through;
+  color: red;
+}

src/app/savings/savings-account-view/transactions-tab/transactions-tab.component.ts

@@ -5,6 +5,7 @@ import { MatPaginator } from '@angular/material/paginator';
 import { MatSort } from '@angular/material/sort';
 import { MatTableDataSource } from '@angular/material/table';
 import { ActivatedRoute, Router } from '@angular/router';
+import { SavingsAccountTransaction } from 'app/savings/models/savings-account-transaction.model';
 
 /**
  * Transactions Tab Component.
@@ -19,13 +20,14 @@ export class TransactionsTabComponent implements OnInit {
   /** Savings Account Status */
   status: any;
   /** Transactions Data */
-  transactionsData: any;
+  transactionsData: SavingsAccountTransaction[] = [];
   /** Temporary Transaction Data */
   tempTransaction: any;
   /** Form control to handle accural parameter */
   hideAccrualsParam: UntypedFormControl;
+  hideReversedParam: UntypedFormControl;
   /** Columns to be displayed in transactions table. */
-  displayedColumns: string[] = ['id', 'date', 'transactionType', 'debit', 'credit', 'balance', 'actions'];
+  displayedColumns: string[] = ['row', 'id', 'date', 'transactionType', 'debit', 'credit', 'balance', 'actions'];
   /** Data source for transactions table. */
   dataSource: MatTableDataSource<any>;
   @ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;
@@ -48,6 +50,7 @@ export class TransactionsTabComponent implements OnInit {
 
   ngOnInit() {
     this.hideAccrualsParam = new UntypedFormControl(false);
+    this.hideReversedParam = new UntypedFormControl(false);
     this.setTransactions();
   }
 
@@ -119,4 +122,19 @@ export class TransactionsTabComponent implements OnInit {
     }
   }
 
+  hideReversed() {
+    let transactions: SavingsAccountTransaction[] = this.transactionsData;
+    if (!this.hideReversedParam.value) {
+      transactions = [];
+      this.transactionsData.forEach((t: SavingsAccountTransaction) => {
+        if (!t.reversed) {
+          transactions.push(t);
+        }
+      });
+    }
+    this.dataSource = new MatTableDataSource(transactions);
+    this.dataSource.paginator = this.paginator;
+    this.dataSource.sort = this.sort;
+  }
+
 }