import { Component, OnInit, ViewChild } from '@angular/core'; 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'; import { WorklistService } from 'src/app/notification/service/worklist.service'; @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 monthTitle: string = moment().format('MMMM'); public yearTitle: string; public activeMonth: any; public currentMonthName = ''; favoriteUserList: [] = []; public showAttendence = false; 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; currentMonth: any; public direction: string; public options = { cutoutPercentage: 80, tooltips: { enabled: false }, legend: { display: false } }; public data = {}; public isPostNoLoad = true; public previousActiveIndex = 0; public currentActiveIndex = 0; public searchNameOrUserName = ''; public searchEmail = ''; public showEmailInput = false; public showUserNameOrNameInput = true; // tslint:disable-next-line: max-line-length public monthsNameArray = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']; public monthIndex = new Date().getMonth() + 1; public EmpTotal = []; public selectedFilter = ''; public itemType = ''; public monthNo: any; isFavorite = false; public EmpNumer:any; public isFavor:any; public EmployeeTotal:any; // public activeSegment = 'About'; public filters = [ { // value: '', name: 'JAN', active: true, color: '#0a0a0a', key: 'January', monthNo: 1, disable: false }, { // value: '', name: 'FEB', active: false, color: '#0a0a0a', key: 'February', monthNo: 2, disable: false }, { // value: '', name: 'MAR', active: false, color: '#0a0a0a', key: 'March', monthNo: 3, disable: false }, { // value: '', name: 'APRIL', active: false, color: '#0a0a0a', key: 'April', monthNo: 4, disable: false }, { // value: '', name: 'MAY', active: false, color: '#0a0a0a', key: 'May', monthNo: 5, disable: false }, { // value: '', name: 'JUN', active: false, color: '#0a0a0a', key: 'June', monthNo: 6, disable: false }, { // value: '', name: 'JUL', active: false, color: '#0a0a0a', key: 'July', monthNo: 7, disable: false }, { // value: '', name: 'AUG', active: false, color: '#0a0a0a', key: 'Augest', monthNo: 8, disable: false }, { // value: '', name: 'SEP', active: false, color: '#0a0a0a', key: 'September', monthNo: 9, disable: false }, { // value: '', name: 'NOV', active: false, color: '#0a0a0a', key: 'November', monthNo: 10, disable: false }, { // value: '', name: 'OCT', active: false, color: '#0a0a0a', key: 'October', monthNo: 11, disable: false }, { // value: '', name: 'DEC', active: false, color: '#0a0a0a', key: 'December', monthNo: 12, disable: false } ]; public slideOptsOne = { slidesPerView: 7, spaceBetween: 1 }; constructor( public timeCardService: TimeCardService, public menuService: MenuService, public common: CommonService, public myTeamService: MyTeamService, public ts: TranslatorService, public modalController: ModalController, public authService: AuthenticationService, public dashboardService: DashboredService, public worklistService: WorklistService, ) { this.direction = TranslatorService.getCurrentLanguageName(); } ngOnInit() { this.common.startLoading(); this.intializeMemberDetail(); this.showAttendanceTracking(); // tslint:disable-next-line: max-line-length this.currentMonthName = this.direction === 'en' ? this.common.getMonthName(this.monthIndex) : this.common.getMonthNameAr(this.monthIndex); // this.getSuborinatesAttStatus(); // this.getFavorit(); } showAttendanceTracking() { this.common.startLoading(); 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.common.startLoading(); this.initAttendance(); } else if(this.activeSegment != 'Attendance' && this.activeSegment != 'TeamMembers'){ this.activeSegment = 'About'; } } initAttendance() { this.data = {}; // tslint:disable-next-line: max-line-length this.currentMonthName = this.direction === 'en' ? this.common.getMonthName(this.monthIndex) : this.common.getMonthNameAr(this.monthIndex); this.currentYear = new Date().getFullYear(); this.currentDate = new Date(); this.showData = false; this.nextMonth = new Date().getMonth() + 2; this.preMonth = new Date().getMonth(); // this.currentActiveIndex = this.nextMonth -1; this.activeFilter(this.preMonth); 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 === 'en' ? 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.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, '', '', this.isPostNoLoad).subscribe((result) => { if (this.common.validResponse(result)) { this.common.sharedService.setSharedData(result.GetDayHoursTypeDetailsList, 'RTP_IDs'); this.countAllAttendDays(result.GetDayHoursTypeDetailsList); } }); } monthCardSliders(monthNo) { /* change */ this.currentMonthName = this.direction === 'en' ? this.common.getMonthName(this.monthIndex) : this.common.getMonthNameAr(this.monthIndex); this.currentYear = new Date().getFullYear(); this.currentDate = new Date(new Date().getFullYear(), monthNo - 1); this.showData = false; this.nextMonth = monthNo;//new Date().getMonth() + 2; this.preMonth = monthNo - 1;///new Date().getMonth(); //end this.calendarConfig(this.getMonthName(monthNo), this.currentYear); } 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.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.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].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.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, '', '', 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 = { // labels: ['Apsent', 'Present'], datasets: [ { label: "# of Votes", data: [this.absentDays, this.attendedDays], backgroundColor: [ 'black', '#269DB8' ], borderWidth: 1, // cutoutPrecentage:20 , }], labels: [ 'Apsent', 'Present' ] }; } } }); } 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'; } } public getMonthNameAr(value: any): any { switch (value) { case 1: return 'يناير'; case 2: return ' فبراير'; case 3: return 'مارس'; case 4: return 'أبريل'; case 5: return 'مايو'; case 6: return 'يونيو'; case 7: return 'يوليو'; case 8: return 'أغسطس'; case 9: return 'سبتمبر'; case 10: return ' اكتوبر'; case 11: return ' نوفمبر'; case 12: return 'ديسمبر'; } } 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); this.isFavorite = false; this.getFavorit(); } } 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) => { if (this.common.validResponse(result)) { this.handleEmpResult(result.GetEmployeeSubordinatesList); } }); } handleEmpResult(result) { this.EmployeeTotal = result.length; 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) => { 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; } } showCalender() { if (this.showAttendence) { this.showAttendence = false } else { this.showAttendence = true } } // getSuborinatesAttStatus() { // const request = { // // SearchMonth: "January", // // SearchYear: 2021 // SearchMonth: "", // SearchYear: Number // }; // // this.myTeamService.getSuborinatesAttStatus().subscribe((result: any) => // this.myTeamService.getSuborinatesAttStatus(request, () => { }, this.ts.trPK('general', 'retry')).subscribe((result) => { // this.handleRespondSuborinatesAttStatusResult(result); // }) // } // handleRespondSuborinatesAttStatusResult(result) { // // this.EmpTotal = result.GetSubordinatesAttdStatusList.length; // this.EmpTotal = result.GetSubordinatesAttdStatusList[0].NUMBER_OF_EMPLOYEES; // } activeFilter(index: number) { if (this.currentActiveIndex !== index) { this.previousActiveIndex = this.currentActiveIndex; this.currentActiveIndex = index; this.filters[this.previousActiveIndex].active = false; this.filters[this.currentActiveIndex].active = true; this.selectedFilter = this.filters[this.currentActiveIndex].key; } } disableFilters() { for (const filter of this.filters) { if (filter.key === this.itemType) { filter.disable = false; filter.active = true; // filter.value = this.nextMonth - 1; this.selectedFilter = filter.name; } else if (this.itemType === '') { filter.disable = false; filter.active = false; } else { filter.disable = true; filter.active = false; } } if (this.itemType === '') { this.filters[0].active = true; } } //save favorite here setFavorite(selEmp) { selEmp.EMPLOYEE_DISPLAY_NAME = selEmp.EMPLOYEE_DISPLAY_NAME ? selEmp.EMPLOYEE_DISPLAY_NAME : selEmp.NAME; selEmp.EMPLOYEE_IMAGE = selEmp.EMPLOYEE_IMAGE ? selEmp.EMPLOYEE_IMAGE : ''; selEmp.EMAIL_ADDRESS = selEmp.EMAIL_ADDRESS ? selEmp.EMAIL_ADDRESS : ''; var confirmBoxhtml = `
