Fix: signos vitales siempre debajo de datos del paciente en Evoluciones
This commit is contained in:
@@ -423,11 +423,12 @@ export function Evoluciones({
|
||||
const signosTexto = getSignosVitalesTexto(evolucion.signosVitales);
|
||||
const estaExpandida = evolucionExpandida === evolucion.id;
|
||||
|
||||
return (
|
||||
return (
|
||||
<Card key={evolucion.id} className="hover:shadow-md transition-shadow">
|
||||
<CardContent className="p-4">
|
||||
<div className="flex flex-col sm:flex-row gap-3">
|
||||
<div className="flex flex-col sm:flex-row items-start justify-between w-full">
|
||||
<div className="flex flex-col gap-4">
|
||||
{/* Patient Info */}
|
||||
<div className="flex flex-col gap-3">
|
||||
<div className="flex items-center gap-3">
|
||||
<div className="h-10 w-10 bg-blue-100 rounded-full flex items-center justify-center">
|
||||
<FileText className="h-5 w-5 text-blue-600" />
|
||||
@@ -436,7 +437,7 @@ export function Evoluciones({
|
||||
<h3 className="font-bold">
|
||||
{paciente ? `${paciente.apellido}, ${paciente.nombre}` : 'Paciente no encontrado'}
|
||||
</h3>
|
||||
<div className="flex items-center gap-3 text-sm text-gray-500">
|
||||
<div className="flex flex-wrap items-center gap-x-3 gap-y-1 text-sm text-gray-500">
|
||||
<span className="flex items-center gap-1">
|
||||
<Calendar className="h-3 w-3" />
|
||||
{evolucion.fecha}
|
||||
@@ -449,7 +450,7 @@ export function Evoluciones({
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex items-center gap-2">
|
||||
<div className="flex flex-wrap items-center gap-2">
|
||||
<Button
|
||||
size="sm"
|
||||
variant="outline"
|
||||
@@ -468,12 +469,13 @@ export function Evoluciones({
|
||||
onClick={() => onEliminarEvolucion(evolucion.id)}
|
||||
>
|
||||
<Trash2 className="h-4 w-4" />
|
||||
Eliminar
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{signosTexto && (
|
||||
<div className="bg-blue-50 p-2 rounded-lg">
|
||||
<div className="bg-blue-50 p-3 rounded-lg">
|
||||
<p className="text-sm font-medium text-blue-800 flex items-center gap-2">
|
||||
<Activity className="h-4 w-4" />
|
||||
Signos Vitales: {signosTexto}
|
||||
|
||||
@@ -322,7 +322,7 @@ export function HistoriaClinica({
|
||||
<AccordionItem value="item-1">
|
||||
<AccordionTrigger>Detalle Episodio Actual</AccordionTrigger>
|
||||
<AccordionContent className="p4">
|
||||
<div className="border-t p-4 space-y-4">
|
||||
<div className="border-t space-y-4">
|
||||
|
||||
|
||||
<div>
|
||||
@@ -465,39 +465,35 @@ export function HistoriaClinica({
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
<Tabs className="w-full p-4" value={tabActivo} onValueChange={setTabActivo}>
|
||||
<ScrollArea className="w-full whitespace-nowrap rounded-md">
|
||||
<TabsList className="flex gap-1 flex-wrap">
|
||||
<TabsTrigger value="evoluciones" className="flex-shrink flex items-center gap-1 text-xs sm:text-sm">
|
||||
<Tabs className="w-full max-w-full min-w-0" value={tabActivo} onValueChange={setTabActivo}>
|
||||
<ScrollArea className="w-full max-w-full">
|
||||
<TabsList className="inline-flex w-max min-w-full justify-start gap-1 p-1">
|
||||
<TabsTrigger value="evoluciones" className="flex-shrink-0 flex items-center gap-1 text-xs sm:text-sm">
|
||||
<FileText className="h-3 w-3 sm:h-4 sm:w-4" />
|
||||
<span className="hidden sm:inline">Evoluciones</span>
|
||||
({evoluciones.length})
|
||||
</TabsTrigger>
|
||||
<TabsTrigger value="laboratorios" className="flex-shrink flex items-center gap-1 text-xs sm:text-sm">
|
||||
<TabsTrigger value="laboratorios" className="flex-shrink-0 flex items-center gap-1 text-xs sm:text-sm">
|
||||
<FlaskConical className="h-3 w-3 sm:h-4 sm:w-4" />
|
||||
<span className="hidden sm:inline">Laboratorio</span>
|
||||
({laboratorios.length})
|
||||
</TabsTrigger>
|
||||
<TabsTrigger value="acidobase" className="flex-shrink flex items-center gap-1 text-xs sm:text-sm">
|
||||
<TabsTrigger value="acidobase" className="flex-shrink-0 flex items-center gap-1 text-xs sm:text-sm">
|
||||
<Activity className="h-3 w-3 sm:h-4 sm:w-4" />
|
||||
<span className="hidden sm:inline">EAB</span>
|
||||
({acidosBase.length})
|
||||
</TabsTrigger>
|
||||
<TabsTrigger value="cultivos" className="flex-shrink flex items-center gap-1 text-xs sm:text-sm">
|
||||
<TabsTrigger value="cultivos" className="flex-shrink-0 flex items-center gap-1 text-xs sm:text-sm">
|
||||
<Microscope className="h-3 w-3 sm:h-4 sm:w-4" />
|
||||
<span className="hidden sm:inline">Cultivos</span>
|
||||
({cultivos.length})
|
||||
</TabsTrigger>
|
||||
<TabsTrigger value="atb" className="flex-shrink flex items-center gap-1 text-xs sm:text-sm">
|
||||
<Pill className="h-3 w-3 sm:h-4 sm:w-4" />
|
||||
<span className="hidden sm:inline">ATB</span>
|
||||
</TabsTrigger>
|
||||
<TabsTrigger value="estudios" className="flex-shrink flex items-center gap-1 text-xs sm:text-sm">
|
||||
<TabsTrigger value="estudios" className="flex-shrink-0 flex items-center gap-1 text-xs sm:text-sm">
|
||||
<ClipboardList className="h-3 w-3 sm:h-4 sm:w-4" />
|
||||
<span className="hidden sm:inline">Estudios</span>
|
||||
({estudiosComplementarios.length})
|
||||
</TabsTrigger>
|
||||
<TabsTrigger value="interconsultas" className="flex-shrink flex items-center gap-1 text-xs sm:text-sm">
|
||||
<TabsTrigger value="interconsultas" className="flex-shrink-0 flex items-center gap-1 text-xs sm:text-sm">
|
||||
<Users className="h-3 w-3 sm:h-4 sm:w-4" />
|
||||
<span className="hidden sm:inline">Interconsultas</span>
|
||||
({interconsultas.length})
|
||||
@@ -506,7 +502,7 @@ export function HistoriaClinica({
|
||||
<ScrollBar orientation="horizontal" />
|
||||
</ScrollArea>
|
||||
|
||||
<TabsContent value="laboratorios" className="mt-4">
|
||||
<TabsContent value="laboratorios" className="mt-4 min-w-0 w-full overflow-hidden">
|
||||
<SeccionLaboratorios lab={laboratorios} patientId={paciente.id} add={onAgregarLaboratorio} update={onActualizarLaboratorio} del={onEliminarLaboratorio} addAcidoBase={onAgregarAcidoBase} />
|
||||
</TabsContent>
|
||||
|
||||
@@ -910,7 +906,7 @@ function SeccionLaboratorios({ lab, patientId, add, update, del, addAcidoBase }:
|
||||
});
|
||||
|
||||
return (
|
||||
<div className="space-y-4">
|
||||
<div className="space-y-4 w-full max-w-full min-w-0">
|
||||
<div className="flex justify-between">
|
||||
<div className="flex gap-2">
|
||||
<Button variant="outline" onClick={() => { reset(); setDialog(true); }}><Plus className="h-4 w-4 mr-2" />Nuevo Laboratorio</Button>
|
||||
@@ -1150,12 +1146,13 @@ function SeccionLaboratorios({ lab, patientId, add, update, del, addAcidoBase }:
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
|
||||
{labs.length === 0 ? (
|
||||
{labs.length === 0 ? (
|
||||
<div className="text-center py-8 text-gray-400"><FlaskConical className="h-12 w-12 mx-auto mb-2 opacity-50" /><p>No hay laboratorios</p></div>
|
||||
) : (
|
||||
<div className="relative overflow-x-auto">
|
||||
<div className="grid grid-cols-1 w-full">
|
||||
<div className="w-full overflow-x-auto rounded-md border pb-2">
|
||||
|
||||
<Table className="w-full min-w-[600px]">
|
||||
<Table className="w-full min-w-max text-sm">
|
||||
<TableHeader>
|
||||
<TableRow>
|
||||
<TableHead className="cursor-pointer hover:bg-muted" onClick={() => setLabSortAsc(!labSortAsc)}>
|
||||
@@ -1178,7 +1175,7 @@ function SeccionLaboratorios({ lab, patientId, add, update, del, addAcidoBase }:
|
||||
<TableHead>TP</TableHead>
|
||||
<TableHead>KPTT</TableHead>
|
||||
<TableHead>RIN</TableHead>
|
||||
<TableHead>Acciones</TableHead>
|
||||
<TableHead>+</TableHead>
|
||||
</TableRow>
|
||||
</TableHeader>
|
||||
<TableBody>
|
||||
@@ -1230,8 +1227,9 @@ function SeccionLaboratorios({ lab, patientId, add, update, del, addAcidoBase }:
|
||||
</TableBody>
|
||||
</Table>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
)}
|
||||
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -1564,7 +1562,7 @@ function SeccionAcidosBase({ ab, patientId, add, update, del }: {
|
||||
<div className="flex flex-col gap-3">
|
||||
<div className="flex items-start justify-between">
|
||||
<div><p className="font-medium">{a.fecha} {a.hora}</p></div>
|
||||
<div className="flex items-center gap-2">
|
||||
<div className="flex items-end gap-2">
|
||||
|
||||
<Badge variant="outline" className="text-xs">{a.fio2 && a.po2 && <span className="mr-1">PaFiO2: {Math.round(a.po2 / a.fio2 * 100) / 100}</span>}</Badge>
|
||||
<Badge variant="outline" className="text-xs">{a.fio2 && <span className="mr-1">FiO₂:{a.fio2}</span>}</Badge>
|
||||
|
||||
Reference in New Issue
Block a user