Skip to content

Commit

Permalink
button changes & alimantes seccion
Browse files Browse the repository at this point in the history
  • Loading branch information
Elisa33 committed Apr 29, 2022
1 parent 793d9d9 commit 1a92e3a
Show file tree
Hide file tree
Showing 4 changed files with 119 additions and 73 deletions.
147 changes: 91 additions & 56 deletions src/components/FichaNutricional.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,7 @@ function FichaNutricional() {
<div className="pt-10 wrapper">

<form onSubmit={handleSubmit(onSubmit)} className="grid gap-8 pb-12">
<h1 className='font-bold'>Ficha nutricional</h1>
<h1 className='font-bold'>Ficha nutricional</h1>
{/* Datos personales */}
{ formStep > 0 && (
<section className="grid gap-5 md:grid-cols-2">
Expand Down Expand Up @@ -79,7 +79,10 @@ function FichaNutricional() {
<label>Teléfono
<input className='bottom-line' {...register("datos.telefono", { required: true })} />
</label>
<button type="button" onClick={completeFormStep} className='w-full py-3 mt-3 text-white rounded-lg hover:bg-accent hover:shadow-lg bg-secondary'>Siguiente</button>
{

}
<button type="button" onClick={completeFormStep} className={formStep > 1 ? 'hidden' : 'w-full py-3 mt-3 text-white rounded-lg hover:bg-accent hover:shadow-lg bg-secondary'}>Siguiente</button>
</section>
)}
{/* HC */}
Expand All @@ -88,9 +91,11 @@ function FichaNutricional() {
<h2>Historia Clínica</h2>
<label className="flex items-center gap-4">
<span>¿Consume suplementos?</span>
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('hc.suplementos')}/>
<span>Si</span>
<div className="flex items-center gap-2">
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('hc.suplementos')}/>
<span>Si</span>
</div>
</label>
{
watch("hc.suplementos") && (
Expand All @@ -101,9 +106,11 @@ function FichaNutricional() {

<label className="flex items-center gap-4">
<span>¿Realiza alguna dieta?</span>
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('hc.dieta')}/>
<span>Si</span>
<div className="flex items-center gap-2">
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('hc.dieta')}/>
<span>Si</span>
</div>
</label>

{
Expand All @@ -115,9 +122,11 @@ function FichaNutricional() {

<label className="flex items-center gap-4">
<span>¿Come fuera del hogar?</span>
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('hc.fuera')}/>
<span>Si</span>
<div className="flex items-center gap-2">
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('hc.fuera')}/>
<span>Si</span>
</div>
</label>

{
Expand All @@ -129,9 +138,11 @@ function FichaNutricional() {

<label className="flex items-center gap-4">
<span>¿Tiene alguna enfermedad metabólica de base?</span>
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('hc.metabolica')}/>
<span>Si</span>
<div className="flex items-center gap-2">
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('hc.metabolica')}/>
<span>Si</span>
</div>
</label>

{
Expand All @@ -142,9 +153,11 @@ function FichaNutricional() {
}
<label className="flex items-center gap-4">
<span>¿Alergias alimentarias?</span>
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('hc.alergias')}/>
<span>Si</span>
<div className="flex items-center gap-2">
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('hc.alergias')}/>
<span>Si</span>
</div>
</label>

{
Expand All @@ -155,9 +168,11 @@ function FichaNutricional() {
}
<label className="flex items-center gap-4">
<span>¿Intolerancia a la lactosa?</span>
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('hc.lactosa')}/>
<span>Si</span>
<div className="flex items-center gap-2">
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('hc.lactosa')}/>
<span>Si</span>
</div>
</label>

{
Expand All @@ -168,9 +183,11 @@ function FichaNutricional() {
}
<label className="flex items-center gap-4">
<span>¿Colon Irritable?</span>
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('hc.irritable')}/>
<span>Si</span>
<div className="flex items-center gap-2">
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('hc.irritable')}/>
<span>Si</span>
</div>
</label>

{
Expand All @@ -181,22 +198,26 @@ function FichaNutricional() {
}
<label className="flex items-center gap-4">
<span>¿Estreñimiento?</span>
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('hc.estrenimientos')}/>
<span>Si</span>
<div className="flex items-center gap-2">
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('hc.estrenimiento')}/>
<span>Si</span>
</div>
</label>

{
watch("hc.estrenimientos") && (
<label className='w-full'>Especificar
<input className='bottom-line' {...register('hc.textoestrenimientos')} />
<input className='bottom-line' {...register('hc.textoestrenimiento')} />
</label>)
}
<label className="flex items-center gap-4">
<span>¿Intolerancia alimentaria?</span>
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('hc.intolerancia')}/>
<span>Si</span>
<div className="flex items-center gap-2">
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('hc.intolerancia')}/>
<span>Si</span>
</div>
</label>

{
Expand All @@ -207,9 +228,11 @@ function FichaNutricional() {
}
<label className="flex items-center gap-4">
<span>¿Alteraciones de la vesícula biliar?</span>
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('hc.vesicula')}/>
<span>Si</span>
<div className="flex items-center gap-2">
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('hc.vesicula')}/>
<span>Si</span>
</div>
</label>

{
Expand All @@ -220,9 +243,11 @@ function FichaNutricional() {
}
<label className="flex items-center gap-4">
<span>¿Tiene o tuvo divertículos?</span>
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('hc.diverticulos')}/>
<span>Si</span>
<div className="flex items-center gap-2">
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('hc.diverticulos')}/>
<span>Si</span>
</div>
</label>

{
Expand All @@ -233,9 +258,11 @@ function FichaNutricional() {
}
<label className="flex items-center gap-4">
<span>¿Enfermedad renal?</span>
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('hc.renal')}/>
<span>Si</span>
<div className="flex items-center gap-2">
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('hc.renal')}/>
<span>Si</span>
</div>
</label>

{
Expand All @@ -246,9 +273,11 @@ function FichaNutricional() {
}
<label className="flex items-center gap-4">
<span>¿Toma medicación?</span>
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('hc.medicacion')}/>
<span>Si</span>
<div className="flex items-center gap-2">
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('hc.medicacion')}/>
<span>Si</span>
</div>
</label>

{
Expand All @@ -259,8 +288,10 @@ function FichaNutricional() {
}
<label className="flex items-center gap-4">
<span>¿Toma anticonceptivos?</span>
<span>No</span>
<input className="radio__toggle" onClick={()=>{showInput('anticonceptivos')}} type="checkbox" {...register('hc.anticonceptivos')}/>
<div className="flex items-center gap-2">
<span>No</span>
<input className="radio__toggle" onClick={()=>{showInput('anticonceptivos')}} type="checkbox" {...register('hc.anticonceptivos')}/>
</div>
<span>Si</span>
</label>

Expand All @@ -272,7 +303,7 @@ function FichaNutricional() {
}


<button type="button" onClick={completeFormStep} className='w-full py-3 mt-3 text-white rounded-lg hover:bg-accent hover:shadow-lg bg-secondary'>Siguiente</button>
<button type="button" onClick={completeFormStep} className={formStep > 2 ? 'hidden' : 'w-full py-3 mt-3 text-white rounded-lg hover:bg-accent hover:shadow-lg bg-secondary'}>Siguiente</button>
</section>
)}
{/* Alimentos */}
Expand Down Expand Up @@ -627,7 +658,7 @@ function FichaNutricional() {
</label>


<button type="button" onClick={completeFormStep} className='w-full py-3 mt-3 text-white rounded-lg hover:bg-accent hover:shadow-lg bg-secondary'>Siguiente</button>
<button type="button" onClick={completeFormStep} className={formStep > 3 ? 'hidden' : 'w-full py-3 mt-3 text-white rounded-lg hover:bg-accent hover:shadow-lg bg-secondary'}>Siguiente</button>

</section>
)}
Expand Down Expand Up @@ -685,7 +716,7 @@ function FichaNutricional() {



<button type="button" onClick={completeFormStep} className='w-full py-3 mt-3 text-white rounded-lg hover:bg-accent hover:shadow-lg bg-secondary'>Siguiente</button>
<button type="button" onClick={completeFormStep} className={formStep > 4 ? 'hidden' : 'w-full py-3 mt-3 text-white rounded-lg hover:bg-accent hover:shadow-lg bg-secondary'}>Siguiente</button>

</section>
)}
Expand Down Expand Up @@ -719,7 +750,7 @@ function FichaNutricional() {
</ul>


<button type="button" onClick={completeFormStep} className='w-full py-3 mt-3 text-white rounded-lg hover:bg-accent hover:shadow-lg bg-secondary'>Siguiente</button>
<button type="button" onClick={completeFormStep} className={formStep > 5 ? 'hidden' : 'w-full py-3 mt-3 text-white rounded-lg hover:bg-accent hover:shadow-lg bg-secondary'}>Siguiente</button>

</section>
)}
Expand Down Expand Up @@ -779,7 +810,7 @@ function FichaNutricional() {
<input className='bottom-line' {...register('dieta.otras')} />


<button type="button" onClick={completeFormStep} className='w-full py-3 mt-3 text-white rounded-lg hover:bg-accent hover:shadow-lg bg-secondary'>Siguiente</button>
<button type="button" onClick={completeFormStep} className={formStep > 6 ? 'hidden' : 'w-full py-3 mt-3 text-white rounded-lg hover:bg-accent hover:shadow-lg bg-secondary'}>Siguiente</button>

</section>
)}
Expand All @@ -796,9 +827,11 @@ function FichaNutricional() {
</label>
<label className="flex items-center gap-4 py-4">
<span>¿Come algo antes de entrenar?</span>
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('actividad.comidaantes')}/>
<span>Si</span>
<div className="flex items-center gap-2">
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('actividad.comidaantes')}/>
<span>Si</span>
</div>
</label>
{
watch("actividad.comidaantes") && (
Expand All @@ -808,9 +841,11 @@ function FichaNutricional() {
}
<label className="flex items-center gap-4 py-4">
<span>¿Come algo despues de entrenar?</span>
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('actividad.comidadespues')}/>
<span>Si</span>
<div className="flex items-center gap-2">
<span>No</span>
<input className="radio__toggle" type="checkbox" {...register('actividad.comidadespues')}/>
<span>Si</span>
</div>
</label>
{
watch("actividad.comidadespues") && (
Expand All @@ -831,7 +866,7 @@ function FichaNutricional() {
<input className='bottom-line' {...register('otros.comoconociste')} />
</label>
</div>
<button type="submit" className='w-full py-3 text-white rounded-lg hover:bg-accent hover:shadow-lg bg-secondary'>Enviar Formulario</button>
<button type="submit" className='w-full py-3 text-white rounded-lg hover:bg-accent hover:shadow-lg bg-primary'>Confirmar y enviar formulario</button>
<div className="pt-4 text-center text-primary">{mensaje}</div>
</section>
)}
Expand Down
4 changes: 2 additions & 2 deletions src/components/Home.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,8 +12,8 @@ const Home = () => {
<div className="flex flex-col items-center h-screen gap-5 p-16 wrapper">
<h2 className="text-center text-white">Hola! soy tu nutricionista, te pido por favor que completes el siguiente formulario a fin de que...</h2>

<Link to="/ficha" className="p-3 bg-white rounded-lg text-green">Ficha Nutricional</Link>
<Link to="/pacientes" className="p-3 bg-white rounded-lg text-green">pacientes</Link>
<Link to="/ficha" className="w-40 p-3 text-center bg-white border-2 border-white rounded-lg text-green hover:text-white hover:bg-green">Ficha Nutricional</Link>
<Link to="/pacientes" className="w-40 p-3 text-center bg-white border-2 border-white rounded-lg text-green hover:text-white hover:bg-green">Lista Pacientes</Link>

</div>
</div>
Expand Down
39 changes: 25 additions & 14 deletions src/components/Paciente.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -72,11 +72,22 @@ const Paciente = () => {

<div>
<h2>Historia Clinica</h2>
{
hc && Object.entries(hc).map(([key, value]) => (
value && <p>{key} - {value}</p>
))
}

{hc.suplementos && <p>suplementos: {hc.textosuplementos}</p>}
{hc.dieta && <p>dieta: {hc.textodieta}</p>}
{hc.fuera && <p>fuera: {hc.textofuera}</p>}
{hc.metabolica && <p>metabolica: {hc.textometabolica}</p>}
{hc.alergias && <p>alergias: {hc.textoalergias}</p>}
{hc.lactosa && <p>lactosa: {hc.textolactosa}</p>}
{hc.irritable && <p>irritable: {hc.textoirritable}</p>}
{hc.estrenimiento && <p>estrenimiento: {hc.textoestrenimiento}</p>}
{hc.intoleracia && <p>intoleracia: {hc.textointoleracia}</p>}
{hc.vesicula && <p>vesicula: {hc.textovesicula}</p>}
{hc.diverticulos && <p>Anticonceptivos: {hc.textoanticonceptivos}</p>}
{hc.renal && <p>renal: {hc.textorenal}</p>}
{hc.medicacion && <p>medicacion: {hc.textomedicacion}</p>}
{hc.anticonceptivos && <p>Anticonceptivos: {hc.textoanticonceptivos}</p>}

</div>
<div>
<h2>Alimentos</h2>
Expand Down Expand Up @@ -147,17 +158,17 @@ const Paciente = () => {
{
dieta && (
<div>
<p className='normal-case'>Desayuno: {dieta.desayuno} {dieta.desayunohora}hs</p>
<p className='normal-case'>{dieta.desayunohora}hs Desayuno: {dieta.desayuno} </p>
{
dieta.colacion && <p className='normal-case'>Colacion: {dieta.colacion} {dieta.colacionhora}hs</p>
dieta.colacion && <p className='normal-case'>{dieta.colacionhora}hs Colacion: {dieta.colacion} </p>
}

<p className='normal-case'>Almuerzo: {dieta.almuerzo} {dieta.almuerzohora}hs</p>
{
dieta.colaciondos && <p className='normal-case'>Colaciondos: {dieta.colaciondos} {dieta.colaciondoshora}hs</p>
dieta.colaciondos && <p className='normal-case'>{dieta.colaciondoshora} Colacion: {dieta.colaciondos} hs</p>
}
<p className='normal-case'>Merienda: {dieta.merienda} {dieta.meriendahora}hs</p>
<p className='normal-case'>Cena: {dieta.cena} {dieta.cenahora}hs</p>
<p className='normal-case'>{dieta.meriendahora}hs Merienda: {dieta.merienda} </p>
<p className='normal-case'>{dieta.cenahora}hs Cena: {dieta.cena} </p>
{
dieta.otros && <p className='normal-case'>otros: {dieta.otros} {dieta.otroshora}hs</p>
}
Expand All @@ -169,16 +180,16 @@ const Paciente = () => {
<h2>Actividad fisica</h2>


{/* {actividad.tipo && <p className='normal-case'>Tipo: {actividad.tipo} </p> }
{actividad.tipo && <p className='normal-case'>Tipo: {actividad.tipo} </p> }
{actividad.tiempo && <p className='normal-case'>tiempo: {actividad.tiempo} hs</p> }
{actividad.bebidas && <p className='normal-case'>bebidas: {actividad.bebidas} </p> } */}
{actividad.bebidas && <p className='normal-case'>bebidas: {actividad.bebidas} </p> }
</div>
<div>
<h2>Otros</h2>

{/* {otros.comidafavorita && <p className='normal-case'>Comida favorita: {otros.comidafavorita}</p> }
{otros.comidafavorita && <p className='normal-case'>Comida favorita: {otros.comidafavorita}</p> }
{otros.motivoconsulta && <p className='normal-case'>Motivo consulta: {otros.motivoconsulta}</p> }
{otros.comoconociste && <p className='normal-case'>Como me conociste: {otros.comoconociste} </p> } */}
{otros.comoconociste && <p className='normal-case'>Como me conociste: {otros.comoconociste} </p> }
</div>


Expand Down
Loading

1 comment on commit 1a92e3a

@vercel
Copy link

@vercel vercel bot commented on 1a92e3a Apr 29, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

nutricion – ./

nutricion-elisa33.vercel.app
nutricion-seven.vercel.app
nutricion-git-master-elisa33.vercel.app

Please sign in to comment.