refractor: accounting module (#300)

* Refractor components.
* Add resolvers.
* Add relative router links.
* Replace mat-icons by font-awesome icons.
* Add comments.

Fixes: #298

src/app/accounting/closing-entries/closing-entries.component.ts

@@ -1,10 +1,15 @@
+/** Angular Imports */
 import { Component, OnInit, ViewChild } from '@angular/core';
 import { MatPaginator, MatSort, MatTableDataSource } from '@angular/material';
 import { FormControl } from '@angular/forms';
-import { startWith, map, tap } from 'rxjs/operators';
+import { ActivatedRoute } from '@angular/router';
 
-import { AccountingService } from '../accounting.service';
+/** rxjs Imports */
+import { startWith, map } from 'rxjs/operators';
 
+/**
+ * Closing entries component.
+ */
 @Component({
   selector: 'mifosx-closing-entries',
   templateUrl: './closing-entries.component.html',
@@ -12,52 +17,84 @@ import { AccountingService } from '../accounting.service';
 })
 export class ClosingEntriesComponent implements OnInit {
 
+  /** Columns to be displayed in closing entries table. */
   displayedColumns: string[] = ['officeName', 'closingDate', 'comments', 'createdByUsername'];
-  dataSource: any;
-
+  /** Data source for closing entries table. */
+  dataSource: MatTableDataSource<any>;
+  /** Office name filter form control. */
   officeName = new FormControl();
+  /** Office data. */
   officeData: any;
+  /** Filtered office data for autocomplete. */
   filteredOfficeData: any;
+  /** GL Account closure data. */
+  glAccountClosureData: any;
 
+  /** Paginator for closing entries table. */
   @ViewChild(MatPaginator) paginator: MatPaginator;
+  /** Sorter for closing entries table. */
   @ViewChild(MatSort) sort: MatSort;
 
-  constructor(private accountingService: AccountingService) { }
-
-  ngOnInit() {
-    this.getOffices();
-    this.applyFilter();
-    this.getAccountingClosures();
+  /**
+   * Retrieves the offices and gl account closures data from `resolve`.
+   * @param {ActivatedRoute} route Activated Route.
+   */
+  constructor(private route: ActivatedRoute) {
+    this.route.data.subscribe((data: {
+      offices: any,
+      glAccountClosures: any
+    }) => {
+      this.officeData = data.offices;
+      this.glAccountClosureData = data.glAccountClosures;
+    });
   }
 
+  /**
+   * Sets the filter and closing entries table.
+   */
+  ngOnInit() {
+    this.applyFilter();
+    this.setFilteredOffices();
+    this.setAccountingClosures();
+  }
+
+  /**
+   * Filters data in closing entries table based on office name.
+   */
   applyFilter() {
     this.officeName.valueChanges.subscribe((filterValue: string) => {
       this.dataSource.filter = filterValue.trim().toLowerCase();
     });
   }
 
-  getAccountingClosures() {
-    this.accountingService.getAccountingClosures().subscribe((glAccountClosureData: any) => {
-      this.dataSource = new MatTableDataSource(glAccountClosureData);
-      this.dataSource.paginator = this.paginator;
-      this.dataSource.sort = this.sort;
-    });
+  /**
+   * Initializes the data source, paginator and sorter for closing entries table.
+   */
+  setAccountingClosures() {
+    this.dataSource = new MatTableDataSource(this.glAccountClosureData);
+    this.dataSource.paginator = this.paginator;
+    this.dataSource.sort = this.sort;
   }
 
-  getOffices() {
-    this.accountingService.getOffices().subscribe(officeData => {
-      this.officeData = officeData;
-      this.filteredOfficeData = this.officeName.valueChanges
-      .pipe(
-        startWith(''),
-        map((office: any) => typeof office === 'string' ? office : office.name),
-        map((officeName: string) => officeName ? this.filterOfficeAutocompleteData(this.officeData, officeName) : this.officeData)
-      );
-    });
+  /**
+   * Sets filtered offices for autocomplete.
+   */
+  setFilteredOffices() {
+    this.filteredOfficeData = this.officeName.valueChanges
+    .pipe(
+      startWith(''),
+      map((office: any) => typeof office === 'string' ? office : office.name),
+      map((officeName: string) => officeName ? this.filterOfficeAutocompleteData(officeName) : this.officeData)
+    );
   }
 
-  private filterOfficeAutocompleteData(officeData: any, officeName: string): any {
-    return officeData.filter((office: any) => office.name.toLowerCase().includes(officeName.toLowerCase()));
+  /**
+   * Filters offices.
+   * @param {string} officeName Office name to filter office by.
+   * @returns {any} Filtered offices.
+   */
+  private filterOfficeAutocompleteData(officeName: string): any {
+    return this.officeData.filter((office: any) => office.name.toLowerCase().includes(officeName.toLowerCase()));
   }
 
 }