From cd0b78d5fdca7730f02dc02e3c42eae140248421 Mon Sep 17 00:00:00 2001 From: DevSoftTech Server Date: Sat, 29 Aug 2026 03:30:39 +0530 Subject: [PATCH] style(doctor): upgrade mobile doctor app UI with Inter typography, initial avatars, status dot indicators, and executive glassmorphic cards --- public/App/Doctor/index.html | 551 +++++++++++++++++++++++------------ 1 file changed, 366 insertions(+), 185 deletions(-) diff --git a/public/App/Doctor/index.html b/public/App/Doctor/index.html index 8799770..a9b7b76 100644 --- a/public/App/Doctor/index.html +++ b/public/App/Doctor/index.html @@ -5,12 +5,15 @@ Doctor EMR & Bedside Care PWA App - + - + + + + @@ -22,69 +25,221 @@ @@ -150,7 +297,6 @@ const [activeOpd, setActiveOpd] = useState(null); const [workspaceEntries, setWorkspaceEntries] = useState([]); const [newTreatmentNote, setNewTreatmentNote] = useState(''); - const [emrTab, setEmrTab] = useState('vitals'); const [installPrompt, setInstallPrompt] = useState(null); // Auth state @@ -162,7 +308,7 @@ const [newPin, setNewPin] = useState(''); const [confirmPin, setConfirmPin] = useState(''); - // OPD Prescription Consultation Controls State (Full Copy of HMS Functionality) + // OPD Prescription Consultation Controls State const [prescForm, setPrescForm] = useState({ chief_complaints: '', finding_examinations: '', @@ -511,6 +657,13 @@ return searchQuery === '' || name.includes(q) || uhid.includes(q) || ipdCode.includes(q) || docName.includes(q); }); + const getInitials = (nameStr) => { + if (!nameStr) return 'P'; + const parts = nameStr.trim().split(' '); + if (parts.length >= 2) return (parts[0][0] + parts[1][0]).toUpperCase(); + return nameStr.substring(0, 2).toUpperCase(); + }; + // ------------------------------------------------------------- // RENDER: LOCK SCREEN (PIN AUTHENTICATION) // ------------------------------------------------------------- @@ -518,9 +671,9 @@ return (
-
- -
DoctorCare EMR App
+
+ +
Doctor EMR Mobile Portal
30-Day Device Authentication Security
@@ -532,7 +685,7 @@
setPinInput(e.target.value)} @@ -559,8 +712,8 @@
-
) : ( @@ -573,7 +726,7 @@ setNewPin(e.target.value)} @@ -584,14 +737,14 @@ setConfirmPin(e.target.value)} />
-
)} @@ -608,18 +761,22 @@
{/* Top Doctor Header */}
-
- +
+
+ {getInitials(authenticatedDoctor.name)} +
{authenticatedDoctor.name}
- Doctor EMR 30-Day Device Auth + + Doctor EMR ● Active Session +
- -
@@ -629,107 +786,119 @@
{!activeOpd && !activePatient ? (
- {/* Top Main Tabs */} -
    -
  • - -
    • -
  • - -
    • -
+ {/* Segmented Tab Controller */} +
+ + +
{mainTab === 'opd' ? (
- {/* Status Filter Badges (Matching HMS Screen) */} -
+ {/* Status Filter Pills Bar */} +
- {/* Search Input */} -
- + {/* Search Input Bar */} +
+ setSearchQuery(e.target.value)} /> + {searchQuery && ( + + )}
- {/* MOBILE PROFESSIONAL CARDS LIST (Phones < 768px - NO Left-Right Scroll Needed!) */} + {/* ULTRA-PREMIUM MOBILE PATIENT CARDS LIST */}
{filteredOpdAppointments.length === 0 ? ( -
+
+ No OPD appointments found for selected filter.
) : ( filteredOpdAppointments.map(app => { - const statusBadgeClass = app.status_key === 'waiting' ? 'bg-primary' - : app.status_key === 'visited' ? 'bg-info text-dark' - : app.status_key === 'booked' ? 'bg-secondary' : 'bg-danger'; + const statusClass = app.status_key === 'waiting' ? 'waiting' + : app.status_key === 'visited' ? 'visited' + : 'booked'; return ( -
+
+ {/* Card Header Row */}
- Q #{app.queue_no || app.opd_no || '1'} - - {app.status_label} + Q #{app.queue_no || app.opd_no || '1'} + + ● {app.status_label}
- {app.opd_code} + {app.opd_code}
-
-
{app.patient_display_name}
-
- - {app.age_display || '47 Year'} / {app.gender_label} - - - {app.uhid || '-'} - - - {app.opd_type || 'Cash'} - + {/* Patient Info Row with Avatar */} +
+
+ {getInitials(app.patient_display_name)} +
+
+
+ {app.patient_display_name} +
+
+ + {app.age_display || '47 Year'} • {app.gender_label} + + + {app.uhid || '-'} + + + {app.opd_type || 'Cash'} + +
+ {/* Action Button Row */}
@@ -739,7 +908,7 @@
{/* DESKTOP TABLE VIEW (Monitors >= 768px) */} -
+
@@ -769,7 +938,7 @@ return ( @@ -778,12 +947,12 @@
{app.patient_display_name}
({app.age_display || '47 Year'} / {app.gender_label}) - +
- + {app.status_label} {app.queue_no || app.opd_no || '1'}{app.queue_no || app.opd_no || '1'} {app.uhid || '-'} {app.opd_type || 'Cash'} @@ -863,7 +1038,7 @@ {/* DESKTOP TABLE VIEW FOR IPD (Monitors >= 768px) */} -
+
@@ -907,7 +1082,7 @@
- Status: CURRENT ADMISSION + + ● CURRENT ADMISSION + -
+
{activePatient.patient_display_name}
- Demographics: {activePatient.age_display} / {activePatient.gender_label} - UHID: {activePatient.uhid} - IPD Code: {activePatient.ipd_code} - Bed: {activePatient.bed_label} +
+ {activePatient.age_display} • {activePatient.gender_label} + UHID: {activePatient.uhid} + IPD: {activePatient.ipd_code} + Bed: {activePatient.bed_label} +
{/* Write Doctor Round Note / Treatment Order */} -
- - -
{/* Bedside Log Entries */} -
+
Bedside Clinical Log History
{workspaceEntries.length === 0 ? (

No bedside log entries recorded yet.

) : ( workspaceEntries.map(e => ( -
+
{e.entry_type} {e.recorded_at} - by {e.recorded_by} @@ -978,36 +1157,38 @@ ------------------------------------------------------------- */
-
- -
{/* Patient Header Card */} -
+
{activeOpd.patient_display_name}
- Age / Gender: {activeOpd.age_display || '47 Year'} / {activeOpd.gender_label} - UHID: {activeOpd.uhid} - OPD No: {activeOpd.opd_code} +
+ {activeOpd.age_display || '47 Year'} • {activeOpd.gender_label} + UHID: {activeOpd.uhid} + OPD: {activeOpd.opd_code} +
- Q #{activeOpd.queue_no || '1'} + Q #{activeOpd.queue_no || '1'}
- {/* Vitals Entry Bar (Native HMS Controls) */} -
+ {/* Vitals Entry Bar */} +
Patient Vitals (BP, Pulse, Temp, SpO2, Weight)
@@ -1042,43 +1223,43 @@
{/* Chief Complaints */} -
+
{COMPLAINT_CHIPS.map(c => ( ))}
- +
{/* Clinical Examination & Findings */} -
+
{EXAMINATION_CHIPS.map(e => ( ))}
- +
{/* Provisional Diagnosis */} -
+
{DIAGNOSIS_CHIPS.map(d => ( ))}
- +
- {/* Medicines Rx Repeater (Native HMS Controls) */} -
+ {/* Medicines Rx Repeater */} +
- +
@@ -1088,7 +1269,7 @@
{medicines.map((med, idx) => ( -
+
Item #{idx + 1} {medicines.length > 1 && ( @@ -1127,17 +1308,17 @@
{/* Lab Investigations & Advice */} -
+
{LAB_CHIPS.map(lab => ( ))}
- + - +
@@ -1145,15 +1326,15 @@ ))}
- setPrescForm({...prescForm, next_visit: e.target.value})} /> + setPrescForm({...prescForm, next_visit: e.target.value})} />
- -