import { Component, ViewChild, Injector, Output, EventEmitter, Input} from '@angular/core';
import { ModalDirective } from 'ngx-bootstrap';
import { finalize } from 'rxjs/operators';
import { PostalCodesServiceProxy, CreateOrEditPostalCodeDto, OrderStatusTypeServiceProxy, OrderStatusServiceProxy, OrderStatusDto, CreateOrderStatusInput, ControllerOrderPackagesListServiceProxy, TimingServiceProxy } from '@shared/service-proxies/service-proxies';
import { AppComponentBase } from '@shared/common/app-component-base';
import {CalendarModule} from 'primeng/calendar';
import * as moment from 'moment';
import { ControllerOrderPackageDetailComponent } from '../order-packages/order-packages-detail.component';
import { ViewOrderStatusComponent } from './view-order-status.component'
declare var $: any;


@Component({
    selector: 'addOrderStatusModal',
    templateUrl: './add-order-status-modal.component.html',
    styleUrls: ['./add-order-status-modal.component.less']
})
export class AddOrderStatusModalComponent extends AppComponentBase {

    @ViewChild('createOrEditModal', { static: true }) modal: ModalDirective;

    @Input() orderId:number;

    @Output() modalSave: EventEmitter<any> = new EventEmitter<any>();

    @Output() statusEvent: EventEmitter<any> = new EventEmitter<any>();

    @Input() myFunction:Function


    active = false;
    saving = false;
    orderStatusTypes: any
    orderStatusDefinitions: any;
    value:Date
    orderStatusNote:string
    orderStatusLongitude: any
    orderStatusLatitude : any
    orderStatusTime:any
    currentDate:any
    DateObject =  Date
    // currentDate = moment().format("MM/DD/YYYY h:mm a")
    currentDateConvert: any;
    
    statusBoolean=false;
    dateTime : Date
    _ukLocale:  any
    
    orderStatus: CreateOrderStatusInput = new CreateOrderStatusInput();


    constructor(
        injector: Injector,
        private _orderStatusAppService : OrderStatusServiceProxy,
        private _timingAppService : TimingServiceProxy,
        private _orderStatusTypeAppService : OrderStatusTypeServiceProxy,
        private _orderPackageListAppService : ControllerOrderPackagesListServiceProxy,
    ) {
        super(injector);
           
    }

    // orderStatusUpdate(get: boolean){
    //     this.statusEvent.emit(get)
    // }
    
    ngOnInit(){
        this._ukLocale = abp.features.isEnabled('App.DateFormatFeature.UKLocale');
    }

    onShown(): void{
        $('.kt-select2').select2();
    }

    show(): void {
        var that= this
        
        // this.currentDate = moment().format("MM/DD/YYYY h:mm a")
        // this.orderStatusTime = moment().format("MM/DD/YYYY h:mm a")

       this.dateTime = new Date();
       this._ukLocale = abp.features.isEnabled('App.DateFormatFeature.UKLocale');
       this.getOrderStatusType(); 


        // console.log(dateTime)

        this._timingAppService.convertToTimezone(moment(this.dateTime),localStorage.getItem('timeZone'))
                              .pipe().subscribe(result => {
                                if(this._ukLocale && result){
                                    this.orderStatusTime = result.format("DD/MM/YYYY h:mm a")
                                    // console.log(this.orderStatusTime)
                                }
                                else{
                                    this.orderStatusTime = result.format("MM/DD/YYYY h:mm a")
                                }
                                
                                // this.currentDate = result.format("MM/DD/YYYY h:mm a")
                                //console.log(this.orderStatusTime)
                              })

        this.active = true;
        this.modal.show(); 
        this.orderStatus.note = null
        // this.orderStatus.orderStatusTypeId = null
        this.orderStatusLongitude = null
        this.orderStatusLatitude=null
        // this.currentDateConvert = this.currentDate
        // this.orderStatusTime=this.currentDate
        // this._timingAppService.convertToTimezone(this.currentDateConvert, localStorage.getItem('timeZone'))
        //                         .pipe(finalize(() => this.spinnerService.hide())).subscribe(result => {
        //                             console.log(result)
        //                             // this.orderStatusTime=result
        // });

        // console.log(that.currentDate)
        // this._timingAppService.convertToTimezone(moment(), "UTC")
        // .pipe()
        // .subscribe(result => {
        //    console.log(result)
        // });
        // console.log("this is the input id"+this.orderId)
        // console.log(moment().local())
        
    }
  

    // getOrderStatusType(): void{
    //     this._orderPackageListAppService.getOrderStatusTypeList()
    //     .pipe(finalize(() => this.spinnerService.hide())).subscribe(result => {
    //         this.orderStatusTypes=result.items;   
    //     });
    // }

    getOrderStatusType(): void{
        this._orderPackageListAppService.getOrderDescriptionList()
        .pipe(finalize(() => this.spinnerService.hide())).subscribe(result => {
            this.orderStatusDefinitions=result.items;
            console.log(this.orderStatusDefinitions)   
        });
    }

    
    save(e): void {  
        this.saving = true;
        let header = document.querySelector('.kt-header');


        this._timingAppService.convertToTimezone(moment(this.dateTime), "UTC")
                                .pipe()
                                .subscribe(result => {
                                    
                                    this.orderStatus.time = result
                                     //console.log(result)
                                    
                                    this.orderStatus.orderStatusTypeId=Number((<HTMLInputElement>document.getElementById('OrderStatusType')).value);
                                    // this.orderStatus.note=String((<HTMLInputElement>document.getElementById('OrderStatusNote')).value);
                                    this.orderStatus.latitude=Number((<HTMLInputElement>document.getElementById('OrderStatusLatitude')).value);
                                    this.orderStatus.longitude=Number((<HTMLInputElement>document.getElementById('OrderStatusLongitude')).value);
                                    this.orderStatus.orderId = this.orderId;
                                    this.orderStatus.bgColor = getComputedStyle(header).backgroundColor;
                                    //console.log(this.orderStatus)

                                    console.log(this.orderStatus);

                                    this._orderPackageListAppService.createOrderPackageOrderStatus(this.orderStatus)
                                    .pipe(finalize(() => { this.saving = false;}))
                                    .subscribe(() => {
                                        this.notify.info(this.l('SavedSuccessfully'));
                                        this.close();
                                        this.modalSave.emit(null);
                                        // this.myFunction();   
                                        // this.orderStatusUpdate(true)
                                    });
                                });
       
 }
    close(): void {
        this.active = false;
        this.modal.hide();
    }
}