1 2 3 4 5 Merged
1 2 3 4 5 Merged
1 2 3 4 5 Merged
MANAGEMENT SYSTEM
A REPORT
submitted by
MENDE SHASHI PREETHAM (22MIC0136)
ANAMPALLI ESHWAR (22MIC0098)
VISSHAL E (22MIC0192)
D SAI DHARANIDHAR REDDY (22MID0223)
JANARTHANAN N S (22MID0351)
for
CSI1007-Software Engineering Principles
April 2024
VELLORE INSTITUTE OF TECHNOLOGY, VELLORE – 632014
SCHOOL OF COMPUTER SCIENCE AND ENGINEERING
BONAFIDE CERTIFICATE
LAB IN-CHARGE
INTRODUCTION
The Integrated Healthcare Management System (IHMS) is a comprehensive software solution aimed at
facilitating the efficient management of healthcare facilities. IHMS integrates various functionalities
including patient management, electronic health records (EHR), appointment scheduling, billing, and
reporting to streamline operations and enhance patient care. This document outlines the functional and
non-functional requirements of the IHMS.
SCOPE
The IHMS will provide healthcare facilities with a centralized platform to manage patient information,
appointments, billing, and reporting. The system will support multiple user roles including
administrators, healthcare providers, and patients. Key features of the IHMS include:
- Electronic Health Records (EHR): Digital storage and retrieval of patient health information.
- Reporting: Generation of various reports including patient demographics, revenue, and operational
efficiency.
FUNCTIONAL REQUIREMENTS
1. User Management
- The system shall support multiple user roles including administrators, healthcare providers, and
patients.
- Administrators shall have the authority to add, modify, and deactivate user accounts.
2. Patient Management
- Healthcare providers shall have access to patient demographics, medical history, and visit records.
- The system shall support the creation and maintenance of electronic health records (EHR) for each
patient.
3. Appointment Management
- Patients shall be able to schedule, reschedule, and cancel appointments through the system.
- Healthcare providers shall have access to their appointment schedules and be able to manage them.
- The system shall generate bills based on services rendered and patient information.
5. Reporting
- The system shall generate various reports including patient demographics, revenue, and appointment
statistics.
NON-FUNCTIONAL REQUIREMENTS
1. Performance
- The system shall be able to handle concurrent user sessions without significant degradation in
performance.
- Response time for common tasks such as appointment scheduling shall be less than 2 seconds.
2. Security
- The system shall comply with industry standards for data security including encryption of sensitive
information.
- User authentication shall be required for accessing patient health records and other confidential data.
3. Scalability
- The system architecture shall be scalable to accommodate the growing needs of healthcare facilities.
- Additional servers and resources shall be easily added to handle increased user load.
4. Usability
- The user interface shall be intuitive and easy to navigate for users with varying levels of technical
expertise.
- The system shall provide contextual help and guidance to assist users in performing tasks.
CONCLUSION
The Integrated Healthcare Management System (IHMS) is designed to streamline operations and
enhance patient care in healthcare facilities. By integrating patient management, electronic health
records, appointment scheduling, billing, and reporting functionalities, IHMS provides a
comprehensive solution to meet the needs of modern healthcare organizations.
GLOSSARY
The 0 level dfd known as context level data flow diagram. The context level data flow diagram
(dfd) is describing the whole system. The (o) level dfd describe the all user modules who run the
system. Below context level data flow diagram of hospital management system project shows the
one Admin user can operate the system. Admin do all activities after login to system.
4.2 MODULE-1
4.3 MODULE-2
4.4 MODULE-3
Login.java
import java.util.*;
/**
*
*/
public class LOGIN {
/**
* Default constructor
*/
public LOGIN() {
}
/**
*
*/
private STRING USERNAME;
/**
*
*/
private STRING PASSWORD;
/**
* @param USERNAME
* @param PASSWORD
* @return
*/
public BOOLEAN LOGIN_VERIFICATION(STRING USERNAME, STRING
PASSWORD) {
// TODO implement here
return null;
}
Receptionist.java
import java.util.*;
/**
*
*/
public class RECEPTIONIST extends BILL {
/**
* Default constructor
*/
public RECEPTIONIST() {
}
/**
*
*/
private STRING NAME;
/**
*
*/
private STRING RECEPTIONISTID;
/**
*
*/
private FLOAT PHONENUMBER;
/**
* @param NAME
* @param RECEPTIONISTID
* @param PHONENUMBER
* @return
*/
public STRING VIEWPROFILE(STRING NAME, STRING RECEPTIONISTID, FLOAT
PHONENUMBER) {
// TODO implement here
return null;
}
/**
* @param NAME
* @param PATIENTID
* @param AGE
* @param MOBILENO
* @param HEALTHISSUE
* @return
*/
public STRING EDITPATIENTDETAILS(STRING NAME, INT PATIENTID, INT AGE,
FLOAT MOBILENO, STRING HEALTHISSUE) {
// TODO implement here
return null;
}
/**
* @param NAME
* @param DOCTORID
* @param SPECIALIZATION
* @param MOBILENO
* @return
*/
public STRING EDITDOCTORDETAILS(STRING NAME, INT DOCTORID, STRING
SPECIALIZATION, FLOAT MOBILENO) {
// TODO implement here
return null;
}
Patient.java
import java.util.*;
/**
*
*/
public class PATIENT extends BILL {
/**
* Default constructor
*/
public PATIENT() {
}
/**
*
*/
private STRING NAME;
/**
*
*/
private INT PATIENTID;
/**
*
*/
private INT AGE;
/**
*
*/
private STRING HEALTHISSUE;
/**
*
*/
private FLOAT MOBILENO;
/**
* @param NAME
* @param PATIENTID
* @param AGE
* @param HEALTHISSUE
* @param MOBILENO
* @return
*/
public STRING VIEWDETAILS(STRING NAME, INT PATIENTID, INT AGE, STRING
HEALTHISSUE, FLOAT MOBILENO) {
// TODO implement here
return null;
}
Doctor.java
import java.util.*;
/**
* Default constructor
*/
public DOCTOR() {
}
/**
*
*/
private STRING NAME;
/**
*
*/
private INT DOCTORID;
/**
*
*/
private STRING SPECIALIZATION;
/**
* @param NAME
* @param DOCTORID
* @param SPECIALIZATION
* @param MOBILENO
* @return
*/
public STRING VIEWDETAILS(STRING NAME, INT DOCTORID, STRING
SPECIALIZATION, FLOAT MOBILENO) {
// TODO implement here
return null;
}
Service Info.java
import java.util.*;
/**
/**
* Default constructor
*/
public SERVICE INFO() {
}
/**
*
*/
private INT ROOMNO;
/**
*
*/
private INT BEDNO;
/**
*
*/
private STRING ROOMTYPE;
/**
* @param ROOMNO
* @param BEDNO
* @param ROOMTYPE
* @return
*/
public STRING VIEWDETAILS(INT ROOMNO, INT BEDNO, STRING ROOMTYPE)
{
// TODO implement here
return null;
}
Bill.java
import java.util.*;
/**
*
*/
private class BILL {
/**
* Default constructor
*/
private BILL() {
}
/**
*
*/
private INT APPOINTMENTFEE;
/**
*
*/
private INT ROOMFEE;
/**
*
*/
private INT EXTRAFEE;
/**
* @param APPOINTMENTFEE
* @param ROOMFEE
* @param EXTRAFEE
* @return
*/
public INT VIEWBILLDETAILS(INT APPOINTMENTFEE, INT ROOMFEE, INTEXTRAFEE)
{
// TODO implement here
return null;
}
/**
* @param APPOINTMENTFEE
* @param ROOMFEE
* @param EXTRAFEE
* @return
*/
public INT PATIENTPAYSBILL(INT APPOINTMENTFEE, INT ROOMFEE, INTEXTRAFEE)
{
// TODO implement here
return null;
}
}
CHAPTER 5
TESTING
6.1 Results
6.2 Discussion on Results
SNAP SHOTS OF IMPLEMENTATION OF WORK
Loginpage.html:
<html>
<body>
<h1ALIGN="center">NANDIKA HOSPITALS</h1>
<imgsrc="E:\HOS\LOGO.jpg"alt="Avatar"class="avatar">
<h2>Username</h2>
<inputtype="text">
<h2>Password</h2>
<inputtype="text"><br><br><br>
<ahref="E:\HOS\HOMEPAGE1.html"target="blank"><buttonclass="button">LOGIN</butt
on></a>
</body>
<style>
h1 {
color: black;
font-family: Times New Roman;
font-size: 300%;
text-shadow: 2px2px;
}
img.avatar {
border-radius: 50%;
height: 100px;
width: 100px;
}
.button {
border: none;
color: black;
padding: 15px32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px2px;
cursor: pointer;
}
body{
background-image: url('https://thumbs.dreamstime.com/b/healthcare-technology-
doctor-using-digital-tablet-icon-medical-network-hospital-background-
162019727.jpg');
padding-top: 50px;
padding-right: 150px;
padding-bottom: 300px;
padding-left: 150px;
text-align: center;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
</style>
</html>
HOMEPAGE.html:
<STYLE>
body{
background-image: url('https://thumbs.dreamstime.com/b/healthcare-
technology-doctor-using-digital-tablet-icon-medical-network-hospital-
background-162019727.jpg');
padding-top: 50px;
padding-right: 150px;
padding-bottom: 300px;
padding-left: 150px;
text-align: center;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.imgcontainer {
text-align: center;
margin: 24px012px0;
img.avatar {
border-radius: 50%;
height: 100px;
width: 100px;
}
h1 {
color: black;
font-family: Times New Roman;
font-size: 300%;
text-shadow: 2px2px;
}
p {
color: MediumSeaGreen;
font-family: Times New Roman;
font-size: 160%;
}
.button {
border: none;
color: blue;
padding: 15px32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px2px;
cursor: pointer;
}
</STYLE>
<bodystyle="background-color: bisque;">
<h1>NANDIKA HOSPITALS</h1>
<divclass="imgcontainer">
<imgsrc="https://thumbs.dreamstime.com/b/hospital-logo-template-hospital-
logo-template-117487677.jpg"alt="Avatar"class="avatar">
</div>
<ahref="E:\HOS\PATIENT.HTML"target="blank">
<buttonclass="button button1"> PATIENT DETAILS</button></a>
<ahref="E:\HOS\editing.html"target="blank">
<button
class="button button2">DOCTOR DETAILS</button></a>
<ahref="E:\HOS\SERVICE.html"target="blank"><buttonclass="button
button3">SERVICE INFO</button></a>
<ahref="E:\HOS\bill.html"target="blank"><button
class="button button4">BILL DATA</button></a>
<ahref="E:\HOS\loginpage.html"target="blank"><buttonclass="button
button7">LOGOUT</button></a>
</body>
After logging in, user enters into the home page of our project where it
has several options (functionalities) as patient details, doctor details,
service info, bill data and logout
PATIENT.html:
<style>
body{
background-image: url('https://thumbs.dreamstime.com/b/healthcare-
technology-doctor-using-digital-tablet-icon-medical-network-hospital-
background-162019727.jpg');
padding-top: 50px;
padding-right: 150px;
padding-bottom: 300px;
padding-left: 150px;
text-align: center;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
</style>
<body>
<br>
<br>
<form>
<h1align="center">PATIENT DETAILS</h1>
<label>Firstname: </label><br>
<inputtype="text"name="firstname"><br><br>
<label>Middlename: </label><br>
<inputtype="text"name="middlename"><br><br>
<label>Lastname: </label><br>
<inputtype="text"name="lastname"><br><br>
<label> AGE </label> <br>
<inputtype="text"name="AGE"><br><br>
<label>
DISEASE TYPE :
</label>
<select>
<option>HEART</option>
<option>DIABETES</option>
<option>DENGUE</option>
<option>CORONA</option>
</select>
<br>
<br>
<label>
Gender :
</label><br>
<inputtype="radio"name="male"/> Male <br>
<inputtype="radio"name="female"/> Female <br>
<inputtype="radio"name="other"/> Other
<br>
<br>
<label>
Phone :
</label>
<inputtype="text"name="country code" value="+91"size="2"/>
<inputtype="text"name="phone"size="10"/><br><br>
Address
<br>
<textareacols="80"rows="5"value="address">
</textarea>
<br><br>
<ahref="E:\HOS\dialogue.html"><inputtype="button"value="Submit"/></a>
</form>
</body>
SAVED SUCCESSFULLY.html:
<!DOCTYPEhtml>
<style>
body{
background-image: url('https://thumbs.dreamstime.com/b/healthcare-technology-
doctor-using-digital-tablet-icon-medical-network-hospital-background-
162019727.jpg');
padding-top: 50px;
padding-right: 150px;
padding-bottom: 600px;
padding-left: 150px;
text-align: center;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
</style>
<html>
<body>
<BR><BR><BR><BR><BR>
<dialogopen><H2STYLE="COLOR:BLUE">SAVED SUCCESSFULLY</H2></dialog>
</body>
</html>
When user submits the details of the patient, it shows the message as
saved successfully.
DOCTOR.html:
<style>
body{
background-image: url('https://thumbs.dreamstime.com/b/healthcare-
technology-doctor-using-digital-tablet-icon-medical-network-hospital-
background-162019727.jpg');
padding-top: 50px;
padding-right: 150px;
padding-bottom: 300px;
padding-left: 150px;
text-align: center;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.imgcontainer {
text-align: center;
margin: 24px012px0;
img.avatar {
border-radius: 50%;
height: 100px;
width: 100px;
}
h1 {
color: black;
font-family: Times New Roman;
font-size: 300%;
text-shadow: 2px2px;
}
p {
color: MediumSeaGreen;
font-family: Times New Roman;
font-size: 160%;
}
.button {
border: none;
color: blue;
padding: 15px32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px2px;
cursor: pointer;
}
</style>
<bodystyle="background-color: bisque;">
<h1>NANDIKA HOSPITALS</h1>
<divclass="imgcontainer">
<imgsrc="https://thumbs.dreamstime.com/b/hospital-logo-template-hospital-
logo-template-117487677.jpg"alt="Avatar"class="avatar">
</div>
<ahref="E:\HOS\docediting.html"target="blank"><buttonclass="button
button1"> EDIT DETAILS</button></a>
<ahref="E:\HOS\doctor.html"target="blank"><buttonclass="button
button2">NEW DETAILS</button></a>
</body>
On clicking doctor details, it shows two options as edit details and new
details to be updated or added by user.
EDIT DETAILS.html:
<STYLE>
body{
background-image: url('https://thumbs.dreamstime.com/b/healthcare-
technology-doctor-using-digital-tablet-icon-medical-network-hospital-
background-162019727.jpg');
padding-top: 50px;
padding-right: 150px;
padding-bottom: 300px;
padding-left: 150px;
text-align: center;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
</STYLE>
<body>
<formalign = "center">
<label><H1>ENTER THE DOCTOR ID</H1></label>
<inputtype="text"placeholder="enter Id here"><br><br>
<inputtype="button"value="submit">
</form>
</body>
When user clicks on edit details, it asks to enter the doctor id so that the
user can edit the details of the doctor
NEW DETAILS.html:
<style>
body{
background-image: url('https://thumbs.dreamstime.com/b/healthcare-
technology-doctor-using-digital-tablet-icon-medical-network-hospital-
background-162019727.jpg');
padding-top: 50px;
padding-right: 150px;
padding-bottom: 300px;
padding-left: 150px;
text-align: center;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
h1{
text-align: center;
color:black;
text-shadow: 2px2px;
font-family:'Times New Roman', Times, serif;
font-size: 300%;
}
</style>
<!DOCTYPEhtml>
<htmllang="en">
<head>
<metacharset="UTF-8">
<metaname="viewport"content="width=device-width, initial-scale=1.0">
<metahttp-equiv="X-UA-Compatible"content="ie=edge">
<title>Doctor Information Form</title>
<scriptsrc="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<scriptsrc="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.j
s"></script>
<linkrel="stylesheet"href="style.css">
</head>
<bodystyle="background-color:CadetBlue;">
<divclass="main">
<divclass="a">
<h1align="center"><br/>Doctor Details</h1>
<formclass="myForm"method="get"enctype="application/x-www-
form-urlencoded"action="/html/codes/html_form_handler.cfm">
</br>
<h3><br/>Doctor Name</h3>
<p>
<label>First Name:
<label>Middle Name:
<p>
<label>Date of Birth:
<inputtype="datetime-
local"name="doc_dob"required>
</label>
<fieldset>
<legend>Gender:</legend>
<p><labelclass="choice"><inputtype="radio"name="gender"requiredvalue="male">Ma
le</label></p>
<p><labelclass="choice"><inputtype="radio"name="gender"requiredvalue="female">
Female</label></p>
<p><labelclass="choice"><inputtype="radio"name="gender"requiredvalue="others">
Others</label></p>
</fieldset>
<label>Date of appointment:
<inputtype="datetime-
local"name="appointment_time"required>
</label>
</p>
</br>
<h3>Educational Qualifications:</h3>
<tableid = "table">
<tr>
<th>Serial</th>
<th>Degree</th>
<th>Board/Institute</th>
<th>Year</th>
<th>Division/CGPA</th>
<th>Position</th>
</tr>
<tr>
<td><label>1.</label></td>
<td>SSC/O'Levels</td>
<td><inputtype="test"name="inst_name"placeholder="insert institute
name"required></td>
<td><inputtype="test"name="year"placeholder="insert year of
graduation"required></td>
<td><inputtype="test"name="div/cgpa"placeholder="insert
division/cgpa"required></td>
<td><inputtype="test"name="position"placeholder="insert
position"required></td>
</tr>
<tr>
<td><label>2.</label></td>
<td>HSC/A'Levels</td>
<td><inputtype="test"name="inst_name"required></td>
<td><inputtype="test"name="year"required></td>
<td><inputtype="test"name="div/cgpa"required></td>
<td><inputtype="test"name="position"required></td>
</tr>
<tr>
<td><label>3.</label></td>
<td>MBBS</td>
<td><inputtype="test"name="inst_name"required></td>
<td><inputtype="test"name="year"required></td>
<td><inputtype="test"name="div/cgpa"required></td>
<td><inputtype="test"name="position"required></td>
</tr>
<tr>
<td><label>4.</label></td>
<td><inputtype="test"name="degree"placeholder="insert degree"></td>
<td><inputtype="test"name="inst_name"></td>
<td><inputtype="test"name="year"></td>
<td><inputtype="test"name="div/cgpa"></td>
<td><inputtype="test"name="position"></td>
</tr>
<tr>
<td><label>5.</label></td>
<td><inputtype="test"name="degree"></td>
<td><inputtype="test"name="inst_name"></td>
<td><inputtype="test"name="year"></td>
<td><inputtype="test"name="div/cgpa"></td>
<td><inputtype="test"name="position"></td>
</tr>
</table>
</br>
<h3>Experience:</h3>
<tableid = "table">
<tr>
<th>Serial</th>
<th>Job Designation</th>
<th>From</th>
<th>To</th>
<th>Organization</th>
</tr>
<tr>
<td><label>1.</label></td>
<td><inputtype="test"name="job_desg"placeholder="insert job
designation"required></td>
<td><inputtype="date"name="from"placeholder="insert starting
date"required></td>
<td><inputtype="date"name="to"placeholder="insert regination
date"required></td>
<td><inputtype="test"name="org_name"placeholder="insert name of
organization"required></td>
</tr>
<tr>
<td><label>2.</label></td>
<td><inputtype="test"name="job_desg"></td>
<td><inputtype="date"name="from"></td>
<td><inputtype="date"name="to"></td>
<td><inputtype="test"name="org_name"></td>
</tr>
<tr>
<td><label>3.</label></td>
<td><inputtype="test"name="job_desg"></td>
<td><inputtype="date"name="from"></td>
<td><inputtype="date"name="to"></td>
<td><inputtype="test"name="org_name"></td>
</tr>
<tr>
<td><label>4.</label></td>
<td><inputtype="test"name="job_desg"></td>
<td><inputtype="date"name="from"></td>
<td><inputtype="date"name="to"></td>
<td><inputtype="test"name="org_name"></td>
</tr>
<tr>
<td><label>5.</label></td>
<td><inputtype="test"name="job_desg"></td>
<td><inputtype="date"name="from"></td>
<td><inputtype="date"name="to"></td>
<td><inputtype="test"name="org_name"></td>
</tr>
</table>
<br/>
<fieldset>
<legend>Membership:</legend>
<labelclass="choice"><inputtype="radio"name="membership"requiredvalue="BMA">BM
A</label>
<labelclass="choice"><inputtype="radio"name="membership"requiredvalue="brit_me
d">British Medical Society</label>
<labelclass="choice"><inputtype="radio"name="membership"requiredvalue="amer_me
d">American Medical Society</label>
<labelclass="choice"><inputtype="radio"name="membership"requiredvalue="others"
>Others</label></p>
</fieldset>
<p><button>Submit</button></p>
</form>
</div>
<divclass="footer">
</div>
</div>
</body>
</html><SCRIPTLanguage=VBScript>
When user clicks on new details, it shows several details of the new
doctor to be added such as name, date of birth, gender, date of joining,
educational qualifications, experience and membership.
SERVICEINFO.html:
<style>
body{
background-image: url('https://thumbs.dreamstime.com/b/healthcare-
technology-doctor-using-digital-tablet-icon-medical-network-hospital-
background-162019727.jpg');
padding-top: 50px;
padding-right: 150px;
padding-bottom: 300px;
padding-left: 150px;
text-align: left;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
h1{
text-align: center;
color:black;
text-shadow: 2px2px;
font-family:'Times New Roman', Times, serif;
font-size: 300%;
}
p{
color: darkred;
}
</style>
<body>
<form>
<h1>SERVICE INFO</h1>
<p><b>NOTE: </b>This is only applicable for patients who are admitting in
hospital</p>
<label>PATIENT NAME</label><br><br>
<inputtype="text"placeholder="enter the patient name"><br><br>
<label>AGE</label><br><br>
<inputtype="text"placeholder="enter the patient age"><br><br>
<label>
Gender :
</label><br>
<inputtype="radio"name="male"/> Male <br>
<inputtype="radio"name="female"/> Female <br>
<inputtype="radio"name="other"/> Other
<br>
<br>
<label>ROOM TYPE</label><br>
<inputtype="radio"name="AC"/> AC<br>
<inputtype="radio"name="NON_AC"/>NON-AC<br><br>
<label>WARD</label><br>
<select>
<option>General</option>
<option>single patient room</option>
<option>Double patient room</option>
<option>Triple patien room</option>
</select><br><br>
<label>Do you want food provided by the hospital</label><br>
<inputtype="radio"name="yes"/> YES <br>
<inputtype="radio"name="no"/> NO <br>
<label>Do you want special care taker</label><br>
<inputtype="radio"name="yes"/> YES <br>
<inputtype="radio"name="no"/> NO <br><br>
<ahref="E:\HOS\dialogue1.html"><inputtype="button"value="submit"></a>
</form>
</body>
When user clicks on service info, it will be rediected into service info
portal where user has to enter the details like name, age, gender of the
patient and should enter the room type, ward type, whether the patient
needs to be provided food and care taker based on patient’s interest.
SAVED SERVICES.html:
<!DOCTYPEhtml>
<style>
body{
background-image: url('https://thumbs.dreamstime.com/b/healthcare-technology-
doctor-using-digital-tablet-icon-medical-network-hospital-background-
162019727.jpg');
padding-top: 50px;
padding-right: 150px;
padding-bottom: 600px;
padding-left: 150px;
text-align: center;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
</style>
<html>
<body>
<BR><BR><BR><BR><BR>
</body>
</html>
When the user clicks on the submit button, it shows the message as
selected services are granted.
BILLDATA.html:
<!doctypehtml>
<html>
<head>
<style>
body{
margin:20px;
border: 5pxsolidblack;
background-image: url('https://encrypted-
tbn0.gstatic.com/images?q=tbn:ANd9GcSXStr9XdbZpjnY_oW9sM8pClFMJ6ZKHnUC1h_3-
M81XiNYoAJJomPW25fr50ugTZac7XU&usqp=CAU');
padding-top: 50px;
padding-right: 150px;
padding-bottom: 300px;
padding-left: 150px;
text-align: center;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
h1{
text-align: center;
color:black;
text-shadow: 2px2px;
font-family: Times New Roman;
font-size: 300%;
}
p{
color: darkred;
}
</style>
<script>
functionadd(){
varnum1,num2,num3,num4,num5,num6;
num1=Number(document.getElementById("first").value);
num2=Number(document.getElementById("second").value);
num3=Number(document.getElementById("third").value);
num4=Number(document.getElementById("fourth").value);
num5=Number(document.getElementById("fifth").value);
num6=num1+num2+num3+num4+num5 ;
document.getElementById("answer").value= num6;
}
</script>
</head>
<body>
<divalign ="center">
<h1>BILL</h1>
<label><h4>Enter the appiontment charges</h4></label>
<inputtype="number" id="first"><br>
<label><h4>Enter the operations charges<h4></label>
<inputtype="number" id="second"><br>
<label><h4>Enter the Medical charges<h4></label>
<inputtype="number" id="third"><br>
<label><h4>Enter the Service charges<h4></label>
<inputtype="number" id="fourth" ><br>
<label><h4>Any additional charges<h4></label>
<inputtype="number" id="fifth"><br>
<br><br>
<buttononclick="add()">Total</button><br>
<h3>Amount To Be Paid:<inputid="answer"></h3>
<p><b>NOTE:</b> if you have any questions regarding this invoice please
contact hospital management</p>
</div>
</body>
</html>
—THE END—