import {
   Component,
   EventEmitter,
   Injector,
   Output,
   ViewChild
} from '@angular/core';
import {
   AppComponentBase
} from '@shared/common/app-component-base';
import {
   IncidentServiceProxy,
   DriverIncidentServiceProxy,
   UserServiceProxy,
   CreateDriverIncidentInput,
   UpdateDriverIncidentInput,
   CreateIncidentInput,
   UpdateIncidentInput,
   GeocodeServiceProxy,
   UpdateGeocodeInput,
   CreateGeocodeInput,
   UserListDto
} from '@shared/service-proxies/service-proxies';
import {
   ModalDirective
} from 'ngx-bootstrap';
import * as _ from 'lodash';
import {
   finalize
} from 'rxjs/operators';
import * as moment from 'moment';
import { Content } from '@angular/compiler/src/render3/r3_ast';

@Component({
   selector: 'createOrEditDriverIncidentModal',
   templateUrl: './create-or-edit-driver-incident.component.html',
   styles: [`.user-edit-dialog-profile-image {
            margin-bottom: 20px;
       }`]
})
export class CreateOrEditDriverIncidentModalComponent extends AppComponentBase {

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

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

   isCreate: boolean = false;
   active = false;
   saving = false;
   
   driverIncident: {
      id:number,
      userId: number,
      incidentId:number,
      content: any,
      incidentDate:any,
      incidentTime: any,
      latitude: any,
      longitude: any,
      geocodeId: number
   }= <any>{};

   users: UserListDto[] = [];

   userInput: any;

   constructor(
      injector: Injector,
      private _driverIncidentServiceProxy: DriverIncidentServiceProxy,
      private _incidentServiceProxy: IncidentServiceProxy,
      private _userServiceProxy: UserServiceProxy,
      private _geocodeServiceProxy: GeocodeServiceProxy
   ) {
      super(injector);
   }
   onShown(): void {
      $('.kt-select2').select2();
   }
   show(id?: any): void {
      let maxcount = 1000;
      this.isCreate = id ? false: true;
      this.active = true;

      if (!this.isCreate) 
      {
         this._driverIncidentServiceProxy
         .getDriverIncident(id, undefined, undefined,undefined, undefined, undefined, undefined)
            .subscribe(result => {
               
               let res = result.items[0];
               console.log(res);
               this.driverIncident.id = res.id;
               this.driverIncident.content = res.incident.content;
               this.userInput= res.user.id;
               this.driverIncident.incidentId = res.incident.id;
               this.driverIncident.incidentDate = moment.utc(this.driverIncident.incidentDate).toDate();
               this.driverIncident.incidentTime = moment.utc(this.driverIncident.incidentDate).toDate();
               this.driverIncident.latitude = res.incident.geocode.latitude;
                this.driverIncident.longitude = res.incident.geocode.longitude;
                this.driverIncident.geocodeId = res.incident.geocodeId;
               this.showAllUsers(maxcount);
               this.modal.show();
            });
      } 
      else 
      {
         this.clearField();
         this.userInput = null;
         this.showAllUsers(maxcount);
         this.modal.show();
      }
   }

   create(): void {
      this.saving = true;
      let geocodeInput = new CreateGeocodeInput({
         latitude: this.driverIncident.latitude,
         longitude: this.driverIncident.longitude
      });
      this._geocodeServiceProxy.createGeocode(geocodeInput)
      .subscribe(
         success => {
            this.driverIncident.geocodeId = success;
            let incidentInput = new CreateIncidentInput({
               geocodeId : this.driverIncident.geocodeId,
               content : this.driverIncident.content,
               incidentDate : moment.utc(moment(this.driverIncident.incidentDate).format('YYYY-MM-DD') + ' ' + moment(this.driverIncident.incidentTime).format('HH:mm:ss'))
            });
            console.log(incidentInput);
            this._incidentServiceProxy.createIncident(incidentInput)
            .subscribe(
               success => {
                  this.driverIncident.incidentId = success;
                  let input = new CreateDriverIncidentInput({
                     incidentId: this.driverIncident.incidentId,
                     userId:  Number((<HTMLInputElement>document.getElementById('userInput')).value)
                  });
                  this._driverIncidentServiceProxy.createDriverIncident(input)
                  .pipe(finalize(()=> {
                     this.saving = false;
                    
                  }))
                  .subscribe(()=> {
                     this.alertSaveSuccess();
                  });
               },
               error=> {
                  this.saving = false;
               })
         },
        error=> {
           this.saving = false;
        });
   }


   update(): void {
      this.saving = true;

      let geocodeInput = new UpdateGeocodeInput({
         id: this.driverIncident.geocodeId,
         latitude: this.driverIncident.latitude,
         longitude: this.driverIncident.longitude
      });
      console.log(geocodeInput);
      this._geocodeServiceProxy.updateGeocode(geocodeInput)
      .pipe(finalize(()=>{
         this.saving = false;
      }))
      .subscribe(()=>{
         let incidentInput = new UpdateIncidentInput({
            id: this.driverIncident.incidentId,
            content: this.driverIncident.content,
            incidentDate : moment.utc(moment(this.driverIncident.incidentDate).format('YYYY-MM-DD') + ' ' + moment(this.driverIncident.incidentTime).format('HH:mm:ss')),
            geocodeId: this.driverIncident.geocodeId
         });
         console.log(incidentInput);
         this._incidentServiceProxy.updateIncident(incidentInput)
         .pipe(finalize(()=>{
            this.saving = false;
         }))
         .subscribe(()=>{
            let input = new UpdateDriverIncidentInput({
               id: this.driverIncident.id,
               incidentId: this.driverIncident.incidentId,
               userId: Number((<HTMLInputElement>document.getElementById('userInput')).value)
            });
            console.log(input);
            this._driverIncidentServiceProxy.updateDriverIncident(input)
            .pipe(finalize(()=> {
               this.saving = false;
            }))
            .subscribe(()=>{
               this.alertSaveSuccess();
            });
            this.alertSaveSuccess();
         });
      });

      // let input = new UpdateIncidentInput({
      //    id : this.driverIncident.incidentId,
      //    content: this.driverIncident.content,
      //    incidentDate: this.driverIncident.incidentDate,
      //    geocodeId: this.driverIncident.geocodeId
      // });
      // this._incidentServiceProxy.updateIncident(input)
      //    .pipe(finalize(()=> {
      //       this.saving = false;
      //    }))
      //    .subscribe(()=> {

      //       let input = new UpdateDriverIncidentInput({
      //          id: this.driverIncident.id,
      //          incidentId: this.driverIncident.incidentId,
      //          userId: Number((<HTMLInputElement>document.getElementById('userInput')).value)
      //       });
      //       this._driverIncidentServiceProxy.updateDriverIncident(input)
      //       .pipe(finalize(()=> {
      //          this.saving = false;
      //       }))
      //       .subscribe(()=> {
      //          this.alertSaveSuccess();
      //       });

      //       this.alertSaveSuccess();
         
      //    });
   }

   alertSaveSuccess(): void {
      this.notify.info(this.l('SavedSuccessfully'));
      this.modalSave.emit(null);
      this.close();
   }

   showAllUsers(maxcount) : void {
      this.active = true;
      this._userServiceProxy.getUsers(undefined,undefined,undefined, undefined, undefined, maxcount, undefined).subscribe((result) => {
         this.users = result.items;
 
     });
 
   }

   clearField(): void {
      this.driverIncident.content = null;
      this.driverIncident.incidentDate = null;
      this.driverIncident.longitude = null;
      this.driverIncident.latitude = null;
      this.userInput = null;
      this.driverIncident.incidentTime = null;
   }

   close(): void {
      this.active = false;
      this.modal.hide();
   }
}