Use of Decimals to Display user setting to format numbers (#1695)

Co-authored-by: Jose Alberto Hernandez <alberto@MacBook-Pro.local>

src/app/settings/settings.component.html

@@ -15,21 +15,6 @@
 
       <div fxLayout="column">
 
-        <mat-form-field>
-          <mat-label>Name of the Organization</mat-label>
-          <input matInput>
-        </mat-form-field>
-
-        <mat-form-field>
-          <mat-label>Description</mat-label>
-          <textarea matInput></textarea>
-        </mat-form-field>
-
-        <mat-form-field>
-          <mat-label>Summary</mat-label>
-          <textarea matInput></textarea>
-        </mat-form-field>
-
         <mat-form-field>
           <mat-label>Default Language</mat-label>
           <mat-select [formControl]="language" [compareWith]="compareOptions">
@@ -48,6 +33,15 @@
           </mat-select>
         </mat-form-field>
 
+        <mat-form-field>
+          <mat-label>Decimals to Display</mat-label>
+          <mat-select [formControl]="decimalsToDisplay">
+            <mat-option *ngFor="let decimalOpt of decimals" [value]="decimalOpt">
+              {{ decimalOpt }}
+            </mat-option>
+          </mat-select>
+        </mat-form-field>
+
       </div>
 
     </mat-expansion-panel>

src/app/settings/settings.component.ts

@@ -34,6 +34,18 @@ export class SettingsComponent implements OnInit {
     'MM-dd-yy',
     'yyyy-MM-dd'
   ];
+    /** Decimals. */
+    decimals: string[] = [
+      '0',
+      '1',
+      '2',
+      '3',
+      '4',
+      '5',
+      '6',
+      '7',
+      '8',
+   ];
   /** Placeholder for fonts. */
   fonts: any;
 
@@ -41,6 +53,8 @@ export class SettingsComponent implements OnInit {
   language = new FormControl('');
   /** Date Format Setting */
   dateFormat =  new FormControl('');
+  /** Decimals to Display Setting */
+  decimalsToDisplay =  new FormControl('');
 
   /**
    * @param {SettingsService} settingsService Settings Service
@@ -50,6 +64,7 @@ export class SettingsComponent implements OnInit {
   ngOnInit() {
     this.language.patchValue(this.settingsService.language);
     this.dateFormat.patchValue(this.settingsService.dateFormat);
+    this.decimalsToDisplay.patchValue(this.settingsService.decimals);
     this.buildDependencies();
   }
 
@@ -63,6 +78,9 @@ export class SettingsComponent implements OnInit {
     this.dateFormat.valueChanges.subscribe((dateFormat: string) => {
       this.settingsService.setDateFormat(dateFormat);
     });
+    this.decimalsToDisplay.valueChanges.subscribe((decimals: string) => {
+      this.settingsService.setDecimalToDisplay(decimals);
+    });
   }
 
   /**

src/app/settings/settings.service.ts

@@ -40,6 +40,14 @@ export class SettingsService {
     localStorage.setItem('mifosXLanguage', JSON.stringify(language));
   }
 
+  /**
+   * Sets decimals to Display throughout the app.
+   * @param {string} decimals.
+   */
+  setDecimalToDisplay(decimals: string) {
+    localStorage.setItem('mifosXDecimalsToDisplay', decimals);
+  }
+
   setDefaultLanguage() {
     const defaultLanguage = environment.defaultLanguage ? environment.defaultLanguage : 'en-US';
     this.setLanguage({
@@ -113,6 +121,16 @@ export class SettingsService {
     return JSON.parse(localStorage.getItem('mifosXLanguage'));
   }
 
+  /**
+   * Returns Decimals to Display setting
+   */
+  get decimals() {
+    if (!localStorage.getItem('mifosXDecimalsToDisplay')) {
+      return '2';
+    }
+    return localStorage.getItem('mifosXDecimalsToDisplay');
+  }
+
   /**
    * Returns list of default server
    */