You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
mohemm_srca/Mohem/src/app/time-card/time-card-details/time-card-details.component.ts

519 lines
18 KiB
TypeScript

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';
import { getDate } from 'date-fns';
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;
@ViewChild('slides') slides: IonSlides;
@ViewChild('slideWithNav') slideWithNav: IonSlides;
slideOptsOne = {
initialSlide: 0,
slidesPerView: 1,
autoplay: true
};
month: any;
year: any;
preMonth: number;
nextMonth: any;
constructor(
public timeCardService: TimeCardService,
public common: CommonService,
public modalController: ModalController,
public sharedData: SharedDataService,
public ts: TranslatorService
) { }
@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;
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;
public options = {
cutoutPercentage: 80,
tooltips: { enabled: false },
legend: { display: false }
};
public data = {
datasets: [
{
data: [120, 50],
backgroundColor: [
'#22c6b3',
'#094875',
],
borderWidth: 2
}]
};
ngOnInit() {
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 segmentChanged(event: any) {
console.log('segmentChanged');
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() {
console.log('toggleButton');
this.showMore = !this.showMore;
}
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;
}
}
});
}
// startTime:new Date(new Date().getTime() +( 60000*60 * 24)),
// endTime: new Date(new Date().getTime() +( 60000*60 * 24)),
// isoTime:"09:00:00",
// allDay: false
countAllAttendDays(allDays) {
console.log('countAllAttendDays');
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
}]
};
}
});
}
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 => {
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) {
console.log('slideChanged');
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) {
console.log('showShiftDetails');
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');
});
}
/////////////////////////////////////////////////// here
// slideNext(object, slideView) {
// 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;
// }
// });
// }
// slidePrev(object, slideView) {
// this.sliderRef.slidePrev();
// }
/////////////////////////////////
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;
}
///////////////////////////////////////////////////////////////////////// here
getHeaderMonth(date: any) {
return this.getMonthName(date.getMonth() + 1) + ' ' + date.getFullYear();
}
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';
}
}
// getHeaderMonth(date: any) {
// if (monthName = "December") {
// }
// return monthName;
// else
// return this.getMonthName(date.getMonth() + 1) + " " + date.getFullYear();
// }
// public getMonthName(value: any): any {
// switch (value) {
// case "Januray":
// return "February";
// case "February":
// return "March";
// case "March":
// return "April";
// case "April":
// return "May";
// case "May":
// return "June";
// case "June":
// return "July";
// case "July":
// return "August";
// case "August":
// return "September" ;
// case "September" :
// return "October";
// case "October":
// return "November";
// case "November":
// return "December";
// case "December":
// return "January";
// }
// }
}