CBSNexora/cbsnexora
4
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

fix: add recurring and fixed account table in clients view section (#956)

Browse Source 
Fixes: #955
This commit is contained in:
Muskan Khedia
2020-06-30 10:21:48 +05:30
committed by GitHub
parent ce8ca77ad7
commit 7bd84899cf
7 changed files with 300 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/clients/clients-view/general-tab/general-tab.component.html
+260 -24
View File
@@ -14,10 +14,21 @@
<!-- Upcoming Charges -->
<h3>Upcoming Charges</h3>
<button mat-raised-button class="f-right" color="primary" [routerLink]="['../', 'chargeoverview']">Charges Overview</button>
<table mat-table [dataSource]="upcomingCharges">
<div class="headingContent">
<div fxLayout="column" fxFlex="50%">
<div className="headingName">
<h3>Upcoming Charges</h3>
</div>
</div>
<div fxLayout="column" fxFlex="50%">
<div fxLayout="row" fxLayoutAlign="flex-end">
<button mat-raised-button class="f-right" color="primary" [routerLink]="['../', 'chargeoverview']">Charges
Overview</button>
</div>
</div>
</div>
<table mat-table [dataSource]="upcomingCharges">
<ng-container matColumnDef="Name">
<th mat-header-cell *matHeaderCellDef> Name </th>
<td mat-cell *matCellDef="let element"> <i class="fa fa-stop"
@@ -54,10 +65,12 @@
<ng-container matColumnDef="Actions">
<th mat-header-cell *matHeaderCellDef> Actions </th>
<td mat-cell *matCellDef="let element">
<button class="account-action-button" mat-raised-button color="primary" [routerLink]="['../','paycharge',element.id]">
<button class="account-action-button" mat-raised-button color="primary"
[routerLink]="['../','paycharge',element.id]">
<i class="fa fa-dollar"></i>
</button>
<button class="account-action-button" mat-raised-button color="primary" (click)="waiveCharge(element.id,element.clientId)">
<button class="account-action-button" mat-raised-button color="primary"
(click)="waiveCharge(element.id,element.clientId)">
<i class="fa fa-flag"></i>
</button>
</td>
@@ -70,10 +83,19 @@
<!-- loans overview table -->
<h3>Loan Accounts</h3>
<button mat-raised-button class="f-right" color="primary"
(click)="toggleLoanAccountsOverview()">{{showClosedLoanAccounts?'View Active Accounts':'View Closed Accounts'}}</button>
<div class="headingContent">
<div fxLayout="column" fxFlex="50%">
<div class="headingName">
<h3>Loan Accounts</h3>
</div>
</div>
<div fxLayout="column" fxFlex="50%">
<div fxLayout="row" fxLayoutAlign="flex-end">
<button mat-raised-button class="f-right" color="primary"
(click)="toggleLoanAccountsOverview()">{{showClosedLoanAccounts?'View Active Accounts':'View Closed Accounts'}}</button>
</div>
</div>
</div>
<table *ngIf="!showClosedLoanAccounts" mat-table [dataSource]="loanAccounts|accountsFilter:'loan'">
<ng-container matColumnDef="Account No">
@@ -133,7 +155,8 @@
</ng-container>
<tr mat-header-row *matHeaderRowDef="openLoansColumns"></tr>
<tr mat-row *matRowDef="let row; columns: openLoansColumns;" [routerLink]="['/clients', clientid, 'loans', row.id, 'general']" class="select-row"></tr>
<tr mat-row *matRowDef="let row; columns: openLoansColumns;"
[routerLink]="['/clients', clientid, 'loans', row.id, 'general']" class="select-row"></tr>
</table>
<!-- Closed Loan Accounts -->
@@ -186,11 +209,22 @@
<!-- Saving overview Table -->
<div class="headingContent">
<div fxLayout="column" fxFlex="50%">
<div class="headingName">
<h3>Saving Accounts</h3>
</div>
</div>
<div fxLayout="column" fxFlex="50%">
<div fxLayout="row" fxLayoutAlign="flex-end">
<button mat-raised-button class="f-right" color="primary"
(click)="toggleSavingAccountsOverview()">{{showClosedSavingAccounts?'View Active Accounts':'View Closed Accounts'}}</button>
</div>
</div>
</div>
<h3>Saving Accounts</h3>
<button mat-raised-button class="f-right" color="primary"
(click)="toggleSavingAccountsOverview()">{{showClosedSavingAccounts?'View Active Accounts':'View Closed Accounts'}}</button>
<table *ngIf="!showClosedSavingAccounts" mat-table [dataSource]="savingAccounts|accountsFilter:'saving'">
<table *ngIf="!showClosedSavingAccounts" mat-table
[dataSource]="savingAccounts|accountsFilter:'saving':'open':'isSavings'">
<ng-container matColumnDef="Account No">
<th mat-header-cell *matHeaderCellDef> Account No. </th>
@@ -230,12 +264,12 @@
</button>
<button *ngIf="!element.status.submittedAndPendingApproval && !element.status.active"
class="account-action-button" mat-raised-button color="primary"
(click)="routeEdit($event)" [routerLink]="['../','savingsaccounts', element.id, 'actions', 'Undo Approval']">
[routerLink]="['../','savingsaccounts', element.id, 'actions', 'Undo Approval']">
<i class="fa fa-undo"></i>
</button>
<button *ngIf="!element.status.submittedAndPendingApproval && !element.status.active"
class="account-action-button" mat-raised-button color="primary"
(click)="routeEdit($event)" [routerLink]="['../','savingsaccounts', element.id, 'actions', 'Activate']">
[routerLink]="['../','savingsaccounts', element.id, 'actions', 'Activate']">
<i class="fa fa-check-circle"></i>
</button>
</td>
@@ -243,12 +277,14 @@
</ng-container>
<tr mat-header-row *matHeaderRowDef="openSavingsColumns"></tr>
<tr mat-row *matRowDef="let row; columns: openSavingsColumns;" [routerLink]="['../', 'savingsaccounts', row.id, 'transactions']"></tr>
<tr mat-row *matRowDef="let row; columns: openSavingsColumns;"
[routerLink]="['../', 'savingsaccounts', row.id, 'transactions']"></tr>
</table>
<!-- Closed Saving Accounts -->
<table *ngIf="showClosedSavingAccounts" mat-table [dataSource]="savingAccounts|accountsFilter:'saving':'closed'">
<table *ngIf="showClosedSavingAccounts" mat-table
[dataSource]="savingAccounts|accountsFilter:'saving':'closed':'isSavings'">
<ng-container matColumnDef="Account No">
<th mat-header-cell *matHeaderCellDef> Account No. </th>
@@ -270,11 +306,210 @@
<tr mat-row *matRowDef="let row; columns: closedSavingsColumns;"></tr>
</table>
<!-- Shares overview Table -->
<h3>Shares Accounts</h3>
<button mat-raised-button class="f-right" color="primary"
(click)="toggleShareAccountsOverview()">{{showClosedSavingAccounts?'View Active Accounts':'View Closed Accounts'}}</button>
<!-- Fixed Deposit Table -->
<div class="headingContent">
<div fxLayout="column" fxFlex="50%">
<div class="headingName">
<h3>Fixed Deposit Accounts</h3>
</div>
</div>
<div fxLayout="column" fxFlex="50%">
<div fxLayout="row" fxLayoutAlign="flex-end">
<button mat-raised-button class="f-right" color="primary"
(click)="toggleFixedAccountsOverview()">{{showClosedFixedAccounts?'View Active Accounts':'View Closed Accounts'}}</button>
</div>
</div>
</div>
<table *ngIf="!showClosedFixedAccounts" mat-table
[dataSource]="savingAccounts|accountsFilter:'saving':'open':'isFixed'">
<ng-container matColumnDef="Account No">
<th mat-header-cell *matHeaderCellDef> Account No. </th>
<td mat-cell *matCellDef="let element"> <i class="fa fa-stop" [ngClass]="element.status.code|statusLookup"></i>
{{element.accountNo}} </td>
</ng-container>
<ng-container matColumnDef="Saving Account">
<th mat-header-cell *matHeaderCellDef> Saving Account </th>
<td mat-cell *matCellDef="let element"> {{element.productName}} </td>
</ng-container>
<ng-container matColumnDef="Last Active">
<th mat-header-cell *matHeaderCellDef> Last Active </th>
<td mat-cell *matCellDef="let element"> {{element.lastActiveTransactionDate | date}} </td>
</ng-container>
<ng-container matColumnDef="Balance">
<th mat-header-cell *matHeaderCellDef> Balance </th>
<td mat-cell *matCellDef="let element"> {{element.accountBalance}} </td>
</ng-container>
<ng-container matColumnDef="Actions">
<th mat-header-cell *matHeaderCellDef> Actions </th>
<td mat-cell *matCellDef="let element">
<button *ngIf="element.status.active" class="account-action-button" mat-raised-button color="primary">
<i class="fa fa-arrow-up"></i>
</button>
<button *ngIf="element.status.active" class="account-action-button" mat-raised-button color="primary">
<i class="fa fa-arrow-down"></i>
</button>
<button *ngIf="element.status.submittedAndPendingApproval" class="account-action-button" mat-raised-button
color="primary">
<i class="fa fa-check"></i>
</button>
<button *ngIf="!element.status.submittedAndPendingApproval && !element.status.active"
class="account-action-button" mat-raised-button color="primary"
(click)="routeEdit($event)" [routerLink]="['../','savingsaccounts', element.id, 'actions', 'Undo Approval']">
<i class="fa fa-undo"></i>
</button>
<button *ngIf="!element.status.submittedAndPendingApproval && !element.status.active"
class="account-action-button" mat-raised-button color="primary"
(click)="routeEdit($event)" [routerLink]="['../','savingsaccounts', element.id, 'actions', 'Activate']">
<i class="fa fa-check-circle"></i>
</button>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="openSavingsColumns"></tr>
<tr mat-row *matRowDef="let row; columns: openSavingsColumns;"
[routerLink]="['../', 'savingsaccounts', row.id, 'transactions']"></tr>
</table>
<!-- Closed Fixed Deposit Accounts -->
<table *ngIf="showClosedFixedAccounts" mat-table
[dataSource]="savingAccounts|accountsFilter:'saving':'closed':'isFixed'">
<ng-container matColumnDef="Account No">
<th mat-header-cell *matHeaderCellDef> Account No. </th>
<td mat-cell *matCellDef="let element"> <i class="fa fa-stop" [ngClass]="element.status.code|statusLookup"></i>
{{element.accountNo}} </td>
</ng-container>
<ng-container matColumnDef="Saving Account">
<th mat-header-cell *matHeaderCellDef> Saving Account </th>
<td mat-cell *matCellDef="let element"> {{element.productName}} </td>
</ng-container>
<ng-container matColumnDef="Closed Date">
<th mat-header-cell *matHeaderCellDef> Closed Date </th>
<td mat-cell *matCellDef="let element">{{element.timeline.closedOnDate | date}}</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="closedSavingsColumns"></tr>
<tr mat-row *matRowDef="let row; columns: closedSavingsColumns;"></tr>
</table>
<!-- Recurring Deposit Table -->
<div class="headingContent">
<div fxLayout="column" fxFlex="50%">
<div class="headingName">
<h3>Recurring Deposit Accounts</h3>
</div>
</div>
<div fxLayout="column" fxFlex="50%">
<div fxLayout="row" fxLayoutAlign="flex-end">
<button mat-raised-button class="f-right" color="primary"
(click)="toggleRecurringAccountsOverview()">{{showClosedRecurringAccounts?'View Active Accounts':'View Closed Accounts'}}</button>
</div>
</div>
</div>
<table *ngIf="!showClosedRecurringAccounts" mat-table
[dataSource]="savingAccounts|accountsFilter:'saving':'open':'isRecurring'">
<ng-container matColumnDef="Account No">
<th mat-header-cell *matHeaderCellDef> Account No. </th>
<td mat-cell *matCellDef="let element"> <i class="fa fa-stop" [ngClass]="element.status.code|statusLookup"></i>
{{element.accountNo}} </td>
</ng-container>
<ng-container matColumnDef="Saving Account">
<th mat-header-cell *matHeaderCellDef> Saving Account </th>
<td mat-cell *matCellDef="let element"> {{element.productName}} </td>
</ng-container>
<ng-container matColumnDef="Last Active">
<th mat-header-cell *matHeaderCellDef> Last Active </th>
<td mat-cell *matCellDef="let element"> {{element.lastActiveTransactionDate | date}} </td>
</ng-container>
<ng-container matColumnDef="Balance">
<th mat-header-cell *matHeaderCellDef> Balance </th>
<td mat-cell *matCellDef="let element"> {{element.accountBalance}} </td>
</ng-container>
<ng-container matColumnDef="Actions">
<th mat-header-cell *matHeaderCellDef> Actions </th>
<td mat-cell *matCellDef="let element">
<button *ngIf="element.status.active" class="account-action-button" mat-raised-button color="primary">
<i class="fa fa-arrow-up"></i>
</button>
<button *ngIf="element.status.active" class="account-action-button" mat-raised-button color="primary">
<i class="fa fa-arrow-down"></i>
</button>
<button *ngIf="element.status.submittedAndPendingApproval" class="account-action-button" mat-raised-button
color="primary">
<i class="fa fa-check"></i>
</button>
<button *ngIf="!element.status.submittedAndPendingApproval && !element.status.active"
class="account-action-button" mat-raised-button color="primary">
<i class="fa fa-undo"></i>
</button>
<button *ngIf="!element.status.submittedAndPendingApproval && !element.status.active"
class="account-action-button" mat-raised-button color="primary">
<i class="fa fa-check-circle"></i>
</button>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="openSavingsColumns"></tr>
<tr mat-row *matRowDef="let row; columns: openSavingsColumns;"
[routerLink]="['../', 'savingsaccounts', row.id, 'transactions']"></tr>
</table>
<!-- Closed Recurring Deposit Accounts -->
<table *ngIf="showClosedRecurringAccounts" mat-table
[dataSource]="savingAccounts|accountsFilter:'saving':'closed':'isRecurring'">
<ng-container matColumnDef="Account No">
<th mat-header-cell *matHeaderCellDef> Account No. </th>
<td mat-cell *matCellDef="let element"> <i class="fa fa-stop" [ngClass]="element.status.code|statusLookup"></i>
{{element.accountNo}} </td>
</ng-container>
<ng-container matColumnDef="Saving Account">
<th mat-header-cell *matHeaderCellDef> Saving Account </th>
<td mat-cell *matCellDef="let element"> {{element.productName}} </td>
</ng-container>
<ng-container matColumnDef="Closed Date">
<th mat-header-cell *matHeaderCellDef> Closed Date </th>
<td mat-cell *matCellDef="let element">{{element.timeline.closedOnDate | date}}</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="closedSavingsColumns"></tr>
<tr mat-row *matRowDef="let row; columns: closedSavingsColumns;"></tr>
</table>
<!-- Shares overview Table -->
<div class="headingContent">
<div fxLayout="column" fxFlex="50%">
<div class="headingName">
<h3>Shares Accounts</h3>
</div>
</div>
<div fxLayout="column" fxFlex="50%">
<div fxLayout="row" fxLayoutAlign="flex-end">
<button mat-raised-button class="f-right" color="primary"
(click)="toggleShareAccountsOverview()">{{showClosedSavingAccounts?'View Active Accounts':'View Closed Accounts'}}</button>
</div>
</div>
</div>
<table *ngIf="!showClosedShareAccounts" mat-table [dataSource]="shareAccounts|accountsFilter:'share'">
<ng-container matColumnDef="Account No">
@@ -318,7 +553,8 @@
</ng-container>
<tr mat-header-row *matHeaderRowDef="openSharesColumns"></tr>
<tr mat-row *matRowDef="let row; columns: openSharesColumns;" [routerLink]="['../', 'sharesaccounts', row.id, 'transactions']"></tr>
<tr mat-row *matRowDef="let row; columns: openSharesColumns;"
[routerLink]="['../', 'sharesaccounts', row.id, 'transactions']"></tr>
</table>
<!-- Closed Share Accounts -->
<table *ngIf="showClosedShareAccounts" mat-table [dataSource]="shareAccounts|accountsFilter:'share':'closed'">
@@ -353,4 +589,4 @@
<tr mat-row *matRowDef="let row; columns: closedSharesColumns;"></tr>
</table>
</div>
</div>
src/app/clients/clients-view/general-tab/general-tab.component.scss
+9
View File
@@ -25,3 +25,12 @@
}
}
.headingContent{
margin-bottom: 1%;
margin-top: 1%;
}
.headingName {
display: block;
}
src/app/clients/clients-view/general-tab/general-tab.component.ts
+11
View File
@@ -31,6 +31,9 @@ export class GeneralTabComponent {
showClosedLoanAccounts = false;
showClosedSavingAccounts = false;
showClosedShareAccounts = false;
showClosedRecurringAccounts = false;
showClosedFixedAccounts = false;
clientid: any;
constructor(
@@ -59,6 +62,14 @@ export class GeneralTabComponent {
this.showClosedShareAccounts = !this.showClosedShareAccounts;
}
toggleRecurringAccountsOverview() {
this.showClosedRecurringAccounts = !this.showClosedRecurringAccounts;
}
toggleFixedAccountsOverview() {
this.showClosedFixedAccounts = !this.showClosedFixedAccounts;
}
/**
* Waive Charge.
* @param chargeId Selected Charge Id.
src/app/navigation/loan-account-table/loan-account-table.component.ts
+2 -2
View File
@@ -29,7 +29,7 @@ export class LoanAccountTableComponent implements OnInit {
/** Loan Account Setter */
@Input() set loanAccountData(data: any) {
this.accountData = data;
const filteredAccountData = this.accountsFilterPipe.transform(data, 'loan', this.showClosed ? 'closed' : 'open');
const filteredAccountData = this.accountsFilterPipe.transform(data, 'loan', this.showClosed ? 'closed' : 'open', 'isLoan');
this.dataSource = new MatTableDataSource(filteredAccountData);
this.dataSource.paginator = this.paginator;
this.dataSource.sort = this.sort;
@@ -56,7 +56,7 @@ export class LoanAccountTableComponent implements OnInit {
*/
toggleClosed() {
this.showClosed = !this.showClosed;
const filteredAccountData = this.accountsFilterPipe.transform(this.accountData, 'loan', this.showClosed ? 'closed' : 'open');
const filteredAccountData = this.accountsFilterPipe.transform(this.accountData, 'loan', this.showClosed ? 'closed' : 'open', 'isLoan');
this.dataSource = new MatTableDataSource(filteredAccountData);
this.dataSource.paginator = this.paginator;
this.dataSource.sort = this.sort;
src/app/navigation/savings-account-table/savings-account-table.component.ts
+2 -2
View File
@@ -29,7 +29,7 @@ export class SavingsAccountTableComponent implements OnInit {
/** Savings Account Setter */
@Input() set savingsAccountData(data: any) {
this.accountData = data;
const filteredAccountData = this.accountsFilterPipe.transform(data, 'saving', this.showClosed ? 'closed' : 'open');
const filteredAccountData = this.accountsFilterPipe.transform(data, 'saving', this.showClosed ? 'closed' : 'open', 'isSavings');
this.dataSource = new MatTableDataSource(filteredAccountData);
this.dataSource.paginator = this.paginator;
this.dataSource.sort = this.sort;
@@ -56,7 +56,7 @@ export class SavingsAccountTableComponent implements OnInit {
*/
toggleClosed() {
this.showClosed = !this.showClosed;
const filteredAccountData = this.accountsFilterPipe.transform(this.accountData, 'saving', this.showClosed ? 'closed' : 'open');
const filteredAccountData = this.accountsFilterPipe.transform(this.accountData, 'saving', this.showClosed ? 'closed' : 'open', 'isSavings');
this.dataSource = new MatTableDataSource(filteredAccountData);
this.dataSource.paginator = this.paginator;
this.dataSource.sort = this.sort;
src/app/navigation/share-account-table/share-account-table.component.ts
+2 -2
View File
@@ -29,7 +29,7 @@ export class ShareAccountTableComponent implements OnInit {
/** Share Account Setter */
@Input() set shareAccountData(data: any) {
this.accountData = data;
const filteredAccountData = this.accountsFilterPipe.transform(data, 'share', this.showClosed ? 'closed' : 'open');
const filteredAccountData = this.accountsFilterPipe.transform(data, 'share', this.showClosed ? 'closed' : 'open', 'isShare');
this.dataSource = new MatTableDataSource(filteredAccountData);
this.dataSource.paginator = this.paginator;
this.dataSource.sort = this.sort;
@@ -56,7 +56,7 @@ export class ShareAccountTableComponent implements OnInit {
*/
toggleClosed() {
this.showClosed = !this.showClosed;
const filteredAccountData = this.accountsFilterPipe.transform(this.accountData, 'share', this.showClosed ? 'closed' : 'open');
const filteredAccountData = this.accountsFilterPipe.transform(this.accountData, 'share', this.showClosed ? 'closed' : 'open', 'isShare');
this.dataSource = new MatTableDataSource(filteredAccountData);
this.dataSource.paginator = this.paginator;
this.dataSource.sort = this.sort;
src/app/pipes/accounts-filter.pipe.ts
+14 -1
View File
@@ -5,7 +5,7 @@ import { Pipe, PipeTransform } from '@angular/core';
})
export class AccountsFilterPipe implements PipeTransform {
transform(accounts: any, type: any, status: any): any {
transform(accounts: any, type: any, status: any, checkSavings: any): any {
if (accounts) {
if (type === 'loan') {
if (status === 'closed') {
@@ -27,6 +27,19 @@ export class AccountsFilterPipe implements PipeTransform {
}
}
if (type === 'saving') {
if (checkSavings === 'isFixed') {
accounts = accounts.filter((account: any) => {
return (account.depositType.value === 'Fixed Deposit');
});
} else if (checkSavings === 'isRecurring') {
accounts = accounts.filter((account: any) => {
return (account.depositType.value === 'Recurring Deposit');
});
} else if (checkSavings === 'isSavings') {
accounts = accounts.filter((account: any) => {
return (account.depositType.value === 'Savings');
});
}
if (status === 'closed') {
accounts = accounts.filter((account: any) => {
return (account.status.code === 'savingsAccountStatusType.withdrawn.by.applicant' ||