En este artículo vamos a crear un Sistema de Gestión Hospitalaria. Un Sistema de Gestión Hospitalaria se utiliza básicamente para gestionar pacientes en el hospital. Es útil ver qué pacientes no tienen una cama asignada o si hay camas libres o no. Asegura que las camas de los pacientes dados de alta no deben quedar libres, deben ser asignadas a quienes las necesitan.
Funcionalidad: un hospital puede hacer lo siguiente con este sistema de gestión hospitalaria:
- Mostrar todos los pacientes
- Añadir nuevos pacientes
- No agregue nuevos pacientes si no hay camas disponibles
- Dar de alta a los pacientes
Enfoque: Vamos a utilizar Body Parser mediante el cual podemos capturar los valores de entrada del usuario del formulario, como el nombre del paciente, el número, la fecha de nacimiento, la ciudad, el número de teléfono y el número de habitación, y almacenarlos en una colección. Luego enviaremos los datos de los pacientes a la página web usando EJS. EJS es un middleware que facilita el envío de datos desde su archivo de servidor (app.js o server.js) a una página web. También crearemos la Ruta de Alta para dar de alta a los pacientes.
Implementación: A continuación se muestra la implementación paso a paso del enfoque anterior.
Paso 1: Configuración del proyecto:
Inicializa NPM: cree y ubique la carpeta de su proyecto en la terminal y escriba el comando
npm init -y
Inicializa nuestra aplicación de Node y crea un archivo package.json.
Instale dependencias: ubique el directorio de su proyecto raíz en la terminal y escriba el comando
npm install express ejs body-parser
Para instalar Express, EJS y Body Parser como dependencias dentro de su proyecto
Crear archivo de servidor: cree un archivo ‘app.js’, dentro de este archivo se requiere el módulo Express y cree una ‘aplicación’ constante para crear una instancia del módulo express, luego configure el EJS como el motor de visualización predeterminado.
const express = require('express');
const app = express();
app.set('view engine', 'ejs');
También creamos una constante availableBeds y la configuramos con la cantidad de camas disponibles.
const availableBeds = 2;
Reorganice sus directorios: se requiere usar ‘.ejs’ como extensión para el archivo HTML en lugar de ‘.html’ para usar EJS dentro de él. Luego, debe mover todos los archivos ‘.ejs’ en el directorio de vistas dentro de su directorio raíz. EJS busca por defecto los archivos ‘.ejs’ dentro de la carpeta de vistas.
Use la variable EJS: dentro de su archivo .ejs actualizado, debe usar variables EJS para recibir valores de su archivo de servidor. Puede declarar variables en EJS como
<%= variableName %>
HTML
<!DOCTYPE html> <html> <head> <title>Page Title</title> </head> <body> <%= variableName %> </body> </html>
Envíe datos a una variable: dentro de su archivo de servidor ( app.js o index.js ), puede enviar un archivo EJS junto con algunos datos utilizando el método de procesamiento.
app.get("/", (req, res) => {
res.render("home", { variableName: "Hello Geeks!" })
})
Javascript
const express = require('express')
const app = express()
app.set('view engine', 'ejs')
app.get("/", (req, res) => {
res.render("home", { variableName: "Hello Geeks!" })
})
app.listen(3000, (req, res) => {
console.log("App is running on port 3000")
})
Obtener datos del formulario a app.js: para recibir valores de entrada de un formulario, tenemos que usar un paquete de Nodes llamado body-parser.
Instale el analizador de cuerpo:
npm install body-parser
Requerir módulo analizador de cuerpo:
const bodyParser = require('body-parser')
Y entonces:
app.use( bodyParser.json() );
app.use(bodyParser.urlencoded({
extended: true
}));
Entonces podemos manejar los datos del formulario usando el objeto de solicitud.
Paso 2: Obtener registros de pacientes: Tenemos una variedad de pacientes con diferentes propiedades. Enviemos la array a nuestra página web. En el paso anterior, solo enviamos un valor a la variable, ahora estamos enviando la array completa.
Javascript
const express = require('express')
const bodyParser = require('body-parser')
const patients = [{
name: 'Aditya',
number: '8175826846',
dob: '29/09/2001',
city: 'Mirzapur',
roomNo: '1',
}]
const app = express()
app.set('view engine', 'ejs')
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({
extended: true
}))
app.get("/", function (req, res) {
res.render("home", {
data: patients
})
})
app.listen(3000, (req, res) => {
console.log("App is running on port 3000")
})
Dado que tenemos tantos elementos dentro de nuestra array y tenemos que imprimir cada uno de ellos, tenemos que usar For Each Loop para recorrer cada elemento dentro de nuestra colección y mostrar los detalles.
HTML
<!DOCTYPE html>
<html>
<head>
<title>HMS</title>
</head>
<style>
table {
font-family: arial, sans-serif;
border-collapse: collapse;
width: 100%;
}
td,
th {
border: 1px solid #dddddd;
text-align: left;
padding: 8px;
}
tr:nth-child(even) {
background-color: #dddddd;
}
</style>
<body>
<h1>All Patients</h1>
<table>
<tr>
<th>Name</th>
<th>Number</th>
<th>DOB</th>
<th>City</th>
<th>Room No.</th>
</tr>
<% data.forEach(element=> { %>
<tr>
<td>
<%= element.name %>
</td>
<td>
<%= element.number %>
</td>
<td>
<%= element.dob %>
</td>
<td>
<%= element.city %>
</td>
<td>
<%= element.roomNo %>
</td>
</tr>
<% }) %>
</table>
</body>
</html>
Paso 3: Agregar pacientes a la lista: para esto, debemos crear un formulario y manejar los datos del formulario dentro de nuestro archivo ‘app.js’ usando Body Parser.
<form action="/" method="post">
<input type="text" placeholder="Name" name="name">
<input type="number" placeholder="Number" name="number">
<input type="text" placeholder="DOB" name="dob">
<input type="text" placeholder="City" name="city">
<button type="submit">Add</button>
</form>
Manejar datos de formulario dentro de ‘app.js’: tenemos que obtener valores de un formulario usando req.body.valueName, y luego organizarlo como un objeto y empujarlo dentro de la array de nuestro paciente.
app.post("/", (req, res) => {
const name = req.body.name
const number = req.body.number
const dob = req.body.dob
const city = req.body.city
if (patients.length < availableBeds) {
const roomNo = patients.length + 1;
patients.push({
name: name,
number: number,
dob: dob,
city: city,
roomNo: roomNo
})
res.render("home", {
data: patients
})
}
else {
res.send("No room available");
}
})
Solo empujamos a los pacientes si hay camas libres, si no, simplemente devolvemos el mensaje No hay habitaciones disponibles .
Paso 4: Dar de alta a los pacientes: Actualización de la página web dando una opción de alta: Tenemos que crear un formulario que envíe el nombre del paciente que queremos dar de alta al archivo del servidor ‘app.js’.
<form action="/discharge" method="post">
<input type="text" style="display: none;"
name="name" value="<%= element.name %>">
<button type="submit">Discharge</button>
</form>
Para dar de alta a los pacientes, tenemos que crear una ruta de alta donde vamos a obtener el nombre del paciente solicitado y buscar al paciente que tiene el mismo nombre, y eliminar el elemento.
app.post('/discharge', (req, res) => {
var name = req.body.name;
var j = 0;
patients.forEach(patient => {
j = j + 1;
if (patient.name == name) {
patients.splice((j - 1), 1)
}
})
res.render("home", {
data: patients
})
})
Código completo:
aplicación.js
Javascript
const express = require('express')
const bodyParser = require('body-parser')
const patients = [{
name: 'Aditya',
number: '8175826846',
dob: '29/09/2001',
city: 'Mirzapur',
roomNo: '1',
}]
const availableBeds = 2;
const app = express()
app.set('view engine', 'ejs')
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({
extended: true
}))
app.get("/", function (req, res) {
res.render("home", {
data: patients
})
})
app.post("/", (req, res) => {
const name = req.body.name
const number = req.body.number
const dob = req.body.dob
const city = req.body.city
if (patients.length < availableBeds) {
const roomNo = patients.length + 1;
patients.push({
name: name,
number: number,
dob: dob,
city: city,
roomNo: roomNo
})
res.render("home", {
data: patients
})
}
else {
res.send("No room available");
}
})
app.post('/discharge', (req, res) => {
var name = req.body.name;
var j = 0;
patients.forEach(patient => {
j = j + 1;
if (patient.name == name) {
patients.splice((j - 1), 1)
}
})
res.render("home", {
data: patients
})
})
app.listen(3000, (req, res) => {
console.log("App is running on port 3000")
})
casa.ejs
HTML
<!DOCTYPE html>
<html>
<head>
<title>HMS</title>
</head>
<style>
table {
font-family: arial, sans-serif;
border-collapse: collapse;
width: 100%;
}
td,
th {
border: 1px solid #dddddd;
text-align: left;
padding: 8px;
}
tr:nth-child(even) {
background-color: #dddddd;
}
</style>
<body>
<h1>All Patients</h1>
<table>
<tr>
<th>Name</th>
<th>Number</th>
<th>DOB</th>
<th>City</th>
<th>Room No.</th>
<th>Discharge</th>
</tr>
<% data.forEach(element=> { %>
<tr>
<td><%= element.name %></td>
<td><%= element.number %></td>
<td><%= element.dob %></td>
<td><%= element.city %></td>
<td><%= element.roomNo %></td>
<td>
<form action="/discharge" method="post">
<input type="text" style="display: none;"
name="name" value="<%= element.name %>">
<button type="submit">Discharge</button>
</form>
</td>
</tr>
<% }) %>
</table>
<h1>Add Patient</h1>
<form action="/" method="post">
<input type="text" placeholder="Name" name="name">
<input type="number" placeholder="Number" name="number">
<input type="text" placeholder="DOB" name="dob">
<input type="text" placeholder="City" name="city">
<button type="submit">Add</button>
</form>
</body>
</html>
Pasos para ejecutar la aplicación: Dentro de la terminal, escriba el comando para ejecutar su script.
node app.js
Producción:
