114 lines
2.9 KiB
HTML
114 lines
2.9 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="es">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>OncoDiario - Seguimiento del Tratamiento</title>
|
|
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;700&family=JetBrains+Mono:wght@400;700&display=swap" rel="stylesheet">
|
|
<link rel="stylesheet" href="css/estilos.css">
|
|
<link rel="icon" href="img/logo.svg" type="image/x-icon">
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<div class="container">
|
|
|
|
<div class="card">
|
|
<h1>🩺 OncoDiario</h1>
|
|
<p>Seguimiento del tratamiento oncológico</p>
|
|
|
|
<br>
|
|
|
|
<label>Fecha de inicio:</label>
|
|
<input type="date">
|
|
|
|
<div class="progress" id="progress"></div>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<h2>Calendario de sesiones</h2>
|
|
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>Semana</th>
|
|
<th>Fecha</th>
|
|
<th>Tratamiento</th>
|
|
<th>Completada</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="sessionsTable"></tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<h2>Registro semanal de síntomas</h2>
|
|
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>Semana</th>
|
|
<th>Fatiga</th>
|
|
<th>Náuseas</th>
|
|
<th>Dolor</th>
|
|
<th>Neuropatía</th>
|
|
<th>Sueño</th>
|
|
<th>Estado ánimo</th>
|
|
<th>Observaciones</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="symptomsTable"></tbody>
|
|
</table>
|
|
|
|
<small>
|
|
Escala: 0=nada | 1=leve | 2=moderado | 3=importante |
|
|
4=muy importante | 5=incapacitante
|
|
</small>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<h2>Preguntas para el oncólogo</h2>
|
|
|
|
<div id="questions"></div>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<h2>Notas de consulta</h2>
|
|
<textarea placeholder="Escribe aquí tus notas..."></textarea>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<script>
|
|
|
|
// Barra de progreso
|
|
const progress = document.getElementById('progress');
|
|
|
|
for(let i=1;i<=12;i++){
|
|
const item = document.createElement('div');
|
|
item.className = 'session';
|
|
item.innerText = i;
|
|
|
|
item.addEventListener('click',()=>{
|
|
item.classList.toggle('completed');
|
|
});
|
|
|
|
progress.appendChild(item);
|
|
}
|
|
|
|
// Calendario de sesiones
|
|
|
|
const sessionsTable =
|
|
document.getElementById('sessionsTable');
|
|
|
|
for(let i=1;i<=12;i++){
|
|
|
|
sessionsTable.innerHTML += `
|
|
<tr>
|
|
<td>${i}</td>
|
|
<td><input type="date"></td>
|
|
<td><input type="text" placeholder="Quimioterapia, inmunoterapia..."></td>
|
|
<td><input type="checkbox"></td>
|
|
< |