fixed timecard module

MOHEMM-Q3-DEV-LATEST
umasoodch 6 years ago
parent 7ed63baf68
commit f1157f48f6

@ -89,7 +89,7 @@ export class DateInfoModalComponent implements OnInit {
{
data: [this.percChart],
backgroundColor: [
'#22C6B3'
'#094875'
],
borderWidth: 2
}]

@ -13,9 +13,9 @@
<h2 class="name">{{name}}</h2>
<span class="title">{{title}}</span>
</span>
<span class="image-container">
<a class="image-container" href="tel:{{employeePhoneNumber}}">
<img src="../assets/imgs/green_call_icon.png" >
</span>
</a>
</div>
<!-- <div class="swipe-information">
<span class="check-in"><strong>Check-In:</strong> {{checkIn}}</span>

@ -11,6 +11,8 @@ export class EmployeeInformationComponent implements OnInit {
@Input() name: string;
@Input() title: string;
@Input() employeeImage: string;
@Input() employeePhoneNumber: string;
constructor() { }

@ -1,6 +1,7 @@
<div feedback class="custom-button">
<div class="iconBox">
<img [src]="'data:image/png;base64,'+icon" class="icon">
<img *ngIf="title != 'My Team'" [src]="'data:image/png;base64,'+icon" class="icon">
<img *ngIf="title == 'My Team'" [src]="icon" class="icon">
</div>
<div class="titleBox">
<p class="pClass">{{title}}</p>

@ -42,7 +42,7 @@
<ion-col [size]="8">
<h3>Monthly Attendance</h3>
<span>View your Monthly Time Sheet</span>
<ion-button>
<ion-button (click)="openTimeCard()">
View Detail
</ion-button>
</ion-col>

@ -388,6 +388,11 @@ export class HomePage implements OnInit {
openMyTeamPage() {
this.common.openMyTeamPage();
}
openTimeCard() {
this.common.openTimeCardPage();
}
getMenuEntries(item) {
const request: any = {};
let selEmpNo: string = null;

@ -23,9 +23,9 @@
<ion-row class="ion-justify-content-center">
<ion-col [size]="4">
<div class="action-button col-button">
<span class="action-button-icon">
<a class="action-button-icon" href="tel:{{employee.EMPLOYEE_MOBILE_NUMBER}}">
<img src="../assets/imgs/call_icon.png">
</span>
</a>
<span>Call</span>
</div>
</ion-col>
@ -222,6 +222,7 @@
[name]="subordinate.EMPLOYEE_NAME"
[title]="subordinate.POSITION_NAME"
[employeeImage]="subordinate.EMPLOYEE_IMAGE ? 'data:image/png;base64,'+subordinate.EMPLOYEE_IMAGE : '../assets/imgs/profile.png'"
[employeePhoneNumber]="subordinate.EMPLOYEE_MOBILE_NUMBER"
(click)="getDetails(i)">
</app-employee-information>
</ng-container>

@ -80,11 +80,6 @@ export class DetailsComponent implements OnInit {
public data = {};
public slideOptsOne = {
slidesPerView: 4,
spaceBetween: 10
};
public previousActiveIndex = 0;
public currentActiveIndex = 0;
public searchNameOrUserName = '';
@ -266,10 +261,6 @@ export class DetailsComponent implements OnInit {
}
}
this.showData = true;
console.log(this.arrDaysOff);
console.log(this.arrDaysAttendance);
console.log(this.arrDaysAbsent);
console.log(this.normalDays);
}
public getTimeCardSummaryDetails(month?, year?) {

@ -68,8 +68,7 @@
[name]="subordinate.EMPLOYEE_NAME"
[title]="subordinate.POSITION_NAME"
[employeeImage]="subordinate.EMPLOYEE_IMAGE ? 'data:image/png;base64,'+subordinate.EMPLOYEE_IMAGE : '../assets/imgs/profile.png'"
checkIn="08:15"
checkOut="-"
[employeePhoneNumber]="subordinate.EMPLOYEE_MOBILE_NUMBER"
(click)="getDetails(i)">
</app-employee-information>
</ng-container>

@ -1,148 +1,100 @@
<ion-content class="colorBG">
<ion-header>
<ion-toolbar class="header-toolbar-new">
<ion-buttons slot="start">
<nav-buttons backLink="/home"></nav-buttons>
</ion-buttons>
<ion-title>MONTHLY ATTENDANCE</ion-title>
</ion-toolbar>
</ion-header>
<div class="header-div">
<ion-buttons slot="start">
<ion-back-button color="light" class="btnBack" defaultHref="/home"></ion-back-button>
</ion-buttons>
<ion-title class="Title"> {{ts.trPK('attendance','monthly-attendance')}}</ion-title>
</div>
<div>
<div class="header">
<div class="slider">
<ion-row>
<ion-col>
<button ion-button icon-start class="slidPrev" (click)="previousSlide(sliderOne,slideWithNav)">
<ion-icon class="activeArrow" ios="ios-arrow-dropleft-circle" md="md-arrow-dropleft-circle">
</ion-icon>
</button>
</ion-col>
<ion-col>
<p style="position: absolute; left: 27%; bottom: 0%; font-family: WorkSans-Bold;">{{month}}</p>
</ion-col>
<ion-col>
<p style="position: absolute; left: 25%; bottom: 0%; font-family: WorkSans-Bold;">{{year}}</p>
</ion-col>
<ion-col>
<button ion-button icon-end class="slidNext" (click)="nextSlide()">
<ion-icon [ngClass]=" currentMonthName === month ? 'disabledArrow' : 'activeArrow'"
ios="ios-arrow-dropright-circle" md="md-arrow-dropright-circle"></ion-icon>
</button>
</ion-col>
</ion-row>
<ion-content>
<div class="contentBg">
<div>
<div class="header">
<div>
<ion-row>
<ion-col [size]="2" style="text-align: left;">
<ion-icon class="activeArrow" ios="ios-arrow-dropleft-circle" md="md-arrow-dropleft-circle" (click)="previousSlide()"></ion-icon>
</ion-col>
<ion-col [size]="8" style="text-align: center;">
<span class="month-year-span">{{month}} {{year}}</span>
</ion-col>
<ion-col [size]="2" style="text-align: right;">
<ion-icon [ngClass]=" currentMonthName === month ? 'disabledArrow' : 'activeArrow'" ios="ios-arrow-dropright-circle" md="md-arrow-dropright-circle" (click)="nextSlide()"></ion-icon>
</ion-col>
</ion-row>
</div>
</div>
<ion-slides [options]="slideOptsOne" #slideWithNav (ionSlideDidChange)="SlideDidChange(sliderOne,slideWithNav)">
<ion-slide>
<ion-grid class="headerGrid">
<div style="color: black;">
<div class="result-graph">
<div class="request-heading">
<span> {{ts.trPK('attendance-tracking','attendance-statistics')}}</span>
</div>
<div class="result-text-container">
<h2>{{totalAttendancePrecentage}}</h2>
<p>{{ts.trPK('absenceList','days')}}</p>
</div>
<p-chart class="today-graph" type="doughnut" [data]="data" [options]="options"></p-chart>
</div>
<div style="position: relative;
left: 74%;
bottom: 117px;
color: black;
background-color: #22c6b3;
width: 20%; height: 6px;">
<ion-col>
<ion-row>
<label class="green-label">{{ts.trPK('attendance','present')}}</label>
</ion-row>
<ion-row>
<label class="green-amount">{{attendedDays}}</label>
</ion-row>
</ion-col>
</div>
<div style="position: relative;
left: 74%;
bottom: 67px;
color: black;
background-color: #094875;
width: 20%; height: 6px;">
<ion-col>
<ion-row>
<label class="blue-label">{{ts.trPK('attendance','absent')}}</label>
</ion-row>
<ion-row>
<label class="blue-amount" for="">{{absentDays}}</label>
</ion-row>
</ion-col>
</div>
<div class="result-graph">
<div class="request-heading">
<span>{{ts.trPK('myTeam','attendance-statistics')}}</span>
</div>
<div style="position: relative;">
<div class="label-container">
<div class="green-label-container">
<span class="span-one">{{ts.trPK('attendance','present')}}</span>
<span class="span-two">{{attendedDays}}</span>
</div>
</ion-grid>
</ion-slide>
</ion-slides>
</div>
</div>
<div style="margin-top: 10%;">
<ion-grid>
<ion-row>
<ion-col>
<ion-grid class="labelGrid">
<ion-row>
<ion-col>
<label style="font-size: 12px;">{{ts.trPK('attendance-tracking','schedule')}}</label>
</ion-col>
<ion-col>
<h2 *ngIf="timeCardSummaryData" style="margin-left: 45%; font-size: 25px; font-weight: bold;">
{{timeCardSummaryData.SCHEDULE_DAYS}}</h2>
<h2 *ngIf="!timeCardSummaryData" style="margin-left: 45%; font-size: 25px;">0</h2>
</ion-col>
</ion-row>
</ion-grid>
<div class="blue-label-container">
<span class="span-one">{{ts.trPK('attendance','absent')}}</span>
<span class="span-two">{{absentDays}}</span>
</div>
</div>
<div class="graph-container">
<div class="result-text-container">
<h2>{{totalAttendancePrecentage}}</h2>
<span>{{ts.trPK('absenceList','days')}}</span>
</div>
<p-chart class="today-graph" type="doughnut" [data]="data" [options]="options"></p-chart>
</div>
</div>
</div>
<ion-row class="attendance-summary">
<ion-col [size]="3">
<div class="attendance-information">
<span>{{ts.trPK('attendance-tracking','schedule')}}</span>
<h2>{{timeCardSummaryData.SCHEDULE_DAYS}}</h2>
</div>
</ion-col>
<ion-col>
<ion-grid class="labelGrid">
<ion-row>
<ion-col>
<label style="font-size: 12px;">{{ts.trPK('attendance-tracking','off-days')}}</label>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<h2 *ngIf="timeCardSummaryData"
style="margin-left: 37%; margin-top: 18px; font-size: 25px; font-weight: bold;">
{{timeCardSummaryData.OFF_DAYS}}</h2>
<h2 *ngIf="!timeCardSummaryData" style="margin-left: 37%; font-size: 25px;">0</h2>
</ion-col>
</ion-row>
</ion-grid>
<ion-col [size]="3">
<div class="attendance-information">
<span>{{ts.trPK('attendance-tracking','off-days')}}</span>
<h2>{{timeCardSummaryData.OFF_DAYS}}</h2>
</div>
</ion-col>
<ion-col>
<ion-grid class="labelGrid">
<label style="font-size: 12px;">{{ts.trPK('attendance-tracking','non-analyzed')}}</label>
<h2 *ngIf="timeCardSummaryData" style="margin-left: 36%; font-size: 25px; font-weight: bold;">
{{timeCardSummaryData.UNAUTHORIZED_LEAVE}}</h2>
<h2 *ngIf="!timeCardSummaryData" style="margin-left: 36%; font-size: 25px;">0</h2>
</ion-grid>
<ion-col [size]="3">
<div class="attendance-information">
<span>{{ts.trPK('attendance-tracking','non-analyzed')}}</span>
<h2>{{timeCardSummaryData.UNAUTHORIZED_LEAVE}}</h2>
</div>
</ion-col>
<ion-col>
<ion-grid class="labelGrid">
<label style="font-size: 12px;">{{ts.trPK('attendance-tracking','shortage-hours')}}</label>
<h2 *ngIf="timeCardSummaryData" style="margin-left: 18%; font-size: 25px; font-weight: bold;">
{{timeCardSummaryData.SHORTAGE_HRS}}</h2>
<h2 *ngIf="!timeCardSummaryData" style="margin-left: 45%; font-size: 25px;">0</h2>
</ion-grid>
<ion-col [size]="3">
<div class="attendance-information">
<span>{{ts.trPK('attendance-tracking','shortage-hours')}}</span>
<h2>{{timeCardSummaryData.SHORTAGE_HRS}}</h2>
</div>
</ion-col>
</ion-row>
</ion-grid>
</div>
<div>
<ion-grid class="bodyGrid" *ngIf="showData">
<p style="font-weight: bold; font-size: 17px;"> {{ts.trPK('attendance','monthly-attendance-calendar')}}</p>
<app-circle-calendar [eventsdateAttend]='arrDaysAttendance' [eventsdateAbsent]='arrDaysAbsent'
[eventsdateDayOff]='arrDaysOff' (monthTitle)='changeMonthTitle($event)' (currentYear)=changeYear($event)>
</app-circle-calendar>
</ion-grid>
<div *ngIf="showData" class="calendar-container">
<span> {{ts.trPK('attendance','monthly-attendance-calendar')}}</span>
<app-circle-calendar
[eventsdateAttend]='arrDaysAttendance'
[eventsdateAbsent]='arrDaysAbsent'
[eventsdateDayOff]='arrDaysOff'
[currentDateParent]="currentDate"
[dayHoursTypeDetailsList]="dayHoursTypeDetailsList"
[normalDays]="normalDays"
(monthTitle)='changeMonthTitle($event)'
(currentYear)=changeYear($event)>
</app-circle-calendar>
</div>
</div>
</div>
</ion-content>

@ -8,7 +8,6 @@ import { GetDayAndHoursDetailsRequest } from 'src/app/time-card/service/models/g
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({
@ -19,13 +18,6 @@ import { TranslatorService } from 'src/app/hmg-common/services/translator/transl
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;
@ -37,9 +29,7 @@ export class TimeCardDetailsComponent implements OnInit {
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;
@ -73,25 +63,18 @@ export class TimeCardDetailsComponent implements OnInit {
public currentMonthName = this.getMonthName(new Date().getMonth() + 1);
public showData = false;
public currentYear = new Date().getFullYear();
public dayHoursTypeDetailsList = [];
public normalDays: any = [];
public currentDate = new Date();
public options = {
cutoutPercentage: 80,
tooltips: { enabled: false },
legend: { display: false }
};
public data = {
datasets: [
{
data: [120, 50],
backgroundColor: [
'#22c6b3',
'#094875',
],
borderWidth: 2
}]
};
public data = {};
ngOnInit() {
this.showData = false;
this.nextMonth = new Date().getMonth() + 2;
this.preMonth = new Date().getMonth() - 2;
if (this.preMonth < 0) {
@ -112,22 +95,8 @@ export class TimeCardDetailsComponent implements OnInit {
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() {
this.showMore = !this.showMore;
}
public getDayHoursTypeDetails(month?, year?) {
console.log('getDayHoursTypeDetails');
const dayAndHoursReqObj = new GetDayAndHoursDetailsRequest();
this.monthName = month;
this.yearDate = year;
@ -144,39 +113,12 @@ export class TimeCardDetailsComponent implements OnInit {
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;
}
this.dayHoursTypeDetailsList = result.GetDayHoursTypeDetailsList;
}
});
@ -185,44 +127,56 @@ export class TimeCardDetailsComponent implements OnInit {
countAllAttendDays(allDays) {
// 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({
// tslint:disable-next-line: triple-equals
if (allDays[i].ATTENDED_FLAG == 'Y') {
allDays[i].present = true;
allDays[i].absent = false;
allDays[i].daysOff = false;
allDays[i].schedule = false;
this.arrDaysAttendance.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({
// tslint:disable-next-line: triple-equals
} else if (allDays[i].ATTENDED_FLAG == 'N' && allDays[i].ABSENT_FLAG == 'Y') {
allDays[i].present = false;
allDays[i].absent = true;
allDays[i].daysOff = false;
allDays[i].schedule = false;
this.arrDaysAbsent.push({
startTime: new Date(allDays[i].SCHEDULE_DATE),
endTime: new Date(allDays[i].SCHEDULE_DATE),
isoTime: '09:00:00',
allDay: false
});
// tslint:disable-next-line: triple-equals
} else if (allDays[i].ATTENDED_FLAG == 'N' && allDays[i].DAY_TYPE === 'OFF') {
allDays[i].present = false;
allDays[i].absent = false;
allDays[i].daysOff = true;
allDays[i].schedule = false;
this.arrDaysOff.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
});
allDays[i].present = false;
allDays[i].absent = false;
allDays[i].daysOff = false;
allDays[i].schedule = true;
this.normalDays.push({
startTime: new Date(allDays[i].SCHEDULE_DATE),
endTime: new Date(allDays[i].SCHEDULE_DATE)
});
}
}
this.showData = true;
}
public getTimeCardSummaryDetails(month?, year?) {
console.log('getTimeCardSummaryDetails');
const timeCardSummaryReqObj = new GetTimeCardSummaryRequest();
if (this.isChange) {
this.monthName = month;
console.log('' + this.monthName);
this.yearDate = year;
console.log('' + this.yearDate);
} else {
this.monthName = month;
this.yearDate = year;
}
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);
@ -235,154 +189,101 @@ export class TimeCardDetailsComponent implements OnInit {
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;
this.attendedDays = this.timeCardSummaryData.ATTENDED_DAYS;
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;
}
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();
// this.totalAttendancePrecentage = this.timeCardSummaryData.PERIOD_DAYS - this.timeCardSummaryData.OFF_DAYS;
// if (this.absentDays === 0 && this.attendedDays === 0) {
// this.futrueDays = this.totalAttendancePrecentage;
// }
this.totalAttendancePrecentage = this.absentDays + this.attendedDays;
if (this.totalAttendancePrecentage > 0) {
this.data = {
datasets: [
{
data: [this.absentDays, this.attendedDays],
backgroundColor: [
'#094875',
'#22c6b3'
],
borderWidth: 2
}]
};
}
}
});
return await modal.present();
}
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.currentMonthName !== this.month) {
this.showData = false;
if (this.nextMonth > 12) {
this.currentYear = this.currentYear + 1;
this.nextMonth = 1;
}
this.calendarConfig(this.getMonthName(this.nextMonth) , this.currentYear);
this.nextMonth = this.nextMonth + 1;
this.preMonth = this.nextMonth - 2;
nextSlide() {
this.normalDays = [];
if (this.currentMonthName !== this.month) {
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.showData = false;
if (this.preMonth === 0) {
this.currentYear = this.currentYear - 1;
this.preMonth = 12;
previousSlide() {
this.normalDays = [];
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);
console.log(this.currentDate);
this.calendarConfig(this.getMonthName(this.preMonth) , this.currentYear);
this.preMonth = this.preMonth - 1;
this.nextMonth = this.preMonth + 2;
}
this.calendarConfig(this.getMonthName(this.preMonth) , this.currentYear);
this.preMonth = this.preMonth - 1;
this.nextMonth = this.preMonth + 2;
}
changeMonthTitle(title) {
changeMonthTitle(title) {
this.monthTitle = title;
this.isChange = true;
this.getTimeCardSummaryDetails();
}
changeYear(year) {
this.yearTitle = year;
}
}
getHeaderMonth(date: any) {
return this.getMonthName(date.getMonth() + 1) + ' ' + date.getFullYear();
}
changeYear(year) {
this.yearTitle = year;
}
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 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';
}
}
}
}

Loading…
Cancel
Save