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
@@ -1,83 +1,89 @@
<div class="container">
<h2 mat-title *ngIf="transactionType.withdrawal">Withdraw Money From Saving Account</h2>
<h2 mat-title *ngIf="transactionType.deposit">Deposit Money To Saving Account</h2>
<form [formGroup]="savingAccountTransactionForm" (ngSubmit)="submit()">
<mat-card>
<mat-card-content fxLayout="column">
<h2 mat-title *ngIf="transactionType.withdrawal">Withdraw Money From Saving Account</h2>
<h2 mat-title *ngIf="transactionType.deposit">Deposit Money To Saving Account</h2>
<mat-form-field>
<mat-label>Transaction Date</mat-label>
<input matInput [min]="minDate" [max]="maxDate" [matDatepicker]="dueDatePicker"
formControlName="transactionDate" required>
<mat-datepicker-toggle matSuffix [for]="dueDatePicker"></mat-datepicker-toggle>
<mat-datepicker #dueDatePicker></mat-datepicker>
<mat-error *ngIf="savingAccountTransactionForm.controls.transactionDate.hasError('required')">
Transaction Date is <strong>required</strong>
</mat-error>
</mat-form-field>
<form [formGroup]="savingAccountTransactionForm" (ngSubmit)="submit()">
<mat-form-field>
<mat-label>Transaction Amount</mat-label>
<input type="number" formControlName="transactionAmount" required matInput />
<mat-error *ngIf="savingAccountTransactionForm.controls.transactionAmount.hasError('required')">
Transaction Amount is <strong>required</strong>
</mat-error>
</mat-form-field>
<mat-card-content fxLayout="column">
<mat-form-field>
<mat-label>Payment Type</mat-label>
<mat-select formControlName="paymentTypeId">
<mat-option *ngFor="let paymentType of paymentTypeOptions" [value]="paymentType.id">
{{ paymentType.name }}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-label>Transaction Date</mat-label>
<input matInput [min]="minDate" [max]="maxDate" [matDatepicker]="dueDatePicker"
formControlName="transactionDate" required>
<mat-datepicker-toggle matSuffix [for]="dueDatePicker"></mat-datepicker-toggle>
<mat-datepicker #dueDatePicker></mat-datepicker>
<mat-error *ngIf="savingAccountTransactionForm.controls.transactionDate.hasError('required')">
Transaction Date is <strong>required</strong>
</mat-error>
</mat-form-field>
<div fxLayoutGap="5px" fxLayout="row" fxLayout.xs="column">
<mat-label fxFlexAlign="center">Show Payment Details</mat-label>
<button type="button" mat-mini-fab color="primary" (click)="addPaymentDetails()">
<fa-icon icon="plus-circle" size="lg"></fa-icon>
</button>
</div>
<mat-form-field>
<mat-label>Transaction Amount</mat-label>
<input type="number" formControlName="transactionAmount" required matInput />
<mat-error *ngIf="savingAccountTransactionForm.controls.transactionAmount.hasError('required')">
Transaction Amount is <strong>required</strong>
</mat-error>
</mat-form-field>
<mat-form-field>
<mat-label>Payment Type</mat-label>
<mat-select formControlName="paymentTypeId">
<mat-option *ngFor="let paymentType of paymentTypeOptions" [value]="paymentType.id">
{{ paymentType.name }}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="savingAccountTransactionForm.controls['accountNumber']">
<mat-label>Account Number</mat-label>
<input type="number" formControlName="accountNumber" matInput />
</mat-form-field>
<div fxLayoutGap="5px" fxLayout="row" fxLayout.xs="column">
<mat-label fxFlexAlign="center">Show Payment Details</mat-label>
<button type="button" mat-mini-fab color="primary" (click)="addPaymentDetails()">
<fa-icon icon="plus-circle" size="lg"></fa-icon>
</button>
</div>
<mat-form-field *ngIf="savingAccountTransactionForm.controls['checkNumber']">
<mat-label>Cheque</mat-label>
<input type="number" formControlName="checkNumber" matInput />
</mat-form-field>
<mat-form-field *ngIf="savingAccountTransactionForm.controls['accountNumber']">
<mat-label>Account Number</mat-label>
<input type="number" formControlName="accountNumber" matInput />
</mat-form-field>
<mat-form-field *ngIf="savingAccountTransactionForm.controls['routingCode']">
<mat-label>Routing Code</mat-label>
<input formControlName="routingCode" matInput />
</mat-form-field>
<mat-form-field *ngIf="savingAccountTransactionForm.controls['checkNumber']">
<mat-label>Cheque</mat-label>
<input type="number" formControlName="checkNumber" matInput />
</mat-form-field>
<mat-form-field *ngIf="savingAccountTransactionForm.controls['receiptNumber']">
<mat-label>Receipt Number</mat-label>
<input formControlName="receiptNumber" matInput />
</mat-form-field>
<mat-form-field *ngIf="savingAccountTransactionForm.controls['routingCode']">
<mat-label>Routing Code</mat-label>
<input formControlName="routingCode" matInput />
</mat-form-field>
<mat-form-field *ngIf="savingAccountTransactionForm.controls['bankNumber']">
<mat-label>Bank</mat-label>
<input formControlName="bankNumber" matInput />
</mat-form-field>
<mat-form-field *ngIf="savingAccountTransactionForm.controls['receiptNumber']">
<mat-label>Receipt Number</mat-label>
<input formControlName="receiptNumber" matInput />
</mat-form-field>
<mat-form-field *ngIf="savingAccountTransactionForm.controls['bankNumber']">
<mat-label>Bank</mat-label>
<input formControlName="bankNumber" matInput />
</mat-form-field>
<mat-form-field>
<mat-label>Notes</mat-label>
<textarea formControlName="note" matInput></textarea>
</mat-form-field>
<mat-form-field>
<mat-label>Notes</mat-label>
<textarea formControlName="note" matInput></textarea>
</mat-form-field>
<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]="!savingAccountTransactionForm.valid">Submit</button>
</mat-card-actions>
<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]="!savingAccountTransactionForm.valid">Submit</button>
</mat-card-actions>
</mat-card-content>
</form>
</mat-card>
</mat-card-content>
</form>
</div>
@@ -1,3 +1,3 @@
.container{
width: 70%;
.container {
width: 37rem;
}
@@ -53,20 +53,18 @@ export class SavingsAccountTransactionsComponent implements OnInit {
private router: Router,
private datePipe: DatePipe,
private savingsService: SavingsService) {
this.route.data.subscribe((data: { savingAccountTransactionTemplate: any }) => {
this.paymentTypeOptions = data.savingAccountTransactionTemplate.paymentTypeOptions;
this.route.data.subscribe((data: { savingsAccountActionData: any }) => {
this.paymentTypeOptions = data.savingsAccountActionData.paymentTypeOptions;
});
this.transactionCommand = this.route.snapshot.params['name'].toLowerCase();
this.transactionType[this.transactionCommand] = true;
this.savingAccountId = this.route.parent.snapshot.params['savingAccountId'];
}
/**
* Creates the Saving account transaction form when component loads.
*/
ngOnInit() {
this.route.queryParams.subscribe(params => {
this.transactionType[params.type] = true;
this.transactionCommand = params.type;
});
this.savingAccountId = this.route.snapshot.params['savingAccountId'];
this.createSavingAccountTransactionForm();
}
@@ -115,8 +113,8 @@ export class SavingsAccountTransactionsComponent implements OnInit {
const transactionData = this.savingAccountTransactionForm.value;
transactionData.locale = 'en';
transactionData.dateFormat = dateFormat;
this.savingsService.makeTransaction(this.transactionCommand, this.savingAccountId, transactionData).subscribe(res => {
this.router.navigate(['../'], { relativeTo: this.route });
this.savingsService.executeSavingsAccountTransactionsCommand(this.savingAccountId, this.transactionCommand, transactionData).subscribe(res => {
this.router.navigate(['../../'], { relativeTo: this.route });
});
}
}