import { Component, OnInit, Input, EventEmitter, Output } from '@angular/core';
import { EventBody } from 'src/app/models/eventbody.model';
import { EventPerson } from 'src/app/models/eventperson.model';
import { ProcessesService } from 'src/app/services/processes.service';
import { NavigationEnd, Router } from '@angular/router';
import { LoginUserRespose } from 'src/app/models/user.model';
import { SortService } from 'src/app/services/functions/sort.service';
import { SessionStore } from 'src/app/store/session.service';
import { EventsService } from 'src/app/services/events.service';
import { EventoAprovacaoStore } from 'src/app/store/eventoaprovacao-store.service';
import { environment } from 'src/environments/environment';

@Component({
  selector: 'app-event-list',
  templateUrl: './event-list.page.html',
  styleUrls: ['./event-list.page.scss'],
})
export class EventListPage implements OnInit {
  // [desktop] event list to approve

  showLoader: boolean;
  eventsList: any = []

  eventPerson: EventPerson;
  eventBody: EventBody;
  categories: string[];
  serialnumber:string;
  loggeduser: LoginUserRespose;
  segment:string;
  eventoaprovacaostore = EventoAprovacaoStore;
  environment = environment
  color: 'pr' | 'mdgpr'
  SessionStore = SessionStore;

  @Input() profile:string;
  @Input() showComponent:string;
  @Output() cloneAllmobileComponent = new EventEmitter<any>();
  @Output() approveEventDismiss = new EventEmitter<any>();


  constructor(
    private processes:ProcessesService,
    private router: Router,
    private sortService: SortService,
    public eventService: EventsService,
    ) {
      this.loggeduser = SessionStore.user;
  }

  ngAfterViewInit(): void {
    this.eventService.onCalendarFinishLoad.subscribe(() => {
      if(!this.segment) {
        if(this.eventService.calendarNamesAry.includes('Meu calendario')) {
          this.segment = 'Meu calendario';
        } else {
          this.segment = this.eventService.calendarNamesAry[0].OwnerUserId
        }
  
        // select pr by default
        const pr = this.eventService.calendarNamesAry.find( e => e.Role == 'Presidente da República')
        if(pr) {
          this.segment = pr.OwnerUserId
        }
      }
    })
  }

  ngOnInit() {

    const pathname = window.location.pathname

    this.router.events.forEach((event) => {
      if(event instanceof NavigationEnd && event.url == pathname) {
        this.LoadToApproveEvents();
      }
    });
  }

  ngOnChanges() {
    this.LoadToApproveEvents();
    setTimeout(() => {
      this.LoadToApproveEventsNoLoader();
    }, 3000)
  }

  segmentChanged(ev: any) {
    this.LoadToApproveEvents();
  }

  toDateString(e) {
    return new Date(e).toDateString()
  }

  async LoadToApproveEvents() {


    if(SessionStore.user.Profile == 'PR') {
      return false
    }
    
    this.showLoader = true;

    const segment: any = this.segment

    if(this.segment == 'Meu calendario') {
      // color
      this.color = 'mdgpr'

      let genericEvents = await this.processes.eventsToApprove(SessionStore.user.UserId,'mobile agenda').toPromise()
      try {
        this.eventsList = this.sortService.sortArrayByDate(genericEvents).reverse();
      } catch (error) {
        this.eventsList = [];
        this.showLoader = false;
      }

      this.eventoaprovacaostore.save(segment, this.eventsList)
      
    } else if(segment) {
      // console.log('segment', segment)

      this.color = 'pr'
      let allEvents = await this.processes.eventsToApprove(segment,'agenda desktop').toPromise()
      try {
        this.eventsList = this.sortService.sortArrayByDate(allEvents).reverse();
      } catch(error) {
        this.eventsList = []
        this.showLoader = false;
      }
      
      this.eventsList = this.eventsList
      this.eventsList = this.eventsList
      this.eventoaprovacaostore.save(segment, this.eventsList)
    }

    this.showLoader = false;

  }

  async LoadToApproveEventsNoLoader() {
    
    this.LoadToApproveEvents()

  }

  async openApproveModal(eventSerialNumber, data) {

    this.approveEventDismiss.emit({
      "serialNumber": eventSerialNumber,
      "action": "Aprovar",
      "saveData": data
    });
  }

  refreshing() {
    this.LoadToApproveEvents();
  }

  doRefresh(event) {
    this.LoadToApproveEvents();
    
    setTimeout(() => {
      try {
  event?.target?.complete();
} catch(error) {}
    }, 2000);
  }

  close() {
    
    this.cloneAllmobileComponent.emit();
  }


}