refractor: accounting module (#300)
* Refractor components. * Add resolvers. * Add relative router links. * Replace mat-icons by font-awesome icons. * Add comments. Fixes: #298
This commit is contained in:
+19
-14
@@ -1,18 +1,23 @@
|
||||
<div fxLayout="row" fxLayoutAlign="end" fxLayoutGap="2%" fxLayout.lt-md="column" class="container m-b-20">
|
||||
<button mat-raised-button color="primary" *ngIf="glAccount.usage.value === 'HEADER'" [routerLink]="['/accounting/chart-of-accounts/gl-accounts/create']" [queryParams]="{ parent: glAccount.id, accountType: glAccount.type.id }">
|
||||
<mat-icon>add</mat-icon> Subledger Account
|
||||
<fa-icon icon="plus"></fa-icon>
|
||||
Subledger Account
|
||||
</button>
|
||||
<button mat-raised-button color="primary" [routerLink]="['/accounting/chart-of-accounts/gl-accounts/view', glAccount.id, 'edit']">
|
||||
<mat-icon>edit</mat-icon> Edit
|
||||
<button mat-raised-button color="primary" [routerLink]="['edit']">
|
||||
<fa-icon icon="edit"></fa-icon>
|
||||
Edit
|
||||
</button>
|
||||
<button mat-raised-button color="warn" *ngIf="!glAccount.disabled" (click)="changeGlAccountState()">
|
||||
<mat-icon>lock</mat-icon> Disable
|
||||
<fa-icon icon="lock"></fa-icon>
|
||||
Disable
|
||||
</button>
|
||||
<button mat-raised-button color="accent" *ngIf="glAccount.disabled" (click)="changeGlAccountState()">
|
||||
<mat-icon>lock_open</mat-icon> Enable
|
||||
<fa-icon icon="lock-open"></fa-icon>
|
||||
Enable
|
||||
</button>
|
||||
<button mat-raised-button color="warn" (click)="deleteGlAccount()">
|
||||
<mat-icon>delete</mat-icon> Delete
|
||||
<fa-icon icon="trash"></fa-icon>
|
||||
Delete
|
||||
</button>
|
||||
</div>
|
||||
|
||||
@@ -29,7 +34,7 @@
|
||||
</div>
|
||||
|
||||
<div fxFlex="50%">
|
||||
{{ glAccount.type.value }}
|
||||
{{ glAccount.type?.value }}
|
||||
</div>
|
||||
|
||||
<div fxFlex="50%" class="header">
|
||||
@@ -40,19 +45,19 @@
|
||||
{{ glAccount.glCode }}
|
||||
</div>
|
||||
|
||||
<div fxFlex="50%" class="header">
|
||||
<div fxFlex="50%" class="header" *ngIf="glAccount.parent">
|
||||
Parent Account Name
|
||||
</div>
|
||||
|
||||
<div fxFlex="50%">
|
||||
<div fxFlex="50%" *ngIf="glAccount.parent">
|
||||
{{ glAccount.parent.name }}
|
||||
</div>
|
||||
|
||||
<div fxFlex="50%" class="header">
|
||||
<div fxFlex="50%" class="header" *ngIf="glAccount.tagId.id">
|
||||
Tag
|
||||
</div>
|
||||
|
||||
<div fxFlex="50%">
|
||||
<div fxFlex="50%" *ngIf="glAccount.tagId.id">
|
||||
{{ glAccount.tagId.name }}
|
||||
</div>
|
||||
|
||||
@@ -61,7 +66,7 @@
|
||||
</div>
|
||||
|
||||
<div fxFlex="50%">
|
||||
{{ glAccount.usage.value }}
|
||||
{{ glAccount.usage?.value }}
|
||||
</div>
|
||||
|
||||
<div fxFlex="50%" class="header">
|
||||
@@ -72,11 +77,11 @@
|
||||
{{ glAccount.manualEntriesAllowed }}
|
||||
</div>
|
||||
|
||||
<div fxFlex="50%" class="header">
|
||||
<div fxFlex="50%" class="header" *ngIf="glAccount.description">
|
||||
Description
|
||||
</div>
|
||||
|
||||
<div fxFlex="50%">
|
||||
<div fxFlex="50%" *ngIf="glAccount.description">
|
||||
{{ glAccount.description }}
|
||||
</div>
|
||||
|
||||
|
||||
@@ -1,14 +1,14 @@
|
||||
.container {
|
||||
max-width: 37rem;
|
||||
}
|
||||
|
||||
.content {
|
||||
div {
|
||||
margin: 1rem 0;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
.content {
|
||||
div {
|
||||
margin: 1rem 0;
|
||||
word-wrap: break-word;
|
||||
|
||||
.header {
|
||||
font-weight: 500;
|
||||
&.header {
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,10 +1,17 @@
|
||||
/** Angular Imports */
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { ActivatedRoute, Router } from '@angular/router';
|
||||
import { MatDialog } from '@angular/material';
|
||||
|
||||
/** Custom Components */
|
||||
import { DeleteDialogComponent } from '../../../shared/delete-dialog/delete-dialog.component';
|
||||
|
||||
/** Custom Services */
|
||||
import { AccountingService } from '../../accounting.service';
|
||||
|
||||
/**
|
||||
* View gl account component.
|
||||
*/
|
||||
@Component({
|
||||
selector: 'mifosx-view-gl-account',
|
||||
templateUrl: './view-gl-account.component.html',
|
||||
@@ -12,22 +19,32 @@ import { AccountingService } from '../../accounting.service';
|
||||
})
|
||||
export class ViewGlAccountComponent implements OnInit {
|
||||
|
||||
/** GL Account. */
|
||||
glAccount: any;
|
||||
|
||||
constructor(private route: ActivatedRoute,
|
||||
private accountingService: AccountingService,
|
||||
/**
|
||||
* Retrieves the gl account data from `resolve`.
|
||||
* @param {AccountingService} accountingService Accounting Service.
|
||||
* @param {ActivatedRoute} route Activated Route.
|
||||
* @param {Router} router Router for navigation.
|
||||
* @param {MatDialog} dialog Dialog reference.
|
||||
*/
|
||||
constructor(private accountingService: AccountingService,
|
||||
private route: ActivatedRoute,
|
||||
private router: Router,
|
||||
public dialog: MatDialog) {
|
||||
this.route.data.subscribe((data: { glAccount: any }) => {
|
||||
this.glAccount = data.glAccount;
|
||||
this.route.data.subscribe((data: { glAccountAndChartOfAccountsTemplate: any }) => {
|
||||
this.glAccount = data.glAccountAndChartOfAccountsTemplate;
|
||||
});
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
}
|
||||
|
||||
/**
|
||||
* Deletes the gl account and redirects to chart of accounts.
|
||||
*/
|
||||
deleteGlAccount() {
|
||||
// TODO: (Validation) gl account cannot be deleted if it has transactions logged against it
|
||||
const deleteGlAccountDialogRef = this.dialog.open(DeleteDialogComponent, {
|
||||
data: { deleteContext: `gl account ${this.glAccount.id}` }
|
||||
});
|
||||
@@ -41,6 +58,9 @@ export class ViewGlAccountComponent implements OnInit {
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Changes state of gl account. (enabled/disabled)
|
||||
*/
|
||||
changeGlAccountState() {
|
||||
this.accountingService.updateGlAccount(this.glAccount.id, { disabled: !this.glAccount.disabled })
|
||||
.subscribe((response: any) => {
|
||||
|
||||
@@ -1,38 +0,0 @@
|
||||
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<Object> {
|
||||
|
||||
constructor(private accountingService: AccountingService) {}
|
||||
|
||||
resolve(route: ActivatedRouteSnapshot): Observable<any> {
|
||||
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;
|
||||
}));
|
||||
}
|
||||
|
||||
}
|
||||
Reference in New Issue
Block a user