Browse Source

review comments

master
ganga satish kumar 3 years ago
parent
commit
a319f6fb7d
  1. 4
      src/app/annual-health-checkup/add-dependants/add-dependants.component.html
  2. 6
      src/app/annual-health-checkup/add-dependants/add-dependants.component.scss
  3. 13
      src/app/annual-health-checkup/add-dependants/add-dependants.component.ts
  4. 98
      src/app/annual-health-checkup/generate-letter/generate-letter.component.ts
  5. 76
      src/app/annual-health-checkup/schedule-appointment/schedule-appointment.component.html
  6. 149
      src/app/annual-health-checkup/schedule-appointment/schedule-appointment.component.ts
  7. 33
      src/constants/constants.ts

4
src/app/annual-health-checkup/add-dependants/add-dependants.component.html

@ -1,4 +1,5 @@
<div class="page-container" id="addDependants">
<span class="material-icons back-icon" (click)="navigateToPrevious()">arrow_back_ios_new</span>
<form
id="create-enquiry-form"
class="create-enquiry-form"
@ -34,12 +35,11 @@
</mat-select>
</mat-form-field>
</div>
<hr/>
<hr *ngIf='i!=5'/>
</div>
<div class="align-middle">
<button class="font-body-xsmall-bold" type="button" (click)="createEnquirySubmitHandler()" [disabled]="isMaxCount">Add Dependants</button>
<button class="font-body-xsmall-bold" type="button" (click)="createEnquirySubmitHandler()">Submit</button>
</div>
</form>
</div>

6
src/app/annual-health-checkup/add-dependants/add-dependants.component.scss

@ -2,6 +2,9 @@
padding: 5%;
margin-bottom: 2.5em;
height: auto;
.back-icon{
margin-top: 5% !important;
}
.align-middle{
width: 100% !important;
.input-field{
@ -33,5 +36,8 @@
left:5%;
background: white !important;
}
hr:last-child(){
display: none;
}
}

13
src/app/annual-health-checkup/add-dependants/add-dependants.component.ts

@ -1,6 +1,7 @@
import { Component, ElementRef, OnInit, ViewChild } from "@angular/core";
import { FormBuilder, FormGroup, Validators } from "@angular/forms";
import { GENDER_LIST } from "src/constants/constants";
import { Router } from "@angular/router";
import { GENDER_LIST, SCHEDULE_APPOINTMENT } from "src/constants/constants";
@Component({
selector: "app-add-dependants",
@ -19,7 +20,7 @@ export class AddDependantsComponent implements OnInit {
isMaxCount: boolean = false;
genderList = GENDER_LIST;
constructor(private formBuilder: FormBuilder) {
constructor(private formBuilder: FormBuilder, private router:Router) {
this.createNewForm();
}
@ -41,5 +42,13 @@ export class AddDependantsComponent implements OnInit {
} else {
this.isMaxCount = true;
}
if(this.counterArr.length === 6){
this.isMaxCount = true;
}
}
navigateToPrevious(){
this.router.navigate([SCHEDULE_APPOINTMENT]);
}
}

98
src/app/annual-health-checkup/generate-letter/generate-letter.component.ts

@ -1,44 +1,38 @@
import { Component, ElementRef, OnInit, ViewChild } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { Component, ElementRef, OnInit, ViewChild } from "@angular/core";
import { FormBuilder, FormGroup, Validators } from "@angular/forms";
import { jsPDF } from "jspdf";
import * as pdfMake from "pdfmake/build/pdfmake";
import { GenerateLetterService } from "./generate-letter.service";
import * as pdfMake from 'pdfmake/build/pdfmake';
import { GenerateLetterService } from './generate-letter.service';
//import * as pdfFonts from 'pdfmake / build / vfs_fonts';
var pdfFonts = require('pdfmake/build/vfs_fonts.js');
var pdfFonts = require("pdfmake/build/vfs_fonts.js");
(pdfMake as any).vfs = pdfFonts.pdfMake.vfs;
var htmlToPdfmake = require("html-to-pdfmake");
@Component({
selector: 'app-generate-letter',
templateUrl: './generate-letter.component.html',
styleUrls: ['./generate-letter.component.scss']
selector: "app-generate-letter",
templateUrl: "./generate-letter.component.html",
styleUrls: ["./generate-letter.component.scss"],
})
export class GenerateLetterComponent implements OnInit {
generateLetterForm!: FormGroup;
name = 'Angular Html To Pdf ';
title:string = '';
location:string = '';
letterDate:string = '';
name = "Angular Html To Pdf ";
title: string = "";
location: string = "";
letterDate: string = "";
printPDF: boolean = false;
level:string = '';
level: string = "";
@ViewChild('pdfTable', {static: false}) pdfTable: ElementRef | undefined;
@ViewChild('content')
content!: ElementRef;
@ViewChild("pdfTable", { static: false }) pdfTable: ElementRef | undefined;
@ViewChild('generateLetterL0L1')
@ViewChild("generateLetterL0L1")
generateLetterL0L1!: ElementRef;
@ViewChild('generateLetterL3')
@ViewChild("generateLetterL3")
generateLetterL3!: ElementRef;
downloadPDFlevel3: boolean = false;
downloadPDFlevel0: boolean = false;
isDisabled: boolean = true;
constructor(
private formBuilder: FormBuilder,
private generateLetterService: GenerateLetterService
@ -46,32 +40,40 @@ export class GenerateLetterComponent implements OnInit {
this.createNewForm();
}
/**
* @description to initialize component
* @returns Void();
*/
ngOnInit(): void {
this.getUserDetails();
}
/**
* @description to create the user details.
* @returns Void();
*/
getUserDetails() {
let response;
const body = {
userId: 'E114989',
password: 'init1234'
userId: "E114989",
password: "init1234",
};
this.generateLetterService
.saveSelectedBike(body)
.subscribe(
(res: {
StatusCode: number;
IsRequestSuccessfull: any;
Data: any;
}) => {
(res: { StatusCode: number; IsRequestSuccessfull: any; Data: any }) => {
if (res && res?.StatusCode === 200 && res?.IsRequestSuccessfull) {
response = res && res?.Data ? res.Data : null;
}
});
}
);
}
/**
* @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 }],
@ -81,19 +83,25 @@ export class GenerateLetterComponent implements OnInit {
level: [{ value: "L3", disabled: true }],
location: [{ value: "Akrudi", disabled: true }],
date: [{ value: "22/02/2022", disabled: true }],
gender: [{value:"Male", disabled:true}]
gender: [{ value: "Male", disabled: true }],
});
this.title = this.generateLetterForm?.get('employeeName')?.value;
this.location = this.generateLetterForm?.get('location')?.value;
this.letterDate = this.generateLetterForm?.get('date')?.value;
this.level = this.generateLetterForm?.get('level')?.value;
this.title = this.generateLetterForm?.get("employeeName")?.value;
this.location = this.generateLetterForm?.get("location")?.value;
this.letterDate = this.generateLetterForm?.get("date")?.value;
this.level = this.generateLetterForm?.get("level")?.value;
}
/**
* @description to download PDF
* @returns Void();
*/
downloadPDF() {
this.printPDF = true;
const doc = new jsPDF();
const pdfTable:any = this.level === 'L3'? this.generateLetterL3.nativeElement : this.generateLetterL0L1.nativeElement;
const pdfTable: any =
this.level === "L3"
? this.generateLetterL3.nativeElement
: this.generateLetterL0L1.nativeElement;
//get table html
//const pdfTable = this.content.nativeElement;
@ -105,20 +113,26 @@ export class GenerateLetterComponent implements OnInit {
this.downloadPDFlevel3 = false;
this.downloadPDFlevel0 = false;
// doc.save("output.pdf");
//generateLetterL0L1
}
/**
* @description to create PDF based on L3, L0, L1.
* @returns Void();
*/
createEnquirySubmitHandler() {
this.printPDF = true;
if(this.level === 'L3'){
if (this.level === "L3") {
this.downloadPDFlevel3 = true;
} else {
this.downloadPDFlevel0 = true;
}
}
/**
* @description to create the user details.
* @returns Void();
*/
sendMail(): void {
console.log('sendMail');
console.log("sendMail");
}
}

76
src/app/annual-health-checkup/schedule-appointment/schedule-appointment.component.html

@ -2,8 +2,7 @@
<form
id="create-enquiry-form"
class="create-enquiry-form"
[formGroup]="generateLetterForm"
(submit)="createEnquirySubmitHandler()"
[formGroup]="scheduleAppointmentForm"
>
<div class="align-middle">
<mat-form-field class="input-field" appearance="outline">
@ -38,7 +37,7 @@
<div class="align-middle">
<mat-form-field class="input-field" appearance="fill">
<mat-label>Select additonal Test</mat-label>
<mat-select>
<mat-select (selectionChange)="selectedAdditonalTest($event)">
<mat-option *ngFor="let healthTest of additionalTests" [value]="healthTest">
{{healthTest}}
</mat-option>
@ -46,20 +45,16 @@
</mat-form-field>
</div>
<div class="align-middle">
<mat-form-field class="input-field" appearance="fill">
<mat-form-field class="input-field" appearance="outline">
<mat-label>Eligible Package</mat-label>
<mat-select>
<mat-option *ngFor="let package of eligiblePackage" [value]="package">
{{package}}
</mat-option>
</mat-select>
<input formControlName="eligiblePackage" matInput placeholder="Eligible Package" value="developer">
</mat-form-field>
</div>
<div class="align-middle">
<mat-form-field class="input-field" appearance="fill">
<mat-label>Hospital Name</mat-label>
<mat-select>
<mat-option *ngFor="let hospital of hospitalList" [value]="hospital.email">
<mat-select (selectionChange)="selectHospital($event)">
<mat-option *ngFor="let hospital of hospitalList" [value]="hospital.value">
{{hospital.value}}
</mat-option>
</mat-select>
@ -69,7 +64,7 @@
<mat-form-field class="input-field" appearance="fill">
<mat-label>Preferred date</mat-label>
<!-- #docregion toggle -->
<input matInput [matDatepicker]="picker" [min]="todayDate">
<input matInput [matDatepicker]="picker" [min]="todayDate" formControlName="preferredDate" required>
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker>
<!-- #enddocregion toggle -->
@ -81,12 +76,65 @@
<input formControlName="contactNumber" matInput placeholder="Contact Number" value="Male">
</mat-form-field>
</div>
<div class="align-middle medium-txt" (click)="createEnquirySubmitHandler()">
<div class="medium-txt font-body-xsmall-bold" (click)="downloadAppointment()">
Click to downlaod price list for each additional test
</div>
<div class="align-middle flex-row">
<button class="font-body-xsmall-bold" type="button" (click)="addDependants()">Add Dependants</button>
<button class="font-body-xsmall-bold" type="button" (click)="createEnquirySubmitHandler()">Submit</button>
<button class="font-body-xsmall-bold" type="button" [disabled]="!scheduleAppointmentForm.valid" (click)="createEnquirySubmitHandler()">Submit</button>
</div>
</form>
</div>
<div id="scheduleAppointmentPDF" #scheduleAppointmentPDF *ngIf="downloadPDF">
<p>Annual Health Check-up 2021-22</p>
<p>The rates of optional tests across empanelled hospitals in Pune are as follows:</p>
<table class="table table-bordered">
<thead>
<tr>
<th>Hospital Name</th>
<th>HIV-I & HIV-II by Tridot/ ELISA technique/HIV Rapid</th>
<th>Hb1Ac</th>
<th>Eye Check Package & Ophthalmologist consultation</th>
<th>Treadmill Test</th>
</tr>
</thead>
<tbody>
<tr>
<td>Apollo Hospital</td>
<td>Rs.500</td>
<td>Rs.500</td>
<td>Rs.300</td>
<td>Rs.1000</td>
</tr>
<tr>
<td>PCMC Hospital</td>
<td>Rs.700</td>
<td>Rs.350</td>
<td>Rs.400</td>
<td>Rs.1000</td>
</tr>
<tr>
<td>Deenanath Mangesh Hospital</td>
<td>Rs.405</td>
<td>Rs.405</td>
<td>Rs.360</td>
<td>Rs.1080</td>
</tr>
<tr>
<td>Express Clinics</td>
<td>Rs.350</td>
<td>Rs.350</td>
<td>Rs.450</td>
<td>Rs.1000</td>
</tr>
<tr>
<td>Ruby Hall Clinic</td>
<td>Rs.595</td>
<td>Rs.808</td>
<td>Rs.600</td>
<td>Rs.1530</td>
</tr>
</tbody>
</table>
</div>

149
src/app/annual-health-checkup/schedule-appointment/schedule-appointment.component.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 {
generateLetterForm!: FormGroup;
name = 'Angular Html To Pdf ';
additionalTests:string[] = ADDITIONAL_TEST;
scheduleAppointmentForm!: FormGroup;
name = "Angular Html To Pdf ";
additionalTests: string[] = SENIOR_LEVEL_ADDITONAL_TEST;
hospitalList: any[] = SELECT_HOSPITAL;
eligiblePackage:string[] = ELIGIBLE_PACKAGE;
todayDate:Date = new Date();
todayDate: any = new Date();
downloadPDF: boolean = false;
level: string = "";
hospitalObject: any;
additionaltest: any;
interval: any;
@ViewChild('pdfTable', {static: false}) pdfTable: ElementRef | undefined;
@ViewChild('content')
content!: ElementRef;
@ViewChild("pdfTable", { static: false }) pdfTable: ElementRef | undefined;
@ViewChild("scheduleAppointmentPDF")
scheduleAppointmentPDF!: 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}],
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 }],
additonalTest: [""],
eligiblePackage: ["eligiblePackage"],
hospitalName: ["hospitalName"],
preferredDate: ['preferredDate'],
contactNumber: ['9730370631'],
date: ["22/02/2022"],
gender: ["Male"]
eligiblePackage: [{ value: "eligiblePackage", disabled: true }],
preferredDate: ["", Validators.required],
contactNumber: ["9730370631", Validators.required],
gender: ["Male"],
});
}
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() {
this.router.navigate(['addDependants']);
console.log('click');
this.router.navigate([ADD_DEPENDENTS]);
}
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);
}
}

33
src/constants/constants.ts

@ -6,26 +6,6 @@ of the constant name and also the naming convention should be in
all caps.
*/
export const ALPHABETS_STRING = 'abcdefghijklmnopqrstuvwxyz';
export const NUMBERS_STRING = '0123456789';
export const SALT_VALUE = 'You can count on my steel';
export const NO_FINGERPRINT = 'No fingerprint available';
export const MAX_RETRY_ATTEMPTS = 1;
export const ENDPOINTS_TO_EXCLUDE = {
'tokenCall': 'oauth2/v6/tokens'
};
export const CLIENT_ID_FOR_TOKEN_GEN = {
'SIDWEB': 'SIDWeb'
};
export const ADDITIONAL_TEST = [
'HIV-I & HIV-II',
'Tridot/ ELISA',
'technique/HIV',
'Rapid',
'Hb1Ac', 'Eye Check Package', 'Ophthalmologist consultation'
];
export const SELECT_HOSPITAL = [
{value:'Ruby Hall, Pune', mail:'health@rubyhall.com'},
{value:'Deenanath Mangeshkar Hospital, Pune', mail:'pr@dmhospital.org'},
@ -40,16 +20,21 @@ export const SELECT_HOSPITAL = [
{value:'Express Clinics, Shop No 18, 19, 20, Empire Estate, Old Mumbai-Pune Highway, Chinchwad, Pune – 411019',mail:'chipnq@expressclinics.in'}
];
export const ELIGIBLE_PACKAGE = [
'Senior Level Package (L0-L1)',
'Middle Level Package (L2-L3)'
];
export const MIDDLE_LEVEL_ADDITONAL_TEST= ['HIV-I & HIV-II by Tridot/ ELISA technique/HIV Rapid','Hb1Ac','Eye Check Package & Ophthalmologist consultation'];
export const SENIOR_LEVEL_ADDITONAL_TEST= ['HIV-I & HIV-II by Tridot/ ELISA technique/HIV Rapid','Hb1Ac','Eye Check Package & Ophthalmologist consultation','Treadmill Test'];
export const SENIOR_LEVEL_PACKAGE = 'Middle Level Package (L2-L3)';
export const MIDDLE_LEVEL_PACKAGE = 'Senior Level Package (L0-L1)';
export const GENDER_LIST = [
'Male',
'Female'
];
export const SCHEDULE_APPOINTMENT = 'scheduleAppointment';
export const ADD_DEPENDENTS = 'addDependants';
Loading…
Cancel
Save