Fixing the issue FINCN-101:Group Definition Minimum and Maximum Numbers should not be decimals

Author: kengneruphine

package.json

@@ -13,8 +13,8 @@
     "karma": "karma start ./karma.conf.js --single-run",
     "devTest": "ng test",
     "dev": "ng serve --watch --verbose --proxy-config proxy.conf.json",
-    "runProd": "ng serve --proxy-config proxy.conf.json --prod",
-    "build": "ng build --prod",
+    "runProd": "ng serve --proxy-config proxy.conf.json --environment=prod",
+    "build": "ng build --environment=prod",
     "checkLicenses": "license-to-fail ./license.config.js",
     "bundle-report": "webpack-bundle-analyzer dist/stats.json"
   },

src/app/common/common.module.ts

@@ -65,6 +65,7 @@ import {DateInputComponent} from './date-input/date-input.component';
 import {TextInputComponent} from './text-input/text-input.component';
 import {DisplayFimsNumber} from './number/fims-number.pipe';
 import {DisplayFimsFinancialNumber} from './number/fims-financial-number.pipe';
+import {NumberGroupInputComponent} from './number-group-input/number-group-input.component'
 
 @NgModule({
   imports: [
@@ -120,7 +121,8 @@ import {DisplayFimsFinancialNumber} from './number/fims-financial-number.pipe';
     FimsFabButtonComponent,
     DisplayFimsDate,
     DisplayFimsNumber,
-    DisplayFimsFinancialNumber
+    DisplayFimsFinancialNumber,
+    NumberGroupInputComponent
   ],
   exports: [
     LayoutCardOverComponent,
@@ -151,7 +153,8 @@ import {DisplayFimsFinancialNumber} from './number/fims-financial-number.pipe';
     FimsFabButtonComponent,
     DisplayFimsDate,
     DisplayFimsNumber,
-    DisplayFimsFinancialNumber
+    DisplayFimsFinancialNumber,
+    NumberGroupInputComponent
   ],
   entryComponents: [
     ImageComponent

src/app/common/number-group-input/number-group-input.component.html

@@ -0,0 +1,39 @@
+<!--
+  Licensed to the Apache Software Foundation (ASF) under one or more
+  contributor license agreements.  See the NOTICE file distributed with
+  this work for additional information regarding copyright ownership.
+  The ASF licenses this file to You under the Apache License, Version 2.0
+  (the "License"); you may not use this file except in compliance with
+  the License.  You may obtain a copy of the License at
+
+       http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+-->
+
+<mat-form-field layout-margin flex [formGroup]="form">
+    <input matInput type="text" [textMask]="{mask: mask}" [placeholder]="placeholder" [formControlName]="controlName"/>
+    <mat-error *ngIf="hasRequiredError" translate>
+      Required
+    </mat-error>
+    <mat-error *ngIf="hasMinValueError" translate>
+      {{ 'Value must be greater than or equal to' | translate:{value: form.get(controlName).errors.minValue.value} }}
+    </mat-error>
+    <mat-error *ngIf="hasMaxValueError" translate>
+      {{ 'Value must be smaller than or equal to' | translate:{value: form.get(controlName).errors.maxValue.value} }}
+    </mat-error>
+    <mat-error *ngIf="hasGreaterThanValueError" translate>
+      {{ 'Value must be greater than' | translate:{value: form.get(controlName).errors.greaterThanValue.value} }}
+    </mat-error>
+    <mat-error *ngIf="hasScaleError">
+      {{ 'Must have decimal places' | translate:{value: form.get(controlName).errors.scale.value} }}
+    </mat-error>
+    <mat-hint align="end" *ngIf="form.get(controlName).enabled">
+      {{hint}}
+    </mat-hint>
+  </mat-form-field>
+  

src/app/common/number-group-input/number-group-input.component.ts

@@ -0,0 +1,78 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import {Component, Input} from '@angular/core';
+import {FormGroup} from '@angular/forms';
+import {createNumberMask} from 'text-mask-addons/dist/textMaskAddons';
+
+@Component({
+  selector: 'fims-number-group-input',
+  templateUrl: './number-group-input.component.html'
+})
+export class NumberGroupInputComponent {
+
+  @Input() placeholder;
+
+  @Input() controlName: string;
+
+  @Input() form: FormGroup;
+
+  @Input() requireDecimal = false;
+
+  @Input() decimalLimit = 2;
+
+  @Input() hint: string;
+
+  mask: any;
+
+  constructor() {
+    this.mask = createNumberMask({
+      prefix: '',
+      suffix: '',
+      includeThousandsSeparator: false,
+      requireDecimal: this.requireDecimal,
+      allowNegative: false,
+      allowLeadingZeroes: true,
+      decimalLimit: this.decimalLimit
+    });
+  }
+
+  get hasRequiredError(): boolean {
+    return this.hasError('required');
+  }
+
+  get hasMinValueError(): boolean {
+    return this.hasError('minValue');
+  }
+
+  get hasGreaterThanValueError(): boolean {
+    return this.hasError('greaterThanValue');
+  }
+
+  get hasMaxValueError(): boolean {
+    return this.hasError('maxValue');
+  }
+
+  get hasScaleError(): boolean {
+    return this.hasError('maxScale');
+  }
+
+  hasError(key: string): boolean {
+    return this.form.get(this.controlName).hasError(key);
+  }
+}

src/app/common/number-input/number-input.component.ts

@@ -32,7 +32,7 @@ export class NumberInputComponent {
 
   @Input() form: FormGroup;
 
-  @Input() requireDecimal = false;
+  @Input() requireDecimal = true;
 
   @Input() decimalLimit = 2;
 

src/app/groups/definition/form/form.component.html

@@ -19,8 +19,8 @@
     <td-step #detailsStep label="{{'Group Definition details' | translate}}" [state]="form.valid ? 'complete' : form.pristine ? 'none' : 'required'">
         <form [formGroup]="form" layout="column">
             <fims-id-input flex [form]="form" controlName="identifier" [readonly]="editMode"></fims-id-input>
-            <fims-number-input [form]="form" placeholder="Minimal Size"  controlName="minimal"></fims-number-input>
-            <fims-number-input [form]="form" placeholder="Maximal Size" controlName="maximal"></fims-number-input>
+            <fims-number-group-input [form]="form" placeholder="Minimal Size"  controlName="minimal"></fims-number-group-input>
+            <fims-number-group-input [form]="form" placeholder="Maximal Size" controlName="maximal"></fims-number-group-input>
             <mat-form-field layout-margin flex>
                 <textarea matInput placeholder="{{'Description' | translate}}" formControlName="description"></textarea>
                 <mat-error *ngIf="form.get('description').hasError('required')" translate>
@@ -30,7 +30,7 @@
 
             <h4 translate> Cycle details </h4>
 
-            <fims-number-input [form]="form" controlName="number" placeholder="{{'Number of meeting' | translate}}"></fims-number-input>
+            <fims-number-group-input [form]="form" controlName="number" placeholder="{{'Number of meeting' | translate}}"></fims-number-group-input>
             <mat-form-field layout-margin>
                 <mat-select formControlName="frequency" placeholder="{{ 'Frequency' | translate }}">
                     <mat-option *ngFor="let frequency of frequencyOptions" [value]="frequency.type">

src/app/groups/detail/signOffMeeting/signOff-meeting.component.html

@@ -20,9 +20,9 @@
   <td-steps mode="'vertical'">
     <td-step #detailsStep  [state]="form.valid ? 'complete' : form.pristine ? 'none' : 'required'">
       <form [formGroup]="form" layout="column">
-        <fims-number-input [form]="form" placeholder="Meeting Sequence" controlName="sequence"></fims-number-input>
-        <fims-number-input [form]="form" placeholder="Current Cycle" controlName="cycle"></fims-number-input>
-        <fims-number-input [form]="form" controlName="duration" placeholder="Duration"></fims-number-input>
+        <fims-number-group-input [form]="form" placeholder="Meeting Sequence" controlName="sequence"></fims-number-group-input>
+        <fims-number-group-input [form]="form" placeholder="Current Cycle" controlName="cycle"></fims-number-group-input>
+        <fims-number-group-input [form]="form" controlName="duration" placeholder="Duration"></fims-number-group-input>
         <h3> Attendance </h3>
         <div layout="row">
           <table td-data-table>

src/app/quickAccess/quick-access.component.html

@@ -80,7 +80,7 @@
       </mat-card>
     </div>
   </div>
-
+<!--
   <div layout="column" layout-gt-sm="row" class="inset">
       <div flex-gt-sm="40">
         <mat-card>
@@ -98,6 +98,7 @@
       </div>
     </div>
 
+  -->
   <div layout="column" layout-gt-sm="row" class="inset">
     <div flex-gt-sm="40" *hasPermission="{ id: 'identity_roles', accessLevel: 'READ'}">
       <mat-card>