From d84dbf50ed7b481acf51c6f5e7fffb1a02c0d72e Mon Sep 17 00:00:00 2001 From: Jivjyot Singh Date: Sun, 23 Jun 2019 23:13:51 +0530 Subject: [PATCH] feat: clients identities page - add identities-tab component - add upload-document-dialog component - remove content-type header from authentication interceptor fixes: #261 --- src/app/clients/clients-routing.module.ts | 12 ++- .../clients-view/clients-view.component.html | 10 ++- .../identities-tab.component.html | 62 +++++++++++++++ .../identities-tab.component.scss | 18 +++++ .../identities-tab.component.spec.ts | 25 +++++++ .../identities-tab.component.ts | 75 +++++++++++++++++++ .../upload-document-dialog.component.html | 22 ++++++ .../upload-document-dialog.component.scss | 0 .../upload-document-dialog.component.spec.ts | 25 +++++++ .../upload-document-dialog.component.ts | 41 ++++++++++ src/app/clients/clients.module.ts | 9 ++- src/app/clients/clients.service.ts | 29 +++++++ .../client-identities.resolver.ts | 42 +++++++++++ .../authentication.interceptor.ts | 1 - src/app/shared/icons.module.ts | 12 ++- 15 files changed, 376 insertions(+), 7 deletions(-) create mode 100644 src/app/clients/clients-view/identities-tab/identities-tab.component.html create mode 100644 src/app/clients/clients-view/identities-tab/identities-tab.component.scss create mode 100644 src/app/clients/clients-view/identities-tab/identities-tab.component.spec.ts create mode 100644 src/app/clients/clients-view/identities-tab/identities-tab.component.ts create mode 100644 src/app/clients/clients-view/upload-document-dialog/upload-document-dialog.component.html create mode 100644 src/app/clients/clients-view/upload-document-dialog/upload-document-dialog.component.scss create mode 100644 src/app/clients/clients-view/upload-document-dialog/upload-document-dialog.component.spec.ts create mode 100644 src/app/clients/clients-view/upload-document-dialog/upload-document-dialog.component.ts create mode 100644 src/app/clients/common-resolvers/client-identities.resolver.ts diff --git a/src/app/clients/clients-routing.module.ts b/src/app/clients/clients-routing.module.ts index df705b6c9..815b60e44 100644 --- a/src/app/clients/clients-routing.module.ts +++ b/src/app/clients/clients-routing.module.ts @@ -14,6 +14,7 @@ import { GeneralTabComponent } from './clients-view/general-tab/general-tab.comp import { FamilyMembersTabComponent } from './clients-view/family-members-tab/family-members-tab.component'; import { AddFamilyMemberComponent } from './clients-view/family-members-tab/add-family-member/add-family-member.component'; import { EditFamilyMemberComponent } from './clients-view/family-members-tab/edit-family-member/edit-family-member.component'; +import { IdentitiesTabComponent } from './clients-view/identities-tab/identities-tab.component'; /** Custom Resolvers */ import { ClientsResolver } from './common-resolvers/clients.resolver'; @@ -24,6 +25,7 @@ import { ClientSummaryResolver } from './common-resolvers/client-summary.resolve import { ClientFamilyMembersResolver } from './common-resolvers/client-family-members.resolver'; import { ClientFamilyMemberResolver } from './common-resolvers/client-family-member.resolver'; import { ClientTemplateResolver } from './common-resolvers/client-template.resolver'; +import { ClientIdentitiesResolver } from './common-resolvers/client-identities.resolver'; const routes: Routes = [ Route.withShell([{ @@ -83,6 +85,13 @@ const routes: Routes = [ }] } ] + }, + { + path: 'identities', + component: IdentitiesTabComponent, + resolve: { + clientIdentities: ClientIdentitiesResolver + } } ] } @@ -102,7 +111,8 @@ const routes: Routes = [ ClientSummaryResolver, ClientFamilyMembersResolver, ClientFamilyMemberResolver, - ClientTemplateResolver + ClientTemplateResolver, + ClientIdentitiesResolver ] }) export class ClientsRoutingModule { } diff --git a/src/app/clients/clients-view/clients-view.component.html b/src/app/clients/clients-view/clients-view.component.html index da06c310d..4a62177c2 100644 --- a/src/app/clients/clients-view/clients-view.component.html +++ b/src/app/clients/clients-view/clients-view.component.html @@ -44,12 +44,18 @@ diff --git a/src/app/clients/clients-view/identities-tab/identities-tab.component.html b/src/app/clients/clients-view/identities-tab/identities-tab.component.html new file mode 100644 index 000000000..d72cd46da --- /dev/null +++ b/src/app/clients/clients-view/identities-tab/identities-tab.component.html @@ -0,0 +1,62 @@ +
+ + + +

Identities

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Id + {{identity.id}} Description {{identity.description}} type {{identity.documentType.name}} + Identity Documents +
+ {{document.name}} + +
+ 		Status + {{(identity.status==='clientIdentifierStatusType.active')?'active':'inactive'}} Actions + + +
+ +
\ No newline at end of file diff --git a/src/app/clients/clients-view/identities-tab/identities-tab.component.scss b/src/app/clients/clients-view/identities-tab/identities-tab.component.scss new file mode 100644 index 000000000..ca7565958 --- /dev/null +++ b/src/app/clients/clients-view/identities-tab/identities-tab.component.scss @@ -0,0 +1,18 @@ +.tab-container { + padding: 1%; + margin: 1%; + + h3{ + margin:1% auto; + } + table { + width: 100%; + .identity-action-button{ + min-width: 26px; + padding: 0 6px; + margin: 4px; + line-height: 25px; + } + } + } + \ No newline at end of file diff --git a/src/app/clients/clients-view/identities-tab/identities-tab.component.spec.ts b/src/app/clients/clients-view/identities-tab/identities-tab.component.spec.ts new file mode 100644 index 000000000..2e8f3ce8b --- /dev/null +++ b/src/app/clients/clients-view/identities-tab/identities-tab.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { IdentitiesTabComponent } from './identities-tab.component'; + +describe('IdentitiesTabComponent', () => { + let component: IdentitiesTabComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ IdentitiesTabComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(IdentitiesTabComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/clients/clients-view/identities-tab/identities-tab.component.ts b/src/app/clients/clients-view/identities-tab/identities-tab.component.ts new file mode 100644 index 000000000..53c0424d2 --- /dev/null +++ b/src/app/clients/clients-view/identities-tab/identities-tab.component.ts @@ -0,0 +1,75 @@ +import { Component, OnInit, ViewChild } from '@angular/core'; +import { ActivatedRoute } from '@angular/router'; +import { MatTable } from '@angular/material/table'; +import { MatDialog } from '@angular/material'; + +/** Custom Components */ +import { UploadDocumentDialogComponent } from '../upload-document-dialog/upload-document-dialog.component'; +import { DeleteDialogComponent } from '../../../shared/delete-dialog/delete-dialog.component'; + +/** Custom Services */ +import { ClientsService } from '../../clients.service'; + +@Component({ + selector: 'mifosx-identities-tab', + templateUrl: './identities-tab.component.html', + styleUrls: ['./identities-tab.component.scss'] +}) +export class IdentitiesTabComponent implements OnInit { + @ViewChild('identifiersTable') identifiersTable: MatTable; + identitiesColumns: string[] = ['id', 'description', 'type', 'documents', 'status', 'actions']; + clientIdentities: any; + + constructor(private route: ActivatedRoute, + public dialog: MatDialog, + private clientService: ClientsService) { + this.route.data.subscribe((data: { clientIdentities: any }) => { + this.clientIdentities = data.clientIdentities; + }); + } + + ngOnInit() { + } + + download(parentEntityId: string, documentId: string) { + this.clientService.downloadClientIdentificationDocument(parentEntityId, documentId).subscribe(res => { + const url = window.URL.createObjectURL(res); + window.open(url); + }); + } + + deleteIdentifier(clientId: string, identifierId: string, index: number) { + const deleteFamilyMemberDialogRef = this.dialog.open(DeleteDialogComponent, { + data: { deleteContext: `identifier id:${identifierId}` } + }); + deleteFamilyMemberDialogRef.afterClosed().subscribe((response: any) => { + if (response.delete) { + this.clientService.deleteClientIdentifier(clientId, identifierId).subscribe(res => { + this.clientIdentities.splice(index, 1); + this.identifiersTable.renderRows(); + }); + } + }); + } + + uploadDocument(index: number, identifierId: string) { + const uploadDocumentDialogRef = this.dialog.open(UploadDocumentDialogComponent); + uploadDocumentDialogRef.afterClosed().subscribe((dialogResponse: any) => { + if (dialogResponse) { + const formData: FormData = new FormData; + formData.append('name', dialogResponse.fileName); + formData.append('file', dialogResponse.file); + this.clientService.uploadClientIdentifierDocument(identifierId, formData).subscribe((res: any) => { + this.clientIdentities[index].documents.push({ + id: res.resourceId, + parentEntityType: 'client_identifiers', + parentEntityId: identifierId, + name: dialogResponse.fileName, + fileName: dialogResponse.file.fileName + }); + this.identifiersTable.renderRows(); + }); + } + }); + } +} diff --git a/src/app/clients/clients-view/upload-document-dialog/upload-document-dialog.component.html b/src/app/clients/clients-view/upload-document-dialog/upload-document-dialog.component.html new file mode 100644 index 000000000..ee30e8c05 --- /dev/null +++ b/src/app/clients/clients-view/upload-document-dialog/upload-document-dialog.component.html @@ -0,0 +1,22 @@ +

Upload Client Documents

+
+
+ + + File Name + + + File Name is required + + + + + + + + + + +
+
\ No newline at end of file diff --git a/src/app/clients/clients-view/upload-document-dialog/upload-document-dialog.component.scss b/src/app/clients/clients-view/upload-document-dialog/upload-document-dialog.component.scss new file mode 100644 index 000000000..e69de29bb diff --git a/src/app/clients/clients-view/upload-document-dialog/upload-document-dialog.component.spec.ts b/src/app/clients/clients-view/upload-document-dialog/upload-document-dialog.component.spec.ts new file mode 100644 index 000000000..90c17e7ac --- /dev/null +++ b/src/app/clients/clients-view/upload-document-dialog/upload-document-dialog.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { UploadDocumentDialogComponent } from './upload-document-dialog.component'; + +describe('UploadDocumentDialogComponent', () => { + let component: UploadDocumentDialogComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ UploadDocumentDialogComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(UploadDocumentDialogComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/clients/clients-view/upload-document-dialog/upload-document-dialog.component.ts b/src/app/clients/clients-view/upload-document-dialog/upload-document-dialog.component.ts new file mode 100644 index 000000000..f5fd00ff8 --- /dev/null +++ b/src/app/clients/clients-view/upload-document-dialog/upload-document-dialog.component.ts @@ -0,0 +1,41 @@ +import { Component, OnInit, Inject } from '@angular/core'; +import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material'; +import { FormGroup, FormBuilder, Validators, FormControl } from '@angular/forms'; + +@Component({ + selector: 'mifosx-upload-document-dialog', + templateUrl: './upload-document-dialog.component.html', + styleUrls: ['./upload-document-dialog.component.scss'] +}) +export class UploadDocumentDialogComponent implements OnInit { + /** Upload Document form. */ + uploadDocumentForm: FormGroup; + file: any; + uploadDocumentData: any = []; + + constructor(public dialogRef: MatDialogRef, + private formBuilder: FormBuilder, + @Inject(MAT_DIALOG_DATA) public data: any) { } + + ngOnInit() { + this.createUploadDocumentForm(); + } + + /** + * Creates the upload Document form. + */ + createUploadDocumentForm() { + this.uploadDocumentForm = this.formBuilder.group({ + 'fileName': ['', Validators.required], + 'file': [''] + }); + } + onFileSelect(event: any) { + if (event.target.files.length > 0) { + const file = event.target.files[0]; + this.uploadDocumentForm.get('file').setValue(file); + } + } +} + + diff --git a/src/app/clients/clients.module.ts b/src/app/clients/clients.module.ts index 6db2ee131..7be79ccee 100644 --- a/src/app/clients/clients.module.ts +++ b/src/app/clients/clients.module.ts @@ -14,6 +14,8 @@ import {PipesModule} from '../pipes/pipes.module'; import { FamilyMembersTabComponent } from './clients-view/family-members-tab/family-members-tab.component'; import { AddFamilyMemberComponent } from './clients-view/family-members-tab/add-family-member/add-family-member.component'; import { EditFamilyMemberComponent } from './clients-view/family-members-tab/edit-family-member/edit-family-member.component'; +import { IdentitiesTabComponent } from './clients-view/identities-tab/identities-tab.component'; +import { UploadDocumentDialogComponent } from './clients-view/upload-document-dialog/upload-document-dialog.component'; /** @@ -33,7 +35,12 @@ import { EditFamilyMemberComponent } from './clients-view/family-members-tab/edi GeneralTabComponent, FamilyMembersTabComponent, AddFamilyMemberComponent, - EditFamilyMemberComponent + EditFamilyMemberComponent, + IdentitiesTabComponent, + UploadDocumentDialogComponent + ], + entryComponents: [ + UploadDocumentDialogComponent ], providers: [DatePipe] diff --git a/src/app/clients/clients.service.ts b/src/app/clients/clients.service.ts index 636ac7e2b..44b9b80eb 100644 --- a/src/app/clients/clients.service.ts +++ b/src/app/clients/clients.service.ts @@ -27,35 +27,64 @@ export class ClientsService { getClientData(clientId: string) { return this.http.get(`/clients/${clientId}`); } + getClientAccountData(clientId: string) { return this.http.get(`/clients/${clientId}/accounts`); } + getClientChargesData(clientId: string) { const httpParams = new HttpParams().set('pendingPayment', 'true'); return this.http.get(`/clients/${clientId}/charges`, { params: httpParams }); } + getClientSummary(clientId: string) { const httpParams = new HttpParams().set('R_clientId', clientId) .set('genericResultSet', 'false'); return this.http.get(`/runreports/ClientSummary`, { params: httpParams }); } + getClientProfileImage(clientId: string) { const httpParams = new HttpParams().set('maxHeight', '150'); return this.http.get(`/clients/${clientId}/images`, { params: httpParams, responseType: 'text' }); } + getClientFamilyMembers(clientId: string) { return this.http.get(`/clients/${clientId}/familymembers`); } + getClientFamilyMember(clientId: string, familyMemberId: string) { return this.http.get(`/clients/${clientId}/familymembers/${familyMemberId}`); } + addFamilyMember(clientId: string, familyMemberData: any) { return this.http.post(`/clients/${clientId}/familymembers`, familyMemberData); } + editFamilyMember(clientId: string, familyMemberId: any, familyMemberData: any) { return this.http.put(`/clients/${clientId}/familymembers/${familyMemberId}`, familyMemberData); } + deleteFamilyMember(clientId: string, familyMemberId: string) { return this.http.delete(`/clients/${clientId}/familymembers/${familyMemberId}`); } + + getClientIdentifiers(clientId: string) { + return this.http.get(`/clients/${clientId}/identifiers`); + } + + deleteClientIdentifier(clientId: string, identifierId: string) { + return this.http.delete(`/clients/${clientId}/identifiers/${identifierId}`); + } + + getClientIdentificationDocuments(documentId: string) { + return this.http.get(`/client_identifiers/${documentId}/documents`); + } + + downloadClientIdentificationDocument(parentEntityId: string, documentId: string) { + return this.http.get(`/client_identifiers/${parentEntityId}/documents/${documentId}/attachment`, { responseType: 'blob' }); + } + + uploadClientIdentifierDocument(identifierId: string, documentData: any) { + return this.http.post(`/client_identifiers/${identifierId}/documents`, documentData); + } } diff --git a/src/app/clients/common-resolvers/client-identities.resolver.ts b/src/app/clients/common-resolvers/client-identities.resolver.ts new file mode 100644 index 000000000..f83322f5c --- /dev/null +++ b/src/app/clients/common-resolvers/client-identities.resolver.ts @@ -0,0 +1,42 @@ +/** Angular Imports */ +import { Injectable } from '@angular/core'; +import { Resolve, ActivatedRouteSnapshot } from '@angular/router'; + +/** rxjs Imports */ +import { Observable, forkJoin, from } from 'rxjs'; +import { map } from 'rxjs/operators'; + +/** Custom Services */ +import { ClientsService } from '../clients.service'; + +/** + * Client Identities resolver. + */ +@Injectable() +export class ClientIdentitiesResolver implements Resolve { + /** + * @param {ClientsService} ClientsService Clients service. + */ + constructor(private clientsService: ClientsService) { } + /** + * Returns the Client Identities data. + * @returns {Observable} + */ + resolve(route: ActivatedRouteSnapshot): Observable { + const clientId = route.parent.paramMap.get('clientId'); + let identitiesData: any; + return this.clientsService.getClientIdentifiers(clientId).pipe(map((identities: any) => { + identitiesData = identities; + const docObservable: Observable[] = []; + identities.forEach((identity: any) => { + docObservable.push(this.clientsService.getClientIdentificationDocuments(identity.id)); + }); + forkJoin(docObservable).subscribe(documents => { + documents.forEach((document, index) => { + identitiesData[index].documents = document; + }); + }); + return identitiesData; + })); + } +} diff --git a/src/app/core/authentication/authentication.interceptor.ts b/src/app/core/authentication/authentication.interceptor.ts index 11953f898..b5a060209 100644 --- a/src/app/core/authentication/authentication.interceptor.ts +++ b/src/app/core/authentication/authentication.interceptor.ts @@ -11,7 +11,6 @@ import { environment } from '../../../environments/environment'; /** Http request options headers. */ const httpOptions = { headers: { - 'Content-Type': 'application/json; charset=utf-8', 'Fineract-Platform-TenantId': environment.fineractPlatformTenantId } }; diff --git a/src/app/shared/icons.module.ts b/src/app/shared/icons.module.ts index 151dcda82..6a6e26656 100644 --- a/src/app/shared/icons.module.ts +++ b/src/app/shared/icons.module.ts @@ -65,7 +65,11 @@ import { faUniversity, faUserCircle, faUsers, - faUserShield + faUserShield, + faDownload, + faCloudDownloadAlt, + faCloudUploadAlt, + faTimes } from '@fortawesome/free-solid-svg-icons'; /** Add icons to the library for convenient access in other components. */ @@ -130,7 +134,11 @@ library.add( faUniversity, faUserCircle, faUsers, - faUserShield + faUserShield, + faDownload, + faCloudDownloadAlt, + faCloudUploadAlt, + faTimes ); /**