feat:glim and gsim account create and view
This commit is contained in:
Ramveer
@@ -0,0 +1,79 @@
|
||||
<div class="container">
|
||||
|
||||
<mat-horizontal-stepper class="mat-elevation-z8" labelPosition="bottom" #savingProductStepper>
|
||||
|
||||
<ng-template matStepperIcon="number">
|
||||
<fa-icon icon="pencil-alt" size="sm"></fa-icon>
|
||||
</ng-template>
|
||||
|
||||
<ng-template matStepperIcon="edit">
|
||||
<fa-icon icon="pencil-alt" size="sm"></fa-icon>
|
||||
</ng-template>
|
||||
|
||||
<ng-template matStepperIcon="done">
|
||||
<fa-icon icon="check" size="sm"></fa-icon>
|
||||
</ng-template>
|
||||
|
||||
<ng-template matStepperIcon="error">
|
||||
<fa-icon icon="exclamation-triangle" size="lg"></fa-icon>
|
||||
</ng-template>
|
||||
|
||||
<ng-template matStepperIcon="preview">
|
||||
<fa-icon icon="eye" size="sm"></fa-icon>
|
||||
</ng-template>
|
||||
|
||||
<mat-step [stepControl]="savingsAccountDetailsForm">
|
||||
|
||||
<ng-template matStepLabel>DETAILS</ng-template>
|
||||
|
||||
<mifosx-savings-account-details-step
|
||||
[savingsAccountTemplate]="savingsAccountTemplate"
|
||||
(savingsAccountProductTemplate)="setTemplate($event)"
|
||||
>
|
||||
</mifosx-savings-account-details-step>
|
||||
|
||||
</mat-step>
|
||||
|
||||
<mat-step [stepControl]="savingsAccountTermsForm">
|
||||
|
||||
<ng-template matStepLabel>TERMS</ng-template>
|
||||
|
||||
<mifosx-savings-account-terms-step
|
||||
[savingsAccountProductTemplate]="savingsAccountProductTemplate"
|
||||
></mifosx-savings-account-terms-step>
|
||||
|
||||
</mat-step>
|
||||
|
||||
<mat-step>
|
||||
|
||||
<ng-template matStepLabel>CHARGES</ng-template>
|
||||
|
||||
<mifosx-savings-account-charges-step
|
||||
[savingsAccountProductTemplate]="savingsAccountProductTemplate"
|
||||
[savingsAccountTemplate]="savingsAccountTemplate"
|
||||
[currencyCode]="savingsAccountTermsForm.get('currencyCode')"
|
||||
[activeClientMembers]="activeClientMembers"
|
||||
>
|
||||
</mifosx-savings-account-charges-step>
|
||||
|
||||
</mat-step>
|
||||
|
||||
<mat-step *ngIf="savingsAccountFormValid" completed>
|
||||
|
||||
<ng-template matStepLabel>PREVIEW</ng-template>
|
||||
|
||||
<mifosx-savings-account-preview-step
|
||||
[savingsAccountProductTemplate]="savingsAccountProductTemplate"
|
||||
[savingsAccountTemplate]="savingsAccountTemplate"
|
||||
[savingsAccountTermsForm]="savingsAccountTermsForm"
|
||||
[savingsAccount]="savingsAccount"
|
||||
(submit)="submit()"
|
||||
>
|
||||
</mifosx-savings-account-preview-step>
|
||||
|
||||
</mat-step>
|
||||
|
||||
</mat-horizontal-stepper>
|
||||
|
||||
</div>
|
||||
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { CreateGsimAccountComponent } from './create-gsim-account.component';
|
||||
|
||||
describe('CreateGsimAccountComponent', () => {
|
||||
let component: CreateGsimAccountComponent;
|
||||
let fixture: ComponentFixture<CreateGsimAccountComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ CreateGsimAccountComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(CreateGsimAccountComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,167 @@
|
||||
/** Angular Imports */
|
||||
import { Component, OnInit, ViewChild } from '@angular/core';
|
||||
import { Router, ActivatedRoute } from '@angular/router';
|
||||
|
||||
/** Custom Components */
|
||||
import { SavingsAccountDetailsStepComponent } from '../../savings-account-stepper/savings-account-details-step/savings-account-details-step.component';
|
||||
import { SavingsAccountTermsStepComponent } from '../../savings-account-stepper/savings-account-terms-step/savings-account-terms-step.component';
|
||||
import { SavingsAccountChargesStepComponent } from '../../savings-account-stepper/savings-account-charges-step/savings-account-charges-step.component';
|
||||
|
||||
/** Custom Services */
|
||||
import { SavingsService } from '../../savings.service';
|
||||
import { SettingsService } from 'app/settings/settings.service';
|
||||
import { Dates } from 'app/core/utils/dates';
|
||||
|
||||
/**
|
||||
* Create GSIM Account Component
|
||||
*/
|
||||
@Component({
|
||||
selector: 'mifosx-create-gsim-account',
|
||||
templateUrl: './create-gsim-account.component.html',
|
||||
styleUrls: ['./create-gsim-account.component.scss']
|
||||
})
|
||||
|
||||
export class CreateGsimAccountComponent implements OnInit {
|
||||
|
||||
/** Savings Account Template */
|
||||
savingsAccountTemplate: any;
|
||||
/** Savings Account Product Template */
|
||||
savingsAccountProductTemplate: any;
|
||||
/** Table Data Source */
|
||||
dataSource: any;
|
||||
/** Selected Members */
|
||||
selectedMembers: any;
|
||||
|
||||
/** Savings Account Details Step */
|
||||
@ViewChild(SavingsAccountDetailsStepComponent, { static: true }) savingsAccountDetailsStep: SavingsAccountDetailsStepComponent;
|
||||
/** Savings Account Terms Step */
|
||||
@ViewChild(SavingsAccountTermsStepComponent, { static: true }) savingsAccountTermsStep: SavingsAccountTermsStepComponent;
|
||||
/** Savings Account Charges Step */
|
||||
@ViewChild(SavingsAccountChargesStepComponent, { static: true }) savingsAccountChargesStep: SavingsAccountChargesStepComponent;
|
||||
|
||||
/**
|
||||
* Fetches savings account template from `resolve`
|
||||
* @param {ActivatedRoute} route Activated Route
|
||||
* @param {Router} router Router
|
||||
* @param {Dates} dateUtils Date Utils
|
||||
* @param {SavingsService} savingsService Savings Service
|
||||
* @param {SettingsService} settingsService Settings Service
|
||||
*/
|
||||
constructor(private route: ActivatedRoute,
|
||||
private router: Router,
|
||||
private dateUtils: Dates,
|
||||
private savingsService: SavingsService,
|
||||
private settingsService: SettingsService
|
||||
) {
|
||||
this.route.data.subscribe((data: { savingsAccountTemplate: any, groupsData: any }) => {
|
||||
this.savingsAccountTemplate = data.savingsAccountTemplate;
|
||||
this.dataSource = data.groupsData.activeClientMembers;
|
||||
});
|
||||
}
|
||||
|
||||
ngOnInit(): void {
|
||||
}
|
||||
|
||||
/**
|
||||
* Sets savings account product template.
|
||||
* @param {any} $event API response
|
||||
*/
|
||||
setTemplate($event: any) {
|
||||
this.savingsAccountProductTemplate = $event;
|
||||
}
|
||||
|
||||
/**
|
||||
* Retrieves savings account details form.
|
||||
*/
|
||||
get savingsAccountDetailsForm() {
|
||||
return this.savingsAccountDetailsStep.savingsAccountDetailsForm;
|
||||
}
|
||||
|
||||
/**
|
||||
* Retrieves savings account terms form.
|
||||
*/
|
||||
get savingsAccountTermsForm() {
|
||||
return this.savingsAccountTermsStep.savingsAccountTermsForm;
|
||||
}
|
||||
|
||||
/**
|
||||
* Retrieves savings account terms form.
|
||||
*/
|
||||
get activeClientMembers() {
|
||||
return this.dataSource;
|
||||
}
|
||||
|
||||
/**
|
||||
* Checks validity of overall savings account form.
|
||||
*/
|
||||
get savingsAccountFormValid() {
|
||||
return (
|
||||
this.savingsAccountDetailsForm.valid &&
|
||||
this.savingsAccountTermsForm.valid
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* Retrieves savings account object.
|
||||
*/
|
||||
get savingsAccount() {
|
||||
this.selectedMembers = this.savingsAccountChargesStep.selectedClientMembers;
|
||||
return {
|
||||
...this.savingsAccountDetailsStep.savingsAccountDetails,
|
||||
...this.savingsAccountTermsStep.savingsAccountTerms,
|
||||
...this.savingsAccountChargesStep.savingsAccountCharges
|
||||
};
|
||||
}
|
||||
|
||||
/** Set Body for each client selected */
|
||||
setData(client: any): any {
|
||||
const locale = this.settingsService.language.code;
|
||||
const dateFormat = this.settingsService.dateFormat;
|
||||
const monthDayFormat = 'dd MMMM';
|
||||
const data = {
|
||||
...this.savingsAccount,
|
||||
charges: this.savingsAccount.charges.map((charge: any) => ({
|
||||
chargeId: charge.id,
|
||||
amount: charge.amount,
|
||||
})),
|
||||
clientId: client.id,
|
||||
isGSIM: true,
|
||||
isParentAccount: true,
|
||||
submittedOnDate: this.dateUtils.formatDate(this.savingsAccount.submittedOnDate, dateFormat),
|
||||
dateFormat,
|
||||
monthDayFormat,
|
||||
locale
|
||||
};
|
||||
data.groupId = this.savingsAccountTemplate.groupId;
|
||||
|
||||
return data;
|
||||
|
||||
}
|
||||
|
||||
/** Request Body Data */
|
||||
buildRequestData(): any[] {
|
||||
const requestData = [];
|
||||
const memberSelected = this.selectedMembers.selectedMembers;
|
||||
for (let index = 0; index < 1; index++) {
|
||||
console.log(index);
|
||||
requestData.push(
|
||||
this.setData( memberSelected[ index ] ),
|
||||
);
|
||||
}
|
||||
return requestData;
|
||||
}
|
||||
|
||||
/**
|
||||
* Creates a new GSIM account.
|
||||
*/
|
||||
submit() {
|
||||
const data = this.buildRequestData();
|
||||
const gsimData = {
|
||||
clientArray: data,
|
||||
};
|
||||
this.savingsService.createGsimAcccount(gsimData).subscribe((response: any) => {
|
||||
this.router.navigate(['../', response.resourceId], { relativeTo: this.route });
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
@@ -0,0 +1,66 @@
|
||||
<div class="tab-container mat-typography">
|
||||
|
||||
<div style="margin-top: 5px;">
|
||||
|
||||
<h2> GSIM Account Overview</h2>
|
||||
|
||||
<table mat-table [dataSource]="dataSource">
|
||||
|
||||
<ng-container matColumnDef="clientDetails">
|
||||
<th mat-header-cell *matHeaderCellDef> Client Details </th>
|
||||
<td mat-cell *matCellDef="let element">
|
||||
{{element.displayName}} </td>
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="savingsAccount">
|
||||
<th mat-header-cell *matHeaderCellDef> Saving Account </th>
|
||||
<td mat-cell *matCellDef="let element"><i class="fa fa-stop" [ngClass]="element.status.code|statusLookup" [matTooltip]="element.status.value"></i> {{element.accountNo}} </td>
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="products">
|
||||
<th mat-header-cell *matHeaderCellDef> Products </th>
|
||||
<td mat-cell *matCellDef="let element"> {{element.productName}} </td>
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="balance">
|
||||
<th mat-header-cell *matHeaderCellDef> Balance </th>
|
||||
<td mat-cell *matCellDef="let element" > </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"
|
||||
(click)="routeEdit($event)" [routerLink]="['../','savings-accounts', element.id, 'actions', 'Deposit']">
|
||||
<i class="fa fa-arrow-up" matTooltip="Deposit"></i>
|
||||
</button>
|
||||
<button *ngIf="element.status.active" class="account-action-button" mat-raised-button color="primary"
|
||||
(click)="routeEdit($event)" [routerLink]="['../','savings-accounts', element.id, 'actions', 'Withdrawal']">
|
||||
<i class="fa fa-arrow-down" matTooltip="Withdraw"></i>
|
||||
</button>
|
||||
<button *ngIf="element.status.submittedAndPendingApproval" class="account-action-button" mat-raised-button color="primary"
|
||||
(click)="routeEdit($event)" [routerLink]="['../','savings-accounts', element.id, 'actions', 'Approve']">
|
||||
<i class="fa fa-check" matTooltip="Approve"></i>
|
||||
</button>
|
||||
<button *ngIf="!element.status.submittedAndPendingApproval && !element.status.active"
|
||||
class="account-action-button" mat-raised-button color="primary"
|
||||
(click)="routeEdit($event)" [routerLink]="['../../../','savings-accounts', element.id, 'actions', 'Undo Approval']">
|
||||
<i class="fa fa-undo" matTooltip="Undo Approval"></i>
|
||||
</button>
|
||||
<button *ngIf="!element.status.submittedAndPendingApproval && !element.status.active"
|
||||
class="account-action-button" mat-raised-button color="primary"
|
||||
(click)="routeEdit($event)" [routerLink]="['../../', element.id, 'actions', 'Activate']">
|
||||
<i class="fa fa-check-circle" matTooltip="Activate"></i>
|
||||
</button>
|
||||
</td>
|
||||
</ng-container>
|
||||
|
||||
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
|
||||
<tr mat-row [routerLink]="['../../', row.id, 'transactions']" *matRowDef="let row; columns: displayedColumns;"></tr>
|
||||
|
||||
</table>
|
||||
|
||||
<mat-paginator [pageSizeOptions]="[10, 20, 25]" showFirstLastButtons></mat-paginator>
|
||||
|
||||
</div>
|
||||
|
||||
@@ -0,0 +1,33 @@
|
||||
.tab-container {
|
||||
padding: 1%;
|
||||
margin: 1%;
|
||||
h3 {
|
||||
margin:1% auto;
|
||||
}
|
||||
.group-details-container {
|
||||
border: 1px solid;
|
||||
padding: 1%;
|
||||
}
|
||||
.action-button{
|
||||
margin-left: auto;
|
||||
}
|
||||
table {
|
||||
width: 100%;
|
||||
.account-action-button{
|
||||
min-width: 26px;
|
||||
padding: 0 6px;
|
||||
margin: 4px;
|
||||
line-height: 25px;
|
||||
}
|
||||
tr.select-row:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
i:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
tr:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,25 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { GsimAccountComponent } from './gsim-account.component';
|
||||
|
||||
describe('GsimAccountComponent', () => {
|
||||
let component: GsimAccountComponent;
|
||||
let fixture: ComponentFixture<GsimAccountComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ GsimAccountComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(GsimAccountComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,68 @@
|
||||
import { Component, OnInit, ViewChild } from '@angular/core';
|
||||
import { MatDialog } from '@angular/material/dialog';
|
||||
import { MatPaginator } from '@angular/material/paginator';
|
||||
import { MatTableDataSource } from '@angular/material/table';
|
||||
import { ActivatedRoute } from '@angular/router';
|
||||
|
||||
/**
|
||||
* GSIM Accounts Overview component.
|
||||
*/
|
||||
@Component({
|
||||
selector: 'mifosx-gsim-account',
|
||||
templateUrl: './gsim-account.component.html',
|
||||
styleUrls: ['./gsim-account.component.scss']
|
||||
})
|
||||
export class GsimAccountComponent implements OnInit {
|
||||
|
||||
/** Columns to be displayed in charge overview table. */
|
||||
displayedColumns: string[] = ['clientDetails', 'savingsAccount', 'products', 'balance', 'Actions'];
|
||||
/** Data source for charge overview table. */
|
||||
dataSource: MatTableDataSource<any>;
|
||||
/** Charge Overview data */
|
||||
gsimOverviewData: any;
|
||||
|
||||
savingAccountData: any;
|
||||
|
||||
groupsData: any;
|
||||
|
||||
/** Paginator for charge overview table. */
|
||||
@ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;
|
||||
|
||||
/**
|
||||
* Retrieves the charge overview data from `resolve`.
|
||||
* @param {ActivatedRoute} route Activated Route.
|
||||
* @param {MatDialog} dialog Dialog reference.
|
||||
*/
|
||||
constructor(private route: ActivatedRoute,
|
||||
public dialog: MatDialog) {
|
||||
this.route.data.subscribe((data: { gsimData: any, savingAccountData: any, groupsData: any }) => {
|
||||
this.gsimOverviewData = data.gsimData[0].childGSIMAccounts;
|
||||
this.savingAccountData = data.savingAccountData;
|
||||
this.groupsData = data.groupsData;
|
||||
console.log(data);
|
||||
});
|
||||
}
|
||||
|
||||
ngOnInit(): void {
|
||||
this.setLoanClientChargeOverview();
|
||||
}
|
||||
|
||||
/**
|
||||
* Set Client Charge Overview.
|
||||
*/
|
||||
setLoanClientChargeOverview() {
|
||||
this.dataSource = new MatTableDataSource(this.gsimOverviewData);
|
||||
console.log(this.dataSource);
|
||||
console.log(this.gsimOverviewData);
|
||||
// this.dataSource.paginator = this.paginator;
|
||||
}
|
||||
|
||||
/**
|
||||
* Stops the propagation to view pages.
|
||||
* @param $event Mouse Event
|
||||
*/
|
||||
routeEdit($event: MouseEvent) {
|
||||
$event.stopPropagation();
|
||||
}
|
||||
|
||||
}
|
||||
@@ -0,0 +1,33 @@
|
||||
/** Angular Imports */
|
||||
import { Injectable } from '@angular/core';
|
||||
import { Resolve, ActivatedRouteSnapshot } from '@angular/router';
|
||||
|
||||
/** rxjs Imports */
|
||||
import { Observable } from 'rxjs';
|
||||
|
||||
/** Custom Services */
|
||||
import { SavingsService } from '../savings.service';
|
||||
|
||||
/**
|
||||
* GSIM Account data resolver.
|
||||
*/
|
||||
@Injectable()
|
||||
export class GSIMViewResolver implements Resolve<Object> {
|
||||
|
||||
/**
|
||||
* @param {SavingsService} savingsService Savings service.
|
||||
*/
|
||||
constructor(private savingsService: SavingsService) { }
|
||||
|
||||
/**
|
||||
* Returns the Savings Account data.
|
||||
* @param {ActivatedRouteSnapshot} route Route Snapshot
|
||||
* @returns {Observable<any>}
|
||||
*/
|
||||
resolve(route: ActivatedRouteSnapshot): Observable<any> {
|
||||
const groupId = route.paramMap.get('groupId');
|
||||
const savingAccountId = route.paramMap.get('savingAccountId');
|
||||
return this.savingsService.getGSIMAccountData(savingAccountId, groupId);
|
||||
}
|
||||
|
||||
}
|
||||
Reference in New Issue
Block a user