import { Component, EventEmitter, Input, OnInit } from '@angular/core';
import { FormGroup, FormBuilder, Validators } from '@angular/forms';
import { BsModalRef, BsModalService } from 'ngx-bootstrap';
import { ToastrService } from 'ngx-toastr';
import { LocationCodeService } from '../../../services/location.code.service';
import { AuthenticationService } from '../../../services/authentication.service';
import { DeleteUserComponent } from './delete-user/delete-user.component';

@Component({
  selector: 'app-create-user',
  templateUrl: './create-user.component.html',
  styleUrls: ['./create-user.component.css']
})
export class CreateUserComponent implements OnInit {
  userForm: FormGroup;
  locations: any;
  deleteUserRef: BsModalRef;
  @Input() title;
  @Input() customerPage;
  public event: EventEmitter<any> = new EventEmitter();
  
  constructor(
    public bsModalRef: BsModalRef,
    private authenticationService:AuthenticationService,
    private locationCodeService: LocationCodeService,
    private toastr: ToastrService,
    private fb: FormBuilder,
    private modalService:BsModalService){

    this.locationCodeService.getAllLocation_Codes().subscribe(
      locationCodes => {
        // tslint:disable-next-line: no-string-literal
        this.locations = locationCodes['data'] as any[];
        for (const item of this.locations) {
          item.location_name = item.location_name + '--' + item.location_state;
        }
      });
  }

  ngOnInit(): void{
    this.userForm = this.fb.group({
      sso: ['', { validators: [Validators.required, Validators.pattern("^[0-9]*$")] }],
      customer_name: [''],
      email: ['', [Validators.email, Validators.pattern('^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,4}$')]],
      customer_password: ['', Validators.required],
      confirm_password: ['', [Validators.required, Validators.minLength(6)]],
      opening_balance: ['', Validators.pattern("^[0-9]*$")],
      wallet_value: ['', Validators.pattern("^[0-9]*$")],
      customer_location: [''],
      is_admin: [false],
      isappadmin: [false]
    },{
      validator: this.mustMatch('confirm_password', 'customer_password' )
    });
  }

  mustMatch(controlName: string, matchingControlName: string) {
    return (formGroup: FormGroup) => {
        const control = formGroup.controls[controlName];
        const matchingControl = formGroup.controls[matchingControlName];

        if (matchingControl.errors && !matchingControl.errors.mustMatch) {
            // return if another validator has already found an error on the matchingControl
            return;
        }

        // set error on matchingControl if validation fails
        if (control.value !== matchingControl.value) {
            matchingControl.setErrors({ mustMatch: true });
        } else {
            matchingControl.setErrors(null);
        }
    }
  }

  /*
  @usage: called on blur of user sso feild
  @purpose: to check the sso is already exsits or not.
  */
  async checkDuplicateName() {
    if (this.userForm.get('sso').value) {
      let userExist, userSSO = this.userForm.get('sso').value;
      if(userSSO.length===9){
        // Duplicate user name check
        const body = await this.authenticationService.isValidSSO(userSSO);
        userExist = body['data'] as boolean;
      }
      if (userExist) {
        this.userForm.get('sso').setValue('');
      }
    }
  }

  removeValidators() {
    this.userForm.get('customer_password').clearValidators();
    this.userForm.get('customer_password').updateValueAndValidity();
    this.userForm.get('confirm_password').clearValidators();
    this.userForm.get('confirm_password').updateValueAndValidity();
  }

  setValidators() {
    this.userForm.get('customer_password').setValidators(Validators.required);
    this.userForm.get('customer_password').updateValueAndValidity();
    this.userForm.get('confirm_password').setValidators(Validators.required);
    this.userForm.get('confirm_password').updateValueAndValidity();
  }

  deleteUser(){
    this.deleteUserRef = this.modalService.show(DeleteUserComponent);
    this.deleteUserRef.content.event.subscribe(modelResult => {
      if(modelResult && this.customerPage){
        this.event.emit(true);
      }
    });
  }

  async onSubmit(){
    if (this.userForm.get('customer_password').value === '' || this.userForm.get('confirm_password').value === '') {
      this.userForm.controls['customer_password'].markAllAsTouched();
      this.userForm.controls['confirm_password'].markAllAsTouched();
    }
    if (this.userForm.valid){
      this.userForm.value.exisiting_customer = false;
      this.userForm.value.created_date = new Date();
      this.userForm.value.ispremium = false;
      this.authenticationService.addCustomerProfile(this.userForm.value).subscribe((creationResult: { status: string, message: string, data }) => {
        if (creationResult.status === "success" && creationResult.data) {
            this.toastr.success("User created successfully!");
            if(this.customerPage)
              this.event.emit(true);
        }
      }, (error) => {
        this.toastr.error("User Creation failed. Please try again!");
      });
      this.bsModalRef.hide();
    }else {
      this.userForm.controls['sso'].markAsTouched();
      this.userForm.controls['customer_password'].markAsTouched();
      this.userForm.controls['confirm_password'].markAsTouched();
    }
  }

  get sso() { return this.userForm.get('sso') }
  get customer_name() { return this.userForm.get('customer_name') }
  get email() { return this.userForm.get('email') }
  get customer_password() { return this.userForm.get('customer_password') }
  get confirm_password() { return this.userForm.get('confirm_password') }
  get opening_balance() { return this.userForm.get('opening_balance') }
  get wallet_value() { return this.userForm.get('wallet_value') }
  get created_date() { return this.userForm.get('created_date') }
  get customer_location() { return this.userForm.get('customer_location') }
  get is_admin() { return this.userForm.get('is_admin') }
  get isappadmin() { return this.userForm.get('isappadmin') }
}