Spaces:
Sleeping
Sleeping
<html lang="en"> | |
<head> | |
<meta charset="UTF-8" /> | |
<meta name="viewport" content="width=device-width, initial-scale=1" /> | |
<title>Health Reports Processor</title> | |
<style> | |
body { | |
font-family: Arial, sans-serif; | |
margin: 2rem; | |
max-width: 800px; | |
} | |
label { | |
display: block; | |
margin-top: 1rem; | |
font-weight: bold; | |
} | |
input, textarea, button { | |
width: 100%; | |
padding: 0.5rem; | |
margin-top: 0.25rem; | |
box-sizing: border-box; | |
font-size: 1rem; | |
} | |
button { | |
margin-top: 1rem; | |
cursor: pointer; | |
} | |
pre { | |
background: #f4f4f4; | |
padding: 1rem; | |
overflow-x: auto; | |
white-space: pre-wrap; | |
word-wrap: break-word; | |
border: 1px solid #ccc; | |
margin-top: 1rem; | |
} | |
.error { | |
color: red; | |
margin-top: 1rem; | |
} | |
</style> | |
</head> | |
<body> | |
<h1>Health Reports Processor</h1> | |
<form id="reportForm"> | |
<label for="patientId">Patient ID:</label> | |
<input type="text" id="patientId" name="patientId" required /> | |
<label for="filenames">Filenames (comma-separated):</label> | |
<input type="text" id="filenames" name="filenames" placeholder="e.g. cbc.pdf, thyroid.pdf" required /> | |
<button type="submit">Process Reports</button> | |
</form> | |
<div id="result"></div> | |
<script> | |
const form = document.getElementById('reportForm'); | |
const resultDiv = document.getElementById('result'); | |
form.addEventListener('submit', async (e) => { | |
e.preventDefault(); | |
resultDiv.innerHTML = ''; | |
const patientId = form.patientId.value.trim(); | |
const filenamesRaw = form.filenames.value.trim(); | |
if (!patientId || !filenamesRaw) { | |
resultDiv.innerHTML = '<p class="error">Please enter both Patient ID and filenames.</p>'; | |
return; | |
} | |
const filenames = filenamesRaw.split(',').map(f => f.trim()).filter(f => f.length > 0); | |
try { | |
const response = await fetch('/process_reports', { | |
method: 'POST', | |
headers: { 'Content-Type': 'application/json' }, | |
body: JSON.stringify({ patient_id: patientId, filenames: filenames }) | |
}); | |
if (!response.ok) { | |
const errorData = await response.json(); | |
resultDiv.innerHTML = `<p class="error">Error: ${errorData.error || response.statusText}</p>`; | |
return; | |
} | |
const data = await response.json(); | |
resultDiv.innerHTML = `<h2>Processed Result</h2><pre>${JSON.stringify(data, null, 2)}</pre>`; | |
} catch (err) { | |
resultDiv.innerHTML = `<p class="error">Request failed: ${err.message}</p>`; | |
} | |
}); | |
</script> | |
</body> | |
</html> | |