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.
139 lines
3.5 KiB
TypeScript
139 lines
3.5 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';
|
|
|
|
@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;
|
|
tests: any;
|
|
year: any;
|
|
nameMonth: any;
|
|
nameDay: any;
|
|
public weekDaysEn = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
|
|
|
|
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
|
|
) { }
|
|
|
|
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.scheduled = this.TODAYDATE.SCHEDULED_HRS;
|
|
this.earlyOut = this.TODAYDATE.EARLY_OUT_HRS ;
|
|
this.scheduleDate = this.TODAYDATE.SCHEDULE_DATE;
|
|
this.assignData(this.SHIFTDETAILS.GetScheduleShiftsDetailsList[0]);
|
|
}
|
|
|
|
assignData(shiftDetails) {
|
|
this.shiftTime = shiftDetails.SHT_NAME;
|
|
this.startDate = shiftDetails.SHT_ACTUAL_START_TIME;
|
|
this.endDate = shiftDetails.SHT_ACTUAL_END_TIME;
|
|
this.percentage = shiftDetails.PERCENTAGE;
|
|
this.percChart = this.percentage.substring(0, this.percentage.indexOf('%'));
|
|
const test = this.scheduleDate;
|
|
const splitdate = test.split(' ');
|
|
const date = splitdate[0];
|
|
const test1 = date.split('/');
|
|
this.day = test1[1];
|
|
this.year = test1[2];
|
|
this.month = test1[0];
|
|
|
|
// tslint:disable-next-line: radix
|
|
this.nameMonth = this.getMonthName(parseInt(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);
|
|
});
|
|
}
|
|
|
|
public getMonthName(value: number): string {
|
|
switch (value) {
|
|
case 1:
|
|
return 'Jan';
|
|
case 2:
|
|
return 'Feb';
|
|
case 3:
|
|
return 'Mar';
|
|
case 4:
|
|
return 'Apr';
|
|
case 5:
|
|
return 'May';
|
|
case 6:
|
|
return 'Jun';
|
|
case 7:
|
|
return 'Jul';
|
|
case 8:
|
|
return 'Aug';
|
|
case 9:
|
|
return 'Sep';
|
|
case 10:
|
|
return 'Oct';
|
|
case 11:
|
|
return 'Nov';
|
|
case 12:
|
|
return 'Dec';
|
|
}
|
|
}
|
|
|
|
getHeaderDay(date: any) {
|
|
return this.weekDaysEn[date.getDay()];
|
|
}
|
|
}
|