import { Component, Injector, ViewChild, ViewEncapsulation, Input, Output, 
EventEmitter, OnInit, AfterViewInit, OnDestroy } from '@angular/core';
import { AppComponentBase } from '@shared/common/app-component-base';
import { TokenAuthServiceProxy } from '@shared/service-proxies/service-proxies';
import { AppSessionService } from '@shared/common/session/app-session.service';
import { AppConsts } from '@shared/AppConsts';
import { ActivatedRoute, Router } from '@angular/router';
import {Location} from '@angular/common';
import { appModuleAnimation } from '@shared/animations/routerTransition';
import { isString } from 'util';
import { isNumber  } from 'util';

import { LocationServiceProxy, RateServiceProxy, RateDto, OrderSourceRate, RateRuleDto, RuleList, RateTypeList, GetRateForEditOutput, CreateOrEditRateInput, RateRules } from '@shared/service-proxies/service-proxies';
import { NotifyService } from '@abp/notify/notify.service';
import { finalize } from 'rxjs/operators';
declare var KTWizard: any;
declare var $: any;
declare var KTApp: any;
declare let swal: any;
@Component({
  selector: 'create-or-edit-driver-rates.component',
  encapsulation: ViewEncapsulation.None,
  templateUrl: './create-or-edit-driver-rates.component.html',
  animations: [appModuleAnimation()],
  
})

export class CreateOrEditRatesComponent extends AppComponentBase {
  saving = false;
  rate: any;
  id: any;
  filteredLocations: any;
  filteredOrderSource: any;
  locationIds: any;
  orderSourceId: any;
  
  filteredRules: any;
  ruleIds: any;
  active: boolean = true;

  filteredRateType: any;
  rateTypeIds: any;
  ratesData: CreateOrEditRateInput = new CreateOrEditRateInput;
  ruleInput: RateRuleDto = new RateRuleDto;
  selectedRule = 0;
  selectedRateType = 0;
  locationTxt: any;
  orderSourceTxt: any;
  descriptionTxt: any;
  createRate: {
          rateRules: RateRuleDto
         };


  prevButton: any;
  nextButton: any;
  wizard: any;

  constructor(
            injector: Injector,
            private _appSessionService: AppSessionService,
            private router: Router,
            private _location: Location,
            private route: ActivatedRoute,
            private _rateService: RateServiceProxy,
            private _notifyService: NotifyService,
            private _tokenAuth: TokenAuthServiceProxy,
            private _router: Router,
            private _locationServiceProxy: LocationServiceProxy,
        ) {
            super(injector);

            
  }


  
  insertSpaces(string) {
    string = string.replace(/([a-z])([A-Z])/g, '$1 $2');
    string = string.replace(/([A-Z])([A-Z][a-z])/g, '$1 $2')
    return string;
  }

  remove(r: number){
      this.ratesData.rateRules.splice(r, 1);
  }

  addField(){
      
      if(this.selectedRule == 1) {
          if(this.ruleInput.minAmount >= this.ruleInput.maxAmount) {

             this.message.warn('Min Amount Cannot Be Equal Or Greater Than Max Amount');
             return null;
          }
      }

      /*if(this.ruleInput.description == undefined) {
          this.message.warn('Description Cannot Be Empty');
        
          
          return null;
      }*/

      this.ruleInput.rateAmount = $("#rateInput").val(); 
      this.ruleInput.rateType = this.selectedRateType;
      this.ruleInput.rule = this.selectedRule;
      
      let selectedRt = this.search(this.selectedRateType, this.filteredRateType);
      let selecteRl = this.search(this.selectedRule, this.filteredRules);
      

      this.ruleInput.rateTypeStr = selectedRt;
      this.ruleInput.ruleStr = selecteRl;

     
      this.ratesData.rateRules.push(this.ruleInput);
      
      

      this.ruleInput = new RateRuleDto;
      this.ruleInput.amount = 0;
      this.ruleInput.minAmount = 0;
      this.ruleInput.maxAmount = 0;
      this.ruleInput.rateAmount = 0.00;


  }
  

  search(id, myArray) {
      for (var i=0; i < myArray.length; i++) {
         
          if (myArray[i].id === Number(id)) {
              

              return myArray[i].name;

          }
      }
  }

  filterLocations(): void {
      this._locationServiceProxy.getLocationNames(
          undefined,
          undefined,
          undefined,
          undefined,
          undefined,
          undefined
      ).subscribe(result => {
          this.filteredLocations = result;
          $('#locationFilter').select2({
          });
          
      });
  }

  filteredOrderSources(): void {
      this._rateService.getOrderSourceRate().subscribe(result => {
          
          this.filteredOrderSource = result;
          $('#orderSourceFilter').select2({
          });
      });
  }
  
  filterRules(): void {

      this._rateService.getRuleList().subscribe(result => {
          
          this.filteredRules = result;
      });

  }

  filterRateType(): void {

      this._rateService.getRateTypeList().subscribe(result => {
          
          this.filteredRateType = result;
      });

  }

  onBlurMethod(event: any): void{
      let val = (event.target as HTMLInputElement).value;
      let id = event.target.id;
      let jId = '#'+id;

      //let rA =  $("#rateInput").val(); 
      if(val == "") {
         val = "0.00";
      }
      
      let rAv = parseFloat(val).toFixed(2);
      $(jId).val(rAv);
  }

  ngOnDestroy() {

    this.locationIds = null;
    this.orderSourceId = null;

    this.locationTxt = null;
    this.orderSourceTxt = null;
    this.descriptionTxt = null;

  }

  ngOnInit() {

      this.route.paramMap.subscribe(params => {
           this.id = params.get("id");
           
       });

     
      this.ruleInput.amount = 0;
      this.ruleInput.minAmount = 0;
      this.ruleInput.maxAmount = 0;
      $("#rateInput").attr("value", "0.00");

       if(this.id != '' && this.id != undefined && this.id != null){ 
            this.spinnerService.show();
            this._rateService.getRateForEdit(this.id)
                              .subscribe(result => {
                                    this.ratesData = result.rate;

                                    if(this.ratesData.inActive == false) {
                                      this.active = true;
                                    }
                                    else {
                                      this.active = false;
                                    }
                                    console.log(this.ratesData);
                                    this.locationIds = this.ratesData.locationId;
                                    this.orderSourceId = this.ratesData.orderSourceId;
                                    $("#orderSourceFilter option[value="+this.orderSourceId+"]").attr('selected','selected').change();
                                    $("#locationFilter option[value="+this.locationIds+"]").attr('selected','selected').change();

                                    this.locationTxt = this.ratesData.locationName;
                                    this.orderSourceTxt = this.ratesData.orderSourceName;
                                    if(result) {
                                      this.spinnerService.hide();  
                                     
                                    }
                                    
                                    

                                    
                              });
       }
       else {
          this.ratesData.rateRules = new Array<RateRuleDto>();
       }
         



      var wizardEl = document.querySelector('#kt_wizard_v2');
      var that = this;
      var wizard = new KTWizard(wizardEl, {
       startStep: 1, // Initial active step number
       clickableSteps: false,
       navigation: false  // Allow step clicking
      });

      $("#rateInput").blur(function() {
          //console.log(isNumber(that.ruleInput.rateAmount));
          //console.log(isString(that.ruleInput.rateAmount));
          let rA =  $("#rateInput").val(); 
          if(rA == "") {
             rA = "0.00";
          }
          
          let rAv = parseFloat(rA).toFixed(2);
          $("#rateInput").val(rAv);

      });

      $(document).keypress(function(e) {

            if(e.which == 13) {
                    event.preventDefault();
                    return false;

            }
      });

      this.prevButton = wizardEl.querySelector('[data-ktwizard-type="action-prev"]');
      this.nextButton = wizardEl.querySelector('[data-ktwizard-type="action-next"]');

      
        /* this.prevButton.addEventListener('click', function() {
          // Go back to the previouse step
             wizard.goPrev();
          });​ */
      
         this.prevButton.addEventListener('click', function() {
              var step = wizard.getStep();


         });

         this.nextButton.addEventListener('click', function() {
              var step = wizard.getStep();
              console.log(step);
              if(step == 2) {

                  if(that.locationTxt == "" || that.locationTxt == null) {
                    that.message.warn('Please Select Location');
                    wizard.goTo(1);
                  }

                  if(that.orderSourceTxt == "" || that.orderSourceTxt == null) {
                    that.message.warn('Please Select Order Source');
                    wizard.goTo(1);
                  }

                  $("#rateType").change(function(){
                        
                        let rtV =  $("#rateType option:selected").val();
                       if(rtV == 7) {
                        
                        $("#rules").val(1);
                        $('#rules').attr('disabled', true);
                        that.selectedRule = 1;
                       }
                       else {
                        $('#rules').attr('disabled', false);
                       }
                       
                  });

              }


              if(step == 3) {


                  if(that.ratesData.rateRules.length == 0) {

                      that.message.warn('Please Add Rule');
                      wizard.goTo(2);
                  }


                  for(let a = 0; a < that.ratesData.rateRules.length; a++) {
                    if(that.ratesData.rateRules[a].rule == 1) {
                        if(that.ratesData.rateRules[a].minAmount >= that.ratesData.rateRules[a].maxAmount) {

                           that.message.warn('Min Amount Cannot Be Equal Or Greater Than Max Amount');
                           wizard.goTo(2);
                           break;

                           return null;
                        }
                    }

                    /*if(that.ratesData.rateRules[a].description == undefined) {
                        that.message.warn('Description Cannot Be Empty');
                        wizard.goTo(2);
                        break;

                        return null;
                    }*/
                  }

              }
            
         });

       
       
/*       $("#descriptionFilter").change(function(){
            
            that.descriptionTxt = $("#descriptionFilter").val();
       });*/

       $("#locationFilter").change(function(){
            
            that.locationTxt = $("#locationFilter option:selected").text();
       });
      
       $("#orderSourceFilter").change(function(){
           //let idOS = Number((<HTMLInputElement>document.getElementById('orderSourceFilter')).value);
           that.orderSourceTxt = $("#orderSourceFilter option:selected").text();
           //alert(that.orderSourceTxt);
           //alert(idOS);
       });

       this.filterLocations();
       this.filteredOrderSources();
       this.filterRateType();
       this.filterRules();
  
  }


  save() : void {
      
    this.ratesData.locationId = $("#locationFilter option:selected").val();
    this.ratesData.orderSourceId = $("#orderSourceFilter option:selected").val();
    this.ratesData.locationName = this.locationTxt;
    this.ratesData.orderSourceName = this.orderSourceTxt;
    if(this.active == false) {
        this.ratesData.inActive = true;
    }
    else {
        this.ratesData.inActive = false;
    }


    if(this.id) {

        this._rateService.updateRate(this.ratesData).subscribe(result=>{
            this.saving = false;
            this.notify.info(this.l('SavedSuccessfully'));
            this.spinnerService.hide();
            this.router.navigate(['/app/sprintship/rates']);
        }, (error) => {
            this.spinnerService.hide();
            this.saving = false;
        });
    }
    else {

        this._rateService.createRate(this.ratesData).subscribe(result=>{
            this.saving = false;
            this.notify.info(this.l('SavedSuccessfully'));
            this.spinnerService.hide();
            this.router.navigate(['/app/sprintship/rates']);
        }, (error) => {
            this.spinnerService.hide();
            this.saving = false;
        });
    }
      
  }

  redirectUrl(url: any, name?: string){
      if(name != null){
          var myurl = `${url}/${name}`;
      }else{
          var myurl = `${url}`;
      }
      console.log(myurl);
      this._router.navigateByUrl(myurl);
  }

  goBack(){
        this._location.back();
  }

}