import { Component, OnInit, ViewChild, Input } from '@angular/core'; import { TimeCardService } from 'src/app/time-card/service/time-card.service'; import { CommonService } from 'src/app/hmg-common/services/common/common.service'; import { SharedDataService } from 'src/app/hmg-common/services/shared-data-service/shared-data.service'; import { ModalController, IonSlides } from '@ionic/angular'; import { SelectPeriodComponent } from '../select-period/select-period.component'; 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 { MenuResponse } from 'src/app/hmg-common/services/menu/models/menu-response'; import * as moment from 'moment'; @Component({ selector: 'app-time-card-details', templateUrl: './time-card-details.component.html', styleUrls: ['./time-card-details.component.scss'], }) export class TimeCardDetailsComponent implements OnInit { @ViewChild('sliderRef') protected sliderRef: IonSlides; public activeSegment: any = 'time-card-summary'; public showMore: any = true; public menuType: any; public selEmp: string; public dateFrom: any = new Date(); public dateTo: any = new Date(); public selMenu: MenuResponse = new MenuResponse(); public respID: number; public timeCardSummaryData: any = []; public dayHoursData: any = []; public selectedShift: any; public rightIconActive = false; public leftIconActive = false; public loadMore = false; public dayAndHoursPageNumber = 1; public selectedFilters: any = {}; public selectedShiftFilter: any; public loadMoreDateHoursData = false; constructor( public timeCardService: TimeCardService, public common: CommonService, public modalController: ModalController, public sharedData: SharedDataService ) { } ngOnInit() { this.getTimeCardSummaryDetails(); } public segmentChanged(event: any) { this.activeSegment = event.detail.value; if (this.activeSegment === 'time-card-details' && this.dayHoursData.length === 0) { this.getDayHoursTypeDetails(); } else { this.rightIconActive = true; this.leftIconActive = false; } } public toggleButton() { this.showMore = !this.showMore; } public getDayHoursTypeDetails() { const dayAndHoursReqObj = new GetDayAndHoursDetailsRequest(); this.dateFrom = moment(this.dateFrom).format('YYYY-MM-DDTHH:mm:ssZ'); this.dateTo = moment(this.dateTo).format('YYYY-MM-DDTHH:mm:ssZ'); 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.selEmp; dayAndHoursReqObj.P_MENU_TYPE = this.menuType; dayAndHoursReqObj.P_SELECTED_RESP_ID = this.respID; dayAndHoursReqObj.P_SCHEDULE_DATE_FROM = this.common.convertISODateToJsonDate(this.dateFrom); dayAndHoursReqObj.P_SCHEDULE_DATE_TO = this.common.convertISODateToJsonDate(this.dateTo); dayAndHoursReqObj.P_PAGE_NUM = this.dayAndHoursPageNumber; dayAndHoursReqObj.P_PAGE_LIMIT = 10; if (Object.keys(this.selectedFilters).length !== 0) { dayAndHoursReqObj.P_SHT_TYPE = this.selectedShiftFilter; dayAndHoursReqObj.P_EXCESS_FLAG = this.selectedFilters['P_EXCESS_FLAG'.toString()].value; dayAndHoursReqObj.P_TIMEBACK_FLAG = this.selectedFilters['P_TIMEBACK_FLAG'.toString()].value; dayAndHoursReqObj.P_COMP_OFF_FLAG = this.selectedFilters['P_COMP_OFF_FLAG'.toString()].value; dayAndHoursReqObj.P_NON_SCHEDULED_FLAG = this.selectedFilters['P_NON_SCHEDULED_FLAG'.toString()].value; dayAndHoursReqObj.P_LATE_IN_FLAG = this.selectedFilters['P_LATE_IN_FLAG'.toString()].value; dayAndHoursReqObj.P_EARLY_OUT_FLAG = this.selectedFilters['P_EARLY_OUT_FLAG'.toString()].value; dayAndHoursReqObj.P_SHORTAGE_FLAG = this.selectedFilters['P_SHORTAGE_FLAG'.toString()].value; dayAndHoursReqObj.P_MISSING_SWIPE_FLAG = this.selectedFilters['P_MISSING_SWIPE_FLAG'.toString()].value; dayAndHoursReqObj.P_ACTUAL_WOB_SEC = this.selectedFilters['P_ACTUAL_WOB_SEC'.toString()].value; dayAndHoursReqObj.P_ANALAYZED_FLAG = this.selectedFilters['P_ANALAYZED_FLAG'.toString()].value; dayAndHoursReqObj.P_APPR_TIMEBACK_FLAG = this.selectedFilters['P_APPR_TIMEBACK_FLAG'.toString()].value; } this.timeCardService.getDayHoursTypeDetails(dayAndHoursReqObj).subscribe((result) => { if (this.common.validResponse(result)) { this.loadMoreDateHoursData = false; const daysDataLength = result.GetDayHoursTypeDetailsList.length; this.loadMore = daysDataLength === 10 ? true : false; if (this.dayAndHoursPageNumber > 1 && daysDataLength !== 0) { this.rightIconActive = true; this.dayHoursData = this.dayHoursData.concat(result.GetDayHoursTypeDetailsList); setTimeout(() => { this.nextSlide(); }, 1000); } else if (this.dayAndHoursPageNumber === 1 && daysDataLength <= 10 && daysDataLength !== 0) { this.rightIconActive = true; this.dayHoursData = result.GetDayHoursTypeDetailsList; } } }); } public getTimeCardSummaryDetails() { const timeCardSummaryReqObj = new GetTimeCardSummaryRequest(); this.dateFrom = moment(this.dateFrom).format('YYYY-MM-DDTHH:mm:ssZ'); this.dateTo = moment(this.dateTo).format('YYYY-MM-DDTHH:mm:ssZ'); 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.selEmp; timeCardSummaryReqObj.P_MENU_TYPE = this.menuType; timeCardSummaryReqObj.P_SELECTED_RESP_ID = this.respID; timeCardSummaryReqObj.P_SCHEDULE_DATE_FROM = this.common.convertISODateToJsonDate(this.dateFrom); timeCardSummaryReqObj.P_SCHEDULE_DATE_TO = this.common.convertISODateToJsonDate(this.dateTo); if (Object.keys(this.selectedFilters).length !== 0) { timeCardSummaryReqObj.P_SHT_TYPE = this.selectedShiftFilter; timeCardSummaryReqObj.P_EXCESS_FLAG = this.selectedFilters['P_EXCESS_FLAG'.toString()].value; timeCardSummaryReqObj.P_TIMEBACK_FLAG = this.selectedFilters['P_TIMEBACK_FLAG'.toString()].value; timeCardSummaryReqObj.P_COMP_OFF_FLAG = this.selectedFilters['P_COMP_OFF_FLAG'.toString()].value; timeCardSummaryReqObj.P_NON_SCHEDULED_FLAG = this.selectedFilters['P_NON_SCHEDULED_FLAG'.toString()].value; timeCardSummaryReqObj.P_LATE_IN_FLAG = this.selectedFilters['P_LATE_IN_FLAG'.toString()].value; timeCardSummaryReqObj.P_EARLY_OUT_FLAG = this.selectedFilters['P_EARLY_OUT_FLAG'.toString()].value; timeCardSummaryReqObj.P_SHORTAGE_FLAG = this.selectedFilters['P_SHORTAGE_FLAG'.toString()].value; timeCardSummaryReqObj.P_MISSING_SWIPE_FLAG = this.selectedFilters['P_MISSING_SWIPE_FLAG'.toString()].value; timeCardSummaryReqObj.P_ACTUAL_WOB_SEC = this.selectedFilters['P_ACTUAL_WOB_SEC'.toString()].value; timeCardSummaryReqObj.P_ANALAYZED_FLAG = this.selectedFilters['P_ANALAYZED_FLAG'.toString()].value; timeCardSummaryReqObj.P_APPR_TIMEBACK_FLAG = this.selectedFilters['P_APPR_TIMEBACK_FLAG'.toString()].value; } this.timeCardService.getTimeCardSummary(timeCardSummaryReqObj).subscribe((result) => { if (this.common.validResponse(result)) { this.timeCardSummaryData = result.GetTimeCardSummaryList[0]; } }); } async openSelectPeriodModal() { const modal = await this.modalController.create({ component: SelectPeriodComponent, cssClass: 'select-period-custom-modal', componentProps: { dateFrom : this.dateFrom, dateTo : this.dateTo } }); modal.onDidDismiss().then(result => { console.log(result.data); this.loadMore = false; this.rightIconActive = false; this.leftIconActive = false; this.dayHoursData = []; this.timeCardSummaryData = []; this.dayAndHoursPageNumber = 1; this.loadMoreDateHoursData = false; this.dateFrom = result.data.dateFrom; this.dateTo = result.data.dateTo; this.selectedFilters = result.data.keySelectedFilters; this.selectedShiftFilter = result.data.selectedShiftType; if (this.dateFrom && this.dateTo) { this.getDayHoursTypeDetails(); this.getTimeCardSummaryDetails(); } }); return await modal.present(); } slideChanged(ev: any) { const prom1 = this.sliderRef.isBeginning(); const prom2 = this.sliderRef.isEnd(); Promise.all([prom1, prom2]).then((data) => { data[0] ? this.leftIconActive = false : this.leftIconActive = true; if (data[1]) { if (!this.loadMore) { this.rightIconActive = false; } } else { this.rightIconActive = true; } }); } showShiftDetails(origin: string) { this.sliderRef.getActiveIndex().then((index: number) => { this.selectedShift = this.dayHoursData[index]; this.selectedShift.origin = origin; this.sharedData.setSharedData(this.selectedShift, 'selectedShift'); this.common.navigatePage('/time-card/shift-details'); }); } nextSlide() { if (this.loadMoreDateHoursData && this.loadMore) { this.dayAndHoursPageNumber++; this.getDayHoursTypeDetails(); } this.sliderRef.slideNext(); this.sliderRef.getActiveIndex().then((index: number) => { if (index === (this.dayHoursData.length - 1)) { this.loadMoreDateHoursData = true; } }); } previousSlide() { this.sliderRef.slidePrev(); } }