From 2418e2ed02484bbe2a5ab1568e9a751af98fcaeb Mon Sep 17 00:00:00 2001 From: Karan Takalkar Date: Fri, 19 Jun 2020 21:14:07 +0530 Subject: [PATCH] feat: add create savings account page (#883) Fixes: #882 --- .../clients-view/clients-view.component.html | 2 +- .../savings-account-template.resolver.ts | 32 +++ .../create-savings-account.component.html | 77 +++++++ .../create-savings-account.component.scss | 0 .../create-savings-account.component.spec.ts | 25 +++ .../create-savings-account.component.ts | 124 +++++++++++ ...avings-account-charges-step.component.html | 112 ++++++++++ ...avings-account-charges-step.component.scss | 11 + ...ngs-account-charges-step.component.spec.ts | 25 +++ .../savings-account-charges-step.component.ts | 202 ++++++++++++++++++ ...avings-account-details-step.component.html | 55 +++++ ...avings-account-details-step.component.scss | 0 ...ngs-account-details-step.component.spec.ts | 25 +++ .../savings-account-details-step.component.ts | 85 ++++++++ ...avings-account-preview-step.component.html | 196 +++++++++++++++++ ...avings-account-preview-step.component.scss | 24 +++ ...ngs-account-preview-step.component.spec.ts | 25 +++ .../savings-account-preview-step.component.ts | 31 +++ .../savings-account-terms-step.component.html | 157 ++++++++++++++ .../savings-account-terms-step.component.scss | 24 +++ ...vings-account-terms-step.component.spec.ts | 25 +++ .../savings-account-terms-step.component.ts | 114 ++++++++++ src/app/savings/savings-routing.module.ts | 13 +- src/app/savings/savings.module.ts | 12 +- src/app/savings/savings.service.ts | 18 ++ ...shares-account-charges-step.component.html | 2 +- .../shares-account-charges-step.component.ts | 22 +- ...shares-account-preview-step.component.html | 2 +- 28 files changed, 1424 insertions(+), 16 deletions(-) create mode 100644 src/app/savings/common-resolvers/savings-account-template.resolver.ts create mode 100644 src/app/savings/create-savings-account/create-savings-account.component.html create mode 100644 src/app/savings/create-savings-account/create-savings-account.component.scss create mode 100644 src/app/savings/create-savings-account/create-savings-account.component.spec.ts create mode 100644 src/app/savings/create-savings-account/create-savings-account.component.ts create mode 100644 src/app/savings/savings-account-stepper/savings-account-charges-step/savings-account-charges-step.component.html create mode 100644 src/app/savings/savings-account-stepper/savings-account-charges-step/savings-account-charges-step.component.scss create mode 100644 src/app/savings/savings-account-stepper/savings-account-charges-step/savings-account-charges-step.component.spec.ts create mode 100644 src/app/savings/savings-account-stepper/savings-account-charges-step/savings-account-charges-step.component.ts create mode 100644 src/app/savings/savings-account-stepper/savings-account-details-step/savings-account-details-step.component.html create mode 100644 src/app/savings/savings-account-stepper/savings-account-details-step/savings-account-details-step.component.scss create mode 100644 src/app/savings/savings-account-stepper/savings-account-details-step/savings-account-details-step.component.spec.ts create mode 100644 src/app/savings/savings-account-stepper/savings-account-details-step/savings-account-details-step.component.ts create mode 100644 src/app/savings/savings-account-stepper/savings-account-preview-step/savings-account-preview-step.component.html create mode 100644 src/app/savings/savings-account-stepper/savings-account-preview-step/savings-account-preview-step.component.scss create mode 100644 src/app/savings/savings-account-stepper/savings-account-preview-step/savings-account-preview-step.component.spec.ts create mode 100644 src/app/savings/savings-account-stepper/savings-account-preview-step/savings-account-preview-step.component.ts create mode 100644 src/app/savings/savings-account-stepper/savings-account-terms-step/savings-account-terms-step.component.html create mode 100644 src/app/savings/savings-account-stepper/savings-account-terms-step/savings-account-terms-step.component.scss create mode 100644 src/app/savings/savings-account-stepper/savings-account-terms-step/savings-account-terms-step.component.spec.ts create mode 100644 src/app/savings/savings-account-stepper/savings-account-terms-step/savings-account-terms-step.component.ts diff --git a/src/app/clients/clients-view/clients-view.component.html b/src/app/clients/clients-view/clients-view.component.html index 4757f518c..dbdc1c1ac 100644 --- a/src/app/clients/clients-view/clients-view.component.html +++ b/src/app/clients/clients-view/clients-view.component.html @@ -33,7 +33,7 @@ - + diff --git a/src/app/savings/common-resolvers/savings-account-template.resolver.ts b/src/app/savings/common-resolvers/savings-account-template.resolver.ts new file mode 100644 index 000000000..02cc338af --- /dev/null +++ b/src/app/savings/common-resolvers/savings-account-template.resolver.ts @@ -0,0 +1,32 @@ +/** 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'; + +/** + * Savings Account Template resolver. + */ +@Injectable() +export class SavingsAccountTemplateResolver implements Resolve { + + /** + * @param {savingsService} SavingsService Savings service. + */ + constructor(private savingsService: SavingsService) { } + + /** + * Returns the Shares Account Template. + * @param {ActivatedRouteSnapshot} route Route Snapshot + * @returns {Observable} + */ + resolve(route: ActivatedRouteSnapshot): Observable { + const clientId = route.parent.parent.paramMap.get('clientId'); + return this.savingsService.getSavingsAccountTemplate(clientId); + } + +} diff --git a/src/app/savings/create-savings-account/create-savings-account.component.html b/src/app/savings/create-savings-account/create-savings-account.component.html new file mode 100644 index 000000000..3daa15533 --- /dev/null +++ b/src/app/savings/create-savings-account/create-savings-account.component.html @@ -0,0 +1,77 @@ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + DETAILS + + + + + + + + + TERMS + + + + + + + + CHARGES + + + + + + + + + PREVIEW + + + + + + + + +
diff --git a/src/app/savings/create-savings-account/create-savings-account.component.scss b/src/app/savings/create-savings-account/create-savings-account.component.scss new file mode 100644 index 000000000..e69de29bb diff --git a/src/app/savings/create-savings-account/create-savings-account.component.spec.ts b/src/app/savings/create-savings-account/create-savings-account.component.spec.ts new file mode 100644 index 000000000..f644e2e4b --- /dev/null +++ b/src/app/savings/create-savings-account/create-savings-account.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { CreateSavingsAccountComponent } from './create-savings-account.component'; + +describe('CreateSavingsAccountComponent', () => { + let component: CreateSavingsAccountComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ CreateSavingsAccountComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(CreateSavingsAccountComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/savings/create-savings-account/create-savings-account.component.ts b/src/app/savings/create-savings-account/create-savings-account.component.ts new file mode 100644 index 000000000..a8ce806d7 --- /dev/null +++ b/src/app/savings/create-savings-account/create-savings-account.component.ts @@ -0,0 +1,124 @@ +/** Angular Imports */ +import { Component, ViewChild } from '@angular/core'; +import { Router, ActivatedRoute } from '@angular/router'; +import { DatePipe } from '@angular/common'; + +/** 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'; + +/** + * Create Savings Account Component + */ +@Component({ + selector: 'mifosx-create-savings-account', + templateUrl: './create-savings-account.component.html', + styleUrls: ['./create-savings-account.component.scss'] +}) +export class CreateSavingsAccountComponent { + + /** Savings Account Template */ + savingsAccountTemplate: any; + /** Savings Account Product Template */ + savingsAccountProductTemplate: any; + + /** Savings Account Details Step */ + @ViewChild(SavingsAccountDetailsStepComponent) savingsAccountDetailsStep: SavingsAccountDetailsStepComponent; + /** Savings Account Terms Step */ + @ViewChild(SavingsAccountTermsStepComponent) savingsAccountTermsStep: SavingsAccountTermsStepComponent; + /** Savings Account Charges Step */ + @ViewChild(SavingsAccountChargesStepComponent) savingsAccountChargesStep: SavingsAccountChargesStepComponent; + + /** + * Fetches savings account template from `resolve` + * @param {ActivatedRoute} route Activated Route + * @param {Router} router Router + * @param {DatePipe} datePipe Date Pipe + * @param {SavingsService} savingsService Savings Service + */ + constructor(private route: ActivatedRoute, + private router: Router, + private datePipe: DatePipe, + private savingsService: SavingsService + ) { + this.route.data.subscribe((data: { savingsAccountTemplate: any }) => { + this.savingsAccountTemplate = data.savingsAccountTemplate; + }); + } + + /** + * 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; + } + + /** + * Checks validity of overall savings account form. + */ + get savingsAccountFormValid() { + return ( + this.savingsAccountDetailsForm.valid && + this.savingsAccountTermsForm.valid + ); + } + + /** + * Retrieves savings account object. + */ + get savingsAccount() { + return { + ...this.savingsAccountDetailsStep.savingsAccountDetails, + ...this.savingsAccountTermsStep.savingsAccountTerms, + ...this.savingsAccountChargesStep.savingsAccountCharges + }; + } + + /** + * Creates a new share account. + */ + submit() { + // TODO: Update once language and date settings are setup + const locale = 'en'; + const dateFormat = 'dd MMMM yyyy'; + const monthDayFormat = 'dd MMMM'; + const savingsAccount = { + ...this.savingsAccount, + clientId: this.savingsAccountTemplate.clientId, + charges: this.savingsAccount.charges.map((charge: any) => ({ + chargeId: charge.id, + amount: charge.amount, + dueDate: charge.dueDate, + feeOnMonthDay: charge.feeOnMonthDay, + feeInterval: charge.feeInterval + })), + submittedOnDate: this.datePipe.transform(this.savingsAccount.submittedOnDate, dateFormat), + dateFormat, + monthDayFormat, + locale + }; + this.savingsService.createSavingsAccount(savingsAccount).subscribe((response: any) => { + this.router.navigate(['../', response.resourceId], { relativeTo: this.route }); + }); + } + +} diff --git a/src/app/savings/savings-account-stepper/savings-account-charges-step/savings-account-charges-step.component.html b/src/app/savings/savings-account-stepper/savings-account-charges-step/savings-account-charges-step.component.html new file mode 100644 index 000000000..054b05dd2 --- /dev/null +++ b/src/app/savings/savings-account-stepper/savings-account-charges-step/savings-account-charges-step.component.html @@ -0,0 +1,112 @@ +
+ + + Charge + + + {{ charge.name }} + + + + +
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Name + {{ charge.name + ', ' + charge.currency.displaySymbol }} + Type + {{ charge.chargeCalculationType.value }} + Amount + {{ charge.amount }} + + Collected On + {{ charge.chargeTimeType.value }} + Date + + {{charge.dueDate || 'Unassigned'}} + + + {{charge.feeOnMonthDay || 'Unassigned'}} + + + N/A + + + Repayments Every + {{ charge.feeInterval || 'Not Provided' }} + + Actions + +
+ +
+ +
+ + +
diff --git a/src/app/savings/savings-account-stepper/savings-account-charges-step/savings-account-charges-step.component.scss b/src/app/savings/savings-account-stepper/savings-account-charges-step/savings-account-charges-step.component.scss new file mode 100644 index 000000000..dd420676a --- /dev/null +++ b/src/app/savings/savings-account-stepper/savings-account-charges-step/savings-account-charges-step.component.scss @@ -0,0 +1,11 @@ +table { + width: 100%; +} + +.mat-elevation-z1 { + margin: 1em 0 1.5em 0; +} + +.margin-t { + margin-top: 1em; +} diff --git a/src/app/savings/savings-account-stepper/savings-account-charges-step/savings-account-charges-step.component.spec.ts b/src/app/savings/savings-account-stepper/savings-account-charges-step/savings-account-charges-step.component.spec.ts new file mode 100644 index 000000000..abf858e0e --- /dev/null +++ b/src/app/savings/savings-account-stepper/savings-account-charges-step/savings-account-charges-step.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { SavingsAccountChargesStepComponent } from './savings-account-charges-step.component'; + +describe('SavingsAccountChargesStepComponent', () => { + let component: SavingsAccountChargesStepComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ SavingsAccountChargesStepComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(SavingsAccountChargesStepComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/savings/savings-account-stepper/savings-account-charges-step/savings-account-charges-step.component.ts b/src/app/savings/savings-account-stepper/savings-account-charges-step/savings-account-charges-step.component.ts new file mode 100644 index 000000000..d70654de7 --- /dev/null +++ b/src/app/savings/savings-account-stepper/savings-account-charges-step/savings-account-charges-step.component.ts @@ -0,0 +1,202 @@ +/** Angular Imports */ +import { Component, OnInit, OnChanges, Input } from '@angular/core'; +import { MatDialog } from '@angular/material'; +import { FormControl } from '@angular/forms'; +import { DatePipe } from '@angular/common'; + +/** Custom Dialogs */ +import { DeleteDialogComponent } from 'app/shared/delete-dialog/delete-dialog.component'; +import { FormDialogComponent } from 'app/shared/form-dialog/form-dialog.component'; + +/** Custom Models */ +import { FormfieldBase } from 'app/shared/form-dialog/formfield/model/formfield-base'; +import { InputBase } from 'app/shared/form-dialog/formfield/model/input-base'; +import { DatepickerBase } from 'app/shared/form-dialog/formfield/model/datepicker-base'; + +/** + * Savings Account Charges Step + */ +@Component({ + selector: 'mifosx-savings-account-charges-step', + templateUrl: './savings-account-charges-step.component.html', + styleUrls: ['./savings-account-charges-step.component.scss'] +}) +export class SavingsAccountChargesStepComponent implements OnInit, OnChanges { + + /** Savings Account Product Template */ + @Input() savingsAccountProductTemplate: any; + /** Savings Account Template */ + @Input() savingsAccountTemplate: any; + /** Currency Code */ + @Input() currencyCode: FormControl; + + /** Charge Data */ + chargeData: any = []; + /** Charges Data Source */ + chargesDataSource: {}[] = []; + /** Component is pristine if there has been no changes by user interaction */ + pristine = true; + /** For Edit Savings Account Form */ + isChargesPatched = false; + /** Display columns for charges table */ + displayedColumns: string[] = ['name', 'chargeCalculationType', 'amount', 'chargeTimeType', 'date', 'repaymentsEvery', 'action']; + + /** + * @param {MatDialog} dialog Mat Dialog + */ + constructor(public dialog: MatDialog, + private datePipe: DatePipe) {} + + ngOnInit() { + this.currencyCode.valueChanges.subscribe(() => { + if (!this.isChargesPatched && this.savingsAccountTemplate.charges) { + this.chargesDataSource = this.savingsAccountTemplate.charges || []; + this.isChargesPatched = true; + } else { + this.chargesDataSource = []; + } + }); + } + + ngOnChanges() { + if (this.savingsAccountProductTemplate) { + this.chargeData = this.savingsAccountProductTemplate.chargeOptions; + } + } + + /** + * Adds the charge to charges table + * @param {any} charge Charge + */ + addCharge(charge: any) { + this.chargesDataSource = this.chargesDataSource.concat([charge.value]); + charge.value = ''; + this.pristine = false; + } + + /** + * Edits the Charge Amount + * @param {any} charge Charge + */ + editChargeAmount(charge: any) { + const formfields: FormfieldBase[] = [ + new InputBase({ + controlName: 'amount', + label: 'Amount', + value: charge.amount, + type: 'text', + required: false + }), + ]; + const data = { + title: 'Edit Charge Amount', + layout: { addButtonText: 'Confirm' }, + formfields: formfields + }; + const editNoteDialogRef = this.dialog.open(FormDialogComponent, { data }); + editNoteDialogRef.afterClosed().subscribe((response: any) => { + if (response.data) { + const newCharge = { ...charge, amount: response.data.value.amount }; + this.chargesDataSource.splice(this.chargesDataSource.indexOf(charge), 1, newCharge); + this.chargesDataSource = this.chargesDataSource.concat([]); + } + }); + this.pristine = false; + } + + /** + * Edits the Charge Date + * @param {any} charge Charge + */ + editChargeDate(charge: any) { + const formfields: FormfieldBase[] = [ + new DatepickerBase({ + controlName: 'date', + label: 'Date', + value: charge.dueDate || charge.feeOnMonthDay || '', + type: 'datetime-local', + required: false + }), + ]; + const data = { + title: 'Edit Charge Date', + layout: { addButtonText: 'Confirm' }, + formfields: formfields + }; + const editNoteDialogRef = this.dialog.open(FormDialogComponent, { data }); + editNoteDialogRef.afterClosed().subscribe((response: any) => { + if (response.data) { + let newCharge: any; + const dateFormat = 'dd MMMM yyyy'; + const date = this.datePipe.transform(response.data.value.date, dateFormat); + switch (charge.chargeTimeType.value) { + case 'Specified due date': + case 'Weekly Fee': + newCharge = { ...charge, dueDate: date }; + break; + case 'Annual Fee': + newCharge = { ...charge, feeOnMonthDay: date }; + break; + } + this.chargesDataSource.splice(this.chargesDataSource.indexOf(charge), 1, newCharge); + this.chargesDataSource = this.chargesDataSource.concat([]); + } + }); + this.pristine = false; + } + + /** + * Edits the Charge Fee Interval + * @param {any} charge Charge + */ + editChargeFeeInterval(charge: any) { + const formfields: FormfieldBase[] = [ + new InputBase({ + controlName: 'feeInterval', + label: 'Fee Interval', + value: charge.feeInterval, + type: 'text', + required: false + }), + ]; + const data = { + title: 'Edit Charge Fee Interval', + layout: { addButtonText: 'Confirm' }, + formfields: formfields + }; + const editNoteDialogRef = this.dialog.open(FormDialogComponent, { data }); + editNoteDialogRef.afterClosed().subscribe((response: any) => { + if (response.data) { + const newCharge = { ...charge, feeInterval: response.data.value.feeInterval }; + this.chargesDataSource.splice(this.chargesDataSource.indexOf(charge), 1, newCharge); + this.chargesDataSource = this.chargesDataSource.concat([]); + } + }); + this.pristine = false; + } + + /** + * Removes the charge from charges table + * @param {any} charge Charge + */ + deleteCharge(charge: any) { + const deleteChargeDialogRef = this.dialog.open(DeleteDialogComponent, { + data: { deleteContext: `charge ${charge.name}` } + }); + deleteChargeDialogRef.afterClosed().subscribe((response: any) => { + if (response.delete) { + this.chargesDataSource.splice(this.chargesDataSource.indexOf(charge), 1); + this.chargesDataSource = this.chargesDataSource.concat([]); + } + }); + this.pristine = false; + } + + /** + * Returns savings account charges + */ + get savingsAccountCharges() { + return { charges: this.chargesDataSource }; + } + +} diff --git a/src/app/savings/savings-account-stepper/savings-account-details-step/savings-account-details-step.component.html b/src/app/savings/savings-account-stepper/savings-account-details-step/savings-account-details-step.component.html new file mode 100644 index 000000000..06fe309c1 --- /dev/null +++ b/src/app/savings/savings-account-stepper/savings-account-details-step/savings-account-details-step.component.html @@ -0,0 +1,55 @@ +
+ +
+ + + Product Name + + + {{ product.name }} + + + + Product Name is required + + + + + Submitted On + + + + + Submission Date is required + + + + + Field Officer + + + {{ officer.displayName }} + + + + + + External ID + + + +
+ +
+ + +
+ +
diff --git a/src/app/savings/savings-account-stepper/savings-account-details-step/savings-account-details-step.component.scss b/src/app/savings/savings-account-stepper/savings-account-details-step/savings-account-details-step.component.scss new file mode 100644 index 000000000..e69de29bb diff --git a/src/app/savings/savings-account-stepper/savings-account-details-step/savings-account-details-step.component.spec.ts b/src/app/savings/savings-account-stepper/savings-account-details-step/savings-account-details-step.component.spec.ts new file mode 100644 index 000000000..617d1aca2 --- /dev/null +++ b/src/app/savings/savings-account-stepper/savings-account-details-step/savings-account-details-step.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { SavingsAccountDetailsStepComponent } from './savings-account-details-step.component'; + +describe('SavingsAccountDetailsStepComponent', () => { + let component: SavingsAccountDetailsStepComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ SavingsAccountDetailsStepComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(SavingsAccountDetailsStepComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/savings/savings-account-stepper/savings-account-details-step/savings-account-details-step.component.ts b/src/app/savings/savings-account-stepper/savings-account-details-step/savings-account-details-step.component.ts new file mode 100644 index 000000000..53bd71cf1 --- /dev/null +++ b/src/app/savings/savings-account-stepper/savings-account-details-step/savings-account-details-step.component.ts @@ -0,0 +1,85 @@ +/** Angular Imports */ +import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core'; +import { FormGroup, FormBuilder, Validators } from '@angular/forms'; + +/** Custom Services */ +import { SavingsService } from 'app/savings/savings.service'; + +/** + * Savings Account Details Step + */ +@Component({ + selector: 'mifosx-savings-account-details-step', + templateUrl: './savings-account-details-step.component.html', + styleUrls: ['./savings-account-details-step.component.scss'] +}) +export class SavingsAccountDetailsStepComponent implements OnInit { + + /** Savings Account Template */ + @Input() savingsAccountTemplate: any; + + /** Minimum date allowed. */ + minDate = new Date(2000, 0, 1); + /** Maximum date allowed. */ + maxDate = new Date(); + /** Product Data */ + productData: any; + /** Field Officer Data */ + fieldOfficerData: any; + /** Savings Account Details Form */ + savingsAccountDetailsForm: FormGroup; + + /** Savings Account Template with product data */ + @Output() savingsAccountProductTemplate = new EventEmitter(); + + /** + * Sets share account details form. + * @param {FormBuilder} formBuilder Form Builder. + * @param {SavingsService} savingsService Savings Service. + */ + constructor(private formBuilder: FormBuilder, + private savingsService: SavingsService) { + this.createSavingsAccountDetailsForm(); + } + + ngOnInit() { + this.buildDependencies(); + if (this.savingsAccountTemplate) { + this.productData = this.savingsAccountTemplate.productOptions; + } + } + + /** + * Creates savings account details form. + */ + createSavingsAccountDetailsForm() { + this.savingsAccountDetailsForm = this.formBuilder.group({ + 'productId': ['', Validators.required], + 'submittedOnDate': ['', Validators.required], + 'fieldOfficerId': [''], + 'externalId': [''] + }); + } + + /** + * Fetches savings account product template on productId value changes + */ + buildDependencies() { + const clientId = this.savingsAccountTemplate.clientId; + this.savingsAccountDetailsForm.get('productId').valueChanges.subscribe((productId: string) => { + this.savingsService.getSavingsAccountTemplate(clientId, productId).subscribe((response: any) => { + this.savingsAccountProductTemplate.emit(response); + this.savingsAccountDetailsForm.get('fieldOfficerId').patchValue(''); + this.fieldOfficerData = response.fieldOfficerOptions; + }); + }); + } + + /** + * Returns savings account form value. + */ + get savingsAccountDetails() { + return this.savingsAccountDetailsForm.value; + } + +} diff --git a/src/app/savings/savings-account-stepper/savings-account-preview-step/savings-account-preview-step.component.html b/src/app/savings/savings-account-stepper/savings-account-preview-step/savings-account-preview-step.component.html new file mode 100644 index 000000000..5c7a19546 --- /dev/null +++ b/src/app/savings/savings-account-stepper/savings-account-preview-step/savings-account-preview-step.component.html @@ -0,0 +1,196 @@ +
+ +

Details

+ + + +
+ Product + {{ savingsAccount.productId | find:savingsAccountTemplate.productOptions:'id':'name' }} +
+ +
+ Submitted On + {{ savingsAccount.submittedOnDate | date }} +
+ +
+ External Id + {{ savingsAccount.externalId || 'Unassigned' }} +
+ +
+ Field Officer + {{ savingsAccount.fieldOfficerId | find:savingsAccountProductTemplate.fieldOfficerOptions:'id':'displayName' }} +
+ +

Terms

+ + + +
+ Currency + {{ savingsAccountTermsForm.get('currencyCode').value }} +
+ +
+ Decimal Places + {{ savingsAccountTermsForm.get('decimal').value }} +
+ +
+ Nominal Annual Interest Rate: + {{ savingsAccount.nominalAnnualInterestRate }} +
+ +
+ Interest Compounding Period: + {{ savingsAccount.interestCompoundingPeriodType | find:savingsAccountProductTemplate.interestCompoundingPeriodTypeOptions:'id':'value' }} +
+ +
+ Currency in multiples of + {{ savingsAccountTermsForm.get('currencyMultiple').value }} +
+ +
+ Interest Posting Period: + {{ savingsAccount.interestPostingPeriodType | find:savingsAccountProductTemplate.interestPostingPeriodTypeOptions:'id':'value' }} +
+ +
+ Interest Calculated using: + {{ savingsAccount.interestCalculationType | find:savingsAccountProductTemplate.interestCalculationTypeOptions:'id':'value' }} +
+ +
+ Days in Year: + {{ savingsAccount.interestCalculationDaysInYearType | find:savingsAccountProductTemplate.interestCalculationDaysInYearTypeOptions:'id':'value' }} +
+ +
+ Minimum Opening Balance: + {{ savingsAccount.minRequiredOpeningBalance }} +
+ +
+ Apply Withdrawal Fee for Transfers: + {{ savingsAccount.withdrawalFeeForTransfers ? 'Yes' : 'No' }} +
+ +
+ Lock-in Period: + {{ savingsAccount.lockinPeriodFrequency + ' ' + (savingsAccount.lockinPeriodFrequencyType | find:savingsAccountProductTemplate.lockinPeriodFrequencyTypeOptions:'id':'value') }} +
+ +
+ Is Overdraft Allowed: + {{ savingsAccount.allowOverdraft ? 'Yes' : 'No' }} +
+ +
+ Minimum Overdraft Required for Interest Calculation: + {{ savingsAccount.minOverdraftForInterestCalculation }} +
+ +
+ Nominal Annual Interest for Overdraft: + {{ savingsAccount.nominalAnnualInterestRateOverdraft }} +
+ +
+ Maximum Overdraft Amount Limit: + {{ savingsAccount.overdraftLimit }} +
+ +
+ Enforce Minimum Balance: + {{ savingsAccount.enforceMinRequiredBalance ? 'Yes' : 'No' }} +
+ +
+ Minimum Balance: + {{ savingsAccount.minRequiredBalance }} +
+ +
+ +

Charges

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Name + {{ charge.name + ', ' + charge.currency.displaySymbol }} + Type + {{ charge.chargeCalculationType.value }} + Amount + {{ charge.amount }} + Date + + {{charge.dueDate || 'Unassigned'}} + + + {{charge.feeOnMonthDay || 'Unassigned'}} + + + N/A + + Repayments Every + {{ charge.feeInterval || 'Not Provided' }} + Collected On + {{ charge.chargeTimeType.value }} +
+ +
+ +
+ +
+ + + +
diff --git a/src/app/savings/savings-account-stepper/savings-account-preview-step/savings-account-preview-step.component.scss b/src/app/savings/savings-account-stepper/savings-account-preview-step/savings-account-preview-step.component.scss new file mode 100644 index 000000000..87258dacb --- /dev/null +++ b/src/app/savings/savings-account-stepper/savings-account-preview-step/savings-account-preview-step.component.scss @@ -0,0 +1,24 @@ +table { + width: 100%; +} + +.mat-elevation-z1 { + margin: 1em 0 1.5em 0; +} + +h2, h3, h4 { + margin: 0; + font-weight: 500; +} + +span { + margin: 0.5em 0; +} + +mat-divider { + margin: 0 0 0.5em 0; +} + +.margin-t { + margin-top: 1em; +} diff --git a/src/app/savings/savings-account-stepper/savings-account-preview-step/savings-account-preview-step.component.spec.ts b/src/app/savings/savings-account-stepper/savings-account-preview-step/savings-account-preview-step.component.spec.ts new file mode 100644 index 000000000..bc397e0c0 --- /dev/null +++ b/src/app/savings/savings-account-stepper/savings-account-preview-step/savings-account-preview-step.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { SavingsAccountPreviewStepComponent } from './savings-account-preview-step.component'; + +describe('SavingsAccountPreviewStepComponent', () => { + let component: SavingsAccountPreviewStepComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ SavingsAccountPreviewStepComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(SavingsAccountPreviewStepComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/savings/savings-account-stepper/savings-account-preview-step/savings-account-preview-step.component.ts b/src/app/savings/savings-account-stepper/savings-account-preview-step/savings-account-preview-step.component.ts new file mode 100644 index 000000000..450a6f782 --- /dev/null +++ b/src/app/savings/savings-account-stepper/savings-account-preview-step/savings-account-preview-step.component.ts @@ -0,0 +1,31 @@ +/** Angular Imports */ +import { Component, Input, Output, EventEmitter } from '@angular/core'; + +/** + * Savings account preview step + */ +@Component({ + selector: 'mifosx-savings-account-preview-step', + templateUrl: './savings-account-preview-step.component.html', + styleUrls: ['./savings-account-preview-step.component.scss'] +}) +export class SavingsAccountPreviewStepComponent { + + /** Savings Account Product Template */ + @Input() savingsAccountProductTemplate: any; + /** Savings Account Template */ + @Input() savingsAccountTemplate: any; + /** Savings Account Terms Form */ + @Input() savingsAccountTermsForm: any; + /** Savings Account */ + @Input() savingsAccount: any; + + /** Display columns for charges table */ + chargesDisplayedColumns: string[] = ['name', 'chargeCalculationType', 'amount', 'chargeTimeType', 'date', 'repaymentsEvery']; + + /** Form submission event */ + @Output() submit = new EventEmitter(); + + constructor() { } + +} diff --git a/src/app/savings/savings-account-stepper/savings-account-terms-step/savings-account-terms-step.component.html b/src/app/savings/savings-account-stepper/savings-account-terms-step/savings-account-terms-step.component.html new file mode 100644 index 000000000..0d8021aa9 --- /dev/null +++ b/src/app/savings/savings-account-stepper/savings-account-terms-step/savings-account-terms-step.component.html @@ -0,0 +1,157 @@ +
+ +
+ + + Currency + + + + + Decimal Places + + + + + Nominal Annual Interest Rate + + + Nominal Annual Interest is required + + + + + Interest Compounding Period + + + {{ interestCompoundingPeriodType.value }} + + + + Interest Compounding Period is required + + + + + Currency in multiples of + + + + + Interest Posting Period + + + {{ interestPostingPeriodType.value }} + + + + Interest Posting Period is required + + + + + Interest Calculated using + + + {{ interestCalculationType.value }} + + + + Interest Calculated using is required + + + + + Days in Year + + + {{ interestCalculationDaysInYearType.value }} + + + + Days in Year is required + + + + + Minimum Opening Balance + + + + + Apply Withdrawal Fee for Transfers + + +

Lock-in Period

+ + + Frequency + + + + + Type + + + {{ lockinPeriodFrequencyType.value }} + + + + + + +

Overdraft

+ + + Is Overdraft Allowed? + + +
+ + + Minimum Overdraft Required for Interest Calculation + + + + + Nominal Annual Interest for Overdraft + + + + + Maximum Overdraft Amount Limit + + + +
+ + + + + Enforce Minimum Balance + + + + Minimum Balance + + + + + Balance Required for Interest Calculation + + + +
+ +
+ + +
+ +
diff --git a/src/app/savings/savings-account-stepper/savings-account-terms-step/savings-account-terms-step.component.scss b/src/app/savings/savings-account-stepper/savings-account-terms-step/savings-account-terms-step.component.scss new file mode 100644 index 000000000..17e77f81d --- /dev/null +++ b/src/app/savings/savings-account-stepper/savings-account-terms-step/savings-account-terms-step.component.scss @@ -0,0 +1,24 @@ +h4 { + font-weight: 500; + margin: 1em 0; +} + +h3 { + font-weight: 500; +} + +mat-divider { + margin: 1em 0 2em 0; +} + +.margin-v { + margin: 1em 0; +} + +.margin-b { + margin: 0 0 1em 0; +} + +.margin-t { + margin-top: 1em; +} diff --git a/src/app/savings/savings-account-stepper/savings-account-terms-step/savings-account-terms-step.component.spec.ts b/src/app/savings/savings-account-stepper/savings-account-terms-step/savings-account-terms-step.component.spec.ts new file mode 100644 index 000000000..c299ed0d2 --- /dev/null +++ b/src/app/savings/savings-account-stepper/savings-account-terms-step/savings-account-terms-step.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { SavingsAccountTermsStepComponent } from './savings-account-terms-step.component'; + +describe('SavingsAccountTermsStepComponent', () => { + let component: SavingsAccountTermsStepComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ SavingsAccountTermsStepComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(SavingsAccountTermsStepComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/savings/savings-account-stepper/savings-account-terms-step/savings-account-terms-step.component.ts b/src/app/savings/savings-account-stepper/savings-account-terms-step/savings-account-terms-step.component.ts new file mode 100644 index 000000000..7a19dc383 --- /dev/null +++ b/src/app/savings/savings-account-stepper/savings-account-terms-step/savings-account-terms-step.component.ts @@ -0,0 +1,114 @@ +/** Angular Imports */ +import { Component, OnChanges, Input } from '@angular/core'; +import { FormGroup, FormBuilder, Validators, FormControl } from '@angular/forms'; + +/** + * Savings Account Terms Step + */ +@Component({ + selector: 'mifosx-savings-account-terms-step', + templateUrl: './savings-account-terms-step.component.html', + styleUrls: ['./savings-account-terms-step.component.scss'] +}) +export class SavingsAccountTermsStepComponent implements OnChanges { + + /** Savings Account and Product Template */ + @Input() savingsAccountProductTemplate: any; + + /** Minimum date allowed. */ + minDate = new Date(2000, 0, 1); + /** Maximum date allowed. */ + maxDate = new Date(); + /** Savings Account Terms Form */ + savingsAccountTermsForm: FormGroup; + /** Lockin Period Frequency Type Data */ + lockinPeriodFrequencyTypeData: any; + /** Interest Compounding Period Type Data */ + interestCompoundingPeriodTypeData: any; + /** Interest Posting Period Type Data */ + interestPostingPeriodTypeData: any; + /** Interest Calculation Type Data */ + interestCalculationTypeData: any; + /** Interest Calculation Days in Year Data */ + interestCalculationDaysInYearTypeData: any; + + /** + * @param {FormBuilder} formBuilder Form Builder + */ + constructor(private formBuilder: FormBuilder) { + this.createSavingsAccountTermsForm(); + this.buildDependencies(); + } + + ngOnChanges() { + if (this.savingsAccountProductTemplate) { + this.savingsAccountTermsForm.patchValue({ + 'currencyCode': this.savingsAccountProductTemplate.currency.code, + 'decimal': this.savingsAccountProductTemplate.currency.decimalPlaces, + 'currencyMultiple': this.savingsAccountProductTemplate.currency.inMultiplesOf, + 'minBalanceForInterestCalculation': this.savingsAccountProductTemplate.minBalanceForInterestCalculation + }); + this.setOptions(); + } + } + + /** + * Creates savings account terms form. + */ + createSavingsAccountTermsForm() { + this.savingsAccountTermsForm = this.formBuilder.group({ + 'currencyCode': [{value: '', disabled: true}], + 'decimal': [{value: '', disabled: true}], + 'nominalAnnualInterestRate': ['', Validators.required], + 'interestCompoundingPeriodType': ['', Validators.required], + 'currencyMultiple': [{value: '', disabled: true}], + 'interestPostingPeriodType': ['', Validators.required], + 'interestCalculationType': ['', Validators.required], + 'interestCalculationDaysInYearType': ['', Validators.required], + 'minRequiredOpeningBalance': [''], + 'withdrawalFeeForTransfers': [false], + 'lockinPeriodFrequency': [''], + 'lockinPeriodFrequencyType': [''], + 'allowOverdraft': [false], + 'enforceMinRequiredBalance': [false], + 'minRequiredBalance': [''], + 'minBalanceForInterestCalculation': [{value: '', disabled: true}] + }); + } + + /** + * Sets all select dropdown options. + */ + setOptions() { + this.lockinPeriodFrequencyTypeData = this.savingsAccountProductTemplate.lockinPeriodFrequencyTypeOptions; + this.interestCompoundingPeriodTypeData = this.savingsAccountProductTemplate.interestCompoundingPeriodTypeOptions; + this.interestPostingPeriodTypeData = this.savingsAccountProductTemplate.interestPostingPeriodTypeOptions; + this.interestCalculationTypeData = this.savingsAccountProductTemplate.interestCalculationTypeOptions; + this.interestCalculationDaysInYearTypeData = this.savingsAccountProductTemplate.interestCalculationDaysInYearTypeOptions; + } + + /** + * Subscribes to value changes and sets new form controls accordingly. + */ + buildDependencies() { + this.savingsAccountTermsForm.get('allowOverdraft').valueChanges.subscribe((allowOverdraft: any) => { + if (allowOverdraft) { + this.savingsAccountTermsForm.addControl('minOverdraftForInterestCalculation', new FormControl('')); + this.savingsAccountTermsForm.addControl('nominalAnnualInterestRateOverdraft', new FormControl('')); + this.savingsAccountTermsForm.addControl('overdraftLimit', new FormControl('')); + } else { + this.savingsAccountTermsForm.removeControl('minOverdraftForInterestCalculation'); + this.savingsAccountTermsForm.removeControl('nominalAnnualInterestRateOverdraft'); + this.savingsAccountTermsForm.removeControl('overdraftLimit'); + } + }); + } + + /** + * Returns savings account terms form value. + */ + get savingsAccountTerms() { + return this.savingsAccountTermsForm.value; + } + +} diff --git a/src/app/savings/savings-routing.module.ts b/src/app/savings/savings-routing.module.ts index 16b8b6588..21aaa5e57 100644 --- a/src/app/savings/savings-routing.module.ts +++ b/src/app/savings/savings-routing.module.ts @@ -13,6 +13,7 @@ import { AddSavingsChargeComponent } from './add-savings-charge/add-savings-char import { ChargesTabComponent } from './savings-account-view/charges-tab/charges-tab.component'; import { StandingInstructionsTabComponent } from './savings-account-view/standing-instructions-tab/standing-instructions-tab.component'; import { DatatableTabsComponent } from './savings-account-view/datatable-tabs/datatable-tabs.component'; +import { CreateSavingsAccountComponent } from './create-savings-account/create-savings-account.component'; /** Custom Resolvers */ import { SavingAccountTransactionTemplateResolver } from './common-resolvers/saving-transaction-template.resolver'; @@ -20,12 +21,21 @@ import { SavingsChargeTemplateResolver } from './common-resolvers/savings-charge import { SavingsAccountViewResolver } from './common-resolvers/savings-account-view.resolver'; import { SavingsDatatableResolver } from './common-resolvers/savings-datatable.resolver'; import { SavingsDatatablesResolver } from './common-resolvers/savings-datatables.resolver'; +import { SavingsAccountTemplateResolver } from './common-resolvers/savings-account-template.resolver'; const routes: Routes = [ { path: '', data: { title: extract('All Savings'), breadcrumb: 'Savings', routeParamBreadcrumb: false }, children: [ + { + path: 'create-savings-account', + data: { title: extract('Create Savings Account'), breadcrumb: 'Create Savings Account' }, + component: CreateSavingsAccountComponent, + resolve: { + savingsAccountTemplate: SavingsAccountTemplateResolver + } + }, { path: ':savingAccountId', data: { title: extract('Saving Account View'), routeParamBreadcrumb: 'savingAccountId' }, @@ -92,6 +102,7 @@ const routes: Routes = [ SavingsChargeTemplateResolver, SavingsAccountViewResolver, SavingsDatatablesResolver, - SavingsDatatableResolver] + SavingsDatatableResolver, + SavingsAccountTemplateResolver] }) export class SavingsRoutingModule {} diff --git a/src/app/savings/savings.module.ts b/src/app/savings/savings.module.ts index 911a9fdba..e173cfc44 100644 --- a/src/app/savings/savings.module.ts +++ b/src/app/savings/savings.module.ts @@ -19,6 +19,11 @@ import { StandingInstructionsTabComponent } from './savings-account-view/standin import { DatatableTabsComponent } from './savings-account-view/datatable-tabs/datatable-tabs.component'; import { MultiRowComponent } from './savings-account-view/datatable-tabs/multi-row/multi-row.component'; import { SingleRowComponent } from './savings-account-view/datatable-tabs/single-row/single-row.component'; +import { CreateSavingsAccountComponent } from './create-savings-account/create-savings-account.component'; +import { SavingsAccountDetailsStepComponent } from './savings-account-stepper/savings-account-details-step/savings-account-details-step.component'; +import { SavingsAccountChargesStepComponent } from './savings-account-stepper/savings-account-charges-step/savings-account-charges-step.component'; +import { SavingsAccountTermsStepComponent } from './savings-account-stepper/savings-account-terms-step/savings-account-terms-step.component'; +import { SavingsAccountPreviewStepComponent } from './savings-account-stepper/savings-account-preview-step/savings-account-preview-step.component'; /** * Savings Module @@ -42,7 +47,12 @@ import { SingleRowComponent } from './savings-account-view/datatable-tabs/single StandingInstructionsTabComponent, DatatableTabsComponent, MultiRowComponent, - SingleRowComponent + SingleRowComponent, + CreateSavingsAccountComponent, + SavingsAccountDetailsStepComponent, + SavingsAccountChargesStepComponent, + SavingsAccountTermsStepComponent, + SavingsAccountPreviewStepComponent ], providers: [DatePipe] }) diff --git a/src/app/savings/savings.service.ts b/src/app/savings/savings.service.ts index a86a59161..21898149e 100644 --- a/src/app/savings/savings.service.ts +++ b/src/app/savings/savings.service.ts @@ -138,4 +138,22 @@ export class SavingsService { return this.http.delete(`/datatables/${datatableName}/${accountId}`, { params: httpParams }); } + /** + * @param clientId Client Id assosciated with savings account. + * @returns {Observable} Savings account template. + */ + getSavingsAccountTemplate(clientId: string, productId?: string): Observable { + let httpParams = new HttpParams().set('clientId', clientId); + httpParams = productId ? httpParams.set('productId', productId) : httpParams; + return this.http.get('/savingsaccounts/template', { params: httpParams }); + } + + /** + * @param {any} savingsAccount Savings Account + * @returns {Observable} + */ + createSavingsAccount(savingsAccount: any): Observable { + return this.http.post('/savingsaccounts', savingsAccount); + } + } diff --git a/src/app/shares/shares-account-stepper/shares-account-charges-step/shares-account-charges-step.component.html b/src/app/shares/shares-account-stepper/shares-account-charges-step/shares-account-charges-step.component.html index 65b063bf4..0a048842b 100644 --- a/src/app/shares/shares-account-stepper/shares-account-charges-step/shares-account-charges-step.component.html +++ b/src/app/shares/shares-account-stepper/shares-account-charges-step/shares-account-charges-step.component.html @@ -35,7 +35,7 @@ Amount - {{ charge.amount }} + {{ charge.amount || charge.amountOrPercentage }} diff --git a/src/app/shares/shares-account-stepper/shares-account-charges-step/shares-account-charges-step.component.ts b/src/app/shares/shares-account-stepper/shares-account-charges-step/shares-account-charges-step.component.ts index 099713553..87a119ffc 100644 --- a/src/app/shares/shares-account-stepper/shares-account-charges-step/shares-account-charges-step.component.ts +++ b/src/app/shares/shares-account-stepper/shares-account-charges-step/shares-account-charges-step.component.ts @@ -1,5 +1,5 @@ /** Angular Imports */ -import { Component, OnInit, Input } from '@angular/core'; +import { Component, OnInit, OnChanges, Input } from '@angular/core'; import { MatDialog } from '@angular/material'; import { FormControl } from '@angular/forms'; @@ -19,7 +19,7 @@ import { InputBase } from 'app/shared/form-dialog/formfield/model/input-base'; templateUrl: './shares-account-charges-step.component.html', styleUrls: ['./shares-account-charges-step.component.scss'] }) -export class SharesAccountChargesStepComponent implements OnInit { +export class SharesAccountChargesStepComponent implements OnInit, OnChanges { /** Shares Account Product Template */ @Input() sharesAccountProductTemplate: any; @@ -29,9 +29,9 @@ export class SharesAccountChargesStepComponent implements OnInit { @Input() currencyCode: FormControl; /** Charge Data */ - chargeData: any; + chargeData: any = []; /** Charges Data Source */ - chargesDataSource: {}[]; + chargesDataSource: {}[] = []; /** Component is pristine if there has been no changes by user interaction */ pristine = true; /** For Edit Shares Account Form */ @@ -45,12 +45,6 @@ export class SharesAccountChargesStepComponent implements OnInit { constructor(public dialog: MatDialog) {} ngOnInit() { - this.chargesDataSource = []; - this.chargeData = this.sharesAccountTemplate.chargeOptions.map((charge: any) => { - charge.chargeId = charge.id; - delete charge.id; - return charge; - }); this.currencyCode.valueChanges.subscribe(() => { if (!this.isChargesPatched && this.sharesAccountTemplate.charges) { this.chargesDataSource = this.sharesAccountTemplate.charges; @@ -61,6 +55,12 @@ export class SharesAccountChargesStepComponent implements OnInit { }); } + ngOnChanges() { + if (this.sharesAccountProductTemplate) { + this.chargeData = this.sharesAccountProductTemplate.charges; + } + } + /** * Adds the charge to charges table * @param {any} charge Charge @@ -80,7 +80,7 @@ export class SharesAccountChargesStepComponent implements OnInit { new InputBase({ controlName: 'amount', label: 'Amount', - value: charge.amount, + value: charge.amount || charge.amountOrPercentage, type: 'text', required: true, }), diff --git a/src/app/shares/shares-account-stepper/shares-account-preview-step/shares-account-preview-step.component.html b/src/app/shares/shares-account-stepper/shares-account-preview-step/shares-account-preview-step.component.html index 7d8c87adc..1bbfe8895 100644 --- a/src/app/shares/shares-account-stepper/shares-account-preview-step/shares-account-preview-step.component.html +++ b/src/app/shares/shares-account-stepper/shares-account-preview-step/shares-account-preview-step.component.html @@ -98,7 +98,7 @@ Amount - {{ charge.amount }} + {{ charge.amount || charge.amountOrPercentage }}