From 1707c2742ceaadf5b12faff66b4b251311d4d262 Mon Sep 17 00:00:00 2001 From: Abhay Chawla Date: Fri, 3 Aug 2018 15:05:29 +0530 Subject: [PATCH] feat(chart-of-accounts): view GL Account component Add view GL Account component. --- .../accounting/accounting-routing.module.ts | 15 +++- src/app/accounting/accounting.module.ts | 4 +- src/app/accounting/accounting.service.ts | 5 ++ .../chart-of-accounts.component.html | 2 +- .../chart-of-accounts.component.ts | 12 --- .../create-gl-account.component.ts | 9 +- .../view-gl-account.component.html | 89 +++++++++++++++++++ .../view-gl-account.component.scss | 14 +++ .../view-gl-account.component.spec.ts | 25 ++++++ .../view-gl-account.component.ts | 22 +++++ .../view-gl-account.resolver.ts | 38 ++++++++ 11 files changed, 217 insertions(+), 18 deletions(-) create mode 100644 src/app/accounting/chart-of-accounts/view-gl-account/view-gl-account.component.html create mode 100644 src/app/accounting/chart-of-accounts/view-gl-account/view-gl-account.component.scss create mode 100644 src/app/accounting/chart-of-accounts/view-gl-account/view-gl-account.component.spec.ts create mode 100644 src/app/accounting/chart-of-accounts/view-gl-account/view-gl-account.component.ts create mode 100644 src/app/accounting/chart-of-accounts/view-gl-account/view-gl-account.resolver.ts diff --git a/src/app/accounting/accounting-routing.module.ts b/src/app/accounting/accounting-routing.module.ts index aafc9642b..88e80b51d 100644 --- a/src/app/accounting/accounting-routing.module.ts +++ b/src/app/accounting/accounting-routing.module.ts @@ -16,6 +16,8 @@ import { ChartOfAccountsComponent } from './chart-of-accounts/chart-of-accounts. import { ChartOfAccountsResolver } from './chart-of-accounts/chart-of-accounts.resolver'; import { CreateGlAccountComponent } from './chart-of-accounts/create-gl-account/create-gl-account.component'; +import { ViewGlAccountComponent } from './chart-of-accounts/view-gl-account/view-gl-account.component'; +import { ViewGlAccountResolver } from './chart-of-accounts/view-gl-account/view-gl-account.resolver'; const routes: Routes = [ Route.withShell([ @@ -98,6 +100,14 @@ const routes: Routes = [ path: 'gl-accounts/create', component: CreateGlAccountComponent, data: { title: extract('Create GL Account'), breadcrumb: 'Create GL Account' }, + }, + { + path: 'gl-accounts/view/:id', + component: ViewGlAccountComponent, + data: { title: extract('View GL Account'), routeResolveBreadcrumb: ['glAccount', 'name'] }, + resolve: { + glAccount: ViewGlAccountResolver + } } ] } @@ -109,6 +119,9 @@ const routes: Routes = [ @NgModule({ imports: [RouterModule.forChild(routes)], exports: [RouterModule], - providers: [ChartOfAccountsResolver] + providers: [ + ChartOfAccountsResolver, + ViewGlAccountResolver + ] }) export class AccountingRoutingModule { } diff --git a/src/app/accounting/accounting.module.ts b/src/app/accounting/accounting.module.ts index 384968cf2..02dfa618e 100644 --- a/src/app/accounting/accounting.module.ts +++ b/src/app/accounting/accounting.module.ts @@ -17,6 +17,7 @@ import { ViewFinancialActivityMappingComponent } from './financial-activity-mapp import { EditFinancialActivityMappingComponent } from './financial-activity-mappings/edit-financial-activity-mapping/edit-financial-activity-mapping.component'; import { ChartOfAccountsComponent } from './chart-of-accounts/chart-of-accounts.component'; import { CreateGlAccountComponent } from './chart-of-accounts/create-gl-account/create-gl-account.component'; +import { ViewGlAccountComponent } from './chart-of-accounts/view-gl-account/view-gl-account.component'; @NgModule({ imports: [ @@ -39,7 +40,8 @@ import { CreateGlAccountComponent } from './chart-of-accounts/create-gl-account/ ViewFinancialActivityMappingComponent, EditFinancialActivityMappingComponent, ChartOfAccountsComponent, - CreateGlAccountComponent + CreateGlAccountComponent, + ViewGlAccountComponent ], entryComponents: [ RevertTransactionComponent, diff --git a/src/app/accounting/accounting.service.ts b/src/app/accounting/accounting.service.ts index d508b5811..b8f03ed07 100644 --- a/src/app/accounting/accounting.service.ts +++ b/src/app/accounting/accounting.service.ts @@ -108,4 +108,9 @@ export class AccountingService { return this.http.post('/glaccounts', glAccount); } + getGlAccount(glAccountId: string, template: boolean = false) { + const httpParams = new HttpParams().set('template', template.toString()); + return this.http.get(`/glaccounts/${glAccountId}`, { params: httpParams }); + } + } diff --git a/src/app/accounting/chart-of-accounts/chart-of-accounts.component.html b/src/app/accounting/chart-of-accounts/chart-of-accounts.component.html index c0ae7a43a..17e44f1ff 100644 --- a/src/app/accounting/chart-of-accounts/chart-of-accounts.component.html +++ b/src/app/accounting/chart-of-accounts/chart-of-accounts.component.html @@ -65,7 +65,7 @@ - + diff --git a/src/app/accounting/chart-of-accounts/chart-of-accounts.component.ts b/src/app/accounting/chart-of-accounts/chart-of-accounts.component.ts index ef393883e..dd84b5b8e 100644 --- a/src/app/accounting/chart-of-accounts/chart-of-accounts.component.ts +++ b/src/app/accounting/chart-of-accounts/chart-of-accounts.component.ts @@ -25,11 +25,9 @@ export class ChartOfAccountsComponent implements AfterViewInit, OnInit { @ViewChild(MatPaginator) paginator: MatPaginator; @ViewChild(MatSort) sort: MatSort; - // nestedTreeControl: NestedTreeControl; nestedTreeDataSource: MatTreeNestedDataSource; glAccount: GLAccountNode; - // constructor(private glAccountTreeService: GlAccountTreeService, private route: ActivatedRoute) { @@ -37,20 +35,16 @@ export class ChartOfAccountsComponent implements AfterViewInit, OnInit { this.glAccountData = data.glAccountData; glAccountTreeService.initialize(this.glAccountData); }); - // this.nestedTreeControl = new NestedTreeControl(this._getChildren); this.nestedTreeDataSource = new MatTreeNestedDataSource(); - // } ngOnInit() { this.tableDataSource = new MatTableDataSource(this.glAccountData); - // this.glAccountTreeService.treeDataChange.subscribe((glAccountTreeData: any) => { this.nestedTreeDataSource.data = glAccountTreeData; this.nestedTreeControl.expand(this.nestedTreeDataSource.data[0]); }); - // } ngAfterViewInit() { @@ -69,11 +63,6 @@ export class ChartOfAccountsComponent implements AfterViewInit, OnInit { this.tableDataSource.filter = filterValue.trim().toLowerCase(); } - viewGLAccount(glAccount: any) { - console.log(glAccount); - } - - // hasNestedChild = (_: number, node: GLAccountNode) => node.children.length; viewGLAccountNode(glAccount: GLAccountNode) { @@ -85,6 +74,5 @@ export class ChartOfAccountsComponent implements AfterViewInit, OnInit { } private _getChildren = (node: GLAccountNode) => of(node.children); - // } diff --git a/src/app/accounting/chart-of-accounts/create-gl-account/create-gl-account.component.ts b/src/app/accounting/chart-of-accounts/create-gl-account/create-gl-account.component.ts index 715f0db8f..e9892a2ad 100644 --- a/src/app/accounting/chart-of-accounts/create-gl-account/create-gl-account.component.ts +++ b/src/app/accounting/chart-of-accounts/create-gl-account/create-gl-account.component.ts @@ -1,5 +1,7 @@ import { Component, OnInit } from '@angular/core'; import { FormGroup, FormBuilder, Validators } from '@angular/forms'; +import { Router } from '@angular/router'; + import { AccountingService } from '../../accounting.service'; @Component({ @@ -17,7 +19,8 @@ export class CreateGlAccountComponent implements OnInit { tagData: any; constructor(private formBuilder: FormBuilder, - private accountingService: AccountingService) { } + private accountingService: AccountingService, + private router: Router) { } ngOnInit() { this.createGlAccountForm(); @@ -69,8 +72,8 @@ export class CreateGlAccountComponent implements OnInit { } submit() { - this.accountingService.createGlAccount(this.glAccountForm.value).subscribe(response => { - console.log(response); + this.accountingService.createGlAccount(this.glAccountForm.value).subscribe((response: any) => { + this.router.navigate(['/accounting/chart-of-accounts/gl-accounts/view', response.resourceId]); }); } diff --git a/src/app/accounting/chart-of-accounts/view-gl-account/view-gl-account.component.html b/src/app/accounting/chart-of-accounts/view-gl-account/view-gl-account.component.html new file mode 100644 index 000000000..2bfb67e1c --- /dev/null +++ b/src/app/accounting/chart-of-accounts/view-gl-account/view-gl-account.component.html @@ -0,0 +1,89 @@ +
+ + + + + +
+ +
+ + + + + +
+ +
+ Account Type +
+ +
+ {{ glAccount.type.value }} +
+ +
+ GL Code +
+ +
+ {{ glAccount.glCode }} +
+ +
+ Parent Account Name +
+ +
+ {{ glAccount.parent.name }} +
+ +
+ Tag +
+ +
+ {{ glAccount.tagId.name }} +
+ +
+ Account Usage +
+ +
+ {{ glAccount.usage.value }} +
+ +
+ Manual Entries Allowed +
+ +
+ {{ glAccount.manualEntriesAllowed }} +
+ +
+ Description +
+ +
+ {{ glAccount.description }} +
+ +
+ + + + + +
diff --git a/src/app/accounting/chart-of-accounts/view-gl-account/view-gl-account.component.scss b/src/app/accounting/chart-of-accounts/view-gl-account/view-gl-account.component.scss new file mode 100644 index 000000000..98c6e0c98 --- /dev/null +++ b/src/app/accounting/chart-of-accounts/view-gl-account/view-gl-account.component.scss @@ -0,0 +1,14 @@ +.container { + max-width: 37rem; +} + +.content { + div { + margin: 1rem 0; + word-wrap: break-word; + } + + .header { + font-weight: 500; + } +} diff --git a/src/app/accounting/chart-of-accounts/view-gl-account/view-gl-account.component.spec.ts b/src/app/accounting/chart-of-accounts/view-gl-account/view-gl-account.component.spec.ts new file mode 100644 index 000000000..072633881 --- /dev/null +++ b/src/app/accounting/chart-of-accounts/view-gl-account/view-gl-account.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { ViewGlAccountComponent } from './view-gl-account.component'; + +describe('ViewGlAccountComponent', () => { + let component: ViewGlAccountComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ ViewGlAccountComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(ViewGlAccountComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/accounting/chart-of-accounts/view-gl-account/view-gl-account.component.ts b/src/app/accounting/chart-of-accounts/view-gl-account/view-gl-account.component.ts new file mode 100644 index 000000000..cb3632765 --- /dev/null +++ b/src/app/accounting/chart-of-accounts/view-gl-account/view-gl-account.component.ts @@ -0,0 +1,22 @@ +import { Component, OnInit } from '@angular/core'; +import { ActivatedRoute } from '@angular/router'; + +@Component({ + selector: 'mifosx-view-gl-account', + templateUrl: './view-gl-account.component.html', + styleUrls: ['./view-gl-account.component.scss'] +}) +export class ViewGlAccountComponent implements OnInit { + + glAccount: any; + + constructor(private route: ActivatedRoute) { + this.route.data.subscribe((data: { glAccount: any }) => { + this.glAccount = data.glAccount; + }); + } + + ngOnInit() { + } + +} diff --git a/src/app/accounting/chart-of-accounts/view-gl-account/view-gl-account.resolver.ts b/src/app/accounting/chart-of-accounts/view-gl-account/view-gl-account.resolver.ts new file mode 100644 index 000000000..5d8f33fde --- /dev/null +++ b/src/app/accounting/chart-of-accounts/view-gl-account/view-gl-account.resolver.ts @@ -0,0 +1,38 @@ +import { Injectable } from '@angular/core'; +import { Resolve, ActivatedRouteSnapshot } from '@angular/router'; + +import { Observable } from 'rxjs'; +import { map } from 'rxjs/operators'; + +import { AccountingService } from '../../accounting.service'; + +@Injectable() +export class ViewGlAccountResolver implements Resolve { + + constructor(private accountingService: AccountingService) {} + + resolve(route: ActivatedRouteSnapshot): Observable { + const id = route.paramMap.get('id'); + + return this.accountingService.getGlAccount(id, true).pipe(map((glAccountData: any) => { + let accountOptions = []; + switch (glAccountData.type.value) { + case 'ASSET': accountOptions = glAccountData.assetHeaderAccountOptions; + break; + case 'EQUITY': accountOptions = glAccountData.equityHeaderAccountOptions; + break; + case 'EXPENSE': accountOptions = glAccountData.expenseHeaderAccountOptions; + break; + case 'INCOME': accountOptions = glAccountData.incomeHeaderAccountOptions; + break; + case 'LIABILITY': accountOptions = glAccountData.liabilityHeaderAccountOptions; + break; + } + glAccountData.parent = accountOptions.find((accountOption: any) => { + return accountOption.id === glAccountData.parentId; + }); + return glAccountData; + })); + } + +}