Agregar hora a laboratorios: modal importar, save con hora seleccionada
This commit is contained in:
@@ -1,64 +1,55 @@
|
||||
import * as React from "react"
|
||||
import * as AccordionPrimitive from "@radix-ui/react-accordion"
|
||||
import { ChevronDownIcon } from "lucide-react"
|
||||
import { ChevronDown } from "lucide-react"
|
||||
|
||||
import { cn } from "@/lib/utils"
|
||||
|
||||
function Accordion({
|
||||
...props
|
||||
}: React.ComponentProps<typeof AccordionPrimitive.Root>) {
|
||||
return <AccordionPrimitive.Root data-slot="accordion" {...props} />
|
||||
}
|
||||
const Accordion = AccordionPrimitive.Root
|
||||
|
||||
function AccordionItem({
|
||||
className,
|
||||
...props
|
||||
}: React.ComponentProps<typeof AccordionPrimitive.Item>) {
|
||||
return (
|
||||
<AccordionPrimitive.Item
|
||||
data-slot="accordion-item"
|
||||
className={cn("border-b last:border-b-0", className)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
const AccordionItem = React.forwardRef<
|
||||
React.ElementRef<typeof AccordionPrimitive.Item>,
|
||||
React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item>
|
||||
>(({ className, ...props }, ref) => (
|
||||
<AccordionPrimitive.Item
|
||||
ref={ref}
|
||||
className={cn("border-b", className)}
|
||||
{...props}
|
||||
/>
|
||||
))
|
||||
AccordionItem.displayName = "AccordionItem"
|
||||
|
||||
function AccordionTrigger({
|
||||
className,
|
||||
children,
|
||||
...props
|
||||
}: React.ComponentProps<typeof AccordionPrimitive.Trigger>) {
|
||||
return (
|
||||
<AccordionPrimitive.Header className="flex">
|
||||
<AccordionPrimitive.Trigger
|
||||
data-slot="accordion-trigger"
|
||||
className={cn(
|
||||
"focus-visible:border-ring focus-visible:ring-ring/50 flex flex-1 items-start justify-between gap-4 rounded-md py-4 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&[data-state=open]>svg]:rotate-180",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
>
|
||||
{children}
|
||||
<ChevronDownIcon className="text-muted-foreground pointer-events-none size-4 shrink-0 translate-y-0.5 transition-transform duration-200" />
|
||||
</AccordionPrimitive.Trigger>
|
||||
</AccordionPrimitive.Header>
|
||||
)
|
||||
}
|
||||
|
||||
function AccordionContent({
|
||||
className,
|
||||
children,
|
||||
...props
|
||||
}: React.ComponentProps<typeof AccordionPrimitive.Content>) {
|
||||
return (
|
||||
<AccordionPrimitive.Content
|
||||
data-slot="accordion-content"
|
||||
className="data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden text-sm"
|
||||
const AccordionTrigger = React.forwardRef<
|
||||
React.ElementRef<typeof AccordionPrimitive.Trigger>,
|
||||
React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Trigger>
|
||||
>(({ className, children, ...props }, ref) => (
|
||||
<AccordionPrimitive.Header className="flex">
|
||||
<AccordionPrimitive.Trigger
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"flex flex-1 items-center justify-between py-4 text-sm font-medium transition-all hover:underline text-left [&[data-state=open]>svg]:rotate-180",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
>
|
||||
<div className={cn("pt-0 pb-4", className)}>{children}</div>
|
||||
</AccordionPrimitive.Content>
|
||||
)
|
||||
}
|
||||
{children}
|
||||
<ChevronDown className="h-4 w-4 shrink-0 text-muted-foreground transition-transform duration-200" />
|
||||
</AccordionPrimitive.Trigger>
|
||||
</AccordionPrimitive.Header>
|
||||
))
|
||||
AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName
|
||||
|
||||
const AccordionContent = React.forwardRef<
|
||||
React.ElementRef<typeof AccordionPrimitive.Content>,
|
||||
React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content>
|
||||
>(({ className, children, ...props }, ref) => (
|
||||
<AccordionPrimitive.Content
|
||||
ref={ref}
|
||||
className="overflow-hidden text-sm data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down"
|
||||
{...props}
|
||||
>
|
||||
<div className={cn("pb-4 pt-0", className)}>{children}</div>
|
||||
</AccordionPrimitive.Content>
|
||||
))
|
||||
AccordionContent.displayName = AccordionPrimitive.Content.displayName
|
||||
|
||||
export { Accordion, AccordionItem, AccordionTrigger, AccordionContent }
|
||||
|
||||
@@ -84,9 +84,7 @@ export function EditIngreso({
|
||||
<div className="space-y-6 dark:text-white">
|
||||
<div className="flex flex-col sm:flex-row items-start sm:items-center justify-between gap-4">
|
||||
<div className="flex items-center gap-4">
|
||||
<Button variant="ghost" size="icon" onClick={onVolver}>
|
||||
<ArrowLeft className="h-5 w-5" />
|
||||
</Button>
|
||||
|
||||
<div>
|
||||
<h1 className="text-2xl font-bold text-gray-900 dark:text-white flex items-center gap-2">
|
||||
<User className="h-6 w-6 text-blue-600" />
|
||||
|
||||
+284
-320
@@ -1,5 +1,13 @@
|
||||
import { useState } from 'react';
|
||||
import { PDFDocument } from 'pdf-lib';
|
||||
import { User } from 'lucide-react';
|
||||
import {
|
||||
Accordion,
|
||||
AccordionContent,
|
||||
AccordionItem,
|
||||
AccordionTrigger,
|
||||
} from "@/components/ui/accordion";
|
||||
|
||||
import {
|
||||
FlaskConical,
|
||||
Microscope,
|
||||
@@ -145,6 +153,8 @@ function wrapText(text: string, font: any, fontSize: number, maxWidth: number):
|
||||
return lines;
|
||||
}
|
||||
|
||||
|
||||
|
||||
export function HistoriaClinica({
|
||||
internacion,
|
||||
paciente,
|
||||
@@ -203,40 +213,23 @@ export function HistoriaClinica({
|
||||
return Math.floor(diff / (1000 * 60 * 60 * 24));
|
||||
};
|
||||
|
||||
const handleGuardarEdicion = () => {
|
||||
if (editCamaId && editCamaId !== internacion.camaId && cama) {
|
||||
onActualizarCama(cama.id, { estado: 'Disponible', pacienteId: undefined, internacionId: undefined });
|
||||
}
|
||||
if (editCamaId) {
|
||||
onActualizarCama(editCamaId, { estado: 'Ocupada', pacienteId: paciente.id, internacionId: internacion.id });
|
||||
}
|
||||
onActualizarInternacion(internacion.id, {
|
||||
fechaIngresoClinica: editFechaIngreso,
|
||||
motivoConsulta: editMotivoConsulta,
|
||||
diagnosticoIngreso: editDiagnostico,
|
||||
enfermedadActual: editEnfermedadActual,
|
||||
antecedentesEnfermedadActual: editAntecedentes,
|
||||
medicoIngresante: editMedico,
|
||||
camaId: editCamaId || undefined,
|
||||
});
|
||||
setEditIngresoDialog(false);
|
||||
};
|
||||
|
||||
|
||||
return (
|
||||
<div className="space-y-6 dark:text-white">
|
||||
<div>
|
||||
<div className="flex items-center gap-4 mb-4">
|
||||
|
||||
<div>
|
||||
<h1 className="text-2xl font-bold text-gray-900 dark:text-white flex items-center gap-2"><ClipboardList className="h-6 w-6" />Historia Clínica</h1>
|
||||
<p className="text-gray-500">
|
||||
Cama: {cama?.numero || 'N/A'} | {paciente.apellido}, {paciente.nombre} | {paciente.fechaNacimiento ? calcularEdad(paciente.fechaNacimiento) + ' años' : ''} | DNI: {paciente.dni}
|
||||
</p>
|
||||
</div>
|
||||
<div className="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4">
|
||||
|
||||
<div>
|
||||
<h1 className="text-2xl font-bold text-gray-900 dark:text-white flex items-center gap-2">
|
||||
<ClipboardList className="h-6 w-6 text-blue-600" />
|
||||
{cama?.numero || 'N/A'} - Historia Clínica
|
||||
</h1>
|
||||
<p className="text-gray-500 dark:text-gray-400">Módulo de Historia Clínica de Internación</p>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center gap-2 flex-wrap">
|
||||
<div className="flex items-center gap-2">
|
||||
|
||||
<Button variant="outline" onClick={onVolver}>
|
||||
<ArrowLeft className="h-4 w-4 mr-2" />
|
||||
Volver
|
||||
@@ -246,253 +239,224 @@ export function HistoriaClinica({
|
||||
Editar Ingreso
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<Dialog open={editIngresoDialog} onOpenChange={setEditIngresoDialog}>
|
||||
<DialogContent className="sm:max-w-2xl max-h-[90vh] overflow-y-auto">
|
||||
<DialogHeader>
|
||||
<DialogTitle>Editar Ingreso</DialogTitle>
|
||||
</DialogHeader>
|
||||
<Card className="bg-muted/50">
|
||||
<CardContent className="p-4">
|
||||
<div className="flex flex-wrap gap-2 mb-2">
|
||||
<Badge variant="outline" className="bg-primary/10 text-primary border-primary/30">
|
||||
{paciente.apellido}, {paciente.nombre}
|
||||
</Badge>
|
||||
<Badge variant="outline" className="bg-primary/10 text-primary border-primary/30">
|
||||
{paciente.fechaNacimiento ? calcularEdad(paciente.fechaNacimiento) + ' años' : ''}
|
||||
</Badge>
|
||||
<Badge variant="outline" className="bg-primary/10 text-primary border-primary/30">
|
||||
DNI: {paciente.dni}
|
||||
</Badge>
|
||||
</div>
|
||||
<div className="flex flex-wrap gap-2">
|
||||
<Badge variant="secondary">
|
||||
HC: {paciente.historiaClinica || 'N/A'}
|
||||
</Badge>
|
||||
<Badge variant="secondary">
|
||||
{paciente.obraSocial || 'Sin obra social'}
|
||||
</Badge>
|
||||
<Badge variant="secondary">
|
||||
{paciente.nacionalidad || 'N/A'}
|
||||
</Badge>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
<div className="space-y-4">
|
||||
<div className="grid grid-cols-3 gap-4">
|
||||
<div>
|
||||
<Label>Fecha de Ingreso *</Label>
|
||||
<Input type="date" value={editFechaIngreso} onChange={e => setEditFechaIngreso(e.target.value)} />
|
||||
</div>
|
||||
<div>
|
||||
<Label>Médico Ingresante *</Label>
|
||||
<Input value={editMedico} onChange={e => setEditMedico(e.target.value)} placeholder="Nombre del médico" />
|
||||
</div>
|
||||
<div>
|
||||
<Label>Cama</Label>
|
||||
<Select value={editCamaId} onValueChange={setEditCamaId}>
|
||||
<SelectTrigger><SelectValue placeholder="Seleccionar cama" /></SelectTrigger>
|
||||
<SelectContent>
|
||||
{(allCamas || []).filter((c: Cama) => c.estado === 'Disponible' || c.id === cama?.id).map((c: Cama) => (
|
||||
<SelectItem key={c.id} value={c.id}>{c.numero}</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<Label>Motivo de Consulta</Label>
|
||||
<textarea className="w-full p-2 border rounded-md text-sm min-h-[60px]" value={editMotivoConsulta} onChange={e => setEditMotivoConsulta(e.target.value)} />
|
||||
</div>
|
||||
<div>
|
||||
<Label>Diagnóstico de Ingreso *</Label>
|
||||
<textarea className="w-full p-2 border rounded-md text-sm min-h-[60px]" value={editDiagnostico} onChange={e => setEditDiagnostico(e.target.value)} />
|
||||
</div>
|
||||
<div>
|
||||
<Label>Enfermedad Actual</Label>
|
||||
<textarea className="w-full p-2 border rounded-md text-sm min-h-[80px]" value={editEnfermedadActual} onChange={e => setEditEnfermedadActual(e.target.value)} />
|
||||
</div>
|
||||
<div>
|
||||
<Label>Antecedentes de la Enfermedad Actual</Label>
|
||||
<textarea className="w-full p-2 border rounded-md text-sm min-h-[80px]" value={editAntecedentes} onChange={e => setEditAntecedentes(e.target.value)} />
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex justify-end gap-2 mt-4">
|
||||
<Button variant="outline" onClick={() => setEditIngresoDialog(false)}><X className="h-4 w-4 mr-2" />Cancelar</Button>
|
||||
<Button onClick={handleGuardarEdicion} disabled={!editFechaIngreso || !editDiagnostico || !editMedico}><Save className="h-4 w-4 mr-2" />Guardar</Button>
|
||||
</div>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
|
||||
<Card>
|
||||
<CardContent className="p-0">
|
||||
<button type="button" className="w-full p-4 flex items-center justify-between hover:bg-gray-50" onClick={() => setDetalleExpandido(!detalleExpandido)}>
|
||||
<div className="grid grid-cols-2 sm:grid-cols-4 gap-4 text-sm w-full">
|
||||
<CardContent className="p-4">
|
||||
<div className="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4">
|
||||
<div><h2 className="font-bold text-lg text-gray-900 flex items-center gap-2">
|
||||
<User className="h-4 w-4" />
|
||||
{paciente.apellido}, {paciente.nombre}
|
||||
</h2>
|
||||
</div>
|
||||
<div className="flex items-center gap-2">
|
||||
<Badge className={internacion.fechaIngresoClinica && calcularDiasInternado(internacion.fechaIngresoClinica) > 7 ? 'bg-red-100 text-red-800' : 'bg-blue-100 text-blue-800'}>
|
||||
{internacion.fechaIngresoClinica ? calcularDiasInternado(internacion.fechaIngresoClinica) : 0} días internado
|
||||
</Badge>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="space-y-2">
|
||||
<div className="flex flex-wrap gap-2">
|
||||
<Badge variant="outline" className="text-sm px-3 py-1 bg-green-50 text-green-700 dark:bg-green-950 dark:text-green-300">
|
||||
{paciente.fechaNacimiento ? calcularEdad(paciente.fechaNacimiento) + ' años' : ''}
|
||||
</Badge>
|
||||
|
||||
<Badge variant="outline" className="text-sm px-3 py-1 bg-blue-50 text-blue-700 border-blue-200">
|
||||
DNI: {paciente.dni}
|
||||
</Badge>
|
||||
|
||||
</div>
|
||||
|
||||
<div className="flex flex-wrap gap-2">
|
||||
<Badge variant="secondary" className="text-sm px-3 py-1">
|
||||
HC: {paciente.historiaClinica || 'No posee'}
|
||||
</Badge>
|
||||
<Badge variant="secondary" className="text-sm px-3 py-1">
|
||||
OS: {paciente.obraSocial || 'No posee'}
|
||||
</Badge>
|
||||
<Badge variant="secondary" className="text-sm px-3 py-1">
|
||||
Nacionalidad: {paciente.nacionalidad || 'N/A'}
|
||||
</Badge>
|
||||
</div>
|
||||
|
||||
<div className="border-t p-4 space-y-4">
|
||||
|
||||
|
||||
<div>
|
||||
<p className="text-gray-500">Antecedentes</p>
|
||||
<p className="font-medium truncate">{paciente.antecedentes || 'No constan'}</p>
|
||||
<p className="text-gray-500 text-sm">Antecedentes</p>
|
||||
<p className="font-medium">{paciente.antecedentes || 'No refiere'}</p>
|
||||
</div>
|
||||
|
||||
|
||||
<div>
|
||||
<p className="text-gray-500 text-sm">MH</p>
|
||||
<p className="font-medium">{paciente.medicacionHabitual || 'No refiere'}</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<p className="text-gray-500">Fecha de Ingreso</p>
|
||||
<p className="font-medium">{internacion.fechaIngresoClinica ? formatDateDDMMYYYY(internacion.fechaIngresoClinica) : 'N/A'}</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<p className="text-gray-500">Diagnóstico de Ingreso</p>
|
||||
<p className="font-medium truncate">{internacion.diagnosticoIngreso}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-gray-500">Días de Internación</p>
|
||||
<Badge className={internacion.fechaIngresoClinica && calcularDiasInternado(internacion.fechaIngresoClinica) > 7 ? 'bg-red-100 text-red-800' : 'bg-blue-100 text-blue-800'}>
|
||||
{internacion.fechaIngresoClinica ? calcularDiasInternado(internacion.fechaIngresoClinica) : 0} días
|
||||
</Badge>
|
||||
<p className="font-medium">{internacion.diagnosticoIngreso}</p>
|
||||
</div>
|
||||
|
||||
<Accordion type="single" collapsible defaultValue="item-1">
|
||||
<AccordionItem value="item-1">
|
||||
<AccordionTrigger>Detalle Episodio Actual</AccordionTrigger>
|
||||
<AccordionContent className="p4">
|
||||
<div className="border-t p-4 space-y-4">
|
||||
|
||||
|
||||
<div>
|
||||
<p className="text-gray-500 text-sm">Motivo de Consulta</p>
|
||||
<p className="font-medium">{internacion.motivoConsulta || 'Sin motivo registrado'}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-gray-500 text-sm">Enfermedad Actual</p>
|
||||
<p className="font-medium">{internacion.enfermedadActual || 'Sin información'}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-gray-500 text-sm">Antecedentes de Enfermedad Actual</p>
|
||||
<p className="font-medium">{internacion.antecedentesEnfermedadActual || 'Sin antecedentes registrados'}</p>
|
||||
</div>
|
||||
<Button variant="outline" className="bg-blue-50 border-blue-300 text-blue-700 hover:bg-blue-100" onClick={async (e) => {
|
||||
e.stopPropagation();
|
||||
try {
|
||||
const { PDFDocument, StandardFonts, rgb } = await import('pdf-lib');
|
||||
const pdfDoc = await PDFDocument.create();
|
||||
const page = pdfDoc.addPage([595, 842]);
|
||||
const { width, height } = page.getSize();
|
||||
|
||||
const font = await pdfDoc.embedFont(StandardFonts.Helvetica);
|
||||
const fontBold = await pdfDoc.embedFont(StandardFonts.HelveticaBold);
|
||||
|
||||
const colorPrimary = rgb(0.18, 0.34, 0.55);
|
||||
const colorText = rgb(0.13, 0.13, 0.13);
|
||||
const colorGray = rgb(0.45, 0.45, 0.45);
|
||||
const colorLightGray = rgb(0.92, 0.92, 0.92);
|
||||
|
||||
const edad = paciente.fechaNacimiento ? calcularEdad(paciente.fechaNacimiento) : '';
|
||||
const fechaFormateada = internacion.fechaIngresoClinica ? formatDateDDMMYYYY(internacion.fechaIngresoClinica) : 'N/A';
|
||||
const fechaHospital = internacion.fechaIngresoHospital ? formatDateDDMMYYYY(internacion.fechaIngresoHospital) : '';
|
||||
|
||||
// Header
|
||||
page.drawRectangle({ x: 0, y: height - 100, width, height: 100, color: colorPrimary });
|
||||
page.drawText('HOSPITAL DONACIÓN F. SANTOJANNI – DIVISIÓN CLÍNICA MÉDICA', { x: 60, y: height - 35, size: 14, font: fontBold, color: rgb(1, 1, 1) });
|
||||
page.drawText('HISTORIA CLÍNICA DE INGRESO', { x: 170, y: height - 55, size: 12, font: fontBold, color: rgb(1, 1, 1) });
|
||||
|
||||
let y = height - 140;
|
||||
|
||||
// Datos Filiatorios
|
||||
page.drawRectangle({ x: 45, y: y - 8, width: 505, height: 24, color: colorLightGray });
|
||||
page.drawText('DATOS FILIATORIOS', { x: 50, y: y, size: 12, font: fontBold, color: colorPrimary });
|
||||
y -= 35;
|
||||
|
||||
// Primera línea: Fechas y cama
|
||||
const fechaIngresoHospText = fechaHospital ? `Fecha ingreso al hospital: ${fechaHospital}` : '';
|
||||
const fechaIngresoClinText = fechaFormateada ? `Fecha ingreso a clínica: ${fechaFormateada}` : '';
|
||||
const camaText = `Cama: ${cama?.numero || 'N/A'}`;
|
||||
|
||||
page.drawText(fechaIngresoHospText, { x: 50, y, size: 10, font: fontBold, color: colorGray });
|
||||
page.drawText(fechaIngresoClinText, { x: 260, y, size: 10, font: fontBold, color: colorGray });
|
||||
y -= 18;
|
||||
page.drawText(camaText, { x: 50, y, size: 10, font: fontBold, color: colorGray });
|
||||
y -= 25;
|
||||
|
||||
// Segunda línea: Apellido, Nombre y DNI
|
||||
page.drawText(`Apellido y Nombre: ${paciente.apellido || ''}, ${paciente.nombre || ''}`, { x: 50, y, size: 10, font: fontBold, color: colorGray });
|
||||
y -= 18;
|
||||
page.drawText(`DNI: ${paciente.dni || ''}`, { x: 50, y, size: 10, font: fontBold, color: colorGray });
|
||||
page.drawText(`Edad: ${edad ? `${edad} años` : ''}`, { x: 280, y, size: 10, font: fontBold, color: colorGray });
|
||||
y -= 40;
|
||||
|
||||
// Datos Clínicos
|
||||
page.drawRectangle({ x: 45, y: y - 8, width: 505, height: 24, color: colorLightGray });
|
||||
page.drawText('DATOS CLÍNICOS', { x: 50, y: y, size: 12, font: fontBold, color: colorPrimary });
|
||||
y -= 35;
|
||||
|
||||
page.drawText('Motivo de Consulta:', { x: 50, y, size: 10, font: fontBold, color: colorGray });
|
||||
y -= 18;
|
||||
const motivoLines = wrapText(internacion.motivoConsulta || 'Sin información', font, 10, 480);
|
||||
for (const line of motivoLines.slice(0, 4)) {
|
||||
page.drawText(line, { x: 50, y, size: 10, font, color: colorText });
|
||||
y -= 14;
|
||||
}
|
||||
y -= 10;
|
||||
if (motivoLines.length > 4) y -= (motivoLines.length - 4) * 14;
|
||||
|
||||
page.drawText('Enfermedad Actual:', { x: 50, y, size: 10, font: fontBold, color: colorGray });
|
||||
y -= 18;
|
||||
const enfermedadLines = wrapText(internacion.enfermedadActual || 'Sin información', font, 10, 480);
|
||||
for (const line of enfermedadLines.slice(0, 4)) {
|
||||
page.drawText(line, { x: 50, y, size: 10, font, color: colorText });
|
||||
y -= 14;
|
||||
}
|
||||
y -= 10;
|
||||
if (enfermedadLines.length > 4) y -= (enfermedadLines.length - 4) * 14;
|
||||
|
||||
page.drawText('Antecedentes de la Enfermedad Actual:', { x: 50, y, size: 10, font: fontBold, color: colorGray });
|
||||
y -= 18;
|
||||
const antecedentesLines = wrapText(internacion.antecedentesEnfermedadActual || 'Sin antecedentes registrados', font, 10, 480);
|
||||
for (const line of antecedentesLines.slice(0, 4)) {
|
||||
page.drawText(line, { x: 50, y, size: 10, font, color: colorText });
|
||||
y -= 14;
|
||||
}
|
||||
y -= 10;
|
||||
if (antecedentesLines.length > 4) y -= (antecedentesLines.length - 4) * 14;
|
||||
|
||||
page.drawText('Diagnóstico de Ingreso:', { x: 50, y, size: 10, font: fontBold, color: colorGray });
|
||||
y -= 18;
|
||||
const diagnosticoLines = wrapText(internacion.diagnosticoIngreso || 'Sin diagnóstico', font, 10, 480);
|
||||
for (const line of diagnosticoLines.slice(0, 3)) {
|
||||
page.drawText(line, { x: 50, y, size: 10, font, color: colorText });
|
||||
y -= 14;
|
||||
}
|
||||
|
||||
// Footer
|
||||
y -= 20;
|
||||
page.drawLine({ start: { x: 50, y }, end: { x: 250, y }, thickness: 0.5, color: colorGray });
|
||||
page.drawText('Firma del Médico', { x: 50, y: y - 15, size: 9, font, color: colorGray });
|
||||
page.drawLine({ start: { x: 320, y }, end: { x: 520, y }, thickness: 0.5, color: colorGray });
|
||||
page.drawText('Aclaración / Sello', { x: 320, y: y - 15, size: 9, font, color: colorGray });
|
||||
page.drawText('v2.0', { x: width - 60, y: 30, size: 8, font, color: colorGray });
|
||||
|
||||
const pdfBytes = await pdfDoc.save();
|
||||
const blob = new Blob([new Uint8Array(pdfBytes)], { type: 'application/pdf' });
|
||||
const url = URL.createObjectURL(blob);
|
||||
const link = document.createElement('a');
|
||||
link.href = url;
|
||||
link.download = `FormularioIngreso_${paciente.apellido}_${paciente.dni}.pdf`;
|
||||
link.click();
|
||||
URL.revokeObjectURL(url);
|
||||
} catch (err) {
|
||||
console.error('Error generating PDF:', err);
|
||||
}
|
||||
}}>
|
||||
<FileDown className="h-4 w-4 mr-2" />
|
||||
Descargar Formulario de Ingreso
|
||||
</Button>
|
||||
</div>
|
||||
</AccordionContent>
|
||||
</AccordionItem>
|
||||
</Accordion>
|
||||
|
||||
</div>
|
||||
{detalleExpandido ? <ChevronUp className="h-5 w-5 text-gray-400" /> : <ChevronDown className="h-5 w-5 text-gray-400" />}
|
||||
</button>
|
||||
{detalleExpandido && (
|
||||
<div className="border-t p-4 space-y-4">
|
||||
<div>
|
||||
<p className="text-gray-500 text-sm">Motivo de Consulta</p>
|
||||
<p className="font-medium">{internacion.motivoConsulta || 'Sin motivo registrado'}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-gray-500 text-sm">Enfermedad Actual</p>
|
||||
<p className="font-medium">{internacion.enfermedadActual || 'Sin información'}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-gray-500 text-sm">Antecedentes de Enfermedad Actual</p>
|
||||
<p className="font-medium">{internacion.antecedentesEnfermedadActual || 'Sin antecedentes registrados'}</p>
|
||||
</div>
|
||||
<Button variant="outline" className="bg-blue-50 border-blue-300 text-blue-700 hover:bg-blue-100" onClick={async (e) => {
|
||||
e.stopPropagation();
|
||||
try {
|
||||
const { PDFDocument, StandardFonts, rgb } = await import('pdf-lib');
|
||||
const pdfDoc = await PDFDocument.create();
|
||||
const page = pdfDoc.addPage([595, 842]);
|
||||
const { width, height } = page.getSize();
|
||||
|
||||
const font = await pdfDoc.embedFont(StandardFonts.Helvetica);
|
||||
const fontBold = await pdfDoc.embedFont(StandardFonts.HelveticaBold);
|
||||
</div>
|
||||
|
||||
const colorPrimary = rgb(0.18, 0.34, 0.55);
|
||||
const colorText = rgb(0.13, 0.13, 0.13);
|
||||
const colorGray = rgb(0.45, 0.45, 0.45);
|
||||
const colorLightGray = rgb(0.92, 0.92, 0.92);
|
||||
|
||||
const edad = paciente.fechaNacimiento ? calcularEdad(paciente.fechaNacimiento) : '';
|
||||
const fechaFormateada = internacion.fechaIngresoClinica ? formatDateDDMMYYYY(internacion.fechaIngresoClinica) : 'N/A';
|
||||
const fechaHospital = internacion.fechaIngresoHospital ? formatDateDDMMYYYY(internacion.fechaIngresoHospital) : '';
|
||||
|
||||
// Header
|
||||
page.drawRectangle({ x: 0, y: height - 100, width, height: 100, color: colorPrimary });
|
||||
page.drawText('HOSPITAL DONACIÓN F. SANTOJANNI – DIVISIÓN CLÍNICA MÉDICA', { x: 60, y: height - 35, size: 14, font: fontBold, color: rgb(1, 1, 1) });
|
||||
page.drawText('HISTORIA CLÍNICA DE INGRESO', { x: 170, y: height - 55, size: 12, font: fontBold, color: rgb(1, 1, 1) });
|
||||
|
||||
let y = height - 140;
|
||||
|
||||
// Datos Filiatorios
|
||||
page.drawRectangle({ x: 45, y: y - 8, width: 505, height: 24, color: colorLightGray });
|
||||
page.drawText('DATOS FILIATORIOS', { x: 50, y: y, size: 12, font: fontBold, color: colorPrimary });
|
||||
y -= 35;
|
||||
|
||||
// Primera línea: Fechas y cama
|
||||
const fechaIngresoHospText = fechaHospital ? `Fecha ingreso al hospital: ${fechaHospital}` : '';
|
||||
const fechaIngresoClinText = fechaFormateada ? `Fecha ingreso a clínica: ${fechaFormateada}` : '';
|
||||
const camaText = `Cama: ${cama?.numero || 'N/A'}`;
|
||||
|
||||
page.drawText(fechaIngresoHospText, { x: 50, y, size: 10, font: fontBold, color: colorGray });
|
||||
page.drawText(fechaIngresoClinText, { x: 260, y, size: 10, font: fontBold, color: colorGray });
|
||||
y -= 18;
|
||||
page.drawText(camaText, { x: 50, y, size: 10, font: fontBold, color: colorGray });
|
||||
y -= 25;
|
||||
|
||||
// Segunda línea: Apellido, Nombre y DNI
|
||||
page.drawText(`Apellido y Nombre: ${paciente.apellido || ''}, ${paciente.nombre || ''}`, { x: 50, y, size: 10, font: fontBold, color: colorGray });
|
||||
y -= 18;
|
||||
page.drawText(`DNI: ${paciente.dni || ''}`, { x: 50, y, size: 10, font: fontBold, color: colorGray });
|
||||
page.drawText(`Edad: ${edad ? `${edad} años` : ''}`, { x: 280, y, size: 10, font: fontBold, color: colorGray });
|
||||
y -= 40;
|
||||
|
||||
// Datos Clínicos
|
||||
page.drawRectangle({ x: 45, y: y - 8, width: 505, height: 24, color: colorLightGray });
|
||||
page.drawText('DATOS CLÍNICOS', { x: 50, y: y, size: 12, font: fontBold, color: colorPrimary });
|
||||
y -= 35;
|
||||
|
||||
page.drawText('Motivo de Consulta:', { x: 50, y, size: 10, font: fontBold, color: colorGray });
|
||||
y -= 18;
|
||||
const motivoLines = wrapText(internacion.motivoConsulta || 'Sin información', font, 10, 480);
|
||||
for (const line of motivoLines.slice(0, 4)) {
|
||||
page.drawText(line, { x: 50, y, size: 10, font, color: colorText });
|
||||
y -= 14;
|
||||
}
|
||||
y -= 10;
|
||||
if (motivoLines.length > 4) y -= (motivoLines.length - 4) * 14;
|
||||
|
||||
page.drawText('Enfermedad Actual:', { x: 50, y, size: 10, font: fontBold, color: colorGray });
|
||||
y -= 18;
|
||||
const enfermedadLines = wrapText(internacion.enfermedadActual || 'Sin información', font, 10, 480);
|
||||
for (const line of enfermedadLines.slice(0, 4)) {
|
||||
page.drawText(line, { x: 50, y, size: 10, font, color: colorText });
|
||||
y -= 14;
|
||||
}
|
||||
y -= 10;
|
||||
if (enfermedadLines.length > 4) y -= (enfermedadLines.length - 4) * 14;
|
||||
|
||||
page.drawText('Antecedentes de la Enfermedad Actual:', { x: 50, y, size: 10, font: fontBold, color: colorGray });
|
||||
y -= 18;
|
||||
const antecedentesLines = wrapText(internacion.antecedentesEnfermedadActual || 'Sin antecedentes registrados', font, 10, 480);
|
||||
for (const line of antecedentesLines.slice(0, 4)) {
|
||||
page.drawText(line, { x: 50, y, size: 10, font, color: colorText });
|
||||
y -= 14;
|
||||
}
|
||||
y -= 10;
|
||||
if (antecedentesLines.length > 4) y -= (antecedentesLines.length - 4) * 14;
|
||||
|
||||
page.drawText('Diagnóstico de Ingreso:', { x: 50, y, size: 10, font: fontBold, color: colorGray });
|
||||
y -= 18;
|
||||
const diagnosticoLines = wrapText(internacion.diagnosticoIngreso || 'Sin diagnóstico', font, 10, 480);
|
||||
for (const line of diagnosticoLines.slice(0, 3)) {
|
||||
page.drawText(line, { x: 50, y, size: 10, font, color: colorText });
|
||||
y -= 14;
|
||||
}
|
||||
|
||||
// Footer
|
||||
y -= 20;
|
||||
page.drawLine({ start: { x: 50, y }, end: { x: 250, y }, thickness: 0.5, color: colorGray });
|
||||
page.drawText('Firma del Médico', { x: 50, y: y - 15, size: 9, font, color: colorGray });
|
||||
page.drawLine({ start: { x: 320, y }, end: { x: 520, y }, thickness: 0.5, color: colorGray });
|
||||
page.drawText('Aclaración / Sello', { x: 320, y: y - 15, size: 9, font, color: colorGray });
|
||||
page.drawText('v2.0', { x: width - 60, y: 30, size: 8, font, color: colorGray });
|
||||
|
||||
const pdfBytes = await pdfDoc.save();
|
||||
const blob = new Blob([new Uint8Array(pdfBytes)], { type: 'application/pdf' });
|
||||
const url = URL.createObjectURL(blob);
|
||||
const link = document.createElement('a');
|
||||
link.href = url;
|
||||
link.download = `FormularioIngreso_${paciente.apellido}_${paciente.dni}.pdf`;
|
||||
link.click();
|
||||
URL.revokeObjectURL(url);
|
||||
} catch (err) {
|
||||
console.error('Error generating PDF:', err);
|
||||
}
|
||||
}}>
|
||||
<FileDown className="h-4 w-4 mr-2" />
|
||||
Descargar Formulario de Ingreso
|
||||
</Button>
|
||||
</div>
|
||||
)}
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<Tabs value={tabActivo} onValueChange={setTabActivo}>
|
||||
<TabsList className="flex w-full overflow-x-auto gap-1 pb-2">
|
||||
<TabsTrigger value="evoluciones" className="flex-shrink-0 flex items-center gap-1 text-xs sm:text-sm">
|
||||
@@ -665,7 +629,7 @@ function SeccionLaboratorios({ lab, patientId, add, update, del, addAcidoBase }:
|
||||
if (tp) res.push({ parametro: 'Tiempo de Protrombina', valor: tp, unidad: 'seg', estado: calcularEstadoLaboratorio('Tiempo de Protrombina', tp) });
|
||||
if (kptt) res.push({ parametro: 'KPTT', valor: kptt, unidad: 'seg', estado: calcularEstadoLaboratorio('KPTT', kptt) });
|
||||
if (rin) res.push({ parametro: 'INR', valor: rin, unidad: '', estado: calcularEstadoLaboratorio('INR', rin) });
|
||||
return res;
|
||||
return res;
|
||||
};
|
||||
|
||||
const reset = () => {
|
||||
@@ -726,7 +690,7 @@ return res;
|
||||
|
||||
const lineas = texto.split('\n');
|
||||
|
||||
for (const linea of lineas) {
|
||||
for (const linea of lineas) {
|
||||
const lineaLower = linea.toLowerCase().trim();
|
||||
|
||||
for (const [clave, info] of Object.entries(mapeoParametros)) {
|
||||
@@ -1146,7 +1110,7 @@ for (const linea of lineas) {
|
||||
<Button variant="outline" onClick={() => setImportDialog(false)}>Cancelar</Button>
|
||||
<Button onClick={handleImportarLaboratorio} disabled={importResultados.length === 0 && !importObservaciones && !importAcidoBase}>
|
||||
<Save className="h-4 w-4 mr-2" />
|
||||
{(importAcidoBase ? 'Guardar Gasometría' : 'Guardar Laboratorio')}
|
||||
{(importAcidoBase ? 'Guardar' : 'Guardar Laboratorio')}
|
||||
</Button>
|
||||
</div>
|
||||
</DialogContent>
|
||||
@@ -1157,8 +1121,8 @@ for (const linea of lineas) {
|
||||
) : (
|
||||
<div className="relative w-full overflow-auto grid grid-cols-1">
|
||||
|
||||
<Table>
|
||||
<TableHeader>
|
||||
<Table>
|
||||
<TableHeader>
|
||||
<TableRow>
|
||||
<TableHead className="cursor-pointer hover:bg-muted" onClick={() => setLabSortAsc(!labSortAsc)}>
|
||||
Fecha {labSortAsc ? '↑' : '↓'}
|
||||
@@ -1231,7 +1195,7 @@ for (const linea of lineas) {
|
||||
))}
|
||||
</TableBody>
|
||||
</Table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
)}
|
||||
</div>
|
||||
@@ -1568,7 +1532,7 @@ function SeccionAcidosBase({ ab, patientId, add, update, del }: {
|
||||
<div><p className="font-medium">{a.fecha} {a.hora}</p></div>
|
||||
<div className="flex items-center 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 && 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>
|
||||
<Badge className={getColorPh(a.ph)}>pH: {a.ph}</Badge>
|
||||
<Button size="sm" variant="ghost" className="text-blue-600" onClick={() => loadEdit(a)}><Edit /></Button>
|
||||
@@ -1626,7 +1590,7 @@ function SeccionCultivos({ cults, patient, add, update, del }: {
|
||||
setSelected(null);
|
||||
};
|
||||
|
||||
const resetRes = () => {
|
||||
const resetRes = () => {
|
||||
setFechaResultado(new Date().toISOString().split('T')[0]);
|
||||
setEstadoResultado('Positivo');
|
||||
setGermen('');
|
||||
@@ -1798,73 +1762,73 @@ const resetRes = () => {
|
||||
<div>
|
||||
<div className="grid grid-cols-1 gap-4">
|
||||
{cs.length === 0 ? <div className="text-center py-8 text-gray-400"><Microscope className="h-12 w-12 mx-auto mb-2 opacity-50" /><p>No hay cultivos</p></div> :
|
||||
cs.map(c => (
|
||||
<Card key={c.id} className="hover:shadow-md transition-shadow"><CardContent className="p-4">
|
||||
<div className="flex flex-col gap-3">
|
||||
<div className="flex flex-col sm:flex-row sm:items-start sm:justify-between gap-4">
|
||||
<div className="flex items-center gap-3">
|
||||
<div className={`h-10 w-10 rounded-full flex items-center justify-center flex-shrink-0 ${c.estado === 'NAF/Pendiente' ? 'bg-amber-100' : c.estado === 'Parcial' ? 'bg-orange-100' : c.estado === 'Positivo' ? 'bg-red-100' : 'bg-green-100'}`}>
|
||||
<Microscope className={`h-5 w-5 ${c.estado === 'NAF/Pendiente' ? 'text-amber-600' : c.estado === 'Parcial' ? 'text-orange-600' : c.estado === 'Positivo' ? 'text-red-600' : 'text-green-600'}`} />
|
||||
</div>
|
||||
<div>
|
||||
<p className="font-medium">{c.fechaToma}</p>
|
||||
<div className="flex items-center gap-2 text-sm text-gray-500">
|
||||
<Badge variant="outline">{c.tipoMuestra}</Badge>
|
||||
<Badge className={getEstadoColor(c.estado)}>{getEstadoLabel(c.estado)}</Badge>
|
||||
cs.map(c => (
|
||||
<Card key={c.id} className="hover:shadow-md transition-shadow"><CardContent className="p-4">
|
||||
<div className="flex flex-col gap-3">
|
||||
<div className="flex flex-col sm:flex-row sm:items-start sm:justify-between gap-4">
|
||||
<div className="flex items-center gap-3">
|
||||
<div className={`h-10 w-10 rounded-full flex items-center justify-center flex-shrink-0 ${c.estado === 'NAF/Pendiente' ? 'bg-amber-100' : c.estado === 'Parcial' ? 'bg-orange-100' : c.estado === 'Positivo' ? 'bg-red-100' : 'bg-green-100'}`}>
|
||||
<Microscope className={`h-5 w-5 ${c.estado === 'NAF/Pendiente' ? 'text-amber-600' : c.estado === 'Parcial' ? 'text-orange-600' : c.estado === 'Positivo' ? 'text-red-600' : 'text-green-600'}`} />
|
||||
</div>
|
||||
<div>
|
||||
<p className="font-medium">{c.fechaToma}</p>
|
||||
<div className="flex items-center gap-2 text-sm text-gray-500">
|
||||
<Badge variant="outline">{c.tipoMuestra}</Badge>
|
||||
<Badge className={getEstadoColor(c.estado)}>{getEstadoLabel(c.estado)}</Badge>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex flex-wrap items-center gap-2">
|
||||
{c.estado === 'NAF/Pendiente' && (
|
||||
<>
|
||||
<Button size="sm" variant="outline" onClick={() => openParcial(c)}><AlertCircle className="h-4 w-4 mr-1" />Parcial</Button>
|
||||
<Button size="sm" variant="outline" onClick={() => { openDefinitivo(c); setIsParcialMode(false); }}><CheckCircle2 className="h-4 w-4 mr-1" />Definitivo</Button>
|
||||
</>
|
||||
)}
|
||||
{c.estado === 'Parcial' && (
|
||||
<>
|
||||
<Button size="sm" variant="outline" onClick={() => openParcial(c)}><Pencil className="h-4 w-4 mr-1" />Editar Parcial</Button>
|
||||
<Button size="sm" variant="outline" onClick={() => openDefinitivo(c)}><CheckCircle2 className="h-4 w-4 mr-1" />Definitivo</Button>
|
||||
</>
|
||||
)}
|
||||
{(c.estado === 'Positivo' || c.estado === 'Negativo') && <Button size="sm" variant="outline" onClick={() => openDefinitivo(c)}><Pencil className="h-4 w-4" /></Button>}
|
||||
<Button size="sm" variant="outline" className="text-red-600" onClick={() => del(c.id)}><Trash2 /></Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex flex-wrap items-center gap-2">
|
||||
{c.estado === 'NAF/Pendiente' && (
|
||||
<>
|
||||
<Button size="sm" variant="outline" onClick={() => openParcial(c)}><AlertCircle className="h-4 w-4 mr-1" />Parcial</Button>
|
||||
<Button size="sm" variant="outline" onClick={() => { openDefinitivo(c); setIsParcialMode(false); }}><CheckCircle2 className="h-4 w-4 mr-1" />Definitivo</Button>
|
||||
</>
|
||||
{c.protocolo && <p className="text-xs text-gray-500">Protocolo: {c.protocolo}</p>}
|
||||
{c.observaciones && <p className="text-sm text-gray-600 bg-gray-50 p-2 rounded">{c.observaciones}</p>}
|
||||
{c.estado === 'Parcial' && c.germen && (
|
||||
<div className="bg-orange-50 p-3 rounded-lg border border-orange-200">
|
||||
<p className="text-sm font-medium text-orange-800 flex items-center gap-2"><AlertCircle className="h-4 w-4" />PARCIAL - Germen: {c.germen}</p>
|
||||
{(c.sensible || c.resistente) && (
|
||||
<div className="mt-2 space-y-1">
|
||||
{c.sensible && <p className="text-xs text-orange-700">Sensible: {c.sensible}</p>}
|
||||
{c.resistente && <p className="text-xs text-orange-700">Resistente: {c.resistente}</p>}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
{c.estado === 'Parcial' && (
|
||||
<>
|
||||
<Button size="sm" variant="outline" onClick={() => openParcial(c)}><Pencil className="h-4 w-4 mr-1" />Editar Parcial</Button>
|
||||
<Button size="sm" variant="outline" onClick={() => openDefinitivo(c)}><CheckCircle2 className="h-4 w-4 mr-1" />Definitivo</Button>
|
||||
</>
|
||||
{c.estado === 'Positivo' && c.germen && (
|
||||
<div className="bg-red-50 p-3 rounded-lg border border-red-200">
|
||||
<p className="text-sm font-medium text-red-800 flex items-center gap-2"><AlertCircle className="h-4 w-4" />Germen: {c.germen}</p>
|
||||
{c.fechaResultado && <p className="text-xs text-red-600 mt-1">Resultado: {c.fechaResultado}</p>}
|
||||
{(c.sensible || c.resistente) && (
|
||||
<div className="mt-2 space-y-2">
|
||||
{c.sensible && <div><p className="text-xs font-medium text-green-700 mb-1">Sensible a:</p><p className="text-sm text-green-800">{c.sensible}</p></div>}
|
||||
{c.resistente && <div><p className="text-xs font-medium text-red-700 mb-1">Resistente a:</p><p className="text-sm text-red-800">{c.resistente}</p></div>}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
{(c.estado === 'Positivo' || c.estado === 'Negativo') && <Button size="sm" variant="outline" onClick={() => openDefinitivo(c)}><Pencil className="h-4 w-4" /></Button>}
|
||||
<Button size="sm" variant="outline" className="text-red-600" onClick={() => del(c.id)}><Trash2 /></Button>
|
||||
</div>
|
||||
</div>
|
||||
{c.protocolo && <p className="text-xs text-gray-500">Protocolo: {c.protocolo}</p>}
|
||||
{c.observaciones && <p className="text-sm text-gray-600 bg-gray-50 p-2 rounded">{c.observaciones}</p>}
|
||||
{c.estado === 'Parcial' && c.germen && (
|
||||
<div className="bg-orange-50 p-3 rounded-lg border border-orange-200">
|
||||
<p className="text-sm font-medium text-orange-800 flex items-center gap-2"><AlertCircle className="h-4 w-4" />PARCIAL - Germen: {c.germen}</p>
|
||||
{(c.sensible || c.resistente) && (
|
||||
<div className="mt-2 space-y-1">
|
||||
{c.sensible && <p className="text-xs text-orange-700">Sensible: {c.sensible}</p>}
|
||||
{c.resistente && <p className="text-xs text-orange-700">Resistente: {c.resistente}</p>}
|
||||
{c.estado === 'Negativo' && (
|
||||
<div className="bg-green-50 dark:bg-green-900/30 p-3 rounded-lg border border-green-200 dark:border-green-700">
|
||||
<p className="text-sm font-medium text-green-800 flex items-center gap-2"><CheckCircle2 className="h-4 w-4" />Sin crecimiento de microorganismos</p>
|
||||
{c.fechaResultado && <p className="text-xs text-green-600 mt-1">Resultado: {c.fechaResultado}</p>}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
{c.estado === 'Positivo' && c.germen && (
|
||||
<div className="bg-red-50 p-3 rounded-lg border border-red-200">
|
||||
<p className="text-sm font-medium text-red-800 flex items-center gap-2"><AlertCircle className="h-4 w-4" />Germen: {c.germen}</p>
|
||||
{c.fechaResultado && <p className="text-xs text-red-600 mt-1">Resultado: {c.fechaResultado}</p>}
|
||||
{(c.sensible || c.resistente) && (
|
||||
<div className="mt-2 space-y-2">
|
||||
{c.sensible && <div><p className="text-xs font-medium text-green-700 mb-1">Sensible a:</p><p className="text-sm text-green-800">{c.sensible}</p></div>}
|
||||
{c.resistente && <div><p className="text-xs font-medium text-red-700 mb-1">Resistente a:</p><p className="text-sm text-red-800">{c.resistente}</p></div>}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
{c.estado === 'Negativo' && (
|
||||
<div className="bg-green-50 dark:bg-green-900/30 p-3 rounded-lg border border-green-200 dark:border-green-700">
|
||||
<p className="text-sm font-medium text-green-800 flex items-center gap-2"><CheckCircle2 className="h-4 w-4" />Sin crecimiento de microorganismos</p>
|
||||
{c.fechaResultado && <p className="text-xs text-green-600 mt-1">Resultado: {c.fechaResultado}</p>}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</CardContent></Card>
|
||||
))}
|
||||
</CardContent></Card>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -257,12 +257,12 @@ export function Internaciones({
|
||||
placeholder="Nombre del médico ingresante"
|
||||
/>
|
||||
</div>
|
||||
<Button variant="outline"
|
||||
className="w-full"
|
||||
onClick={handleIniciarInternacion}
|
||||
disabled={!pacienteSeleccionado || !camaSeleccionada || !motivoConsulta || !enfermedadActual || !medicoIngresante}
|
||||
>
|
||||
<Plus className="h-4 w-4 mr-2" />
|
||||
<Button variant="outline"
|
||||
className="w-full"
|
||||
onClick={handleIniciarInternacion}
|
||||
disabled={!pacienteSeleccionado || !camaSeleccionada || !motivoConsulta || !enfermedadActual || !medicoIngresante}
|
||||
>
|
||||
<Plus className="h-4 w-4 mr-2" />
|
||||
Iniciar Internación
|
||||
</Button>
|
||||
</div>
|
||||
@@ -307,12 +307,11 @@ export function Internaciones({
|
||||
|
||||
return (
|
||||
<Card key={internacion.id} className="hover:shadow-md transition-shadow">
|
||||
<CardContent className="p-4 dark:bg-gray-800">
|
||||
<CardContent className="p-4 dark:bg-gray-800">
|
||||
<div className="flex flex-col lg:flex-row lg:items-start lg:justify-between gap-4">
|
||||
<div className="flex items-start gap-4">
|
||||
<div className={`h-12 w-12 rounded-full flex items-center justify-center flex-shrink-0 ${
|
||||
internacion.activa ? 'bg-purple-100' : 'bg-gray-100'
|
||||
}`}>
|
||||
<div className={`h-12 w-12 rounded-full flex items-center justify-center flex-shrink-0 ${internacion.activa ? 'bg-purple-100' : 'bg-gray-100'
|
||||
}`}>
|
||||
{internacion.activa ? (
|
||||
<ClipboardList className="h-6 w-6 text-purple-600" />
|
||||
) : (
|
||||
@@ -425,13 +424,13 @@ export function Internaciones({
|
||||
/>
|
||||
</div>
|
||||
<Button variant="outline"
|
||||
className="w-full"
|
||||
onClick={handleFinalizarInternacion}
|
||||
disabled={!fechaEgreso || !diagnosticoEgreso || !motivoEgreso}
|
||||
>
|
||||
<CheckCircle2 className="h-4 w-4 mr-2" />
|
||||
Confirmar Egreso
|
||||
</Button>
|
||||
className="w-full"
|
||||
onClick={handleFinalizarInternacion}
|
||||
disabled={!fechaEgreso || !diagnosticoEgreso || !motivoEgreso}
|
||||
>
|
||||
<CheckCircle2 className="h-4 w-4 mr-2" />
|
||||
Confirmar Egreso
|
||||
</Button>
|
||||
</div>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
|
||||
+30
-30
@@ -173,7 +173,7 @@ export function MapaCamas({
|
||||
return !internacionActiva;
|
||||
});
|
||||
|
||||
return (
|
||||
return (
|
||||
<div className="space-y-6 dark:text-white">
|
||||
<div className="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4">
|
||||
<div>
|
||||
@@ -187,25 +187,25 @@ return (
|
||||
<Badge variant="outline" className="bg-red-50 text-red-700">
|
||||
{camas.filter(c => c.estado === 'Ocupada').length} Ocupadas
|
||||
</Badge>
|
||||
<div className="ml-4 flex items-center gap-2 flex-wrap sm:flex-nowrap">
|
||||
<Button variant="outline" onClick={() => {
|
||||
setEditingAreaId(null);
|
||||
setAreaNombre('');
|
||||
setAreaDialogOpen(true);
|
||||
}} className="text-xs px-2 py-1 sm:text-sm sm:px-4 sm:py-2">
|
||||
Administrar Áreas
|
||||
</Button>
|
||||
<Button variant="outline" onClick={() => {
|
||||
setEditingBed(null);
|
||||
setBedNumero('');
|
||||
setBedTipo('General');
|
||||
setBedAreaId(areas?.[0]?.id);
|
||||
setBedDialogOpen(true);
|
||||
}} className="text-xs px-2 py-1 sm:text-sm sm:px-4 sm:py-2">
|
||||
<Plus className="h-3 w-3 sm:h-4 sm:w-4 sm:mr-1" />
|
||||
<span className="hidden sm:inline">Agregar Cama</span>
|
||||
</Button>
|
||||
</div>
|
||||
<div className="ml-4 flex items-center gap-2 flex-wrap sm:flex-nowrap">
|
||||
<Button variant="outline" onClick={() => {
|
||||
setEditingAreaId(null);
|
||||
setAreaNombre('');
|
||||
setAreaDialogOpen(true);
|
||||
}} className="text-xs px-2 py-1 sm:text-sm sm:px-4 sm:py-2">
|
||||
Administrar Áreas
|
||||
</Button>
|
||||
<Button variant="outline" onClick={() => {
|
||||
setEditingBed(null);
|
||||
setBedNumero('');
|
||||
setBedTipo('General');
|
||||
setBedAreaId(areas?.[0]?.id);
|
||||
setBedDialogOpen(true);
|
||||
}} className="text-xs px-2 py-1 sm:text-sm sm:px-4 sm:py-2">
|
||||
<Plus className="h-3 w-3 sm:h-4 sm:w-4 sm:mr-1" />
|
||||
<span className="hidden sm:inline">Agregar Cama</span>
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -296,7 +296,7 @@ return (
|
||||
</Card>
|
||||
</DialogTrigger>
|
||||
<DialogContent className="sm:max-w-md">
|
||||
<DialogHeader>
|
||||
<DialogHeader>
|
||||
<DialogTitle className="flex items-center gap-2">
|
||||
<Bed className="h-5 w-5" />
|
||||
Cama {cama.numero} - {cama.areaId ? areaById[cama.areaId] ?? 'Área desconocida' : 'Sin área'}
|
||||
@@ -398,14 +398,14 @@ return (
|
||||
placeholder="Nombre del médico..."
|
||||
/>
|
||||
</div>
|
||||
<Button variant="outline"
|
||||
className="w-full"
|
||||
onClick={handleOcuparCama}
|
||||
disabled={!pacienteSeleccionado || !diagnostico || !enfermedadActual || !medico}
|
||||
>
|
||||
<Plus className="h-4 w-4 mr-1" />
|
||||
Iniciar Internación
|
||||
</Button>
|
||||
<Button variant="outline"
|
||||
className="w-full"
|
||||
onClick={handleOcuparCama}
|
||||
disabled={!pacienteSeleccionado || !diagnostico || !enfermedadActual || !medico}
|
||||
>
|
||||
<Plus className="h-4 w-4 mr-1" />
|
||||
Iniciar Internación
|
||||
</Button>
|
||||
</div>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
@@ -462,8 +462,8 @@ return (
|
||||
<Trash className="h-4 w-4 mr-1" />Eliminar
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
|
||||
@@ -300,12 +300,12 @@ export function Pacientes({
|
||||
Cancelar
|
||||
</Button>
|
||||
<Button variant="outline"
|
||||
onClick={handleGuardar}
|
||||
disabled={!nombre || !apellido || !dni || !fechaNacimiento}
|
||||
>
|
||||
<Save className="h-4 w-4 mr-2" />
|
||||
{pacienteEditando ? 'Guardar Cambios' : 'Crear Paciente'}
|
||||
</Button>
|
||||
onClick={handleGuardar}
|
||||
disabled={!nombre || !apellido || !dni || !fechaNacimiento}
|
||||
>
|
||||
<Save className="h-4 w-4 mr-2" />
|
||||
{pacienteEditando ? 'Guardar Cambios' : 'Crear Paciente'}
|
||||
</Button>
|
||||
</div>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
@@ -330,7 +330,7 @@ export function Pacientes({
|
||||
<div className="grid grid-cols-1 gap-4">
|
||||
{pacientesFiltrados.map((paciente) => (
|
||||
<Card key={paciente.id} className="hover:shadow-md transition-shadow">
|
||||
<CardContent className="p-4 dark:bg-gray-800">
|
||||
<CardContent className="p-4 dark:bg-gray-800">
|
||||
<div className="flex flex-col sm:flex-row sm:items-start sm:justify-between gap-4">
|
||||
<div className="flex items-start gap-4">
|
||||
<div className="h-12 w-12 bg-blue-100 rounded-full flex items-center justify-center flex-shrink-0">
|
||||
|
||||
Reference in New Issue
Block a user