From ff8e878e9a4b11785caee0201941561668f88531 Mon Sep 17 00:00:00 2001 From: abhay_1806 Date: Sat, 28 Jul 2018 20:05:13 +0530 Subject: [PATCH] feat: edit and delete financial activity mapping Add edit financial activity component and delete dialog component. --- .../accounting/accounting-routing.module.ts | 15 +++- src/app/accounting/accounting.module.ts | 4 +- src/app/accounting/accounting.service.ts | 13 +++- ...-financial-activity-mapping.component.html | 57 ++++++++------- ...-financial-activity-mapping.component.html | 40 ++++++++++ ...-financial-activity-mapping.component.scss | 3 + ...nancial-activity-mapping.component.spec.ts | 25 +++++++ ...it-financial-activity-mapping.component.ts | 73 +++++++++++++++++++ ...-financial-activity-mapping.component.html | 4 +- ...ew-financial-activity-mapping.component.ts | 26 ++++++- .../delete-dialog.component.html | 8 ++ .../delete-dialog.component.scss | 0 .../delete-dialog.component.spec.ts | 25 +++++++ .../delete-dialog/delete-dialog.component.ts | 17 +++++ src/app/shared/shared.module.ts | 7 +- 15 files changed, 279 insertions(+), 38 deletions(-) create mode 100644 src/app/accounting/financial-activity-mappings/edit-financial-activity-mapping/edit-financial-activity-mapping.component.html create mode 100644 src/app/accounting/financial-activity-mappings/edit-financial-activity-mapping/edit-financial-activity-mapping.component.scss create mode 100644 src/app/accounting/financial-activity-mappings/edit-financial-activity-mapping/edit-financial-activity-mapping.component.spec.ts create mode 100644 src/app/accounting/financial-activity-mappings/edit-financial-activity-mapping/edit-financial-activity-mapping.component.ts create mode 100644 src/app/shared/delete-dialog/delete-dialog.component.html create mode 100644 src/app/shared/delete-dialog/delete-dialog.component.scss create mode 100644 src/app/shared/delete-dialog/delete-dialog.component.spec.ts create mode 100644 src/app/shared/delete-dialog/delete-dialog.component.ts diff --git a/src/app/accounting/accounting-routing.module.ts b/src/app/accounting/accounting-routing.module.ts index 87e67e1e8..e4416f9cb 100644 --- a/src/app/accounting/accounting-routing.module.ts +++ b/src/app/accounting/accounting-routing.module.ts @@ -10,6 +10,7 @@ import { SearchJournalEntryComponent } from './search-journal-entry/search-journ import { FinancialActivityMappingsComponent } from './financial-activity-mappings/financial-activity-mappings.component'; import { CreateFinancialActivityMappingComponent } from './financial-activity-mappings/create-financial-activity-mapping/create-financial-activity-mapping.component'; import { ViewFinancialActivityMappingComponent } from './financial-activity-mappings/view-financial-activity-mapping/view-financial-activity-mapping.component'; +import { EditFinancialActivityMappingComponent } from './financial-activity-mappings/edit-financial-activity-mapping/edit-financial-activity-mapping.component'; const routes: Routes = [ Route.withShell([ @@ -62,8 +63,18 @@ const routes: Routes = [ }, { path: 'view/:id', - component: ViewFinancialActivityMappingComponent, - data: {title: extract('View Financial Activity Mapping'), routeParamBreadcrumb: 'id' } + data: { title: extract('View Financial Activity Mapping'), routeParamBreadcrumb: 'id' }, + children: [ + { + path: '', + component: ViewFinancialActivityMappingComponent + }, + { + path: 'edit', + component: EditFinancialActivityMappingComponent, + data: { title: extract('Edit Financial Activity Mapping'), breadcrumb: 'Edit', routeParamBreadcrumb: false } + } + ] } ] } diff --git a/src/app/accounting/accounting.module.ts b/src/app/accounting/accounting.module.ts index 51ed13b09..0c40c79ca 100644 --- a/src/app/accounting/accounting.module.ts +++ b/src/app/accounting/accounting.module.ts @@ -14,6 +14,7 @@ import { SearchJournalEntryComponent } from './search-journal-entry/search-journ import { FinancialActivityMappingsComponent } from './financial-activity-mappings/financial-activity-mappings.component'; import { CreateFinancialActivityMappingComponent } from './financial-activity-mappings/create-financial-activity-mapping/create-financial-activity-mapping.component'; import { ViewFinancialActivityMappingComponent } from './financial-activity-mappings/view-financial-activity-mapping/view-financial-activity-mapping.component'; +import { EditFinancialActivityMappingComponent } from './financial-activity-mappings/edit-financial-activity-mapping/edit-financial-activity-mapping.component'; @NgModule({ imports: [ @@ -33,7 +34,8 @@ import { ViewFinancialActivityMappingComponent } from './financial-activity-mapp SearchJournalEntryComponent, FinancialActivityMappingsComponent, CreateFinancialActivityMappingComponent, - ViewFinancialActivityMappingComponent + ViewFinancialActivityMappingComponent, + EditFinancialActivityMappingComponent ], entryComponents: [ RevertTransactionComponent, diff --git a/src/app/accounting/accounting.service.ts b/src/app/accounting/accounting.service.ts index eea41ca2d..2072df0f1 100644 --- a/src/app/accounting/accounting.service.ts +++ b/src/app/accounting/accounting.service.ts @@ -83,8 +83,17 @@ export class AccountingService { return this.http.post('/financialactivityaccounts', financialActivityAccount); } - getFinancialActivityAccount(financialActivityAccountId: number) { - return this.http.get(`/financialactivityaccounts/${financialActivityAccountId}`); + getFinancialActivityAccount(financialActivityAccountId: number, template: boolean) { + const httpParams = new HttpParams().set('template', template.toString()); + return this.http.get(`/financialactivityaccounts/${financialActivityAccountId}`, { params: httpParams }); + } + + updateFinancialActivityAccount(financialActivityAccountId: number, financialActivityAccount: any) { + return this.http.put(`/financialactivityaccounts/${financialActivityAccountId}`, financialActivityAccount); + } + + deleteFinancialActivityAccount(financialActivityAccountId: number) { + return this.http.delete(`/financialactivityaccounts/${financialActivityAccountId}`); } } diff --git a/src/app/accounting/financial-activity-mappings/create-financial-activity-mapping/create-financial-activity-mapping.component.html b/src/app/accounting/financial-activity-mappings/create-financial-activity-mapping/create-financial-activity-mapping.component.html index 55b91d45d..8914d3222 100644 --- a/src/app/accounting/financial-activity-mappings/create-financial-activity-mapping/create-financial-activity-mapping.component.html +++ b/src/app/accounting/financial-activity-mappings/create-financial-activity-mapping/create-financial-activity-mapping.component.html @@ -1,35 +1,40 @@ - -
+
- + + + -
+ - - - - {{ financialActivity.name }} - - - +
- - - - {{ glAccount.name + ' (' + glAccount.glCode + ')' }} - - - + + + + {{ financialActivity.name }} + + + -
+ + + + {{ glAccount.name + ' (' + glAccount.glCode + ')' }} + + + - +
- - - - + - + + + + - + + + + +
diff --git a/src/app/accounting/financial-activity-mappings/edit-financial-activity-mapping/edit-financial-activity-mapping.component.html b/src/app/accounting/financial-activity-mappings/edit-financial-activity-mapping/edit-financial-activity-mapping.component.html new file mode 100644 index 000000000..204165549 --- /dev/null +++ b/src/app/accounting/financial-activity-mappings/edit-financial-activity-mapping/edit-financial-activity-mapping.component.html @@ -0,0 +1,40 @@ +
+ + + +
+ + + +
+ + + + + {{ financialActivity.name }} + + + + + + + + {{ glAccount.name + ' (' + glAccount.glCode + ')' }} + + + + +
+ + + + + + + + +
+ + + +
diff --git a/src/app/accounting/financial-activity-mappings/edit-financial-activity-mapping/edit-financial-activity-mapping.component.scss b/src/app/accounting/financial-activity-mappings/edit-financial-activity-mapping/edit-financial-activity-mapping.component.scss new file mode 100644 index 000000000..d774f68da --- /dev/null +++ b/src/app/accounting/financial-activity-mappings/edit-financial-activity-mapping/edit-financial-activity-mapping.component.scss @@ -0,0 +1,3 @@ +.container { + max-width: 37rem; +} diff --git a/src/app/accounting/financial-activity-mappings/edit-financial-activity-mapping/edit-financial-activity-mapping.component.spec.ts b/src/app/accounting/financial-activity-mappings/edit-financial-activity-mapping/edit-financial-activity-mapping.component.spec.ts new file mode 100644 index 000000000..4b9578295 --- /dev/null +++ b/src/app/accounting/financial-activity-mappings/edit-financial-activity-mapping/edit-financial-activity-mapping.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { EditFinancialActivityMappingComponent } from './edit-financial-activity-mapping.component'; + +describe('EditFinancialActivityMappingComponent', () => { + let component: EditFinancialActivityMappingComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ EditFinancialActivityMappingComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(EditFinancialActivityMappingComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/accounting/financial-activity-mappings/edit-financial-activity-mapping/edit-financial-activity-mapping.component.ts b/src/app/accounting/financial-activity-mappings/edit-financial-activity-mapping/edit-financial-activity-mapping.component.ts new file mode 100644 index 000000000..766312a63 --- /dev/null +++ b/src/app/accounting/financial-activity-mappings/edit-financial-activity-mapping/edit-financial-activity-mapping.component.ts @@ -0,0 +1,73 @@ +import { Component, OnInit } from '@angular/core'; +import { FormBuilder, FormGroup, Validators } from '@angular/forms'; +import { Router, ActivatedRoute } from '@angular/router'; + +import { AccountingService } from '../../accounting.service'; + +@Component({ + selector: 'mifosx-edit-financial-activity-mapping', + templateUrl: './edit-financial-activity-mapping.component.html', + styleUrls: ['./edit-financial-activity-mapping.component.scss'] +}) +export class EditFinancialActivityMappingComponent implements OnInit { + + financialActivityMappingForm: FormGroup; + glAccountOptions: any; + glAccountData: any; + financialActivityAccountId: any; + financialActivityData: any; + + constructor(private route: ActivatedRoute, + private formBuider: FormBuilder, + private accountingService: AccountingService, + private router: Router) { } + + ngOnInit() { + this.financialActivityAccountId = this.route.snapshot.paramMap.get('id'); + this.createFinancialActivityMappingForm(); + this.setGLAccountData(); + this.getFinancialActivityAccount(); + } + + createFinancialActivityMappingForm() { + this.financialActivityMappingForm = this.formBuider.group({ + 'financialActivityId': ['', Validators.required], + 'glAccountId': ['', Validators.required] + }); + } + + getFinancialActivityAccount() { + this.accountingService.getFinancialActivityAccount(this.financialActivityAccountId, true) + .subscribe((financialActivityAccountData: any) => { + this.glAccountOptions = financialActivityAccountData.glAccountOptions; + this.financialActivityData = financialActivityAccountData.financialActivityOptions; + this.financialActivityMappingForm.get('financialActivityId').setValue(financialActivityAccountData.financialActivityData.id); + this.financialActivityMappingForm.get('glAccountId').setValue(financialActivityAccountData.glAccountData.id); + }); + } + + setGLAccountData() { + this.financialActivityMappingForm.get('financialActivityId').valueChanges.subscribe(financialActivityId => { + switch (financialActivityId) { + case 100: + case 101: + case 102: + case 103: this.glAccountData = this.glAccountOptions.assetAccountOptions; + break; + case 200: + case 201: this.glAccountData = this.glAccountOptions.liabilityAccountOptions; + break; + case 300: this.glAccountData = this.glAccountOptions.equityAccountOptions; + break; + } + }); + } + + submit() { + this.accountingService.updateFinancialActivityAccount(this.financialActivityAccountId, this.financialActivityMappingForm.value) + .subscribe((response: any) => { + this.router.navigate(['/accounting/financial-activity-mappings/view', response.resourceId]); + }); + } + +} diff --git a/src/app/accounting/financial-activity-mappings/view-financial-activity-mapping/view-financial-activity-mapping.component.html b/src/app/accounting/financial-activity-mappings/view-financial-activity-mapping/view-financial-activity-mapping.component.html index 5452c7624..8d4634936 100644 --- a/src/app/accounting/financial-activity-mappings/view-financial-activity-mapping/view-financial-activity-mapping.component.html +++ b/src/app/accounting/financial-activity-mappings/view-financial-activity-mapping/view-financial-activity-mapping.component.html @@ -1,8 +1,8 @@
- -
diff --git a/src/app/accounting/financial-activity-mappings/view-financial-activity-mapping/view-financial-activity-mapping.component.ts b/src/app/accounting/financial-activity-mappings/view-financial-activity-mapping/view-financial-activity-mapping.component.ts index b68119797..b57260bbb 100644 --- a/src/app/accounting/financial-activity-mappings/view-financial-activity-mapping/view-financial-activity-mapping.component.ts +++ b/src/app/accounting/financial-activity-mappings/view-financial-activity-mapping/view-financial-activity-mapping.component.ts @@ -1,6 +1,9 @@ import { Component, OnInit } from '@angular/core'; -import { ActivatedRoute } from '@angular/router'; +import { ActivatedRoute, Router } from '@angular/router'; +import { MatDialog } from '@angular/material'; + import { AccountingService } from '../../accounting.service'; +import { DeleteDialogComponent } from '../../../shared/delete-dialog/delete-dialog.component'; @Component({ selector: 'mifosx-view-financial-activity-mapping', @@ -13,7 +16,9 @@ export class ViewFinancialActivityMappingComponent implements OnInit { financialActivityAccountData: any; constructor(private route: ActivatedRoute, - private accountingService: AccountingService) { } + private router: Router, + private accountingService: AccountingService, + public dialog: MatDialog) { } ngOnInit() { this.financialActivityAccountId = this.route.snapshot.paramMap.get('id'); @@ -21,11 +26,24 @@ export class ViewFinancialActivityMappingComponent implements OnInit { } getFinancialActivityAccount() { - this.accountingService.getFinancialActivityAccount(this.financialActivityAccountId) + this.accountingService.getFinancialActivityAccount(this.financialActivityAccountId, false) .subscribe((financialActivityAccountData: any) => { this.financialActivityAccountData = financialActivityAccountData; - console.log(financialActivityAccountData); }); } + deleteFinancialActivityAccount() { + const deleteFinancialActivityAccountDialogRef = this.dialog.open(DeleteDialogComponent, { + data: { deleteContext: `financial activity mapping ${this.financialActivityAccountId}` } + }); + deleteFinancialActivityAccountDialogRef.afterClosed().subscribe((response: any) => { + if (response.delete) { + this.accountingService.deleteFinancialActivityAccount(this.financialActivityAccountId) + .subscribe(() => { + this.router.navigate(['/accounting/financial-activity-mappings']); + }); + } + }); + } + } diff --git a/src/app/shared/delete-dialog/delete-dialog.component.html b/src/app/shared/delete-dialog/delete-dialog.component.html new file mode 100644 index 000000000..eacc70bd3 --- /dev/null +++ b/src/app/shared/delete-dialog/delete-dialog.component.html @@ -0,0 +1,8 @@ +

Delete

+
+

Are you sure you want to delete {{ data.deleteContext }} ?

+
+ + + + diff --git a/src/app/shared/delete-dialog/delete-dialog.component.scss b/src/app/shared/delete-dialog/delete-dialog.component.scss new file mode 100644 index 000000000..e69de29bb diff --git a/src/app/shared/delete-dialog/delete-dialog.component.spec.ts b/src/app/shared/delete-dialog/delete-dialog.component.spec.ts new file mode 100644 index 000000000..38e082626 --- /dev/null +++ b/src/app/shared/delete-dialog/delete-dialog.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { DeleteDialogComponent } from './delete-dialog.component'; + +describe('DeleteDialogComponent', () => { + let component: DeleteDialogComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ DeleteDialogComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(DeleteDialogComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/shared/delete-dialog/delete-dialog.component.ts b/src/app/shared/delete-dialog/delete-dialog.component.ts new file mode 100644 index 000000000..e66227d4c --- /dev/null +++ b/src/app/shared/delete-dialog/delete-dialog.component.ts @@ -0,0 +1,17 @@ +import { Component, OnInit, Inject } from '@angular/core'; +import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material'; + +@Component({ + selector: 'mifosx-delete-dialog', + templateUrl: './delete-dialog.component.html', + styleUrls: ['./delete-dialog.component.scss'] +}) +export class DeleteDialogComponent implements OnInit { + + constructor(public dialogRef: MatDialogRef, + @Inject(MAT_DIALOG_DATA) public data: any) { } + + ngOnInit() { + } + +} diff --git a/src/app/shared/shared.module.ts b/src/app/shared/shared.module.ts index f9283d5d7..714ef1c0d 100644 --- a/src/app/shared/shared.module.ts +++ b/src/app/shared/shared.module.ts @@ -4,6 +4,7 @@ import { CommonModule } from '@angular/common'; import { LoaderComponent } from './loader/loader.component'; import { FileUploadComponent } from './file-upload/file-upload.component'; import { CoreModule } from '../core/core.module'; +import { DeleteDialogComponent } from './delete-dialog/delete-dialog.component'; @NgModule({ imports: [ @@ -12,11 +13,15 @@ import { CoreModule } from '../core/core.module'; ], declarations: [ LoaderComponent, - FileUploadComponent + FileUploadComponent, + DeleteDialogComponent ], exports: [ LoaderComponent, FileUploadComponent + ], + entryComponents: [ + DeleteDialogComponent ] }) export class SharedModule { }