feat: add loan transactions tab actions (#1206)

- add export transaction - add view transactions - add edit transactions - add undo transactions - add view receipt Fixes: #1205
2020-08-15 19:26:05 +05:30
parent c42e128b09
commit 537d8482c7
26 changed files with 985 additions and 54 deletions
@@ -0,0 +1,123 @@
+/** 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 { LoansService } from 'app/loans/loans.service';
+
+/**
+ * Edit Transaction component.
+ */
+@Component({
+  selector: 'mifosx-edit-transaction',
+  templateUrl: './edit-transaction.component.html',
+  styleUrls: ['./edit-transaction.component.scss']
+})
+export class EditTransactionComponent implements OnInit {
+
+  /** Minimum Due Date allowed. */
+  minDate = new Date(2000, 0, 1);
+  /** Maximum Due Date allowed. */
+  maxDate = new Date();
+  /** Loans account transaction form. */
+  editTransactionForm: FormGroup;
+  /** loans account transaction payment options. */
+  paymentTypeOptions: {
+    id: number,
+    name: string,
+    description: string,
+    isCashPayment: boolean,
+    position: number
+  }[];
+  /** Flag to enable payment details fields. */
+  addPaymentDetailsFlag: Boolean = false;
+  /** loan account's Id */
+  loanAccountId: string;
+  /** Transaction Template */
+  transactionTemplateData: any;
+
+  /**
+   * Retrieves the Loan Account transaction template data from `resolve`.
+   * @param {FormBuilder} formBuilder Form Builder.
+   * @param {LoansService} loansService Loans Service.
+   * @param {ActivatedRoute} route Activated Route.
+   * @param {DatePipe} datePipe DatePipe.
+   * @param {Router} router Router for navigation.
+   */
+  constructor(private formBuilder: FormBuilder,
+              private route: ActivatedRoute,
+              private router: Router,
+              private datePipe: DatePipe,
+              private loansService: LoansService) {
+    this.route.data.subscribe((data: { loansAccountTransactionTemplate: any }) => {
+      this.transactionTemplateData = data.loansAccountTransactionTemplate;
+      this.paymentTypeOptions = this.transactionTemplateData.paymentTypeOptions;
+    });
+    this.loanAccountId = this.route.parent.parent.parent.snapshot.params['loanId'];
+  }
+
+  /**
+   * Creates the Loan account transaction form when component loads.
+   */
+  ngOnInit() {
+    this.createEditTransactionForm();
+    this.editTransactionForm.patchValue({
+      'transactionDate': this.transactionTemplateData.date && new Date(this.transactionTemplateData.date),
+      'transactionAmount': this.transactionTemplateData.amount,
+      'paymentTypeId': this.transactionTemplateData.paymentTypeId
+    });
+  }
+
+  /**
+   * Method to create the Loan Account Transaction Form.
+   */
+  createEditTransactionForm() {
+    this.editTransactionForm = this.formBuilder.group({
+      'transactionDate': ['', Validators.required],
+      'transactionAmount': ['', Validators.required],
+      'paymentTypeId': [''],
+    });
+  }
+
+  /**
+   * Method to add payment detail fields to the UI.
+   */
+  addPaymentDetails() {
+    this.addPaymentDetailsFlag = !this.addPaymentDetailsFlag;
+    if (this.addPaymentDetailsFlag) {
+      this.editTransactionForm.addControl('accountNumber', new FormControl(''));
+      this.editTransactionForm.addControl('checkNumber', new FormControl(''));
+      this.editTransactionForm.addControl('routingCode', new FormControl(''));
+      this.editTransactionForm.addControl('receiptNumber', new FormControl(''));
+      this.editTransactionForm.addControl('bankNumber', new FormControl(''));
+    } else {
+      this.editTransactionForm.removeControl('accountNumber');
+      this.editTransactionForm.removeControl('checkNumber');
+      this.editTransactionForm.removeControl('routingCode');
+      this.editTransactionForm.removeControl('receiptNumber');
+      this.editTransactionForm.removeControl('bankNumber');
+    }
+  }
+
+  /**
+   * Method to submit the transaction details.
+   */
+  submit() {
+    const prevTransactionDate: Date = this.editTransactionForm.value.transactionDate;
+    // TODO: Update once language and date settings are setup
+    const dateFormat = 'dd-MM-yyyy';
+    this.editTransactionForm.patchValue({
+      transactionDate: this.datePipe.transform(prevTransactionDate, dateFormat)
+    });
+    const transactionData = this.editTransactionForm.value;
+    transactionData.locale = 'en';
+    transactionData.dateFormat = dateFormat;
+    this.loansService.executeLoansAccountTransactionsCommand(this.loanAccountId, 'modify', transactionData, this.transactionTemplateData.id)
+      .subscribe((res: any) => {
+        this.router.navigate(['../'], { relativeTo: this.route });
+      });
+  }
+
+}