Avance 1-Medico

This commit is contained in:
03jossellin-herrera-rodriguez 2024-05-13 10:05:00 -06:00
parent 946c7a7e32
commit 5d64ff90a0
11 changed files with 358 additions and 0 deletions

View File

@ -0,0 +1,12 @@
import React from 'react';
import { Link } from 'react-router-dom';
const BuscarPacienteButton = () => {
return (
<Link to="/buscar-paciente">
<button>Buscar paciente</button>
</Link>
);
};
export default BuscarPacienteButton;

View File

@ -0,0 +1,12 @@
import React from 'react';
import { Link } from 'react-router-dom';
const EditarPacienteButton = () => {
return (
<Link to="/editar-paciente">
<button>Editar paciente</button>
</Link>
);
};
export default EditarPacienteButton;

View File

@ -0,0 +1,12 @@
import React from 'react';
import { Link } from 'react-router-dom';
const EmitirRecetaButton = () => {
return (
<Link to="/receta-medica">
<button>Emitir receta médica</button>
</Link>
);
};
export default EmitirRecetaButton;

View File

@ -0,0 +1,12 @@
import React from 'react';
import { Link } from 'react-router-dom';
const RegistrarPacienteButton = () => {
return (
<Link to="/registrar-paciente">
<button>Registrar paciente</button>
</Link>
);
};
export default RegistrarPacienteButton;

View File

@ -0,0 +1,27 @@
import React, { useState } from 'react';
const BuscarPaciente = () => {
const [busqueda, setBusqueda] = useState('');
const handleBusqueda = (e) => {
setBusqueda(e.target.value);
};
return (
<div className="buscar-paciente-container">
<h2>Buscar Paciente</h2>
<input
type="text"
placeholder="Buscar paciente"
value={busqueda}
onChange={handleBusqueda}
className="buscar-paciente-input"
/>
<button type='submit'>Buscar</button>
</div>
);
};
export default BuscarPaciente;

View File

@ -0,0 +1,23 @@
.editar-paciente-container {
margin-bottom: 20px;
}
.editar-paciente-form {
display: flex;
flex-direction: column;
}
.editar-paciente-form input {
margin-bottom: 10px;
padding: 10px;
font-size: 16px;
}
.editar-paciente-form button {
padding: 10px 20px;
font-size: 16px;
background-color: #28a745;
color: #fff;
border: none;
cursor: pointer;
}

View File

@ -0,0 +1,50 @@
import React, { useState } from 'react';
import './EditarPaciente.css';
const EditarPaciente = () => {
const [nombre, setNombre] = useState('');
const [edad, setEdad] = useState('');
const [peso, setPeso] = useState('');
const [contacto, setContacto] = useState('');
const handleSubmit = (e) => {
e.preventDefault();
};
return (
<div className="editar-paciente-container">
<h2>Editar Paciente</h2>
<form onSubmit={handleSubmit} className="editar-paciente-form">
<input
type="text"
placeholder="Nombre"
value={nombre}
onChange={(e) => setNombre(e.target.value)}
/>
<input
type="number"
placeholder="Edad"
value={edad}
onChange={(e) => setEdad(e.target.value)}
/>
<input
type="text"
placeholder="Peso"
value={peso}
onChange={(e) => setPeso(e.target.value)}
/>
<input
type="text"
placeholder="Contacto"
value={contacto}
onChange={(e) => setContacto(e.target.value)}
/>
<button type="submit">Guardar cambios</button>
</form>
</div>
);
};
export default EditarPaciente;

View File

@ -0,0 +1,23 @@
.paciente-container {
margin-bottom: 20px;
}
.paciente-form {
display: flex;
flex-direction: column;
}
.paciente-form input {
margin-bottom: 10px;
padding: 10px;
font-size: 16px;
}
.paciente-form button {
padding: 10px 20px;
font-size: 16px;
background-color: #28a745;
color: #fff;
border: none;
cursor: pointer;
}

View File

@ -0,0 +1,49 @@
import React, { useState } from 'react';
import './Paciente.css';
const Paciente = () => {
const [nombre, setNombre] = useState('');
const [edad, setEdad] = useState('');
const [peso, setPeso] = useState('');
const [contacto, setContacto] = useState('');
const handleSubmit = (e) => {
e.preventDefault();
};
return (
<div className="paciente-container">
<h2>Registrar paciente</h2>
<form onSubmit={handleSubmit} className="paciente-form">
<input
type="text"
placeholder="Nombre"
value={nombre}
onChange={(e) => setNombre(e.target.value)}
/>
<input
type="number"
placeholder="Edad"
value={edad}
onChange={(e) => setEdad(e.target.value)}
/>
<input
type="text"
placeholder="Peso"
value={peso}
onChange={(e) => setPeso(e.target.value)}
/>
<input
type="text"
placeholder="Contacto"
value={contacto}
onChange={(e) => setContacto(e.target.value)}
/>
<button type="submit">Registrar paciente</button>
</form>
</div>
);
};
export default Paciente;

View File

@ -0,0 +1,20 @@
.receta-medica-container {
margin-bottom: 20px;
}
.receta-medica-form textarea {
width: 100%;
height: 150px;
padding: 10px;
font-size: 16px;
margin-bottom: 10px;
}
.receta-medica-form button {
padding: 10px 20px;
font-size: 16px;
background-color: #28a745;
color: #fff;
border: none;
cursor: pointer;
}

View File

@ -0,0 +1,118 @@
import React, { useId, useState } from 'react';
import './RecetaMedica.css';
const RecetaMedica = () => {
const [idreceta, setIdReceta] = useId('');
const [idPaciente, setIdPaciente] = useId('');
const [idMedico, setIdMedico] = useId('');
const [contactoMedico, setContactoMedico] = useState ('');
const [pesoPaciente, setPesoPaciente] = useState ('');
const [edadPaciente, setEdadPaciente] = useState ('');
const [presionArt, setPresionArt] = useState();
const [fecha, setFecha] = useState('');
const [tempPaciente, setTempPaciente] = useState('');
const [prescripcion, setPrescripcion] = useState('');
const [firmaMedico, setFirmaMedico] = useState(null);
const handleImageUpload = (e) => {
const file = e.target.files[0];
if (file) {
setFirmaMedico(file);
}
};
const handleSubmit = (e) => {
e.preventDefault();
console.log({
idreceta,
idPaciente,
idMedico,
contactoMedico,
pesoPaciente,
edadPaciente,
presionArt,
fecha,
tempPaciente,
prescripcion,
firmaMedico
});
};
return (
<div className="receta-medica-container">
<h2>Emitir receta médica</h2>
<form onSubmit={handleSubmit} className="receta-medica-form">
<input
type="text"
placeholder='id de receta'
value={idreceta}
disabled
/>
<input
type="text"
placeholder='id de paciente'
value={idPaciente}
disabled
/>
<input
type="text"
placeholder='id de medico'
value={idMedico}
disabled
/>
<input
type="text"
placeholder='Contacto'
value={contactoMedico}
onChange={(e) => setContactoMedico(e.target.value)}
/>
<input
type="text"
placeholder='Peso'
value={pesoPaciente}
onChange={(e) => setPesoPaciente(e.target.value)}
/>
<input
type="text"
placeholder='Edad'
value={edadPaciente}
onChange={(e) => setEdadPaciente(e.target.value)}
/>
<input
type="text"
placeholder='Presion arterial'
value={presionArt}
onChange={(e) => setPresionArt(e.target.value)}
/>
<input
type="text"
placeholder='Fecha'
value={fecha}
onChange={(e) => setFecha(e.target.value)}
/>
<input
type="text"
placeholder='Temperatura'
value={tempPaciente}
onChange={(e) => setTempPaciente(e.target.value)}
/>
<textarea
placeholder="Escriba la prescripción médica"
value={prescripcion}
onChange={(e) => setPrescripcion(e.target.value)}
/>
<input
type="file"
accept="image/*"
onChange={handleImageUpload}
/>
<button type="submit">Emitir receta</button>
</form>
</div>
);
};
export default RecetaMedica;