import { Component, OnInit, AfterViewInit, Input, Output, EventEmitter, Pipe, PipeTransform, TemplateRef, ViewChild } from '@angular/core';
import { ManageDiscountCodeService } from './managediscountcode.service';
import { Router } from '@angular/router';
import { FormControl, FormBuilder, FormGroup, Validators } from '@angular/forms';
import { DiscountCode } from '../userentity/datamodel';
import { BsDatepickerModule, BsDatepickerConfig  } from 'ngx-bootstrap';
import { Http, Response } from '@angular/http';
import { DatePipe } from '@angular/common';
import { BsModalService } from 'ngx-bootstrap/modal';
import { BsModalRef } from 'ngx-bootstrap/modal/bs-modal-ref.service';
import { PagerComponent } from '../../shared/pager/pager.component';
import { LoadingService } from '../../shared/loading.service';
import { GlobalService } from '../../shared/global';
import { ConfirmService } from '../../shared/confirm/confirm.service';
declare var $:any;

@Component({
    templateUrl: './managediscountcode.component.html'
})

export class ManageDiscountCode implements OnInit {

Mode: string = 'Manage';
discountCode: DiscountCode;
discountCodes: Array<DiscountCode>;
manageDiscountCodeFrm: FormGroup;
insertUpdateDiscountCodeFrm: FormGroup;
error: any;
alerts: string;
alertmsg: string;
Searchalerts: string;
modalAlerts: string;
divClass: string = '';
topPos: string = '2000px';
selectedRow: number = -1;
datePipe: DatePipe = new DatePipe('en-US');
bsValue1: Date = new Date();
bsValue2: Date = new Date();
bsValue3: Date = new Date();
bsValue4: Date = new Date();
selectedId: number = 0;
modalRef: BsModalRef;
minDate = new Date(1110, 11, 1);
maxDate = new Date(9999, 11, 31);
bsConfig: Partial<BsDatepickerConfig>;
dateStartInvalid: boolean = false;
dateEndInvalid: boolean = false;
dateStartInvalid1: boolean = false;
dateEndInvalid1: boolean = false;
NoRecord: string;
@ViewChild(PagerComponent) pagerComponent: PagerComponent;
recordCount: number;
pageNo: number;
pageLength: number;

constructor(private manageDiscountCodeService: ManageDiscountCodeService, private router: Router, 
    private fb: FormBuilder, private modalService: BsModalService, public global: GlobalService, 
    private _loadingService: LoadingService, private _confirmService: ConfirmService) { }
  
    ngOnInit(): void {
        this.bsConfig = Object.assign({}, { containerClass: 'theme-dark-blue' });
        this.divClass = 'col-sm-12';
        this.discountCode = new DiscountCode();
        this.discountCode.Id = 0;
        this.alerts = '';
        this.alertmsg = '';
        this.Searchalerts = '';
        this.manageDiscountCodeFrm = this.fb.group({
            searchDiscountCode: [''],
            searchStartDate: [''],
            searchEndDate: [''],
            discountCodes: this.fb.array([])
        });
        this.insertUpdateDiscountCodeFrm = this.fb.group({
            discountId: [''],
            discountCode: [''],
            startDate: ['', Validators.required],
            endDate: ['', Validators.required],
            percentage: ['', [Validators.required, Validators.pattern('[0-9.]*')]],
            isActive: ['true']
        });
        $('#fixed_hdr2').fxdHdrCol({
			fixedCols: 0,
			width: "100%",
			height: 330,
			colModal: [
			{ width: 250, align: 'center' },
			{ width: 250, align: 'center' },
			{ width: 250, align: 'Center' },
			{ width: 250, align: 'Center' },
			{ width: 200, align: 'Center' },
			],
			sort: true
		});
        this.selectedRow = -1;
        this.selectedId = -1;
        this.pageNo = 1;
        this.pageLength = 10;
        this.NoRecord = this.global.NoRecords;
        this.recordCount = 0;
        this.pagerComponent = new PagerComponent();
        
        if(document.getElementById("fixed_table_rc") != null){
            document.getElementById("fixed_table_rc").remove();
            var testScript = document.createElement("script");
            testScript.setAttribute("id", "fixed_table_rc");
            testScript.setAttribute("src", "../assets/scripts/fixed_table_rc.js");
            testScript.setAttribute("type", "text/javascript");
            document.body.appendChild(testScript);
        }
    }

    public SetClickedRow(i: number, item: any) {
        this.selectedRow = i;
        this.selectedId = item['Id'];   
        this.discountCode = item;
    }
   
    DateChange(dateValue: any){
        this.alerts = '';
        this.alertmsg = '';
        this.Searchalerts = '';
        if(this.manageDiscountCodeFrm.dirty) {
            if(dateValue._datepicker._elementRef.nativeElement.id == 'SearchStartDate'){
                if(dateValue._bsValue == null) {
                    if(dateValue._datepicker._elementRef.nativeElement.value != ''){
                        this.dateStartInvalid = true;    
                    }
                    else{
                        this.dateStartInvalid = false;    
                    }
                }
                else{
                    this.dateStartInvalid = false; 
                    this.manageDiscountCodeFrm.controls['searchStartDate'].setValue(dateValue._bsValue);
                }
            }

            if(dateValue._datepicker._elementRef.nativeElement.id == 'SearchEndDate'){
                if(dateValue._bsValue == null) {
                    if(dateValue._datepicker._elementRef.nativeElement.value != ''){
                        this.dateEndInvalid = true;    
                    }
                    else{
                        this.dateEndInvalid = false;    
                    }
                }
                else{
                    this.dateEndInvalid = false; 
                    this.manageDiscountCodeFrm.controls['searchEndDate'].setValue(dateValue._bsValue);
                }
            }

            if(!this.dateStartInvalid && !this.dateEndInvalid){
                if(Date.parse(this.manageDiscountCodeFrm.controls['searchStartDate'].value) > 
                Date.parse(this.manageDiscountCodeFrm.controls['searchEndDate'].value)){
                    this.Searchalerts = '<span>Search start date must be less than the search end date</span><br/>';
                }
            }
        }

        if(this.insertUpdateDiscountCodeFrm.dirty) {
            if(dateValue._datepicker._elementRef.nativeElement.id == 'startDate'){
                if(dateValue._bsValue == null) {
                    if(dateValue._datepicker._elementRef.nativeElement.value != ''){
                        this.insertUpdateDiscountCodeFrm.controls['startDate'].setValue(dateValue._datepicker._elementRef.nativeElement.value);
                        this.dateStartInvalid1 = true;    
                    }
                    else{
                        this.dateStartInvalid1 = false;    
                    }
                }
                else{
                    this.dateStartInvalid1 = false; 
                    this.insertUpdateDiscountCodeFrm.controls['startDate'].setValue(dateValue._bsValue);
                }
            }

            if(dateValue._datepicker._elementRef.nativeElement.id == 'endDate'){
                if(dateValue._bsValue == null) {
                    if(dateValue._datepicker._elementRef.nativeElement.value != ''){
                        this.insertUpdateDiscountCodeFrm.controls['endDate'].setValue(dateValue._datepicker._elementRef.nativeElement.value);
                        this.dateEndInvalid1 = true;    
                    }
                    else{
                        this.dateEndInvalid1 = false;    
                    }
                }
                else{
                    this.dateEndInvalid1 = false; 
                    this.insertUpdateDiscountCodeFrm.controls['endDate'].setValue(dateValue._bsValue);
                }
            }

            if(!this.dateStartInvalid1 && !this.dateEndInvalid1){
                if(Date.parse(this.insertUpdateDiscountCodeFrm.controls['startDate'].value) > 
                Date.parse(this.insertUpdateDiscountCodeFrm.controls['endDate'].value)){
                    this.alerts = '<span>Discount start date must be less than the discount end date</span><br/>';
                }
            }
        }

    }

    BindFormFields(data){
        this.recordCount = data.RecordCount;
        this.discountCodes = data.DiscountCodeList;
        this.manageDiscountCodeFrm.setControl('discountCodes', this.fb.array(this.discountCodes));
        if(this.selectedRow > -1){
            this.selectedRow = this.discountCodes.findIndex(C => C.Id == this.selectedId);
            this.SetClickedRow(this.selectedRow, this.discountCodes[this.selectedRow]);
        }
        if (this.discountCodes.length > 0) {
            this.NoRecord = '';
            this._loadingService.HideLoading("global-loading");
        }
        if (this.discountCodes.length == 0) {
            this.NoRecord = this.global.NoRecords;
            this._loadingService.HideLoading("global-loading");
        }
    }

    public SearchDiscountCodes(evt: any) {
        if (this.global.ValidationMsg != '') {
            this.Searchalerts = this.global.ValidationMsg
        }
        if (this.alerts != '' && this.Searchalerts != '') return;
        this.global.compareTwoDates(this.manageDiscountCodeFrm.controls['searchEndDate'].value, this.manageDiscountCodeFrm.controls['searchStartDate'].value);
        this._loadingService.ShowLoading("global-loading");
        var tempArr = evt.split(',');
        this.pageNo = parseInt(tempArr[0]);
        this.pageLength = parseInt(tempArr[1]);
        this._loadingService.ShowLoading("global-loading");
        this.manageDiscountCodeService.GetDiscountCodes(
        {
            discountCode: this.manageDiscountCodeFrm.controls['searchDiscountCode'].value,
            startDate: this.datePipe.transform(this.manageDiscountCodeFrm.controls['searchStartDate'].value, 'MM/dd/yyyy'),
            endDate: this.datePipe.transform(this.manageDiscountCodeFrm.controls['searchEndDate'].value, 'MM/dd/yyyy'),
            pageNo: this.pageNo, 
            pageLength: this.pageLength
        })
        .subscribe(x => { this.BindFormFields(x) }, error => this.error = error);
    }

    SearchRecords() {
        this.selectedRow = -1;
        this.selectedId = -1;
        this.SearchDiscountCodes('1, ' + this.pageLength);
    }

    openModal(template: TemplateRef<any>) {
        this.modalRef = this.modalService.show(template);
    }

    public InsertUpdateDiscountCode(template: TemplateRef<any>) {
        this.alerts = '';
        if(parseInt(this.insertUpdateDiscountCodeFrm.value.percentage) > 100){
            this.alerts = '<span>Percentage must be between 0 to 100</span><br/>';
        }
        if(Date.parse(this.insertUpdateDiscountCodeFrm.controls['startDate'].value) > 
            Date.parse(this.insertUpdateDiscountCodeFrm.controls['endDate'].value)){
            this.alerts += '<span>Discount start date must be lower than discount end date</span>';
        }
        this.manageDiscountCodeService.GetDiscountCodes(
            {
                discountCode: this.insertUpdateDiscountCodeFrm.controls['discountCode'].value,
                startDate: this.datePipe.transform('1/1/1', 'MM/dd/yyyy'),
                endDate: this.datePipe.transform('1/1/9999', 'MM/dd/yyyy'),
                pageNo: 1, 
                pageLength: 5
            })
            .subscribe(x => 
            { 
                    var obj = this.insertUpdateDiscountCodeFrm.value;
                    if(obj.discountId == 0){
                        if(x.RecordCount > 0){
                            this.alerts += '<span>Discount code already exists. Enter a different code.</span>';
                        }
                        if(this.alerts == ''){
                            return this.manageDiscountCodeService.InsertDiscountCode(obj)
                            .subscribe(
                            n => (this.AfterInsertData(n, template)),
                            error => this.error = <any>error);
                        }
                    }
                    else{
                        if(x.RecordCount > 0 && obj.discountId != x.DiscountCodeList[0].Id){
                            this.alerts += '<span>Discount code already exists. Enter a different code.</span>';
                        }
                        if(this.alerts == ''){
                            return this.manageDiscountCodeService.UpdateDiscountCode(obj)
                            .subscribe(
                            n => (this.AfterUpdateData(n, template)),
                            error => this.error = <any>error);
                        }
                    }
            }, error => this.error = error);
    }

    AfterInsertData(data, template) {
        if (data.Status == "false") {
            //this.alerts = "<span>Discount code save unsuccessfull</span>";
            this._confirmService.activate("Discount code insert unsuccessfull", "alertMsg");
        } else {
            this._confirmService.activate("Discount code saved successfully.", "alertMsg");
            //this.modalAlerts = "<p>Discount code saved successfully</p>";
            //this.modalRef = this.modalService.show(template);
        }
    }

    AfterUpdateData(data, template) {
        if (data.Status == "false") {
            //this.alerts = "<span>Discount code update unsuccessfull</span>";
            this._confirmService.activate("Discount code update unsuccessfull.", "alertMsg");
        } else {
          this._confirmService.activate("Discount code updated successfully.", "alertMsg");
            //this.modalAlerts = "<p>Discount code updated successfully</p>";
            //this.modalRef = this.modalService.show(template);
        }
    }

    AddDiscountCode(){
        this.Mode = 'Add';
        this.topPos = '100px';
        this.divClass = 'col-sm-10 col-sm-offset-1 col-md-8 col-md-offset-2 col-lg-6 col-lg-offset-3';
        this.insertUpdateDiscountCodeFrm.reset();
        this.alerts = '';
        this.insertUpdateDiscountCodeFrm.controls['discountId'].setValue(0);
        this.insertUpdateDiscountCodeFrm.controls['discountCode'].setValue('');
        this.insertUpdateDiscountCodeFrm.controls['startDate'].setValue('');
        this.insertUpdateDiscountCodeFrm.controls['endDate'].setValue('');
        this.insertUpdateDiscountCodeFrm.controls['percentage'].setValue('');
        this.insertUpdateDiscountCodeFrm.controls['isActive'].setValue('true');
    }

    EditDiscountCode(){
        this.Mode = 'Edit';
        this.topPos = '100px';
        this.divClass = 'col-sm-10 col-sm-offset-1 col-md-8 col-md-offset-2 col-lg-6 col-lg-offset-3';
        this.alerts = '';
        this.insertUpdateDiscountCodeFrm.controls['discountId'].setValue(this.discountCode.Id);
        this.insertUpdateDiscountCodeFrm.controls['discountCode'].setValue(this.discountCode.DiscountCode);
        this.insertUpdateDiscountCodeFrm.controls['startDate'].setValue(this.datePipe.transform(this.discountCode.StartDate, 'MM/dd/yyyy'));
        this.insertUpdateDiscountCodeFrm.controls['endDate'].setValue(this.datePipe.transform(this.discountCode.EndDate, 'MM/dd/yyyy'));
        this.insertUpdateDiscountCodeFrm.controls['percentage'].setValue(this.discountCode.Percentage);
        if(this.discountCode.IsActive){
            this.insertUpdateDiscountCodeFrm.controls['isActive'].setValue('true');
        }
        else{
            this.insertUpdateDiscountCodeFrm.controls['isActive'].setValue('false');
        }
    }

    CancelAddEdit(){
        this.Mode = 'Manage';
        this.topPos = '2000px';
        this.divClass = 'col-sm-12';
        this.SearchDiscountCodes(this.pageNo + ', ' + this.pageLength);
    }
    
}