import { Component, Injector, OnInit, ViewChild, ViewEncapsulation, Input, ViewChildren, Output, EventEmitter, ViewContainerRef } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { AppConsts } from '@shared/AppConsts';
import { appModuleAnimation } from '@shared/animations/routerTransition';
import { AppComponentBase } from '@shared/common/app-component-base';
import { OrderServiceProxy, OrderListDto, ControllerOrderPackagesListServiceProxy, OrderStatusServiceProxy, OrderStatusListDto, OrderStatusTypeServiceProxy } from '@shared/service-proxies/service-proxies';
// ControllerOrderPackagesListDto, 
import * as moment from 'moment';
import { LazyLoadEvent } from 'primeng/components/common/lazyloadevent';
import { Paginator } from 'primeng/components/paginator/paginator';
import { Table } from 'primeng/components/table/table';
import { HttpClient } from '@angular/common/http';
import { finalize, count, ignoreElements } from 'rxjs/operators';
import { formatDate } from "@angular/common";
import { ViewNotesModalComponent } from '@app/sprintship/controller/order-status/view-notes-modal.component';

@Component({
    selector: 'trackingPageViewOrderStatus',
    templateUrl: './tracking-page-view-order-status.component.html',
    encapsulation: ViewEncapsulation.None,
    styleUrls: ['./tracking-page-view-order-status.less'],
    animations: [appModuleAnimation()],
    providers: [ControllerOrderPackagesListServiceProxy]
})

export class TrackingPageViewOrderStatusComponent extends AppComponentBase  implements OnInit{
    @ViewChild('dataTable', {static: true}) dataTable: Table;
    @ViewChild('paginator', {static: true}) paginator: Paginator;
    @ViewChild('viewNotesModal', {static: true}) viewNotesModal: ViewNotesModalComponent
    @Input() filters: {
        locationFilter : number;
        startDate: Date;
        endDate: Date
    } = < any > {};
    filterText: string;
    
    @Output() viewOrderStatus = new EventEmitter<boolean>();
    @Output() longitudeFromOrderStatus = new EventEmitter<boolean>();
    @Output() latitudeFromOrderStatus = new EventEmitter<boolean>();
    @Output() collectionOfLongLatCode = new EventEmitter<any>()
    @Output() zIndex = new EventEmitter<any>()
    // @Output() collectionOfCode = new EventEmitter<any>();


    @Input() orderId:number;
    @Input() scrollHeight: string
    @Input() type: string
    @Input() track: string
    @Input() defaultLat: number
    @Input() defaultLong:number


    // @Output() statusEvent = new EventEmitter<boolean>();

    orderPackageId : number;
    // orderId:number
    orderPackageCustomer: string
    space=" ";
    latitude:number

    // orderPackage: ControllerOrderPackagesListDto = new ControllerOrderPackagesListDto();
    orderStatuses: Array<{}> = new Array();

    orderPackageDateAndTime: any
    orderStatusTypes: any
    formattedOrderPackageDateAndTime: any
    formattedOrderPackageStatusDateAndTime: any
    formattedOrderPackagePickupDetail: any
    formattedOrderPackageDeliveryDetail: any
    formattedOrderPackageStatusTime:any
    maxResultCount=1000;
    paginatorAccess: boolean

    event: LazyLoadEvent

    orderStatusTotalCount: any

    latitudeForMap: any
    longitudeForMap: any
    collection: Array<any> = new Array<any>();
    collectionCode: Array<any> = new Array<any>();
    mapAccess = false;
    
    collectionLongLatCode: Array<{
        lat: any;
        long: any;  
        code: any;
        color: any
    }> = new Array<any>();

    timeArray : Array<{
        code: any;
        time: any;
    }> = new Array<any>();

    rowGroupMetadata: any;
    _ukLocale:any;
    onLoadTimeZone:string;
    _isLab: boolean;
    public statusFunction: Function;
    
  constructor(
        injector: Injector,
        private id:ActivatedRoute,
        private _controllerOrderPackageAppService: ControllerOrderPackagesListServiceProxy,
        private _orderStatusAppService: OrderStatusServiceProxy,
        private _orderStatusTypeAppService : OrderStatusTypeServiceProxy,
        private viewContainerRef: ViewContainerRef,
        private _orderAppService: OrderServiceProxy,
        
    ) {
        super(injector);
    }

    ngOnInit(){
        this._ukLocale = abp.features.isEnabled('App.DateFormatFeature.UKLocale');
        this._isLab = abp.features.isEnabled('App.RouteDetails');
        let timezone;
        if(this.track != null){
            // console.log(this.orderId)
            this._orderAppService.getOrderRouteLocation(this.orderId)
                             .subscribe(result => {
                                this.onLoadTimeZone = result
                                timezone = result
                                // console.log(this.onLoadTimeZone)
                                
                             })
        }
        this.getOrderStatus();
        
        // this.id.paramMap.subscribe(params => {
        //     this.orderPackageId = Number(params.get('id'));
        // });
        
        // this.getOrderPackageDetail();
        // console.log(this.orderId)
        
        // this.getOrderStatus(this.orderId)
        // console.log(this.orderId)
        
        // this.getOrderStatus();    
    }

    ngAfterViewInit(){
        this.statusFunction = this.getOrderStatus.bind(this)
    }

    getOrderStatus(event?: LazyLoadEvent){
        // console.log(this.orderId)
        
        // console.log(this.onLoadTimeZone)
        
        this.collectionLongLatCode=[]
        this._controllerOrderPackageAppService.getOrderStatusTotalCount(
            this.orderId
        ).subscribe(totalCount =>{
            this.orderStatusTotalCount = totalCount
            if(this.orderStatusTotalCount > 10){
                this.paginatorAccess = true
                // console.log(this.paginatorAccess)
                if (this.primengTableHelper.shouldResetPaging(event)) {
                    this.paginator.changePage(0);
                    return;
                }
                
                this.spinnerService.show();
                this._orderStatusAppService.getGroupedOrderStatusTracking(
                    undefined,
                    undefined,
                    this.orderId,
                    undefined,
                    undefined,
                    undefined,
                    localStorage.getItem('timeZone') != null ? localStorage.getItem('timeZone') : undefined,
                    // this.onLoadTimeZone != null ? this.onLoadTimeZone :  
                    this.primengTableHelper.getSorting(this.dataTable),
                    this.primengTableHelper.getSkipCount(this.paginator, event),
                    this.primengTableHelper.getMaxResultCount(this.paginator, event),
                ).pipe().subscribe(statusResult => {
                    // console.log(this.onLoadTimeZone)
                    this.orderStatuses=statusResult.items;
                    console.log(this.orderStatuses)
                    // this.formattedOrderPackageStatusTime=moment(statusResult.items['time']).utc().format('MM/DD/YYYY, h:mm a')
                    this.primengTableHelper.totalRecordsCount = statusResult.totalCount;
                    // console.log(this.primengTableHelper.totalRecordsCount)
                    
                    // for(let i = 0 ; i < this.orderStatuses.length; i++){
                    //     let rowData = this.orderStatuses[i]
                    //     let code = rowData['orderStatusType']['code'];
                    //     let time = rowData['time'];
                    //     if (i==0){
                    //         this.rowGroupMetadata[code] = { index: 0, size: 1 };
                    //     }
                    //     else {
                    //         let previousRowData = this.orderStatuses[i - 1];
                    //         let previousRowGroup = previousRowData['orderStatusType']['code'];
                    //         let previousRowGroupTime = previousRowData['time'];
                    //         if (code === previousRowGroup && time === previousRowGroupTime)
                    //             this.rowGroupMetadata[code].size++;
                    //         else
                    //             this.rowGroupMetadata[code] = { index: i, size: 1 };
                    //     }
                    //     // this.timeArray.push({code: this.orderStatuses[i]['orderStatusType']['code'], time: this.orderStatuses[i]['time']})
                    // }
                    // console.log(this.rowGroupMetadata)
                    // this.timeArray = []
                    // console.log(this.timeArray)
                    var bounds = new google.maps.LatLngBounds();
                    if(this.getParentComponent().map){
                        this.mapAccess= true
                        for(let i=0 ; i<statusResult.items.length ; i++)
                        {
                            // if(statusResult.items[i]['geocode']['latitude'] == null && statusResult.items[i]['geocode']['longitude'])
                            // {
                            //     this.collectionLongLatCode.push({lat: 0, 
                            //                             long: 0,
                            //                             code: statusResult.items[i]['orderStatusType']['code']})
                            // }

                            // if(statusResult.items[i]['geocode']['latitude'] == null)
                            // {
                            //     this.collectionLongLatCode.push({lat: 0, 
                            //                             long:statusResult.items[i]['geocode']['longitude'],
                            //                             code: statusResult.items[i]['orderStatusType']['code']})
                            // }

                            // if(statusResult.items[i]['geocode']['longitude'] == null)
                            // {
                            //     this.collectionLongLatCode.push({lat: statusResult.items[i]['geocode']['longitude'], 
                            //                             long: 0,
                            //                             code: statusResult.items[i]['orderStatusType']['code']})
                            // }

                            // else{
                            //     this.collectionLongLatCode.push({lat: statusResult.items[i]['geocode']['latitude'], 
                            //     long: statusResult.items[i]['geocode']['longitude'],
                            //     code: statusResult.items[i]['orderStatusType']['code']})
                            // }
                            if(this._ukLocale){
                                statusResult.items[i].stringTime =  statusResult.items[i].time.utcOffset(moment.parseZone(statusResult.items[i].time).utcOffset()).format('D/M/YYYY h:mm A');
                                // console.log("uklocale")
                                statusResult.items[i].etaString = statusResult.items[i].eta.utcOffset(moment.parseZone(statusResult.items[i].eta).utcOffset()).format('D/M/YYYY h:mm A');
                            }
                            else{
                                statusResult.items[i].stringTime =  statusResult.items[i].time.utcOffset(moment.parseZone(statusResult.items[i].time).utcOffset()).format('M/D/YYYY h:mm A');
                                // console.log("hello")
                                statusResult.items[i].etaString = statusResult.items[i].eta.utcOffset(moment.parseZone(statusResult.items[i].eta).utcOffset()).format('M/D/YYYY h:mm A');
                            }
                            

                            this.collectionLongLatCode.push({lat: statusResult.items[i]['geocode']['latitude'], 
                                long: statusResult.items[i]['geocode']['longitude'],
                                code: statusResult.items[i]['orderStatusDescription']['code'],
                                color: statusResult.items[i]['orderStatusDescription']['color']})
                            // this.collectionCode.push(statusResult.items[i]['orderStatusType']['code'])
                            // console.log(console.log(statusResult.items[i]['orderStatusType']['code']))
                            // console.log(statusResult.items[i]['order']['orderStatus']['orderStatusType']['code'])
                            bounds.extend(new google.maps.LatLng({lat: statusResult.items[i]['geocode']['latitude'], lng: statusResult.items[i]['geocode']['longitude']}));
                        }
                        if (this.collectionLongLatCode == []){
                            bounds.extend(new google.maps.LatLng({lat: this.defaultLat, lng: this.defaultLong}));
                        }
                        
                        console.log("if")
                        this.getParentComponent().map.fitBounds(bounds)
                    }
                    this.spinnerService.hide()
                });
                this.collectionOfLongLatCode.emit(this.collectionLongLatCode)
            }
            else{
                this.paginatorAccess = false
                // console.log(this.paginatorAccess)
                this.spinnerService.show();
                this._orderStatusAppService.getGroupedOrderStatusTracking(
                    undefined,
                    undefined,
                    this.orderId,
                    undefined,
                    undefined,
                    undefined,
                    localStorage.getItem('timeZone') != null ? localStorage.getItem('timeZone') : undefined,
                    // this.onLoadTimeZone != null ? this.onLoadTimeZone :  
                    this.primengTableHelper.getSorting(this.dataTable),
                    undefined,
                    this.maxResultCount
                ).pipe(finalize(() => this.spinnerService.hide())).subscribe(statusResult => {
                    this.orderStatuses=statusResult.items;
                    console.log(this.orderStatuses)
                    // console.log(statusResult)
                    var bounds = new google.maps.LatLngBounds();
                    this.primengTableHelper.totalRecordsCount = statusResult.totalCount;
                    if(this.getParentComponent().map){
                        this.mapAccess= true
                        for(let i=0 ; i<statusResult.items.length ; i++)
                        {
                            if(this._ukLocale){
                                statusResult.items[i].stringTime =  statusResult.items[i].time.utcOffset(moment.parseZone(statusResult.items[i].time).utcOffset()).format('D/M/YYYY h:mm A');
                                statusResult.items[i].etaString = statusResult.items[i].eta.utcOffset(moment.parseZone(statusResult.items[i].eta).utcOffset()).format('D/M/YYYY h:mm A');
                            }
                            else{
                                statusResult.items[i].stringTime =  statusResult.items[i].time.utcOffset(moment.parseZone(statusResult.items[i].time).utcOffset()).format('M/D/YYYY h:mm A');
                                statusResult.items[i].etaString = statusResult.items[i].eta.utcOffset(moment.parseZone(statusResult.items[i].eta).utcOffset()).format('M/D/YYYY h:mm A');
                            }
                            this.collectionLongLatCode.push({lat: statusResult.items[i]['geocode']['latitude'], 
                                long: statusResult.items[i]['geocode']['longitude'],
                                code: statusResult.items[i]['orderStatusDescription']['code'],
                                color: statusResult.items[i]['orderStatusDescription']['color']})
                        
                                bounds.extend(new google.maps.LatLng({lat: statusResult.items[i]['geocode']['latitude'], lng: statusResult.items[i]['geocode']['longitude']}));
                        }
                        if (this.collectionLongLatCode.length < 1){
                            
                            bounds.extend(new google.maps.LatLng({lat: this.defaultLat, lng: this.defaultLong}));
                            this.getParentComponent().map.setZoom(15)
                        }
                        else{
                            this.getParentComponent().map.fitBounds(bounds)
                        }
                        
                    }
                    // this.formattedOrderPackageStatusTime=moment(statusResult.items['time']).utc().format('MM/DD/YYYY, h:mm a')
                    // this.primengTableHelper.totalRecordsCount = statusResult.totalCount;
                    this.spinnerService.hide()
                });
                
                 this.collectionOfLongLatCode.emit(this.collectionLongLatCode)
            }
        });    
        // this.collectionOfLongLatCode.emit(this.collectionLongLatCode)
    }

    getParentComponent() {
        return this.viewContainerRef[ '_data' ].componentView.component.viewContainerRef[ '_view' ].component
    }

    // getOrderStatusType(): void{
    //     this._orderStatusTypeAppService.getOrderStatusType(
    //         undefined,
    //         undefined,
    //         undefined,
    //         undefined,
    //         undefined,
    //         undefined,
    //         undefined
    //     ).pipe(finalize(() => this.spinnerService.hide())).subscribe(result => {
    //         this.orderStatusTypes=result.items;   
    //     });
    // }
    
    mapZoom(lat: any , long: any, index: any){
        var bounds = new google.maps.LatLngBounds();
        bounds.extend(new google.maps.LatLng({lat: lat, lng: long}));
        this.getParentComponent().map.fitBounds(bounds)
        this.zIndex.emit(index);
        this.getParentComponent().map.setZoom(50)
        // 19
    }

}