`;
div.querySelector('.delete-btn').onclick = () => { deleteItem('symptoms', item.id); renderSymptoms(); };
return div;
});
}
// --- Appointments ---
const apptDate = document.getElementById('appt-date');
const apptTime = document.getElementById('appt-time');
const apptDoctor = document.getElementById('appt-doctor');
const apptNotes = document.getElementById('appt-notes');
document.getElementById('add-appt-btn').addEventListener('click', () => {
if (apptDate.value && apptTime.value && apptDoctor.value) {
addItem('appointments', { id: Date.now(), date: apptDate.value, time: apptTime.value, doctor: apptDoctor.value, notes: apptNotes.value });
renderAppointments();
apptDoctor.value = apptNotes.value = '';
}
});
function renderAppointments() {
state.appointments.sort((a,b) => new Date(a.date) - new Date(b.date));
renderList('appointments', 'appt-list', (item) => {
const div = document.createElement('div');
div.className = 'list-item p-3 border rounded-lg';
div.innerHTML = `
${item.doctor}
${new Date(item.date).toLocaleDateString()} at ${item.time}
${item.notes ? `
${item.notes}
` : ''}`;
div.querySelector('.delete-btn').onclick = () => { deleteItem('appointments', item.id); renderAppointments(); };
return div;
});
}
// --- Goals ---
const goalDesc = document.getElementById('goal-description');
const goalDate = document.getElementById('goal-date');
document.getElementById('add-goal-btn').addEventListener('click', () => {
if (goalDesc.value && goalDate.value) {
addItem('goals', { id: Date.now(), description: goalDesc.value, targetDate: goalDate.value });
renderGoals();
goalDesc.value = '';
}
});
function renderGoals() {
renderList('goals', 'goal-list', (item) => {
const div = document.createElement('div');
div.className = 'list-item p-3 border rounded-lg flex justify-between items-center';
div.innerHTML = `
${item.description}
Target: ${new Date(item.targetDate).toLocaleDateString()}
`;
div.querySelector('.delete-btn').onclick = () => { deleteItem('goals', item.id); renderGoals(); };
return div;
});
}
// --- Plan Compilation & PDF ---
function compilePlan() {
const container = document.getElementById('plan-summary');
container.innerHTML = `
`;
// This is a simplified render for the screen; PDF will have tables
renderList('medications', 'plan-meds', item => { const p = document.createElement('p'); p.textContent = `${item.name} (${item.dosage}) - ${item.frequency}`; return p; });
renderList('symptoms', 'plan-symptoms', item => { const p = document.createElement('p'); p.textContent = `${new Date(item.date).toLocaleDateString()}: ${item.description} (${item.severity}/10)`; return p; });
renderList('appointments', 'plan-appts', item => { const p = document.createElement('p'); p.textContent = `${new Date(item.date).toLocaleDateString()}: Dr. ${item.doctor}`; return p; });
renderList('goals', 'plan-goals', item => { const p = document.createElement('p'); p.textContent = item.description; return p; });
}
async function generatePDF() {
const { jsPDF } = window.jspdf;
const downloadBtn = document.getElementById('download-pdf-btn');
const originalButtonText = downloadBtn.textContent;
downloadBtn.textContent = 'Generating...';
downloadBtn.disabled = true;
const pdfWrapper = document.createElement('div');
pdfWrapper.style.position = 'absolute';
pdfWrapper.style.left = '-9999px';
pdfWrapper.style.top = '0';
pdfWrapper.style.width = '800px';
pdfWrapper.style.backgroundColor = 'white';
pdfWrapper.className = 'p-8';
const tableHeader = '
';
const tableFooter = '';
const medsTable = `Medications
${tableHeader}| Name | Dosage | Frequency | ${state.medications.map(i => `| ${i.name} | ${i.dosage} | ${i.frequency} |
`).join('')}${tableFooter}`;
const symptomsTable = `Symptoms
${tableHeader}| Date | Symptom | Severity | ${state.symptoms.map(i => `| ${new Date(i.date).toLocaleDateString()} | ${i.description} | ${i.severity}/10 |
`).join('')}${tableFooter}`;
const apptsTable = `Appointments
${tableHeader}| Date | Doctor | Notes | ${state.appointments.map(i => `| ${new Date(i.date).toLocaleDateString()} at ${i.time} | ${i.doctor} | ${i.notes} |
`).join('')}${tableFooter}`;
const goalsTable = `Goals
${tableHeader}| Goal | Target Date | ${state.goals.map(i => `| ${i.description} | ${new Date(i.targetDate).toLocaleDateString()} |
`).join('')}${tableFooter}`;
pdfWrapper.innerHTML = `
Health Management Plan
${new Date().toLocaleDateString()}
${medsTable}${symptomsTable}${apptsTable}${goalsTable}
`;
document.body.appendChild(pdfWrapper);
try {
const canvas = await html2canvas(pdfWrapper, { scale: 2, useCORS: true, logging: false });
const imgData = canvas.toDataURL('image/png');
const pdf = new jsPDF({ orientation: 'portrait', unit: 'px', format: 'a4' });
const pdfWidth = pdf.internal.pageSize.getWidth();
const pdfHeight = pdf.internal.pageSize.getHeight();
const imgWidth = canvas.width;
const imgHeight = canvas.height;
const ratio = imgWidth / imgHeight;
let finalImgWidth = pdfWidth;
let finalImgHeight = pdfWidth / ratio;
if (finalImgHeight > pdfHeight) {
finalImgHeight = pdfHeight;
finalImgWidth = pdfHeight * ratio;
}
pdf.addImage(imgData, 'PNG', 0, 0, finalImgWidth, finalImgHeight);
pdf.save('Health-Management-Plan.pdf');
} catch (error) {
console.error("PDF Generation Error:", error);
} finally {
document.body.removeChild(pdfWrapper);
downloadBtn.textContent = 'Download PDF Plan';
downloadBtn.disabled = false;
}
}
document.getElementById('download-pdf-btn').addEventListener('click', generatePDF);
// --- Initial Load ---
loadData();
renderMedications();
renderSymptoms();
renderAppointments();
renderGoals();
showTab(0);
// Set default date for symptom logger
symptomDate.valueAsDate = new Date();
});
