From 88bfefc7825bf447e2abf25c33bbf212803a1f9f Mon Sep 17 00:00:00 2001
From: Sergio Nicolas Lavaise <snlavaise@gmail.com>
Date: Mon, 13 Apr 2026 20:39:29 -0300
Subject: [PATCH] =?UTF-8?q?Fix:=20PDF=20generado=20din=C3=A1micamente=20co?=
 =?UTF-8?q?n=20dise=C3=B1o=20congruente=20a=20la=20app?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 MODELO_INGRESO.pdf               | Bin 5512 -> 1912 bytes
 src/sections/HistoriaClinica.tsx | 135 ++++++++++++++++++++++++++-----
 2 files changed, 115 insertions(+), 20 deletions(-)

diff --git a/MODELO_INGRESO.pdf b/MODELO_INGRESO.pdf
index 5bd3402c6381d4734672ec9c65cf2e3928bf7603..f71baa5bf0f6af692a763e741e58ad60e266ca4a 100644
GIT binary patch
delta 1731
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
Ztpg8mB?JPKVHF(;F*h(X3MC~)PezTMPg?*0

literal 5512
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

diff --git a/src/sections/HistoriaClinica.tsx b/src/sections/HistoriaClinica.tsx
index 1b1a125..f3e5449 100644
--- a/src/sections/HistoriaClinica.tsx
+++ b/src/sections/HistoriaClinica.tsx
@@ -112,6 +112,25 @@ function calcularEstadoLaboratorio(parametro: string, valor: string): 'Normal' |
   return 'Normal';
 }
 
+function wrapText(text: string, font: any, fontSize: number, maxWidth: number): string[] {
+  const words = text.split(' ');
+  const lines: string[] = [];
+  let currentLine = '';
+  
+  for (const word of words) {
+    const testLine = currentLine ? `${currentLine} ${word}` : word;
+    const testWidth = font.widthOfTextAtSize(testLine, fontSize);
+    if (testWidth > maxWidth && currentLine) {
+      lines.push(currentLine);
+      currentLine = word;
+    } else {
+      currentLine = testLine;
+    }
+  }
+  if (currentLine) lines.push(currentLine);
+  return lines;
+}
+
 export function HistoriaClinica({
   internacion,
   paciente,
@@ -311,28 +330,104 @@ export function HistoriaClinica({
               <Button variant="outline" className="bg-blue-50 border-blue-300 text-blue-700 hover:bg-blue-100" onClick={async (e) => {
                 e.stopPropagation();
                 try {
-                  const existingPdfBytes = await fetch('/MODELO_INGRESO.pdf').then(res => res.arrayBuffer());
-                  const pdfDoc = await PDFDocument.load(existingPdfBytes);
-                  const form = pdfDoc.getForm();
+                  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 fields = [
-                    { name: 'cama', value: String(cama?.numero || '') },
-                    { name: 'apellido', value: String(paciente.apellido || '') },
-                    { name: 'nombre', value: String(paciente.nombre || '') },
-                    { name: 'edad', value: String(edad) },
-                    { name: 'dni', value: String(paciente.dni || '') },
-                    { name: 'fechaIngreso', value: String(internacion.fechaIngreso || '') },
-                    { name: 'motivoConsulta', value: String(internacion.motivoConsulta || '') },
-                    { name: 'enfermedadActual', value: String(internacion.enfermedadActual || '') },
-                    { name: 'antecedentes', value: String(internacion.antecedentesEnfermedadActual || '') },
-                    { name: 'diagnostico', value: String(internacion.diagnosticoIngreso || '') },
-                  ];
-                  for (const field of fields) {
-                    try {
-                      const formField = form.getTextField(field.name);
-                      if (formField) formField.setText(field.value);
-                    } catch (e) { }
+                  const fechaFormateada = formatDateDDMMYYYY(internacion.fechaIngreso);
+
+                  // Header
+                  page.drawRectangle({ x: 0, y: height - 80, width, height: 80, color: colorPrimary });
+                  page.drawText('FORMULARIO DE INGRESO', { x: 180, y: height - 45, size: 20, font: fontBold, color: rgb(1, 1, 1) });
+                  page.drawText('Historia Clínica Electrónica - Servicio de Clínica Médica', { x: 110, y: height - 65, size: 10, font, color: rgb(0.85, 0.85, 0.85) });
+                  page.drawText('Hospital Santojanni', { x: 50, y: height - 90, size: 9, font, color: colorGray });
+
+                  let y = height - 125;
+
+                  // Datos del Paciente
+                  page.drawRectangle({ x: 45, y: y - 8, width: 505, height: 24, color: colorLightGray });
+                  page.drawText('DATOS DEL PACIENTE', { x: 50, y: y, size: 12, font: fontBold, color: colorPrimary });
+                  y -= 35;
+
+                  page.drawText('Cama:', { x: 50, y, size: 10, font: fontBold, color: colorGray });
+                  page.drawText(cama?.numero || 'N/A', { x: 120, y, size: 10, font, color: colorText });
+                  page.drawText('Fecha de Ingreso:', { x: 280, y, size: 10, font: fontBold, color: colorGray });
+                  page.drawText(fechaFormateada, { x: 390, y, size: 10, font, color: colorText });
+                  y -= 25;
+
+                  page.drawText('Apellido:', { x: 50, y, size: 10, font: fontBold, color: colorGray });
+                  page.drawText(paciente.apellido || '', { x: 120, y, size: 10, font, color: colorText });
+                  page.drawText('Nombre:', { x: 280, y, size: 10, font: fontBold, color: colorGray });
+                  page.drawText(paciente.nombre || '', { x: 350, y, size: 10, font, color: colorText });
+                  y -= 25;
+
+                  page.drawText('DNI:', { x: 50, y, size: 10, font: fontBold, color: colorGray });
+                  page.drawText(paciente.dni || '', { x: 120, y, size: 10, font, color: colorText });
+                  page.drawText('Edad:', { x: 280, y, size: 10, font: fontBold, color: colorGray });
+                  page.drawText(edad ? `${edad} años` : '', { x: 330, y, size: 10, font, color: colorText });
+                  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('v1.0.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);