import { Component, OnInit, ViewChild } from '@angular/core';
import { Location } from '@angular/common';
import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
import { CommonService } from 'src/app/hmg-common/services/common/common.service';
import { AuthenticationService } from 'src/app/hmg-common/services/authentication/authentication.service';
import { MenuResponse } from 'src/app/hmg-common/services/menu/models/menu-response';
import { MyTeamService } from '../service/my-team.service';
import { MenuService } from 'src/app/hmg-common/services/menu/menuservice.service';
import { ModalController } from '@ionic/angular';
import { IonInfiniteScroll } from '@ionic/angular';
import * as moment from 'moment';
import { TimeCardService } from 'src/app/time-card/service/time-card.service';
import { GetDayAndHoursDetailsRequest } from 'src/app/time-card/service/models/get-day-hours-type-details.request';
import { GetTimeCardSummaryRequest } from 'src/app/time-card/service/models/get-time-card-summary.request';
import { DashboredService } from 'src/app/hmg-common/services/dashbored/dashbored.service';
import { AttendanceTrackingResponse } from 'src/app/hmg-common/services/dashbored/attendance-tracking.response';
@Component({
  selector: 'app-details',
  templateUrl: './details.component.html',
  styleUrls: ['./details.component.scss']
})

export class DetailsComponent implements OnInit {
  public static opendEmployeesARR = 'opend_employees_arr';
  @ViewChild(IonInfiniteScroll) infiniteScroll: IonInfiniteScroll;
  public activeSegment = 'Attendance';
  pageNum = 1;
  pageLimit = 50;
  empSubordinate: any;
  employee: any;
  isReachEnd = false;
  searchKey: any;
  public isSearch = false;
  public searchKeySelect = 'Name';
  public getEmployeeSubordinatesRequestObject: any;
  infiniteRequest: any;
  isSpecialist = false;
  selMenu: MenuResponse = new MenuResponse();
  public opendEmployees: any = [];
  public headerTitle = '';
  public userImage: any = '../assets/imgs/profile.png';
  public menuType: any;
  public selEmp: string;
  public dateFrom: any = new Date();
  public dateTo: any = new Date();
  public respID: number;
  public timeCardSummaryData: any = [];
  public dayHoursData: any = [];
  public selectedShift: any;
  public dayAndHoursPageNumber = 1;
  public monthName: any;
  public yearDate: any;
  public absentDays: number;
  public attendedDays: number;
  public futrueDays = 0;
  public totalAttendancePrecentage = 0;
  public arrDaysAttendance: any = [];
  public arrDaysAbsent: any = [];
  public arrDaysOff: any = [];
  public normalDays: any = [];
  public monthTitle: string = moment().format('MMMM');
  public yearTitle: string;
  public activeMonth: any;
  public currentMonthName = this.getMonthName(new Date().getMonth() + 1);
  public showData = false;
  public currentYear = new Date().getFullYear();
  public attendanceTrackingList: any = [];
  public currentDate = new Date();
  public dayHoursTypeDetailsList = [];
  month: any;
  year: any;
  preMonth: number;
  nextMonth: any;

  public options = {
    cutoutPercentage: 80,
    tooltips: { enabled: false },
    legend: { display: false }
  };

  public data = {};

  public previousActiveIndex = 0;
  public currentActiveIndex = 0;
  public searchNameOrUserName = '';
  public searchEmail = '';
  public showEmailInput = false;
  public showUserNameOrNameInput = true;

  constructor(
    public timeCardService: TimeCardService,
    public menuService: MenuService,
    public common: CommonService,
    public myTeamService: MyTeamService,
    public ts: TranslatorService,
    public modalController: ModalController,
    private location: Location,
    public authService: AuthenticationService,
    public dashboardService: DashboredService,
  ) { }

  ngOnInit() {
    this.intializeMemberDetail();
    this.showAttendanceTracking();
  }

  showAttendanceTracking() {
    this.employee = this.common.sharedService.getSharedData(MyTeamService.EMPLOYEE_SHARED_DATA, false);
    const request = {
      P_SELECTED_EMPLOYEE_NUMBER: this.employee.EMPLOYEE_NUMBER
    };
    this.dashboardService.getAttendanceTracking(request).subscribe((result: AttendanceTrackingResponse) => {
        if (this.common.validResponse(result)) {
          const key = 'GetAttendanceTrackingList';
          this.attendanceTrackingList = result[key];
        }
      });
  }

  public segmentChanged(event: any) {
    this.activeSegment = event.detail.value;
    if (this.activeSegment === 'Attendance') {
      this.normalDays = [];
      this.initAttendance();
    }
  }

  initAttendance() {
    this.data = {};
    this.currentMonthName = this.getMonthName(new Date().getMonth() + 1);
    this.currentYear = new Date().getFullYear();
    this.currentDate = new Date();
    this.showData = false;
    this.nextMonth = new Date().getMonth() + 2;
    this.preMonth = new Date().getMonth() - 2;
    if (this.preMonth < 0) {
      this.preMonth = this.preMonth * - 1;
    } else {
      this.preMonth = this.preMonth * - 1;
    }
    this.calendarConfig(this.getMonthName(new Date().getMonth() + 1) , new Date().getFullYear());
  }

  calendarConfig(month?, year?) {
    this.arrDaysOff = [];
    this.arrDaysAttendance = [];
    this.arrDaysAbsent = [];
    this.month = month;
    this.year = year;
    this.getTimeCardSummaryDetails(month, year);
    this.getDayHoursTypeDetails(month, year);
  }

  public getDayHoursTypeDetails(month?, year?) {
    console.log('getDayHoursTypeDetails');
    const dayAndHoursReqObj = new GetDayAndHoursDetailsRequest();
    this.monthName = month;
    this.yearDate = year;
    this.selEmp = this.common.sharedService.getSharedData(MenuResponse.SHARED_SEL_EMP, false);
    this.respID = this.common.sharedService.getSharedData(MenuResponse.SHARED_SEL_RESP_ID, false);
    this.selMenu = this.common.sharedService.getSharedData(MenuResponse.SHARED_DATA, false);
    this.menuType = this.selMenu.List_Menu.MENU_TYPE;

    dayAndHoursReqObj.P_SELECTED_EMPLOYEE_NUMBER = this.employee.EMPLOYEE_NUMBER;
    dayAndHoursReqObj.P_MENU_TYPE = 'M';
    dayAndHoursReqObj.P_SELECTED_RESP_ID = this.respID;
    dayAndHoursReqObj.SearchMonth = this.monthName;
    dayAndHoursReqObj.SearchYear = this.yearDate;
    dayAndHoursReqObj.P_PAGE_NUM = this.dayAndHoursPageNumber;
    dayAndHoursReqObj.P_PAGE_LIMIT = 100;

    this.timeCardService.getDayHoursTypeDetails(dayAndHoursReqObj).subscribe((result) => {
      if (this.common.validResponse(result)) {
        console.log(result.GetDayHoursTypeDetailsList);
        this.common.sharedService.setSharedData(result.GetDayHoursTypeDetailsList, 'RTP_IDs');
        this.countAllAttendDays(result.GetDayHoursTypeDetailsList);
        this.dayHoursTypeDetailsList = result.GetDayHoursTypeDetailsList;
      }
    });

  }

  nextSlide() {
    this.normalDays = [];
    if (this.currentMonthName !== this.month) {
        this.showData = false;
        if (this.nextMonth > 12) {
              this.currentYear = this.currentYear + 1;
              this.nextMonth = 1;
        }
        this.currentDate = new Date(this.currentYear, (this.nextMonth - 1), 1);
        this.calendarConfig(this.getMonthName(this.nextMonth) , this.currentYear);
        this.nextMonth = this.nextMonth + 1;
        this.preMonth = this.nextMonth - 2;
    }
  }

  previousSlide() {
    this.normalDays = [];
    this.showData = false;
    if (this.preMonth === 0) {
        this.currentYear = this.currentYear - 1;
        this.preMonth = 12;
    }
    this.currentDate = new Date(this.currentYear, (this.preMonth - 1), 1);
    console.log(this.currentDate);
    this.calendarConfig(this.getMonthName(this.preMonth) , this.currentYear);
    this.preMonth = this.preMonth - 1;
    this.nextMonth = this.preMonth + 2;
  }


  changeMonthTitle(title) {
    this.monthTitle = title;
    this.getTimeCardSummaryDetails();
  }
  changeYear(year) {
    this.yearTitle = year;
  }

  countAllAttendDays(allDays) {
    // tslint:disable-next-line:prefer-for-of
    for (let i = 0; i < allDays.length; i++) {
      // tslint:disable-next-line: triple-equals
      if (allDays[i].ATTENDED_FLAG == 'Y') {
        allDays[i].present = true;
        allDays[i].absent = false;
        allDays[i].daysOff = false;
        allDays[i].schedule = false;
        this.arrDaysAttendance.push({
          startTime: new Date(allDays[i].SCHEDULE_DATE),
          endTime: new Date(allDays[i].SCHEDULE_DATE)
        });
      // tslint:disable-next-line: triple-equals
      } else if (allDays[i].ATTENDED_FLAG == 'N' && allDays[i].ABSENT_FLAG == 'Y') {
        allDays[i].present = false;
        allDays[i].absent = true;
        allDays[i].daysOff = false;
        allDays[i].schedule = false;
        this.arrDaysAbsent.push({
          startTime: new Date(allDays[i].SCHEDULE_DATE),
          endTime: new Date(allDays[i].SCHEDULE_DATE),
          isoTime: '09:00:00',
          allDay: false
        });
      // tslint:disable-next-line: triple-equals
      } else if (allDays[i].ATTENDED_FLAG == 'N' && allDays[i].DAY_TYPE === 'OFF') {
        allDays[i].present = false;
        allDays[i].absent = false;
        allDays[i].daysOff = true;
        allDays[i].schedule = false;
        this.arrDaysOff.push({
          startTime: new Date(allDays[i].SCHEDULE_DATE),
          endTime: new Date(allDays[i].SCHEDULE_DATE)
        });
      } else {
        allDays[i].present = false;
        allDays[i].absent = false;
        allDays[i].daysOff = false;
        allDays[i].schedule = true;
        this.normalDays.push({
          startTime: new Date(allDays[i].SCHEDULE_DATE),
          endTime: new Date(allDays[i].SCHEDULE_DATE)
        });
      }
    }
    this.showData = true;
  }

  public getTimeCardSummaryDetails(month?, year?) {
    const timeCardSummaryReqObj = new GetTimeCardSummaryRequest();
    this.monthName = month;
    this.yearDate = year;

    this.selEmp = this.common.sharedService.getSharedData(MenuResponse.SHARED_SEL_EMP, false);
    this.respID = this.common.sharedService.getSharedData(MenuResponse.SHARED_SEL_RESP_ID, false);
    this.selMenu = this.common.sharedService.getSharedData(MenuResponse.SHARED_DATA, false);
    this.menuType = this.selMenu.List_Menu.MENU_TYPE;

    timeCardSummaryReqObj.P_SELECTED_EMPLOYEE_NUMBER = this.employee.EMPLOYEE_NUMBER;
    timeCardSummaryReqObj.P_MENU_TYPE = 'M';
    timeCardSummaryReqObj.P_SELECTED_RESP_ID = this.respID;
    timeCardSummaryReqObj.SearchMonth = this.monthName;
    timeCardSummaryReqObj.SearchYear = this.yearDate;

    this.timeCardService.getTimeCardSummary(timeCardSummaryReqObj).subscribe((result) => {
      if (this.common.validResponse(result)) {

        this.timeCardSummaryData = result.GetTimeCardSummaryList[0];
        this.absentDays = this.timeCardSummaryData.ABSENT_DAYS;
        this.attendedDays = this.timeCardSummaryData.ATTENDED_DAYS;

        // this.totalAttendancePrecentage = this.timeCardSummaryData.PERIOD_DAYS - this.timeCardSummaryData.OFF_DAYS;
        // if (this.absentDays === 0 && this.attendedDays === 0) {
        //   this.futrueDays = this.totalAttendancePrecentage;
        // }
        this.totalAttendancePrecentage = this.absentDays + this.attendedDays;
        if (this.totalAttendancePrecentage > 0) {
          this.data = {
            datasets: [
              {
                data: [this.absentDays, this.attendedDays],
                backgroundColor: [
                  '#094875',
                  '#22c6b3'
                ],
                borderWidth: 2
              }]
          };
        }
      }
    });
  }

  public getMonthName(value: any): any {
    switch (value) {
      case 1:
        return 'January';
      case 2:
        return 'February';
      case 3:
        return 'March';
      case 4:
        return 'April';
      case 5:
        return 'May';
      case 6:
        return 'June';
      case 7:
        return 'July';
      case 8:
        return 'August';
      case 9 :
        return 'September';
      case 10:
        return 'October';
      case 11:
        return 'November';
      case 12:
        return 'December';

    }
  }

  intializeMemberDetail(userID?) {
    this.empSubordinate = [];
    this.activeSegment = 'About';
    this.pageLimit = 50;
    this.pageNum = 1;
    this.employee = this.common.sharedService.getSharedData(MyTeamService.EMPLOYEE_SHARED_DATA, false);
    const employees = this.common.sharedService.getSharedData( DetailsComponent.opendEmployeesARR, false);
    if ( employees ) {
      this.opendEmployees.push(this.employee);
      this.common.sharedService.setSharedData(this.opendEmployees, DetailsComponent.opendEmployeesARR);
    }
    this.selMenu = this.common.sharedService.getSharedData(MenuResponse.SHARED_DATA, false);
    this.headerTitle = this.selMenu.List_Menu.MENU_NAME;
    this.isSpecialist = this.common.sharedService.getSharedData('isSpecialist', false) ? true : false;
    if (this.employee) {
      this.getEmpSubordinate(userID);
    }
  }


  goback() {
    const user = this.authService.getAuthenticatedUser();
    if (this.employee.SUPERVISOR_NUMBER === user.EMPLOYEE_NUMBER || this.opendEmployees.length === 1) {
      this.opendEmployees = [];
      this.common.openMyTeamPage();
    } else {
      // tslint:disable-next-line: prefer-for-of
      for (let i = 0; i < this.opendEmployees.length; i++) {
      if (this.opendEmployees[i].EMPLOYEE_NUMBER === this.employee.SUPERVISOR_NUMBER) {
        this.common.sharedService.setSharedData(
          this.opendEmployees[i],
          MyTeamService.EMPLOYEE_SHARED_DATA
        );
        break;
      }
    }
      this.intializeMemberDetail(this.employee.SUPERVISOR_NUMBER);
    }
  }

  searchEmployeeTwo() {
    this.isSearch = true;
    this.empSubordinate = [];
    this.getEmpSubordinate('');
  }

  clearSearchTwo() {
    this.isSearch = false;
    this.getEmployeeSubordinatesRequestObject.P_PAGE_NUM = 1;
    this.empSubordinate = [];
    this.isReachEnd = false;
    this.searchNameOrUserName = '';
    this.searchEmail = '';
    this.getEmpSubordinate('');
  }

  getEmpSubordinate(userID) {
    let selEmpNo: string = null;
    this.pageNum = 1;
    this.isReachEnd = false;
    const searchEmpNum = (this.searchKeySelect === 'User Name') ? this.searchNameOrUserName : '';
    const searchEmpName = (this.searchKeySelect === 'Name') ? this.searchNameOrUserName : '';
    const searchEmpEmail = (this.searchKeySelect === 'Email') ? this.searchEmail : '';
    if (userID) {
      selEmpNo = userID;
    } else {
    selEmpNo = this.employee.EMPLOYEE_NUMBER;
  }
    const body = {
      P_SELECTED_EMPLOYEE_NUMBER: selEmpNo,
      P_SEARCH_EMPLOYEE_NUMBER: searchEmpNum,
      P_SEARCH_EMPLOYEE_DISPLAY_NAME: searchEmpName,
      P_SEARCH_EMAIL_ADDRESS: searchEmpEmail,
      P_PAGE_NUM: this.pageNum,
      P_PAGE_LIMIT: this.pageLimit
    };
    this.getEmployeeSubordinatesRequestObject = body;
    this.myTeamService.getEmployeeSubordinates(body).subscribe((result: any) => {
      console.log('one');
      if (this.common.validResponse(result)) {
          this.handleEmpResult(result.GetEmployeeSubordinatesList);
        }
    });
  }

  handleEmpResult(result) {
    const lastItemIndex = result.length - 1;
    const lastItem = result[lastItemIndex];
    if (lastItem) {
      if (lastItem.NO_OF_ROWS === lastItem.ROW_NUM) {
        this.isReachEnd = true;
        if (this.infiniteScroll) {
          this.infiniteScroll.complete();
        }
      } else {
        this.isReachEnd = false;
        if (this.infiniteScroll) {
          this.infiniteScroll.complete();
        }
      }
    }
    if (this.common.hasData(result)) {
      this.getEmployeeSubordinatesRequestObject.P_PAGE_NUM++;
      if (this.empSubordinate.length === 0) {
        this.empSubordinate = result;
      } else {
        this.empSubordinate = this.empSubordinate.concat(result);
      }
    } else {
      this.empSubordinate = [];
    }
}

doInfinite(infiniteScroll) {
  if (!this.isReachEnd) {
    this.myTeamService.getEmployeeSubordinates(this.getEmployeeSubordinatesRequestObject).subscribe((result: any) => {
        console.log('two');
        if (this.common.validResponse(result)) {
          this.handleEmpResult(result.GetEmployeeSubordinatesList);
        }
        this.infiniteScroll.complete();
      });
  } else {
    if (this.infiniteScroll) {
     this.infiniteScroll.complete();
    }
  }
}

  getDetails(index) {
    this.common.sharedService.setSharedData(this.empSubordinate[index], MyTeamService.EMPLOYEE_SHARED_DATA);
    this.intializeMemberDetail();
  }

  getMenuEntries(item) {
    let selEmpNo = null;
    const respID: any = -999;
    let menuType = 'M';
    let nationality: string;
    if (this.isSpecialist === true) {
      menuType = 'S';
    }
    selEmpNo = item.EMPLOYEE_NUMBER;
    nationality = item.NATIONALITY_CODE;

    const body = {
      P_MENU_TYPE: menuType, // to check
      P_SELECTED_EMPLOYEE_NUMBER: selEmpNo,
      P_SELECTED_RESP_ID: respID,
      NationalityCode: nationality
    };
    // set emp and resp id
    this.common.sharedService.setSharedData(selEmpNo, MenuResponse.SHARED_SEL_EMP);
    this.common.sharedService.setSharedData(
      body.P_SELECTED_RESP_ID,
      MenuResponse.SHARED_SEL_RESP_ID
    );
    this.menuService.getMenuEntires(body).subscribe((result: MenuResponse) => {
      this.handleMenuEntiresResult(result);
    });
  }

  private handleMenuEntiresResult(result) {
    if (this.common.validResponse(result)) {
      if (this.common.hasData(result.GetMenuEntriesList)) {
        this.sortMenuEntires(result.GetMenuEntriesList);
      }
    }
  }

  sortMenuEntires(list) {
    const tree = this.common.list_to_tree(list);
    this.common.sharedService.setSharedData(tree, 'menuEntries');
    this.common.sharedService.setSharedData("myteam", "homemenuentries");
    this.common.openEITPage();
  }

  goToSubordinate() {
    this.selMenu.search = true;
    this.common.sharedService.setSharedData(
      this.selMenu,
      MenuResponse.SHARED_DATA
    );

    this.common.openMyTeamPage();
  }

  showSelectedField(value: any) {
    if (this.searchKeySelect === 'User Name' || this.searchKeySelect === 'User Name') {
      this.showEmailInput = false;
      this.showUserNameOrNameInput = true;
    } else if (this.searchKeySelect === 'Email') {
      this.showUserNameOrNameInput = false;
      this.showEmailInput = true;
    }
  }
}
