import { Component, EventEmitter, Injector, ViewChild, Output,Input } from '@angular/core';
import { AppComponentBase } from '@shared/common/app-component-base';
import { ModalDirective } from 'ngx-bootstrap';
import { OrderServiceProxy, IncidentTypesServiceProxy, ListResultDtoOfIncidentTypeDto, OrderIncidentsServiceProxy, CreateOrderIncidentDto, AddMultipleOrderIncidentDto} from '@shared/service-proxies/service-proxies';
import { PrimengTableHelper } from 'shared/helpers/PrimengTableHelper';
import{HFRouteDetailComponent} from './hf-route-detail.component';
import { finalize } from 'rxjs/operators';
import { Paginator } from 'primeng/components/paginator/paginator';
import { Table } from "primeng/table";
import * as jquery from 'jquery';
import * as moment from 'moment';
// import * as DualListbox from 'dual-listbox';
@Component({
    templateUrl: './create-incidents-modal.component.html',
    selector: 'CreateIncidentsModal'
})
export class CreateIncidentsModal extends AppComponentBase {

   @ViewChild('createIncidentsModal', {static: false}) modal: ModalDirective;
   @Output() reloadTable: EventEmitter<any> = new EventEmitter<any>();
   @Input('selectedRouteId') selectedRouteId: number;
   @ViewChild("paginator", {static: true}) paginator: Paginator;
   @ViewChild("dataTable", {static: true}) dataTable:Table;
//    @Input() updateTable:Function

    reload:boolean = false;
    active = false;
    saving = false;
    incidentTypes : ListResultDtoOfIncidentTypeDto = new ListResultDtoOfIncidentTypeDto();
    //moveInput: ControllerMoveOrderInput = new ControllerMoveOrderInput();
    orderIds: any;
    newOrderIncidents: Array<any> = [];
    orderIncidentsInput: AddMultipleOrderIncidentDto = new AddMultipleOrderIncidentDto;
    //content: string;
    typesId: number;
    constructor(
        injector: Injector,
        private _controllerOrderService: OrderServiceProxy,
        private _incidentTypesService: IncidentTypesServiceProxy,
        private _orderIncidentsService : OrderIncidentsServiceProxy
    ) {
        super(injector);
    }

    ngOnInit(){
        
    }

    show():void {
        
        this._incidentTypesService.getAllIncidentType().subscribe(result=>{
            this.incidentTypes = result;

            //console.log(result);
        });
        this.active = true;
        this.modal.show();
        
    }

    onShown(): void {
        let e = this;
        $('.kt-select2').select2();
        // $('#selectedRouteId').on('select2:select', function (v) {
        //     if($('#orderListIds').val() !== ""){
        //         e.moveOrders(Number((<HTMLInputElement>document.getElementById('selectedRouteId')).value),$('#orderListIds').val());
        //     } else{
        //         e.notify.info(e.l('Select orders to move'));
        //     }
            
        // });
        
    }

    applySave(){
        //this.newOrderIncidents = [];
        var loadDate = localStorage.getItem('loadDate');
        let array = $('#orderListIds').val();
        this.orderIds = (<string>array).split(',');
        let that = this;
        let content = $('#content').val();
        that.typesId = Number($('#selectedIncidentTypeId').val());
        this.orderIds.forEach(function (value, i) {

            let createOrderIncident = new CreateOrderIncidentDto({
                   orderId: parseInt(value),
                   incidentTypeId: that.typesId,
                   geocodeId: 0,
                   content: String(content),
                   incidentDate: moment.utc(moment(loadDate).format('YYYY-MM-DD h:m a')),
                   id: undefined
            });

            that.newOrderIncidents.push(createOrderIncident); 
        });


        that.orderIncidentsInput = new AddMultipleOrderIncidentDto({
            createOrderIncidentDto: that.newOrderIncidents
        });

        console.log(that.orderIncidentsInput);
        this._orderIncidentsService.addMultipleOrderIncident(that.orderIncidentsInput).subscribe(result=>{
            this.newOrderIncidents = [];
            this.close();
        });
        
       
    }


    

    close(): void {
        this.active = false;
        this.modal.hide();
        this.reload = true;
        this.reloadTable.emit(this.reload);
        
    }
}