import { isPlatformBrowser } from '@angular/common';
import { Component, Inject, OnInit, PLATFORM_ID } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { Meta, Title } from '@angular/platform-browser';
import { ActivatedRoute } from '@angular/router';
declare let $: any;
// import firebase from 'firebase/compat/app';
import 'firebase/compat/auth'
import 'firebase/compat/firestore'
import { NgxSpinnerService } from 'ngx-spinner';
import { ToastrService } from 'ngx-toastr';
import { Cities } from '../../entities/cities';
import { EmploymentType } from '../../entities/employmenttype';
import { Leads } from '../../entities/leads';
import { CommonService } from '../../shared/services/common/common.service';
import { GlobalService } from '../../shared/services/common/global.service';
import { LinkService } from '../../shared/services/link.service';
import { LeadService } from '../../shared/services/loanService/lead.service';
import { environment } from '../../../../environments/environment';
import Swal from 'sweetalert2';
import { DocumentMasters } from '../../entities/documentMasters';

@Component({
  selector: 'app-instant-loan',
  templateUrl: './instant-loan.component.html',
  styleUrls: ['./instant-loan.component.scss']
})

export class InstantLoanComponent implements OnInit {
  // public isVerifyOtp: boolean = true;
  // //public isShow: boolean = true;
  // public isPersonalDetailForm: boolean = false;
  // public mobileNo: number = 0;
  // public isOtpInput: boolean = false;
  // public selectedType: string = '';
  // public interest_rate: number
  // public payment: string = "0.00";
  // public months: number = 0;
  // public interest: string = "0.00";
  // public amountPayable: string = "0.00";
  // public displayAmount: string = "0.00";
  // public test: any;
  // public amount: number = 0;
  // public contactForm: FormGroup;
  // public basicDetailForm: FormGroup;
  // public reCaptchaVerifier: any;
  // public otp: any;
  // public verify: any;
  // public cities: Cities[] = new Array<Cities>();
  // public isAgreed: boolean = false;
  // public agreedmsg: string = '';
  // public selectedTab: string = "Overview"
  // // public cities: any = [
  // //   {
  // //     name: "Bardoli"
  // //   },
  // //   {
  // //     name: "Surat"
  // //   },
  // //   {
  // //     name: "Kamrej"
  // //   },
  // //   {
  // //     name: "Ahmedabad"
  // //   }

  // // ];
  // public selectedCity: any :any = [] :any = [];
  // public serviceId: number = 0;
  // public leads = new Leads();
  // public faqs = [
  //   {
  //     que: "First, how much EMI can I obtain on a 5-lakh loan?",
  //     ans: "Banks' EMIs for a Rs.5 lakh loan vary from one to the next, and they are based on the loan's term and interest rate. For example, if you take out a loan of Rs.5 lakh for a year at a ten percent interest rate, you would pay Rs.43, 958 in interest.",
  //     isCollapsed: false
  //   },
  //   {
  //     que: "How Much Is The Monthly Payment On An Instant Loan Of 3 Lakhs?",
  //     ans: "The EMI for a given instant personal loan approval online in {city} varies from one bank to the next because of the wide range of variables, including the term and interest rate. For example, if you take out a loan of Rs.3 lakh for a year at a ten percent interest rate, you would pay Rs.26, 375 in EMIs.",
  //     isCollapsed: true
  //   },
  //   {
  //     que: "For a 20 lakh Instant loan, what is the monthly installment?",
  //     ans: "For instance, a five-year loan for Rs.20 lakh with a 10 percent interest rate would have an EMI of Rs42, 494 if taken out. The EMI payments will vary from bank to bank, therefore it's critical that you thoroughly research Instant loan plans before deciding on the best one for your needs.",
  //     isCollapsed: true
  //   },
  // ];
  // public city: string = "";
  // public _title: string = '';

  public leads = new Leads();
  public basicDetailForm: FormGroup;
  public selectedCity: any;
  public cities: Cities[]  = [];
  public serviceId: number = 0;
  public selectedEmployeeType: string = '';
  public employmentTypes: EmploymentType[] = new Array<EmploymentType>();
  public city: string = "";
  public _title: string = '';
  public payment: string = "0.00";
  public interest: string = "0.00";
  public amountPayable: string = "0.00";
  public displayAmount: string = "0.00";
  public test: any
  public emiCalculatorForm: FormGroup;
  public documentMasters: DocumentMasters[] = new Array<DocumentMasters>();
  public customFieldForm!: FormGroup;

  constructor(private formBuilder: FormBuilder,
    private commonService: CommonService,
    private toastrService: ToastrService,
    private leadService: LeadService,
    private globalService: GlobalService,
    private meta: Meta,
    private title: Title,
    private route: ActivatedRoute,
    @Inject(PLATFORM_ID) public platformId: object,
    private spinnerService: NgxSpinnerService,
    private linkService: LinkService
  ) {
    this.linkService.createLinkForCanonicalURL();
    let sub = this.route.params.subscribe(async (params) => {
      this.city = params['city'] ? params['city'] : '';
      if (this.city) {
        if (isPlatformBrowser(this.platformId))
          sessionStorage.setItem("selectedCity", this.city);
      }
    });

    this._title = `Avail instant loan at low interest in ` + this.city + ` like never before and manage all emergencies.`
    this.route.snapshot.data['title'] = this._title;
    this.title.setTitle(this.route.snapshot.data['title']);
    this.meta.updateTag({
      name: 'description', content: `Resolve all your queries about how to get instant loan in ` + this.city + `. With a complete digital process, you can get instant personal loan approval online, and get instant loan online directly in your bank account at low interest.`
    });
    this.meta.updateTag({
      name: 'author', content: `Credit`
    });
    this.meta.updateTag({
      name: 'og:locale', property: "og:locale", content: `en_US`
    });
    this.meta.updateTag({
      name: 'og:title', property: "og:title", content: `Avail instant loan at low interest in ` + this.city + ` like never before and manage all emergencies.`
    });
    this.meta.updateTag({
      name: 'og:description', property: "og:description", content: `Resolve all your queries about how to get instant loan in ` + this.city + `. With a complete digital process, you can get instant personal loan approval online, and get instant loan online directly in your bank account at low interest.`
    });
    this.meta.updateTag({
      name: 'og:url', property: "og:url", content: `https://credit.nsserver.in`
    });
    this.meta.updateTag({
      name: 'og:site_name', property: "og:site_name", content: `Credit`
    });
    this.meta.updateTag({
      name: 'og:type', property: "og:type", content: `Website`
    });
    this.meta.updateTag({
      name: 'og:image', property: "og:image", content: `https://credit.nsserver.in/assets/img/logo/logo.webp`
    });
    this.meta.updateTag({
      'http-equiv': "X-UA-Compatible", content: "IE=edge"
    });
    this.meta.updateTag({
      name: 'copyright', content: `Copyright 2022, Credit`
    });
    this.meta.updateTag({
      name: 'robots', content: `index, follow`
    });
    this.meta.updateTag({
      name: 'Googlebot', content: `Index, Follow`
    });
    this.meta.updateTag({
      name: 'rating', content: `Safe For Kids`
    });
    this.meta.updateTag({
      name: 'tweeter:card', content: `compare & apply for business loan`
    });
    this.meta.updateTag({
      name: 'tweeter:title', content: `compare & apply for business loan`
    });
    this.meta.updateTag({
      name: 'tweeter:description', content: `Resolve all your queries about how to get instant loan in ` + this.city + `. With a complete digital process, you can get instant personal loan approval online, and get instant loan online directly in your bank account at low interest.`
    });
    this.meta.updateTag({
      name: 'tweeter:site', content: `Credit`
    });
    this.meta.updateTag({
      name: 'tweeter:image', content: `https://credit.nsserver.in/assets/img/logo/logo.webp`
    });

    this.basicDetailForm = formBuilder.group({
      'contactNo': [null, [Validators.required, Validators.minLength(10)]],
      'loanAmount': [null, [Validators.required]],
      'customerFullName': [null, [Validators.required]],
      'pincode': [null, [Validators.required, Validators.minLength(6)]],
      'cityName': [null, [Validators.required]],
      'employmentTypeId': [null, [Validators.required]],
      'income': [null, [Validators.required]],
      // 'panCardNo': [null, [Validators.required, Validators.pattern('[A-Z]{5}[0-9]{4}[A-Z]{1}')]],
    })
    this.emiCalculatorForm = formBuilder.group({
      'amount': [null, [Validators.required]],
      'interest_rate': [null, [Validators.required]],
      'months': [null, [Validators.required]],
    })
  }

  async ngOnInit() {
    //firebase.initializeApp(environment.firebase)
    //setTimeout(() => {
    //  this.isShow = false;
    //}, 1000);

    // this.cities = await this.commonService.getCitites();
    this.serviceId = this.commonService.getServiceId("Instant Loan");
    // console.log(this.serviceId);
    // this.selectedCity = [...this.cities];
    await this.getEmploymentType();
    await this.getDocumentMaster();
    if (this.documentMasters && this.documentMasters.length > 0) {
      this.customFieldForm = this.formBuilder.group({})
      for (let index = 0; index < this.documentMasters.length; index++) {
        if (this.documentMasters[index].allowDocumentField) {
          this.customFieldForm.addControl(this.documentMasters[index].documentFieldName, this.formBuilder.control(''));
        }
      }
    }
  }

  public async getDocumentMaster() {
    try {
      let res = await this.globalService.getDocumentMaster();
      if (res && res.status == 200) {
        this.documentMasters = res.recordList;
      }
    } catch (error: any) {
      this.toastrService.error(error)
    }
  }

  public async getEmploymentType() {
    try {
      let res = await this.globalService.getEmploymentType();
      if (res && res.status == 200) {
        this.employmentTypes = res.recordList;
      }
    } catch (error: any) {
      this.toastrService.error(error)
    }
  }

  //#region OldCode
  // public verifyOtp() {
  //   this.isOtpInput = true;
  //   this.basicDetailForm.controls['contactNo'].setValue(this.contactForm.value.contactNo);
  // }

  // public calculateLoan() {
  //   if (this.amount && this.interest_rate && this.months) {
  //     let rate = this.interest_rate / (12 * 100);
  //     let rate1 = (Math.pow(1 + rate, this.months))
  //     let payment = this.amount * rate * (rate1 / (rate1 - 1));
  //     this.payment = payment.toFixed(2);
  //     this.amountPayable = (parseFloat(this.payment) * this.months).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
  //     this.interest = (parseFloat(this.payment) * this.months - this.amount).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
  //     this.displayAmount = this.amount.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
  //   }
  // }

  // //#region getOtp
  // public getOtp() {
  //   // this.isOtpInput = true;
  //   this.spinnerService.show();
  //   // this.isVerifyOtp = false;
  //   // this.isPersonalDetailForm = true;
  //   // this.basicDetailForm.controls['contactNo'].setValue(this.contactForm.value.contactNo);

  //   this.isOtpInput = true;
  //   this.reCaptchaVerifier = new firebase.auth.RecaptchaVerifier('sign-in-button', { size: 'invisible' })
  //   firebase.auth().signInWithPhoneNumber('+91' + this.contactForm.value.contactNo, this.reCaptchaVerifier).then((confirmationResult) => {
  //     if (confirmationResult && confirmationResult.verificationId) {
  //       this.verify = JSON.parse(JSON.stringify(confirmationResult.verificationId));
  //       this.isOtpInput = true;
  //       this.spinnerService.hide();
  //     }
  //   }).catch((error) => {
  //     //alert(error.message);
  //     this.spinnerService.hide();
  //     this.toastrService.error(error.message, "Firebase");
  //     setTimeout(() => {
  //       window.location.reload();
  //     }, 5000);
  //   });
  // }

  // public onOtpChange(otpCode: any) {
  //   this.otp = otpCode;
  // }

  // public handleClick() {
  //   this.isVerifyOtp = false;
  //   this.spinnerService.show();
  //   // this.isVerifyOtp = false;
  //   // this.isPersonalDetailForm = true;
  //   // this.basicDetailForm.controls['contactNo'].setValue(this.contactForm.value.contactNo);
  //   this.getLeadsByContactNo();
  //   var credential = firebase.auth.PhoneAuthProvider.credential(this.verify, this.otp);
  //   firebase.auth().signInWithCredential(credential)
  //     .then((response) => {
  //       this.isVerifyOtp = false;
  //       this.spinnerService.hide();
  //       this.basicDetailForm.controls['contactNo'].setValue(this.contactForm.value.contactNo);
  //       //this.isShow = true;
  //       this.getLeadsByContactNo();
  //       //this.isShow = false;
  //       this.isPersonalDetailForm = true;
  //     }).catch((error) => {
  //       this.spinnerService.hide();
  //       this.commonService.showWarning();
  //     });
  // }

  // public onKey(value) {
  //   this.selectedCity = this.search(value);
  // }
  // //#endregion

  // public search(value: string) {
  //   let filter = this.cities.filter(item =>
  //     item.name.toLowerCase().includes(value.toLowerCase())
  //   );
  //   return [...filter];
  // }

  // public async getLeadsByContactNo() {
  //   try {
  //     let res = await this.globalService.getLeadsByContactNo(this.contactForm.value.contactNo, this.serviceId);
  //     if (res && res.status == 200) {
  //       if (res.recordList && res.recordList.length > 0) {
  //         this.leads = res.recordList[0];
  //         if (res.recordList[0].pincode) {
  //           let data = await this.getCityByPincode(res.recordList[0].pincode);
  //         }
  //         this.basicDetailForm.setValue(
  //           {
  //             "contactNo": this.leads.contactNo,
  //             "loanAmount": this.leads.loanAmount,
  //             "customerFullName": this.leads.customerFullName,
  //             "pincode": this.leads.pincode ? this.leads.pincode : null,
  //             "cityName": this.cities.find((c:any) => c.id == this.leads.cityId),
  //             "email": this.leads.email
  //           }
  //         )
  //       }
  //     }
  //   } catch (error: any) {
  //     let err = error;
  //     if (error && error.error && error.error.message) {
  //       err = error.error.message
  //     }
  //     this.toastrService.error(err, "Error");
  //   }
  // }

  // public async generateLead() {
  //   try {
  //     if (this.isAgreed) {
  //       if (this.leads.id) {
  //         let id = this.leads.id
  //         this.leads = this.basicDetailForm.value;
  //         this.leads.serviceId = this.serviceId;
  //         this.leads.cityId = this.basicDetailForm.value.cityName.id;
  //         this.leads.id = id;
  //         this.leads.countryCode = "+91";
  //         let res = await this.leadService.updateLeads(this.leads);
  //         if (res && res.status == 200) {
  //           this.sucessReponse();
  //         }
  //       }
  //       else {
  //         this.leads = this.basicDetailForm.value;
  //         this.leads.serviceId = this.serviceId;
  //         this.leads.cityId = this.basicDetailForm.value.cityName.id;
  //         this.leads.countryCode = "+91";
  //         let res = await this.leadService.insertLeads(this.leads);
  //         if (res && res.status == 200) {
  //           if (res.recordList && res.recordList.length > 0) {
  //             this.leads.id = res.recordList[0].id
  //             this.sucessReponse();
  //           }
  //         }
  //       }
  //     }
  //     else {
  //       this.agreedmsg = "Please agree to our terms & Condition";
  //     }
  //   } catch (error: any) {
  //     let err = error;
  //     if (error && error.error && error.error.message) {
  //       err = error.error.message
  //     }
  //     this.toastrService.error(err, "Error");
  //   }
  // }

  // public setStep(n: any, initial?: string) {
  //   if (initial) {
  //     this.faqs[0].isCollapsed = false;
  //   }
  //   else {
  //     if (this.faqs[n].isCollapsed == false) {
  //       this.faqs[n].isCollapsed = true;
  //     }
  //     else {
  //       for (let index = 0; index < this.faqs.length; index++) {
  //         if (this.faqs[index].isCollapsed == false) {
  //           this.faqs[index].isCollapsed = true;
  //         }
  //       }
  //       this.faqs[n].isCollapsed = false;
  //     }
  //   }
  // }

  //#endregion OldCode


  public async detailForm() {
    if (this.basicDetailForm.valid) {
      try {
        this.spinnerService.show();
        this.leads = this.basicDetailForm.value;
        this.leads.serviceId = this.serviceId;
        this.leads.cityId = this.basicDetailForm.value.cityName.id;
        this.leads.countryCode = "+91";

        this.leads.employmentTypeId = this.basicDetailForm.value.employmentTypeId.id;
        if (this.basicDetailForm.value.employmentTypeId == "Self Employee") {
          this.leads.employmentTypeId = 2;
          this.leads.annualIncome = this.basicDetailForm.value.income
        }
        else if (this.basicDetailForm.value.employmentTypeId == "Salaried") {
          this.leads.monthlyIncome = this.basicDetailForm.value.income
          this.leads.employmentTypeId = 1;
        }
        debugger;
        if (this.documentMasters && this.documentMasters.length > 0) {
          for (let index = 0; index < this.documentMasters.length; index++) {
            if (this.documentMasters[index].allowDocumentField)
              this.documentMasters[index].documentData = this.customFieldForm.get(this.documentMasters[index].documentFieldName)?.value
          }
          this.leads.customfields = this.documentMasters
        }
        let res = await this.leadService.insertLeads(this.leads);
        if (res && res.status == 200) {
          this.sucessReponse();
        }

        this.spinnerService.hide();
      } catch (error: any) {
        this.spinnerService.hide();
        let err = error;
        if (error && error.error && error.error.message) {
          err = error.error.message
        }
        this.toastrService.error(err, "Error");
      }
    }
    else {
      Object.keys(this.basicDetailForm.controls).forEach(key => {
        this.basicDetailForm.controls[key].markAsTouched();
      });
    }
  }

  public selectEmployeeType() {
    this.selectedEmployeeType = this.basicDetailForm.value.employmentTypeId.name
  }

  public sucessReponse() {
    //this.commonService.showSuccess();
    Swal.fire({
      icon: 'success',
      text: 'Your Instant loan inquiry is submitted successfully.',
      confirmButtonColor: '#0162e8'
    })
    this.leads = new Leads();
    this.basicDetailForm.reset();
    this.customFieldForm.reset();
  }

  public applyNow() {
    window.scroll({
      top: 0,
      left: 0,
      behavior: 'smooth'
    })
  }

  public async getCityByPincode(event: KeyboardEvent) {
    this.cities = [];
    const value = (event.target as HTMLInputElement)!.value;;
    if (value && value.length == 6) {
      try {
        let res = await this.globalService.getCityByPincode(value);
        if (res && res.recordList.length > 0) {
          this.cities = res.recordList;
          this.selectedCity = [...this.cities]
          if (this.selectedCity && this.selectedCity.length > 0)
            this.basicDetailForm.get('cityName')?.setValue(this.selectedCity[0])
        }
      } catch (error: any) {
        let err = '';
        if (error && error.error.message) {
          err = error.error.message
        }
        else if (error && error.message) {
          err = error.message
        }
        this.toastrService.error(error);
      }

    }
  }

  public calculateLoan() {

    if (this.emiCalculatorForm.value.amount && this.emiCalculatorForm.value.interest_rate && this.emiCalculatorForm.value.months) {
      let rate = this.emiCalculatorForm.value.interest_rate / (12 * 100);
      let rate1 = (Math.pow(1 + rate, this.emiCalculatorForm.value.months))
      let payment = this.emiCalculatorForm.value.amount * rate * (rate1 / (rate1 - 1));
      this.payment = payment.toFixed(2);
      this.amountPayable = (parseFloat(this.payment) * this.emiCalculatorForm.value.months).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
      this.interest = (parseFloat(this.payment) * this.emiCalculatorForm.value.months - this.emiCalculatorForm.value.amount).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
      this.displayAmount = this.emiCalculatorForm.value.amount.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");

    }
  }

  public keyPressAlphanumeric(event: KeyboardEvent) {
    var inp = String.fromCharCode(event.keyCode);
    if (/[a-zA-Z0-9 ]/.test(inp)) {
      // only alphabet a-z A-Z
      return true;
    } else {
      event.preventDefault();
      return false;
    }
  }

}
