fin input vcn

src/app/app.module.ts

@@ -30,6 +30,7 @@ import { LoginComponent } from "./components/login/login.component";
 import { TokenInterceptor } from "@app/services/token.interceptor";
 import { MatPasswordStrengthModule } from "@angular-material-extensions/password-strength";
 
+
 @NgModule({
   declarations: [AppComponent, AdminComponent, LoginComponent],
   imports: [

src/app/components/investments/costs/vcn/vcn.costs.component.html

@@ -48,9 +48,6 @@
                         </div>
                       </div>
 
-
-
-
                       
                       <div class="col-lg-3 col-md-4 col-sm-6">
                         <h4>Valor transado:</h4>
@@ -255,9 +252,11 @@
                                 <i class="fas fa-dollar-sign"></i>
                               </p>
                               <input
-                                type="number"
+                                type="text" 
                                 formControlName="costo_cedeval"
+                                [value]="group.get('costo_cedeval').value | numberPipe" 
                                 class="form-control"
+                                (input)="inputValidator($event)"
                               />
                             </div>
                           </div>
@@ -275,11 +274,13 @@
                                 <i class="fas fa-dollar-sign"></i>
                               </p>
                               <input
-                                type="number"
+                                type="text"
+                               
                                 formControlName="costo_transferencia"
-
-                         
+                                [value]="group.get('costo_transferencia').value | numberPipe" 
                                 class="form-control"
+                                (input)="inputValidator($event)"
+                               
                               />
                               
                             </div>
@@ -296,9 +297,11 @@
                                 <i class="fas fa-dollar-sign"></i>
                               </p>
                               <input
-                                type="number"
+                                type="text" 
                                 formControlName="costo_banco"
+                                [value]="group.get('costo_banco').value | numberPipe" 
                                 class="form-control"
+                                (input)="inputValidator($event)"
                               />
                             </div>
                           </div>
@@ -315,9 +318,11 @@
                                 <i class="fas fa-dollar-sign"></i>
                               </p>
                               <input
-                                type="number"
+                                type="text" 
                                 formControlName="otros_costos"
+                                [value]="group.get('otros_costos').value | numberPipe" 
                                 class="form-control"
+                                (input)="inputValidator($event)"
                               />
                             </div>
                           </div>

src/app/components/investments/costs/vcn/vcn.costs.component.ts

@@ -28,7 +28,8 @@ import {
 })
 export class VCNCostsComponent implements OnInit {
   helper = new JwtHelperService();
-
+  price:string;
+  value:any;
   title: string = "Costos para valores comerciales";
 
   displayedColumns: string[] = [
@@ -229,9 +230,47 @@ export class VCNCostsComponent implements OnInit {
       Swal.close();
     }, 1200);
   }
+  clearProyeccion(proyecciones,nombres,tipoDato){
+   let clearPro = []  
+
+    proyecciones.forEach(createNewProyeccion); 
+  
+   function createNewProyeccion(arrFila, index) {
+    nombres.forEach(loopNombres);
+   
+    function loopNombres(nombre, index) {
+
+      arrFila[nombre] = parseFloat(arrFila[nombre].toString().replace(",",""))        
+      } 
+      clearPro.push(arrFila)
+      
+    } 
+
+  return clearPro;
+  }
+
+  public inputValidator(event: any) {
+    //console.log(event.target.value);
+    const pattern = /^[0-9]*$/;   
+    //let inputChar = String.fromCharCode(event.charCode)
+    
+    if (!pattern.test(event.target.value)) {
+
+      event.target.value = event.target.value.replace(/[^\d,.]+/g, '');
+      // invalid character, prevent input
+
+    }
+    
+  }
 
   recalculateProjectionChanges() {
-    let objProjection = { proyecciones: this.form.value };
+    let nombresProyecciones = ["costo_transferencia",
+                                "costo_cedeval",
+                                "costo_banco",
+                                "otros_costos"]
+    let clearPro = this.clearProyeccion(this.form.value,nombresProyecciones,"decimal")
+    let objProjection = { proyecciones: clearPro };
+    
     Swal.fire({
       allowOutsideClick: false,
       icon: "info",
@@ -253,6 +292,7 @@ export class VCNCostsComponent implements OnInit {
           this.proyecciones.pop();
           this.form.clear();
           this.form = new FormArray(this.buildForm(this.proyecciones));
+
           Swal.close();
           //window.location.reload();
         },
@@ -265,7 +305,7 @@ export class VCNCostsComponent implements OnInit {
         }
       );
   }
-
+ 
   saveProjection() {
     let objProjection = { proyecciones: this.form.value };
     Swal.fire({

src/app/components/investments/extras/convert.dec.pipe.ts

@@ -0,0 +1,35 @@
+import { Pipe, PipeTransform } from '@angular/core';
+
+@Pipe({
+  name: 'numberPipe'
+})
+export class NumberPipePipe implements PipeTransform {
+
+  transform(val) {
+    if(val){
+
+    val = this.format_number(val.toString(), '');
+    }
+    return val;
+  }
+
+  format_number(number, prefix) {
+    let thousand_separator = ',',
+      decimal_separator = '.',
+      regex = new RegExp('[^' + decimal_separator + '\\d]', 'g'),
+      number_string = number.replace(regex, '').toString(),
+      split = number_string.split(decimal_separator),
+      rest = split[0].length % 3,
+      result = split[0].substr(0, rest),
+      thousands = split[0].substr(rest).match(/\d{3}/g);
+
+    if (thousands) {
+      let separator = rest ? thousand_separator : '';
+      result += separator + thousands.join(thousand_separator);
+    }
+    result = split[1] != undefined ? result + decimal_separator + split[1] : result;
+
+    return prefix == undefined ? result : (result ? prefix + result : '');
+  };
+
+}

src/app/layouts/admin/admin.module.ts

@@ -62,6 +62,7 @@ import { InvestmentProposalDetailComponent } from "@app/components/investment-pr
 import { InvestmentProposalApproveComponent } from "@app/components/investment-proposals/approve/approve.component";
 import { DAPCostsComponent } from "@app/components/investments/costs/dap/dap.costs.component";
 import { VCNCostsComponent } from "@app/components/investments/costs/vcn/vcn.costs.component";
+import { NumberPipePipe } from "@app/components/investments/extras/convert.dec.pipe";
 import { PBURCostsComponent } from "@app/components/investments/costs/pbur/pbur.costs.component";
 import { IncomesComponent } from "@app/components/incomes/incomes.component";
 
@@ -162,7 +163,8 @@ import { PEMP } from "@app/components/instruments/pemp/pemp.component";
     GeneralIncomeFormComponent,
     PaymentApprovalComponent,
     UploadLiquidationComponent,
-    InvestmentPrint
+    InvestmentPrint,
+    NumberPipePipe
   ],
   entryComponents: [
     LETE,