refactor: clients module (#1207)

See: #1196

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

@@ -1,17 +1,26 @@
 <div class="tab-container mat-typography">
+
   <h3>Notes</h3>
+
   <div>
+    
     <form #formRef="ngForm" [formGroup]="noteForm" fxLayout="row" fxLayoutAlign="start baseline" fxLayoutGap="20px"
       (ngSubmit)="submit()">
+
       <mat-form-field fxFlex="calc(90%-20px)">
         <textarea formControlName="note" matInput placeholder="Write a note ...."></textarea>
       </mat-form-field>
-      <button mat-raised-button fxFlex color="primary" [disabled]="!noteForm.valid">
+
+      <button mat-raised-button fxFlex color="primary" [disabled]="!noteForm.valid" *mifosxHasPermission="'CREATE_CLIENTNOTE'">
         <fa-icon icon="plus"></fa-icon>&nbsp;&nbsp; Add
       </button>
+
     </form>
+
   </div>
+
   <mat-list>
+
     <mat-list-item *ngFor="let clientNote of clientNotes; let i=index;">
       <fa-icon icon="sticky-note" matListIcon></fa-icon>
       <h3 matLine>{{clientNote.note}} </h3>
@@ -20,13 +29,15 @@
         <span>Date: {{clientNote.createdOn | date}}</span>
       </p>
       <div fxLayout="row" fxLayoutAlign="flex-start">
-        <button mat-button color="primary" (click)="editNote(clientNote.id,clientNote.note,i)">
+        <button mat-button color="primary" (click)="editNote(clientNote.id,clientNote.note,i)" *mifosxHasPermission="'CREATE_CLIENTNOTE'">
           <fa-icon icon="edit"></fa-icon>
         </button>
-        <button mat-button color="warn" (click)="deleteNote(clientNote.id,i)">
+        <button mat-button color="warn" (click)="deleteNote(clientNote.id,i)" *mifosxHasPermission="'DELETE_CLIENTNOTE'">
           <fa-icon icon="trash"></fa-icon>
         </button>
       </div>
     </mat-list-item>
+
   </mat-list>
+
 </div>

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

@@ -1,3 +1,4 @@
+/** Angular Imports */
 import { Component, OnInit, ViewChild } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
 import { MatDialog } from '@angular/material';
@@ -10,24 +11,38 @@ import { DeleteDialogComponent } from '../../../shared/delete-dialog/delete-dial
 import { ClientsService } from '../../clients.service';
 import { EditNotesDialogComponent } from '../custom-dialogs/edit-notes-dialog/edit-notes-dialog.component';
 
+/**
+ * Notes Tab Component
+ */
 @Component({
   selector: 'mifosx-notes-tab',
   templateUrl: './notes-tab.component.html',
   styleUrls: ['./notes-tab.component.scss']
 })
 export class NotesTabComponent implements OnInit {
+
+  /** Client ID */
   clientId: string;
+  /** Username */
   username: string;
+  /** Client Notes */
   clientNotes: any;
+  /** Note Form */
   noteForm: FormGroup;
+
+  /** Notes Form Reference */
   @ViewChild('formRef') formRef: any;
 
-
+  /**
+   * @param {ActivatedRoute} route Activated Route
+   * @param {FormBuilder} formBuilder Form Builder
+   * @param {ClientsService} clientsService Clients Service
+   * @param {MatDialog} dialog Mat Dialog
+   */
   constructor(private route: ActivatedRoute,
-    private formBuilder: FormBuilder,
-    private clientsService: ClientsService,
-    public dialog: MatDialog) {
-
+              private formBuilder: FormBuilder,
+              private clientsService: ClientsService,
+              public dialog: MatDialog) {
     this.username = JSON.parse(sessionStorage.getItem('mifosXCredentials')).username;
     this.clientId = this.route.parent.snapshot.params['clientId'];
     this.route.data.subscribe((data: { clientNotes: any }) => {
@@ -39,24 +54,21 @@ export class NotesTabComponent implements OnInit {
     this.createNoteForm();
   }
 
+  /**
+   * Creates the note form
+   */
   createNoteForm() {
     this.noteForm = this.formBuilder.group({
       'note': ['', Validators.required]
     });
   }
 
-  submit() {
-    this.clientsService.createClientNote(this.clientId, this.noteForm.value).subscribe((response: any) => {
-      this.clientNotes.push({
-        id: response.resourceId,
-        createdByUsername: this.username,
-        createdOn: new Date(),
-        note: this.noteForm.value.note
-      });
-      this.formRef.resetForm();
-    });
-  }
-
+  /**
+   * Edits a client note.
+   * @param {string} noteId Note Id
+   * @param {string} noteContent Note Content
+   * @param {number} index Index
+   */
   editNote(noteId: string, noteContent: string, index: number) {
     const editNoteDialogRef = this.dialog.open(EditNotesDialogComponent, {
       data: { noteContent: noteContent }
@@ -70,8 +82,11 @@ export class NotesTabComponent implements OnInit {
     });
   }
 
-
-
+  /**
+   * Deletes a client note.
+   * @param {string} noteId Note Id
+   * @param {number} index Index
+   */
   deleteNote(noteId: string, index: number) {
     const deleteNoteDialogRef = this.dialog.open(DeleteDialogComponent, {
       data: { deleteContext: `Note id:${noteId}` }
@@ -86,4 +101,19 @@ export class NotesTabComponent implements OnInit {
     });
   }
 
+  /**
+   * Creates a client note.
+   */
+  submit() {
+    this.clientsService.createClientNote(this.clientId, this.noteForm.value).subscribe((response: any) => {
+      this.clientNotes.push({
+        id: response.resourceId,
+        createdByUsername: this.username,
+        createdOn: new Date(),
+        note: this.noteForm.value.note
+      });
+      this.formRef.resetForm();
+    });
+  }
+
 }