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

Clients search enhancement (#1605)

Browse Source 
Co-authored-by: Jose Alberto Hernandez <alberto@MacBook-Pro.local>
This commit is contained in:
José Alberto Hernández
2022-12-26 14:25:49 -06:00
committed by GitHub
co-authored by Jose Alberto Hernandez
parent 475059a974
commit d0dc2aabb2
29 changed files with 514 additions and 234 deletions
Download Patch File Download Diff File Expand all files Collapse all files
angular.json
+28 -14
View File
@@ -11,6 +11,9 @@
"schematics": {
"@schematics/angular:component": {
"style": "scss"
},
"@schematics/angular:application": {
"strict": true
}
},
"architect": {
@@ -72,28 +75,35 @@
"configurations": {
"production": {
"budgets": [
{
"type": "initial",
"maximumWarning": "500kb",
"maximumError": "1mb"
},
{
"type": "anyComponentStyle",
"maximumWarning": "6kb"
"maximumWarning": "2kb",
"maximumError": "4kb"
}
],
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"namedChunks": false,
"aot": true,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"serviceWorker": false,
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
]
],
"outputHashing": "all"
},
"development": {
"buildOptimizer": false,
"optimization": false,
"vendorChunk": true,
"extractLicenses": false,
"sourceMap": true,
"namedChunks": true
}
}
},
"defaultConfiguration": "production"
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
@@ -101,10 +111,14 @@
"browserTarget": "mifosx-web-app:build"
},
"configurations": {
"development": {
"browserTarget": "mifosx-web-app:build:development"
},
"production": {
"browserTarget": "mifosx-web-app:build:production"
}
}
},
"defaultConfiguration": "development"
},
"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n",
@@ -259,4 +273,4 @@
}
},
"defaultProject": "mifosx-web-app"
}
}
src/app/clients/clients.component.html
+35 -32
View File
@@ -1,41 +1,47 @@
<mat-card class="container">
<div fxLayout="row" fxLayoutAlign="start center">
<div class="search-box">
<mat-form-field>
<input matInput placeholder="Search by client name" (keyup)="applyFilter($event.target.value)">
<div class="search-box m-r-30">
<mat-form-field class="search-box">
<input matInput placeholder="Search by client name, external Id, mobile" class="search-box" (keydown.enter)="search($event.target.value)">
</mat-form-field>
<mat-checkbox #showClosedAccounts labelPosition="after">Show Closed Accounts
</div>
<div class="filter-box" *ngIf="existsClientsToFilter">
<mat-form-field class="filter-box m-r-30">
<input matInput placeholder="Filter by client name or external Id" class="filter-box" (keyup)="applyFilter($event.target.value)">
</mat-form-field>
<mat-checkbox #showClosedAccounts labelPosition="after" class="m-r-10">Show Closed Accounts
</mat-checkbox>
</div>
<div class="action-button" fxLayoutGap="25px">
<button mat-raised-button color="primary" [routerLink]="['../', 'organization', 'bulk-import', 'Clients']" *mifosxHasPermission="'CREATE_CLIENT'">
<fa-icon icon="download"></fa-icon>&nbsp;&nbsp;Import Client
<fa-icon icon="download" class="m-r-10"></fa-icon>Import Client
</button>
<button mat-raised-button color="primary" [routerLink]="['create']" *mifosxHasPermission="'CREATE_CLIENT'">
<fa-icon icon="plus"></fa-icon>&nbsp;&nbsp;Create Client
<fa-icon icon="plus" class="m-r-10"></fa-icon>Create Client
</button>
</div>
</div>
<div>
<div *ngIf="existsClientsToFilter">
<table mat-table [dataSource]="dataSource" matSort>
<!-- Name Column -->
<ng-container matColumnDef="name">
<th mat-header-cell *matHeaderCellDef mat-sort-header="displayName"> Name </th>
<td mat-cell *matCellDef="let row"> {{row.displayName}} </td>
<td mat-cell *matCellDef="let row"> {{row.entityName}} </td>
</ng-container>
<!-- Account no Column -->
<ng-container matColumnDef="clientno">
<th mat-header-cell *matHeaderCellDef mat-sort-header="accountNo"> Account # </th>
<td mat-cell *matCellDef="let row"> {{row.accountNo}} </td>
<ng-container matColumnDef="clientNo">
<th mat-header-cell *matHeaderCellDef mat-sort-header="accountNo"> Account No. </th>
<td mat-cell *matCellDef="let row"> {{row.entityAccountNo}} </td>
</ng-container>
<!-- External ID Column -->
<ng-container matColumnDef="externalid">
<th mat-header-cell *matHeaderCellDef mat-sort-header="externalId"> ExternalID </th>
<ng-container matColumnDef="externalId">
<th mat-header-cell *matHeaderCellDef mat-sort-header="externalId"> External Id </th>
<td mat-cell *matCellDef="let row">
<mifosx-external-identifier externalId="{{row.externalId}}"></mifosx-external-identifier>
<mifosx-external-identifier externalId="{{row.entityExternalId}}"></mifosx-external-identifier>
</td>
</ng-container>
@@ -43,43 +49,40 @@
<ng-container matColumnDef="status">
<th mat-header-cell *matHeaderCellDef> Status </th>
<td mat-cell *matCellDef="let row">
<div [ngClass]="row.status.code | statusLookup">
<div [ngClass]="row.entityStatus.code | statusLookup">
<fa-icon icon="stop"></fa-icon>
<span class="m-l-10 status">
{{ row.entityStatus.value | translate }}
</span>
</div>
</td>
</ng-container>
<!-- Mobile Number Column-->
<ng-container matColumnDef="mobileNo">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Mobile Number </th>
<td mat-cell *matCellDef="let client"> {{ client.mobileNo }} </td>
</ng-container>
<!--Gender column-->
<ng-container matColumnDef="gender">
<th mat-header-cell *matHeaderCellDef> Gender </th>
<td mat-cell *matCellDef="let client"> {{ client.gender.name }} </td>
</ng-container>
<!-- Color Column -->
<ng-container matColumnDef="office">
<th mat-header-cell *matHeaderCellDef mat-sort-header="officeName"> OfficeName </th>
<td mat-cell *matCellDef="let row"> {{row.officeName}} </td>
<th mat-header-cell *matHeaderCellDef mat-sort-header="officeName"> Office Name </th>
<td mat-cell *matCellDef="let row"> {{row.parentName}} </td>
</ng-container>
<!-- ID Column -->
<ng-container matColumnDef="staff">
<th mat-header-cell *matHeaderCellDef mat-sort-header="staffName"> StaffName </th>
<th mat-header-cell *matHeaderCellDef mat-sort-header="staffName"> Staff Name </th>
<td mat-cell *matCellDef="let row"> {{row.staffName}} </td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;" [routerLink]="[row.id,'general']" class="select-row">
<tr mat-row *matRowDef="let row; columns: displayedColumns;" [routerLink]="[row.entityId,'general']" class="select-row">
</tr>
</table>
<mat-paginator [length]="dataSource?.records$ | async" [pageSize]="100" [pageSizeOptions]="[10, 25, 50, 100]"
<mat-paginator [pageSize]="50" [pageSizeOptions]="[10, 25, 50, 100]"
showFirstLastButtons></mat-paginator>
</div>
<div class="alert" *ngIf="notExistsClientsToFilter">
<div class="message">
<i class="fa fa-exclamation-circle alert-check"></i>
No client was found
</div>
</div>
</mat-card>
src/app/clients/clients.component.scss
+10
View File
@@ -6,6 +6,12 @@
min-width: 30px;
margin: 4px;
}
.search-box {
min-width: 320px;
}
.filter-box {
min-width: 280px;
}
}
table {
@@ -16,3 +22,7 @@ table {
color : black;
}
}
.status {
color: black;
}
src/app/clients/clients.component.ts
+22 -50
View File
@@ -1,72 +1,34 @@
/** Angular Imports. */
import { Component, OnInit, ViewChild, AfterViewInit } from '@angular/core';
import { Component, OnInit, ViewChild } from '@angular/core';
import { MatCheckbox } from '@angular/material/checkbox';
import { MatPaginator } from '@angular/material/paginator';
import { MatSort } from '@angular/material/sort';
import { ClientsDataSource } from './clients.datasource';
/** rxjs Imports */
import { merge } from 'rxjs';
import { tap } from 'rxjs/operators';
import { MatTableDataSource } from '@angular/material/table';
/** Custom Services */
import { ClientsService } from './clients.service';
import { SearchService } from 'app/search/search.service';
@Component({
selector: 'mifosx-clients',
templateUrl: './clients.component.html',
styleUrls: ['./clients.component.scss'],
})
export class ClientsComponent implements OnInit, AfterViewInit {
export class ClientsComponent implements OnInit {
@ViewChild('showClosedAccounts', { static: true }) showClosedAccounts: MatCheckbox;
displayedColumns = ['name', 'clientNo', 'externalId', 'status', 'office', 'staff'];
dataSource: MatTableDataSource<any>;
displayedColumns = ['name', 'clientno', 'externalid', 'status', 'mobileNo', 'gender', 'office', 'staff'];
dataSource: ClientsDataSource;
/** Get the required filter value. */
searchValue = '';
existsClientsToFilter = false;
notExistsClientsToFilter = false;
moreClientsToFilter = false;
@ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;
@ViewChild(MatSort, { static: true }) sort: MatSort;
constructor(private clientsService: ClientsService) {
}
constructor(private searchService: SearchService) { }
ngOnInit() {
this.getClients();
}
ngAfterViewInit() {
this.sort.sortChange.subscribe(() => this.paginator.pageIndex = 0);
merge(this.sort.sortChange, this.paginator.page, this.showClosedAccounts.change)
.pipe(
tap(() => this.loadClientsPage())
)
.subscribe();
}
/**
* Loads a page of journal entries.
*/
loadClientsPage() {
if (!this.sort.direction) {
delete this.sort.active;
}
if (this.searchValue !== '') {
this.applyFilter(this.searchValue);
} else {
this.dataSource.getClients(this.sort.active, this.sort.direction, this.paginator.pageIndex, this.paginator.pageSize, this.showClosedAccounts.checked);
}
}
/**
* Initializes the data source for clients table and loads the first page.
*/
getClients() {
this.dataSource = new ClientsDataSource(this.clientsService);
this.dataSource.getClients(this.sort.active, this.sort.direction, this.paginator.pageIndex, this.paginator.pageSize, this.showClosedAccounts.checked);
}
/**
@@ -74,8 +36,18 @@ export class ClientsComponent implements OnInit, AfterViewInit {
* @param {string} filterValue Value to filter data.
*/
applyFilter(filterValue: string = '') {
this.searchValue = filterValue;
this.dataSource.filterClients(filterValue.trim().toLowerCase(), this.sort.active, this.sort.direction, this.paginator.pageIndex, this.paginator.pageSize, this.showClosedAccounts.checked);
this.dataSource.filter = filterValue.trim().toLowerCase();
}
/**
* Searches server for query and resource.
*/
search(value: string) {
this.searchService.getSearchResults(value, 'clients').subscribe((data: any) => {
this.dataSource = new MatTableDataSource(data);
this.existsClientsToFilter = (data.length > 0);
this.notExistsClientsToFilter = !this.existsClientsToFilter;
this.moreClientsToFilter = (data.length > 50);
});
}
}
src/app/clients/clients.datasource.ts
-85
View File
@@ -1,85 +0,0 @@
/** Angular Imports */
import { CollectionViewer, DataSource } from '@angular/cdk/collections';
/** rxjs Imports */
import { Observable, BehaviorSubject } from 'rxjs';
/** Custom Services */
import { ClientsService } from './clients.service';
/**
* Clients custom data source to implement server side filtering, pagination and sorting.
*/
export class ClientsDataSource implements DataSource<any> {
/** clients behavior subject to represent loaded journal clients page. */
private clientsSubject = new BehaviorSubject<any[]>([]);
/** Records subject to represent total number of filtered clients records. */
private recordsSubject = new BehaviorSubject<number>(0);
/** Records observable which can be subscribed to get the value of total number of filtered clients records. */
public records$ = this.recordsSubject.asObservable();
/**
* @param {ClientsService} clientsService Clients Service
*/
constructor(private clientsService: ClientsService) { }
/**
* Gets clients on the basis of provided parameters and emits the value.
* @param {any} filterBy Properties by which clients should be filtered.
* @param {string} orderBy Property by which clients should be sorted.
* @param {string} sortOrder Sort order: ascending or descending.
* @param {number} pageIndex Page number.
* @param {number} limit Number of clients within the page.
*/
getClients(orderBy: string = '', sortOrder: string = '', pageIndex: number = 0, limit: number = 10, showClosedAccounts: boolean = true) {
this.clientsSubject.next([]);
this.clientsService.getClients(orderBy, sortOrder, pageIndex * limit, limit)
.subscribe((clients: any) => {
if (showClosedAccounts) {
clients.pageItems = clients.pageItems;
} else {
clients.pageItems = clients.pageItems.filter((client: any) => client.status.value !== 'Closed');
}
this.recordsSubject.next(clients.totalFilteredRecords);
this.clientsSubject.next(clients.pageItems);
});
}
/**
* @param {CollectionViewer} collectionViewer
*/
connect(collectionViewer: CollectionViewer): Observable<any[]> {
return this.clientsSubject.asObservable();
}
/**
* @param {CollectionViewer} collectionViewer
*/
disconnect(collectionViewer: CollectionViewer): void {
this.clientsSubject.complete();
this.recordsSubject.complete();
}
/** Filter Active Client Data.
* @param {string} filterValue Filter Value which clients should be filtered.
* @param {string} orderBy Property by which clients should be sorted.
* @param {string} sortOrder Sort order: ascending or descending.
* @param {number} pageIndex Page number.
* @param {number} limit Number of clients within the page.
*/
filterClients(filter: string, orderBy: string = '', sortOrder: string = '', pageIndex: number = 0, limit: number = 10, showClosedAccounts: boolean = true) {
this.clientsSubject.next([]);
this.clientsService.getClients(orderBy, sortOrder, pageIndex * limit, limit)
.subscribe((clients: any) => {
if (showClosedAccounts) {
clients.pageItems = clients.pageItems.filter((client: any) => client.displayName.toLowerCase().includes(filter));
} else {
clients.pageItems = clients.pageItems.filter((client: any) => client.status.value !== 'Closed' && client.displayName.toLowerCase().includes(filter));
}
this.recordsSubject.next(clients.totalFilteredRecords);
this.clientsSubject.next(clients.pageItems);
});
}
}
src/app/loans/create-loans-account/create-loans-account.component.html
+4 -4
View File
@@ -26,7 +26,7 @@
<ng-template matStepLabel>DETAILS</ng-template>
<mifosx-loans-account-details-step [loansAccountTemplate]="loansAccountTemplate"
(loansAccountProductTemplate)="setTemplate($event)">
(loansAccountProductTemplate)="setTemplate($event)" #loansAccountDetailsForm>
</mifosx-loans-account-details-step>
</mat-step>
@@ -35,7 +35,7 @@
<ng-template matStepLabel>TERMS</ng-template>
<mifosx-loans-account-terms-step [loansAccountProductTemplate]="loansAccountProductTemplate"
<mifosx-loans-account-terms-step #loanAccountTerms [loansAccountProductTemplate]="loansAccountProductTemplate"
[loansAccountTemplate] = "loansAccountTemplate" [collateralOptions]="collateralOptions"
[loansAccountFormValid]="loansAccountFormValid" [loanPrincipal]="loanPrincipal">
</mifosx-loans-account-terms-step>
@@ -46,7 +46,7 @@
<ng-template matStepLabel>CHARGES</ng-template>
<mifosx-loans-account-charges-step [loansAccountProductTemplate]="loansAccountProductTemplate"
<mifosx-loans-account-charges-step #loanAccountCharges [loansAccountProductTemplate]="loansAccountProductTemplate"
[loansAccountTemplate]="loansAccountTemplate"
[loansAccountFormValid]="loansAccountFormValid">
</mifosx-loans-account-charges-step>
@@ -57,7 +57,7 @@
<ng-template matStepLabel>REPAYMENT SCHEDULE</ng-template>
<mifosx-loans-account-schedule-step [loansAccountTemplate]="loansAccountTemplate"
<mifosx-loans-account-schedule-step #loanAccountSchedule [loansAccountTemplate]="loansAccountTemplate"
[loansAccountProductTemplate]="loansAccountProductTemplate" [loansAccount]="loansAccount">
</mifosx-loans-account-schedule-step>
src/app/loans/loans-account-stepper/loans-account-details-step/loans-account-details-step.component.ts
+2 -2
View File
@@ -56,10 +56,10 @@ export class LoansAccountDetailsStepComponent implements OnInit {
private route: ActivatedRoute,
private settingsService: SettingsService) {
this.loanId = this.route.snapshot.params['loanId'];
this.createLoansAccountDetailsForm();
}
ngOnInit() {
this.createLoansAccountDetailsForm();
this.maxDate = this.settingsService.maxFutureDate;
this.buildDependencies();
if (this.loansAccountTemplate) {
@@ -87,7 +87,7 @@ export class LoansAccountDetailsStepComponent implements OnInit {
'loanOfficerId': [''],
'loanPurposeId': [''],
'fundId': [''],
'submittedOnDate': [new Date(), Validators.required],
'submittedOnDate': [this.settingsService.businessDate, Validators.required],
'expectedDisbursementDate': ['', Validators.required],
'externalId': [''],
'linkAccountId': [''],
src/app/loans/loans-view/loan-account-actions/make-repayment/make-repayment.component.html
+34
View File
@@ -19,6 +19,40 @@
</mat-error>
</mat-form-field>
<div fxLayout="row wrap" class="content">
<div fxFlex="50%" class="mat-body-strong">
{{ 'Principal' | translate }}
</div>
<div fxFlex="50%" class="r-amount">
{{ dataObject.principalPortion | number }}
</div>
<div fxFlex="50%" class="mat-body-strong">
{{ 'Interest' | translate }}
</div>
<div fxFlex="50%" class="r-amount">
{{ dataObject.interestPortion | number }}
</div>
<div fxFlex="50%" class="mat-body-strong">
{{ 'Fees' | translate }}
</div>
<div fxFlex="50%" class="r-amount">
{{ dataObject.feeChargesPortion | number }}
</div>
<div fxFlex="50%" class="mat-body-strong">
{{ 'Penalties' | translate }}
</div>
<div fxFlex="50%" class="r-amount">
{{ dataObject.penaltyChargesPortion | number }}
</div>
</div>
<mat-form-field>
<mat-label>Transaction Amount</mat-label>
<input type="number" matInput required formControlName="transactionAmount">
src/app/loans/loans-view/loan-account-actions/prepay-loan/prepay-loan.component.html
+34 -13
View File
@@ -19,6 +19,40 @@
</mat-error>
</mat-form-field>
<div fxLayout="row wrap" class="content">
<div fxFlex="50%" class="mat-body-strong">
{{ 'Principal' | translate }}
</div>
<div fxFlex="50%" class="r-amount">
{{ dataObject.principalPortion | number }}
</div>
<div fxFlex="50%" class="mat-body-strong">
{{ 'Interest' | translate }}
</div>
<div fxFlex="50%" class="r-amount">
{{ dataObject.interestPortion | number }}
</div>
<div fxFlex="50%" class="mat-body-strong">
{{ 'Fees' | translate }}
</div>
<div fxFlex="50%" class="r-amount">
{{ dataObject.feeChargesPortion | number }}
</div>
<div fxFlex="50%" class="mat-body-strong">
{{ 'Penalties' | translate }}
</div>
<div fxFlex="50%" class="r-amount">
{{ dataObject.penaltyChargesPortion | number }}
</div>
</div>
<mat-form-field>
<mat-label>Transaction Amount</mat-label>
<input type="number" matInput required formControlName="transactionAmount">
@@ -27,19 +61,6 @@
</mat-error>
</mat-form-field>
<mat-form-field>
<mat-label>Principal</mat-label>
<input matInput formControlName="principal">
</mat-form-field>
<mat-form-field>
<mat-label>Interest Amount</mat-label>
<input matInput required formControlName="interestAmount">
<mat-error *ngIf="prepayLoanForm.controls.interestAmount.hasError('required')">
Interest Amount <strong>is required</strong>
</mat-error>
</mat-form-field>
<mat-form-field>
<mat-label>External Id</mat-label>
<input matInput formControlName="externalId">
src/app/loans/loans-view/loan-account-actions/prepay-loan/prepay-loan.component.ts
+1 -5
View File
@@ -70,8 +70,6 @@ export class PrepayLoanComponent implements OnInit {
this.prepayLoanForm = this.formBuilder.group({
'transactionDate': [new Date(), Validators.required],
'transactionAmount': ['', Validators.required],
'principal': [{value: '', disabled: true}],
'interestAmount': [{value: '', disabled: true}, Validators.required],
'externalId': [''],
'paymentTypeId': [''],
'note': ['']
@@ -84,9 +82,7 @@ export class PrepayLoanComponent implements OnInit {
setPrepayLoanDetails() {
this.paymentTypes = this.dataObject.paymentTypeOptions;
this.prepayLoanForm.patchValue({
transactionAmount: this.dataObject.amount,
principal: this.dataObject.principalPortion,
interestAmount: this.dataObject.interestPortion,
transactionAmount: this.dataObject.amount
});
}
src/app/loans/loans-view/loans-view.component.html
+2
View File
@@ -50,6 +50,8 @@
</span>
</div>
<span fxFlex="auto"></span>
<div fxFlex="4%">
<button mat-icon-button [matMenuTriggerFor]="accountMenu" aria-label="Loan account actions"
yPosition="below">
src/app/loans/loans-view/repayment-schedule-tab/repayment-schedule-tab.component.ts
+1 -1
View File
@@ -23,7 +23,7 @@ export class RepaymentScheduleTabComponent implements OnInit {
*/
constructor(private route: ActivatedRoute) {
this.route.parent.data.subscribe((data: { loanDetailsData: any }) => {
this.loanDetailsDataRepaymentSchedule = data.loanDetailsData.repaymentSchedule;
this.loanDetailsDataRepaymentSchedule = data.loanDetailsData ? data.loanDetailsData.repaymentSchedule : [];
});
}
src/app/products/charges/create-charge/create-charge.component.ts
+2 -1
View File
@@ -129,7 +129,8 @@ export class CreateChargeComponent implements OnInit {
return false;
}
if (this.chargeForm.get('chargeAppliesTo').value === 2) {
if (!(this.chargeForm.get('chargeTimeType').value === 5 || this.chargeForm.get('chargeTimeType').value === 16) && chargeCalculationType.id === 2) {
if (!(this.chargeForm.get('chargeTimeType').value === 5 || this.chargeForm.get('chargeTimeType').value === 16
|| this.chargeForm.get('chargeTimeType').value === 17) && chargeCalculationType.id === 2) {
return false;
}
}
src/app/savings/saving-account-actions/close-savings-account/close-savings-account.component.ts
+1 -1
View File
@@ -128,7 +128,7 @@ export class CloseSavingsAccountComponent implements OnInit {
locale
};
this.savingsService.executeSavingsAccountCommand(this.accountId, 'close', data).subscribe(() => {
this.router.navigate(['../../'], { relativeTo: this.route });
this.router.navigate(['../../transactions'], { relativeTo: this.route });
});
}
src/app/savings/saving-account-actions/manage-savings-account/manage-savings-account.component.html
+54
View File
@@ -0,0 +1,54 @@
<div class="container mat-elevation-z8">
<mat-card>
<h2 mat-title *ngIf="transactionType.holdamount">Hold Amount</h2>
<h2 mat-title *ngIf="transactionType.blockaccount">Block Savings Account</h2>
<h2 mat-title *ngIf="transactionType.unblockaccount">Unblock Savings Account</h2>
<form [formGroup]="manageSavingsAccountForm" (ngSubmit)="submit()">
<mat-card-content fxLayout="column">
<mat-form-field>
<mat-label>Reason</mat-label>
<mat-select required formControlName="reasonForBlock">
<mat-option *ngFor="let codeValue of reasonOptions" [value]="codeValue.id">
{{ codeValue.name }}
</mat-option>
</mat-select>
<mat-error *ngIf="manageSavingsAccountForm.controls.reasonForBlock.hasError('required')">
Reason is <strong>required</strong>
</mat-error>
</mat-form-field>
<mat-form-field fxFlex (click)="transactionDatePicker.open()" *ngIf="transactionType.holdamount">
<mat-label>Transaction Date</mat-label>
<input matInput [min]="minDate" [max]="maxDate" [matDatepicker]="transactionDatePicker" required formControlName="transactionDate">
<mat-datepicker-toggle matSuffix [for]="transactionDatePicker"></mat-datepicker-toggle>
<mat-datepicker #transactionDatePicker></mat-datepicker>
<mat-error *ngIf="manageSavingsAccountForm.controls.transactionDate.hasError('required')">
Transaction Date is <strong>required</strong>
</mat-error>
</mat-form-field>
<mat-form-field *ngIf="transactionType.holdamount">
<mat-label>Transaction Amount</mat-label>
<input type="number" formControlName="transactionAmount" required matInput />
<mat-error *ngIf="manageSavingsAccountForm.controls.transactionAmount.hasError('required')">
Transaction Amount is <strong>required</strong>
</mat-error>
</mat-form-field>
</mat-card-content>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<button type="button" mat-raised-button [routerLink]="['../../transactions']">Cancel</button>
<button mat-raised-button color="primary" [disabled]="!manageSavingsAccountForm.valid">Confirm</button>
</mat-card-actions>
</form>
</mat-card>
</div>
src/app/savings/saving-account-actions/manage-savings-account/manage-savings-account.component.scss
+3
View File
@@ -0,0 +1,3 @@
.container {
width: 37rem;
}
src/app/savings/saving-account-actions/manage-savings-account/manage-savings-account.component.spec.ts
+25
View File
@@ -0,0 +1,25 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ManageSavingsAccountComponent } from './manage-savings-account.component';
describe('ManageSavingsAccountComponent', () => {
let component: ManageSavingsAccountComponent;
let fixture: ComponentFixture<ManageSavingsAccountComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ ManageSavingsAccountComponent ]
})
.compileComponents();
});
beforeEach(() => {
fixture = TestBed.createComponent(ManageSavingsAccountComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
src/app/savings/saving-account-actions/manage-savings-account/manage-savings-account.component.ts
+140
View File
@@ -0,0 +1,140 @@
import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { ActivatedRoute, Router } from '@angular/router';
import { Dates } from 'app/core/utils/dates';
import { SavingsService } from 'app/savings/savings.service';
import { SettingsService } from 'app/settings/settings.service';
import { SystemService } from 'app/system/system.service';
@Component({
selector: 'mifosx-manage-savings-account',
templateUrl: './manage-savings-account.component.html',
styleUrls: ['./manage-savings-account.component.scss']
})
export class ManageSavingsAccountComponent implements OnInit {
/** Minimum date allowed. */
minDate = new Date(2000, 0, 1);
/** Maximum date allowed. */
maxDate = new Date();
/** Manage Savings Account form. */
manageSavingsAccountForm: FormGroup;
/** Savings Account Id */
savingAccountId: string;
transactionCommand: string;
reasonOptions: any = [];
transactionType: {
holdamount: boolean,
blockaccount: boolean,
unblockaccount: boolean
} = {
holdamount: false, blockaccount: false, unblockaccount: false };
/**
* @param {FormBuilder} formBuilder Form Builder
* @param {SavingsService} savingsService Savings Service
* @param {Dates} dateUtils Date Utils
* @param {ActivatedRoute} route Activated Route
* @param {Router} router Router
* @param {SettingsService} settingsService Setting service
*/
constructor(private formBuilder: FormBuilder,
private savingsService: SavingsService,
private dateUtils: Dates,
private route: ActivatedRoute,
private router: Router,
private systemService: SystemService,
private settingsService: SettingsService) {
this.transactionCommand = this.route.snapshot.params['name'].toLowerCase().replaceAll(' ', '');
this.transactionType[this.transactionCommand] = true;
this.savingAccountId = this.route.parent.snapshot.params['savingAccountId'];
}
/**
* Creates the post interest savings form.
*/
ngOnInit() {
this.maxDate = this.settingsService.businessDate;
this.createManageSavingsAccountForm();
if (this.transactionType.holdamount || this.transactionType.blockaccount) {
this.getCodeValues();
}
}
getCodeValues() {
let codeName = 'SavingsTransactionFreezeReasons'; // Default Hold Amount
if (this.transactionType.blockaccount) {
codeName = 'SavingsAccountBlockReasons';
}
this.systemService.getCodes().subscribe((codes: any) => {
codes.some((code: any) => {
if (code.name === codeName) {
this.systemService.getCodeValues(code.id).subscribe((codeValues: any) => {
this.reasonOptions = codeValues;
return true;
});
}
return false;
});
});
}
/**
* Creates the post interest savings account form.
*/
createManageSavingsAccountForm() {
if (this.transactionType.holdamount) {
this.manageSavingsAccountForm = this.formBuilder.group({
'reasonForBlock': ['', Validators.required],
'transactionDate': ['', Validators.required],
'transactionAmount': [0.0, Validators.required]
});
} else {
this.manageSavingsAccountForm = this.formBuilder.group({
'reasonForBlock': ['', Validators.required]
});
}
}
submit() {
let command = '';
let payload = { };
if (this.transactionType.holdamount) {
const manageSavingsAccountFormData = this.manageSavingsAccountForm.value;
const locale = this.settingsService.language.code;
const dateFormat = this.settingsService.dateFormat;
const prevTransactionDate: Date = this.manageSavingsAccountForm.value.transactionDate;
if (manageSavingsAccountFormData.transactionDate instanceof Date) {
manageSavingsAccountFormData.transactionDate = this.dateUtils.formatDate(prevTransactionDate, dateFormat);
}
payload = {
...manageSavingsAccountFormData,
dateFormat,
locale
};
command = 'holdAmount';
this.savingsService.executeSavingsAccountTransactionsCommand(this.savingAccountId, command, payload).subscribe((response: any) => {
console.log(response);
this.router.navigate(['../../transactions'], { relativeTo: this.route });
});
} else {
payload = {
... this.manageSavingsAccountForm.value
}
if (this.transactionType.blockaccount) {
command = 'block';
}
this.savingsService.executeSavingsAccountCommand(this.savingAccountId, command, payload).subscribe((response: any) => {
console.log(response);
this.router.navigate(['../../transactions'], { relativeTo: this.route });
});
}
}
}
src/app/savings/saving-account-actions/saving-account-actions.component.html
+1
View File
@@ -10,3 +10,4 @@
<mifosx-savings-transactions *ngIf="actions['Withdrawal'] || actions['Deposit']"></mifosx-savings-transactions>
<mifosx-close-savings-account *ngIf="actions['Close']"></mifosx-close-savings-account>
<mifosx-apply-annual-fees-savings-account *ngIf="actions['Apply Annual Fees']"></mifosx-apply-annual-fees-savings-account>
<mifosx-manage-savings-account *ngIf="actions['Hold Amount']"></mifosx-manage-savings-account>
src/app/savings/saving-account-actions/saving-account-actions.component.ts
+7 -1
View File
@@ -27,6 +27,9 @@ export class SavingAccountActionsComponent {
'Unassign Staff': boolean
'Withdraw By Client': boolean
'Apply Annual Fees': boolean
'Hold Amount': boolean
'Block Account': boolean
'Unblock Account': boolean
} = {
'Approve': false,
'Reject': false,
@@ -40,7 +43,10 @@ export class SavingAccountActionsComponent {
'Add Charge': false,
'Unassign Staff': false,
'Withdraw By Client': false,
'Apply Annual Fees': false
'Apply Annual Fees': false,
'Hold Amount': false,
'Block Account': false,
'Unblock Account': false
};
/**
src/app/savings/savings-account-view/custom-dialogs/release-amount-dialog/release-amount-dialog.component.html
+8
View File
@@ -0,0 +1,8 @@
<h1 mat-dialog-title>Release Amount</h1>
<div mat-dialog-content>
<p>Are you sure you want to release this amount ?</p>
</div>
<mat-dialog-actions align="end">
<button mat-raised-button mat-dialog-close>Cancel</button>
<button mat-raised-button color="warn" [mat-dialog-close]="{ confirm: true }">Confirm</button>
</mat-dialog-actions>
src/app/savings/savings-account-view/custom-dialogs/release-amount-dialog/release-amount-dialog.component.scss
View File
src/app/savings/savings-account-view/custom-dialogs/release-amount-dialog/release-amount-dialog.component.spec.ts
+25
View File
@@ -0,0 +1,25 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ReleaseAmountDialogComponent } from './release-amount-dialog.component';
describe('ReleaseAmountDialogComponent', () => {
let component: ReleaseAmountDialogComponent;
let fixture: ComponentFixture<ReleaseAmountDialogComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ ReleaseAmountDialogComponent ]
})
.compileComponents();
});
beforeEach(() => {
fixture = TestBed.createComponent(ReleaseAmountDialogComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
src/app/savings/savings-account-view/custom-dialogs/release-amount-dialog/release-amount-dialog.component.ts
+16
View File
@@ -0,0 +1,16 @@
import { Component } from '@angular/core';
import { MatDialogRef } from '@angular/material/dialog';
@Component({
selector: 'mifosx-release-amount-dialog',
templateUrl: './release-amount-dialog.component.html',
styleUrls: ['./release-amount-dialog.component.scss']
})
export class ReleaseAmountDialogComponent {
/**
* @param {MatDialogRef} dialogRef Component reference to dialog.
*/
constructor(public dialogRef: MatDialogRef<ReleaseAmountDialogComponent>) { }
}
src/app/savings/savings-account-view/savings-account-view.component.ts
+3
View File
@@ -135,6 +135,9 @@ export class SavingsAccountViewComponent implements OnInit {
case 'Post Interest As On':
case 'Assign Staff':
case 'Add Charge':
case 'Hold Amount':
case 'Block Account':
case 'Unblock Account':
case 'Unassign Staff':
case 'Withdraw By Client':
case 'Apply Annual Fees':
src/app/savings/savings-account-view/savings-buttons.config.ts
+5
View File
@@ -39,6 +39,11 @@ export class SavingsButtonsConfiguration {
icon: 'arrow-down',
taskPermissionName: 'WITHDRAW_SAVINGSACCOUNT'
},
{
name: 'Hold Amount',
icon: 'lock',
taskPermissionName: 'HOLDAMOUNT_SAVINGSACCOUNT'
},
{
name: 'Calculate Interest',
icon: 'table',
src/app/savings/savings-account-view/transactions/view-transaction/view-transaction.component.html
+28 -22
View File
@@ -1,17 +1,20 @@
<div fxLayoutAlign="end" class="container m-b-20" fxLayoutGap="2%"
*ngIf="!(transactionData.interestedPostedAsOn === false && (transactionData.transactionType.id === 17 || transactionData.transactionType.id === 3))">
<span *mifosxHasPermission="'ADJUSTTRANSACTION_SAVINGSACCOUNT'">
<button mat-raised-button color="primary"
*ngIf="transactionData.transactionType.value == 'Transfer' || transactionData.reversed == 'true'
|| transactionData.transactionType.id==3 || transactionData.transactionType.id==17"
[routerLink]="'edit'">
<fa-icon icon="edit"></fa-icon>&nbsp;&nbsp;Edit
<button mat-raised-button color="primary" *ngIf="transactionData.transactionType.value == 'Transfer' || transactionData.reversed == 'true'
|| transactionData.transactionType.id==3 || transactionData.transactionType.id==17" [routerLink]="'edit'">
<fa-icon icon="edit" class="m-r-10"></fa-icon>Edit
</button>
</span>
<button mat-raised-button color="warn"
*mifosxHasPermission="'UNDOTRANSACTION_SAVINGSACCOUNT'"
(click)="undoTransaction()">
<fa-icon icon="undo"></fa-icon>&nbsp;&nbsp;Undo
<span *ngIf="!transactionData.reversed && transactionData.transactionType.amountHold">
<button mat-raised-button color="primary" *mifosxHasPermission="'RELEASEAMOUNT_SAVINGSACCOUNT'"
(click)="releaseAmount()">
<fa-icon icon="lock-open" class="m-r-10"></fa-icon>Release Amount
</button>
</span>
<button mat-raised-button color="warn" *mifosxHasPermission="'UNDOTRANSACTION_SAVINGSACCOUNT'"
(click)="undoTransaction()" [disabled]="transactionData.reversed">
<fa-icon icon="undo" class="m-r-10"></fa-icon>Undo
</button>
</div>
@@ -30,7 +33,7 @@
<div fxFlex="50%">
{{ transactionData.id }}
</div>
<div fxFlex="50%" class="mat-body-strong">
Type
</div>
@@ -44,7 +47,7 @@
</div>
<div fxFlex="50%">
{{ transactionData.date | dateFormat }}
{{ transactionData.date | dateFormat }}
</div>
<div fxFlex="50%" class="mat-body-strong">
@@ -76,47 +79,47 @@
<div *ngIf="transactionData.paymentDetailData.paymentType" fxFlex="50%" class="mat-body-strong">
Payment Type
</div>
<div *ngIf="transactionData.paymentDetailData.paymentType" fxFlex="50%">
{{ transactionData.paymentDetailData.paymentType.name }}
</div>
<div *ngIf="transactionData.paymentDetailData.accountNumber" fxFlex="50%" class="mat-body-strong">
Account No.
</div>
<div *ngIf="transactionData.paymentDetailData.accountNumber" fxFlex="50%">
{{ transactionData.paymentDetailData.accountNumber }}
</div>
<div *ngIf="transactionData.paymentDetailData.checkNumber" fxFlex="50%" class="mat-body-strong">
Cheque Number
</div>
<div *ngIf="transactionData.paymentDetailData.checkNumber" fxFlex="50%">
{{ transactionData.paymentDetailData.checkNumber }}
</div>
<div *ngIf="transactionData.paymentDetailData.routingCode" fxFlex="50%" class="mat-body-strong">
Routing Code
</div>
<div *ngIf="transactionData.paymentDetailData.routingCode" fxFlex="50%">
{{ transactionData.paymentDetailData.routingCode }}
</div>
<div *ngIf="transactionData.paymentDetailData.receiptNumber" fxFlex="50%" class="mat-body-strong">
Receipt No.
</div>
<div *ngIf="transactionData.paymentDetailData.receiptNumber" fxFlex="50%">
{{ transactionData.paymentDetailData.receiptNumber }}
</div>
<div *ngIf="transactionData.paymentDetailData.bankNumber" fxFlex="50%" class="mat-body-strong">
Bank No.
</div>
<div *ngIf="transactionData.paymentDetailData.bankNumber" fxFlex="50%">
{{ transactionData.paymentDetailData.bankNumber }}
</div>
@@ -125,6 +128,9 @@
</div>
<div fxLayout="row" fxLayoutAlign="center" fxLayoutGap="2%" fxLayout.lt-md="column">
<button type="button" mat-raised-button color="primary" [routerLink]="['../']">{{ 'Back' | translate }}</button>
</div>
</mat-card-content>
</mat-card>
src/app/savings/savings-account-view/transactions/view-transaction/view-transaction.component.ts
+18 -2
View File
@@ -10,6 +10,7 @@ import { SettingsService } from 'app/settings/settings.service';
/** Custom Dialogs */
import { UndoTransactionDialogComponent } from '../../custom-dialogs/undo-transaction-dialog/undo-transaction-dialog.component';
import { Dates } from 'app/core/utils/dates';
import { ReleaseAmountDialogComponent } from '../../custom-dialogs/release-amount-dialog/release-amount-dialog.component';
/**
* View Transaction Component.
@@ -25,6 +26,8 @@ export class ViewTransactionComponent {
/** Transaction data. */
transactionData: any;
accountId: string;
/**
* Retrieves the Transaction data from `resolve`.
* @param {SavingsService} savingsService Savings Service
@@ -41,7 +44,9 @@ export class ViewTransactionComponent {
public dialog: MatDialog,
private settingsService: SettingsService) {
this.route.data.subscribe((data: { savingsAccountTransaction: any }) => {
this.accountId = this.route.parent.snapshot.params['savingAccountId'];
this.transactionData = data.savingsAccountTransaction;
console.log(this.transactionData);
});
}
@@ -49,7 +54,6 @@ export class ViewTransactionComponent {
* Undo the savings transaction
*/
undoTransaction() {
const accountId = this.route.parent.snapshot.params['savingAccountId'];
const undoTransactionAccountDialogRef = this.dialog.open(UndoTransactionDialogComponent);
undoTransactionAccountDialogRef.afterClosed().subscribe((response: any) => {
if (response.confirm) {
@@ -61,7 +65,19 @@ export class ViewTransactionComponent {
dateFormat,
locale
};
this.savingsService.executeSavingsAccountTransactionsCommand(accountId, 'undo', data, this.transactionData.id).subscribe(() => {
this.savingsService.executeSavingsAccountTransactionsCommand(this.accountId, 'undo', data, this.transactionData.id).subscribe(() => {
this.router.navigate(['../'], { relativeTo: this.route });
});
}
});
}
releaseAmount() {
const releaseAmountDialogRef = this.dialog.open(ReleaseAmountDialogComponent);
releaseAmountDialogRef.afterClosed().subscribe((response: any) => {
if (response.confirm) {
const data = { };
this.savingsService.executeSavingsAccountTransactionsCommand(this.accountId, 'releaseAmount', data, this.transactionData.id).subscribe(() => {
this.router.navigate(['../'], { relativeTo: this.route });
});
}
src/app/savings/savings.module.ts
+5 -1
View File
@@ -47,6 +47,8 @@ import { EditTransactionComponent } from './savings-account-view/transactions/ed
import { ApplyAnnualFeesSavingsAccountComponent } from './saving-account-actions/apply-annual-fees-savings-account/apply-annual-fees-savings-account.component';
import { GsimAccountComponent } from './gsim-account/gsim-account.component';
import { CreateGsimAccountComponent } from './gsim-account/create-gsim-account/create-gsim-account.component';
import { ManageSavingsAccountComponent } from './saving-account-actions/manage-savings-account/manage-savings-account.component';
import { ReleaseAmountDialogComponent } from './savings-account-view/custom-dialogs/release-amount-dialog/release-amount-dialog.component';
/**
@@ -100,7 +102,9 @@ import { CreateGsimAccountComponent } from './gsim-account/create-gsim-account/c
EditTransactionComponent,
ApplyAnnualFeesSavingsAccountComponent,
GsimAccountComponent,
CreateGsimAccountComponent
CreateGsimAccountComponent,
ManageSavingsAccountComponent,
ReleaseAmountDialogComponent
],
providers: [ ]
})