Skip to content

Commit 1f121bc

Browse files
Merge pull request #78 from BUMETCS673/feature/download-medical-records
feature/download medical records pdf dev V.2
2 parents dd5e838 + b611cc3 commit 1f121bc

File tree

12 files changed

+530
-98
lines changed

12 files changed

+530
-98
lines changed

code/mymedic/static/css/dashboard.css

Lines changed: 96 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -69,6 +69,85 @@
6969
text-align: center;
7070
}
7171

72+
.header-title {
73+
color: rgb(170, 255, 222);
74+
font-size: 1.5rem;
75+
font-weight: 700;
76+
margin: 0;
77+
}
78+
79+
/* Search Section */
80+
.search-section {
81+
margin-bottom: 1rem;
82+
}
83+
84+
.search-card {
85+
background: rgba(255, 255, 255, 0.95);
86+
border-radius: 15px;
87+
padding: 2rem;
88+
padding-top: 1rem;
89+
padding-bottom: 0.25rem;
90+
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
91+
backdrop-filter: blur(10px);
92+
}
93+
94+
.search-title {
95+
color: #343a40;
96+
font-size: 1.5rem;
97+
font-weight: 700;
98+
margin-bottom: 0.5rem;
99+
}
100+
101+
.search-row {
102+
display: flex;
103+
align-items: center;
104+
gap: 10px;
105+
margin-top: 10px;
106+
}
107+
108+
#search-input {
109+
flex: 1;
110+
padding: 10px;
111+
font-size: 16px;
112+
border: 1px solid #ccc;
113+
border-radius: 5px;
114+
box-sizing: border-box;
115+
}
116+
117+
.btn {
118+
border-radius: 5px !important;
119+
font-weight: 600;
120+
}
121+
122+
.btn-success {
123+
background-color: #20b2aa !important;
124+
border-color: #20b2aa !important;
125+
}
126+
127+
.btn-success:hover:not(:disabled) {
128+
background-color: #1a9999 !important;
129+
border-color: #1a9999 !important;
130+
box-shadow: 0 5px 15px rgba(32, 178, 170, 0.3);
131+
}
132+
133+
.btn:disabled {
134+
opacity: 0.6;
135+
cursor: not-allowed;
136+
}
137+
138+
#search-results {
139+
margin-top: 20px;
140+
font-size: 15px;
141+
color: #555;
142+
text-align: center;
143+
}
144+
145+
.header-title {
146+
color: rgb(170, 255, 222);
147+
font-size: 1.5rem;
148+
font-weight: 700;
149+
margin: 0;
150+
}
72151
/* Welcome Section */
73152
.welcome-section {
74153
margin-bottom: 2rem;
@@ -142,6 +221,15 @@
142221
margin: 0 auto 1rem;
143222
}
144223

224+
.stat-icon.profile-icon {
225+
background: linear-gradient(45deg, #20b2aa, #008b8b); /* teal like appointments */
226+
width: 30px;
227+
height: 30px;
228+
border-radius: 50%;
229+
display: inline-block;
230+
vertical-align: middle;
231+
}
232+
145233
.stat-icon.upcoming {
146234
background: linear-gradient(45deg, #20b2aa, #008b8b);
147235
}
@@ -209,6 +297,14 @@
209297
background: linear-gradient(45deg, #20b2aa, #008b8b);
210298
}
211299

300+
.action-icon.records{
301+
background: linear-gradient(45deg, #667eea, #764ba2);
302+
}
303+
304+
.action-icon.prescriptions {
305+
background: linear-gradient(45deg, #4facfe, #00f2fe);
306+
}
307+
212308
.action-title {
213309
color: #343a40;
214310
font-size: 1.25rem;
Lines changed: 62 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
body {
2+
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
3+
min-height: 100vh;
4+
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
5+
}
6+
.header {
7+
background: rgba(255, 255, 255, 0.1);
8+
backdrop-filter: blur(10px);
9+
padding: 1rem 2rem;
10+
}
11+
.logo {
12+
color: white;
13+
font-size: 1.8rem;
14+
font-weight: 800;
15+
text-decoration: none;
16+
display: flex;
17+
align-items: center;
18+
gap: 0.5rem;
19+
}
20+
.user-info {
21+
color: white;
22+
font-weight: 500;
23+
}
24+
.nav-btn {
25+
margin-left: 0.5rem;
26+
}
27+
.record-card {
28+
background: rgba(255, 255, 255, 0.95);
29+
border-radius: 15px;
30+
padding: 1.5rem;
31+
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
32+
height: 100%;
33+
position: relative;
34+
}
35+
36+
.section-title {
37+
color: #ffeb3b;
38+
font-weight: 700;
39+
}
40+
41+
.section-subtitle {
42+
color: #ffeb3b;
43+
font-size: 1rem;
44+
opacity: 0.95;
45+
}
46+
47+
button.btn-download {
48+
background-color: #ffc107 !important;
49+
color: #343a40;
50+
border: none;
51+
font-weight: 500;
52+
padding: 8px 16px;
53+
border-radius: 8px;
54+
transition: all 0.3s ease;
55+
box-shadow: 0 4px 8px rgba(255, 193, 7, 0.3);
56+
}
57+
58+
button.btn-download:hover {
59+
background-color: #e0a800 !important;
60+
color: white;
61+
transform: translateY(-1px);
62+
}
Lines changed: 1 addition & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,3 @@
1-
function logout() {
2-
const logoutButton = document.querySelector('button[onclick="logout()"]');
3-
4-
if (logoutButton) {
5-
logoutButton.disabled = true;
6-
logoutButton.innerText = "Logging out...";
7-
}
8-
9-
localStorage.removeItem("access");
10-
11-
setTimeout(() => {
12-
window.location.href = "/login/";
13-
}, 500);
14-
}
15-
161
document.addEventListener('DOMContentLoaded', function() {
172

183
const scheduleButtons = document.querySelectorAll('.action-card .btn');
@@ -22,12 +7,6 @@ document.addEventListener('DOMContentLoaded', function() {
227
});
238
}
249

25-
if (scheduleButtons[1]) {
26-
scheduleButtons[1].addEventListener('click', function() {
27-
alert('View records feature coming soon!');
28-
});
29-
}
30-
3110
if (scheduleButtons[2]) {
3211
scheduleButtons[2].addEventListener('click', function() {
3312
alert('Manage prescriptions feature coming soon!');
@@ -55,30 +34,4 @@ document.addEventListener('DOMContentLoaded', function() {
5534
this.style.transform = 'translateY(0)';
5635
});
5736
});
58-
});
59-
60-
async function validateToken() {
61-
const token = localStorage.getItem("access");
62-
if (!token) return false;
63-
64-
try {
65-
const res = await fetch("/api/validate-token/", {
66-
method: "GET",
67-
headers: {
68-
"Authorization": `Bearer ${token}`,
69-
"Content-Type": "application/json"
70-
}
71-
});
72-
73-
if (!res.ok) {
74-
localStorage.removeItem("access");
75-
window.location.href = "/login/";
76-
return false;
77-
}
78-
79-
return true;
80-
} catch (error) {
81-
console.log("Token validation failed:", error);
82-
return true;
83-
}
84-
}
37+
});
Lines changed: 91 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,91 @@
1+
document.addEventListener("DOMContentLoaded", function () {
2+
const container = document.getElementById("records-container");
3+
const previewBody = document.getElementById("preview-body");
4+
const downloadBtn = document.getElementById("download-btn");
5+
const confirmDownloadBtn = document.getElementById("confirm-download");
6+
const retryBtn = document.getElementById("retry-btn");
7+
const errorContainer = document.getElementById("error-container");
8+
const recordMessage = document.getElementById("record-message");
9+
10+
const records = [
11+
{ title: "Annual Physical Exam", date: "2024-01-15", summary: "Routine check-up. Vitals normal. No follow-up needed." },
12+
{ title: "Blood Test Report", date: "2024-02-20", summary: "Slightly elevated cholesterol. Recommended dietary changes." },
13+
{ title: "Flu Vaccination", date: "2024-03-05", summary: "Administered seasonal influenza vaccine. No side effects." },
14+
{ title: "Dermatology Consultation", date: "2024-04-12", summary: "Treated for mild eczema. Prescribed topical corticosteroid." },
15+
{ title: "Eye Examination", date: "2024-05-18", summary: "20/20 vision confirmed. No corrective lenses required." },
16+
{ title: "MRI Scan (Knee)", date: "2024-06-22", summary: "Minor inflammation observed. Recommended physiotherapy." },
17+
{ title: "Cardiology Checkup", date: "2024-07-15", summary: "Heart function normal. No abnormalities detected." },
18+
{ title: "Dental Cleaning", date: "2024-08-05", summary: "Teeth cleaned. No cavities or issues noted." },
19+
{ title: "Allergy Testing", date: "2024-09-10", summary: "Positive for dust mites and pollen. Prescribed antihistamines." },
20+
{ title: "COVID-19 Booster Shot", date: "2024-10-02", summary: "Booster administered. Mild soreness at injection site." },
21+
{ title: "Nutrition Counseling", date: "2024-11-08", summary: "Advised on low-sodium diet for better blood pressure management." },
22+
{ title: "Physical Therapy Follow-Up", date: "2024-12-15", summary: "Improved mobility after 6 sessions. Continued exercises recommended." },
23+
{ title: "Annual Physical Exam", date: "2025-01-10", summary: "Routine check-up. Vitals normal. Follow-up appointment scheduled." },
24+
{ title: "Blood Test Report", date: "2025-02-11", summary: "Cholesterol levels improved. Continue current diet plan." },
25+
{ title: "Flu Vaccination", date: "2025-03-12", summary: "Administered seasonal influenza vaccine. No adverse reactions." },
26+
{ title: "Dermatology Consultation", date: "2025-04-13", summary: "Eczema well-controlled. Continue current treatment regimen." },
27+
{ title: "Eye Examination", date: "2025-05-14", summary: "Vision remains stable at 20/20. Annual follow-up recommended." },
28+
{ title: "MRI Scan (Knee)", date: "2025-06-15", summary: "Significant improvement in inflammation. Continue physiotherapy." }
29+
];
30+
31+
// Update dashboard stats
32+
localStorage.setItem("medical_records_count", records.length);
33+
34+
function loadRecords() {
35+
container.innerHTML = "";
36+
37+
if (records.length === 0) {
38+
if (recordMessage) {
39+
recordMessage.style.display = "block";
40+
}
41+
downloadBtn.disabled = true;
42+
return;
43+
}
44+
45+
records.forEach((r) => {
46+
const col = document.createElement("div");
47+
col.className = "col-md-4";
48+
col.innerHTML = `
49+
<div class='record-card'>
50+
<div class='record-title'>${r.title}</div>
51+
<div class='record-date'>${r.date}</div>
52+
<div class='record-summary'>${r.summary}</div>
53+
</div>`;
54+
container.appendChild(col);
55+
});
56+
57+
container.style.display = "flex";
58+
errorContainer.style.display = "none";
59+
downloadBtn.disabled = false;
60+
61+
if (recordMessage) {
62+
recordMessage.style.display = "none";
63+
}
64+
}
65+
66+
retryBtn?.addEventListener("click", loadRecords);
67+
68+
downloadBtn.addEventListener("click", () => {
69+
let html = "<h4>Preview</h4>";
70+
records.forEach((r) => {
71+
html += `<div><b>${r.title}</b><br>Date: ${r.date}<br>${r.summary}</div><hr>`;
72+
});
73+
previewBody.innerHTML = html;
74+
new bootstrap.Modal(document.getElementById("previewModal")).show();
75+
});
76+
77+
confirmDownloadBtn.addEventListener("click", () => {
78+
const { jsPDF } = window.jspdf;
79+
const doc = new jsPDF();
80+
let y = 20;
81+
records.forEach((r) => {
82+
doc.text(`• ${r.title}`, 10, y += 10);
83+
doc.text(`Date: ${r.date}`, 15, y += 8);
84+
doc.text(`Summary: ${r.summary}`, 15, y += 8);
85+
y += 10;
86+
});
87+
doc.save("Medical_Records.pdf");
88+
});
89+
90+
loadRecords();
91+
});

0 commit comments

Comments
 (0)