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 { 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'; import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service'; @Component({ selector: 'app-time-card-details', templateUrl: './time-card-details.component.html', styleUrls: ['./time-card-details.component.scss'], }) export class TimeCardDetailsComponent implements OnInit { slideView: any; sliderOne: any; month: any; year: any; preMonth: number; nextMonth: any; public direction: string; constructor( public timeCardService: TimeCardService, public common: CommonService, public modalController: ModalController, public sharedData: SharedDataService, public ts: TranslatorService ) { this.direction = TranslatorService.getCurrentDirection(); } 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; public monthName: any; public yearDate: any; public absentDays: number; public attendedDays: number; public futrueDays = 0; public totalAttendancePrecentage = 0; public monthTitle: string = moment().format('MMMM'); public yearTitle: string; public isChange = false; public activeMonth: any; public currentMonthName = ''; public showData = false; public currentYear = new Date().getFullYear(); public dayHoursTypeDetailsList = []; public currentDate = new Date(); public isPostNoLoad = true; public options = { cutoutPercentage: 80, tooltips: { enabled: false }, legend: { display: false } }; public data = {}; // tslint:disable-next-line: max-line-length public monthsNameArray = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']; ngOnInit() { this.common.startLoading(); this.showData = false; this.nextMonth = new Date().getMonth() + 2; this.preMonth = new Date().getMonth(); const monthIndex = new Date().getMonth() + 1; this.currentMonthName = this.direction === 'ltr' ? this.common.getMonthName(monthIndex) : this.common.getMonthNameAr(monthIndex); this.calendarConfig(this.common.getMonthName(new Date().getMonth() + 1) , new Date().getFullYear()); } calendarConfig(month?, year?) { const index = this.monthsNameArray.indexOf(month); this.month = this.direction === 'ltr' ? month : this.common.getMonthNameAr(index + 1); this.year = year; this.getTimeCardSummaryDetails(month, year); this.getDayHoursTypeDetails(month, year); } public getDayHoursTypeDetails(month?, year?) { 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.selEmp; dayAndHoursReqObj.P_MENU_TYPE = this.menuType; 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, '', '', this.isPostNoLoad).subscribe((result) => { if (this.common.validResponse(result)) { this.common.sharedService.setSharedData(result.GetDayHoursTypeDetailsList, 'RTP_IDs'); this.countAllAttendDays(result.GetDayHoursTypeDetailsList); } }); } 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].customPresent = true; allDays[i].customAbsent = false; allDays[i].customDaysOff = false; allDays[i].customSchedule = false; allDays[i].customScheduleDate = 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].customPresent = false; allDays[i].customAbsent = true; allDays[i].customDaysOff = false; allDays[i].customSchedule = false; allDays[i].customScheduleDate = new Date(allDays[i].SCHEDULE_DATE); // tslint:disable-next-line: triple-equals } else if (allDays[i].ATTENDED_FLAG == 'N' && allDays[i].DAY_TYPE === 'OFF') { allDays[i].customPresent = false; allDays[i].customAbsent = false; allDays[i].customDaysOff = true; allDays[i].customSchedule = false; allDays[i].customScheduleDate = new Date(allDays[i].SCHEDULE_DATE); } else { allDays[i].customPresent = false; allDays[i].customAbsent = false; allDays[i].customDaysOff = false; allDays[i].customSchedule = true; allDays[i].customScheduleDate = new Date(allDays[i].SCHEDULE_DATE); } } this.showData = true; this.dayHoursTypeDetailsList = allDays; } 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.selEmp; timeCardSummaryReqObj.P_MENU_TYPE = this.menuType; timeCardSummaryReqObj.P_SELECTED_RESP_ID = this.respID; timeCardSummaryReqObj.SearchMonth = this.monthName; timeCardSummaryReqObj.SearchYear = this.yearDate; this.timeCardService.getTimeCardSummary(timeCardSummaryReqObj, '', '', this.isPostNoLoad).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.absentDays + this.attendedDays; if (this.totalAttendancePrecentage > 0) { this.data = { datasets: [ { data: [this.absentDays, this.attendedDays], backgroundColor: [ '#269DB8', '#269DB8' ], borderWidth: 2 }] }; } } }); } nextSlide() { if (this.currentMonthName !== this.month) { this.common.startLoading(); 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.common.getMonthName(this.nextMonth) , this.currentYear); this.nextMonth = this.nextMonth + 1; this.preMonth = this.nextMonth - 2; } } previousSlide() { this.common.startLoading(); 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); this.calendarConfig(this.common.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; } }