Fix: HistoriaClinica responsive - tablist full width, lab table scroll-only-self
This commit is contained in:
@@ -465,44 +465,39 @@ export function HistoriaClinica({
|
|||||||
</CardContent>
|
</CardContent>
|
||||||
</Card>
|
</Card>
|
||||||
|
|
||||||
<Tabs className="w-full p-4" value={tabActivo} onValueChange={setTabActivo}>
|
<Tabs className="w-full p-4" value={tabActivo} onValueChange={setTabActivo}>
|
||||||
<ScrollArea className="w-full whitespace-nowrap rounded-md">
|
<ScrollArea className="w-full whitespace-nowrap rounded-md">
|
||||||
<TabsList>
|
<TabsList className="flex gap-1 flex-wrap">
|
||||||
<TabsTrigger value="evoluciones" className="flex-shrink-0 flex items-center gap-1 text-xs sm:text-sm whitespace-nowrap">
|
<TabsTrigger value="evoluciones" className="flex-shrink flex items-center gap-1 text-xs sm:text-sm">
|
||||||
<FileText className="h-3 w-3 sm:h-4 sm:w-4" />
|
<FileText className="h-3 w-3 sm:h-4 sm:w-4" />
|
||||||
<span className="hidden sm:inline">Evoluciones</span>
|
<span className="hidden sm:inline">Evoluciones</span>
|
||||||
({evoluciones.length})
|
({evoluciones.length})
|
||||||
</TabsTrigger>
|
</TabsTrigger>
|
||||||
<TabsTrigger value="laboratorios" className="flex-shrink-0 flex items-center gap-1 text-xs sm:text-sm">
|
<TabsTrigger value="laboratorios" className="flex-shrink flex items-center gap-1 text-xs sm:text-sm">
|
||||||
<FlaskConical className="h-3 w-3 sm:h-4 sm:w-4" />
|
<FlaskConical className="h-3 w-3 sm:h-4 sm:w-4" />
|
||||||
<span className="hidden sm:inline">Laboratorio</span>
|
<span className="hidden sm:inline">Laboratorio</span>
|
||||||
|
|
||||||
({laboratorios.length})
|
({laboratorios.length})
|
||||||
</TabsTrigger>
|
</TabsTrigger>
|
||||||
<TabsTrigger value="acidobase" className="flex-shrink-0 flex items-center gap-1 text-xs sm:text-sm">
|
<TabsTrigger value="acidobase" className="flex-shrink flex items-center gap-1 text-xs sm:text-sm">
|
||||||
<Activity className="h-3 w-3 sm:h-4 sm:w-4" />
|
<Activity className="h-3 w-3 sm:h-4 sm:w-4" />
|
||||||
<span className="hidden sm:inline">EAB</span>
|
<span className="hidden sm:inline">EAB</span>
|
||||||
|
|
||||||
({acidosBase.length})
|
({acidosBase.length})
|
||||||
</TabsTrigger>
|
</TabsTrigger>
|
||||||
<TabsTrigger value="cultivos" className="flex-shrink-0 flex items-center gap-1 text-xs sm:text-sm">
|
<TabsTrigger value="cultivos" className="flex-shrink flex items-center gap-1 text-xs sm:text-sm">
|
||||||
<Microscope className="h-3 w-3 sm:h-4 sm:w-4" />
|
<Microscope className="h-3 w-3 sm:h-4 sm:w-4" />
|
||||||
<span className="hidden sm:inline">Cultivos</span>
|
<span className="hidden sm:inline">Cultivos</span>
|
||||||
|
|
||||||
({cultivos.length})
|
({cultivos.length})
|
||||||
</TabsTrigger>
|
</TabsTrigger>
|
||||||
<TabsTrigger value="atb" className="flex-shrink-0 flex items-center gap-1 text-xs sm:text-sm">
|
<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" />
|
<Pill className="h-3 w-3 sm:h-4 sm:w-4" />
|
||||||
<span className="hidden sm:inline">ATB</span>
|
<span className="hidden sm:inline">ATB</span>
|
||||||
|
|
||||||
</TabsTrigger>
|
</TabsTrigger>
|
||||||
<TabsTrigger value="estudios" className="flex-shrink-0 flex items-center gap-1 text-xs sm:text-sm">
|
<TabsTrigger value="estudios" className="flex-shrink flex items-center gap-1 text-xs sm:text-sm">
|
||||||
<ClipboardList className="h-3 w-3 sm:h-4 sm:w-4" />
|
<ClipboardList className="h-3 w-3 sm:h-4 sm:w-4" />
|
||||||
<span className="hidden sm:inline">Estudios</span>
|
<span className="hidden sm:inline">Estudios</span>
|
||||||
|
|
||||||
({estudiosComplementarios.length})
|
({estudiosComplementarios.length})
|
||||||
</TabsTrigger>
|
</TabsTrigger>
|
||||||
<TabsTrigger value="interconsultas" className="flex-shrink-0 flex items-center gap-1 text-xs sm:text-sm">
|
<TabsTrigger value="interconsultas" className="flex-shrink flex items-center gap-1 text-xs sm:text-sm">
|
||||||
<Users className="h-3 w-3 sm:h-4 sm:w-4" />
|
<Users className="h-3 w-3 sm:h-4 sm:w-4" />
|
||||||
<span className="hidden sm:inline">Interconsultas</span>
|
<span className="hidden sm:inline">Interconsultas</span>
|
||||||
({interconsultas.length})
|
({interconsultas.length})
|
||||||
@@ -1155,12 +1150,12 @@ function SeccionLaboratorios({ lab, patientId, add, update, del, addAcidoBase }:
|
|||||||
</DialogContent>
|
</DialogContent>
|
||||||
</Dialog>
|
</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="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 w-full overflow-auto grid grid-cols-1">
|
<div className="relative overflow-x-auto">
|
||||||
|
|
||||||
<Table>
|
<Table className="w-full min-w-[600px]">
|
||||||
<TableHeader>
|
<TableHeader>
|
||||||
<TableRow>
|
<TableRow>
|
||||||
<TableHead className="cursor-pointer hover:bg-muted" onClick={() => setLabSortAsc(!labSortAsc)}>
|
<TableHead className="cursor-pointer hover:bg-muted" onClick={() => setLabSortAsc(!labSortAsc)}>
|
||||||
|
|||||||
Reference in New Issue
Block a user