refactor: clients module (#1207)

See: #1196

src/app/clients/clients-view/family-members-tab/add-family-member/add-family-member.component.html

@@ -98,6 +98,7 @@
       </mat-form-field>
 
     </div>
+    
     <div fxLayout="row" fxLayoutGap="32px" fxLayoutAlign="center">
       <button type="button" mat-raised-button [routerLink]="['../']">Cancel</button>
       <button type="submit" mat-raised-button color="primary" [disabled]="!addFamilyMemberForm.valid">Submit</button>

src/app/clients/clients-view/family-members-tab/add-family-member/add-family-member.component.ts

@@ -1,3 +1,4 @@
+/** Angular Imports */
 import { Component, OnInit } from '@angular/core';
 import { FormGroup, FormBuilder, Validators } from '@angular/forms';
 import { Router, ActivatedRoute } from '@angular/router';
@@ -6,13 +7,16 @@ import { DatePipe } from '@angular/common';
 /** Custom Services */
 import { ClientsService } from '../../../clients.service';
 
-
+/**
+ * Add Family Member Component
+ */
 @Component({
   selector: 'mifosx-add-family-member',
   templateUrl: './add-family-member.component.html',
   styleUrls: ['./add-family-member.component.scss']
 })
 export class AddFamilyMemberComponent implements OnInit {
+
   /** Minimum Due Date allowed. */
   minDate = new Date(2000, 0, 1);
   /** Maximum Due Date allowed. */
@@ -21,12 +25,21 @@ export class AddFamilyMemberComponent implements OnInit {
   addFamilyMemberForm: FormGroup;
   /** Add family member template. */
   addFamilyMemberTemplate: any;
+  /** Client ID */
   clientId: any;
+
+  /**
+   * @param {FormBuilder} formBuilder FormBuilder
+   * @param {DatePipe} datePipe Date Pipe
+   * @param {Router} router Router
+   * @param {Route} route Route
+   * @param {ClientsService} clientsService Clients Service
+   */
   constructor(private formBuilder: FormBuilder,
-    private datePipe: DatePipe,
-    private router: Router,
-    private route: ActivatedRoute,
-    private clientsService: ClientsService) {
+              private datePipe: DatePipe,
+              private router: Router,
+              private route: ActivatedRoute,
+              private clientsService: ClientsService) {
     this.route.data.subscribe((data: { clientTemplate: any }) => {
       this.addFamilyMemberTemplate = data.clientTemplate.familyMemberOptions;
     });
@@ -36,10 +49,11 @@ export class AddFamilyMemberComponent implements OnInit {
 
   ngOnInit() {
     this.createAddFamilyMemberForm();
-
   }
 
-
+  /**
+   * Creates the add family member form
+   */
   createAddFamilyMemberForm() {
     this.addFamilyMemberForm = this.formBuilder.group({
       'firstName': ['', Validators.required],
@@ -56,6 +70,9 @@ export class AddFamilyMemberComponent implements OnInit {
     });
   }
 
+  /**
+   * Submits the form and adds the family member
+   */
   submit() {
     const prevDateOfBirth: Date = this.addFamilyMemberForm.value.dateOfBirth;
     // TODO: Update once language and date settings are setup
@@ -69,7 +86,6 @@ export class AddFamilyMemberComponent implements OnInit {
     this.clientsService.addFamilyMember(this.clientId, familyMemberData).subscribe(res => {
       this.router.navigate(['../'], { relativeTo: this.route });
     });
-
   }
 
 }

src/app/clients/clients-view/family-members-tab/edit-family-member/edit-family-member.component.html

@@ -98,6 +98,7 @@
       </mat-form-field>
 
     </div>
+    
     <div fxLayout="row" fxLayoutGap="32px" fxLayoutAlign="center">
       <button type="button" mat-raised-button [routerLink]="['../../']">Cancel</button>
       <button type="submit" mat-raised-button color="primary" [disabled]="editFamilyMemberForm.pristine||!editFamilyMemberForm.valid">Submit</button>

src/app/clients/clients-view/family-members-tab/edit-family-member/edit-family-member.component.ts

@@ -1,3 +1,4 @@
+/** Angular Imports */
 import { Component, OnInit } from '@angular/core';
 import { FormGroup, FormBuilder, Validators } from '@angular/forms';
 import { Router, ActivatedRoute } from '@angular/router';
@@ -6,12 +7,16 @@ import { DatePipe } from '@angular/common';
 /** Custom Services */
 import { ClientsService } from '../../../clients.service';
 
+/**
+ * Edit Family Member Component
+ */
 @Component({
   selector: 'mifosx-edit-family-member',
   templateUrl: './edit-family-member.component.html',
   styleUrls: ['./edit-family-member.component.scss']
 })
 export class EditFamilyMemberComponent implements OnInit {
+
   /** Minimum Due Date allowed. */
   minDate = new Date(2000, 0, 1);
   /** Maximum Due Date allowed. */
@@ -20,13 +25,21 @@ export class EditFamilyMemberComponent implements OnInit {
   editFamilyMemberForm: FormGroup;
   /** Add family member template. */
   addFamilyMemberTemplate: any;
+  /** Family Members Details */
   familyMemberDetails: any;
 
+  /**
+   * @param {FormBuilder} formBuilder Form Builder
+   * @param {DatePipe} datePipe DatePipe
+   * @param {Router} router Router
+   * @param {ActivatedRoute} route Route
+   * @param {ClientsService} clientsService Clients Service
+   */
   constructor(private formBuilder: FormBuilder,
-    private datePipe: DatePipe,
-    private router: Router,
-    private route: ActivatedRoute,
-    private clientsService: ClientsService) {
+              private datePipe: DatePipe,
+              private router: Router,
+              private route: ActivatedRoute,
+              private clientsService: ClientsService) {
     this.route.data.subscribe((data: { clientTemplate: any, editFamilyMember: any }) => {
       this.addFamilyMemberTemplate = data.clientTemplate.familyMemberOptions;
       this.familyMemberDetails = data.editFamilyMember;
@@ -35,9 +48,12 @@ export class EditFamilyMemberComponent implements OnInit {
 
   ngOnInit() {
     this.createEditFamilyMemberForm(this.familyMemberDetails);
-
   }
 
+  /**
+   * Creates Edit Family Member Form
+   * @param {any} familyMember Family Member
+   */
   createEditFamilyMemberForm(familyMember: any) {
     this.editFamilyMemberForm = this.formBuilder.group({
       'firstName': [familyMember.firstName, Validators.required],
@@ -54,6 +70,9 @@ export class EditFamilyMemberComponent implements OnInit {
     });
   }
 
+  /**
+   * Submits the form and updates the client family member.
+   */
   submit() {
     const prevDateOfBirth: Date = this.editFamilyMemberForm.value.dateOfBirth;
     // TODO: Update once language and date settings are setup
@@ -67,6 +86,6 @@ export class EditFamilyMemberComponent implements OnInit {
     this.clientsService.editFamilyMember(this.familyMemberDetails.clientId, this.familyMemberDetails.id, familyMemberData).subscribe(res => {
       this.router.navigate(['../../'], { relativeTo: this.route });
     });
-
   }
+
 }

src/app/clients/clients-view/family-members-tab/family-members-tab.component.html

@@ -1,13 +1,19 @@
 <div class="tab-container mat-typography">
+
   <router-outlet>
+
     <h3>Family Members</h3>
+
     <div fxLayout="row" fxLayoutAlign="flex-end">
       <button mat-raised-button color="primary" [routerLink]="['./add']">
         <fa-icon icon="plus"></fa-icon>&nbsp;&nbsp;Add
       </button>
     </div>
+
     <mat-accordion>
+
       <mat-expansion-panel *ngFor="let member of clientFamilyMembers;index as i" class="family-member">
+
         <mat-expansion-panel-header>
           <mat-panel-title>
             {{member.firstName+' '+member.middleName+' '+member.lastName}}
@@ -16,7 +22,9 @@
             {{member.relationship}}
           </mat-panel-description>
         </mat-expansion-panel-header>
+
         <mat-divider [inset]="true"></mat-divider>
+
         <div class="family-member-actions" fxLayout="row" fxLayoutAlign="flex-end">
           <button mat-button color="primary">
             <fa-icon icon="edit" [routerLink]="[member.id,'edit']"></fa-icon>
@@ -24,8 +32,8 @@
           <button mat-button color="warn" (click)="deleteFamilyMember(member.clientId,member.id,member.firstName,i)">
             <fa-icon icon="trash"></fa-icon>
           </button>
-
         </div>
+
         <p>
           First Name : {{member.firstName}}<br />
           Middle Name : {{member.middleName}}<br />
@@ -43,5 +51,7 @@
       </mat-expansion-panel>
 
     </mat-accordion>
+
   </router-outlet>
-</div>
+
+</div>

src/app/clients/clients-view/family-members-tab/family-members-tab.component.ts

@@ -1,5 +1,6 @@
-import { Component, OnInit } from '@angular/core';
-import { Router, ActivatedRoute } from '@angular/router';
+/** Angular Imports */
+import { Component } from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
 import { MatDialog } from '@angular/material';
 
 /** Custom Components */
@@ -8,25 +9,32 @@ import { DeleteDialogComponent } from '../../../shared/delete-dialog/delete-dial
 /** Custom Services */
 import { ClientsService } from '../../clients.service';
 
+/**
+ * Client Family Members Tab
+ */
 @Component({
   selector: 'mifosx-family-members-tab',
   templateUrl: './family-members-tab.component.html',
   styleUrls: ['./family-members-tab.component.scss']
 })
-export class FamilyMembersTabComponent implements OnInit {
+export class FamilyMembersTabComponent {
+
+  /** Client Family Members */
   clientFamilyMembers: any;
+
+  /**
+   * @param {ActivatedRoute} route Activated Route
+   * @param {ClientsService} clientsService Clients Service
+   * @param {MatDialog }dialog Mat Dialog
+   */
   constructor(private route: ActivatedRoute,
-    private router: Router,
-    private clientsService: ClientsService,
-    public dialog: MatDialog) {
+              private clientsService: ClientsService,
+              public dialog: MatDialog) {
     this.route.data.subscribe((data: { clientFamilyMembers: any }) => {
       this.clientFamilyMembers = data.clientFamilyMembers;
     });
   }
 
-  ngOnInit() {
-  }
-
   /**
    * Deletes the family member and redirects to family members tab.
    */