pediatric-ai-scribe-v3/public/components/chart.html
Daniel Onyejesi 4064ccf516 Fix quiz SQL bug, security hardening, componentize HTML, speed improvements
- Fix: "missing FROM-clause entry for table q" in quiz submission query
- Security: replace broken sanitizeHtml with allowlist-based sanitizer (prevents stored XSS)
- Security: whitelist table names in uniqueSlug() to prevent SQL injection pattern
- Security: replace raw err.message responses with generic errors in learning routes
- Security: cap admin logs query LIMIT to 500
- Refactor: break 1685-line index.html into 12 lazy-loaded component files (280 lines shell)
- Speed: add preconnect hints for Google Fonts and CDN
- Speed: defer all script tags for faster initial paint
- Speed: lazy-load tab HTML on activation (only active tab's DOM is parsed)
- Update: replace HIPAA notice with institution-guidelines cautionary note
2026-03-23 20:01:54 -04:00

104 lines
6 KiB
HTML

<div class="module-header">
<h2><i class="fas fa-clipboard-list"></i> Chart Review / Precharting</h2>
<p>Paste clinic notes, subspecialty notes, ED notes, labs → AI summarizes</p>
</div>
<div class="demographics-bar">
<div class="demo-field"><label>Patient Age</label><input type="text" id="cr-age" placeholder="e.g., 8 years"></div>
<div class="demo-field"><label>Gender</label><select id="cr-gender"><option value="">Select</option><option>Male</option><option>Female</option></select></div>
<div class="demo-field"><label>PMH</label><input type="text" id="cr-pmh" placeholder="e.g., hypothyroidism, vitiligo"></div>
<div class="demo-field">
<label>Review Type</label>
<select id="cr-type">
<option value="outpatient">Outpatient Clinic</option>
<option value="subspecialty">Subspecialty</option>
<option value="ed">ED Visit</option>
</select>
</div>
<div class="demo-field demo-field-model">
<label><i class="fas fa-robot"></i> Model</label>
<select class="tab-model-select"></select>
</div>
</div>
<!-- Save/Load bar -->
<div class="save-bar-wrap">
<div class="save-bar" id="chart-save-bar">
<div style="display:flex;align-items:center;gap:8px;flex:1;">
<i class="fas fa-tag" style="color:var(--g400);font-size:13px;"></i>
<input type="text" id="chart-label" class="save-label-input" placeholder="Patient label (e.g. John D, Visit #42)">
</div>
<button id="btn-chart-save" class="btn-sm btn-ghost"><i class="fas fa-floppy-disk"></i> Save</button>
<button id="btn-chart-load" class="btn-sm btn-ghost"><i class="fas fa-folder-open"></i> Load</button>
<button id="btn-chart-new" class="btn-sm btn-ghost" title="Clear all and start new patient" style="color:var(--red);"><i class="fas fa-rotate-left"></i> New</button>
</div>
<div id="chart-load-popover" class="enc-load-popover hidden">
<div class="enc-load-popover-inner">
<input type="text" id="chart-load-search" class="enc-load-search" placeholder="Search saved encounters...">
<button class="enc-pop-close btn-sm btn-ghost"><i class="fas fa-times"></i></button>
</div>
<div id="chart-pop-list" class="enc-pop-list"></div>
</div>
</div>
<!-- Visits -->
<div id="cr-visits-container">
<div class="card visit-card">
<div class="card-header">
<h3><i class="fas fa-calendar"></i> Visit / Note #1</h3>
<button class="btn-sm btn-ghost remove-visit-btn"><i class="fas fa-trash"></i></button>
</div>
<div class="note-entry">
<div class="note-meta">
<input type="date" class="visit-date">
<select class="visit-type">
<option value="outpatient">Outpatient Visit</option>
<option value="subspecialty">Subspecialty Note</option>
<option value="ed">ED Visit</option>
</select>
<input type="text" class="visit-specialist" placeholder="Specialist name (if subspecialty)">
<input type="text" class="visit-specialty" placeholder="Specialty (e.g., Endocrinology)">
</div>
<div class="editable-box visit-content" contenteditable="true" data-placeholder="Paste note here..."></div>
<textarea class="visit-labs" placeholder="Labs from this visit (optional)" rows="3"></textarea>
</div>
</div>
</div>
<button id="cr-add-visit" class="btn-sm btn-ghost" style="margin:8px 0"><i class="fas fa-plus"></i> Add Visit/Note</button>
<!-- Labs -->
<div class="card">
<div class="card-header"><h3><i class="fas fa-flask"></i> Additional Labs</h3><button id="cr-add-lab" class="btn-sm btn-ghost"><i class="fas fa-plus"></i> Add</button></div>
<div id="cr-labs-container">
<div class="lab-entry">
<input type="date" class="lab-date">
<textarea class="lab-values" placeholder="Lab results..." rows="3"></textarea>
</div>
</div>
</div>
<div class="card">
<div class="card-header"><h3><i class="fas fa-comment-dots"></i> Instructions (optional)</h3></div>
<input type="text" id="cr-instructions" class="full-input" placeholder="e.g., 'Focus on thyroid management', 'Include medication changes'">
</div>
<button id="cr-generate-btn" class="btn-generate btn-generate-green"><i class="fas fa-wand-magic-sparkles"></i> Generate Chart Review</button>
<div id="cr-output" class="card output-card hidden">
<div class="card-header output-header">
<h3><i class="fas fa-file-medical"></i> Chart Review</h3>
<div class="output-actions">
<span id="cr-model-tag" class="model-tag"></span>
<button class="btn-sm btn-primary" onclick="copyText('cr-review-text')"><i class="fas fa-copy"></i> Copy</button>
<button class="btn-sm btn-ghost" onclick="speakText('cr-review-text')"><i class="fas fa-volume-high"></i> Read</button>
<button class="btn-sm btn-ghost" onclick="exportToNextcloud('cr-review-text','chart-review')"><i class="fas fa-cloud-arrow-up"></i></button>
</div>
</div>
<div id="cr-review-text" class="output-text" contenteditable="true"></div>
<div class="refine-bar">
<input type="text" id="cr-refine-input" class="refine-input" placeholder="Tell AI to modify...">
<button class="btn-sm btn-primary" id="cr-refine-btn"><i class="fas fa-edit"></i> Refine</button>
<button class="btn-sm btn-ghost" id="cr-shorten-btn"><i class="fas fa-compress"></i> Shorter</button>
</div>
</div>