Fix responsive layouts for Internaciones/Evoluciones tables and currentUser undefined error

This commit is contained in:
2026-08-09 18:29:39 +00:00
parent 3cb381acd3
commit 7675df4ba1
8 changed files with 257 additions and 206 deletions
+12
View File
@@ -1,5 +1,6 @@
import { clsx, type ClassValue } from "clsx"
import { twMerge } from "tailwind-merge"
import type { Usuario } from '@/types'
export function cn(...inputs: ClassValue[]) {
return twMerge(clsx(inputs))
@@ -12,3 +13,14 @@ export function formatDateDDMMYYYY(dateString: string): string {
const [year, month, day] = parts;
return `${day}-${month}-${year}`;
}
export function getNombreProfesional(user?: Usuario | null): string {
if (!user) return 'Admin';
if (user.rol === 'admin') return 'Admin';
const apellido = user.apellido?.trim() || '';
const nombre = user.nombre?.trim() || '';
if (apellido && nombre) return `${apellido}, ${nombre}`;
if (apellido) return apellido;
if (nombre) return nombre;
return 'Admin';
}
+9 -4
View File
@@ -8,6 +8,8 @@ import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@
import { Badge } from '@/components/ui/badge';
import { toast } from 'sonner';
import type { Paciente, Cama, Area, Internacion } from '@/types';
import { getNombreProfesional } from '@/lib/utils';
import { useHospitalStore } from '@/hooks/useHospitalStore';
interface EditIngresoProps {
internacion: Internacion;
@@ -31,12 +33,15 @@ export function EditIngreso({
onAgregarCama,
onVolver,
}: EditIngresoProps) {
const { currentUser } = useHospitalStore();
const [pacienteSeleccionado] = useState(internacion.pacienteId);
const [camaSeleccionada] = useState(internacion.camaId);
const [areaSeleccionada] = useState(internacion.areaId);
const [camaInput, setCamaInput] = useState('');
const [modoCama, setModoCama] = useState<'seleccionar' | 'escribir'>('seleccionar');
const [medico, setMedico] = useState(internacion.medicoIngresante || '');
const defaultMedico = internacion.medicoIngresante || getNombreProfesional(currentUser);
const [medico, setMedico] = useState('');
const effectiveMedico = medico || defaultMedico;
const [fechaIngresoHospital, setFechaIngresoHospital] = useState(internacion.fechaIngresoHospital || '');
const [fechaIngresoClinica, setFechaIngresoClinica] = useState(internacion.fechaIngresoClinica || '');
const [motivoConsulta, setMotivoConsulta] = useState(internacion.motivoConsulta || '');
@@ -111,7 +116,7 @@ export function EditIngreso({
return;
}
if (!medico.trim()) {
if (!effectiveMedico.trim()) {
toast.error('Debe ingresar el médico ingresante');
return;
}
@@ -166,7 +171,7 @@ export function EditIngreso({
pacienteId: pacienteSeleccionado,
camaId: camaId,
areaId: newAreaId,
medicoIngresante: medico.trim(),
medicoIngresante: effectiveMedico.trim(),
diagnosticoIngreso: diagnosticoIngreso.trim(),
motivoConsulta: motivoConsulta.trim() || undefined,
enfermedadActual: enfermedadActual.trim(),
@@ -464,7 +469,7 @@ export function EditIngreso({
<Label>Médico Ingresante *</Label>
<Input
placeholder="Nombre del médico"
value={medico}
value={effectiveMedico}
onChange={(e) => setMedico(e.target.value)}
/>
</div>
+85 -76
View File
@@ -10,6 +10,9 @@ import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@
import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from '@/components/ui/dropdown-menu';
import { toast } from 'sonner';
import type { Evolucion, Internacion, Paciente, Cama, SignosVitales, ExamenFisico } from '@/types';
import { useHospitalStore } from '@/hooks/useHospitalStore';
import { getNombreProfesional } from '@/lib/utils';
interface EvolucionesProps {
evoluciones: Evolucion[];
@@ -36,6 +39,7 @@ export function Evoluciones({
getPacienteById,
getInternacionActivaByPaciente
}: EvolucionesProps) {
const { currentUser } = useHospitalStore();
const [busqueda, setBusqueda] = useState('');
const [pacienteSeleccionado, setPacienteSeleccionado] = useState<string>('');
const [dialogoAbierto, setDialogoAbierto] = useState(false);
@@ -44,7 +48,10 @@ export function Evoluciones({
const [fecha, setFecha] = useState(new Date().toISOString().split('T')[0]);
const [hora, setHora] = useState(new Date().toTimeString().slice(0, 5));
const defaultMedico = getNombreProfesional(currentUser);
const [medico, setMedico] = useState('');
const effectiveMedico = medico || defaultMedico;
const [temperatura, setTemperatura] = useState('');
const [presionSistolica, setPresionSistolica] = useState('');
const [presionDiastolica, setPresionDiastolica] = useState('');
@@ -118,7 +125,7 @@ export function Evoluciones({
? internaciones.find(i => i.id === evolucionEditando.internacionId)
: getInternacionActivaByPaciente(pacienteSeleccionado);
if (!medico.trim()) {
if (!effectiveMedico.trim()) {
toast.error('Debe completar el nombre del médico');
return;
}
@@ -156,7 +163,7 @@ export function Evoluciones({
const evolucionData = {
fecha,
hora,
medico: medico.trim(),
medico: effectiveMedico.trim(),
signosVitales,
examenFisico,
novedades: novedades || undefined,
@@ -407,7 +414,7 @@ export function Evoluciones({
<div>
<Label>Médico *</Label>
<Input
value={medico}
value={effectiveMedico}
onChange={(e) => setMedico(e.target.value)}
placeholder="Nombre del médico"
/>
@@ -420,7 +427,7 @@ export function Evoluciones({
</Button>
<Button variant="outline"
onClick={handleGuardar}
disabled={!medico || (!evolucionEditando && !pacienteSeleccionado)}
disabled={!effectiveMedico || (!evolucionEditando && !pacienteSeleccionado)}
>
<Save className="h-4 w-4 mr-2" />
Guardar Evolución
@@ -445,80 +452,82 @@ export function Evoluciones({
</Card>
{evolucionesFiltradas.length > 0 ? (
<div className="rounded-md border overflow-x-auto bg-card">
<Table className="w-full min-w-max text-sm">
<TableHeader>
<TableRow>
<TableHead>Fecha</TableHead>
<TableHead>Cama</TableHead>
<TableHead>Paciente</TableHead>
<TableHead>Profesional</TableHead>
<TableHead className="text-center">TAS</TableHead>
<TableHead className="text-center">TAD</TableHead>
<TableHead className="text-center">FC</TableHead>
<TableHead className="text-center">FR</TableHead>
<TableHead className="text-center"></TableHead>
<TableHead className="text-center">Sat</TableHead>
<TableHead className="text-center w-[60px]">Acciones</TableHead>
</TableRow>
</TableHeader>
<TableBody>
{evolucionesFiltradas.map((evolucion) => {
const internacion = internaciones.find(i => i.id === evolucion.internacionId);
const paciente = internacion ? getPacienteById(internacion.pacienteId) : null;
const cama = internacion ? (getCamaById ? getCamaById(internacion.camaId) : camas?.find(c => c.id === internacion.camaId)) : null;
const sv = evolucion.signosVitales;
<div className="grid grid-cols-1 w-full">
<div className="w-full overflow-x-auto rounded-md border bg-card pb-2">
<Table className="w-full min-w-max text-sm">
<TableHeader>
<TableRow>
<TableHead>Fecha</TableHead>
<TableHead>Cama</TableHead>
<TableHead>Paciente</TableHead>
<TableHead>Profesional</TableHead>
<TableHead className="text-center">TAS</TableHead>
<TableHead className="text-center">TAD</TableHead>
<TableHead className="text-center">FC</TableHead>
<TableHead className="text-center">FR</TableHead>
<TableHead className="text-center"></TableHead>
<TableHead className="text-center">Sat</TableHead>
<TableHead className="text-center w-[60px]">Acciones</TableHead>
</TableRow>
</TableHeader>
<TableBody>
{evolucionesFiltradas.map((evolucion) => {
const internacion = internaciones.find(i => i.id === evolucion.internacionId);
const paciente = internacion ? getPacienteById(internacion.pacienteId) : null;
const cama = internacion ? (getCamaById ? getCamaById(internacion.camaId) : camas?.find(c => c.id === internacion.camaId)) : null;
const sv = evolucion.signosVitales;
return (
<TableRow key={evolucion.id} className="hover:bg-muted/50">
<TableCell className="whitespace-nowrap font-medium text-xs">
{evolucion.fecha} {evolucion.hora || ''}
</TableCell>
<TableCell className="text-xs whitespace-nowrap">
{cama ? cama.numero : '-'}
</TableCell>
<TableCell className="font-medium text-xs whitespace-nowrap">
{paciente ? `${paciente.apellido}, ${paciente.nombre}` : 'Sin paciente'}
</TableCell>
<TableCell className="text-xs whitespace-nowrap">
{evolucion.medico || '-'}
</TableCell>
<TableCell className="text-center text-xs">{sv?.presionSistolica ?? '-'}</TableCell>
<TableCell className="text-center text-xs">{sv?.presionDiastolica ?? '-'}</TableCell>
<TableCell className="text-center text-xs">{sv?.frecuenciaCardiaca ?? '-'}</TableCell>
<TableCell className="text-center text-xs">{sv?.frecuenciaRespiratoria ?? '-'}</TableCell>
<TableCell className="text-center text-xs">{sv?.temperatura !== undefined ? `${sv.temperatura}°C` : '-'}</TableCell>
<TableCell className="text-center text-xs">{sv?.saturacionO2 !== undefined ? `${sv.saturacionO2}%` : '-'}</TableCell>
<TableCell className="text-center p-1">
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button size="sm" variant="ghost" className="h-8 w-8 p-0">
<MoreHorizontal className="h-4 w-4" />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end">
<DropdownMenuItem onClick={() => setEvolucionDetalle(evolucion)}>
<Eye className="mr-2 h-4 w-4" />
Detalles
</DropdownMenuItem>
{onActualizarEvolucion && (
<DropdownMenuItem onClick={() => abrirEditar(evolucion)}>
<Pencil className="mr-2 h-4 w-4" />
Editar
return (
<TableRow key={evolucion.id} className="hover:bg-muted/50">
<TableCell className="whitespace-nowrap font-medium text-xs">
{evolucion.fecha} {evolucion.hora || ''}
</TableCell>
<TableCell className="text-xs whitespace-nowrap">
{cama ? cama.numero : '-'}
</TableCell>
<TableCell className="font-medium text-xs whitespace-nowrap">
{paciente ? `${paciente.apellido}, ${paciente.nombre}` : 'Sin paciente'}
</TableCell>
<TableCell className="text-xs whitespace-nowrap">
{evolucion.medico || '-'}
</TableCell>
<TableCell className="text-center text-xs">{sv?.presionSistolica ?? '-'}</TableCell>
<TableCell className="text-center text-xs">{sv?.presionDiastolica ?? '-'}</TableCell>
<TableCell className="text-center text-xs">{sv?.frecuenciaCardiaca ?? '-'}</TableCell>
<TableCell className="text-center text-xs">{sv?.frecuenciaRespiratoria ?? '-'}</TableCell>
<TableCell className="text-center text-xs">{sv?.temperatura !== undefined ? `${sv.temperatura}°C` : '-'}</TableCell>
<TableCell className="text-center text-xs">{sv?.saturacionO2 !== undefined ? `${sv.saturacionO2}%` : '-'}</TableCell>
<TableCell className="text-center p-1">
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button size="sm" variant="ghost" className="h-8 w-8 p-0">
<MoreHorizontal className="h-4 w-4" />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end">
<DropdownMenuItem onClick={() => setEvolucionDetalle(evolucion)}>
<Eye className="mr-2 h-4 w-4" />
Detalles
</DropdownMenuItem>
)}
<DropdownMenuItem onClick={() => onEliminarEvolucion(evolucion.id)} className="text-red-600 focus:text-red-600">
<Trash2 className="mr-2 h-4 w-4" />
Eliminar
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
</TableCell>
</TableRow>
);
})}
</TableBody>
</Table>
{onActualizarEvolucion && (
<DropdownMenuItem onClick={() => abrirEditar(evolucion)}>
<Pencil className="mr-2 h-4 w-4" />
Editar
</DropdownMenuItem>
)}
<DropdownMenuItem onClick={() => onEliminarEvolucion(evolucion.id)} className="text-red-600 focus:text-red-600">
<Trash2 className="mr-2 h-4 w-4" />
Eliminar
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
</TableCell>
</TableRow>
);
})}
</TableBody>
</Table>
</div>
</div>
) : (
<div className="text-center py-12 text-gray-400">
+9 -4
View File
@@ -2,6 +2,8 @@ import { useState } from 'react';
import { toast } from 'sonner';
import { PDFDocument } from 'pdf-lib';
import { User } from 'lucide-react';
import { useHospitalStore } from '@/hooks/useHospitalStore';
import { getNombreProfesional } from '@/lib/utils';
import {
Accordion,
AccordionContent,
@@ -1755,13 +1757,16 @@ function SeccionEvoluciones({ evos, internacionId, add, update, del, canEdit }:
del: (id: string) => void;
canEdit?: boolean;
}) {
const { currentUser } = useHospitalStore();
const [dialog, setDialog] = useState(false);
const [edit, setEdit] = useState<Evolucion | null>(null);
const [evoDetalle, setEvoDetalle] = useState<Evolucion | null>(null);
const [expanded, setExpanded] = useState<string | null>(null);
const [fecha, setFecha] = useState(new Date().toISOString().split('T')[0]);
const [hora, setHora] = useState(new Date().toTimeString().slice(0, 5));
const defaultMedico = getNombreProfesional(currentUser);
const [medico, setMedico] = useState('');
const effectiveMedico = medico || defaultMedico;
const [temperatura, setTemperatura] = useState('');
const [presionSistolica, setPresionSistolica] = useState('');
const [presionDiastolica, setPresionDiastolica] = useState('');
@@ -1829,7 +1834,7 @@ function SeccionEvoluciones({ evos, internacionId, add, update, del, canEdit }:
const evosFiltered = evos.filter(e => e.internacionId === internacionId).sort((a, b) => new Date(b.fecha + 'T' + b.hora).getTime() - new Date(a.fecha + 'T' + a.hora).getTime());
const handle = async () => {
if (!medico.trim()) {
if (!effectiveMedico.trim()) {
toast.error('Ingrese el nombre del médico');
return;
}
@@ -1839,7 +1844,7 @@ function SeccionEvoluciones({ evos, internacionId, add, update, del, canEdit }:
const examenFisico = snc || cardiovascular || respiratorio || abdominal || genitourinario || pielAnexos || soma
? { SNC: snc || undefined, Cardiovascular: cardiovascular || undefined, Respiratorio: respiratorio || undefined, Abdominal: abdominal || undefined, Genitourinario: genitourinario || undefined, PielAnexos: pielAnexos || undefined, SOMA: soma || undefined }
: undefined;
const data = { fecha, hora, medico: medico.trim(), signosVitales, examenFisico, novedades: novedades || undefined, comentario: comentario || undefined, pendientes: pendientes || undefined };
const data = { fecha, hora, medico: effectiveMedico.trim(), signosVitales, examenFisico, novedades: novedades || undefined, comentario: comentario || undefined, pendientes: pendientes || undefined };
try {
if (edit) {
@@ -1898,9 +1903,9 @@ function SeccionEvoluciones({ evos, internacionId, add, update, del, canEdit }:
<div><Label>Comentario</Label><textarea className="w-full p-2 border rounded-md text-sm min-h-[80px] bg-transparent dark:bg-input/30" value={comentario} onChange={e => setComentario(e.target.value)} placeholder="Comentarios adicionales..." /></div>
<div><Label>Pendientes</Label><textarea className="w-full p-2 border rounded-md text-sm min-h-[80px] bg-transparent dark:bg-input/30" value={pendientes} onChange={e => setPendientes(e.target.value)} placeholder="Pendientes..." /></div>
</div>
<div><Label>Médico *</Label><Input value={medico} onChange={e => setMedico(e.target.value)} placeholder="Nombre del médico" /></div>
<div><Label>Médico *</Label><Input value={effectiveMedico} onChange={e => setMedico(e.target.value)} placeholder="Nombre del médico" /></div>
</div>
<div className="flex justify-end gap-2 mt-4"><Button variant="outline" onClick={() => { reset(); setDialog(false); }}><X className="h-4 w-4 mr-2" />Cancelar</Button><Button onClick={handle} disabled={!medico}><Save className="h-4 w-4 mr-2" />Guardar Evolución</Button></div>
<div className="flex justify-end gap-2 mt-4"><Button variant="outline" onClick={() => { reset(); setDialog(false); }}><X className="h-4 w-4 mr-2" />Cancelar</Button><Button onClick={handle} disabled={!effectiveMedico}><Save className="h-4 w-4 mr-2" />Guardar Evolución</Button></div>
</DialogContent>
</Dialog>
{evosFiltered.length === 0 ? (
+107 -101
View File
@@ -11,7 +11,8 @@ import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@
import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from '@/components/ui/dropdown-menu';
import { toast } from 'sonner';
import type { Internacion, Paciente, Cama, Area, Evolucion, Laboratorio, Cultivo } from '@/types';
import { formatDateDDMMYYYY } from '@/lib/utils';
import { formatDateDDMMYYYY, getNombreProfesional } from '@/lib/utils';
import { useHospitalStore } from '@/hooks/useHospitalStore';
interface InternacionesProps {
internaciones: Internacion[];
@@ -45,6 +46,7 @@ export function Internaciones({
onVerHC,
onNuevoIngreso,
}: InternacionesProps) {
const { currentUser } = useHospitalStore();
const [filtroEstado, setFiltroEstado] = useState<'todas' | 'activas' | 'finalizadas'>('todas');
const [dialogoNuevaAbierto, setDialogoNuevaAbierto] = useState(false);
const [dialogoEgresoAbierto, setDialogoEgresoAbierto] = useState(false);
@@ -58,6 +60,8 @@ export function Internaciones({
const [motivoConsulta, setMotivoConsulta] = useState('');
const [antecedentesEnfermedadActual, setAntecedentesEnfermedadActual] = useState('');
const [medicoIngresante, setMedicoIngresante] = useState('');
const defaultMedico = getNombreProfesional(currentUser);
const effectiveMedico = medicoIngresante || defaultMedico;
// Formulario nueva internación
const [fechaEgreso, setFechaEgreso] = useState('');
@@ -71,7 +75,7 @@ export function Internaciones({
setDiagnosticoIngreso('');
setEnfermedadActual('');
setAntecedentesEnfermedadActual('');
setMedicoIngresante('');
setMedicoIngresante(getNombreProfesional(currentUser));
};
const resetFormularioEgreso = () => {
@@ -82,7 +86,7 @@ export function Internaciones({
};
const handleIniciarInternacion = async () => {
if (pacienteSeleccionado && camaSeleccionada && areaSeleccionada && (diagnosticoIngreso || motivoConsulta) && enfermedadActual && medicoIngresante) {
if (pacienteSeleccionado && camaSeleccionada && areaSeleccionada && (diagnosticoIngreso || motivoConsulta) && enfermedadActual && effectiveMedico) {
try {
await onIniciarInternacion({
pacienteId: pacienteSeleccionado,
@@ -92,7 +96,7 @@ export function Internaciones({
motivoConsulta,
enfermedadActual,
antecedentesEnfermedadActual: antecedentesEnfermedadActual || undefined,
medicoIngresante,
medicoIngresante: effectiveMedico,
});
toast.success('Internación iniciada correctamente');
resetFormularioNueva();
@@ -344,7 +348,7 @@ export function Internaciones({
<div>
<Label>Médico Ingresante *</Label>
<Input
value={medicoIngresante}
value={effectiveMedico}
onChange={(e) => setMedicoIngresante(e.target.value)}
placeholder="Nombre del médico ingresante"
/>
@@ -352,7 +356,7 @@ export function Internaciones({
<Button variant="outline"
className="w-full"
onClick={handleIniciarInternacion}
disabled={!pacienteSeleccionado || !camaSeleccionada || !motivoConsulta || !enfermedadActual || !medicoIngresante}
disabled={!pacienteSeleccionado || !camaSeleccionada || !motivoConsulta || !enfermedadActual || !effectiveMedico}
>
<Plus className="h-4 w-4 mr-2" />
Iniciar Internación
@@ -402,104 +406,106 @@ export function Internaciones({
</p>
</div>
) : (
<div className="rounded-md border overflow-x-auto bg-card">
<Table className="w-full min-w-max text-sm">
<TableHeader>
<TableRow>
<TableHead>Cama</TableHead>
<TableHead>Apellido</TableHead>
<TableHead>Nombre</TableHead>
<TableHead className="text-center">Edad</TableHead>
<TableHead className="text-center">DNI</TableHead>
<TableHead className="text-center">Estado</TableHead>
<TableHead className="text-center">Fecha Ingreso</TableHead>
<TableHead className="text-center">Duración</TableHead>
<TableHead className="text-center w-[60px]">Acciones</TableHead>
</TableRow>
</TableHeader>
<TableBody>
{internacionesFiltradas.map((internacion) => {
const paciente = getPacienteById(internacion.pacienteId);
const cama = getCamaById(internacion.camaId);
const fechaIng = internacion.fechaIngresoClinica
? formatDateDDMMYYYY(internacion.fechaIngresoClinica)
: (internacion.fechaIngreso ? formatDateDDMMYYYY(internacion.fechaIngreso) : '-');
<div className="grid grid-cols-1 w-full">
<div className="w-full overflow-x-auto rounded-md border bg-card pb-2">
<Table className="w-full min-w-max text-sm">
<TableHeader>
<TableRow>
<TableHead>Cama</TableHead>
<TableHead>Apellido</TableHead>
<TableHead>Nombre</TableHead>
<TableHead className="text-center">Edad</TableHead>
<TableHead className="text-center">DNI</TableHead>
<TableHead className="text-center">Estado</TableHead>
<TableHead className="text-center">Fecha Ingreso</TableHead>
<TableHead className="text-center">Duración</TableHead>
<TableHead className="text-center w-[60px]">Acciones</TableHead>
</TableRow>
</TableHeader>
<TableBody>
{internacionesFiltradas.map((internacion) => {
const paciente = getPacienteById(internacion.pacienteId);
const cama = getCamaById(internacion.camaId);
const fechaIng = internacion.fechaIngresoClinica
? formatDateDDMMYYYY(internacion.fechaIngresoClinica)
: (internacion.fechaIngreso ? formatDateDDMMYYYY(internacion.fechaIngreso) : '-');
return (
<TableRow key={internacion.id} className="hover:bg-muted/50">
<TableCell className="font-medium text-xs whitespace-nowrap">
{cama ? cama.numero : '-'}
</TableCell>
<TableCell className="text-xs font-medium whitespace-nowrap">
{paciente?.apellido || '-'}
</TableCell>
<TableCell className="text-xs font-medium whitespace-nowrap">
{paciente?.nombre || '-'}
</TableCell>
<TableCell className="text-center text-xs whitespace-nowrap">
{calcularEdad(paciente?.fechaNacimiento)}
</TableCell>
<TableCell className="text-center text-xs whitespace-nowrap font-mono">
{paciente?.dni || '-'}
</TableCell>
<TableCell className="text-center">
{internacion.activa ? (
<Badge className="bg-purple-100 text-purple-800 dark:bg-purple-950/80 dark:text-purple-300 border-purple-200 hover:bg-purple-100">
Activa
</Badge>
) : (
<Badge variant="outline" className="bg-gray-100 text-gray-700 dark:bg-gray-800 dark:text-gray-300 border-gray-300">
Alta
</Badge>
)}
</TableCell>
<TableCell className="text-center text-xs whitespace-nowrap">
{fechaIng}
</TableCell>
<TableCell className="text-center text-xs whitespace-nowrap">
{(() => {
const dias = calcularDiasDuracion(internacion);
if (dias === null) return '-';
const esMenorOIgual10 = dias <= 10;
return (
<Badge
className={
esMenorOIgual10
? 'bg-emerald-100 text-emerald-800 dark:bg-emerald-950/80 dark:text-emerald-300 border-emerald-200 hover:bg-emerald-100'
: 'bg-red-100 text-red-800 dark:bg-red-950/80 dark:text-red-300 border-red-200 hover:bg-red-100'
}
>
{dias} {dias === 1 ? 'día' : 'días'}
return (
<TableRow key={internacion.id} className="hover:bg-muted/50">
<TableCell className="font-medium text-xs whitespace-nowrap">
{cama ? cama.numero : '-'}
</TableCell>
<TableCell className="text-xs font-medium whitespace-nowrap">
{paciente?.apellido || '-'}
</TableCell>
<TableCell className="text-xs font-medium whitespace-nowrap">
{paciente?.nombre || '-'}
</TableCell>
<TableCell className="text-center text-xs whitespace-nowrap">
{calcularEdad(paciente?.fechaNacimiento)}
</TableCell>
<TableCell className="text-center text-xs whitespace-nowrap font-mono">
{paciente?.dni || '-'}
</TableCell>
<TableCell className="text-center">
{internacion.activa ? (
<Badge className="bg-purple-100 text-purple-800 dark:bg-purple-950/80 dark:text-purple-300 border-purple-200 hover:bg-purple-100">
Activa
</Badge>
);
})()}
</TableCell>
<TableCell className="text-center p-1">
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button size="sm" variant="ghost" className="h-8 w-8 p-0">
<MoreHorizontal className="h-4 w-4" />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end">
<DropdownMenuItem onClick={() => { if (typeof onVerHC === 'function') onVerHC(internacion.id); }}>
<FileText className="mr-2 h-4 w-4" />
Ver HC
</DropdownMenuItem>
{internacion.activa && (
<DropdownMenuItem onClick={() => abrirDialogoEgreso(internacion)}>
<LogOut className="mr-2 h-4 w-4" />
Registrar Egreso
) : (
<Badge variant="outline" className="bg-gray-100 text-gray-700 dark:bg-gray-800 dark:text-gray-300 border-gray-300">
Alta
</Badge>
)}
</TableCell>
<TableCell className="text-center text-xs whitespace-nowrap">
{fechaIng}
</TableCell>
<TableCell className="text-center text-xs whitespace-nowrap">
{(() => {
const dias = calcularDiasDuracion(internacion);
if (dias === null) return '-';
const esMenorOIgual10 = dias <= 10;
return (
<Badge
className={
esMenorOIgual10
? 'bg-emerald-100 text-emerald-800 dark:bg-emerald-950/80 dark:text-emerald-300 border-emerald-200 hover:bg-emerald-100'
: 'bg-red-100 text-red-800 dark:bg-red-950/80 dark:text-red-300 border-red-200 hover:bg-red-100'
}
>
{dias} {dias === 1 ? 'día' : 'días'}
</Badge>
);
})()}
</TableCell>
<TableCell className="text-center p-1">
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button size="sm" variant="ghost" className="h-8 w-8 p-0">
<MoreHorizontal className="h-4 w-4" />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end">
<DropdownMenuItem onClick={() => { if (typeof onVerHC === 'function') onVerHC(internacion.id); }}>
<FileText className="mr-2 h-4 w-4" />
Ver HC
</DropdownMenuItem>
)}
</DropdownMenuContent>
</DropdownMenu>
</TableCell>
</TableRow>
);
})}
</TableBody>
</Table>
{internacion.activa && (
<DropdownMenuItem onClick={() => abrirDialogoEgreso(internacion)}>
<LogOut className="mr-2 h-4 w-4" />
Registrar Egreso
</DropdownMenuItem>
)}
</DropdownMenuContent>
</DropdownMenu>
</TableCell>
</TableRow>
);
})}
</TableBody>
</Table>
</div>
</div>
)}
+10 -7
View File
@@ -3,7 +3,8 @@ import { Bed, CheckCircle2, Clock, Wrench, User, Plus, Trash, Edit2, Save, X } f
import { Card, CardContent } from '@/components/ui/card';
import { Badge } from '@/components/ui/badge';
import { Button } from '@/components/ui/button';
import { formatDateDDMMYYYY } from '@/lib/utils';
import { formatDateDDMMYYYY, getNombreProfesional } from '@/lib/utils';
import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogTrigger } from '@/components/ui/dialog';
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
import { Label } from '@/components/ui/label';
@@ -42,7 +43,7 @@ export function MapaCamas({
getPacienteById,
getInternacionById
}: MapaCamasProps) {
const { canEditCama, canAccessArea } = useHospitalStore();
const { canEditCama, canAccessArea, currentUser } = useHospitalStore();
const [filtroSala, setFiltroSala] = useState<string>('todas');
const [filtroTipo, setFiltroTipo] = useState<string>('todos');
const [filtroEstado, setFiltroEstado] = useState<string>('todos');
@@ -53,6 +54,8 @@ export function MapaCamas({
const [enfermedadActual, setEnfermedadActual] = useState('');
const [antecedentesEnfermedadActual, setAntecedentesEnfermedadActual] = useState('');
const [medico, setMedico] = useState('');
const defaultMedico = getNombreProfesional(currentUser);
const effectiveMedico = medico || defaultMedico;
const [dialogoAbierto, setDialogoAbierto] = useState(false);
// Area dialog state
const [areaDialogOpen, setAreaDialogOpen] = useState(false);
@@ -148,7 +151,7 @@ export function MapaCamas({
});
const handleOcuparCama = () => {
if (camaSeleccionada && areaSeleccionada && pacienteSeleccionado && diagnostico && enfermedadActual && medico) {
if (camaSeleccionada && areaSeleccionada && pacienteSeleccionado && diagnostico && enfermedadActual && effectiveMedico) {
onIniciarInternacion({
pacienteId: pacienteSeleccionado,
camaId: camaSeleccionada.id,
@@ -156,7 +159,7 @@ export function MapaCamas({
diagnosticoIngreso: diagnostico,
enfermedadActual,
antecedentesEnfermedadActual: antecedentesEnfermedadActual || undefined,
medicoIngresante: medico,
medicoIngresante: effectiveMedico,
});
setDialogoAbierto(false);
setCamaSeleccionada(null);
@@ -165,7 +168,7 @@ export function MapaCamas({
setDiagnostico('');
setEnfermedadActual('');
setAntecedentesEnfermedadActual('');
setMedico('');
setMedico(getNombreProfesional(currentUser));
}
};
@@ -414,7 +417,7 @@ export function MapaCamas({
<input
type="text"
className="w-full p-2 border rounded-md text-sm"
value={medico}
value={effectiveMedico}
onChange={(e) => setMedico(e.target.value)}
placeholder="Nombre del médico..."
/>
@@ -422,7 +425,7 @@ export function MapaCamas({
<Button variant="outline"
className="w-full"
onClick={handleOcuparCama}
disabled={!pacienteSeleccionado || !diagnostico || !enfermedadActual || !medico}
disabled={!pacienteSeleccionado || !diagnostico || !enfermedadActual || !effectiveMedico}
>
<Plus className="h-4 w-4 mr-1" />
Iniciar Internación
+8 -3
View File
@@ -8,6 +8,8 @@ import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@
import { Badge } from '@/components/ui/badge';
import { toast } from 'sonner';
import type { Paciente, Cama, Area, Internacion } from '@/types';
import { getNombreProfesional } from '@/lib/utils';
import { useHospitalStore } from '@/hooks/useHospitalStore';
interface NuevoIngresoProps {
pacientes: Paciente[];
@@ -22,12 +24,15 @@ interface NuevoIngresoProps {
}
export function NuevoIngreso({ pacientes, camas, areas, onIniciarInternacion, onAgregarCama, onVolver, getAreaName }: NuevoIngresoProps) {
const { currentUser } = useHospitalStore();
const [pacienteSeleccionado, setPacienteSeleccionado] = useState<string>('');
const [busqueda, setBusqueda] = useState('');
const [camaSeleccionada, setCamaSeleccionada] = useState('');
const [camaInput, setCamaInput] = useState('');
const [modoCama, setModoCama] = useState<'seleccionar' | 'escribir'>('seleccionar');
const [medico, setMedico] = useState('');
const defaultMedico = getNombreProfesional(currentUser);
const effectiveMedico = medico || defaultMedico;
const [fechaIngresoHospital, setFechaIngresoHospital] = useState('');
const [fechaIngresoClinica, setFechaIngresoClinica] = useState('');
const [motivoConsulta, setMotivoConsulta] = useState('');
@@ -131,7 +136,7 @@ export function NuevoIngreso({ pacientes, camas, areas, onIniciarInternacion, on
return;
}
if (!medico.trim()) {
if (!effectiveMedico.trim()) {
toast.error('Debe ingresar el nombre del Médico Ingresante');
return;
}
@@ -176,7 +181,7 @@ export function NuevoIngreso({ pacientes, camas, areas, onIniciarInternacion, on
pacienteId: pacienteSeleccionado,
camaId: camaId,
areaId: newAreaId,
medicoIngresante: medico.trim(),
medicoIngresante: effectiveMedico.trim(),
diagnosticoIngreso: diagnosticoIngreso.trim(),
motivoConsulta: motivoConsulta.trim() || undefined,
enfermedadActual: enfermedadActual.trim(),
@@ -463,7 +468,7 @@ export function NuevoIngreso({ pacientes, camas, areas, onIniciarInternacion, on
<Label>Médico Ingresante *</Label>
<Input
placeholder="Nombre del médico"
value={medico}
value={effectiveMedico}
onChange={(e) => setMedico(e.target.value)}
/>
</div>
+17 -11
View File
@@ -10,6 +10,8 @@ import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table';
import { Plus, Pencil, Trash2, X } from 'lucide-react';
import type { Indicacion, IndicacionTipo, ViaAdministracion, TipoPlanHidratacion, TipoInsulina, ATB } from '@/types';
import { useHospitalStore } from '@/hooks/useHospitalStore';
import { getNombreProfesional } from '@/lib/utils';
export function SeccionIndicaciones({ recomendaciones, internacionId, pacienteId, add, update, del, movimientos, onAgregarMovimiento, canEdit, atbList = [], addATB, updateATB }: {
recomendaciones: Indicacion[];
@@ -25,12 +27,15 @@ export function SeccionIndicaciones({ recomendaciones, internacionId, pacienteId
addATB?: (a: Omit<ATB, 'id'>) => Promise<unknown>;
updateATB?: (id: string, datos: Partial<ATB>) => void;
}) {
const { currentUser } = useHospitalStore();
const list: Indicacion[] = Array.isArray(recomendaciones) ? recomendaciones : [];
const movs = Array.isArray(movimientos) ? movimientos : [];
const [dialog, setDialog] = useState(false);
const [edit, setEdit] = useState<Indicacion | null>(null);
const [deleteConfirmInd, setDeleteConfirmInd] = useState<Indicacion | null>(null);
const [deleteMedico, setDeleteMedico] = useState<string>('');
const defaultMedico = getNombreProfesional(currentUser);
const [deleteMedico, setDeleteMedico] = useState('');
const effectiveDeleteMedico = deleteMedico || defaultMedico;
const formatIndicacion = (i: Indicacion): string => {
if (i.tipo === 'Farmacologica' || i.tipo === 'Farmacologica Profilactica' || i.tipo === 'Farmacologica Antibiótico') return `${i.droga || ''} ${i.dosis || ''} ${i.frecuenciaHoras ? `c/${i.frecuenciaHoras}hs` : ''} ${i.via || ''}`.trim();
@@ -80,6 +85,7 @@ export function SeccionIndicaciones({ recomendaciones, internacionId, pacienteId
const [unidadesAlmuerzo, setUnidadesAlmuerzo] = useState<number | ''>('');
const [unidadesNoche, setUnidadesNoche] = useState<number | ''>('');
const [medico, setMedico] = useState('');
const effectiveMedico = medico || defaultMedico;
const [showHistorial, setShowHistorial] = useState(false);
const vias: ViaAdministracion[] = ['Via Oral', 'EV', 'IM', 'SC', 'Por GGT', 'Por SNG'];
@@ -104,7 +110,7 @@ export function SeccionIndicaciones({ recomendaciones, internacionId, pacienteId
setUnidadesDesayuno('');
setUnidadesAlmuerzo('');
setUnidadesNoche('');
setMedico('');
setMedico(getNombreProfesional(currentUser));
};
const loadEdit = (i: Indicacion) => {
@@ -129,7 +135,7 @@ export function SeccionIndicaciones({ recomendaciones, internacionId, pacienteId
};
const handleGuardar = async () => {
if (!medico.trim()) return;
if (!effectiveMedico.trim()) return;
if ((tipo === 'Farmacologica' || tipo === 'Farmacologica Profilactica' || tipo === 'Farmacologica Antibiótico') && (!droga.trim() || !dosis.trim())) return;
if (tipo === 'Farmacologica Insulina' && (!unidadesDesayuno && !unidadesAlmuerzo && !unidadesNoche)) return;
if (tipo === 'No Farmacologica' && !indicacionNoFco.trim()) return;
@@ -140,7 +146,7 @@ export function SeccionIndicaciones({ recomendaciones, internacionId, pacienteId
internacionId,
tipo,
estado: 'Activa',
medicoCrea: medico,
medicoCrea: effectiveMedico,
fechaCrea: new Date().toISOString().split('T')[0],
};
@@ -177,7 +183,7 @@ export function SeccionIndicaciones({ recomendaciones, internacionId, pacienteId
internacionId,
tipo: 'Modificacion',
fecha,
profesional: medico,
profesional: effectiveMedico,
indicacionPrevia: formatIndicacion(edit),
indicacionNueva: formatIndicacion({ ...edit, ...data } as Indicacion),
});
@@ -203,7 +209,7 @@ export function SeccionIndicaciones({ recomendaciones, internacionId, pacienteId
internacionId,
tipo: 'Nueva',
fecha,
profesional: medico,
profesional: effectiveMedico,
indicacionNueva: formatIndicacion({ ...data, id: newId } as Indicacion),
});
}
@@ -283,7 +289,7 @@ export function SeccionIndicaciones({ recomendaciones, internacionId, pacienteId
<div>
<Label>Médico *</Label>
<Input value={medico} onChange={e => setMedico(e.target.value)} placeholder="Nombre del médico" />
<Input value={effectiveMedico} onChange={e => setMedico(e.target.value)} placeholder="Nombre del médico" />
</div>
{(tipo === 'Farmacologica' || tipo === 'Farmacologica Antibiótico') && (
@@ -356,7 +362,7 @@ export function SeccionIndicaciones({ recomendaciones, internacionId, pacienteId
</div>
<div className="flex justify-end gap-2 mt-4">
<Button variant="outline" onClick={() => setDialog(false)}><X className="h-4 w-4 mr-2" />Cancelar</Button>
<Button onClick={handleGuardar} disabled={!medico.trim()}>Guardar</Button>
<Button onClick={handleGuardar} disabled={!effectiveMedico.trim()}>Guardar</Button>
</div>
</DialogContent>
</Dialog>
@@ -405,7 +411,7 @@ export function SeccionIndicaciones({ recomendaciones, internacionId, pacienteId
</Button>}
{canEdit && <Button size="sm" variant="outline" className="h-7 w-7 p-0 text-red-600 hover:text-red-700 hover:bg-red-50 dark:hover:bg-red-950/30" title="Eliminar" onClick={() => {
setDeleteConfirmInd(ind);
setDeleteMedico(ind.medicoCrea || '');
setDeleteMedico(getNombreProfesional(currentUser));
}}>
<Trash2 className="h-3.5 w-3.5" />
</Button>}
@@ -437,7 +443,7 @@ export function SeccionIndicaciones({ recomendaciones, internacionId, pacienteId
<Label htmlFor="delete-medico">Médico que suspende / elimina *</Label>
<Input
id="delete-medico"
value={deleteMedico}
value={effectiveDeleteMedico}
onChange={(e) => setDeleteMedico(e.target.value)}
placeholder="Nombre del profesional..."
/>
@@ -450,7 +456,7 @@ export function SeccionIndicaciones({ recomendaciones, internacionId, pacienteId
<Button
variant="destructive"
onClick={async () => {
const med = deleteMedico.trim() || deleteConfirmInd.medicoCrea || 'Médico';
const med = effectiveDeleteMedico.trim() || deleteConfirmInd.medicoCrea || 'Médico';
const indToDel = deleteConfirmInd;
setDeleteConfirmInd(null);
await handleSuspender(indToDel, med);