Share Product and Share Account views updated

src/app/shares/shares-account-stepper/shares-account-charges-step/shares-account-charges-step.component.html

@@ -28,7 +28,7 @@
     <ng-container matColumnDef="chargeCalculationType">
       <th mat-header-cell *matHeaderCellDef> {{'labels.inputs.Type' | translate}} </th>
       <td mat-cell *matCellDef="let charge">
-        {{ charge.chargeCalculationType.value }}
+        {{ charge.chargeCalculationType.value | translateCatalog }}
       </td>
     </ng-container>
 
@@ -45,7 +45,7 @@
     <ng-container matColumnDef="chargeTimeType">
       <th mat-header-cell *matHeaderCellDef> {{'labels.inputs.Collected On' | translate}} </th>
       <td mat-cell *matCellDef="let charge">
-        {{ charge.chargeTimeType.value }}
+        {{ charge.chargeTimeType.value | translateCatalog }}
       </td>
     </ng-container>
 

src/app/shares/shares-account-stepper/shares-account-charges-step/shares-account-charges-step.component.ts

@@ -10,6 +10,7 @@ import { FormDialogComponent } from 'app/shared/form-dialog/form-dialog.componen
 /** Custom Models */
 import { FormfieldBase } from 'app/shared/form-dialog/formfield/model/formfield-base';
 import { InputBase } from 'app/shared/form-dialog/formfield/model/input-base';
+import { TranslateService } from '@ngx-translate/core';
 
 /**
  * Shares Account Charges Step
@@ -42,7 +43,8 @@ export class SharesAccountChargesStepComponent implements OnInit, OnChanges {
   /**
    * @param {MatDialog} dialog Mat Dialog
    */
-  constructor(public dialog: MatDialog) { }
+  constructor(private dialog: MatDialog,
+      private translateService: TranslateService) { }
 
   ngOnInit() {
     this.currencyCode.valueChanges.subscribe(() => {
@@ -80,15 +82,15 @@ export class SharesAccountChargesStepComponent implements OnInit, OnChanges {
     const formfields: FormfieldBase[] = [
       new InputBase({
         controlName: 'amount',
-        label: 'Amount',
+        label: this.translateService.instant('labels.inputs.Amount'),
         value: charge.amount || charge.amountOrPercentage,
         type: 'number',
         required: false,
       }),
     ];
     const data = {
-      title: 'Edit Charge',
-      layout: { addButtonText: 'Confirm' },
+      title: this.translateService.instant('labels.heading.Edit Charge'),
+      layout: { addButtonText: 'Submit' },
       formfields: formfields
     };
     const editNoteDialogRef = this.dialog.open(FormDialogComponent, { data });

src/app/shares/shares-account-stepper/shares-account-preview-step/shares-account-preview-step.component.html

@@ -33,24 +33,19 @@
     <span fxFlex="60%">{{ sharesAccountTermsForm.get('currencyCode').value | find:[sharesAccountProductTemplate.currency]:'code':'displayLabel' }}</span>
   </div>
 
-  <div fxFlexFill>
-    <span fxFlex="40%">{{'labels.inputs.Decimal Places' | translate}}</span>
-    <span fxFlex="60%">{{ sharesAccountTermsForm.get('decimal').value }}</span>
-  </div>
-
   <div fxFlexFill>
     <span fxFlex="40%">{{'labels.inputs.Total Number of Shares' | translate}}</span>
-    <span fxFlex="60%">{{ sharesAccount.requestedShares }}</span>
+    <span fxFlex="60%">{{ sharesAccount.requestedShares | formatNumber }}</span>
   </div>
 
   <div fxFlexFill>
-    <span fxFlex="40%">{{'labels.inputs.Today's Price' | translate}}</span>
-    <span fxFlex="60%">{{ sharesAccountTermsForm.get('unitPrice').value }}</span>
+    <span fxFlex="40%">{{'labels.inputs.Current Price' | translate}}</span>
+    <span fxFlex="60%">{{ sharesAccountTermsForm.get('unitPrice').value | formatNumber }}</span>
   </div>
 
   <div fxFlexFill>
-    <span fxFlex="40%">{{'labels.inputs.Currency in multiples of' | translate}}</span>
-    <span fxFlex="60%">{{ sharesAccountTermsForm.get('currencyMultiple').value }}</span>
+    <span fxFlex="40%">{{'labels.inputs.Amount' | translate}}</span>
+    <span fxFlex="60%">{{ (sharesAccount.requestedShares * sharesAccountTermsForm.get('unitPrice').value) | formatNumber }}</span>
   </div>
 
   <div fxFlexFill>
@@ -60,12 +55,12 @@
 
   <div fxFlexFill *ngIf="sharesAccount.minimumActivePeriod">
     <span fxFlex="40%">{{'labels.inputs.Minimum Active Period' | translate}}</span>
-    <span fxFlex="60%">{{sharesAccount.minimumActivePeriod}}&nbsp;{{sharesAccount.minimumActivePeriodFrequencyType | find:sharesAccountProductTemplate.minimumActivePeriodFrequencyTypeOptions:'id':'value'}}</span>
+    <span fxFlex="60%">{{sharesAccount.minimumActivePeriod}}&nbsp;{{sharesAccount.minimumActivePeriodFrequencyType | find:sharesAccountProductTemplate.minimumActivePeriodFrequencyTypeOptions:'id':'value' | translateCatalog}}</span>
   </div>
 
   <div fxFlexFill *ngIf="sharesAccount.lockinPeriodFrequency">
     <span fxFlex="40%">{{'labels.inputs.Lock-in Period' | translate}}</span>
-    <span fxFlex="60%">{{sharesAccount.lockinPeriodFrequency}}&nbsp;{{sharesAccount.lockinPeriodFrequencyType | find:sharesAccountProductTemplate.lockinPeriodFrequencyTypeOptions:'id':'value'}}</span>
+    <span fxFlex="60%">{{sharesAccount.lockinPeriodFrequency}}&nbsp;{{sharesAccount.lockinPeriodFrequencyType | find:sharesAccountProductTemplate.lockinPeriodFrequencyTypeOptions:'id':'value' | translateCatalog}}</span>
   </div>
 
   <div fxFlexFill>
@@ -75,7 +70,7 @@
 
   <div fxFlexFill>
     <span fxFlex="40%">{{'labels.inputs.Allow dividends for inactive clients' | translate}}</span>
-    <span fxFlex="60%">{{ sharesAccount.allowDividendCalculationForInactiveClients }}</span>
+    <span fxFlex="60%">{{ sharesAccount.allowDividendCalculationForInactiveClients | yesNo }}</span>
   </div>
 
   <div fxFlexFill *ngIf="sharesAccount.charges.length" fxLayout="row wrap" fxLayout.lt-md="column">
@@ -96,7 +91,7 @@
       <ng-container matColumnDef="chargeCalculationType">
         <th mat-header-cell *matHeaderCellDef> {{'labels.inputs.Type' | translate}} </th>
         <td mat-cell *matCellDef="let charge">
-          {{ charge.chargeCalculationType.value }}
+          {{ charge.chargeCalculationType.value | translateCatalog }}
         </td>
       </ng-container>
 
@@ -110,7 +105,7 @@
       <ng-container matColumnDef="chargeTimeType">
         <th mat-header-cell *matHeaderCellDef> {{'labels.inputs.Collected On' | translate}} </th>
         <td mat-cell *matCellDef="let charge">
-          {{ charge.chargeTimeType.value }}
+          {{ charge.chargeTimeType.value | translateCatalog }}
         </td>
       </ng-container>
 

src/app/shares/shares-account-stepper/shares-account-terms-step/shares-account-terms-step.component.html

@@ -8,8 +8,8 @@
     </mat-form-field>
 
     <mat-form-field fxFlex="48%">
-      <mat-label>{{'labels.inputs.Decimal Places' | translate}}</mat-label>
-      <input type="number" matInput formControlName="decimal">
+      <mat-label>{{"labels.inputs.Current Price" | translate}}</mat-label>
+      <input type="number" matInput formControlName="unitPrice">
     </mat-form-field>
 
     <mat-form-field fxFlex="48%">
@@ -19,22 +19,13 @@
         {{'labels.inputs.Total Number of Shares' | translate}} {{"labels.commons.is" | translate}} <strong>{{"labels.commons.required" | translate}}</strong>
       </mat-error>
     </mat-form-field>
-
-    <mat-form-field fxFlex="48%">
-      <mat-label>{{"labels.inputs.Today's Price" | translate}}</mat-label>
-      <input type="number" matInput formControlName="unitPrice">
-    </mat-form-field>
-
-    <mat-form-field fxFlex="48%">
-      <mat-label>{{'labels.inputs.Currency in multiples of' | translate}}</mat-label>
-      <input type="number" matInput formControlName="currencyMultiple" >
-    </mat-form-field>
+    <span fxFlex="48%" *ngIf="currency">{{ calculateCurrenValue() | currency:currency.code:'symbol-narrow':'1.2-2' }}</span>
 
     <mat-form-field fxFlex="48%">
       <mat-label>{{'labels.inputs.Default Savings Account' | translate}}</mat-label>
       <mat-select formControlName="savingsAccountId" required>
         <mat-option *ngFor="let account of savingsAccountsData" [value]="account.id">
-          {{ account.accountNo }}
+          {{ account.accountNo }} - {{ account.savingsProductName }}
         </mat-option>
       </mat-select>
       <mat-error>
@@ -68,7 +59,7 @@
       <mat-label>{{'labels.inputs.Type' | translate}}</mat-label>
       <mat-select formControlName="minimumActivePeriodFrequencyType">
         <mat-option *ngFor="let minimumActivePeriodFrequencyType of minimumActivePeriodFrequencyTypeData" [value]="minimumActivePeriodFrequencyType.id">
-          {{ minimumActivePeriodFrequencyType.value }}
+          {{ minimumActivePeriodFrequencyType.value | translateCatalog }}
         </mat-option>
       </mat-select>
     </mat-form-field>
@@ -84,7 +75,7 @@
       <mat-label>{{'labels.inputs.Type' | translate}}</mat-label>
       <mat-select formControlName="lockinPeriodFrequencyType">
         <mat-option *ngFor="let lockinPeriodFrequencyType of lockinPeriodFrequencyTypeData" [value]="lockinPeriodFrequencyType.id">
-          {{ lockinPeriodFrequencyType.value }}
+          {{ lockinPeriodFrequencyType.value | translateCatalog }}
         </mat-option>
       </mat-select>
     </mat-form-field>

src/app/shares/shares-account-stepper/shares-account-terms-step/shares-account-terms-step.component.ts

@@ -2,6 +2,7 @@
 import { Component, OnChanges, OnInit, Input } from '@angular/core';
 import { UntypedFormGroup, UntypedFormBuilder, Validators } from '@angular/forms';
 import { SettingsService } from 'app/settings/settings.service';
+import { Currency } from 'app/shared/models/general.model';
 
 /**
  * Shares Account Terms Step
@@ -33,6 +34,8 @@ export class SharesAccountTermsStepComponent implements OnChanges, OnInit {
   /** For Edit Shares Account Form */
   isSavingsPatched = false;
 
+  currency: Currency | null = null;
+
   /**
    * @param {FormBuilder} formBuilder Form Builder
    * @param {SettingsService} settingsService Settings Service
@@ -44,6 +47,7 @@ export class SharesAccountTermsStepComponent implements OnChanges, OnInit {
 
   ngOnChanges() {
     if (this.sharesAccountProductTemplate) {
+      this.currency = this.sharesAccountProductTemplate.currency;
       this.sharesAccountTermsForm.patchValue({
         'currencyCode': this.sharesAccountProductTemplate.currency.code,
         'decimal': this.sharesAccountProductTemplate.currency.decimalPlaces,
@@ -112,4 +116,11 @@ export class SharesAccountTermsStepComponent implements OnChanges, OnInit {
     return this.sharesAccountTermsForm.value;
   }
 
+  calculateCurrenValue(): number {
+    if (this.sharesAccountTermsForm.value.requestedShares && this.sharesAccountProductTemplate.currentMarketPrice) {
+      return this.sharesAccountProductTemplate.currentMarketPrice * this.sharesAccountTermsForm.value.requestedShares;
+    }
+    return 0;
+  }
+
 }