feat: collateral module

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

@@ -48,6 +48,7 @@ import { ClientActionsResolver } from './common-resolvers/client-actions.resolve
 import { ClientChargeViewResolver } from './common-resolvers/client-charge-view.resolver';
 import { ClientTransactionPayResolver } from './common-resolvers/client-transaction-pay.resolver';
 import { ClientDataAndTemplateResolver } from './common-resolvers/client-and-template.resolver';
+import { ClientCollateralResolver } from './common-resolvers/client-collateral.resolver';
 
 const routes: Routes = [
   Route.withShell([{
@@ -83,7 +84,8 @@ const routes: Routes = [
             data: { title: extract('General'), breadcrumb: 'General', routeParamBreadcrumb: false },
             resolve: {
               clientAccountsData: ClientAccountsResolver,
-              clientChargesData: ClientChargesResolver
+              clientChargesData: ClientChargesResolver,
+              clientCollateralData: ClientCollateralResolver
             }
           },
           {
@@ -234,6 +236,10 @@ const routes: Routes = [
             path: 'loans-accounts',
             loadChildren: () => import('../loans/loans.module').then(m => m.LoansModule)
           },
+          {
+            path: 'client-collateral',
+            loadChildren: () => import('../collaterals/collaterals.module').then(m => m.CollateralsModule)
+          },
           {
             path: 'fixed-deposits-accounts',
             loadChildren: () => import('../deposits/fixed-deposits/fixed-deposits.module').then(m => m.FixedDepositsModule)
@@ -285,7 +291,8 @@ const routes: Routes = [
     ClientActionsResolver,
     ClientChargeViewResolver,
     ClientTransactionPayResolver,
-    ClientDataAndTemplateResolver
+    ClientDataAndTemplateResolver,
+    ClientCollateralResolver
   ]
 })
 export class ClientsRoutingModule { }

src/app/clients/clients-view/client-actions/add-client-collateral/add-client-collateral.component.html

@@ -0,0 +1,82 @@
+<div class="container">
+
+    <mat-card>
+
+        <form [formGroup]="clientCollateralForm" (ngSubmit)="submit()">
+
+            <mat-card-content>
+
+                <div fxLayout="column">
+                    <mat-form-field>
+                        <mat-label>Collateral</mat-label>
+                        <mat-select required formControlName="collateralId">
+                            <mat-option *ngFor="let clientCollateral of clientCollateralOptions" [value]="clientCollateral.id">
+                                {{ clientCollateral.name }}
+                            </mat-option>
+                        </mat-select>
+                        <mat-error *ngIf="clientCollateralForm.controls.collateralId.hasError('required')">
+                            Collateral is <strong>required</strong>
+                        </mat-error>
+                    </mat-form-field>
+                    
+                    <div *ngIf="collateralDetails" fxLayout="column">
+
+                        <mat-form-field>
+                            <mat-label>Name</mat-label>
+                            <input matInput required formControlName="name">
+                        </mat-form-field>
+
+                        <mat-form-field>
+                            <mat-label>Type/Quality</mat-label>
+                            <input matInput required formControlName="quality">
+                        </mat-form-field>
+
+                        <mat-form-field>
+                            <mat-label>Unit Type</mat-label>
+                            <input matInput required formControlName="unitType">
+                        </mat-form-field>
+
+                        <mat-form-field>
+                            <mat-label>Base Price</mat-label>
+                            <input matInput required formControlName="basePrice">
+                        </mat-form-field>
+
+                        <mat-form-field>
+                            <mat-label>Percentage To Base</mat-label>
+                            <input matInput required formControlName="pctToBase">
+                        </mat-form-field>
+
+                        <mat-form-field>
+                            <mat-label>Quantity</mat-label>
+                            <input matInput required formControlName="quantity">
+                            <mat-error *ngIf="clientCollateralForm.controls.quantity.hasError('required')">
+                                Quantity is <strong>required</strong>
+                            </mat-error>
+                        </mat-form-field>
+
+                        <mat-form-field>
+                            <mat-label>Total</mat-label>
+                            <input matInput required formControlName="totalValue">
+                        </mat-form-field>
+
+                        <mat-form-field>
+                            <mat-label>Total Collateral Value</mat-label>
+                            <input matInput required formControlName="totalCollateralValue">
+                        </mat-form-field>
+
+                    </div>
+
+                </div>
+
+            </mat-card-content>
+
+            <mat-card-actions fxLayoutGap="5px" fxLayout="row" fsLayout.xs="column" fxLayoutAlign="center">
+                <button type="button" mat-raised-button [routerLink]="['../../']">Cancel</button>
+                <button mat-raised-button color="primary" [disabled]="!clientCollateralForm.valid">Submit</button> 
+            </mat-card-actions>
+
+        </form>
+    
+    </mat-card>
+
+</div>

src/app/clients/clients-view/client-actions/add-client-collateral/add-client-collateral.component.scss

@@ -0,0 +1,4 @@
+.container {
+    width: 37rem;
+  }
+  

src/app/clients/clients-view/client-actions/add-client-collateral/add-client-collateral.component.spec.ts

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

src/app/clients/clients-view/client-actions/add-client-collateral/add-client-collateral.component.ts

@@ -0,0 +1,115 @@
+/** Angular Imports */
+import { Component, OnInit } from '@angular/core';
+import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { ActivatedRoute, Router } from '@angular/router';
+
+/**
+ * Custom Services
+ */
+import { ClientsService } from 'app/clients/clients.service';
+import { ProductsService } from 'app/products/products.service';
+import { SettingsService } from 'app/settings/settings.service';
+
+@Component({
+  selector: 'mifosx-add-client-collateral',
+  templateUrl: './add-client-collateral.component.html',
+  styleUrls: ['./add-client-collateral.component.scss']
+})
+export class AddClientCollateralComponent implements OnInit {
+
+  /** Client Collateral Form */
+  clientCollateralForm: FormGroup;
+  /** Client Collateral Options */
+  clientCollateralOptions: any;
+  /** Client Id */
+  clientId: any;
+  /** Collateral Details */
+  collateralDetails: any;
+
+  /**
+   * Retirives Collateral Form from `resolve`
+   * @param {FormBuilder} formBuilder Form bUilder.
+   * @param {ActivatedRoute} route Activated Route.
+   * @param {Router} router Router.
+   * @param {ProductsService} productsService Products Service
+   */
+  constructor(
+    private formBuilder: FormBuilder,
+    private route: ActivatedRoute,
+    private router: Router,
+    private productsService: ProductsService,
+    private clientsService: ClientsService,
+    private settingsService: SettingsService,
+    ) {
+      this.route.data.subscribe((data: { clientActionData: any }) => {
+        this.clientCollateralOptions = data.clientActionData;
+        console.log(this.clientCollateralOptions);
+      });
+      this.clientId = this.route.parent.snapshot.params['clientId'];
+    }
+
+  ngOnInit(): void {
+    this.createClientCollateralForm();
+    this.buildDependencies();
+  }
+
+  /**
+   * Subscribe to Form controls value changes
+   */
+  buildDependencies() {
+    this.clientCollateralForm.controls.collateralId.valueChanges.subscribe(collateralId => {
+      this.productsService.getCollateral(collateralId).subscribe((data: any) => {
+        this.collateralDetails = data;
+        console.log(data);
+        this.clientCollateralForm.patchValue({
+          'name': data.name,
+          'quality': data.quality,
+          'unitType': data.unitType,
+          'basePrice': this.collateralDetails.basePrice,
+          'pctToBase': this.collateralDetails.pctToBase,
+        });
+      });
+    });
+    this.clientCollateralForm.controls.quantity.valueChanges.subscribe((quantity: any) => {
+      this.clientCollateralForm.patchValue({
+        'totalValue': this.collateralDetails.basePrice * quantity,
+        'totalCollateralValue': this.collateralDetails.basePrice * this.collateralDetails.pctToBase * quantity / 100
+      });
+    });
+  }
+
+  /**
+   * Creates the Clients Collaterals Form
+   */
+  createClientCollateralForm() {
+    this.clientCollateralForm = this.formBuilder.group({
+      'collateralId': [ '', Validators.required ],
+      'quantity': [ '', Validators.required ],
+      'name': [{ value: '', disabled: true }],
+      'quality': [{value: '', disabled: true}],
+      'unitType': [{value: '', disabled: true}],
+      'basePrice': [{value: '', disabled: true}],
+      'pctToBase': [{value: '', disabled: true}],
+      'totalValue': [{value: '', disabled: true}],
+      'totalCollateralValue': [{value: '', disabled: true}],
+    });
+  }
+
+  /**
+   * Submits Client Collateral
+   */
+  submit() {
+    const collateralId = this.clientCollateralForm.value.collateralId;
+    const quantity = this.clientCollateralForm.value.quantity;
+    const locale = this.settingsService.language.code;
+    const clientCollateral = {
+      collateralId,
+      quantity,
+      locale
+    };
+    this.clientsService.createClientCollateral(this.clientId, clientCollateral).subscribe(() => {
+      this.router.navigate(['../../'], {relativeTo: this.route});
+    });
+  }
+
+}

src/app/clients/clients-view/client-actions/client-actions.component.html

@@ -15,3 +15,4 @@
 <mifosx-take-survey *ngIf="actions['Take Survey']"></mifosx-take-survey>
 <mifosx-client-screen-reports *ngIf="actions['Client Screen Reports']"></mifosx-client-screen-reports>
 <mifosx-create-self-service-user *ngIf="actions['Create Self Service User']"></mifosx-create-self-service-user>
+<mifosx-add-client-collateral *ngIf="actions['Create Collateral']"></mifosx-add-client-collateral>

src/app/clients/clients-view/client-actions/client-actions.component.ts

@@ -29,7 +29,8 @@ export class ClientActionsComponent {
     'Add Charge': boolean
     'Take Survey': boolean
     'Client Screen Reports': boolean,
-    'Create Self Service User': boolean
+    'Create Self Service User': boolean,
+    'Create Collateral': boolean
   } = {
     'Assign Staff': false,
     'Close': false,
@@ -46,7 +47,8 @@ export class ClientActionsComponent {
     'Add Charge': false,
     'Take Survey': false,
     'Client Screen Reports': false,
-    'Create Self Service User': false
+    'Create Self Service User': false,
+    'Create Collateral': false
   };
 
   /**

src/app/clients/clients-view/clients-view.component.html

@@ -97,6 +97,7 @@
       <button mat-raised-button [matMenuTriggerFor]="More">More</button>
       <mat-menu #More="matMenu">
         <button mat-menu-item (click)="doAction('Add Charge')" *mifosxHasPermission="'CREATE_CLIENTCHARGE'"> Add Charge </button>
+        <button mat-menu-item (click)="doAction('Create Collateral')">Create Collateral</button>
         <button mat-menu-item (click)="doAction('Survey')">Survey</button>
         <button mat-menu-item (click)="doAction('Update Default Savings')" *mifosxHasPermission="'UPDATESAVINGSACCOUNT_CLIENT'"> Update Default Savings </button>
         <button mat-menu-item (click)="doAction('Upload Signature')" *mifosxHasPermission="'CREATE_CLIENTIMAGE'"> Upload Signature </button>

src/app/clients/clients-view/clients-view.component.ts

@@ -72,6 +72,7 @@ export class ClientsViewComponent implements OnInit {
       case 'Reactivate':
       case 'Undo Rejection':
       case 'Add Charge':
+      case 'Create Collateral':
       case 'Create Self Service User':
       case 'Client Screen Reports':
         this.router.navigate([`actions/${name}`], { relativeTo: this.route });

src/app/clients/clients-view/general-tab/general-tab.component.html

@@ -600,4 +600,53 @@
 
   </table>
 
+  <!-- Collateral Data Table -->
+  <div class="heading-content">
+    <div fxLayout="column" fxFlex="50%">
+      <div class="heading-name">
+        <h3>Collateral Data</h3>
+      </div>
+    </div>
+    <div fxLayout="column" fxFlex="50%">
+      <div fxLayout="row" fxLayoutAlign="flex-end">
+        <button mat-raised-button class="f-right" color="primary" disabled>
+          View Collaterals
+        </button>
+      </div>
+    </div>
+  </div>
+
+  <table mat-table [dataSource]="collaterals">
+    
+    <ng-container matColumnDef="ID">
+      <th mat-header-cell *matHeaderCellDef>ID</th>
+      <td mat-cell *matCellDef="let element">{{ element.collateralId }}</td>
+    </ng-container>
+
+    <ng-container matColumnDef="Name">
+      <th mat-header-cell *matHeaderCellDef>Name</th>
+      <td mat-cell *matCellDef="let element">{{ element.name }}</td>
+    </ng-container>
+
+    <ng-container matColumnDef="Quantity">
+      <th mat-header-cell *matHeaderCellDef>Quantity</th>
+      <td mat-cell *matCellDef="let element">{{ element.quantity }}</td>
+    </ng-container>
+
+    <ng-container matColumnDef="Total Value">
+      <th mat-header-cell *matHeaderCellDef>Total Value</th>
+      <td mat-cell *matCellDef="let element">{{ element.basePrice*element.quantity }}</td>
+    </ng-container>
+
+    <ng-container matColumnDef="Total Collateral Value">
+      <th mat-header-cell *matHeaderCellDef>Total Collateral Value</th>
+      <td mat-cell *matCellDef="let element">{{ element.pctToBase*element.basePrice*element.quantity/100 }}</td>
+    </ng-container>
+
+    <tr mat-header-row *matHeaderRowDef="collateralsColumns"></tr>
+    <tr mat-row *matRowDef="let row; columns: collateralsColumns;"
+      [routerLink]="['../', 'client-collateral', row.collateralId]"></tr>
+
+  </table>
+
 </div>

src/app/clients/clients-view/general-tab/general-tab.component.ts

@@ -29,6 +29,8 @@ export class GeneralTabComponent {
   closedSharesColumns: string[] = ['Account No', 'Share Account', 'Approved Shares', 'Pending For Approval Shares', 'Closed Date'];
   /** Upcoming Charges Columns */
   upcomingChargesColumns: string[] = ['Name', 'Due as of', 'Due', 'Paid', 'Waived', 'Outstanding', 'Actions'];
+  /** Collaterals Column */
+  collateralsColumns: string[] = ['ID', 'Name', 'Quantity', 'Total Value', 'Total Collateral Value'];
 
   /** Client Account Data */
   clientAccountData: any;
@@ -42,6 +44,8 @@ export class GeneralTabComponent {
   upcomingCharges: any;
   /** Client Summary Data */
   clientSummary: any;
+  /** Collaterals Data */
+  collaterals: any;
 
   /** Show Closed Loan Accounts */
   showClosedLoanAccounts = false;
@@ -67,12 +71,13 @@ export class GeneralTabComponent {
     private clientService: ClientsService,
     private router: Router
   ) {
-    this.route.data.subscribe((data: { clientAccountsData: any, clientChargesData: any, clientSummary: any }) => {
+    this.route.data.subscribe((data: { clientAccountsData: any, clientChargesData: any, clientSummary: any, clientCollateralData: any }) => {
       this.clientAccountData = data.clientAccountsData;
       this.savingAccounts = data.clientAccountsData.savingsAccounts;
       this.loanAccounts = data.clientAccountsData.loanAccounts;
       this.shareAccounts = data.clientAccountsData.shareAccounts;
       this.upcomingCharges = data.clientChargesData.pageItems;
+      this.collaterals = data.clientCollateralData;
       this.clientSummary = data.clientSummary ? data.clientSummary[0] : [];
       this.clientid = this.route.parent.snapshot.params['clientId'];
   });

src/app/clients/clients.module.ts

@@ -57,6 +57,7 @@ import { ClientAddressStepComponent } from './client-stepper/client-address-step
 import { ClientFamilyMemberDialogComponent } from './client-stepper/client-family-members-step/client-family-member-dialog/client-family-member-dialog.component';
 import { CaptureImageDialogComponent } from './clients-view/custom-dialogs/capture-image-dialog/capture-image-dialog.component';
 import { CreateSelfServiceUserComponent } from './clients-view/client-actions/create-self-service-user/create-self-service-user.component';
+import { AddClientCollateralComponent } from './clients-view/client-actions/add-client-collateral/add-client-collateral.component';
 
 
 /**
@@ -120,7 +121,8 @@ import { CreateSelfServiceUserComponent } from './clients-view/client-actions/cr
     ClientAddressStepComponent,
     ClientFamilyMemberDialogComponent,
     CaptureImageDialogComponent,
-    CreateSelfServiceUserComponent
+    CreateSelfServiceUserComponent,
+    AddClientCollateralComponent
   ],
   providers: [ ]
 

src/app/clients/clients.service.ts

@@ -363,4 +363,18 @@ export class ClientsService {
     return this.http.post(`/users`, userData);
   }
 
+  /**
+   * @param clientId Client ID.
+   * @param collateralData Collateral Data
+   */
+  createClientCollateral(clientId: any, collateralData: any) {
+    return this.http.post(`/clients/${clientId}/collaterals`, collateralData);
+  }
+
+  /**
+   * @param clientId Client ID.
+   */
+  getCollateralTemplate(clientId: any) {
+    return this.http.get(`/clients/${clientId}/collaterals/template`);
+  }
 }

src/app/clients/common-resolvers/client-actions.resolver.ts

@@ -7,6 +7,7 @@ import { Observable } from 'rxjs';
 
 /** Custom Services */
 import { ClientsService } from '../clients.service';
+import { ProductsService } from 'app/products/products.service';
 
 /**
  * Client Actions data resolver.
@@ -16,8 +17,10 @@ export class ClientActionsResolver implements Resolve<Object> {
 
   /**
    * @param {ClientsService} clientsService Clients service.
+   * @param {ProductsService} productsService Products Service
    */
-  constructor(private clientsService: ClientsService) { }
+  constructor(private clientsService: ClientsService,
+    private productsService: ProductsService) { }
 
   /**
    * Returns the clients actions data.
@@ -42,6 +45,8 @@ export class ClientActionsResolver implements Resolve<Object> {
         return this.clientsService.getOffices();
       case 'Add Charge':
         return this.clientsService.getClientChargeTemplate(clientId);
+      case 'Create Collateral':
+        return this.productsService.getCollaterals();
       case 'Client Screen Reports':
         return this.clientsService.getClientReportTemplates();
       case 'Assign Staff':

src/app/clients/common-resolvers/client-collateral.resolver.ts

@@ -0,0 +1,31 @@
+/** Angular Imports */
+import { Injectable } from '@angular/core';
+import { Resolve, ActivatedRouteSnapshot } from '@angular/router';
+
+/** rxjs Imports */
+import { Observable } from 'rxjs';
+
+/** Custom Services */
+import { ClientsService } from '../clients.service';
+
+/**
+ * Client Charges data resolver.
+ */
+@Injectable()
+export class ClientCollateralResolver implements Resolve<Object> {
+
+    /**
+     * @param {ClientsService} clientsService Clients service.
+     */
+    constructor(private clientsService: ClientsService) { }
+
+    /**
+     * Returns the Client Collateral data.
+     * @returns {Observable<any>}
+     */
+    resolve(route: ActivatedRouteSnapshot): Observable<any> {
+        const clientId = route.parent.paramMap.get('clientId');
+        return this.clientsService.getCollateralTemplate(clientId);
+    }
+
+}