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'; @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 = 'About'; 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 showMore: any = true; 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 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 arrDaysAttendance: any = []; public arrDaysAbsent: any = []; public arrDaysOff: any = []; public monthTitle: string = moment().format('MMMM'); public yearTitle: string; public isChange = false; public activeMonth: any; month: any; year: any; preMonth: number; nextMonth: any; public options = { cutoutPercentage: 80, tooltips: { enabled: false }, legend: { display: false } }; public data = { datasets: [ { data: [120, 50], backgroundColor: [ '#22c6b3', '#094875', ], borderWidth: 2 }] }; public filters = [ { value: 0, name: 'All', active: true, color: '#124375' }, { value: 0, name: 'Present', active: false, color: '#18a169' }, { value: 0, name: 'Absent', active: false, color: '#38c9b3' }, { value: 0, name: 'Late', active: false, color: '#114475' } ]; public slideOptsOne = { slidesPerView: 4, spaceBetween: 10 }; 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, ) { } ngOnInit() { this.intializeMemberDetail(); } public segmentChanged(event: any) { this.activeSegment = event.detail.value; if (this.activeSegment === 'Attendance') { this.initAttendance(); } } initAttendance() { 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?) { console.log('ngOnInit'); this.month = month; this.year = year; this.arrDaysOff = this.common.sharedService.getSharedData('calendarDayOffDateValue', false); this.arrDaysAttendance = this.common.sharedService.getSharedData('calendarAttendanceDateValue', false); this.arrDaysAbsent = this.common.sharedService.getSharedData('calendarDaysAbsentDateValue', false); this.getTimeCardSummaryDetails(month, year); this.getDayHoursTypeDetails(month, year); } public getDayHoursTypeDetails(month?, year?) { console.log('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.monthName = month; // moment().format('MMMM'); this.yearDate = year; // moment().format('YYYY'); 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.SearchMonth = this.monthName; dayAndHoursReqObj.SearchYear = this.yearDate; dayAndHoursReqObj.P_PAGE_NUM = this.dayAndHoursPageNumber; dayAndHoursReqObj.P_PAGE_LIMIT = 100; 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)) { console.log(result.GetDayHoursTypeDetailsList); this.common.sharedService.setSharedData(result.GetDayHoursTypeDetailsList, 'RTP_IDs'); this.countAllAttendDays(result.GetDayHoursTypeDetailsList); 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; } } }); } nextSlide() { let currentYear = new Date().getFullYear(); if (this.nextMonth > 12) { currentYear = currentYear + 1; this.nextMonth = 1; } this.calendarConfig(this.getMonthName(this.nextMonth) , currentYear); this.nextMonth = this.nextMonth + 1; this.preMonth = this.preMonth + 1; } previousSlide() { let currentYear = new Date().getFullYear(); if (this.preMonth === 0) { currentYear = currentYear - 1; this.preMonth = 12; } this.calendarConfig(this.getMonthName(this.preMonth) , currentYear); this.preMonth = this.preMonth - 1; this.nextMonth = this.nextMonth - 1; } changeMonthTitle(title) { console.log('changeMonthTitle'); this.monthTitle = title; this.isChange = true; this.getTimeCardSummaryDetails(); } changeYear(year) { console.log('changeYear'); this.yearTitle = year; } countAllAttendDays(allDays) { console.log('countAllAttendDays'); // tslint:disable-next-line: prefer-for-of for (let i = 0; i < allDays.length; i++) { if (allDays[i].DAY_TYPE === 'Off') { // offDay this.arrDaysOff.push({startTime: new Date(allDays[i].SCHEDULE_DATE), endTime: new Date(allDays[i].SCHEDULE_DATE)}); } else if (allDays[i].DAY_TYPE === 'SCHEDULED') { // attendace this.arrDaysAttendance.push({startTime: new Date(allDays[i].SCHEDULE_DATE), endTime: new Date(allDays[i].SCHEDULE_DATE)}); } else { // absent this.arrDaysAbsent.push( {startTime: new Date(allDays[i].SCHEDULE_DATE), endTime: new Date(allDays[i].SCHEDULE_DATE), isoTime: '09:00:00', allDay: false } ); } } } public getTimeCardSummaryDetails(month?, year?) { console.log('getTimeCardSummaryDetails'); const timeCardSummaryReqObj = new GetTimeCardSummaryRequest(); if (this.isChange) { // this.monthName = this.monthTitle; // this.yearDate = this.yearTitle; this.monthName = month; console.log('' + this.monthName); this.yearDate = year; console.log('' + this.yearDate); } else { this.monthName = month; // moment().format('MMMM'); this.yearDate = year; // moment().format('YYYY'); } 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); timeCardSummaryReqObj.SearchMonth = this.monthName; timeCardSummaryReqObj.SearchYear = this.yearDate; 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]; this.absentDays = this.timeCardSummaryData.ABSENT_DAYS; // console.log("absent: "+ this.absentDays); this.attendedDays = this.timeCardSummaryData.ATTENDED_DAYS; // console.log("attendedDays: "+ this.attendedDays); this.totalAttendancePrecentage = this.timeCardSummaryData.PERIOD_DAYS - this.timeCardSummaryData.OFF_DAYS; this.options = { cutoutPercentage: 80, tooltips: { enabled: false }, legend: { display: false } }; if (this.absentDays === 0 && this.attendedDays === 0) { this.futrueDays = this.totalAttendancePrecentage; } ////////////////////////////////////////////// // console.log("absent: "+ this.absentDays); // console.log("attend: "+ this.attendedDays); // console.log("future"+ this.futrueDays); // in chart "this.futrueDays" // in calender "this.futrueDays == white" // timecard sumery return not match data with GET_DAY_HOURS_TYPE_DETAILS this.data = { datasets: [ { data: [this.absentDays, this.attendedDays, this.futrueDays], backgroundColor: [ '#094875', '#22c6b3', '#9e9e9e' ], 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() { console.log('umar 1999'); 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.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; } } }