Peler

: / var / www / html / wp-content / themes / bayisihat-jurnal /
Filename : tpl-alat-berat.php
back
<?php
/* Template Name: Alat — Berat Bayi */
if (!defined('ABSPATH')) exit; get_header(); ?>
<?php echo bs_breadcrumbs_html(); ?>
<header class="wrap tool-hero">
  <p class="eyebrow">Alat percuma</p>
  <h1>Semakan Berat Bayi Ikut Umur</h1>
  <p>Masukkan umur &amp; berat bayi (0-24 bulan) — kami bandingkan dengan julat rujukan pertumbuhan antarabangsa (WHO) secara anggaran.</p>
</header>
<div class="wrap">
  <div class="tool-box reveal">
    <form class="tool-form" id="bb-form" onsubmit="return false">
      <div class="tool-field" style="max-width:180px">
        <label for="bb-g">Jantina bayi</label>
        <select id="bb-g"><option value="L">Lelaki</option><option value="P">Perempuan</option></select>
      </div>
      <div class="tool-field" style="max-width:200px">
        <label for="bb-umur">Umur (bulan)</label>
        <select id="bb-umur"><?php for($i=0;$i<=24;$i++){ echo '<option value="'.$i.'">'.$i.' bulan</option>'; } ?></select>
      </div>
      <div class="tool-field" style="max-width:200px">
        <label for="bb-berat">Berat semasa (kg)</label>
        <input type="number" id="bb-berat" min="1" max="25" step="0.01" placeholder="cth: 7.4" required>
      </div>
      <button class="btn btn--primary" type="submit">Semak</button>
    </form>
    <div class="tool-result" id="bb-result" aria-live="polite">
      <div class="tool-result__big" id="bb-band">—</div>
      <p id="bb-msg" style="color:var(--muted)"></p>
      <div class="weight-bar" aria-hidden="true"><div class="weight-marker" id="bb-marker" style="left:50%"></div></div>
      <div class="weight-scale"><span>Bawah julat</span><span>Julat biasa</span><span>Atas julat</span></div>
      <div class="tool-result__grid">
        <div class="tool-stat"><b id="bb-median">—</b><span>Purata rujukan umur ini</span></div>
        <div class="tool-stat"><b id="bb-range">—</b><span>Julat biasa (anggaran)</span></div>
      </div>
    </div>
  </div>
  <p class="tool-note"><strong>Penting:</strong> Ini <em>anggaran kasar</em> berdasarkan carta pertumbuhan WHO untuk rujukan umum sahaja — ia TIDAK menggantikan carta sebenar dalam buku rekod kesihatan (buku merah) atau penilaian jururawat/doktor. Corak pertumbuhan dari masa ke masa lebih penting daripada satu bacaan. Jika bimbang, bawa bayi ke klinik kesihatan. Baca lanjut: <a href="<?php echo esc_url(home_url('/berat-badan-bayi-normal/')); ?>">berat badan bayi normal ikut umur</a>.</p>
</div>
<section class="wrap section reveal"><?php echo bs_newsletter_form(); ?></section>
<script>
(function(){
  // Anggaran median berat (kg) WHO weight-for-age, bulan 0-24
  var MED = {
    L: [3.3,4.5,5.6,6.4,7.0,7.5,7.9,8.3,8.6,8.9,9.2,9.4,9.6,9.9,10.1,10.3,10.5,10.7,10.9,11.1,11.3,11.5,11.8,12.0,12.2],
    P: [3.2,4.2,5.1,5.8,6.4,6.9,7.3,7.6,7.9,8.2,8.5,8.7,8.9,9.2,9.4,9.6,9.8,10.0,10.2,10.4,10.6,10.9,11.1,11.3,11.5]
  };
  var CV = { L: 0.115, P: 0.12 };
  document.getElementById('bb-form').addEventListener('submit', function(){
    var g = document.getElementById('bb-g').value;
    var m = parseInt(document.getElementById('bb-umur').value, 10);
    var w = parseFloat(document.getElementById('bb-berat').value);
    if (!w || w <= 0) return;
    var med = MED[g][m], sd = med * CV[g];
    var z = (w - med) / sd;
    var lo = (med - 2 * sd).toFixed(1), hi = (med + 2 * sd).toFixed(1);
    var band, msg;
    if (z < -3) { band = 'Jauh di bawah julat'; msg = 'Berat ini jauh di bawah julat rujukan. Sila bawa bayi ke klinik kesihatan untuk penilaian — jangan tunggu.'; }
    else if (z < -2) { band = 'Di bawah julat biasa'; msg = 'Sedikit di bawah julat rujukan. Tak semestinya ada masalah, tetapi elok bincang dengan jururawat/doktor pada lawatan klinik akan datang.'; }
    else if (z <= 2) { band = 'Dalam julat biasa ✅'; msg = 'Berat bayi berada dalam julat pertumbuhan biasa untuk umur & jantinanya. Teruskan pemantauan berkala di klinik.'; }
    else if (z <= 3) { band = 'Di atas julat biasa'; msg = 'Sedikit di atas julat rujukan — biasanya tidak membimbangkan, tapi boleh dibincang dengan doktor pada lawatan seterusnya.'; }
    else { band = 'Jauh di atas julat'; msg = 'Berat ini jauh di atas julat rujukan. Elok dapatkan penilaian di klinik kesihatan.'; }
    document.getElementById('bb-band').textContent = band;
    document.getElementById('bb-msg').textContent = msg;
    document.getElementById('bb-median').textContent = '±' + med.toFixed(1) + ' kg';
    document.getElementById('bb-range').textContent = lo + ' – ' + hi + ' kg';
    var pct = Math.max(2, Math.min(98, 50 + (z / 3.2) * 48));
    document.getElementById('bb-marker').style.left = pct + '%';
    document.getElementById('bb-result').classList.add('show');
  });
})();
</script>
<?php get_footer(); ?>