|
<!DOCTYPE html> |
|
<html lang="es" class="dark"> |
|
<head> |
|
<meta charset="UTF-8"> |
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
<title>AutomedicalAI | Advanced Medical Reports</title> |
|
|
|
|
|
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/tailwind.min.css" rel="stylesheet"> |
|
<link href="https://cdn.jsdelivr.net/npm/@tailwindcss/[email protected]/dist/typography.min.css" rel="stylesheet"> |
|
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/full.css" rel="stylesheet"> |
|
<link href="https://unpkg.com/[email protected]/dist/aos.css" rel="stylesheet"> |
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"> |
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css"> |
|
|
|
<style> |
|
:root { |
|
--primary-gradient: linear-gradient(135deg, #2563eb, #7c3aed); |
|
--surface-gradient: linear-gradient(135deg, #1e293b, #0f172a); |
|
--accent-gradient: linear-gradient(135deg, #3b82f6, #8b5cf6); |
|
--glass-bg: rgba(30, 41, 59, 0.7); |
|
} |
|
|
|
body { |
|
background: linear-gradient(135deg, #0f172a, #1e293b); |
|
background-attachment: fixed; |
|
min-height: 100vh; |
|
} |
|
|
|
|
|
.glass-panel { |
|
@apply backdrop-blur-xl bg-white/5 border border-white/10 |
|
shadow-2xl rounded-3xl transition-all duration-500; |
|
} |
|
|
|
.glass-panel:hover { |
|
@apply border-white/20 shadow-blue-500/10; |
|
backdrop-filter: blur(20px); |
|
} |
|
|
|
|
|
.ai-particles { |
|
position: fixed; |
|
inset: 0; |
|
z-index: -1; |
|
opacity: 0.4; |
|
pointer-events: none; |
|
background-image: |
|
radial-gradient(circle at 20% 30%, rgba(59, 130, 246, 0.1) 0%, transparent 50%), |
|
radial-gradient(circle at 80% 70%, rgba(124, 58, 237, 0.1) 0%, transparent 50%); |
|
} |
|
|
|
.neural-grid { |
|
background-image: |
|
linear-gradient(rgba(59, 130, 246, 0.1) 1px, transparent 1px), |
|
linear-gradient(90deg, rgba(59, 130, 246, 0.1) 1px, transparent 1px); |
|
background-size: 30px 30px; |
|
position: fixed; |
|
inset: 0; |
|
z-index: -1; |
|
opacity: 0.2; |
|
pointer-events: none; |
|
} |
|
|
|
|
|
.ai-input { |
|
@apply w-full px-6 py-4 bg-white/5 border border-white/10 |
|
rounded-2xl text-white placeholder-white/50 |
|
focus:ring-2 focus:ring-blue-500/50 focus:border-transparent |
|
transition-all duration-300; |
|
backdrop-filter: blur(10px); |
|
} |
|
|
|
.ai-input:hover { |
|
@apply border-white/20 bg-white/10; |
|
} |
|
|
|
|
|
.ai-button { |
|
@apply relative overflow-hidden px-8 py-4 rounded-2xl |
|
text-white font-medium transition-all duration-500 |
|
flex items-center gap-3 group; |
|
background: var(--primary-gradient); |
|
} |
|
|
|
.ai-button::before { |
|
content: ''; |
|
@apply absolute inset-0 opacity-0 transition-opacity duration-500; |
|
background: var(--accent-gradient); |
|
} |
|
|
|
.ai-button:hover::before { |
|
@apply opacity-100; |
|
} |
|
|
|
|
|
.ai-card { |
|
@apply relative p-6 rounded-3xl transition-all duration-500 |
|
hover:transform hover:scale-102 cursor-pointer; |
|
background: var(--glass-bg); |
|
backdrop-filter: blur(10px); |
|
} |
|
|
|
.ai-card::before { |
|
content: ''; |
|
@apply absolute inset-0 rounded-3xl opacity-0 transition-opacity duration-500; |
|
background: var(--accent-gradient); |
|
z-index: -1; |
|
} |
|
|
|
.ai-card:hover::before { |
|
@apply opacity-20; |
|
} |
|
|
|
|
|
.ai-stat { |
|
@apply flex flex-col items-center p-4 rounded-2xl bg-white/5 |
|
backdrop-blur-lg border border-white/10; |
|
} |
|
|
|
.ai-stat-value { |
|
@apply text-3xl font-bold bg-clip-text text-transparent; |
|
background: var(--primary-gradient); |
|
} |
|
|
|
|
|
.analysis-grid { |
|
@apply grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6; |
|
} |
|
|
|
.analysis-card { |
|
@apply p-6 rounded-3xl transition-all duration-500; |
|
background: var(--glass-bg); |
|
} |
|
|
|
|
|
.ai-chart { |
|
@apply rounded-2xl overflow-hidden bg-white/5 p-4; |
|
height: 200px; |
|
} |
|
|
|
|
|
.report-comparison { |
|
@apply grid grid-cols-2 gap-4 p-4 rounded-2xl bg-white/5; |
|
} |
|
|
|
.comparison-item { |
|
@apply p-4 rounded-xl bg-white/5 border border-white/10; |
|
} |
|
|
|
|
|
.cost-analysis { |
|
@apply grid grid-cols-1 md:grid-cols-3 gap-4 mb-8; |
|
} |
|
|
|
.cost-card { |
|
@apply p-6 rounded-2xl bg-white/5 border border-white/10; |
|
} |
|
|
|
.cost-trend { |
|
@apply flex items-center gap-2 text-sm; |
|
} |
|
|
|
.trend-up { @apply text-green-400; } |
|
.trend-down { @apply text-red-400; } |
|
</style> |
|
</head> |
|
<body class="min-h-screen bg-gradient-to-br from-gray-900 to-black text-white" data-language="es"> |
|
|
|
<nav class="sticky top-0 z-50 backdrop-blur-lg border-b border-white/10 px-6 py-4"> |
|
<div class="container mx-auto flex justify-between items-center"> |
|
<div class="flex items-center gap-2"> |
|
<img src="https://ern-euro-nmd.eu/wp-content/uploads/2024/02/logo_12-de-octubre.jpeg" |
|
alt="Hospital Logo" class="h-8 w-auto"> |
|
<h1 class="text-2xl font-bold bg-gradient-to-r from-blue-400 to-purple-500 bg-clip-text text-transparent"> |
|
AutomedicalAI |
|
</h1> |
|
</div> |
|
<button onclick="toggleLanguage()" |
|
class="px-4 py-2 rounded-full border border-blue-500 text-blue-400 |
|
hover:bg-blue-500 hover:text-white transition-all duration-300"> |
|
<span lang="es">EN</span> |
|
<span lang="en">ES</span> |
|
</button> |
|
</div> |
|
</nav> |
|
|
|
<main class="container mx-auto px-4 py-8"> |
|
|
|
<div class="grid grid-cols-1 md:grid-cols-4 gap-6 mb-8"> |
|
<div class="ai-stat"> |
|
<span class="ai-stat-value">2,847</span> |
|
<span class="text-sm text-white/70">Informes Generados</span> |
|
</div> |
|
<div class="ai-stat"> |
|
<span class="ai-stat-value">94%</span> |
|
<span class="text-sm text-white/70">Precisión IA</span> |
|
</div> |
|
<div class="ai-stat"> |
|
<span class="ai-stat-value">-32%</span> |
|
<span class="text-sm text-white/70">Reducción de Costes</span> |
|
</div> |
|
<div class="ai-stat"> |
|
<span class="ai-stat-value">+45%</span> |
|
<span class="text-sm text-white/70">Eficiencia</span> |
|
</div> |
|
</div> |
|
|
|
|
|
<div class="glass-panel p-8 mb-12"> |
|
<h2 class="section-title"> |
|
<span lang="es">Información del Paciente</span> |
|
<span lang="en">Patient Information</span> |
|
</h2> |
|
<form id="patientForm" class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6"> |
|
<div class="space-y-2"> |
|
<label class="text-sm text-gray-300"> |
|
<span lang="es">Nombre del Paciente</span> |
|
<span lang="en">Patient Name</span> |
|
</label> |
|
<input type="text" id="patientName" class="ai-input" required> |
|
</div> |
|
|
|
<div class="space-y-2"> |
|
<label class="text-sm text-gray-300"> |
|
<span lang="es">Edad</span> |
|
<span lang="en">Age</span> |
|
</label> |
|
<input type="number" id="patientAge" class="ai-input" required> |
|
</div> |
|
|
|
<div class="space-y-2"> |
|
<label class="text-sm text-gray-300"> |
|
<span lang="es">Diagnóstico</span> |
|
<span lang="en">Diagnosis</span> |
|
</label> |
|
<select id="diagnosis" class="ai-input" required> |
|
<option value="" disabled selected> |
|
<span lang="es">Seleccionar Diagnóstico</span> |
|
<span lang="en">Select Diagnosis</span> |
|
</option> |
|
<option value="glaucoma">Glaucoma</option> |
|
<option value="diabetic_retinopathy"> |
|
<span lang="es">Retinopatía Diabética</span> |
|
<span lang="en">Diabetic Retinopathy</span> |
|
</option> |
|
<option value="amd"> |
|
<span lang="es">DMAE</span> |
|
<span lang="en">AMD</span> |
|
</option> |
|
</select> |
|
</div> |
|
|
|
<div class="col-span-full"> |
|
<button type="submit" class="ai-button group"> |
|
<i class="fas fa-file-medical text-xl group-hover:scale-110 transition-transform"></i> |
|
<span class="inline-block ml-2"> |
|
<span lang="es">Generar Informe</span> |
|
<span lang="en">Generate Report</span> |
|
</span> |
|
<div class="absolute inset-0 bg-gradient-to-r from-blue-600/20 to-purple-600/20 |
|
group-hover:opacity-100 opacity-0 transition-opacity"></div> |
|
</button> |
|
</div> |
|
</form> |
|
</div> |
|
|
|
|
|
<div class="analysis-grid mb-12"> |
|
<div class="analysis-card"> |
|
<h3 class="text-xl font-semibold mb-4">Análisis Histórico</h3> |
|
<div class="ai-chart"> |
|
|
|
</div> |
|
</div> |
|
|
|
<div class="analysis-card"> |
|
<h3 class="text-xl font-semibold mb-4">Comparativa de Costes</h3> |
|
<div class="cost-analysis"> |
|
<div class="cost-card"> |
|
<h4 class="text-lg mb-2">Antes de IA</h4> |
|
<p class="text-2xl font-bold">€245.00</p> |
|
<div class="cost-trend"> |
|
<i class="fas fa-arrow-down text-red-400"></i> |
|
<span>Por informe</span> |
|
</div> |
|
</div> |
|
<div class="cost-card"> |
|
<h4 class="text-lg mb-2">Con IA</h4> |
|
<p class="text-2xl font-bold">€82.00</p> |
|
<div class="cost-trend"> |
|
<i class="fas fa-arrow-up text-green-400"></i> |
|
<span>Ahorro 67%</span> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
|
|
<div class="analysis-card"> |
|
<h3 class="text-xl font-semibold mb-4">Eficiencia Temporal</h3> |
|
<div class="ai-chart"> |
|
|
|
</div> |
|
</div> |
|
</div> |
|
|
|
|
|
<div class="glass-panel p-8 mb-12"> |
|
<h3 class="text-2xl font-semibold mb-6">Comparativa de Informes</h3> |
|
<div class="report-comparison"> |
|
<div class="comparison-item"> |
|
<h4 class="text-lg mb-2">Informe Anterior</h4> |
|
|
|
</div> |
|
<div class="comparison-item"> |
|
<h4 class="text-lg mb-2">Informe Actual</h4> |
|
|
|
</div> |
|
</div> |
|
</div> |
|
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6"> |
|
<button class="ai-card" onclick="showReport('glaucomaReport')"> |
|
<div class="flex flex-col items-center"> |
|
<i class="fas fa-eye text-blue-400"></i> |
|
<span lang="es">Informe de Glaucoma</span> |
|
<span lang="en">Glaucoma Report</span> |
|
</div> |
|
</button> |
|
|
|
<button class="ai-card" onclick="showReport('diabeticRetinopathyReport')"> |
|
<div class="flex flex-col items-center"> |
|
<i class="fas fa-syringe text-green-400"></i> |
|
<span lang="es">Retinopatía Diabética</span> |
|
<span lang="en">Diabetic Retinopathy</span> |
|
</div> |
|
</button> |
|
|
|
<button class="ai-card" onclick="showReport('amdReport')"> |
|
<div class="flex flex-col items-center"> |
|
<i class="fas fa-eye-slash text-yellow-400"></i> |
|
<span lang="es">Informe de DMAE</span> |
|
<span lang="en">AMD Report</span> |
|
</div> |
|
</button> |
|
|
|
<button class="ai-card" onclick="showReport('treatmentPlan')"> |
|
<div class="flex flex-col items-center"> |
|
<i class="fas fa-notes-medical text-cyan-400"></i> |
|
<span lang="es">Plan de Tratamiento</span> |
|
<span lang="en">Treatment Plan</span> |
|
</div> |
|
</button> |
|
|
|
<button class="ai-card" onclick="showReport('followUpReport')"> |
|
<div class="flex flex-col items-center"> |
|
<i class="fas fa-calendar-check text-red-400"></i> |
|
<span lang="es">Informe de Seguimiento</span> |
|
<span lang="en">Follow-up Report</span> |
|
</div> |
|
</button> |
|
|
|
<button class="ai-card" onclick="showReport('generalSummaryReport')"> |
|
<div class="flex flex-col items-center"> |
|
<i class="fas fa-file-medical-alt text-purple-400"></i> |
|
<span lang="es">Resumen General</span> |
|
<span lang="en">General Summary</span> |
|
</div> |
|
</button> |
|
</div> |
|
</main> |
|
|
|
|
|
<div class="report-viewer fixed inset-0 hidden" id="reportViewer"> |
|
<div class="absolute inset-0 flex items-center justify-center p-8"> |
|
<div class="report-content w-full max-w-4xl p-8"> |
|
<div id="reportContent" class="prose prose-invert"></div> |
|
</div> |
|
</div> |
|
<button class="absolute top-4 right-4 text-4xl text-white hover:text-gray-300 transition-colors" |
|
onclick="closeReport()"> |
|
<i class="fas fa-times"></i> |
|
</button> |
|
</div> |
|
|
|
|
|
<div class="floating-action"> |
|
<button class="btn btn-circle btn-lg btn-primary" onclick="toggleHelp()"> |
|
<i class="fas fa-question-circle text-2xl"></i> |
|
</button> |
|
</div> |
|
|
|
|
|
<script src="https://unpkg.com/[email protected]/dist/aos.js"></script> |
|
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script> |
|
<script> |
|
// Initialize animations |
|
AOS.init(); |
|
|
|
// Report templates with complete content |
|
const reports = { |
|
glaucomaReport: { |
|
es: ` |
|
<div class="report-document"> |
|
<div class="report-header border-b-2 border-gray-200 mb-6 pb-4"> |
|
<img src="https://ern-euro-nmd.eu/wp-content/uploads/2024/02/logo_12-de-octubre.jpeg" |
|
alt="Hospital 12 de Octubre" class="hospital-logo mb-4"> |
|
<h1 class="text-2xl font-bold text-gray-800 dark:text-gray-100">Informe Oftalmológico: Glaucoma</h1> |
|
<div class="text-sm text-gray-600 dark:text-gray-400 mt-2"> |
|
<p>Fecha: ${new Date().toLocaleDateString()}</p> |
|
<p>Ref: GLM-${Math.random().toString(36).substr(2, 9)}</p> |
|
</div> |
|
</div> |
|
|
|
<div class="patient-info mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Información del Paciente</h2> |
|
<p><strong>Nombre:</strong> <span id="patientNameDisplay"></span></p> |
|
<p><strong>Edad:</strong> <span id="patientAgeDisplay"></span> años</p> |
|
<p><strong>Nº Historia Clínica:</strong> HC-${Math.random().toString().slice(2,11)}</p> |
|
</div> |
|
|
|
<div class="clinical-findings mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Hallazgos Clínicos</h2> |
|
<h3 class="font-medium mb-2">Presión Intraocular (PIO)</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>OD: 24 mmHg</li> |
|
<li>OI: 26 mmHg</li> |
|
</ul> |
|
|
|
<h3 class="font-medium mb-2">Tomografía de Coherencia Óptica (OCT)</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>Adelgazamiento severo del RNFL inferior en OD (52μm)</li> |
|
<li>Adelgazamiento moderado del RNFL inferior en OI (65μm)</li> |
|
<li>Análisis de células ganglionares: Pérdida significativa en sector inferior</li> |
|
</ul> |
|
|
|
<h3 class="font-medium mb-2">Campo Visual</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>OD: Defecto arqueado superior, MD -8.5 dB</li> |
|
<li>OI: Escotoma paracentral, MD -6.2 dB</li> |
|
</ul> |
|
</div> |
|
|
|
<div class="diagnosis-plan mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Diagnóstico</h2> |
|
<p class="mb-4">Glaucoma Primario de Ángulo Abierto, estadio moderado-avanzado</p> |
|
|
|
<h2 class="text-lg font-semibold mb-2">Plan de Tratamiento</h2> |
|
<ul class="list-disc pl-5"> |
|
<li>Latanoprost 0.005% - 1 gota en cada ojo por la noche</li> |
|
<li>Timolol 0.5% - 1 gota en cada ojo cada 12 horas</li> |
|
<li>Control de PIO en 2 semanas</li> |
|
<li>OCT y Campo Visual de control en 4 meses</li> |
|
</ul> |
|
</div> |
|
|
|
<div class="report-footer mt-8 pt-4 border-t-2 border-gray-200"> |
|
<p class="text-sm text-gray-600 dark:text-gray-400"> |
|
Dr. Antonio García Rodríguez<br> |
|
Servicio de Oftalmología<br> |
|
Hospital Universitario 12 de Octubre<br> |
|
Nº Colegiado: 28/12345 |
|
</p> |
|
</div> |
|
</div> |
|
`, |
|
en: ` |
|
<div class="report-document"> |
|
<div class="report-header border-b-2 border-gray-200 mb-6 pb-4"> |
|
<img src="https://ern-euro-nmd.eu/wp-content/uploads/2024/02/logo_12-de-octubre.jpeg" |
|
alt="Hospital 12 de Octubre" class="hospital-logo mb-4"> |
|
<h1 class="text-2xl font-bold text-gray-800 dark:text-gray-100">Informe Oftalmológico: Glaucoma</h1> |
|
<div class="text-sm text-gray-600 dark:text-gray-400 mt-2"> |
|
<p>Fecha: ${new Date().toLocaleDateString()}</p> |
|
<p>Ref: GLM-${Math.random().toString(36).substr(2, 9)}</p> |
|
</div> |
|
</div> |
|
|
|
<div class="patient-info mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Información del Paciente</h2> |
|
<p><strong>Nombre:</strong> <span id="patientNameDisplay"></span></p> |
|
<p><strong>Edad:</strong> <span id="patientAgeDisplay"></span> años</p> |
|
<p><strong>Nº Historia Clínica:</strong> HC-${Math.random().toString().slice(2,11)}</p> |
|
</div> |
|
|
|
<div class="clinical-findings mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Hallazgos Clínicos</h2> |
|
<h3 class="font-medium mb-2">Presión Intraocular (PIO)</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>OD: 24 mmHg</li> |
|
<li>OI: 26 mmHg</li> |
|
</ul> |
|
|
|
<h3 class="font-medium mb-2">Tomografía de Coherencia Óptica (OCT)</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>Adelgazamiento severo del RNFL inferior en OD (52μm)</li> |
|
<li>Adelgazamiento moderado del RNFL inferior en OI (65μm)</li> |
|
<li>Análisis de células ganglionares: Pérdida significativa en sector inferior</li> |
|
</ul> |
|
|
|
<h3 class="font-medium mb-2">Campo Visual</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>OD: Defecto arqueado superior, MD -8.5 dB</li> |
|
<li>OI: Escotoma paracentral, MD -6.2 dB</li> |
|
</ul> |
|
</div> |
|
|
|
<div class="diagnosis-plan mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Diagnóstico</h2> |
|
<p class="mb-4">Glaucoma Primario de Ángulo Abierto, estadio moderado-avanzado</p> |
|
|
|
<h2 class="text-lg font-semibold mb-2">Plan de Tratamiento</h2> |
|
<ul class="list-disc pl-5"> |
|
<li>Latanoprost 0.005% - 1 gota en cada ojo por la noche</li> |
|
<li>Timolol 0.5% - 1 gota en cada ojo cada 12 horas</li> |
|
<li>Control de PIO en 2 semanas</li> |
|
<li>OCT y Campo Visual de control en 4 meses</li> |
|
</ul> |
|
</div> |
|
|
|
<div class="report-footer mt-8 pt-4 border-t-2 border-gray-200"> |
|
<p class="text-sm text-gray-600 dark:text-gray-400"> |
|
Dr. Antonio García Rodríguez<br> |
|
Servicio de Oftalmología<br> |
|
Hospital Universitario 12 de Octubre<br> |
|
Nº Colegiado: 28/12345 |
|
</p> |
|
</div> |
|
</div> |
|
` |
|
}, |
|
diabeticRetinopathyReport: { |
|
es: ` |
|
<div class="report-document"> |
|
<div class="report-header border-b-2 border-gray-200 mb-6 pb-4"> |
|
<img src="https://ern-euro-nmd.eu/wp-content/uploads/2024/02/logo_12-de-octubre.jpeg" |
|
alt="Hospital 12 de Octubre" class="hospital-logo mb-4"> |
|
<h1 class="text-2xl font-bold text-gray-800 dark:text-gray-100">Informe Oftalmológico: Retinopatía Diabética</h1> |
|
<div class="text-sm text-gray-600 dark:text-gray-400 mt-2"> |
|
<p>Fecha: ${new Date().toLocaleDateString()}</p> |
|
<p>Ref: RD-${Math.random().toString(36).substr(2, 9)}</p> |
|
</div> |
|
</div> |
|
|
|
<div class="patient-info mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Información del Paciente</h2> |
|
<p><strong>Nombre:</strong> <span id="patientNameDisplay"></span></p> |
|
<p><strong>Edad:</strong> <span id="patientAgeDisplay"></span> años</p> |
|
<p><strong>Nº Historia Clínica:</strong> HC-${Math.random().toString().slice(2,11)}</p> |
|
</div> |
|
|
|
<div class="clinical-findings mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Hallazgos Clínicos</h2> |
|
<h3 class="font-medium mb-2">Fondo de Ojo</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>Microaneurismas múltiples en ambos ojos</li> |
|
<li>Hemorragias intrarretinianas en cuadrantes temporales</li> |
|
<li>Exudados duros en área macular</li> |
|
</ul> |
|
|
|
<h3 class="font-medium mb-2">OCT Macular</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>Edema macular diabético con espesor central de 385μm en OD</li> |
|
<li>Espesor macular normal en OI (245μm)</li> |
|
</ul> |
|
</div> |
|
|
|
<div class="diagnosis-plan mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Diagnóstico</h2> |
|
<p class="mb-4">Retinopatía Diabética No Proliferativa Moderada</p> |
|
|
|
<h2 class="text-lg font-semibold mb-2">Plan de Tratamiento</h2> |
|
<ul class="list-disc pl-5"> |
|
<li>Inyecciones anti-VEGF</li> |
|
</ul> |
|
</div> |
|
|
|
<div class="report-footer mt-8 pt-4 border-t-2 border-gray-200"> |
|
<p class="text-sm text-gray-600 dark:text-gray-400"> |
|
Dr. Antonio García Rodríguez<br> |
|
Servicio de Oftalmología<br> |
|
Hospital Universitario 12 de Octubre<br> |
|
Nº Colegiado: 28/12345 |
|
</p> |
|
</div> |
|
</div> |
|
`, |
|
en: ` |
|
<div class="report-document"> |
|
<div class="report-header border-b-2 border-gray-200 mb-6 pb-4"> |
|
<img src="https://ern-euro-nmd.eu/wp-content/uploads/2024/02/logo_12-de-octubre.jpeg" |
|
alt="Hospital 12 de Octubre" class="hospital-logo mb-4"> |
|
<h1 class="text-2xl font-bold text-gray-800 dark:text-gray-100">Informe Oftalmológico: Retinopatía Diabética</h1> |
|
<div class="text-sm text-gray-600 dark:text-gray-400 mt-2"> |
|
<p>Fecha: ${new Date().toLocaleDateString()}</p> |
|
<p>Ref: RD-${Math.random().toString(36).substr(2, 9)}</p> |
|
</div> |
|
</div> |
|
|
|
<div class="patient-info mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Información del Paciente</h2> |
|
<p><strong>Nombre:</strong> <span id="patientNameDisplay"></span></p> |
|
<p><strong>Edad:</strong> <span id="patientAgeDisplay"></span> años</p> |
|
<p><strong>Nº Historia Clínica:</strong> HC-${Math.random().toString().slice(2,11)}</p> |
|
</div> |
|
|
|
<div class="clinical-findings mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Hallazgos Clínicos</h2> |
|
<h3 class="font-medium mb-2">Fondo de Ojo</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>Microaneurismas múltiples en ambos ojos</li> |
|
<li>Hemorragias intrarretinianas en cuadrantes temporales</li> |
|
<li>Exudados duros en área macular</li> |
|
</ul> |
|
|
|
<h3 class="font-medium mb-2">OCT Macular</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>Edema macular diabético con espesor central de 385μm en OD</li> |
|
<li>Espesor macular normal en OI (245μm)</li> |
|
</ul> |
|
</div> |
|
|
|
<div class="diagnosis-plan mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Diagnóstico</h2> |
|
<p class="mb-4">Retinopatía Diabética No Proliferativa Moderada</p> |
|
|
|
<h2 class="text-lg font-semibold mb-2">Plan de Tratamiento</h2> |
|
<ul class="list-disc pl-5"> |
|
<li>Inyecciones anti-VEGF</li> |
|
</ul> |
|
</div> |
|
|
|
<div class="report-footer mt-8 pt-4 border-t-2 border-gray-200"> |
|
<p class="text-sm text-gray-600 dark:text-gray-400"> |
|
Dr. Antonio García Rodríguez<br> |
|
Servicio de Oftalmología<br> |
|
Hospital Universitario 12 de Octubre<br> |
|
Nº Colegiado: 28/12345 |
|
</p> |
|
</div> |
|
</div> |
|
` |
|
}, |
|
amdReport: { |
|
es: ` |
|
<div class="report-document"> |
|
<div class="report-header border-b-2 border-gray-200 mb-6 pb-4"> |
|
<img src="https://ern-euro-nmd.eu/wp-content/uploads/2024/02/logo_12-de-octubre.jpeg" |
|
alt="Hospital 12 de Octubre" class="hospital-logo mb-4"> |
|
<h1 class="text-2xl font-bold text-gray-800 dark:text-gray-100">Informe Oftalmológico: DMAE</h1> |
|
<div class="text-sm text-gray-600 dark:text-gray-400 mt-2"> |
|
<p>Fecha: ${new Date().toLocaleDateString()}</p> |
|
<p>Ref: AMD-${Math.random().toString(36).substr(2, 9)}</p> |
|
</div> |
|
</div> |
|
|
|
<div class="patient-info mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Información del Paciente</h2> |
|
<p><strong>Nombre:</strong> <span id="patientNameDisplay"></span></p> |
|
<p><strong>Edad:</strong> <span id="patientAgeDisplay"></span> años</p> |
|
<p><strong>Nº Historia Clínica:</strong> HC-${Math.random().toString().slice(2,11)}</p> |
|
</div> |
|
|
|
<div class="clinical-findings mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Hallazgos Clínicos</h2> |
|
<h3 class="font-medium mb-2">Presión Intraocular (PIO)</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>OD: 24 mmHg</li> |
|
<li>OI: 26 mmHg</li> |
|
</ul> |
|
|
|
<h3 class="font-medium mb-2">Tomografía de Coherencia Óptica (OCT)</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>Adelgazamiento severo del RNFL inferior en OD (52μm)</li> |
|
<li>Adelgazamiento moderado del RNFL inferior en OI (65μm)</li> |
|
<li>Análisis de células ganglionares: Pérdida significativa en sector inferior</li> |
|
</ul> |
|
|
|
<h3 class="font-medium mb-2">Campo Visual</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>OD: Defecto arqueado superior, MD -8.5 dB</li> |
|
<li>OI: Escotoma paracentral, MD -6.2 dB</li> |
|
</ul> |
|
</div> |
|
|
|
<div class="diagnosis-plan mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Diagnóstico</h2> |
|
<p class="mb-4">DMAE</p> |
|
|
|
<h2 class="text-lg font-semibold mb-2">Plan de Tratamiento</h2> |
|
<ul class="list-disc pl-5"> |
|
<li>Latanoprost 0.005% - 1 gota en cada ojo por la noche</li> |
|
<li>Timolol 0.5% - 1 gota en cada ojo cada 12 horas</li> |
|
<li>Control de PIO en 2 semanas</li> |
|
<li>OCT y Campo Visual de control en 4 meses</li> |
|
</ul> |
|
</div> |
|
|
|
<div class="report-footer mt-8 pt-4 border-t-2 border-gray-200"> |
|
<p class="text-sm text-gray-600 dark:text-gray-400"> |
|
Dr. Antonio García Rodríguez<br> |
|
Servicio de Oftalmología<br> |
|
Hospital Universitario 12 de Octubre<br> |
|
Nº Colegiado: 28/12345 |
|
</p> |
|
</div> |
|
</div> |
|
`, |
|
en: ` |
|
<div class="report-document"> |
|
<div class="report-header border-b-2 border-gray-200 mb-6 pb-4"> |
|
<img src="https://ern-euro-nmd.eu/wp-content/uploads/2024/02/logo_12-de-octubre.jpeg" |
|
alt="Hospital 12 de Octubre" class="hospital-logo mb-4"> |
|
<h1 class="text-2xl font-bold text-gray-800 dark:text-gray-100">Informe Oftalmológico: DMAE</h1> |
|
<div class="text-sm text-gray-600 dark:text-gray-400 mt-2"> |
|
<p>Fecha: ${new Date().toLocaleDateString()}</p> |
|
<p>Ref: AMD-${Math.random().toString(36).substr(2, 9)}</p> |
|
</div> |
|
</div> |
|
|
|
<div class="patient-info mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Información del Paciente</h2> |
|
<p><strong>Nombre:</strong> <span id="patientNameDisplay"></span></p> |
|
<p><strong>Edad:</strong> <span id="patientAgeDisplay"></span> años</p> |
|
<p><strong>Nº Historia Clínica:</strong> HC-${Math.random().toString().slice(2,11)}</p> |
|
</div> |
|
|
|
<div class="clinical-findings mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Hallazgos Clínicos</h2> |
|
<h3 class="font-medium mb-2">Presión Intraocular (PIO)</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>OD: 24 mmHg</li> |
|
<li>OI: 26 mmHg</li> |
|
</ul> |
|
|
|
<h3 class="font-medium mb-2">Tomografía de Coherencia Óptica (OCT)</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>Adelgazamiento severo del RNFL inferior en OD (52μm)</li> |
|
<li>Adelgazamiento moderado del RNFL inferior en OI (65μm)</li> |
|
<li>Análisis de células ganglionares: Pérdida significativa en sector inferior</li> |
|
</ul> |
|
|
|
<h3 class="font-medium mb-2">Campo Visual</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>OD: Defecto arqueado superior, MD -8.5 dB</li> |
|
<li>OI: Escotoma paracentral, MD -6.2 dB</li> |
|
</ul> |
|
</div> |
|
|
|
<div class="diagnosis-plan mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Diagnóstico</h2> |
|
<p class="mb-4">DMAE</p> |
|
|
|
<h2 class="text-lg font-semibold mb-2">Plan de Tratamiento</h2> |
|
<ul class="list-disc pl-5"> |
|
<li>Latanoprost 0.005% - 1 gota en cada ojo por la noche</li> |
|
<li>Timolol 0.5% - 1 gota en cada ojo cada 12 horas</li> |
|
<li>Control de PIO en 2 semanas</li> |
|
<li>OCT y Campo Visual de control en 4 meses</li> |
|
</ul> |
|
</div> |
|
|
|
<div class="report-footer mt-8 pt-4 border-t-2 border-gray-200"> |
|
<p class="text-sm text-gray-600 dark:text-gray-400"> |
|
Dr. Antonio García Rodríguez<br> |
|
Servicio de Oftalmología<br> |
|
Hospital Universitario 12 de Octubre<br> |
|
Nº Colegiado: 28/12345 |
|
</p> |
|
</div> |
|
</div> |
|
` |
|
}, |
|
treatmentPlan: { |
|
es: ` |
|
<div class="report-document"> |
|
<div class="report-header border-b-2 border-gray-200 mb-6 pb-4"> |
|
<img src="https://ern-euro-nmd.eu/wp-content/uploads/2024/02/logo_12-de-octubre.jpeg" |
|
alt="Hospital 12 de Octubre" class="hospital-logo mb-4"> |
|
<h1 class="text-2xl font-bold text-gray-800 dark:text-gray-100">Plan de Tratamiento</h1> |
|
<div class="text-sm text-gray-600 dark:text-gray-400 mt-2"> |
|
<p>Fecha: ${new Date().toLocaleDateString()}</p> |
|
<p>Ref: TP-${Math.random().toString(36).substr(2, 9)}</p> |
|
</div> |
|
</div> |
|
|
|
<div class="patient-info mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Información del Paciente</h2> |
|
<p><strong>Nombre:</strong> <span id="patientNameDisplay"></span></p> |
|
<p><strong>Edad:</strong> <span id="patientAgeDisplay"></span> años</p> |
|
<p><strong>Nº Historia Clínica:</strong> HC-${Math.random().toString().slice(2,11)}</p> |
|
</div> |
|
|
|
<div class="clinical-findings mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Hallazgos Clínicos</h2> |
|
<h3 class="font-medium mb-2">Presión Intraocular (PIO)</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>OD: 24 mmHg</li> |
|
<li>OI: 26 mmHg</li> |
|
</ul> |
|
|
|
<h3 class="font-medium mb-2">Tomografía de Coherencia Óptica (OCT)</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>Adelgazamiento severo del RNFL inferior en OD (52μm)</li> |
|
<li>Adelgazamiento moderado del RNFL inferior en OI (65μm)</li> |
|
<li>Análisis de células ganglionares: Pérdida significativa en sector inferior</li> |
|
</ul> |
|
|
|
<h3 class="font-medium mb-2">Campo Visual</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>OD: Defecto arqueado superior, MD -8.5 dB</li> |
|
<li>OI: Escotoma paracentral, MD -6.2 dB</li> |
|
</ul> |
|
</div> |
|
|
|
<div class="diagnosis-plan mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Diagnóstico</h2> |
|
<p class="mb-4">Glaucoma Primario de Ángulo Abierto, estadio moderado-avanzado</p> |
|
|
|
<h2 class="text-lg font-semibold mb-2">Plan de Tratamiento</h2> |
|
<ul class="list-disc pl-5"> |
|
<li>Latanoprost 0.005% - 1 gota en cada ojo por la noche</li> |
|
<li>Timolol 0.5% - 1 gota en cada ojo cada 12 horas</li> |
|
<li>Control de PIO en 2 semanas</li> |
|
<li>OCT y Campo Visual de control en 4 meses</li> |
|
</ul> |
|
</div> |
|
|
|
<div class="report-footer mt-8 pt-4 border-t-2 border-gray-200"> |
|
<p class="text-sm text-gray-600 dark:text-gray-400"> |
|
Dr. Antonio García Rodríguez<br> |
|
Servicio de Oftalmología<br> |
|
Hospital Universitario 12 de Octubre<br> |
|
Nº Colegiado: 28/12345 |
|
</p> |
|
</div> |
|
</div> |
|
`, |
|
en: ` |
|
<div class="report-document"> |
|
<div class="report-header border-b-2 border-gray-200 mb-6 pb-4"> |
|
<img src="https://ern-euro-nmd.eu/wp-content/uploads/2024/02/logo_12-de-octubre.jpeg" |
|
alt="Hospital 12 de Octubre" class="hospital-logo mb-4"> |
|
<h1 class="text-2xl font-bold text-gray-800 dark:text-gray-100">Plan de Tratamiento</h1> |
|
<div class="text-sm text-gray-600 dark:text-gray-400 mt-2"> |
|
<p>Fecha: ${new Date().toLocaleDateString()}</p> |
|
<p>Ref: TP-${Math.random().toString(36).substr(2, 9)}</p> |
|
</div> |
|
</div> |
|
|
|
<div class="patient-info mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Información del Paciente</h2> |
|
<p><strong>Nombre:</strong> <span id="patientNameDisplay"></span></p> |
|
<p><strong>Edad:</strong> <span id="patientAgeDisplay"></span> años</p> |
|
<p><strong>Nº Historia Clínica:</strong> HC-${Math.random().toString().slice(2,11)}</p> |
|
</div> |
|
|
|
<div class="clinical-findings mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Hallazgos Clínicos</h2> |
|
<h3 class="font-medium mb-2">Presión Intraocular (PIO)</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>OD: 24 mmHg</li> |
|
<li>OI: 26 mmHg</li> |
|
</ul> |
|
|
|
<h3 class="font-medium mb-2">Tomografía de Coherencia Óptica (OCT)</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>Adelgazamiento severo del RNFL inferior en OD (52μm)</li> |
|
<li>Adelgazamiento moderado del RNFL inferior en OI (65μm)</li> |
|
<li>Análisis de células ganglionares: Pérdida significativa en sector inferior</li> |
|
</ul> |
|
|
|
<h3 class="font-medium mb-2">Campo Visual</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>OD: Defecto arqueado superior, MD -8.5 dB</li> |
|
<li>OI: Escotoma paracentral, MD -6.2 dB</li> |
|
</ul> |
|
</div> |
|
|
|
<div class="diagnosis-plan mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Diagnóstico</h2> |
|
<p class="mb-4">Glaucoma Primario de Ángulo Abierto, estadio moderado-avanzado</p> |
|
|
|
<h2 class="text-lg font-semibold mb-2">Plan de Tratamiento</h2> |
|
<ul class="list-disc pl-5"> |
|
<li>Latanoprost 0.005% - 1 gota en cada ojo por la noche</li> |
|
<li>Timolol 0.5% - 1 gota en cada ojo cada 12 horas</li> |
|
<li>Control de PIO en 2 semanas</li> |
|
<li>OCT y Campo Visual de control en 4 meses</li> |
|
</ul> |
|
</div> |
|
|
|
<div class="report-footer mt-8 pt-4 border-t-2 border-gray-200"> |
|
<p class="text-sm text-gray-600 dark:text-gray-400"> |
|
Dr. Antonio García Rodríguez<br> |
|
Servicio de Oftalmología<br> |
|
Hospital Universitario 12 de Octubre<br> |
|
Nº Colegiado: 28/12345 |
|
</p> |
|
</div> |
|
</div> |
|
` |
|
}, |
|
followUpReport: { |
|
es: ` |
|
<div class="report-document"> |
|
<div class="report-header border-b-2 border-gray-200 mb-6 pb-4"> |
|
<img src="https://ern-euro-nmd.eu/wp-content/uploads/2024/02/logo_12-de-octubre.jpeg" |
|
alt="Hospital 12 de Octubre" class="hospital-logo mb-4"> |
|
<h1 class="text-2xl font-bold text-gray-800 dark:text-gray-100">Informe de Seguimiento</h1> |
|
<div class="text-sm text-gray-600 dark:text-gray-400 mt-2"> |
|
<p>Fecha: ${new Date().toLocaleDateString()}</p> |
|
<p>Ref: FU-${Math.random().toString(36).substr(2, 9)}</p> |
|
</div> |
|
</div> |
|
|
|
<div class="patient-info mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Información del Paciente</h2> |
|
<p><strong>Nombre:</strong> <span id="patientNameDisplay"></span></p> |
|
<p><strong>Edad:</strong> <span id="patientAgeDisplay"></span> años</p> |
|
<p><strong>Nº Historia Clínica:</strong> HC-${Math.random().toString().slice(2,11)}</p> |
|
</div> |
|
|
|
<div class="clinical-findings mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Hallazgos Clínicos</h2> |
|
<h3 class="font-medium mb-2">Presión Intraocular (PIO)</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>OD: 24 mmHg</li> |
|
<li>OI: 26 mmHg</li> |
|
</ul> |
|
|
|
<h3 class="font-medium mb-2">Tomografía de Coherencia Óptica (OCT)</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>Adelgazamiento severo del RNFL inferior en OD (52μm)</li> |
|
<li>Adelgazamiento moderado del RNFL inferior en OI (65μm)</li> |
|
<li>Análisis de células ganglionares: Pérdida significativa en sector inferior</li> |
|
</ul> |
|
|
|
<h3 class="font-medium mb-2">Campo Visual</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>OD: Defecto arqueado superior, MD -8.5 dB</li> |
|
<li>OI: Escotoma paracentral, MD -6.2 dB</li> |
|
</ul> |
|
</div> |
|
|
|
<div class="diagnosis-plan mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Diagnóstico</h2> |
|
<p class="mb-4">Glaucoma Primario de Ángulo Abierto, estadio moderado-avanzado</p> |
|
|
|
<h2 class="text-lg font-semibold mb-2">Plan de Tratamiento</h2> |
|
<ul class="list-disc pl-5"> |
|
<li>Latanoprost 0.005% - 1 gota en cada ojo por la noche</li> |
|
<li>Timolol 0.5% - 1 gota en cada ojo cada 12 horas</li> |
|
<li>Control de PIO en 2 semanas</li> |
|
<li>OCT y Campo Visual de control en 4 meses</li> |
|
</ul> |
|
</div> |
|
|
|
<div class="report-footer mt-8 pt-4 border-t-2 border-gray-200"> |
|
<p class="text-sm text-gray-600 dark:text-gray-400"> |
|
Dr. Antonio García Rodríguez<br> |
|
Servicio de Oftalmología<br> |
|
Hospital Universitario 12 de Octubre<br> |
|
Nº Colegiado: 28/12345 |
|
</p> |
|
</div> |
|
</div> |
|
`, |
|
en: ` |
|
<div class="report-document"> |
|
<div class="report-header border-b-2 border-gray-200 mb-6 pb-4"> |
|
<img src="https://ern-euro-nmd.eu/wp-content/uploads/2024/02/logo_12-de-octubre.jpeg" |
|
alt="Hospital 12 de Octubre" class="hospital-logo mb-4"> |
|
<h1 class="text-2xl font-bold text-gray-800 dark:text-gray-100">Informe de Seguimiento</h1> |
|
<div class="text-sm text-gray-600 dark:text-gray-400 mt-2"> |
|
<p>Fecha: ${new Date().toLocaleDateString()}</p> |
|
<p>Ref: FU-${Math.random().toString(36).substr(2, 9)}</p> |
|
</div> |
|
</div> |
|
|
|
<div class="patient-info mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Información del Paciente</h2> |
|
<p><strong>Nombre:</strong> <span id="patientNameDisplay"></span></p> |
|
<p><strong>Edad:</strong> <span id="patientAgeDisplay"></span> años</p> |
|
<p><strong>Nº Historia Clínica:</strong> HC-${Math.random().toString().slice(2,11)}</p> |
|
</div> |
|
|
|
<div class="clinical-findings mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Hallazgos Clínicos</h2> |
|
<h3 class="font-medium mb-2">Presión Intraocular (PIO)</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>OD: 24 mmHg</li> |
|
<li>OI: 26 mmHg</li> |
|
</ul> |
|
|
|
<h3 class="font-medium mb-2">Tomografía de Coherencia Óptica (OCT)</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>Adelgazamiento severo del RNFL inferior en OD (52μm)</li> |
|
<li>Adelgazamiento moderado del RNFL inferior en OI (65μm)</li> |
|
<li>Análisis de células ganglionares: Pérdida significativa en sector inferior</li> |
|
</ul> |
|
|
|
<h3 class="font-medium mb-2">Campo Visual</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>OD: Defecto arqueado superior, MD -8.5 dB</li> |
|
<li>OI: Escotoma paracentral, MD -6.2 dB</li> |
|
</ul> |
|
</div> |
|
|
|
<div class="diagnosis-plan mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Diagnóstico</h2> |
|
<p class="mb-4">Glaucoma Primario de Ángulo Abierto, estadio moderado-avanzado</p> |
|
|
|
<h2 class="text-lg font-semibold mb-2">Plan de Tratamiento</h2> |
|
<ul class="list-disc pl-5"> |
|
<li>Latanoprost 0.005% - 1 gota en cada ojo por la noche</li> |
|
<li>Timolol 0.5% - 1 gota en cada ojo cada 12 horas</li> |
|
<li>Control de PIO en 2 semanas</li> |
|
<li>OCT y Campo Visual de control en 4 meses</li> |
|
</ul> |
|
</div> |
|
|
|
<div class="report-footer mt-8 pt-4 border-t-2 border-gray-200"> |
|
<p class="text-sm text-gray-600 dark:text-gray-400"> |
|
Dr. Antonio García Rodríguez<br> |
|
Servicio de Oftalmología<br> |
|
Hospital Universitario 12 de Octubre<br> |
|
Nº Colegiado: 28/12345 |
|
</p> |
|
</div> |
|
</div> |
|
` |
|
}, |
|
generalSummaryReport: { |
|
es: ` |
|
<div class="report-document"> |
|
<div class="report-header border-b-2 border-gray-200 mb-6 pb-4"> |
|
<img src="https://ern-euro-nmd.eu/wp-content/uploads/2024/02/logo_12-de-octubre.jpeg" |
|
alt="Hospital 12 de Octubre" class="hospital-logo mb-4"> |
|
<h1 class="text-2xl font-bold text-gray-800 dark:text-gray-100">Resumen General</h1> |
|
<div class="text-sm text-gray-600 dark:text-gray-400 mt-2"> |
|
<p>Fecha: ${new Date().toLocaleDateString()}</p> |
|
<p>Ref: GS-${Math.random().toString(36).substr(2, 9)}</p> |
|
</div> |
|
</div> |
|
|
|
<div class="patient-info mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Información del Paciente</h2> |
|
<p><strong>Nombre:</strong> <span id="patientNameDisplay"></span></p> |
|
<p><strong>Edad:</strong> <span id="patientAgeDisplay"></span> años</p> |
|
<p><strong>Nº Historia Clínica:</strong> HC-${Math.random().toString().slice(2,11)}</p> |
|
</div> |
|
|
|
<div class="clinical-findings mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Hallazgos Clínicos</h2> |
|
<h3 class="font-medium mb-2">Presión Intraocular (PIO)</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>OD: 24 mmHg</li> |
|
<li>OI: 26 mmHg</li> |
|
</ul> |
|
|
|
<h3 class="font-medium mb-2">Tomografía de Coherencia Óptica (OCT)</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>Adelgazamiento severo del RNFL inferior en OD (52μm)</li> |
|
<li>Adelgazamiento moderado del RNFL inferior en OI (65μm)</li> |
|
<li>Análisis de células ganglionares: Pérdida significativa en sector inferior</li> |
|
</ul> |
|
|
|
<h3 class="font-medium mb-2">Campo Visual</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>OD: Defecto arqueado superior, MD -8.5 dB</li> |
|
<li>OI: Escotoma paracentral, MD -6.2 dB</li> |
|
</ul> |
|
</div> |
|
|
|
<div class="diagnosis-plan mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Diagnóstico</h2> |
|
<p class="mb-4">Glaucoma Primario de Ángulo Abierto, estadio moderado-avanzado</p> |
|
|
|
<h2 class="text-lg font-semibold mb-2">Plan de Tratamiento</h2> |
|
<ul class="list-disc pl-5"> |
|
<li>Latanoprost 0.005% - 1 gota en cada ojo por la noche</li> |
|
<li>Timolol 0.5% - 1 gota en cada ojo cada 12 horas</li> |
|
<li>Control de PIO en 2 semanas</li> |
|
<li>OCT y Campo Visual de control en 4 meses</li> |
|
</ul> |
|
</div> |
|
|
|
<div class="report-footer mt-8 pt-4 border-t-2 border-gray-200"> |
|
<p class="text-sm text-gray-600 dark:text-gray-400"> |
|
Dr. Antonio García Rodríguez<br> |
|
Servicio de Oftalmología<br> |
|
Hospital Universitario 12 de Octubre<br> |
|
Nº Colegiado: 28/12345 |
|
</p> |
|
</div> |
|
</div> |
|
`, |
|
en: ` |
|
<div class="report-document"> |
|
<div class="report-header border-b-2 border-gray-200 mb-6 pb-4"> |
|
<img src="https://ern-euro-nmd.eu/wp-content/uploads/2024/02/logo_12-de-octubre.jpeg" |
|
alt="Hospital 12 de Octubre" class="hospital-logo mb-4"> |
|
<h1 class="text-2xl font-bold text-gray-800 dark:text-gray-100">Resumen General</h1> |
|
<div class="text-sm text-gray-600 dark:text-gray-400 mt-2"> |
|
<p>Fecha: ${new Date().toLocaleDateString()}</p> |
|
<p>Ref: GS-${Math.random().toString(36).substr(2, 9)}</p> |
|
</div> |
|
</div> |
|
|
|
<div class="patient-info mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Información del Paciente</h2> |
|
<p><strong>Nombre:</strong> <span id="patientNameDisplay"></span></p> |
|
<p><strong>Edad:</strong> <span id="patientAgeDisplay"></span> años</p> |
|
<p><strong>Nº Historia Clínica:</strong> HC-${Math.random().toString().slice(2,11)}</p> |
|
</div> |
|
|
|
<div class="clinical-findings mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Hallazgos Clínicos</h2> |
|
<h3 class="font-medium mb-2">Presión Intraocular (PIO)</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>OD: 24 mmHg</li> |
|
<li>OI: 26 mmHg</li> |
|
</ul> |
|
|
|
<h3 class="font-medium mb-2">Tomografía de Coherencia Óptica (OCT)</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>Adelgazamiento severo del RNFL inferior en OD (52μm)</li> |
|
<li>Adelgazamiento moderado del RNFL inferior en OI (65μm)</li> |
|
<li>Análisis de células ganglionares: Pérdida significativa en sector inferior</li> |
|
</ul> |
|
|
|
<h3 class="font-medium mb-2">Campo Visual</h3> |
|
<ul class="list-disc pl-5 mb-4"> |
|
<li>OD: Defecto arqueado superior, MD -8.5 dB</li> |
|
<li>OI: Escotoma paracentral, MD -6.2 dB</li> |
|
</ul> |
|
</div> |
|
|
|
<div class="diagnosis-plan mb-6"> |
|
<h2 class="text-lg font-semibold mb-2">Diagnóstico</h2> |
|
<p class="mb-4">Glaucoma Primario de Ángulo Abierto, estadio moderado-avanzado</p> |
|
|
|
<h2 class="text-lg font-semibold mb-2">Plan de Tratamiento</h2> |
|
<ul class="list-disc pl-5"> |
|
<li>Latanoprost 0.005% - 1 gota en cada ojo por la noche</li> |
|
<li>Timolol 0.5% - 1 gota en cada ojo cada 12 horas</li> |
|
<li>Control de PIO en 2 semanas</li> |
|
<li>OCT y Campo Visual de control en 4 meses</li> |
|
</ul> |
|
</div> |
|
|
|
<div class="report-footer mt-8 pt-4 border-t-2 border-gray-200"> |
|
<p class="text-sm text-gray-600 dark:text-gray-400"> |
|
Dr. Antonio García Rodríguez<br> |
|
Servicio de Oftalmología<br> |
|
Hospital Universitario 12 de Octubre<br> |
|
Nº Colegiado: 28/12345 |
|
</p> |
|
</div> |
|
</div> |
|
` |
|
} |
|
}; |
|
|
|
// Form handling |
|
document.getElementById('patientForm').addEventListener('submit', function(e) { |
|
e.preventDefault(); |
|
const patientName = document.getElementById('patientName').value; |
|
const patientAge = document.getElementById('patientAge').value; |
|
const diagnosis = document.getElementById('diagnosis').value; |
|
|
|
// Generate appropriate report based on diagnosis |
|
showReport(diagnosis + 'Report'); |
|
|
|
// Update patient name in report |
|
document.querySelectorAll('#patientNameDisplay').forEach(el => { |
|
el.textContent = patientName; |
|
}); |
|
}); |
|
|
|
// Enhanced report viewer with animations and language support |
|
function showReport(reportId) { |
|
const viewer = document.getElementById('reportViewer'); |
|
const content = document.getElementById('reportContent'); |
|
const currentLang = document.body.getAttribute('data-language'); |
|
|
|
// Add loading state |
|
content.classList.add('loading'); |
|
|
|
// Smooth transition |
|
viewer.classList.add('active'); |
|
document.body.style.overflow = 'hidden'; |
|
|
|
// Simulate loading for smoother transition |
|
setTimeout(() => { |
|
content.innerHTML = reports[reportId][currentLang]; |
|
content.classList.remove('loading'); |
|
|
|
// Initialize any dynamic content |
|
initializeReportContent(); |
|
}, 300); |
|
} |
|
|
|
function initializeReportContent() { |
|
// Add any initialization needed for report content |
|
// For example, charts, interactive elements, etc. |
|
} |
|
|
|
function closeReport() { |
|
const viewer = document.getElementById('reportViewer'); |
|
viewer.classList.add('animate__fadeOut'); |
|
|
|
setTimeout(() => { |
|
viewer.classList.add('hidden'); |
|
viewer.classList.remove('animate__fadeOut'); |
|
document.body.style.overflow = 'auto'; |
|
}, 300); |
|
} |
|
|
|
function toggleLanguage() { |
|
const body = document.body; |
|
const currentLang = body.getAttribute('data-language'); |
|
const newLang = currentLang === 'es' ? 'en' : 'es'; |
|
body.setAttribute('data-language', newLang); |
|
body.classList.toggle('lang-en'); |
|
} |
|
|
|
function toggleHelp() { |
|
// Implement help modal |
|
} |
|
|
|
// Add smooth scroll for navigation |
|
document.querySelectorAll('a[href^="#"]').forEach(anchor => { |
|
anchor.addEventListener('click', function (e) { |
|
e.preventDefault(); |
|
document.querySelector(this.getAttribute('href')).scrollIntoView({ |
|
behavior: 'smooth' |
|
}); |
|
}); |
|
}); |
|
</script> |
|
</body> |
|
</html> |
