refactor: clients module (#1207)

See: #1196

src/app/clients/clients-view/identities-tab/identities-tab.component.html

@@ -1,62 +1,60 @@
 <div class="tab-container mat-typography">
 
-    <!-- Identities Table -->
-
     <h3>Identities</h3>
 
-    <button mat-raised-button class="f-right" color="primary" (click)="addIdentifier()">
-    <fa-icon icon="plus"></fa-icon>&nbsp;&nbsp; Add
-  </button>
+    <button mat-raised-button class="f-right" color="primary" (click)="addIdentifier()" *mifosxHasPermission="'CREATE_CLIENTIDENTIFIER'">
+      <fa-icon icon="plus"></fa-icon>&nbsp;&nbsp; Add
+    </button>
 
     <table mat-table #identifiersTable [dataSource]="clientIdentities">
 
         <ng-container matColumnDef="id">
-            <th mat-header-cell *matHeaderCellDef> Id </th>
-            <td mat-cell *matCellDef="let identity">
-                {{identity.id}} </td>
+          <th mat-header-cell *matHeaderCellDef> Id </th>
+          <td mat-cell *matCellDef="let identity">{{identity.id}}</td>
         </ng-container>
 
         <ng-container matColumnDef="description">
-            <th mat-header-cell *matHeaderCellDef> Description </th>
-            <td mat-cell *matCellDef="let identity"> {{identity.description}} </td>
+          <th mat-header-cell *matHeaderCellDef> Description </th>
+          <td mat-cell *matCellDef="let identity"> {{identity.description}} </td>
         </ng-container>
 
         <ng-container matColumnDef="type">
-            <th mat-header-cell *matHeaderCellDef> type </th>
-            <td mat-cell *matCellDef="let identity"> {{identity.documentType.name}}
-            </td>
+          <th mat-header-cell *matHeaderCellDef> type </th>
+          <td mat-cell *matCellDef="let identity"> {{identity.documentType.name}}</td>
         </ng-container>
 
         <ng-container matColumnDef="documents">
-            <th mat-header-cell *matHeaderCellDef>Identity Documents </th>
-            <td mat-cell *matCellDef="let identity">
-                <div *ngFor="let document of identity.documents">
-                    {{document.name}}
-                    <fa-icon icon="cloud-download-alt" (click)="download(document.parentEntityId,document.id)"></fa-icon>
-                </div>
-            </td>
+          <th mat-header-cell *matHeaderCellDef>Identity Documents </th>
+          <td mat-cell *matCellDef="let identity">
+            <div *ngFor="let document of identity.documents">
+              {{document.name}}
+              <fa-icon icon="cloud-download-alt" (click)="download(document.parentEntityId,document.id)" *mifosxHasPermission="'READ_DOCUMENT'"></fa-icon>
+            </div>
+          </td>
         </ng-container>
 
         <ng-container matColumnDef="status">
-            <th mat-header-cell *matHeaderCellDef> Status </th>
-            <td mat-cell *matCellDef="let identity">
-                {{(identity.status==='clientIdentifierStatusType.active')?'active':'inactive'}} </td>
+          <th mat-header-cell *matHeaderCellDef> Status </th>
+          <td mat-cell *matCellDef="let identity">
+              {{(identity.status==='clientIdentifierStatusType.active')?'active':'inactive'}}
+          </td>
         </ng-container>
 
         <ng-container matColumnDef="actions">
-            <th mat-header-cell *matHeaderCellDef> Actions </th>
-            <td mat-cell *matCellDef="let identity; let i = index">
-                <button class="identity-action-button" mat-raised-button color="primary" (click)="uploadDocument(i,identity.id)">
-          <fa-icon icon="cloud-upload-alt"></fa-icon>
-        </button>
-        <button class="identity-action-button" mat-raised-button color="warn" (click)="deleteIdentifier(identity.clientId,identity.id,i)">
-          <fa-icon icon="times"></fa-icon>
-        </button>
-            </td>
+          <th mat-header-cell *matHeaderCellDef> Actions </th>
+          <td mat-cell *matCellDef="let identity; let i = index">
+            <button class="identity-action-button" mat-raised-button color="primary" (click)="uploadDocument(i,identity.id)" *mifosxHasPermission="'CREATE_DOCUMENT'">
+              <fa-icon icon="cloud-upload-alt"></fa-icon>
+            </button>
+            <button class="identity-action-button" mat-raised-button color="warn" (click)="deleteIdentifier(identity.clientId,identity.id,i)" *mifosxHasPermission="'DELETE_CLIENTIDENTIFIER'">
+              <fa-icon icon="times"></fa-icon>
+            </button>
+          </td>
         </ng-container>
 
         <tr mat-header-row *matHeaderRowDef="identitiesColumns"></tr>
         <tr mat-row *matRowDef="let row; columns: identitiesColumns;"></tr>
+
     </table>
 
 </div>

src/app/clients/clients-view/identities-tab/identities-tab.component.ts

@@ -1,7 +1,10 @@
-import { Component, OnInit, ViewChild } from '@angular/core';
+/** Angular Imports */
+import { Component, ViewChild } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
 import { MatTable } from '@angular/material/table';
 import { MatDialog } from '@angular/material';
+
+/** Custom Models */
 import { FormfieldBase } from 'app/shared/form-dialog/formfield/model/formfield-base';
 import { InputBase } from 'app/shared/form-dialog/formfield/model/input-base';
 import { SelectBase } from 'app/shared/form-dialog/formfield/model/select-base';
@@ -14,22 +17,36 @@ import { FormDialogComponent } from 'app/shared/form-dialog/form-dialog.componen
 /** Custom Services */
 import { ClientsService } from '../../clients.service';
 
+/**
+ * Identities Tab Component
+ */
 @Component({
   selector: 'mifosx-identities-tab',
   templateUrl: './identities-tab.component.html',
   styleUrls: ['./identities-tab.component.scss']
 })
-export class IdentitiesTabComponent implements OnInit {
+export class IdentitiesTabComponent {
 
-  @ViewChild('identifiersTable') identifiersTable: MatTable<Element>;
-  identitiesColumns: string[] = ['id', 'description', 'type', 'documents', 'status', 'actions'];
+  /** Client Identities */
   clientIdentities: any;
+  /** Client Identifier Template */
   clientIdentifierTemplate: any;
+  /** Client Id */
   clientId: string;
+  /** Identities Columns */
+  identitiesColumns: string[] = ['id', 'description', 'type', 'documents', 'status', 'actions'];
 
+  /** Identifiers Table */
+  @ViewChild('identifiersTable') identifiersTable: MatTable<Element>;
+
+  /**
+   * @param {ActivatedRoute} route Activated Route
+   * @param {MatDialog} dialog Mat Dialog
+   * @param {ClientsService} clientService Clients Service
+   */
   constructor(private route: ActivatedRoute,
-    public dialog: MatDialog,
-    private clientService: ClientsService) {
+              public dialog: MatDialog,
+              private clientService: ClientsService) {
     this.clientId = this.route.parent.snapshot.paramMap.get('clientId');
     this.route.data.subscribe((data: { clientIdentities: any, clientIdentifierTemplate: any }) => {
       this.clientIdentities = data.clientIdentities;
@@ -37,8 +54,11 @@ export class IdentitiesTabComponent implements OnInit {
     });
   }
 
-  ngOnInit() { }
-
+  /**
+   * Download Client Document
+   * @param {string} parentEntityId Parent Entity Id
+   * @param {string} documentId Document ID
+   */
   download(parentEntityId: string, documentId: string) {
     this.clientService.downloadClientIdentificationDocument(parentEntityId, documentId).subscribe(res => {
       const url = window.URL.createObjectURL(res);
@@ -46,6 +66,9 @@ export class IdentitiesTabComponent implements OnInit {
     });
   }
 
+  /**
+   * Add Client Identifier
+   */
   addIdentifier() {
     const formfields: FormfieldBase[] = [
       new SelectBase({
@@ -103,6 +126,12 @@ export class IdentitiesTabComponent implements OnInit {
     });
   }
 
+  /**
+   * Delete Client Identifier
+   * @param {string} clientId Client Id
+   * @param {string} identifierId Identifier Id
+   * @param {number} index Index
+   */
   deleteIdentifier(clientId: string, identifierId: string, index: number) {
     const deleteIdentifierDialogRef = this.dialog.open(DeleteDialogComponent, {
       data: { deleteContext: `identifier id:${identifierId}` }
@@ -117,6 +146,11 @@ export class IdentitiesTabComponent implements OnInit {
     });
   }
 
+  /**
+   * Upload Document
+   * @param {number} index Index
+   * @param {string} identifierId Identifier Id
+   */
   uploadDocument(index: number, identifierId: string) {
     const uploadDocumentDialogRef = this.dialog.open(UploadDocumentDialogComponent, {
       data: { documentIdentifier: true }