import { Component, Injector, ViewChild, ViewEncapsulation, OnInit, DoCheck, Input, AfterViewInit } from '@angular/core';
import { appModuleAnimation } from '@shared/animations/routerTransition';
import { AppComponentBase } from '@shared/common/app-component-base';
import { OrderServiceProxy, OrderListDto, OrderListForView, OrderStatusAttachmentServiceProxy, AddressIdInput, ControllerRouteDetailServiceProxy,OrderNotificationsServiceProxy,OrgEmailInput} from '@shared/service-proxies/service-proxies';
import { LazyLoadEvent } from 'primeng/components/common/lazyloadevent';
import { Paginator } from 'primeng/components/paginator/paginator';
import { Table } from 'primeng/components/table/table';
import { finalize } from 'rxjs/operators';
import { ActivatedRoute, Router } from '@angular/router';
import { OrderAttachment } from './order-attachments.component';
import { EditOrderContactDetailModalComponent } from './edit-order-contact-detail-modal.component';
import * as moment from 'moment-timezone';
import { AddOrderStatusModalComponent } from '../order-status/add-order-status-modal.component';
import { DomSanitizer } from '@angular/platform-browser';
import { Location } from '@angular/common';
import { on } from 'devextreme/events';
import { EntityTypeHistoryModalComponent } from '@app/shared/common/entityHistory/entity-type-history-modal.component';
import * as _ from 'lodash';
import { ILatLng } from '@app/sprintship/fleet-management/driver-proximities/driver-proximities.directive';
declare var $: any;
declare var jquery: any;
@Component({
    selector: 'orderDetailComponent',
    templateUrl: './order-detail.component.html',
    encapsulation: ViewEncapsulation.None,
    animations: [appModuleAnimation()],
    styleUrls: ['./order-detail.component.less']
})
export class OrderDetailComponent extends AppComponentBase implements OnInit {

    zoom: number = 50;
    // initial center position for the map
    lat: number = 34.044971;
    lng: number = -118.291243;
    map: any;
    image: Array<{ src: string, caption: any, thumb: string }> = new Array();
    orderNumber: string;
    trackingId: string;
    @ViewChild('dataTable', { static: true }) dataTable: Table;
    @ViewChild('paginator', { static: true }) paginator: Paginator;
    @ViewChild('orderAttachment', { static: true }) orderAttachment: OrderAttachment;
    @ViewChild('addOrderStatusModal', { static: false }) addOrderStatusModal: AddOrderStatusModalComponent;
    @ViewChild('editOrderContactDetailModal', { static: true }) editOrderContactDetailModal: EditOrderContactDetailModalComponent;
    @ViewChild('entityTypeHistoryModal', { static: true }) entityTypeHistoryModal: EntityTypeHistoryModalComponent;
    _entityTypeFullName = 'SprintTek.Shipping.Orders.Order';
    entityHistoryEnabled = false;
    //Filters
    filterText = '';
    id: any;
    _isLab: any;
    _isFbx: any;
    _ukLocale: any;
    orderStatusLat: any
    orderStatusLong: any

    type = "orders"
    sampleDate: any

    deliveryDate: any;
    deliveryTime: any;
    pickupTime: any;
    pickupDate: any;
    createdDate:any;
    modifiedDate:any;

    collectionsLatLongCode: Array<{
        lat: any;
        long: any;
    }> = new Array<any>()

    statusIndex : any
    timeId: any
    collectionsCode: Array<any> = new Array<any>();
    saving: boolean
    vehicleName: string;
    routeCode: string;
    routeId: number;
    locationName: string;
    loadDate: string;
    track:string;
    onLoadTimeZone:string;
    tracking:string;
    clinicId:number;
    statusId:number;
    statusDescription:string;
    // destination: ILatLng = {
    //     latitude: 33.7078868,
    //     longitude: -117.9314313
    //   };

    //   waypoints: Array<ILatLng> = new Array<ILatLng>()


    //   origin: ILatLng = {
    //     latitude: 39.208974,
    //     longitude: -121.073627
    //   };

    orderDetails: OrderListForView = new OrderListForView();
    constructor(
        injector: Injector,
        private _orderAppService: OrderServiceProxy,
        private _attachmentService: OrderStatusAttachmentServiceProxy,
        private _controllerRouteDetails: ControllerRouteDetailServiceProxy,
        private _sendNotification: OrderNotificationsServiceProxy,
        public sanitizer: DomSanitizer,
        private _router: Router,
        private route: ActivatedRoute,
        private _location: Location,
        private router: Router
    ) {
        super(injector);
    }


    ngOnInit() {
        this.setIsEntityHistoryEnabled();
        this.timeId = localStorage.getItem('timeZoneId');
        // moment.tz.setDefault(this.timeId);
        this._isLab = abp.features.isEnabled('App.RouteDetails');
        this._isFbx = abp.features.isEnabled('App.FBXFeature');
        this._ukLocale = abp.features.isEnabled('App.DateFormatFeature.UKLocale');

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

      
        this._orderAppService.getOrderForView(
            this.id != null ? this.id : undefined,
            this.tracking !=null ? this.tracking : undefined,
            undefined
        ).pipe(finalize(() => this.spinnerService.hide())).subscribe(result => {
            this.orderDetails = result;
            // console.log(this.orderDetails)
            this.id = this.orderDetails.id

            this.statusId = this.orderDetails.statusId;
            this.statusDescription = this.orderDetails.statusDescription;
        this._attachmentService.getOrderStatusAttachmentList(this.orderDetails.id,undefined)
        
            .pipe(finalize(() => this.spinnerService.hide())).subscribe(result => {
                for (let index = 0; index < result.length; index++) {
                    this._attachmentService.getImageIdInternal(result[index].binaryObjectId).subscribe(image => {

                        
                        this.image.push({ src: 'data:image/jpeg;base64,' + image.pictureString, thumb: 'data:image/jpeg;base64,' + image.pictureString, caption:result[index].deviceTime.utcOffset(moment.parseZone(result[index].deviceTime).utcOffset()).format('LLL') });
                    });
                }
            });
            if (this._isLab) {
                this.lat = result.pickupLat;
                this.lng = result.pickupLong;
            }
            else {
                this.lat = result.deliveryLat;
                this.lng = result.deliveryLong;
            }
            // this.pickupTime = this.orderDetails.pickupTime.utcOffset(moment.parseZone(this.orderDetails.pickupTime).utcOffset()).format('LT');
            if(this._ukLocale){
                this.pickupTime = this.orderDetails.pickupTime.utcOffset(moment.parseZone(this.orderDetails.pickupTime).utcOffset()).format('D/M/YYYY h:mm A');
            }
            else{
                this.pickupTime = this.orderDetails.pickupTime.utcOffset(moment.parseZone(this.orderDetails.pickupTime).utcOffset()).format('M/D/YYYY h:mm A');
            }
            
            this.pickupDate = localStorage.getItem('loadDate');
            
            if(this._ukLocale){
                this.deliveryTime = this.orderDetails.deliveryTime.utcOffset(moment.parseZone(this.orderDetails.deliveryTime).utcOffset()).format('D/M/YYYY h:mm A');
                // console.log(this.deliveryTime)
                this.createdDate = this.orderDetails.createdDate.utcOffset(moment.parseZone(this.orderDetails.createdDate).utcOffset()).format('D/M/YYYY h:mm A');
                this.modifiedDate = this.orderDetails.modifiedDate.utcOffset(moment.parseZone(this.orderDetails.modifiedDate).utcOffset()).format('D/M/YYYY h:mm A');
            }
            else{
                this.deliveryTime =  this.orderDetails.deliveryTime == null ? "" : this.orderDetails.deliveryTime.utcOffset(moment.parseZone(this.orderDetails.deliveryTime).utcOffset()).format('M/D/YYYY h:mm A');
                this.createdDate = this.orderDetails.createdDate.utcOffset(moment.parseZone(this.orderDetails.createdDate).utcOffset()).format('M/D/YYYY h:mm A');
                this.modifiedDate = this.orderDetails.modifiedDate.utcOffset(moment.parseZone(this.orderDetails.modifiedDate).utcOffset()).format('M/D/YYYY h:mm A');
            }
            
            this.pickupDate = localStorage.getItem('loadDate');

           
            result.orderTags.forEach(element => {
                if (element.tag.tagType.name == "Order Number") {
                    this.orderNumber = element.tag.name
                }

                if (element.tag.tagType.name == "Tracking Identifier") {
                    this.trackingId = element.tag.name
                }
            });
            if(this.track == null){
                this.getDetails(result.routeId)
            }else{
                var element = document.querySelectorAll('.kt-login__aside')
                element[0].classList.add('w-adjust');
            }
            
        });

        
        if(this._isLab){
            this._orderAppService.getClinicSchedule(this.id
                ).pipe(finalize(() => this.spinnerService.hide())).subscribe(result => {
                    this.clinicId = result.clinicId;
                });
        }
        
    }

    private setIsEntityHistoryEnabled(): void {
        let customSettings = (abp as any).custom;
        this.entityHistoryEnabled = customSettings.EntityHistory && customSettings.EntityHistory.isEnabled && _.filter(customSettings.EntityHistory.enabledEntities, entityType => entityType === this._entityTypeFullName).length === 1;
    }

    showHistory(role: OrderListForView): void {
        this.entityTypeHistoryModal.show({
            entityId: role.id.toString(),
            entityTypeFullName: this._entityTypeFullName,
            entityTypeDescription: "Order Details - " +this._isLab ? role.pickupFirstName +" " +role.pickupLastName : role.deliveryFirstName +" " +role.deliveryLastName
        });
    }

    mapReady(event?: any) {
        this.map = event;
    }
    
    getDetails(routeId) {
        this._controllerRouteDetails.getControllerRouteDetail(routeId)
            .subscribe(result => {
                this.routeCode = result.routeTemplate.name;
                this.locationName = result.location.name;
                if (result.vehicle) {
                    this.vehicleName = result.vehicle.user.name + " " + result.vehicle.user.surname;
                }

                this.loadDate = localStorage.getItem('loadDate');
            });
    }

    activateProximity(id: number, 
                      name : string, 
                      surname : string, 
                      long : number, 
                      lat : number,
                      addressId : number, 
                      geocodeId : number ): void {
        this.message.confirm(
            this.l("ActivateProximityPrompt",[name,"",long,lat]),
            '',// this.l("ActivateProximity"),
            (isConfirmed) => {
                if (isConfirmed) {
                    this.saving = true
                    var data = new AddressIdInput;
                    data.geocodeId = geocodeId;
                    data.id = addressId;
                    data.orderId = id;
                    this._controllerRouteDetails.updateClinicGeocode(data)
                        .pipe(finalize(() => { this.saving = false; }))
                        .subscribe(() => {
                            this.ngOnInit();
                            this.notify.info(this.l('SavedSuccessfully'));
                        });
                }
            }
        );
    }


    // logLong(long){
    //     this.orderStatusLong = long
    //     console.log("loglong"+this.orderStatusLong)
    // }

    // logLat(lat){
    //     this.orderStatusLat = lat
    //     console.log("loglat"+this.orderStatusLat)
    // }

    collectedLatLongCode(collectionLatLongCode) {
        this.collectionsLatLongCode = collectionLatLongCode
        // console.log(this.collectionsLatLongCode)
    }

    catchzIndex(index){
        this.statusIndex = index;
        // console.log(index)
    }

    // collectedCode(collectionCode){
    //     this.collectionsCode = collectionCode
    //     console.log(this.collectionsCode)
    // }

    addOrderStatusModalShow() {
        this.addOrderStatusModal.show()
    }

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

    navOrder(id) {
        this.router.navigate(['/app/sprintship/controller-order-package-detail/', id]);
    }

    // mapZoom(lat: any, long: any) {
    //     var bounds = new google.maps.LatLngBounds();
    //     bounds.extend(new google.maps.LatLng({ lat: lat, lng: long }));
    //     this.map.fitBounds(bounds)
    //     this.map.setZoom(19)
    //     // console.log("zoom map")
    // }

    editOrderContactDetails(contact) : void {
        //alert(contactId);
        this.editOrderContactDetailModal.show(contact);
    }


    sendNotification(id:number){
        this.spinnerService.show();
        let data = new OrgEmailInput();
            data.orderId = id;
            data.orderStatusTypeId = this.statusId;

        

        if(this.statusId != null){
            this._sendNotification.notificationChecker(data).subscribe(result =>{
                if(result == true){
                    this._sendNotification.sendOrderStatusNotification(data).subscribe(result =>{
                        this.spinnerService.hide();
                        this.notify.info(this.l('Notification Sent'));
                    });
                } else {
                    this.spinnerService.hide();
                    this.message.info("Unable to send an email to the recipient because there is no order notification and email notification template that is configured for the status "+ this.statusDescription +".  Please create an order notification and email notification template first before proceeding.","Send Email Notification");
                }
            });
            
        } else {
            this.spinnerService.hide();
        }

        //
        
    }

}