From c5360f416213579e62ac3bb77b2c6b0a75beda53 Mon Sep 17 00:00:00 2001 From: Anwesh Nayak Date: Thu, 19 Jul 2018 19:56:12 +0530 Subject: [PATCH] feat(client): Client documents and identifiers (#134) * feat(client): Client documents and identifiers --- src/app/clients/clients-routing.module.ts | 14 +- src/app/clients/clients.module.ts | 6 +- src/app/clients/clients.service.ts | 376 ++++++++++++------ .../create-identity.component.html | 53 +++ .../create-identity.component.scss | 17 + .../create-identity.component.spec.ts | 28 ++ .../create-identity.component.ts | 76 ++++ .../upload-document.component.html | 43 ++ .../upload-document.component.scss | 17 + .../upload-document.component.spec.ts | 28 ++ .../upload-document.component.ts | 62 +++ .../view-client/view-client.component.html | 94 ++++- .../view-client/view-client.component.scss | 55 +++ .../view-client/view-client.component.ts | 65 ++- src/main.scss | 7 +- 15 files changed, 803 insertions(+), 138 deletions(-) create mode 100644 src/app/clients/create-identity/create-identity.component.html create mode 100644 src/app/clients/create-identity/create-identity.component.scss create mode 100644 src/app/clients/create-identity/create-identity.component.spec.ts create mode 100644 src/app/clients/create-identity/create-identity.component.ts create mode 100644 src/app/clients/upload-document/upload-document.component.html create mode 100644 src/app/clients/upload-document/upload-document.component.scss create mode 100644 src/app/clients/upload-document/upload-document.component.spec.ts create mode 100644 src/app/clients/upload-document/upload-document.component.ts diff --git a/src/app/clients/clients-routing.module.ts b/src/app/clients/clients-routing.module.ts index 862228c0e..0126969a5 100644 --- a/src/app/clients/clients-routing.module.ts +++ b/src/app/clients/clients-routing.module.ts @@ -7,6 +7,8 @@ import { CreateClientComponent} from './create-client/create-client.component'; import { ViewClientComponent } from './view-client/view-client.component'; import { ViewLoanComponent } from './view-loan/view-loan.component'; import { CreateAddressComponent } from './create-address/create-address.component'; +import { CreateIdentityComponent } from './create-identity/create-identity.component'; +import { UploadDocumentComponent } from './upload-document/upload-document.component'; const routes: Routes = [ Route.withShell([ @@ -34,7 +36,17 @@ const routes: Routes = [ path: 'clients/address/:id', component: CreateAddressComponent, data: { title: extract('Create Address') } - } + }, + { + path: 'clients/addclientidentifier/:id', + component: CreateIdentityComponent, + data: { title: extract('Create Identity') } + }, + { + path: 'clients/addclientdocument/:id', + component: UploadDocumentComponent, + data: { title: extract('Create Identity') } + }, ]) ]; diff --git a/src/app/clients/clients.module.ts b/src/app/clients/clients.module.ts index 37ecacbb0..be1ec0dea 100644 --- a/src/app/clients/clients.module.ts +++ b/src/app/clients/clients.module.ts @@ -15,8 +15,10 @@ import { CreateClientComponent} from './create-client/create-client.component'; import { ViewClientComponent } from './view-client/view-client.component'; import { ViewLoanComponent } from './view-loan/view-loan.component'; import { CreateAddressComponent } from './create-address/create-address.component'; +import { CreateIdentityComponent } from './create-identity/create-identity.component'; import { ClientsService } from './clients.service'; +import { UploadDocumentComponent } from './upload-document/upload-document.component'; @NgModule({ imports: [ @@ -36,7 +38,9 @@ import { ClientsService } from './clients.service'; CreateClientComponent, ViewClientComponent, ViewLoanComponent, - CreateAddressComponent + CreateAddressComponent, + CreateIdentityComponent, + UploadDocumentComponent ], providers: [ ClientsService, diff --git a/src/app/clients/clients.service.ts b/src/app/clients/clients.service.ts index 137233259..dba31ca41 100644 --- a/src/app/clients/clients.service.ts +++ b/src/app/clients/clients.service.ts @@ -8,178 +8,298 @@ import { map } from 'rxjs/operators'; @Injectable() export class ClientsService { - constructor(private http: Http) {} // tslint:disable-line + constructor(private http: Http) {} // tslint:disable-line - createAuthorizationHeader(headers: Headers) { // tslint:disable-line - const username = 'mifos'; - const password = 'password'; - headers.append('Authorization', 'Basic ' + btoa(username + ':' + password)); - headers.append('Content-Type', 'application/json'); - headers.append('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS'); - headers.append('Access-Control-Allow-Origin', '*'); - } + createAuthorizationHeader(headers: Headers) { // tslint:disable-line + const username = 'mifos'; + const password = 'password'; + headers.append('Authorization', 'Basic ' + btoa(username + ':' + password)); + headers.append('Content-Type', 'application/json'); + headers.append('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS'); + headers.append('Access-Control-Allow-Origin', '*'); + } - getClients() { - const headers = new Headers(); // tslint:disable-line + getClients() { + const headers = new Headers(); // tslint:disable-line this.createAuthorizationHeader(headers); - return this.http.get - ('https://demo.openmf.org/fineract-provider/api/v1/clients?tenantIdentifier=default&pretty=true', - {headers: headers}) - .pipe( - map( - (response: Response) => { // tslint:disable-line - response = response.json(); - return response['pageItems']; + return this.http.get( + 'https://demo.openmf.org/fineract-provider/api/v1/clients?tenantIdentifier=default&pretty=true', { + headers: headers + }) + .pipe( + map( + (response: Response) => { // tslint:disable-line + response = response.json(); + return response['pageItems']; - } - ) - ); -} + } + ) + ); + } getClientId(clientId: number) { - const headers = new Headers(); // tslint:disable-line + const headers = new Headers(); // tslint:disable-line this.createAuthorizationHeader(headers); - return this.http.get - ('https://demo.openmf.org/fineract-provider/api/v1/clients/' + clientId - + '?tenantIdentifier=default&pretty=true', - {headers: headers}) - .pipe( - map( - (response: Response) => { // tslint:disable-line - response = response.json(); - return response; + return this.http.get('https://demo.openmf.org/fineract-provider/api/v1/clients/' + clientId + + '?tenantIdentifier=default&pretty=true', { + headers: headers + }) + .pipe( + map( + (response: Response) => { // tslint:disable-line + response = response.json(); + return response; - } - ) - ); + } + ) + ); } getClientAccounts(clientId: number) { - const headers = new Headers(); // tslint:disable-line + const headers = new Headers(); // tslint:disable-line this.createAuthorizationHeader(headers); - return this.http.get - ('https://demo.openmf.org/fineract-provider/api/v1/clients/' + clientId - + '/accounts' + '?tenantIdentifier=default&pretty=true', - {headers: headers}) - .pipe( - map( - (response: Response) => { // tslint:disable-line - response = response.json(); - return response; + return this.http.get('https://demo.openmf.org/fineract-provider/api/v1/clients/' + clientId + + '/accounts' + '?tenantIdentifier=default&pretty=true', { + headers: headers + }) + .pipe( + map( + (response: Response) => { // tslint:disable-line + response = response.json(); + return response; - } - ) - ); + } + ) + ); } getClientCharges(clientId: number) { - const headers = new Headers(); // tslint:disable-line + const headers = new Headers(); // tslint:disable-line this.createAuthorizationHeader(headers); - return this.http.get - ('https://demo.openmf.org/fineract-provider/api/v1/clients/' + clientId - + '/charges' + '?tenantIdentifier=default&pretty=true', - {headers: headers}) - .pipe( - map( - (response: Response) => { // tslint:disable-line - response = response.json(); - return response; + return this.http.get('https://demo.openmf.org/fineract-provider/api/v1/clients/' + clientId + + '/charges' + '?tenantIdentifier=default&pretty=true', { + headers: headers + }) + .pipe( + map( + (response: Response) => { // tslint:disable-line + response = response.json(); + return response; - } - ) - ); + } + ) + ); } - getClientAddress (clientId: number) { - const headers = new Headers(); // tslint:disable-line + getClientAddress(clientId: number) { + const headers = new Headers(); // tslint:disable-line this.createAuthorizationHeader(headers); - return this.http.get - ('https://demo.openmf.org/fineract-provider/api/v1/client/' + clientId - + '/addresses' + '?tenantIdentifier=default&pretty=true', - {headers: headers}) - .pipe( - map( - (response: Response) => { // tslint:disable-line - response = response.json(); - return response; + return this.http.get('https://demo.openmf.org/fineract-provider/api/v1/client/' + clientId + + '/addresses' + '?tenantIdentifier=default&pretty=true', { + headers: headers + }) + .pipe( + map( + (response: Response) => { // tslint:disable-line + response = response.json(); + return response; - } - ) - ); + } + ) + ); } - getClientNote (clientId: number) { - const headers = new Headers(); // tslint:disable-line + getClientNote(clientId: number) { + const headers = new Headers(); // tslint:disable-line this.createAuthorizationHeader(headers); - return this.http.get - ('https://demo.openmf.org/fineract-provider/api/v1/clients/' + clientId - + '/notes' + '?tenantIdentifier=default&pretty=true', - {headers: headers}) - .pipe( - map( - (response: Response) => { // tslint:disable-line - response = response.json(); - return response; + return this.http.get('https://demo.openmf.org/fineract-provider/api/v1/clients/' + clientId + + '/notes' + '?tenantIdentifier=default&pretty=true', { + headers: headers + }) + .pipe( + map( + (response: Response) => { // tslint:disable-line + response = response.json(); + return response; - } - ) - ); + } + ) + ); } - postClientNote (clientId: number, notes: any) { - const headers = new Headers(); // tslint:disable-line + postClientNote(clientId: number, notes: any) { + const headers = new Headers(); // tslint:disable-line this.createAuthorizationHeader(headers); const body = JSON.stringify(notes); - return this.http.post - ('https://demo.openmf.org/fineract-provider/api/v1/clients/' + clientId - + '/notes' + '?tenantIdentifier=default&pretty=true', notes , - {headers: headers}) - .pipe( - map( - (response: Response) => { // tslint:disable-line + return this.http.post('https://demo.openmf.org/fineract-provider/api/v1/clients/' + clientId + + '/notes' + '?tenantIdentifier=default&pretty=true', notes, { + headers: headers + }) + .pipe( + map( + (response: Response) => { // tslint:disable-line response.json(); } - ) - ); + ) + ); } getClientAddressTemplate() { - const headers = new Headers(); // tslint:disable-line + const headers = new Headers(); // tslint:disable-line this.createAuthorizationHeader(headers); - return this.http.get - ('https://demo.openmf.org/fineract-provider/api/v1/client/' - + 'addresses/template?tenantIdentifier=default', - {headers: headers}) - .pipe( - map( - (response: Response) => { // tslint:disable-line - response = response.json(); - return response; + return this.http.get('https://demo.openmf.org/fineract-provider/api/v1/client/' + + 'addresses/template?tenantIdentifier=default', { + headers: headers + }) + .pipe( + map( + (response: Response) => { // tslint:disable-line + response = response.json(); + return response; - } - ) - ); + } + ) + ); } - postClientAddress (clientId: number, body: any, type: any) { - const headers = new Headers(); // tslint:disable-line + postClientAddress(clientId: number, body: any, type: any) { + const headers = new Headers(); // tslint:disable-line const params = new URLSearchParams(); // tslint:disable-line params.set('type', type); this.createAuthorizationHeader(headers); body = JSON.stringify(body); - const options = new RequestOptions({ // tslint:disable-line - headers: headers, - params: params, + const options = new RequestOptions({ // tslint:disable-line + headers: headers, + params: params, }); - return this.http.post - ('https://demo.openmf.org/fineract-provider/api/v1/client/' + clientId - + '/addresses?' + '&tenantIdentifier=default&pretty=true', body , - options) - .pipe( - map( - (response: Response) => { // tslint:disable-line + return this.http.post('https://demo.openmf.org/fineract-provider/api/v1/client/' + clientId + + '/addresses?' + '&tenantIdentifier=default&pretty=true', body, + options) + .pipe( + map( + (response: Response) => { // tslint:disable-line response.json(); } - ) - ); + ) + ); + } + + getClientIdentifierTemplate(clientId: number) { + const headers = new Headers(); // tslint:disable-line + this.createAuthorizationHeader(headers); + return this.http.get('https://demo.openmf.org/fineract-provider/api/v1/clients/' + clientId + + '/identifiers/template?tenantIdentifier=default', { + headers: headers + }) + .pipe( + map( + (response: Response) => { // tslint:disable-line + response = response.json(); + return response['allowedDocumentTypes']; + + } + ) + ); + } + + getClientIdentifiers(clientId: number) { + const headers = new Headers(); // tslint:disable-line + this.createAuthorizationHeader(headers); + return this.http.get('https://demo.openmf.org/fineract-provider/api/v1/clients/' + clientId + + '/identifiers/?tenantIdentifier=default', { + headers: headers + }) + .pipe( + map( + (response: Response) => { // tslint:disable-line + response = response.json(); + return response; + + } + ) + ); + } + + postClientIdentifier(clientId: number, body: any) { + const headers = new Headers(); // tslint:disable-line + this.createAuthorizationHeader(headers); + return this.http.post('https://demo.openmf.org/fineract-provider/api/v1/clients/' + clientId + + '/identifiers/?tenantIdentifier=default', body, { + headers: headers + }) + .pipe( + map( + (response: Response) => { // tslint:disable-line + response.json(); + } + ) + ); + } + + deleteClientIdentifier(clientId: number, identifierId: number) { + const headers = new Headers(); // tslint:disable-line + this.createAuthorizationHeader(headers); + return this.http.delete('https://demo.openmf.org/fineract-provider/api/v1/clients/' + clientId + + '/identifiers/' + identifierId + '/?tenantIdentifier=default', { + headers: headers + }) + .pipe( + map( + (response: Response) => { // tslint:disable-line + response.json(); + } + ) + ); + } + postClientDocument(clientId: number, body: any) { + const headers = new Headers(); // tslint:disable-line + this.createAuthorizationHeader(headers); + headers.append('Content-Type', null); + headers.append('Accept', 'multipart/form-data'); + body = JSON.stringify(body); + + return this.http.post('https://demo.openmf.org/fineract-provider/api/v1/clients/' + clientId + + '/documents/?tenantIdentifier=default', body, { + headers: headers + }) + .pipe( + map( + (response: Response) => { // tslint:disable-line + response.json(); + } + ) + ); + } + + getClientDocuments(clientId: number) { + const headers = new Headers(); // tslint:disable-line + this.createAuthorizationHeader(headers); + return this.http.get('https://demo.openmf.org/fineract-provider/api/v1/clients/' + clientId + + '/documents/?tenantIdentifier=default', { + headers: headers + }) + .pipe( + map( + (response: Response) => { // tslint:disable-line + return response.json(); + } + ) + ); + } + + deleteClientDocuments(clientId: number, documentId: number) { + const headers = new Headers(); // tslint:disable-line + this.createAuthorizationHeader(headers); + return this.http.delete('https://demo.openmf.org/fineract-provider/api/v1/clients/' + clientId + + '/documents/' + documentId + '/?tenantIdentifier=default', { + headers: headers + }) + .pipe( + map( + (response: Response) => { // tslint:disable-line + response.json(); + } + ) + ); } } + diff --git a/src/app/clients/create-identity/create-identity.component.html b/src/app/clients/create-identity/create-identity.component.html new file mode 100644 index 000000000..976a6df11 --- /dev/null +++ b/src/app/clients/create-identity/create-identity.component.html @@ -0,0 +1,53 @@ +
+ + + + + +
+ + + + +
+ + +
+ + {{item?.name}} +
+ + + + +
+ + {{item?.label}} +
+ + + + + + + + + + + + + +
+ + + + + +
+ + + + +
+ \ No newline at end of file diff --git a/src/app/clients/create-identity/create-identity.component.scss b/src/app/clients/create-identity/create-identity.component.scss new file mode 100644 index 000000000..4ad60da3c --- /dev/null +++ b/src/app/clients/create-identity/create-identity.component.scss @@ -0,0 +1,17 @@ + + + .example-form { + min-width: 150px; + max-width: 500px; + width: 100%; + } + + .example-full-width { + width: 100%; + padding:5px 3px; + } + + .mat-raised-button{ + margin-left:10px; + margin-top:10px; + } \ No newline at end of file diff --git a/src/app/clients/create-identity/create-identity.component.spec.ts b/src/app/clients/create-identity/create-identity.component.spec.ts new file mode 100644 index 000000000..3dd7ca09e --- /dev/null +++ b/src/app/clients/create-identity/create-identity.component.spec.ts @@ -0,0 +1,28 @@ +/* tslint:disable:no-unused-variable */ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; +import { By } from '@angular/platform-browser'; +import { DebugElement } from '@angular/core'; + +import { CreateIdentityComponent } from './create-identity.component'; + +describe('CreateIdentityComponent', () => { + let component: CreateIdentityComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ CreateIdentityComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(CreateIdentityComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/clients/create-identity/create-identity.component.ts b/src/app/clients/create-identity/create-identity.component.ts new file mode 100644 index 000000000..9ddc86230 --- /dev/null +++ b/src/app/clients/create-identity/create-identity.component.ts @@ -0,0 +1,76 @@ +import { Component, OnInit, ViewEncapsulation, ViewChild } from '@angular/core'; +import { ActivatedRoute, Params } from '@angular/router'; +import { Subscription } from 'rxjs'; +import { NgForm } from '@angular/forms'; +import { Router } from '@angular/router'; + +import { ClientsService } from 'app/clients/clients.service'; +@Component({ + selector: 'mifosx-app-create-identity', + templateUrl: './create-identity.component.html', + styleUrls: ['./create-identity.component.scss'] +}) +export class CreateIdentityComponent implements OnInit { + id: number = undefined; + paramsSubscription: Subscription; + clientIdentifierDocument: any = undefined; + document: any = undefined; + status: any = undefined; + value: any = undefined; + mymodel: any = undefined; + addressTypeId: any = undefined; + addressStateId: any = undefined; + addressCountryId: any = undefined; + + identifier: any = undefined; + statusTypes = [{ + id: 1, + label: 'Active' + }, { + id: 2, + label: 'Inactive', +}]; + constructor(private route: ActivatedRoute, private clientService: ClientsService) {} + + @ViewChild('f') identifierForm: NgForm; + + + ngOnInit() { + this.paramsSubscription = this.route.params + .subscribe( + (params: Params) => { + this.id = params['id']; + } + ); + console.log(this.id); + this.getClientIdentifierTemplate(this.id); + } + + getClientIdentifierTemplate(id: any) { + this.clientService.getClientIdentifierTemplate(id) + .subscribe( + (res => { + this.clientIdentifierDocument = res; + console.log(res); + }) + ); + } + + onSubmit() { + this.identifier = {}; + this.identifier.description = this.identifierForm.value.description; + this.identifier.documentKey = this.identifierForm.value.uniqueid; + this.identifier.documentTypeId = this.document; + this.identifier.status = this.status; + + + this.clientService.postClientIdentifier(this.id, this.identifier) + .subscribe( + (res => { + return true; + }) + ); + this.identifierForm.reset(); + } + +} diff --git a/src/app/clients/upload-document/upload-document.component.html b/src/app/clients/upload-document/upload-document.component.html new file mode 100644 index 000000000..2cd710a70 --- /dev/null +++ b/src/app/clients/upload-document/upload-document.component.html @@ -0,0 +1,43 @@ +
+ + + + + +
+ + + + +
+ + + + + + + + +
+ + + {{ inputFile.value }} +
+ + + + +
+ + + + + +
+ + + + +
+ diff --git a/src/app/clients/upload-document/upload-document.component.scss b/src/app/clients/upload-document/upload-document.component.scss new file mode 100644 index 000000000..4ad60da3c --- /dev/null +++ b/src/app/clients/upload-document/upload-document.component.scss @@ -0,0 +1,17 @@ + + + .example-form { + min-width: 150px; + max-width: 500px; + width: 100%; + } + + .example-full-width { + width: 100%; + padding:5px 3px; + } + + .mat-raised-button{ + margin-left:10px; + margin-top:10px; + } \ No newline at end of file diff --git a/src/app/clients/upload-document/upload-document.component.spec.ts b/src/app/clients/upload-document/upload-document.component.spec.ts new file mode 100644 index 000000000..c6c107792 --- /dev/null +++ b/src/app/clients/upload-document/upload-document.component.spec.ts @@ -0,0 +1,28 @@ +/* tslint:disable:no-unused-variable */ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; +import { By } from '@angular/platform-browser'; +import { DebugElement } from '@angular/core'; + +import { UploadDocumentComponent } from './upload-document.component'; + +describe('UploadDocumentComponent', () => { + let component: UploadDocumentComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ UploadDocumentComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(UploadDocumentComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/clients/upload-document/upload-document.component.ts b/src/app/clients/upload-document/upload-document.component.ts new file mode 100644 index 000000000..a3d263864 --- /dev/null +++ b/src/app/clients/upload-document/upload-document.component.ts @@ -0,0 +1,62 @@ +import { Component, OnInit, ViewEncapsulation, ViewChild } from '@angular/core'; +import { ActivatedRoute, Params } from '@angular/router'; +import { Subscription } from 'rxjs'; +import { NgForm } from '@angular/forms'; +import { Router } from '@angular/router'; + +import { ClientsService } from 'app/clients/clients.service'; + +@Component({ + selector: 'mifosx-app-upload-document', + templateUrl: './upload-document.component.html', + styleUrls: ['./upload-document.component.scss'] +}) +export class UploadDocumentComponent implements OnInit { + + id: number = undefined; + paramsSubscription: Subscription; + + document: any = undefined; + + + filename: any = undefined; + constructor(private route: ActivatedRoute, private clientService: ClientsService) {} + + @ViewChild('f') documentForm: NgForm; + + + ngOnInit() { + this.paramsSubscription = this.route.params + .subscribe( + (params: Params) => { + this.id = params['id']; + } + ); + console.log(this.id); + // this.getClientIdentifierTemplate(this.id); + } + + + + onFileSelected($event: any) { + this.filename = $event.target.files[0].name; + console.log(this.filename); + } + + onSubmit() { + this.document = {}; + this.document.description = this.documentForm.value.description; + this.document.name = this.documentForm.value.name; + this.document.filename = this.filename; + console.log(this.filename); + + this.clientService.postClientDocument(this.id, this.document) + .subscribe( + (res => { + return true; + }) + ); + this.documentForm.reset(); + } +} + diff --git a/src/app/clients/view-client/view-client.component.html b/src/app/clients/view-client/view-client.component.html index 155caad38..f46814ea0 100644 --- a/src/app/clients/view-client/view-client.component.html +++ b/src/app/clients/view-client/view-client.component.html @@ -294,8 +294,98 @@ - Content 2 - Content 3 + + + +
+ +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
ID {{row.id}} Description {{row.description}} Type {{row.documentType.name}} Status {{row.status}} Actions + +
+
+ + + +
+ +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Name {{row.name}} Description {{row.description}} Type {{row.fileName}} Actions + +
+
+ diff --git a/src/app/clients/view-client/view-client.component.scss b/src/app/clients/view-client/view-client.component.scss index eab0d4f38..e319f0297 100644 --- a/src/app/clients/view-client/view-client.component.scss +++ b/src/app/clients/view-client/view-client.component.scss @@ -63,6 +63,7 @@ th { background-color: #fafafa; } +// css horizontal table with responsiveness .custom-table { table { width: 100%; @@ -125,3 +126,57 @@ th { } } } + +// css vertical table with responsiveness +.document-table { + table { + border: 1px solid #ccc; + width: 100%; + margin: 0; + padding: 0; + border-collapse: collapse; + border-spacing: 0; + } + table tr { + border: 1px solid #ddd; + padding: 5px; + } + table th, + table td { + padding: 10px; + text-align: center; + } + table th { + text-transform: uppercase; + font-size: 14px; + letter-spacing: 1px; + } + @media screen and (max-width: 600px) { + table { + border: 0; + } + table thead { + display: none; + } + table tr { + margin-bottom: 10px; + display: block; + border-bottom: 2px solid #ddd; + } + table td { + display: block; + text-align: right; + font-size: 13px; + border-bottom: 1px dotted #ccc; + } + table td:last-child { + border-bottom: 0; + } + table td:before { + content: attr(data-label); + float: left; + text-transform: uppercase; + font-weight: bold; + } + } +} diff --git a/src/app/clients/view-client/view-client.component.ts b/src/app/clients/view-client/view-client.component.ts index 8206d1e98..0e62cf5b0 100644 --- a/src/app/clients/view-client/view-client.component.ts +++ b/src/app/clients/view-client/view-client.component.ts @@ -24,16 +24,22 @@ export class ViewClientComponent implements OnInit, OnDestroy { post: any = []; clientAddress: any = undefined; allNotes: any = undefined; + clientIdentifiers: any = undefined; + clientDocuments: any = undefined; private LOAN_DATA: any = undefined; private SAVINGS_DATA: any = undefined; private SHARES_DATA: any = undefined; displayedLoanColumns = ['account', 'loanAccount', 'originalLoan', 'loanBalance', 'amountPaid', 'type']; displayedSavingsColumns = ['account', 'savingsAccount', 'lastActive', 'balance']; displayedSharesColumns = ['account', 'shareAccount', 'approvedShares', 'pending']; + displayedIdentifierColumns = ['id', 'description', 'type', 'status', 'actions']; + displayedDocumentColumns = ['name', 'description', 'filename', 'actions']; dataSourceLoan = new MatTableDataSource([]); dataSourceSavings = new MatTableDataSource([]); dataSourceShares = new MatTableDataSource([]); + dataSourceIdentifiers = new MatTableDataSource([]); + dataSourceDocuments = new MatTableDataSource([]); @ViewChild('f') noteForm: NgForm; @ViewChild(MatPaginator) paginator: MatPaginator; @@ -54,6 +60,9 @@ export class ViewClientComponent implements OnInit, OnDestroy { this.getClientCharges(this.id); this.getClientAddress(this.id); this.getClientNotes(this.id); + this.getClientIdentifier(this.id); + this.getClientDocuments(this.id); + // this.deleteClientDocuments(this.id, this.docId); } getClientId(id: any) { @@ -112,7 +121,6 @@ export class ViewClientComponent implements OnInit, OnDestroy { .subscribe( (res => { this.clientAddress = res; - console.log(res); }) ); } @@ -122,18 +130,46 @@ export class ViewClientComponent implements OnInit, OnDestroy { .subscribe( (res => { this.allNotes = res; - console.log(res); }) ); } + getClientIdentifier(id: any) { + this.clientService.getClientIdentifiers(id) + .subscribe( + (res => { + this.clientIdentifiers = res; + this.clientIdentifiers.forEach(function (item: any) { + item.status = item.status.split('.')[1]; + console.log(item.status); + }); + // this.clientIdentifiers.status = this.clientIdentifiers.status.split('.')[1]; + this.dataSourceIdentifiers = new MatTableDataSource(this.clientIdentifiers); + this.dataSourceIdentifiers.paginator = this.paginator; + this.dataSourceIdentifiers.sort = this.sort; + }) + ); + } + + getClientDocuments(id: any) { + this.clientService.getClientDocuments(id) + .subscribe( + (res => { + this.clientDocuments = res; + this.dataSourceDocuments = new MatTableDataSource(res); + this.dataSourceDocuments.paginator = this.paginator; + this.dataSourceDocuments.sort = this.sort; + }) + ); + + } onSubmit() { // this.submitted = true; this.notes = {}; - // const d = new Date(); + // const d = new Date(); this.notes.note = this.noteForm.value.clientnotes; - // this.notes.createdOn = d; + // this.notes.createdOn = d; console.log(this.notes); this.clientService.postClientNote(this.id, this.notes) .subscribe( @@ -146,9 +182,30 @@ export class ViewClientComponent implements OnInit, OnDestroy { } + deleteClientIdentifier(id: number, identifierId: number) { + this.clientService.deleteClientIdentifier(id, identifierId) + .subscribe( + (res => { + this.getClientIdentifier(this.id); + return true; + }) + ); + } + deleteClientDocuments(id: number, docId: number) { + console.log(docId); + this.clientService.deleteClientDocuments(id, docId) + .subscribe( + (res => { + this.getClientDocuments(this.id); + return true; + }) + ); + } + ngOnDestroy() { this.paramsSubscription.unsubscribe(); } } + diff --git a/src/main.scss b/src/main.scss index 611942c96..43a71b761 100644 --- a/src/main.scss +++ b/src/main.scss @@ -6,8 +6,11 @@ // Import Default Theme for MifosX @import "theme/custom/denim-yellowgreen"; -// 3rd party libraries - // Global Imports /* You can add global styles to this file, and also import other style files */ @import "assets/styles/helper"; + + +// 3rd party libraries +$fa-font-path: "../node_modules/font-awesome/fonts"; +@import "../node_modules/font-awesome/scss/font-awesome.scss"; \ No newline at end of file