feat(provisioning-entries): view journal entries

Add view provisioning journal entries component.
Also, add feature to create provisioning journal entries and recreate provisioning.

src/app/accounting/accounting-routing.module.ts

@@ -34,6 +34,7 @@ import { PeriodicAccrualsComponent } from './periodic-accruals/periodic-accruals
 import { ProvisioningEntriesComponent } from './provisioning-entries/provisioning-entries.component';
 import { CreateProvisioningEntryComponent } from './provisioning-entries/create-provisioning-entry/create-provisioning-entry.component';
 import { ViewProvisioningEntryComponent } from './provisioning-entries/view-provisioning-entry/view-provisioning-entry.component';
+import { ViewProvisioningJournalEntriesComponent } from './provisioning-entries/view-provisioning-journal-entries/view-provisioning-journal-entries.component';
 
 const routes: Routes = [
   Route.withShell([
@@ -227,6 +228,17 @@ const routes: Routes = [
               path: 'view/:id',
               component: ViewProvisioningEntryComponent,
               data: { title: extract('View Provisioning Entry'), routeParamBreadcrumb: 'id' }
+            },
+            {
+              path: 'journal-entries',
+              data: { title: extract('View Provisioning Journal Entry'), breadcrumb: 'Journal Entries', addBreadcrumbLink: false },
+              children: [
+                {
+                  path: 'view/:id',
+                  component: ViewProvisioningJournalEntriesComponent,
+                  data: { title: extract('View Provisioning Journal Entry'), routeParamBreadcrumb: 'id' }
+                }
+              ]
             }
           ]
         }

src/app/accounting/accounting.module.ts

@@ -32,6 +32,7 @@ import { PeriodicAccrualsComponent } from './periodic-accruals/periodic-accruals
 import { ProvisioningEntriesComponent } from './provisioning-entries/provisioning-entries.component';
 import { CreateProvisioningEntryComponent } from './provisioning-entries/create-provisioning-entry/create-provisioning-entry.component';
 import { ViewProvisioningEntryComponent } from './provisioning-entries/view-provisioning-entry/view-provisioning-entry.component';
+import { ViewProvisioningJournalEntriesComponent } from './provisioning-entries/view-provisioning-journal-entries/view-provisioning-journal-entries.component';
 
 @NgModule({
   imports: [
@@ -68,7 +69,8 @@ import { ViewProvisioningEntryComponent } from './provisioning-entries/view-prov
     PeriodicAccrualsComponent,
     ProvisioningEntriesComponent,
     CreateProvisioningEntryComponent,
-    ViewProvisioningEntryComponent
+    ViewProvisioningEntryComponent,
+    ViewProvisioningJournalEntriesComponent
   ],
   entryComponents: [
     RevertTransactionComponent,

src/app/accounting/accounting.service.ts

@@ -194,4 +194,19 @@ export class AccountingService {
     return this.http.get('/provisioningentries/entries', { params: httpParams });
   }
 
+  getProvisioningJournalEntries(entryId: string) {
+    const httpParams = new HttpParams().set('entryId', entryId);
+    return this.http.get('/journalentries/provisioning', { params: httpParams });
+  }
+
+  createProvisioningJournalEntries(provisioningEntryId: string) {
+    const httpParams = new HttpParams().set('command', 'createjournalentry');
+    return this.http.post(`/provisioningentries/${provisioningEntryId}`, {}, { params: httpParams });
+  }
+
+  recreateProvisioningEntries(provisioningEntryId: string) {
+    const httpParams = new HttpParams().set('command', 'recreateprovisioningentry');
+    return this.http.post(`/provisioningentries/${provisioningEntryId}`, {}, { params: httpParams });
+  }
+
 }

src/app/accounting/provisioning-entries/provisioning-entries.component.html

@@ -28,27 +28,36 @@
 
       <ng-container matColumnDef="journalEntry">
         <th mat-header-cell *matHeaderCellDef mat-sort-header> Journal Entry Created </th>
-        <td mat-cell *matCellDef="let provisioningEntry"> {{ provisioningEntry.journalEntry }} </td>
+        <td mat-cell *matCellDef="let provisioningEntry">
+          <mat-checkbox [disabled]="true" [checked]="provisioningEntry.journalEntry"></mat-checkbox>
+        </td>
       </ng-container>
 
       <ng-container matColumnDef="viewReport">
         <th mat-header-cell *matHeaderCellDef> View Report </th>
         <td mat-cell *matCellDef="let provisioningEntry">
-          <button mat-button>View</button>
+          <button mat-button (click)="viewReport($event, provisioningEntry.id)" [disabled]="true" color="primary">
+            <!-- Tenant Customizable -->
+            <mat-icon>remove_red_eye</mat-icon>&nbsp;&nbsp;View
+          </button>
         </td>
       </ng-container>
 
       <ng-container matColumnDef="recreateProvisioning">
         <th mat-header-cell *matHeaderCellDef> Recreate Provisioning </th>
         <td mat-cell *matCellDef="let provisioningEntry">
-          <button mat-button>Recreate</button>
+          <button mat-button (click)="recreateProvisioning($event, provisioningEntry.id)" [disabled]="provisioningEntry.journalEntry" color="primary">
+            <mat-icon>edit</mat-icon>&nbsp;&nbsp;Recreate
+          </button>
         </td>
       </ng-container>
 
       <ng-container matColumnDef="viewJournalEntry">
         <th mat-header-cell *matHeaderCellDef> View Journal Entry </th>
         <td mat-cell *matCellDef="let provisioningEntry">
-          <button mat-button>View</button>
+          <button mat-button (click)="viewJournalEntry($event, provisioningEntry.id)" [disabled]="!provisioningEntry.journalEntry" color="primary">
+            <mat-icon>remove_red_eye</mat-icon>&nbsp;&nbsp;View
+          </button>
         </td>
       </ng-container>
 

src/app/accounting/provisioning-entries/provisioning-entries.component.ts

@@ -1,5 +1,6 @@
 import { Component, OnInit, ViewChild } from '@angular/core';
 import { MatSort, MatPaginator, MatTableDataSource } from '@angular/material';
+import { Router } from '@angular/router';
 
 import { AccountingService } from '../accounting.service';
 
@@ -16,7 +17,8 @@ export class ProvisioningEntriesComponent implements OnInit {
   @ViewChild(MatPaginator) paginator: MatPaginator;
   @ViewChild(MatSort) sort: MatSort;
 
-  constructor(private accountingService: AccountingService) { }
+  constructor(private accountingService: AccountingService,
+              private router: Router) { }
 
   ngOnInit() {
     this.getProvisioningEntries();
@@ -34,4 +36,22 @@ export class ProvisioningEntriesComponent implements OnInit {
     this.dataSource.filter = filterValue.trim().toLowerCase();
   }
 
+  viewReport($event: any, provisioningEntryId: number) {
+    // Tenant Customizable
+    $event.stopPropagation();
+  }
+
+  recreateProvisioning($event: any, provisioningEntryId: string) {
+    this.accountingService.recreateProvisioningEntries(provisioningEntryId)
+      .subscribe((response: any) => {
+        this.router.navigate(['/accounting/provisioning-entries/view', response.resourceId]);
+      });
+    $event.stopPropagation();
+  }
+
+  viewJournalEntry($event: any, provisioningEntryId: number) {
+    this.router.navigate(['/accounting/provisioning-entries/journal-entries/view', provisioningEntryId]);
+    $event.stopPropagation();
+  }
+
 }

src/app/accounting/provisioning-entries/view-provisioning-entry/view-provisioning-entry.component.html

@@ -1,5 +1,11 @@
 <div class="container" *ngIf="provisioningEntry">
 
+  <div class="m-b-20" fxLayout="row" fxLayoutAlign="end" fxLayoutGap="20px">
+    <button mat-raised-button color="primary" (click)="createProvisioningJournalEntries()" [disabled]="provisioningEntry.journalEntry">
+      <mat-icon>add</mat-icon>&nbsp;&nbsp;Create Journal Entries
+    </button>
+  </div>
+
   <mat-card>
 
     <mat-card-content>

src/app/accounting/provisioning-entries/view-provisioning-entry/view-provisioning-entry.component.ts

@@ -1,5 +1,5 @@
 import { Component, OnInit, ViewChild, AfterViewInit } from '@angular/core';
-import { ActivatedRoute } from '@angular/router';
+import { ActivatedRoute, Router } from '@angular/router';
 import { FormControl } from '@angular/forms';
 import { MatPaginator, MatSort, MatTableDataSource } from '@angular/material';
 
@@ -26,7 +26,7 @@ export class ViewProvisioningEntryComponent implements OnInit, AfterViewInit {
 
   officeName = new FormControl();
   officeData: any;
-  filteredOfficeData: any
+  filteredOfficeData: any;
 
   loanProduct = new FormControl();
   loanProductData: any;
@@ -37,6 +37,7 @@ export class ViewProvisioningEntryComponent implements OnInit, AfterViewInit {
   filteredProvisioningCategoryData: any;
 
   constructor(private route: ActivatedRoute,
+              private router: Router,
               private accountingService: AccountingService) { }
 
   ngOnInit() {
@@ -84,9 +85,9 @@ export class ViewProvisioningEntryComponent implements OnInit, AfterViewInit {
   }
 
   filterPredicate(data: any, filterValue: any) {
-    return data.officeName.toLowerCase().indexOf(filterValue['officeName']) != -1
-      && data.productName.toLowerCase().indexOf(filterValue['productName']) != -1
-      && data.categoryName.toLowerCase().indexOf(filterValue['categoryName']) != -1;
+    return data.officeName.toLowerCase().indexOf(filterValue['officeName']) !== -1
+      && data.productName.toLowerCase().indexOf(filterValue['productName']) !== -1
+      && data.categoryName.toLowerCase().indexOf(filterValue['categoryName']) !== -1;
   }
 
    applyFilter(filterValue: string, property: string) {
@@ -159,4 +160,11 @@ export class ViewProvisioningEntryComponent implements OnInit, AfterViewInit {
     return provisioningCategoryData.filter((provisioningCategory: any) => provisioningCategory.categoryName.toLowerCase().includes(provisioningCategoryName.toLocaleLowerCase()));
   }
 
+  createProvisioningJournalEntries() {
+    this.accountingService.createProvisioningJournalEntries(this.provisioningEntryId)
+      .subscribe((response: any) => {
+        this.router.navigate(['/accounting/provisioning-entries/journal-entries/view', response.resourceId]);
+      });
+  }
+
 }

src/app/accounting/provisioning-entries/view-provisioning-journal-entries/view-provisioning-journal-entries.component.html

@@ -0,0 +1,72 @@
+<div class="container">
+
+  <div fxLayout="row" fxLayoutGap="20px">
+    <mat-form-field fxFlex>
+      <input matInput (keyup)="applyFilter($event.target.value)" placeholder="Filter">
+    </mat-form-field>
+  </div>
+
+  <div class="mat-elevation-z8">
+
+    <table mat-table [dataSource]="dataSource" matSort>
+
+      <ng-container matColumnDef="id">
+        <th mat-header-cell *matHeaderCellDef mat-sort-header> Entry ID </th>
+        <td mat-cell *matCellDef="let provisioningJournalEntry"> {{ provisioningJournalEntry.id }} </td>
+      </ng-container>
+
+      <ng-container matColumnDef="officeName">
+        <th mat-header-cell *matHeaderCellDef mat-sort-header> Office </th>
+        <td mat-cell *matCellDef="let provisioningJournalEntry"> {{ provisioningJournalEntry.officeName }} </td>
+      </ng-container>
+
+      <ng-container matColumnDef="transactionDate">
+        <th mat-header-cell *matHeaderCellDef mat-sort-header> Transaction Date </th>
+        <td mat-cell *matCellDef="let provisioningJournalEntry"> {{ provisioningJournalEntry.transactionDate }} </td>
+      </ng-container>
+
+      <ng-container matColumnDef="transactionId">
+        <th mat-header-cell *matHeaderCellDef mat-sort-header> Transaction ID </th>
+        <td mat-cell *matCellDef="let provisioningJournalEntry"> {{ provisioningJournalEntry.transactionId }} </td>
+      </ng-container>
+
+      <ng-container matColumnDef="glAccountType">
+        <th mat-header-cell *matHeaderCellDef mat-sort-header> Type </th>
+        <td mat-cell *matCellDef="let provisioningJournalEntry"> {{ provisioningJournalEntry.glAccountType.value }} </td>
+      </ng-container>
+
+      <ng-container matColumnDef="createdByUserName">
+        <th mat-header-cell *matHeaderCellDef mat-sort-header> Type </th>
+        <td mat-cell *matCellDef="let provisioningJournalEntry"> {{ provisioningJournalEntry.createdByUserName }} </td>
+      </ng-container>
+
+      <ng-container matColumnDef="glAccountCode">
+        <th mat-header-cell *matHeaderCellDef mat-sort-header> Account Code </th>
+        <td mat-cell *matCellDef="let provisioningJournalEntry"> {{ provisioningJournalEntry.glAccountCode }} </td>
+      </ng-container>
+
+      <ng-container matColumnDef="glAccountName">
+        <th mat-header-cell *matHeaderCellDef mat-sort-header> Account Name </th>
+        <td mat-cell *matCellDef="let provisioningJournalEntry"> {{ provisioningJournalEntry.glAccountName }} </td>
+      </ng-container>
+
+      <ng-container matColumnDef="debit">
+        <th mat-header-cell *matHeaderCellDef mat-sort-header> Debit </th>
+        <td mat-cell *matCellDef="let provisioningJournalEntry"><span *ngIf="provisioningJournalEntry.entryType.value === 'DEBIT'"> {{ (provisioningJournalEntry.currency.displaySymbol || provisioningJournalEntry.currency.code) + ' ' + provisioningJournalEntry.amount }} </span></td>
+      </ng-container>
+
+      <ng-container matColumnDef="credit">
+        <th mat-header-cell *matHeaderCellDef mat-sort-header> Credit </th>
+        <td mat-cell *matCellDef="let provisioningJournalEntry"><span *ngIf="provisioningJournalEntry.entryType.value === 'CREDIT'"> {{ (provisioningJournalEntry.currency.displaySymbol || provisioningJournalEntry.currency.code) + ' ' + provisioningJournalEntry.amount }} </span></td>
+      </ng-container>
+
+      <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
+      <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
+
+    </table>
+
+    <mat-paginator [pageSizeOptions]="[10, 25, 50, 100]" showFirstLastButtons></mat-paginator>
+
+  </div>
+
+</div>

src/app/accounting/provisioning-entries/view-provisioning-journal-entries/view-provisioning-journal-entries.component.scss

@@ -0,0 +1,3 @@
+table {
+  width: 100%;
+}

src/app/accounting/provisioning-entries/view-provisioning-journal-entries/view-provisioning-journal-entries.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ViewProvisioningJournalEntriesComponent } from './view-provisioning-journal-entries.component';
+
+describe('ViewProvisioningJournalEntriesComponent', () => {
+  let component: ViewProvisioningJournalEntriesComponent;
+  let fixture: ComponentFixture<ViewProvisioningJournalEntriesComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ ViewProvisioningJournalEntriesComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ViewProvisioningJournalEntriesComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/accounting/provisioning-entries/view-provisioning-journal-entries/view-provisioning-journal-entries.component.ts

@@ -0,0 +1,51 @@
+import { Component, OnInit, ViewChild } from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
+import { MatPaginator, MatSort, MatTableDataSource } from '@angular/material';
+
+import { AccountingService } from '../../accounting.service';
+
+@Component({
+  selector: 'mifosx-view-provisioning-journal-entries',
+  templateUrl: './view-provisioning-journal-entries.component.html',
+  styleUrls: ['./view-provisioning-journal-entries.component.scss']
+})
+export class ViewProvisioningJournalEntriesComponent implements OnInit {
+
+  provisioningEntryId: string;
+
+  displayedColumns: string[] = ['id', 'officeName', 'transactionDate', 'transactionId', 'glAccountType', 'createdByUserName', 'glAccountCode', 'glAccountName', 'debit', 'credit'];
+  dataSource: any;
+
+  @ViewChild(MatPaginator) paginator: MatPaginator;
+  @ViewChild(MatSort) sort: MatSort;
+
+  constructor(private route: ActivatedRoute,
+              private accountingService: AccountingService) { }
+
+  ngOnInit() {
+    this.provisioningEntryId = this.route.snapshot.paramMap.get('id');
+    this.getProvisioningJournalEntry();
+  }
+
+  getProvisioningJournalEntry() {
+    this.accountingService.getProvisioningJournalEntries(this.provisioningEntryId)
+      .subscribe((provisioningJournalEntryData: any) => {
+        this.dataSource = new MatTableDataSource(provisioningJournalEntryData.pageItems);
+        this.dataSource.paginator = this.paginator;
+        this.dataSource.sortingDataAccessor = (transaction: any, property: any) => {
+          switch (property) {
+            case 'glAccountType': return transaction.glAccountType.value;
+            case 'debit': return transaction.amount;
+            case 'credit': return transaction.amount;
+            default: return transaction[property];
+          }
+        };
+        this.dataSource.sort = this.sort;
+      });
+  }
+
+  applyFilter(filterValue: string) {
+    this.dataSource.filter = filterValue.trim().toLowerCase();
+  }
+
+}