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.
119 lines
3.6 KiB
TypeScript
119 lines
3.6 KiB
TypeScript
import { Component, OnInit, Input, ViewChild } from '@angular/core';
|
|
import { ModalController, NavParams, IonInfiniteScroll } from '@ionic/angular';
|
|
import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
|
|
import { IonSlides } from '@ionic/angular';
|
|
import { CommonService } from 'src/app/hmg-common/services/common/common.service';
|
|
|
|
@Component({
|
|
selector: 'app-date-info-modal',
|
|
templateUrl: './date-info-modal.component.html',
|
|
styleUrls: ['./date-info-modal.component.scss'],
|
|
})
|
|
export class DateInfoModalComponent implements OnInit {
|
|
@ViewChild('slides') slides: IonSlides;
|
|
[x: string]: any;
|
|
gaugeType = 'full';
|
|
gaugeValue = 28.3;
|
|
gaugeLabel = 'Days';
|
|
@Input() TODAYDATE: any;
|
|
@Input() SHIFTDETAILS: any;
|
|
today: any;
|
|
month: any;
|
|
monthDate: any;
|
|
excess: any;
|
|
shortage: any;
|
|
lateIn: any;
|
|
scheduled: any;
|
|
earlyOut: any;
|
|
shiftTime: any;
|
|
startDate: any;
|
|
endDate: any;
|
|
shift: any;
|
|
percentage: any;
|
|
data: any;
|
|
scheduleDate: any;
|
|
year: any;
|
|
nameMonth: any;
|
|
nameDay: any;
|
|
public weekDaysEn = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
|
|
public weekDaysAr = ['الاحد', 'الاثنين', 'الثلاثاء', 'الاربعاء', 'الخميس', 'الجمعه', 'السبت'];
|
|
public direction: string;
|
|
public options = {
|
|
cutoutPercentage: 85,
|
|
tooltips: { enabled: false },
|
|
legend: { display: false }
|
|
};
|
|
|
|
public slideOptsOne = {
|
|
slidesPerView: 1,
|
|
spaceBetween: 0
|
|
};
|
|
|
|
constructor(
|
|
public modalController: ModalController,
|
|
public navParams: NavParams,
|
|
public ts: TranslatorService,
|
|
public common: CommonService
|
|
) {
|
|
this.direction = TranslatorService.getCurrentDirection();
|
|
}
|
|
|
|
ngOnInit() {
|
|
console.log(this.TODAYDATE);
|
|
this.excess = this.TODAYDATE.EXCESS_HRS;
|
|
this.lateIn = this.TODAYDATE.LATE_IN_HRS;
|
|
this.shortage = this.TODAYDATE.SHORTAGE_HRS;
|
|
this.earlyOut = this.TODAYDATE.EARLY_OUT_HRS ;
|
|
this.scheduleDate = this.TODAYDATE.SCHEDULE_DATE;
|
|
this.assignData(this.SHIFTDETAILS.GetScheduleShiftsDetailsList[0]);
|
|
}
|
|
|
|
assignData(shiftDetails) {
|
|
this.scheduled = shiftDetails.SHT_TYPE_DESC;
|
|
this.shiftTime = shiftDetails.SHT_NAME;
|
|
this.actualCheckIn = shiftDetails.SHT_ACTUAL_START_TIME;
|
|
this.actualCheckOut = shiftDetails.SHT_ACTUAL_END_TIME;
|
|
this.approvedCheckIn = shiftDetails.APPROVED_START_TIME;
|
|
this.approvedCheckOut = shiftDetails.APPROVED_END_TIME;
|
|
this.percentage = shiftDetails.PERCENTAGE;
|
|
this.percChart = this.percentage.substring(0, this.percentage.indexOf('%'));
|
|
// const test = this.scheduleDate;
|
|
const splitdate = this.scheduleDate.split(' ');
|
|
const date = splitdate[0];
|
|
const localDate = date.split('/');
|
|
this.day = localDate[1];
|
|
this.year = localDate[2];
|
|
// tslint:disable-next-line: radix
|
|
this.month = parseInt(localDate[0]) + 1;
|
|
this.nameMonth = this.direction === 'ltr' ? this.common.getMonthName(this.month) : this.common.getMonthNameAr(this.month);
|
|
this.nameDay = this.getHeaderDay(new Date(date));
|
|
const d = new Date(date);
|
|
this.data = {
|
|
labels: ['percentage'],
|
|
datasets: [
|
|
{
|
|
data: [this.percChart],
|
|
backgroundColor: [
|
|
'#094875'
|
|
],
|
|
borderWidth: 2
|
|
}]
|
|
};
|
|
}
|
|
|
|
slideChanged(ev) {
|
|
this.slides.getActiveIndex().then(index => {
|
|
const shiftDetails = this.SHIFTDETAILS.GetScheduleShiftsDetailsList[index];
|
|
this.assignData(shiftDetails);
|
|
});
|
|
}
|
|
|
|
getHeaderDay(date: any) {
|
|
if (this.direction === 'ltr') {
|
|
return this.weekDaysEn[date.getDay()];
|
|
} else {
|
|
return this.weekDaysAr[date.getDay()];
|
|
}
|
|
}
|
|
}
|