7 changed files with 375 additions and 242 deletions
-
4src/app/annual-health-checkup/add-dependants/add-dependants.component.html
-
6src/app/annual-health-checkup/add-dependants/add-dependants.component.scss
-
13src/app/annual-health-checkup/add-dependants/add-dependants.component.ts
-
134src/app/annual-health-checkup/generate-letter/generate-letter.component.ts
-
76src/app/annual-health-checkup/schedule-appointment/schedule-appointment.component.html
-
157src/app/annual-health-checkup/schedule-appointment/schedule-appointment.component.ts
-
33src/constants/constants.ts
@ -1,66 +1,137 @@ |
|||
import { Component, ElementRef, OnInit, ViewChild } from '@angular/core'; |
|||
import { FormBuilder, FormGroup, Validators } from '@angular/forms'; |
|||
import { Router } from '@angular/router'; |
|||
import { ADDITIONAL_TEST, ELIGIBLE_PACKAGE, SELECT_HOSPITAL } from 'src/constants/constants'; |
|||
import { RouterService } from '../../shared/services/routerService'; |
|||
|
|||
import { THIS_EXPR } from "@angular/compiler/src/output/output_ast"; |
|||
import { Component, ElementRef, OnInit, ViewChild } from "@angular/core"; |
|||
import { FormBuilder, FormGroup, Validators } from "@angular/forms"; |
|||
import { Router } from "@angular/router"; |
|||
import { |
|||
SELECT_HOSPITAL, |
|||
SENIOR_LEVEL_PACKAGE, |
|||
MIDDLE_LEVEL_PACKAGE, |
|||
SENIOR_LEVEL_ADDITONAL_TEST, |
|||
MIDDLE_LEVEL_ADDITONAL_TEST, |
|||
SCHEDULE_APPOINTMENT, |
|||
ADD_DEPENDENTS, |
|||
} from "src/constants/constants"; |
|||
import { jsPDF } from "jspdf"; |
|||
import * as pdfMake from "pdfmake/build/pdfmake"; |
|||
import { MatSelectChange } from "@angular/material/select"; |
|||
var pdfFonts = require("pdfmake/build/vfs_fonts.js"); |
|||
(pdfMake as any).vfs = pdfFonts.pdfMake.vfs; |
|||
var htmlToPdfmake = require("html-to-pdfmake"); |
|||
@Component({ |
|||
selector: 'app-schedule-appointment', |
|||
templateUrl: './schedule-appointment.component.html', |
|||
styleUrls: ['./schedule-appointment.component.scss'] |
|||
selector: "app-schedule-appointment", |
|||
templateUrl: "./schedule-appointment.component.html", |
|||
styleUrls: ["./schedule-appointment.component.scss"], |
|||
}) |
|||
export class ScheduleAppointmentComponent implements OnInit { |
|||
scheduleAppointmentForm!: FormGroup; |
|||
name = "Angular Html To Pdf "; |
|||
additionalTests: string[] = SENIOR_LEVEL_ADDITONAL_TEST; |
|||
hospitalList: any[] = SELECT_HOSPITAL; |
|||
todayDate: any = new Date(); |
|||
downloadPDF: boolean = false; |
|||
level: string = ""; |
|||
hospitalObject: any; |
|||
additionaltest: any; |
|||
interval: any; |
|||
|
|||
generateLetterForm!: FormGroup; |
|||
name = 'Angular Html To Pdf '; |
|||
additionalTests:string[] = ADDITIONAL_TEST; |
|||
hospitalList:any[] = SELECT_HOSPITAL; |
|||
eligiblePackage:string[] = ELIGIBLE_PACKAGE; |
|||
todayDate:Date = new Date(); |
|||
@ViewChild("pdfTable", { static: false }) pdfTable: ElementRef | undefined; |
|||
@ViewChild("scheduleAppointmentPDF") |
|||
scheduleAppointmentPDF!: ElementRef; |
|||
|
|||
@ViewChild('pdfTable', {static: false}) pdfTable: ElementRef | undefined; |
|||
@ViewChild('content') |
|||
content!: ElementRef; |
|||
|
|||
constructor( |
|||
private formBuilder: FormBuilder, |
|||
private router: Router |
|||
) { |
|||
this.createNewForm(); |
|||
} |
|||
constructor(private formBuilder: FormBuilder, private router: Router) {} |
|||
|
|||
ngOnInit(): void { |
|||
this.downloadPDF = false; |
|||
this.createNewForm(); |
|||
let packageName = ""; |
|||
this.level = this.scheduleAppointmentForm?.get("level")?.value; |
|||
packageName = |
|||
this.level === "L3" ? SENIOR_LEVEL_PACKAGE : MIDDLE_LEVEL_PACKAGE; |
|||
this.additionalTests = |
|||
this.level === "L3" |
|||
? SENIOR_LEVEL_ADDITONAL_TEST |
|||
: MIDDLE_LEVEL_ADDITONAL_TEST; |
|||
this.scheduleAppointmentForm?.controls["eligiblePackage"].setValue( |
|||
packageName |
|||
); |
|||
this.todayDate.setDate(this.todayDate.getDate() + 1); |
|||
} |
|||
|
|||
/** |
|||
* @description to create the new form on the initialization of the component. |
|||
* @returns Void(); |
|||
*/ |
|||
|
|||
createNewForm(): void { |
|||
this.generateLetterForm = this.formBuilder.group({ |
|||
employeeId: [{value:"1234", disabled:true}], |
|||
employeeName: [{value:"bajaj", disabled:true}], |
|||
level: [{value:"L3", disabled:true}], |
|||
designation: [{value:"developer", disabled:true}], |
|||
department: [{value:"MIS", disabled:true}], |
|||
location: [{value:"Akrudi", disabled:true}], |
|||
additonalTest: [""], |
|||
eligiblePackage: ["eligiblePackage"], |
|||
hospitalName: ["hospitalName"], |
|||
preferredDate: ['preferredDate'], |
|||
contactNumber: ['9730370631'], |
|||
date: ["22/02/2022"], |
|||
gender: ["Male"] |
|||
this.scheduleAppointmentForm = this.formBuilder.group({ |
|||
employeeId: [{ value: "1234", disabled: true }, Validators.required], |
|||
employeeName: [{ value: "bajaj", disabled: true }, Validators.required], |
|||
level: [{ value: "L3", disabled: true }, Validators.required], |
|||
designation: [ |
|||
{ value: "developer", disabled: true }, |
|||
Validators.required, |
|||
], |
|||
department: [{ value: "MIS", disabled: true }], |
|||
location: [{ value: "Akrudi", disabled: true }], |
|||
eligiblePackage: [{ value: "eligiblePackage", disabled: true }], |
|||
preferredDate: ["", Validators.required], |
|||
contactNumber: ["9730370631", Validators.required], |
|||
gender: ["Male"], |
|||
}); |
|||
} |
|||
|
|||
createEnquirySubmitHandler(){ |
|||
createEnquirySubmitHandler() { |
|||
let responseObject = { |
|||
employeeId: this.scheduleAppointmentForm?.get("employeeId")?.value, |
|||
employeeName: this.scheduleAppointmentForm?.get("employeeName")?.value, |
|||
level: this.level, |
|||
department: this.scheduleAppointmentForm?.get("department")?.value, |
|||
location: this.scheduleAppointmentForm?.get("location")?.value, |
|||
additonalTest: this.additionaltest, |
|||
eligiblePackage: |
|||
this.scheduleAppointmentForm?.get("eligiblePackage")?.value, |
|||
hospitalName: this.hospitalObject, |
|||
preferredDate: this.scheduleAppointmentForm?.get("preferredDate")?.value, |
|||
contactNumber: this.scheduleAppointmentForm?.get("contactNumber")?.value, |
|||
}; |
|||
console.log(responseObject); |
|||
} |
|||
|
|||
addDependants() { |
|||
console.log('click'); |
|||
this.router.navigate([ADD_DEPENDENTS]); |
|||
} |
|||
|
|||
addDependants(){ |
|||
this.router.navigate(['addDependants']); |
|||
selectHospital(event: MatSelectChange) { |
|||
let selectedData; |
|||
selectedData = { |
|||
value: event.value, |
|||
text: event.source.triggerValue, |
|||
}; |
|||
console.log(selectedData); |
|||
this.hospitalObject = selectedData.value; |
|||
} |
|||
|
|||
selectedAdditonalTest(event: MatSelectChange) { |
|||
let selectedData; |
|||
selectedData = { |
|||
value: event.value, |
|||
text: event.source.triggerValue, |
|||
}; |
|||
this.additionaltest = selectedData.value; |
|||
} |
|||
|
|||
downloadAppointment() { |
|||
this.downloadPDF = true; |
|||
this.interval = setInterval(() => { |
|||
const doc = new jsPDF(); |
|||
//get table html
|
|||
const pdfTable = this.scheduleAppointmentPDF?.nativeElement; |
|||
//html to pdf format
|
|||
var html = htmlToPdfmake(pdfTable?.innerHTML); |
|||
const documentDefinition = { content: html }; |
|||
pdfMake.createPdf(documentDefinition).download(); |
|||
this.downloadPDF = false; |
|||
clearInterval(this.interval); |
|||
}, 1000); |
|||
} |
|||
} |
Write
Preview
Loading…
Cancel
Save
Reference in new issue