Accounting financial activities using more readable concepts

src/app/accounting/financial-activity-mappings/create-financial-activity-mapping/create-financial-activity-mapping.component.html

@@ -12,7 +12,7 @@
             <mat-label>{{"labels.inputs.Financial Activity" | translate}}</mat-label>
             <mat-select required formControlName="financialActivityId">
               <mat-option *ngFor="let financialActivity of financialActivityData" [value]="financialActivity.id">
-                {{ financialActivity.name }}
+                ({{financialActivity.id}}) {{ 'labels.accounting.financialActivity.' + financialActivity.name | translate }}
               </mat-option>
             </mat-select>
             <mat-error *ngIf="financialActivityMappingForm.controls.financialActivityId.hasError('required')">

src/app/accounting/financial-activity-mappings/edit-financial-activity-mapping/edit-financial-activity-mapping.component.html

@@ -12,7 +12,7 @@
             <mat-label>{{"labels.inputs.Financial Activity" | translate}}</mat-label>
             <mat-select required formControlName="financialActivityId">
               <mat-option *ngFor="let financialActivity of financialActivityData" [value]="financialActivity.id">
-                {{ financialActivity.name }}
+                ({{financialActivity.id}}) {{ 'labels.accounting.financialActivity.' + financialActivity.name | translate }}
               </mat-option>
             </mat-select>
           </mat-form-field>

src/app/accounting/financial-activity-mappings/edit-financial-activity-mapping/edit-financial-activity-mapping.component.ts

@@ -45,6 +45,7 @@ export class EditFinancialActivityMappingComponent implements OnInit {
               private router: Router) {
     this.route.data.subscribe((data: { financialActivityAccountAndTemplate: any }) => {
       this.financialActivityAccountId = data.financialActivityAccountAndTemplate.id;
+      console.log(data.financialActivityAccountAndTemplate.financialActivityData);
       this.financialActivityId = data.financialActivityAccountAndTemplate.financialActivityData.id;
       this.glAccountId = data.financialActivityAccountAndTemplate.glAccountData.id;
       this.glAccountOptions = data.financialActivityAccountAndTemplate.glAccountOptions;

src/app/accounting/financial-activity-mappings/financial-activity-mappings.component.html

@@ -13,12 +13,15 @@
 
     <ng-container matColumnDef="financialActivity">
       <th mat-header-cell *matHeaderCellDef mat-sort-header> {{"labels.inputs.Financial Activity" | translate}} </th>
-      <td mat-cell *matCellDef="let financialActivityAccount"> {{ financialActivityAccount.financialActivityData.name }} </td>
+      <td mat-cell *matCellDef="let financialActivityAccount">
+          ({{financialActivityAccount.financialActivityData.id}}) 
+          {{ 'labels.accounting.financialActivity.' + financialActivityAccount.financialActivityData.name | translate }}
+        </td>
     </ng-container>
 
-    <ng-container matColumnDef="glAccountName">
-      <th mat-header-cell *matHeaderCellDef mat-sort-header> {{"labels.inputs.Account Name" | translate}} </th>
-      <td mat-cell *matCellDef="let financialActivityAccount"> {{ financialActivityAccount.glAccountData.name }} </td>
+    <ng-container matColumnDef="glAccountType">
+      <th mat-header-cell *matHeaderCellDef mat-sort-header> {{"labels.inputs.Account Type" | translate}} </th>
+      <td mat-cell *matCellDef="let financialActivityAccount"> {{ 'labels.inputs.accounting.' + financialActivityAccount.financialActivityData.mappedGLAccountType | translate }} </td>
     </ng-container>
 
     <ng-container matColumnDef="glAccountCode">
@@ -26,6 +29,11 @@
       <td mat-cell *matCellDef="let financialActivityAccount"> {{ financialActivityAccount.glAccountData.glCode }} </td>
     </ng-container>
 
+    <ng-container matColumnDef="glAccountName">
+      <th mat-header-cell *matHeaderCellDef mat-sort-header> {{"labels.inputs.Account Name" | translate}} </th>
+      <td mat-cell *matCellDef="let financialActivityAccount"> {{ financialActivityAccount.glAccountData.name }} </td>
+    </ng-container>
+
     <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
     <tr mat-row *matRowDef="let row; columns: displayedColumns;" [routerLink]="['view', row.id]" class="select-row"></tr>
 

src/app/accounting/financial-activity-mappings/financial-activity-mappings.component.ts

@@ -22,7 +22,7 @@ export class FinancialActivityMappingsComponent implements OnInit, AfterViewInit
   /** Financial activity account data. */
   financialActivityAccountData: any;
   /** Columns to be displayed in financial activity mappings table. */
-  displayedColumns: string[] = ['financialActivity', 'glAccountName', 'glAccountCode'];
+  displayedColumns: string[] = ['financialActivity', 'glAccountType', 'glAccountCode', 'glAccountName'];
   /** Data source for financial activity mappings table. */
   dataSource: MatTableDataSource<any>;
 

src/app/accounting/financial-activity-mappings/view-financial-activity-mapping/view-financial-activity-mapping.component.html

@@ -22,7 +22,15 @@
         </div>
 
         <div fxFlex="50%">
-          {{ financialActivityAccount?.financialActivityData.name }}
+          ({{financialActivityAccount?.financialActivityData.id}}) {{ 'labels.accounting.financialActivity.' + financialActivityAccount?.financialActivityData.name | translate }}
+        </div>
+
+        <div fxFlex="50%" class="header">
+          {{"labels.inputs.Account Type" | translate}}
+        </div>
+
+        <div fxFlex="50%">
+          {{ 'labels.inputs.accounting.' + financialActivityAccount?.financialActivityData.mappedGLAccountType | translate }}
         </div>
 
         <mifosx-gl-account-display fxFlex="100%"
@@ -35,6 +43,9 @@
 
     </mat-card-content>
 
+    <mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
+      <button type="button" color="primary" mat-raised-button [routerLink]="['../..']">{{  "labels.buttons.Back" | translate}}</button>
+    </mat-card-actions>
   </mat-card>
 
 </div>

src/app/accounting/financial-activity-mappings/view-financial-activity-mapping/view-financial-activity-mapping.component.ts

@@ -8,6 +8,7 @@ import { AccountingService } from '../../accounting.service';
 
 /** Custom Components */
 import { DeleteDialogComponent } from '../../../shared/delete-dialog/delete-dialog.component';
+import { Location } from '@angular/common';
 
 /**
  * View financial activity mapping component.
@@ -34,7 +35,8 @@ export class ViewFinancialActivityMappingComponent implements OnInit {
   constructor(private accountingService: AccountingService,
               private route: ActivatedRoute,
               private router: Router,
-              public dialog: MatDialog) {
+              private dialog: MatDialog,
+              private location: Location) {
     this.route.data.subscribe((data: { financialActivityAccount: any }) => {
       this.financialActivityAccount = data.financialActivityAccount;
       this.financialActivityAccountId = data.financialActivityAccount.id;
@@ -61,4 +63,8 @@ export class ViewFinancialActivityMappingComponent implements OnInit {
     });
   }
 
+  goBack(): void {
+    this.location.back();
+  }
+
 }