danvics/pediatric-ai-scribe-v3
1
0
Fork 0
Code Issues Pull requests Projects Releases 14 Packages Wiki Activity Actions
pediatric-ai-scribe-v3/public/components/calculators.html
Daniel 059fbefa7e Add automatic ICD-10 and CPT billing code suggestions 
New feature: after generating any clinical note, the app automatically
suggests relevant billing codes displayed as clickable chips below the output.

Backend (src/routes/billing.js):
- POST /api/suggest-codes endpoint analyzes note text
- Extracts diagnoses from Assessment section via regex
- Looks up ICD-10 codes: local common pediatric map (40+ conditions)
  first, then NLM Clinical Tables API for unknown terms
- Suggests CPT E/M codes based on note type, visit complexity,
  ROS/PE system counts, and MDM level estimation
- Supports: outpatient (new/established), well visit (age-based),
  ED, inpatient (admit/subsequent/discharge)

Frontend (public/js/app.js):
- suggestBillingCodes() renders collapsible card with ICD-10 and CPT chips
- Click any chip to copy the code to clipboard
- Shows E/M level assessment (diagnosis count, ROS, PE, MDM complexity)
- Disclaimer: "Suggestions only. Always verify codes."

Integration: called after note generation in all 6 tabs
(encounter, SOAP, sick visit, well visit, hospital course, chart review)
2026-04-11 01:50:17 +02:00

482 lines
32 KiB
HTML
Raw Blame History

<div class="module-header">
<h2><i class="fas fa-calculator"></i> Pediatric Calculators</h2>
<p>Clinical calculators for pediatric medicine</p>
</div>
<!-- Calculator selector pills -->
<div style="display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px;">
<button class="calc-nav-pill active" data-calc="bp">BP Percentile</button>
<button class="calc-nav-pill" data-calc="bmi">BMI Percentile</button>
<button class="calc-nav-pill" data-calc="growth">Growth Charts</button>
<button class="calc-nav-pill" data-calc="bili">Bilirubin</button>
<button class="calc-nav-pill" data-calc="vitals">Vital Signs</button>
<button class="calc-nav-pill" data-calc="bsa">Body Surface Area</button>
<button class="calc-nav-pill" data-calc="dose">Weight-Based Dosing</button>
</div>
<!-- ═══════════ BP PERCENTILE CALCULATOR ═══════════ -->
<div id="calc-bp" class="calc-panel">
<div class="card">
<div class="card-header">
<h3><i class="fas fa-heart-pulse"></i> Blood Pressure Percentile</h3>
<span style="font-size:11px;color:var(--g500);">AAP 2017 Clinical Practice Guideline</span>
</div>
<div style="padding:16px;">
<p style="font-size:12px;color:var(--g500);margin:0 0 16px;">Based on normative tables for normal-weight children ages 1-17. Flynn et al., Pediatrics 2017;140(3):e20171904.</p>
<div class="calc-grid">
<div class="calc-field">
<label>Age (years)</label>
<input type="number" id="bp-age" min="1" max="17" step="1" placeholder="1-17">
</div>
<div class="calc-field">
<label>Sex</label>
<select id="bp-sex"><option value="">Select</option><option value="male">Male</option><option value="female">Female</option></select>
</div>
<div class="calc-field">
<label>Height (cm)</label>
<input type="number" id="bp-height" min="50" max="200" step="0.1" placeholder="e.g. 110">
</div>
<div class="calc-field">
<label>Systolic BP (mmHg)</label>
<input type="number" id="bp-systolic" min="50" max="250" placeholder="e.g. 105">
</div>
<div class="calc-field">
<label>Diastolic BP (mmHg)</label>
<input type="number" id="bp-diastolic" min="30" max="150" placeholder="e.g. 65">
</div>
</div>
<button id="btn-calc-bp" class="btn-sm btn-primary" style="margin-top:12px;"><i class="fas fa-calculator"></i> Calculate</button>
<button id="btn-clear-bp" class="btn-sm btn-ghost" style="margin-top:12px;">Clear</button>
<div id="bp-result" class="calc-result hidden"></div>
<div id="bp-chart-container" class="chart-container hidden"><canvas id="bp-chart-canvas"></canvas></div>
<details style="margin-top:16px;font-size:12px;border:1px solid var(--g200);border-radius:8px;padding:0;">
<summary style="padding:10px 14px;cursor:pointer;font-weight:600;color:var(--g700);background:var(--g50);border-radius:8px;">Definitions: Hypertension &amp; Hypotension (AAP 2017 / Nelson)</summary>
<div style="padding:12px 14px;">
<p style="font-weight:700;color:var(--g800);margin:0 0 8px;">Hypertension Classification (AAP 2017)</p>
<table style="width:100%;font-size:12px;border-collapse:collapse;margin-bottom:14px;">
<thead><tr style="background:var(--g100);"><th style="padding:6px 8px;text-align:left;border:1px solid var(--g200);">Category</th><th style="padding:6px 8px;text-align:left;border:1px solid var(--g200);">Ages 1 to &lt;13 years</th><th style="padding:6px 8px;text-align:left;border:1px solid var(--g200);">Ages &ge;13 years</th></tr></thead>
<tbody>
<tr><td style="padding:6px 8px;border:1px solid var(--g200);font-weight:600;color:#10b981;">Normal</td><td style="padding:6px 8px;border:1px solid var(--g200);">&lt;90th percentile</td><td style="padding:6px 8px;border:1px solid var(--g200);">&lt;120/&lt;80 mmHg</td></tr>
<tr><td style="padding:6px 8px;border:1px solid var(--g200);font-weight:600;color:#f59e0b;">Elevated BP</td><td style="padding:6px 8px;border:1px solid var(--g200);">&ge;90th to &lt;95th percentile<br>OR 120/80 mmHg to &lt;95th (whichever lower)</td><td style="padding:6px 8px;border:1px solid var(--g200);">120-129/&lt;80 mmHg</td></tr>
<tr><td style="padding:6px 8px;border:1px solid var(--g200);font-weight:600;color:#f97316;">Stage 1 HTN</td><td style="padding:6px 8px;border:1px solid var(--g200);">&ge;95th percentile to &lt;95th + 12 mmHg<br>OR 130/80-139/89 mmHg (whichever lower)</td><td style="padding:6px 8px;border:1px solid var(--g200);">130/80 to 139/89 mmHg</td></tr>
<tr><td style="padding:6px 8px;border:1px solid var(--g200);font-weight:600;color:#ef4444;">Stage 2 HTN</td><td style="padding:6px 8px;border:1px solid var(--g200);">&ge;95th + 12 mmHg<br>OR &ge;140/90 mmHg (whichever lower)</td><td style="padding:6px 8px;border:1px solid var(--g200);">&ge;140/90 mmHg</td></tr>
</tbody>
</table>
<p style="font-weight:700;color:var(--g800);margin:0 0 6px;">Hypertensive Urgency vs Emergency (Nelson)</p>
<ul style="margin:0 0 14px;padding-left:18px;color:var(--g700);line-height:1.7;">
<li><strong>Hypertensive urgency:</strong> Severe BP elevation (&gt;95th + 30 mmHg or &gt;180/120) WITHOUT end-organ damage. Requires reduction over 24-48 hours.</li>
<li><strong>Hypertensive emergency:</strong> Severe BP elevation WITH end-organ damage (encephalopathy, heart failure, retinopathy, renal injury). Requires immediate IV therapy with goal reduction of 25% in first 8 hours.</li>
</ul>
<p style="font-weight:700;color:var(--g800);margin:0 0 6px;">Hypotension (AAP/PALS)</p>
<ul style="margin:0 0 8px;padding-left:18px;color:var(--g700);line-height:1.7;">
<li><strong>Definition:</strong> Systolic BP below the 5th percentile for age, sex, and height.</li>
<li><strong>Quick estimate (1-10 years):</strong> Hypotension = SBP &lt; 70 + (2 &times; age in years) mmHg</li>
<li><strong>Neonates:</strong> SBP &lt; gestational age in weeks (term: &lt;60 mmHg)</li>
<li><strong>Clinical significance:</strong> Hypotension in children is a late sign of shock. Tachycardia, poor perfusion, and altered mental status typically precede hypotension.</li>
</ul>
<p style="font-size:11px;color:var(--g400);margin:8px 0 0;">Sources: Flynn JT et al., Pediatrics 2017;140(3). Nelson Textbook of Pediatrics, 21st ed. PALS Provider Manual.</p>
</div>
</details>
</div>
</div>
</div>
<!-- ═══════════ BMI PERCENTILE CALCULATOR ═══════════ -->
<div id="calc-bmi" class="calc-panel hidden">
<div class="card">
<div class="card-header">
<h3><i class="fas fa-weight-scale"></i> BMI Percentile</h3>
<span style="font-size:11px;color:var(--g500);">CDC Growth Charts, ages 2-20</span>
</div>
<div style="padding:16px;">
<p style="font-size:12px;color:var(--g500);margin:0 0 16px;">Based on CDC 2000 growth reference data. For children ages 2-20 years.</p>
<div class="calc-grid">
<div class="calc-field">
<label>Age (years)</label>
<input type="number" id="bmi-age-yr" min="2" max="20" step="1" placeholder="e.g. 7" style="width:60%;display:inline-block;">
<select id="bmi-age-mo" style="width:35%;display:inline-block;padding:8px 4px;border:1.5px solid var(--g300);border-radius:6px;font-size:13px;">
<option value="0">0 mo</option><option value="1">1 mo</option><option value="2">2 mo</option><option value="3">3 mo</option>
<option value="4">4 mo</option><option value="5">5 mo</option><option value="6">6 mo</option><option value="7">7 mo</option>
<option value="8">8 mo</option><option value="9">9 mo</option><option value="10">10 mo</option><option value="11">11 mo</option>
</select>
</div>
<div class="calc-field">
<label>Sex</label>
<select id="bmi-sex"><option value="">Select</option><option value="male">Male</option><option value="female">Female</option></select>
</div>
<div class="calc-field">
<label>Weight (kg)</label>
<input type="number" id="bmi-weight" min="5" max="200" step="0.1" placeholder="e.g. 25">
</div>
<div class="calc-field">
<label>Height (cm)</label>
<input type="number" id="bmi-height" min="50" max="200" step="0.1" placeholder="e.g. 120">
</div>
</div>
<button id="btn-calc-bmi" class="btn-sm btn-primary" style="margin-top:12px;"><i class="fas fa-calculator"></i> Calculate</button>
<button id="btn-clear-bmi" class="btn-sm btn-ghost" style="margin-top:12px;">Clear</button>
<div id="bmi-result" class="calc-result hidden"></div>
<div id="bmi-chart-container" class="chart-container hidden"><canvas id="bmi-chart-canvas"></canvas></div>
</div>
</div>
</div>
<!-- ═══════════ BODY SURFACE AREA ═══════════ -->
<div id="calc-bsa" class="calc-panel hidden">
<div class="card">
<div class="card-header">
<h3><i class="fas fa-child"></i> Body Surface Area</h3>
<span style="font-size:11px;color:var(--g500);">Mosteller formula</span>
</div>
<div style="padding:16px;">
<p style="font-size:12px;color:var(--g500);margin:0 0 16px;">Mosteller formula: BSA (m2) = sqrt(height(cm) x weight(kg) / 3600)</p>
<div class="calc-grid">
<div class="calc-field">
<label>Weight (kg)</label>
<input type="number" id="bsa-weight" min="1" max="200" step="0.1" placeholder="e.g. 20">
</div>
<div class="calc-field">
<label>Height (cm)</label>
<input type="number" id="bsa-height" min="30" max="220" step="0.1" placeholder="e.g. 110">
</div>
</div>
<button id="btn-calc-bsa" class="btn-sm btn-primary" style="margin-top:12px;"><i class="fas fa-calculator"></i> Calculate</button>
<button id="btn-clear-bsa" class="btn-sm btn-ghost" style="margin-top:12px;">Clear</button>
<div id="bsa-result" class="calc-result hidden"></div>
</div>
</div>
</div>
<!-- ═══════════ WEIGHT-BASED DOSING ═══════════ -->
<div id="calc-dose" class="calc-panel hidden">
<div class="card">
<div class="card-header">
<h3><i class="fas fa-pills"></i> Weight-Based Dosing</h3>
</div>
<div style="padding:16px;">
<p style="font-size:12px;color:var(--g500);margin:0 0 16px;">Calculate dose based on weight. Always verify against formulary and institutional guidelines.</p>
<div class="calc-grid">
<div class="calc-field">
<label>Patient Weight (kg)</label>
<input type="number" id="dose-weight" min="1" max="200" step="0.1" placeholder="e.g. 15">
</div>
<div class="calc-field">
<label>Dose (mg/kg)</label>
<input type="number" id="dose-per-kg" min="0.01" step="0.01" placeholder="e.g. 10">
</div>
<div class="calc-field">
<label>Frequency</label>
<select id="dose-freq">
<option value="1">Once daily</option>
<option value="2">Twice daily (BID)</option>
<option value="3">Three times daily (TID)</option>
<option value="4">Four times daily (QID)</option>
<option value="6">Every 4 hours (Q4H)</option>
</select>
</div>
<div class="calc-field">
<label>Max single dose (mg, optional)</label>
<input type="number" id="dose-max" min="0" step="1" placeholder="e.g. 500">
</div>
<div class="calc-field">
<label>Concentration (mg/mL, optional)</label>
<input type="number" id="dose-conc" min="0" step="0.1" placeholder="e.g. 40">
</div>
</div>
<button id="btn-calc-dose" class="btn-sm btn-primary" style="margin-top:12px;"><i class="fas fa-calculator"></i> Calculate</button>
<button id="btn-clear-dose" class="btn-sm btn-ghost" style="margin-top:12px;">Clear</button>
<div id="dose-result" class="calc-result hidden"></div>
</div>
</div>
</div>
<!-- ═══════════ GROWTH CHARTS ═══════════ -->
<div id="calc-growth" class="calc-panel hidden">
<div class="card">
<div class="card-header">
<h3><i class="fas fa-chart-line"></i> Growth Percentiles</h3>
</div>
<div style="padding:16px;">
<div style="display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;">
<button class="calc-pill active" data-growth="wfa">Weight-for-Age</button>
<button class="calc-pill" data-growth="lfa">Length/Height-for-Age</button>
<button class="calc-pill" data-growth="hcfa">Head Circumference</button>
<button class="calc-pill" data-growth="wfl">Weight-for-Length</button>
<button class="calc-pill" data-growth="fenton">Fenton (Preterm)</button>
</div>
<p id="growth-source-text" style="font-size:12px;color:var(--g500);margin:0 0 14px;">WHO growth standards (0-2y) / CDC 2000 (2-20y).</p>
<div class="calc-grid">
<div class="calc-field">
<label>Sex</label>
<select id="growth-sex"><option value="">Select</option><option value="male">Male</option><option value="female">Female</option></select>
</div>
<div class="calc-field" id="growth-age-field">
<label>Age</label>
<div style="display:flex;gap:4px;align-items:center;">
<input type="number" id="growth-age-yr" min="0" max="20" step="1" placeholder="yr" style="width:40%;">
<select id="growth-age-mo" style="width:55%;padding:8px 4px;border:1.5px solid var(--g300);border-radius:6px;font-size:13px;">
<option value="0">0 mo</option><option value="1">1 mo</option><option value="2">2 mo</option><option value="3">3 mo</option>
<option value="4">4 mo</option><option value="5">5 mo</option><option value="6">6 mo</option><option value="7">7 mo</option>
<option value="8">8 mo</option><option value="9">9 mo</option><option value="10">10 mo</option><option value="11">11 mo</option>
</select>
</div>
</div>
<div class="calc-field" id="growth-ga-field" style="display:none;">
<label>Gestational Age (weeks)</label>
<input type="number" id="growth-ga" min="22" max="50" step="1" placeholder="22-50">
</div>
<div class="calc-field" id="growth-weight-field">
<label>Weight (kg)</label>
<input type="number" id="growth-weight" min="0.3" max="200" step="0.01" placeholder="e.g. 10.5">
</div>
<div class="calc-field" id="growth-length-field">
<label>Length/Height (cm)</label>
<input type="number" id="growth-length" min="20" max="200" step="0.1" placeholder="e.g. 75">
</div>
<div class="calc-field" id="growth-hc-field" style="display:none;">
<label>Head Circumference (cm)</label>
<input type="number" id="growth-hc" min="20" max="60" step="0.1" placeholder="e.g. 35">
</div>
</div>
<div id="growth-mph-section" style="display:none;margin-top:12px;padding:12px;background:var(--g50);border-radius:8px;">
<div style="font-size:12px;font-weight:600;color:var(--g600);margin-bottom:8px;">Mid-Parental Height (optional)</div>
<div class="calc-grid">
<div class="calc-field">
<label>Mother's Height (cm)</label>
<input type="number" id="growth-mother-ht" min="120" max="200" step="0.1" placeholder="e.g. 165">
</div>
<div class="calc-field">
<label>Father's Height (cm)</label>
<input type="number" id="growth-father-ht" min="140" max="220" step="0.1" placeholder="e.g. 178">
</div>
</div>
</div>
<button id="btn-calc-growth" class="btn-sm btn-primary" style="margin-top:12px;"><i class="fas fa-calculator"></i> Calculate</button>
<button id="btn-clear-growth" class="btn-sm btn-ghost" style="margin-top:12px;">Clear</button>
<div id="growth-result" class="calc-result hidden"></div>
<div id="growth-chart-container" class="chart-container hidden"><canvas id="growth-chart-canvas"></canvas></div>
</div>
</div>
</div>
<!-- ═══════════ BILIRUBIN NOMOGRAM ═══════════ -->
<div id="calc-bili" class="calc-panel hidden">
<div class="card">
<div class="card-header">
<h3><i class="fas fa-droplet"></i> Neonatal Bilirubin</h3>
</div>
<div style="padding:16px;">
<div style="display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;">
<button class="calc-pill active" data-bili="aap">AAP 2022 Phototherapy</button>
<button class="calc-pill" data-bili="bhutani">Bhutani Nomogram</button>
</div>
<div id="bili-aap-panel">
<p style="font-size:12px;color:var(--g500);margin:0 0 14px;">AAP 2022 Clinical Practice Guideline. Determines phototherapy threshold based on gestational age and risk factors.</p>
<details style="margin-bottom:14px;font-size:12px;border:1px solid var(--g200);border-radius:8px;padding:0;">
<summary style="padding:10px 14px;cursor:pointer;font-weight:600;color:var(--g700);background:var(--g50);border-radius:8px;">Neurotoxicity Risk Factors for Phototherapy Threshold (AAP 2022)</summary>
<div style="padding:12px 14px;">
<p style="font-weight:600;color:#ef4444;margin:0 0 6px;">Higher Risk (use lower threshold):</p>
<ul style="margin:0 0 10px;padding-left:18px;color:var(--g700);line-height:1.7;">
<li>Gestational age 35-37 weeks (with other risk factors)</li>
<li>Albumin &lt; 3.0 g/dL</li>
<li>Isoimmune hemolytic disease (ABO, Rh incompatibility)</li>
<li>G6PD deficiency</li>
<li>Asphyxia / significant lethargy</li>
<li>Sepsis</li>
<li>Acidosis (pH &lt; 7.15)</li>
<li>Temperature instability / hypothermia</li>
</ul>
<p style="font-weight:600;color:#10b981;margin:0 0 6px;">Lower Risk (use higher threshold):</p>
<ul style="margin:0;padding-left:18px;color:var(--g700);line-height:1.7;">
<li>Gestational age &ge; 38 weeks</li>
<li>No hemolysis</li>
<li>Well-appearing infant</li>
<li>No risk factors above</li>
</ul>
<p style="margin:8px 0 0;font-size:11px;color:var(--g400);">Source: AAP 2022 Clinical Practice Guideline</p>
</div>
</details>
<details style="margin-bottom:14px;font-size:12px;border:1px solid var(--g200);border-radius:8px;padding:0;">
<summary style="padding:10px 14px;cursor:pointer;font-weight:600;color:var(--g700);background:var(--g50);border-radius:8px;">Risk Factors for Severe Neonatal Hyperbilirubinemia (Nelson Table 137.1)</summary>
<div style="padding:12px 14px;">
<p style="font-weight:600;color:var(--g800);margin:0 0 6px;">Genetic Factors</p>
<ul style="margin:0 0 12px;padding-left:18px;color:var(--g700);line-height:1.6;">
<li>Gilbert syndrome</li>
<li>Crigler-Najjar syndrome</li>
<li>Alagille syndrome</li>
<li>&beta;-thalassemia</li>
<li>Glucose-6-phosphate dehydrogenase (G6PD) deficiency</li>
<li>Bilirubin glucuronosyltransferase polymorphism</li>
<li>Pyruvate kinase deficiency</li>
<li>Erythrocyte structural defects (hereditary spherocytosis, elliptocytosis)</li>
<li>Galactosemia</li>
</ul>
<p style="font-weight:600;color:var(--g800);margin:0 0 6px;">Maternal Factors</p>
<ul style="margin:0 0 12px;padding-left:18px;color:var(--g700);line-height:1.6;">
<li>Family history of severe jaundice, splenectomy, or cholecystectomy</li>
<li>Primiparity</li>
<li>Teenage pregnancy</li>
<li>Diabetes</li>
<li>Rhesus incompatibility</li>
<li>ABO incompatibility</li>
<li>Other blood group isoimmunization</li>
<li>Use of drugs during labor (oxytocin, promethazine, bupivacaine)</li>
<li>Exclusive breastfeeding</li>
</ul>
<p style="font-weight:600;color:var(--g800);margin:0 0 6px;">Perinatal Factors</p>
<ul style="margin:0 0 12px;padding-left:18px;color:var(--g700);line-height:1.6;">
<li>Mode of delivery (breech vs vertex, instrumentation)</li>
<li>Birth trauma (cephalohematoma, substantial bruising, extravasation)</li>
<li>Birth asphyxia</li>
<li>Congenital infections (CMV, syphilis)</li>
<li>Sepsis</li>
</ul>
<p style="font-weight:600;color:var(--g800);margin:0 0 6px;">Neonatal Factors</p>
<ul style="margin:0 0 12px;padding-left:18px;color:var(--g700);line-height:1.6;">
<li>Male sex</li>
<li>Prematurity or low birthweight and small-for-gestational age</li>
<li>Hypothyroidism</li>
<li>Polycythemia</li>
<li>Hypoglycemia</li>
<li>Low intake of breast milk, dehydration, or weight loss</li>
<li>Breast milk jaundice</li>
<li>Jaundice in the first day of life</li>
<li>Trisomy 21</li>
<li>Infant of diabetic mother</li>
<li>Cephalohematoma, other bruising</li>
</ul>
<p style="font-weight:600;color:var(--g800);margin:0 0 6px;">Other Risk Factors and Markers</p>
<ul style="margin:0 0 8px;padding-left:18px;color:var(--g700);line-height:1.6;">
<li>Previous sibling received phototherapy or exchange transfusion</li>
<li>Predischarge TSB or TcB in the high zone</li>
<li>Use of hemolytic agents (naphthalene, menthol-based products) in G6PD-deficient populations</li>
<li>Folate deficiency</li>
<li>Aflatoxins</li>
<li>Hypothermia</li>
<li>Birth outside of a healthcare facility</li>
</ul>
<p style="margin:8px 0 0;font-size:11px;color:var(--g400);">Modified from Olusanya BO, Kaplan M, Hansen TWR. Neonatal hyperbilirubinaemia: a global perspective. Lancet Child Adolesc Health. 2018;2:610-618. Nelson Textbook of Pediatrics, Table 137.1.</p>
</div>
</details>
<div class="calc-grid">
<div class="calc-field">
<label>Gestational Age (weeks)</label>
<select id="bili-ga">
<option value="">Select</option>
<option value="35">35 weeks</option>
<option value="36">36 weeks</option>
<option value="37">37 weeks</option>
<option value="38">38+ weeks</option>
</select>
</div>
<div class="calc-field">
<label>Age of Infant (hours)</label>
<input type="number" id="bili-age-hours" min="0" max="168" step="1" placeholder="e.g. 48">
</div>
<div class="calc-field">
<label>Total Serum Bilirubin (mg/dL)</label>
<input type="number" id="bili-tsb" min="0" max="35" step="0.1" placeholder="e.g. 12.5">
</div>
<div class="calc-field">
<label>Risk Factors</label>
<select id="bili-risk">
<option value="none">None (lower risk)</option>
<option value="medium">Neurotoxicity risk factors present</option>
</select>
</div>
</div>
<button id="btn-calc-bili-aap" class="btn-sm btn-primary" style="margin-top:12px;"><i class="fas fa-calculator"></i> Assess</button>
<button id="btn-clear-bili-aap" class="btn-sm btn-ghost" style="margin-top:12px;">Clear</button>
</div>
<div id="bili-bhutani-panel" style="display:none;">
<p style="font-size:12px;color:var(--g500);margin:0 0 14px;">Bhutani hour-specific bilirubin nomogram. Determines risk zone for infants >= 35 weeks GA.</p>
<div class="calc-grid">
<div class="calc-field">
<label>Age of Infant (hours)</label>
<input type="number" id="bhutani-age" min="12" max="144" step="1" placeholder="12-144">
</div>
<div class="calc-field">
<label>Total Serum Bilirubin (mg/dL)</label>
<input type="number" id="bhutani-tsb" min="0" max="25" step="0.1" placeholder="e.g. 8.5">
</div>
</div>
<button id="btn-calc-bhutani" class="btn-sm btn-primary" style="margin-top:12px;"><i class="fas fa-calculator"></i> Assess</button>
<button id="btn-clear-bhutani" class="btn-sm btn-ghost" style="margin-top:12px;">Clear</button>
</div>
<div id="bili-result" class="calc-result hidden"></div>
<div id="bili-chart-container" class="chart-container hidden"><canvas id="bili-chart-canvas"></canvas></div>
</div>
</div>
</div>
<!-- ═══════════ VITAL SIGNS BY AGE ═══════════ -->
<div id="calc-vitals" class="calc-panel hidden">
<div class="card">
<div class="card-header">
<h3><i class="fas fa-heartbeat"></i> Normal Vital Signs by Age</h3>
<span style="font-size:11px;color:var(--g500);">Harriet Lane Handbook</span>
</div>
<div style="padding:16px;">
<p style="font-size:12px;color:var(--g500);margin:0 0 14px;">Reference ranges for heart rate, respiratory rate, and blood pressure by age. Source: Harriet Lane Handbook.</p>
<div style="overflow-x:auto;">
<table class="admin-table" style="font-size:12px;width:100%;">
<thead>
<tr>
<th>Age</th>
<th>Heart Rate (bpm)</th>
<th>Respiratory Rate</th>
<th>Systolic BP (mmHg)</th>
<th>Diastolic BP (mmHg)</th>
<th>Weight (kg)</th>
</tr>
</thead>
<tbody>
<tr><td>Preterm</td><td>120-170</td><td>40-70</td><td>55-75</td><td>35-45</td><td>1-2.5</td></tr>
<tr><td>Newborn (0-1mo)</td><td>100-160</td><td>30-60</td><td>60-80</td><td>35-55</td><td>2.5-4.5</td></tr>
<tr><td>1-6 months</td><td>100-150</td><td>30-50</td><td>70-90</td><td>40-60</td><td>4-8</td></tr>
<tr><td>6-12 months</td><td>90-140</td><td>25-40</td><td>75-95</td><td>45-65</td><td>8-10</td></tr>
<tr><td>1-3 years</td><td>80-130</td><td>20-30</td><td>80-100</td><td>50-70</td><td>10-15</td></tr>
<tr><td>4-5 years</td><td>80-120</td><td>20-25</td><td>85-105</td><td>50-70</td><td>15-20</td></tr>
<tr><td>6-8 years</td><td>70-115</td><td>18-25</td><td>90-110</td><td>55-75</td><td>20-27</td></tr>
<tr><td>9-11 years</td><td>70-110</td><td>16-22</td><td>95-115</td><td>58-78</td><td>27-40</td></tr>
<tr><td>12-15 years</td><td>60-100</td><td>14-20</td><td>100-125</td><td>60-80</td><td>40-60</td></tr>
<tr><td>16-18 years</td><td>55-95</td><td>12-18</td><td>110-130</td><td>65-85</td><td>55-75</td></tr>
</tbody>
</table>
</div>
<div style="margin-top:16px;">
<h4 style="font-size:13px;font-weight:700;color:var(--g700);margin:0 0 8px;">Quick Reference Formulas</h4>
<div style="display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px;">
<div style="padding:10px;background:var(--g50);border-radius:8px;font-size:12px;">
<strong>Estimated Weight:</strong><br>
1-12mo: (age in mo + 9) / 2<br>
1-5yr: 2 x (age in yr) + 8<br>
6-12yr: 3 x (age in yr) + 7
</div>
<div style="padding:10px;background:var(--g50);border-radius:8px;font-size:12px;">
<strong>Min Systolic BP:</strong><br>
1-10yr: 70 + (2 x age in yr)<br>
Hypotension: SBP &lt; 5th %ile
</div>
<div style="padding:10px;background:var(--g50);border-radius:8px;font-size:12px;">
<strong>ETT Size:</strong><br>
Uncuffed: (age/4) + 4<br>
Cuffed: (age/4) + 3.5<br>
Depth: ETT size x 3
</div>
<div style="padding:10px;background:var(--g50);border-radius:8px;font-size:12px;">
<strong>Maintenance Fluids (4-2-1):</strong><br>
First 10kg: 4 mL/kg/hr<br>
Next 10kg: +2 mL/kg/hr<br>
Each kg above 20: +1 mL/kg/hr
</div>
</div>
</div>
</div>
</div>
</div>
Reference in a new issue View git blame Copy permalink