refactor: existing savings account actions (#941)

Fixes: #940
This commit is contained in:
Karan Takalkar
2020-06-28 17:13:05 +05:30
committed by GitHub
parent af5f9995f0
commit 35a25e018f
31 changed files with 294 additions and 275 deletions
@@ -0,0 +1,93 @@
<div class="container">
<mat-card>
<form [formGroup]="savingsChargeForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="column">
<mat-form-field>
<mat-label>Charge</mat-label>
<mat-select required formControlName="chargeId">
<mat-option *ngFor="let savingsCharge of savingsChargeOptions" [value]="savingsCharge.id">
{{ savingsCharge.name + ' (' + savingsCharge.currency.name + ')' }}
</mat-option>
</mat-select>
<mat-error *ngIf="savingsChargeForm.controls.chargeId.hasError('required')">
Charge is <strong>required</strong>
</mat-error>
</mat-form-field>
<div *ngIf="chargeDetails" fxLayout="column">
<mat-form-field>
<mat-label>Amount</mat-label>
<input type=number required matInput formControlName="amount" />
<mat-error *ngIf="savingsChargeForm.controls.amount.hasError('required')">
Amount is <strong>required</strong>
</mat-error>
</mat-form-field>
<mat-form-field>
<mat-label>Charge Calculation</mat-label>
<mat-select formControlName="chargeCalculationType">
<mat-option *ngFor="let chargeCalculation of chargeDetails.chargeCalculationTypeOptions"
[value]="chargeCalculation.id">
{{ chargeCalculation.value }}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-label>Charge time type</mat-label>
<mat-select formControlName="chargeTimeType">
<mat-option *ngFor="let chargeTime of chargeDetails.chargeTimeTypeOptions" [value]="chargeTime.id">
{{ chargeTime.value }}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="savingsChargeForm.contains('dueDate')">
<mat-label>Due for collection on</mat-label>
<input matInput [min]="minDate" [max]="maxDate" [matDatepicker]="dueDatePicker" required
formControlName="dueDate">
<mat-datepicker-toggle matSuffix [for]="dueDatePicker"></mat-datepicker-toggle>
<mat-datepicker #dueDatePicker></mat-datepicker>
<mat-error *ngIf="savingsChargeForm.controls.dueDate.hasError('required')">
Due for collection on is <strong>required</strong>
</mat-error>
</mat-form-field>
<mat-form-field *ngIf="savingsChargeForm.contains('feeOnMonthDay')">
<mat-label>Due On</mat-label>
<input matInput [min]="minDate" [max]="maxDate" [matDatepicker]="feeOnMonthDayPicker" required
formControlName="feeOnMonthDay">
<mat-datepicker-toggle matSuffix [for]="feeOnMonthDayPicker"></mat-datepicker-toggle>
<mat-datepicker #feeOnMonthDayPicker></mat-datepicker>
<mat-error *ngIf="savingsChargeForm.controls.feeOnMonthDay.hasError('required')">
Due Date is <strong>required</strong>
</mat-error>
</mat-form-field>
<mat-form-field *ngIf="savingsChargeForm.contains('feeInterval')">
<mat-label>Repeats Every</mat-label>
<input matInput formControlName="feeInterval" />
</mat-form-field>
</div>
</div>
<mat-card-actions fxLayoutGap="5px" fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center">
<button type="button" mat-raised-button [routerLink]="['../../']">Cancel</button>
<button mat-raised-button color="primary" [disabled]="!savingsChargeForm.valid">Submit</button>
</mat-card-actions>
</mat-card-content>
</form>
</mat-card>
</div>
@@ -0,0 +1,3 @@
.container {
width: 37rem;
}
@@ -0,0 +1,25 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { AddChargeSavingsAccountComponent } from './add-charge-savings-account.component';
describe('AddChargeSavingsAccountComponent', () => {
let component: AddChargeSavingsAccountComponent;
let fixture: ComponentFixture<AddChargeSavingsAccountComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ AddChargeSavingsAccountComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(AddChargeSavingsAccountComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
@@ -0,0 +1,140 @@
/** Angular Imports */
import { Component, OnInit } from '@angular/core';
import { FormGroup, FormBuilder, Validators, FormControl } from '@angular/forms';
import { Router, ActivatedRoute } from '@angular/router';
import { DatePipe } from '@angular/common';
/** Custom Services */
import { SavingsService } from '../../savings.service';
/**
* Add Savings Charge component.
*/
@Component({
selector: 'mifosx-add-charge-savings-account',
templateUrl: './add-charge-savings-account.component.html',
styleUrls: ['./add-charge-savings-account.component.scss']
})
export class AddChargeSavingsAccountComponent implements OnInit {
/** Minimum Due Date allowed. */
minDate = new Date(2000, 0, 1);
/** Maximum Due Date allowed. */
maxDate = new Date();
/** Add Savings Charge form. */
savingsChargeForm: FormGroup;
/** savings charge options. */
savingsChargeOptions: any;
/** savings Id of the savings account. */
savingAccountId: string;
/** charge details */
chargeDetails: any;
/**
* Retrieves charge template data from `resolve`
* @param {FormBuilder} formBuilder Form Builder
* @param {ActivatedRoute} route Activated Route
* @param {Router} router Router
* @param {DatePipe} datePipe Date Pipe
* @param {SavingsService} savingsService Savings Service
*/
constructor(
private formBuilder: FormBuilder,
private route: ActivatedRoute,
private router: Router,
private datePipe: DatePipe,
private savingsService: SavingsService
) {
this.route.data.subscribe((data: { savingsAccountActionData: any }) => {
this.savingsChargeOptions = data.savingsAccountActionData.chargeOptions;
});
this.savingAccountId = this.route.parent.snapshot.params['savingAccountId'];
}
/**
* Creates the Savings Charge form.
*/
ngOnInit() {
this.createSavingsChargeForm();
this.buildDependencies();
}
buildDependencies() {
this.savingsChargeForm.controls.chargeId.valueChanges.subscribe(chargeId => {
this.savingsService.getChargeTemplate(chargeId).subscribe((data: any) => {
this.chargeDetails = data;
const chargeTimeType = data.chargeTimeType.id;
if (data.chargeTimeType.value === 'Withdrawal Fee' || data.chargeTimeType.value === 'Saving No Activity Fee') {
this.chargeDetails.dueDateNotRequired = true;
}
if (data.chargeTimeType.value === 'Annual Fee' || data.chargeTimeType.value === 'Monthly Fee') {
this.chargeDetails.chargeTimeTypeAnnualOrMonth = true;
}
if (!this.chargeDetails.dueDateNotRequired && !this.chargeDetails.chargeTimeTypeAnnualOrMonth) {
this.savingsChargeForm.addControl('dueDate', new FormControl('', Validators.required));
} else {
this.savingsChargeForm.removeControl('dueDate');
}
if (!this.chargeDetails.dueDateNotRequired && this.chargeDetails.chargeTimeTypeAnnualOrMonth) {
this.savingsChargeForm.addControl('feeOnMonthDay', new FormControl('', Validators.required));
} else {
this.savingsChargeForm.removeControl('feeOnMonthDay');
}
if (chargeTimeType.value === 'Monthly Fee') {
this.savingsChargeForm.addControl('feeInterval', new FormControl(data.feeInterval, Validators.required));
} else {
this.savingsChargeForm.removeControl('feeInterval');
}
this.savingsChargeForm.patchValue({
'amount': data.amount,
'chargeCalculationType': data.chargeCalculationType.id,
'chargeTimeType': data.chargeTimeType.id
});
});
});
}
/**
* Creates the Savings Charge form.
*/
createSavingsChargeForm() {
this.savingsChargeForm = this.formBuilder.group({
'chargeId': ['', Validators.required],
'amount': ['', Validators.required],
'chargeCalculationType': [{ value: '', disabled: true }],
'chargeTimeType': [{ value: '', disabled: true }]
});
}
/**
* Submits savings charge.
*/
submit() {
const savingsCharge = this.savingsChargeForm.value;
savingsCharge.locale = 'en';
if (!savingsCharge.feeInterval) {
savingsCharge.feeInterval = this.chargeDetails.feeInterval;
}
if (this.chargeDetails.dueDateNotRequired !== true) {
if (this.chargeDetails.chargeTimeTypeAnnualOrMonth === true) {
const monthDayFormat = 'MMMM-dd'; // TODO: Update once language and date settings are setup
savingsCharge.monthDayFormat = monthDayFormat;
if (savingsCharge.feeOnMonthDay) {
const prevDate = this.savingsChargeForm.value.feeOnMonthDay;
savingsCharge.feeOnMonthDay = this.datePipe.transform(prevDate, monthDayFormat);
}
} else {
const dateFormat = 'yyyy-MM-dd';
savingsCharge.dateFormat = dateFormat;
if (savingsCharge.dueDate) {
const prevDate = this.savingsChargeForm.value.dueDate;
savingsCharge.dueDate = this.datePipe.transform(prevDate, dateFormat);
}
}
}
this.savingsService.createSavingsCharge(this.savingAccountId, 'charges', savingsCharge).subscribe( () => {
this.router.navigate(['../../'], { relativeTo: this.route });
});
}
}