/* 
        Chỉ cho người dùng nhập số Input Number
        -: 69
        e: 189
        +: 43
         var charCode = keyEvent.which ? keyEvent.which : keyEvent.keyCode;
        var isNotNumber = charCode < 48 || charCode > 57;
        var isNotArrow = charCode < 37 || charCode > 40;
        var isNotBackspace = charCode !== 8;
        https://stackoverflow.com/questions/5535449/javascript-keycode-allow-number-and-plus-symbol-only
    */
    markAsDirtyContractForm(form: FormGroup) {
        const recursiveFunc = (formGroup: FormGroup) => {
            Object.keys(formGroup.controls).forEach(field => {
            const control = formGroup.get(field);
            form.controls[field].markAsTouched();
            form.controls[field].markAsDirty();
            form.controls[field].updateValueAndValidity({ emitEvent: false });
            if (control instanceof FormGroup) {
                recursiveFunc(control);
            }
            });
        };
        recursiveFunc(form);
    }

   /*
   html input number + validate
   */
    <mat-form-field class="vcs-form-field vcs-number-input md my-2" appearance="standard">
        <input matInput type="number" min="0" autocomplete="off" formControlName="value_cmt" (blur)="checkValueCmt($event)" 
        (keydown)="validateService.isKeyCorrect($event)" />
        
        <mat-error class="vcs-mat-error" *ngIf="validateService.isControlHasError(slaItemForm, 'value_cmt','required')">
            <mat-icon svgIcon="vcs-alert-diamond-filled-24" class="vcs-icon-16"></mat-icon>
            <span>Bạn phải nhập giá trị cam kết</span>
        </mat-error>
        <mat-error class="vcs-mat-error" *ngIf="validateService.isControlHasError(slaItemForm, 'value_cmt','max')">
            <mat-icon svgIcon="vcs-alert-diamond-filled-24" class="vcs-icon-16"></mat-icon>
            <span>Nhập giá trị nhỏ hơn {{validateService.VALUE_CMT_MAX | number }} </span>
        </mat-error>
        <mat-error class="vcs-mat-error" *ngIf="validateService.isControlHasError(slaItemForm, 'value_cmt','pattern')">
            <mat-icon svgIcon="vcs-alert-diamond-filled-24" class="vcs-icon-16"></mat-icon>
            <span>Bạn phải nhập đúng định dạng số</span>
        </mat-error>
    </mat-form-field>

   /*
     checkValueCmt: khi Input number lost focus => check giá trị number, nếu vượt quá giá trị thì lấy giá trị max
   */

  checkValueCmt($event) {
    this.slaItemForm.patchValue({
      value_cmt: this.validateService.replaceNumber(this.slaItemForm.getRawValue()['value_cmt'], this.validateService.VALUE_CMT_MAX)
    });
  }

    replaceNumber(valueCmtReplace, max){
        if(valueCmtReplace !== null && valueCmtReplace !== undefined){
          if( ['.', ','].includes(valueCmtReplace[valueCmtReplace.length-1]) ){
            valueCmtReplace = valueCmtReplace.slice(0, valueCmtReplace.length-1);
          }
          valueCmtReplace = valueCmtReplace.toString();
          valueCmtReplace = valueCmtReplace.replace( '+', '');
          valueCmtReplace = valueCmtReplace.replace( '-', '');
          if(max !== null && max !== undefined && Number(valueCmtReplace) > max){
            valueCmtReplace = max;
          }
        } else {
            return null;
        }
        return Number(valueCmtReplace);
    }


    /* 
        Chỉ cho người dùng nhập số vào Input Number
        -: 69
        e: 189
        +: 43
         var charCode = keyEvent.which ? keyEvent.which : keyEvent.keyCode;
        var isNotNumber = charCode < 48 || charCode > 57;
        var isNotArrow = charCode < 37 || charCode > 40;
        var isNotBackspace = charCode !== 8;
        https://stackoverflow.com/questions/5535449/javascript-keycode-allow-number-and-plus-symbol-only
    */

    isKeyCorrect(keyEvent) {
        let charCode = keyEvent?.which ? keyEvent?.which : keyEvent?.keyCode;
        let isNumber = (charCode >= 48 && charCode <= 57) || (charCode >= 96 && charCode <= 105);
        let isNotE = charCode !== 189;
        let isArrow = charCode >= 37 && charCode <= 40;
        let isBackspace = charCode == 8;
        let isDot = [190, 110].includes(charCode);
        return ( isNumber || isArrow || isBackspace || isDot ) && isNotE ;
    }


   /*
     Debounce time => check trùng tên
   */

  this.slaPackageForm = this.fb.group({
        name: [
        null,
        Validators.compose([
            Validators.pattern(this.validateService.vietnameseUnicodeCharactersRegex)
        ]),
        this.validatePackageNameFromAPIDebounce.bind(this),
        ]
  });

  validatePackageNameFromAPIDebounce(control: AbstractControl): Observable<ValidationErrors | null> {
    this.appProcessing.updateProcessingState(true);
    return timer(500).pipe(
      switchMap(() => {
        return this.slaPackageService.SLAsPostSearch({ name: control.value }).pipe(
          map((res: any) => {
            this.appProcessing.updateProcessingState(false);
            /**
             * filter by name
            */
            let itemDuplicateName = res.data.filter(slaPackage => slaPackage.name == control.value);
            if (this.data && this.data['slaPackage']) {
              /**
              * filter by _id of currrent SLA
              */
              itemDuplicateName = itemDuplicateName.filter(item => item._id !== this.data.slaPackage['_id'])
            }

            if (itemDuplicateName && itemDuplicateName.length > 0) {
              return { nameDuplicated: true }
            } else {
              return null;
            }

          })
        )
      }
      )
    );
  }