import { Component, Injector, OnInit, ViewChild, ViewEncapsulation, Input, TemplateRef, Output, EventEmitter } 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 { ControllerRouteDetailServiceProxy, UpdateRouteInput, RouteServiceProxy } from '@shared/service-proxies/service-proxies';
import { RouteDetailModal } from './route-detail-modal.component';
import { MovePendingOrder } from './move-order-modal.component';
import { CreateIncidentsModal } from './create-incidents-modal.component';
import { AppSessionService } from '@shared/common/session/app-session.service';
import * as moment from 'moment';
import { Table } from "primeng/table";
import { LazyLoadEvent } from "primeng/primeng";
import { Paginator } from 'primeng/components/paginator/paginator';
import { HttpClient } from '@angular/common/http';
import { finalize } from 'rxjs/operators';
import * as _ from 'lodash';

import { MessageService } from 'primeng/api';

import * as signalR from '@aspnet/signalr';
import {Location} from '@angular/common';

declare var $: any;
declare var jquery: any;
@Component({
    templateUrl: 'route-detail.component.html',
    encapsulation: ViewEncapsulation.None,
    styleUrls: ['./route-detail.component.less'],
    animations: [appModuleAnimation()],
    selector: 'routeDetailComponent',
    providers: [MessageService]
})

export class RouteDetailComponent extends AppComponentBase implements OnInit {
    saving = false;
    routeId: number = null;
    details: boolean = false;
    _isLab: boolean = false;
    routeCode: string;
    vehicleName: string;
    loadDate: Date;
    locationName: string;
    reload: any;
    route: UpdateRouteInput = new UpdateRouteInput();
    routeDetailTenant:string = 'STANDARD';

    @ViewChild('routeDetailModal', { static: true }) routeDetailModal: RouteDetailModal;
    @ViewChild('movePendingOrderModal', { static: true }) movePendingOrderModal: MovePendingOrder;
    @ViewChild('createIncidentsModal', { static: true }) createIncidentsModal: CreateIncidentsModal;
    // @Input() hfRouteDetails: TemplateRef<any>;
    @Input() labRouteDetails: any;
    @ViewChild("dataTable", { static: true }) dataTable: Table
    @ViewChild("paginator", { static: true }) paginator: Paginator
    @Output() reloadTable: EventEmitter<any> = new EventEmitter<any>();
    // locations: LocationListDto[] = [];
    constructor(
        injector: Injector,
        private id: ActivatedRoute,
        private _controllerRouteDetails: ControllerRouteDetailServiceProxy,
        private _controllerRoute: RouteServiceProxy,
        private _appSessionService: AppSessionService,
        private messageService: MessageService,
        private _location:Location
        // private _routeService: RouteServiceProxy

    ) {
        super(injector);

        this._isLab = abp.features.isEnabled('App.RouteDetails');
        if(this._isLab){
            this.routeDetailTenant = 'LAB';
        }
        this.id.paramMap.subscribe(params => {
            this.routeId = Number(params.get('id'));
        });
    }

    ngOnInit(): void {
       
        this.primengTableHelper.showLoadingIndicator();
        this.getDetails();

        // const connection = new signalR.HubConnectionBuilder()
        //     .configureLogging(signalR.LogLevel.Information)
        //     .withUrl("http://localhost:65302/location")
        //     .build();

        // connection.start().then(function () {
        //     console.log('Connecteddfsdfsdf!');
        // }).catch(function (err) {
        //     return console.error(err.toString());
        // });

        //   connection.on("GetLocation", (latitude: string,longitude: string) => {
        //     this.messageService.add({ severity: 'success', summary: 'Success Message', detail: 'Notificiation' });
        // });
    }

    getDetails() {
        this._controllerRouteDetails.getControllerRouteDetail(this.routeId)
            .subscribe(result => {
                this.routeCode = result.routeTemplate.name;
                this.route.vehicleId = result.vehicleId;
                this.route.completion = result.completion;
                this.route.departure = result.departure;
                this.route.loadDate = result.loadDate;
                this.route.locked = result.locked;
                this.route.routeTemplateId = result.routeTemplateId;
                this.route.locationId = result.locationId;
                this.route.id = this.routeId;
                this.locationName = result.location.name;
                if (result.vehicle) {
                    this.vehicleName = result.vehicle.name;
                }
                this.loadDate = moment(result.loadDate).toDate();
                this.labRouteDetails = result.routeTemplate.name;
            });
    }

    updateRoute() {
        this._controllerRoute.updateRoute(this.route)
            .pipe(finalize(() => this.saving = false))
            .subscribe(() => {
                this.notify.info(this.l('SavedSuccessfully'));
            });
    }

    setDeparture() {
        if (!this.route.locked) {
            if (this.route.departure) {
                this.route.departure = null;
            } else {
                this.route.departure = moment.utc(moment(new Date()).format('YYYY-MM-DD h:m a'));
            }
            this.updateRoute();
        } else {
            this.notify.info(this.l('Unlocked Loadlist First'));
        }


    }

    setCompletion() {
        if (!this.route.locked) {
            if (this.route.completion) {
                this.route.completion = null;
            } else {
                this.route.completion = moment.utc(moment(new Date()).format('YYYY-MM-DD h:m a'));
            }
            this.updateRoute();
        } else {
            this.notify.info(this.l('Unlocked Loadlist First'));
        }

    }

    ngAfterViewInit() {

        $('.kt-select2').select2();
        $('.selectpicker').selectpicker();
    }

    loadTable($event) {
        this.reload = $event;
    }

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

    onShown() {

    }


}