pediatric-ai-scribe-v3/public/components/soap.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

57 lines
3.4 KiB
HTML

<div class="module-header">
<h2><i class="fas fa-file-waveform"></i> SOAP Note Generator</h2>
<p>Generate full SOAP note or just Subjective from dictation/text</p>
</div>
<div class="demographics-bar">
<div class="demo-field"><label>Patient Age</label><input type="text" id="soap-age" placeholder="e.g., 5 years"></div>
<div class="demo-field"><label>Gender</label><select id="soap-gender"><option value="">Select</option><option>Male</option><option>Female</option></select></div>
<div class="demo-field">
<label>Generate</label>
<select id="soap-type">
<option value="full">Full SOAP Note</option>
<option value="subjective">Subjective Only</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>
<div class="card">
<div class="record-controls">
<button id="soap-record-btn" class="record-btn btn-teal"><i class="fas fa-microphone"></i><span>Dictate</span></button>
<div id="soap-recording-indicator" class="recording-indicator hidden"><div class="pulse-dot pulse-teal"></div><span>Dictating... <span id="soap-timer">00:00</span></span></div>
</div>
</div>
<div class="card">
<div class="card-header"><h3><i class="fas fa-file-lines"></i> Input</h3><button id="soap-clear" class="btn-sm btn-ghost"><i class="fas fa-eraser"></i> Clear</button></div>
<div id="soap-transcript" class="editable-box" contenteditable="true" data-placeholder="Dictate or type encounter details..."></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="soap-instructions" class="full-input" placeholder="e.g., 'Include assessment for otitis media', 'Add anticipatory guidance'">
</div>
<button id="soap-generate-btn" class="btn-generate btn-generate-teal"><i class="fas fa-wand-magic-sparkles"></i> Generate SOAP Note</button>
<div id="soap-output" class="card output-card hidden">
<div class="card-header output-header">
<h3><i class="fas fa-file-medical"></i> SOAP Note</h3>
<div class="output-actions">
<span id="soap-model-tag" class="model-tag"></span>
<button class="btn-sm btn-primary" onclick="copyText('soap-text')"><i class="fas fa-copy"></i> Copy</button>
<button class="btn-sm btn-ghost" onclick="speakText('soap-text')"><i class="fas fa-volume-high"></i> Read</button>
<button class="btn-sm btn-ghost" onclick="exportToNextcloud('soap-text','soap-note')"><i class="fas fa-cloud-arrow-up"></i></button>
</div>
</div>
<div id="soap-text" class="output-text" contenteditable="true"></div>
<div class="refine-bar">
<input type="text" id="soap-refine-input" class="refine-input" placeholder="Tell AI to modify...">
<button class="btn-sm btn-primary" id="soap-refine-btn"><i class="fas fa-edit"></i> Refine</button>
<button class="btn-sm btn-ghost" id="soap-shorten-btn"><i class="fas fa-compress"></i> Shorter</button>
</div>
</div>