style(HistoriaClinica): Agrupar tabs en menu select unificado y mostrar botones de accion en linea

2026-08-12 20:39:17 +00:00
parent 369112d384
commit fce539abc2
14 changed files with 747 additions and 110 deletions
@@ -0,0 +1,39 @@
+const fs = require('fs');
+let code = fs.readFileSync('src/sections/HistoriaClinica.tsx', 'utf8');
+
+code = code.replace("import { useState } from 'react';", "import { useState } from 'react';\nimport { createPortal } from 'react-dom';");
+
+const portalState = "const [tabActivo, setTabActivo] = useState('evoluciones');\n  const [portalNode, setPortalNode] = useState<HTMLDivElement | null>(null);";
+code = code.replace("const [tabActivo, setTabActivo] = useState('evoluciones');", portalState);
+
+const tabsListRegex = /<ScrollArea className="w-full rounded-md border bg-background whitespace-nowrap">([\s\S]*?)<\/ScrollArea>/;
+const newTabsList = `
+            <div className="flex flex-col sm:flex-row sm:items-center gap-4 mb-4">
+              <Select value={tabActivo} onValueChange={setTabActivo}>
+                <SelectTrigger className="w-full sm:w-[280px] font-semibold bg-gray-50 border-gray-300">
+                  <SelectValue placeholder="Menú de Secciones" />
+                </SelectTrigger>
+                <SelectContent>
+                  <SelectGroup>
+                    <SelectLabel>Menú</SelectLabel>
+                    <SelectItem value="evoluciones">Evoluciones ({evoluciones.length})</SelectItem>
+                    <SelectItem value="indicaciones">Indicaciones ({indicacionesActivas.length})</SelectItem>
+                    <SelectItem value="glucemias">Glucemias ({glucemias.length})</SelectItem>
+                    <SelectItem value="laboratorios">Laboratorio ({laboratorios.length})</SelectItem>
+                    <SelectItem value="acidobase">EAB ({acidosBase.length})</SelectItem>
+                    <SelectItem value="cultivos">Cultivos ({cultivos.length})</SelectItem>
+                    <SelectItem value="atb">ATB ({atb.length})</SelectItem>
+                    <SelectItem value="estudios">Estudios ({estudiosComplementarios.length})</SelectItem>
+                    <SelectItem value="interconsultas">Interconsultas ({interconsultas.length})</SelectItem>
+                    <SelectItem value="pendientes">Pendientes ({pendientesActivos.length})</SelectItem>
+                  </SelectGroup>
+                </SelectContent>
+              </Select>
+              
+              <div ref={setPortalNode} id="menu-actions" className="flex flex-1 items-center gap-2 overflow-x-auto min-h-[40px]"></div>
+            </div>
+`.trim();
+
+code = code.replace(tabsListRegex, newTabsList);
+
+fs.writeFileSync('src/sections/HistoriaClinica.tsx', code);