This commit is contained in:
Sveemaaa 2026-06-18 12:02:19 +07:00
parent 21029e9389
commit 6e75169b80
4 changed files with 147 additions and 142 deletions

View File

@ -160,21 +160,24 @@ public function cetakPdf(Request $request, $id)
}
// PengukuranBalitaController.php
public function getLastPengukuran($id)
public function getLastPengukuran($id)
{
$last = PengukuranBalita::where('balita_id', $id)
->orderBy('tanggal', 'desc')
->first();
->take(5)
->get();
if ($last) {
if ($last->isNotEmpty()) {
return response()->json([
'found' => true,
'tanggal' => $last->tanggal,
'usia_saat_ukur' => $last->usia_saat_ukur,
'berat_badan' => $last->berat_badan,
'tinggi_badan' => $last->tinggi_badan,
'lingkar_kepala' => $last->lingkar_kepala,
'hasil' => $last->hasil ?? null, // jika ada kolom ini
'found' => true,
'data' => $last->map(fn($item) => [
'tanggal' => $item->tanggal,
'usia' => $item->usia_saat_ukur,
'berat_badan' => $item->berat_badan,
'tinggi_badan' => $item->tinggi_badan,
'lingkar_kepala' => $item->lingkar_kepala,
'hasil' => $item->hasil ?? '-',
])
]);
}

View File

@ -160,17 +160,20 @@ public function getLastPengukuran($id)
{
$last = PengukuranIbuHamil::where('ibu_hamil_id', $id)
->orderBy('tanggal', 'desc')
->first();
->take(5)
->get();
if ($last) {
if ($last->isNotEmpty()) {
return response()->json([
'found' => true,
'tanggal' => $last->tanggal,
'usia_kehamilan' => $last->usia_kehamilan,
'berat_badan' => $last->berat_badan,
'tinggi_badan' => $last->tinggi_badan,
'lila' => $last->lila,
'status_gizi' => $last->status_gizi ?? null, // tambah ini
'found' => true,
'data' => $last->map(fn($item) => [
'tanggal' => $item->tanggal,
'usia_kehamilan' => $item->usia_kehamilan,
'berat_badan' => $item->berat_badan,
'tinggi_badan' => $item->tinggi_badan,
'lila' => $item->lila,
'status_gizi' => $item->status_gizi ?? '-',
])
]);
}

View File

@ -99,49 +99,30 @@
</div>
</div>
</div>
{{-- History Pengukuran Terakhir --}}
<div class="col-12" id="last-history" style="display: none;">
<div class="alert border-0 shadow-sm mb-2" style="border-radius: 14px; background: #fff5f0; border-left: 4px solid #FF782D !important;">
<div class="d-flex align-items-center mb-2">
<div class="border-0 shadow-sm p-3" style="border-radius: 14px; background: #fff5f0; border-left: 4px solid #FF782D !important;">
<div class="d-flex align-items-center mb-3">
<i class="bi bi-clock-history me-2" style="color: #FF782D; font-size: 1.1rem;"></i>
<strong style="color: #FF782D;">Pengukuran Terakhir</strong>
<span id="last-tanggal" class="ms-auto badge bg-light text-muted" style="font-size: 0.8rem;"></span>
<strong style="color: #FF782D;">Riwayat 5 Pengukuran Terakhir</strong>
</div>
<div class="row text-center g-2">
<div class="col-3">
<div class="p-2 bg-white rounded-3 shadow-sm">
<div class="text-muted small">Usia</div>
<div class="fw-bold fs-6" id="last-usia" style="color: #2c3e50;">-</div>
<div class="text-muted" style="font-size:0.75rem;">bulan</div>
</div>
</div>
<div class="col-3">
<div class="p-2 bg-white rounded-3 shadow-sm">
<div class="text-muted small">Berat Badan</div>
<div class="fw-bold fs-6" id="last-bb" style="color: #2c3e50;">-</div>
<div class="text-muted" style="font-size:0.75rem;">kg</div>
</div>
</div>
<div class="col-3">
<div class="p-2 bg-white rounded-3 shadow-sm">
<div class="text-muted small">Tinggi Badan</div>
<div class="fw-bold fs-6" id="last-tb" style="color: #2c3e50;">-</div>
<div class="text-muted" style="font-size:0.75rem;">cm</div>
</div>
</div>
<div class="col-3">
<div class="p-2 bg-white rounded-3 shadow-sm">
<div class="text-muted small">Lingkar Kepala</div>
<div class="fw-bold fs-6" id="last-lk" style="color: #2c3e50;">-</div>
<div class="text-muted" style="font-size:0.75rem;">cm</div>
</div>
</div>
</div>
{{-- Tampilkan status gizi jika ada --}}
<div id="last-status-wrap" class="mt-2 text-center" style="display:none;">
<span class="badge px-3 py-2" id="last-status"
style="border-radius: 20px; font-size: 0.85rem; background: #FF782D; color: white;">
</span>
<div class="table-responsive">
<table class="table table-bordered table-hover text-center align-middle mb-0" style="font-size: 0.875rem; border-radius: 10px; overflow: hidden;">
<thead style="background-color: #FF782D; color: white;">
<tr>
<th>Tanggal</th>
<th>Usia</th>
<th>Berat Badan</th>
<th>Tinggi Badan</th>
<th>Lingkar Kepala</th>
<th>Status Gizi</th>
</tr>
</thead>
<tbody id="last-history-tbody">
{{-- diisi via JavaScript --}}
</tbody>
</table>
</div>
</div>
</div>
@ -176,7 +157,8 @@
$('#balita_id').select2({
placeholder: 'Cari nama balita...',
allowClear: true,
width: '100%'
width: '100%',
dropdownParent: $('body')
});
$('#balita_id').on('change', function() {
@ -188,15 +170,14 @@
});
function updateData() {
let sel = document.getElementById("balita_id");
let opt = sel.options[sel.selectedIndex];
let opt = $('#balita_id option:selected');
if (opt && opt.value) {
let jk = opt.getAttribute("data-jk");
if (opt && opt.val()) {
let jk = opt.attr("data-jk");
document.getElementById("jk_display").value = (jk == 1) ? "Laki-laki" : "Perempuan";
document.getElementById("jk_input").value = jk;
let tglLahir = new Date(opt.getAttribute("data-tgl"));
let tglLahir = new Date(opt.attr("data-tgl"));
let tglUkur = new Date(document.getElementById("tanggal_ukur").value);
let totalBulan = (tglUkur.getFullYear() - tglLahir.getFullYear()) * 12
+ (tglUkur.getMonth() - tglLahir.getMonth());
@ -205,10 +186,10 @@ function updateData() {
document.getElementById("usia_display").value = (totalBulan < 0 ? 0 : totalBulan) + " Bulan";
document.getElementById("usia_input").value = (totalBulan < 0 ? 0 : totalBulan);
} else {
document.getElementById("jk_display").value = '';
document.getElementById("jk_input").value = '';
document.getElementById("jk_display").value = '';
document.getElementById("jk_input").value = '';
document.getElementById("usia_display").value = '';
document.getElementById("usia_input").value = '';
document.getElementById("usia_input").value = '';
}
}
@ -218,25 +199,48 @@ function fetchLastHistory(balitaId) {
return;
}
$.get(`/pengukuran-balita/last/${balitaId}`, function(data) {
if (data.found) {
$('#last-tanggal').text(data.tanggal);
$('#last-usia').text(data.usia_saat_ukur);
$('#last-bb').text(data.berat_badan);
$('#last-tb').text(data.tinggi_badan);
$('#last-lk').text(data.lingkar_kepala);
$.ajax({
url: `{{ url('/pengukuran-balita/last') }}/${balitaId}`,
type: 'GET',
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
success: function(data) {
if (data.found) {
let rows = '';
data.data.forEach(function(item, index) {
let badgeColor = '#6c757d';
let hasil = item.hasil || '-';
// Tampilkan status gizi jika ada
if (data.hasil) {
$('#last-status').text(data.hasil);
$('#last-status-wrap').show();
if (hasil.toLowerCase().includes('sangat pendek')) badgeColor = '#dc3545'; // merah
else if (hasil.toLowerCase().includes('pendek')) badgeColor = '#fd7e14'; // oranye
else if (hasil.toLowerCase().includes('normal')) badgeColor = '#28a745'; // hijau
else if (hasil.toLowerCase().includes('tinggi')) badgeColor = '#0d6efd'; // biru
rows += `
<tr ${index === 0 ? 'style="background:#fff5f0; font-weight:600;"' : ''}>
<td>${item.tanggal}</td>
<td>${item.usia} bulan</td>
<td>${item.berat_badan} kg</td>
<td>${item.tinggi_badan} cm</td>
<td>${item.lingkar_kepala} cm</td>
<td>
<span class="badge px-2 py-1" style="background:${badgeColor}; border-radius:20px;">
${hasil}
</span>
</td>
</tr>
`;
});
$('#last-history-tbody').html(rows);
$('#last-history').slideDown(300);
} else {
$('#last-status-wrap').hide();
$('#last-history').slideUp(300);
}
$('#last-history').slideDown(300);
} else {
$('#last-history').slideUp(300);
},
error: function(xhr) {
console.log('Error:', xhr.status, xhr.responseText);
}
});
}

View File

@ -128,46 +128,27 @@ class="form-control custom-input fs-5 fw-bold text-center"
{{-- History Pengukuran Terakhir --}}
<div class="col-12" id="last-history" style="display: none;">
<div class="alert border-0 shadow-sm mb-2" style="border-radius: 14px; background: #fff5f0; border-left: 4px solid #FF782D !important;">
<div class="d-flex align-items-center mb-2">
<div class="border-0 shadow-sm p-3" style="border-radius: 14px; background: #fff5f0; border-left: 4px solid #FF782D !important;">
<div class="d-flex align-items-center mb-3">
<i class="bi bi-clock-history me-2" style="color: #FF782D; font-size: 1.1rem;"></i>
<strong style="color: #FF782D;">Pengukuran Terakhir</strong>
<span id="last-tanggal" class="ms-auto badge bg-light text-muted" style="font-size: 0.8rem;"></span>
<strong style="color: #FF782D;">Riwayat 5 Pengukuran Terakhir</strong>
</div>
<div class="row text-center g-2">
<div class="col-3">
<div class="p-2 bg-white rounded-3 shadow-sm">
<div class="text-muted small">Usia Kehamilan</div>
<div class="fw-bold fs-6" id="last-usia-kehamilan" style="color: #2c3e50;">-</div>
<div class="text-muted" style="font-size:0.75rem;">minggu</div>
</div>
</div>
<div class="col-3">
<div class="p-2 bg-white rounded-3 shadow-sm">
<div class="text-muted small">Berat Badan</div>
<div class="fw-bold fs-6" id="last-bb" style="color: #2c3e50;">-</div>
<div class="text-muted" style="font-size:0.75rem;">kg</div>
</div>
</div>
<div class="col-3">
<div class="p-2 bg-white rounded-3 shadow-sm">
<div class="text-muted small">Tinggi Badan</div>
<div class="fw-bold fs-6" id="last-tb" style="color: #2c3e50;">-</div>
<div class="text-muted" style="font-size:0.75rem;">cm</div>
</div>
</div>
<div class="col-3">
<div class="p-2 bg-white rounded-3 shadow-sm">
<div class="text-muted small">LILA</div>
<div class="fw-bold fs-6" id="last-lila" style="color: #2c3e50;">-</div>
<div class="text-muted" style="font-size:0.75rem;">cm</div>
</div>
</div>
<div id="last-status-wrap" class="mt-2 text-center" style="display:none;">
<span class="badge px-3 py-2" id="last-status"
style="border-radius: 20px; font-size: 0.85rem; background: #FF782D; color: white;">
</span>
</div>
<div class="table-responsive">
<table class="table table-bordered table-hover text-center align-middle mb-0" style="font-size: 0.875rem; border-radius: 10px; overflow: hidden;">
<thead style="background-color: #FF782D; color: white;">
<tr>
<th>Tanggal</th>
<th>Usia Kehamilan</th>
<th>Berat Badan</th>
<th>Tinggi Badan</th>
<th>LILA</th>
<th>Status Gizi</th>
</tr>
</thead>
<tbody id="last-history-tbody">
{{-- diisi via JavaScript --}}
</tbody>
</table>
</div>
</div>
</div>
@ -227,29 +208,43 @@ class="form-control custom-input fs-5 fw-bold text-center"
// Fetch history pengukuran terakhir
if (ibuId) {
$.get(`/pengukuran-ibu-hamil/last/${ibuId}`, function(data) {
if (data.found) {
$('#last-tanggal').text(data.tanggal);
$('#last-usia-kehamilan').text(data.usia_kehamilan);
$('#last-bb').text(data.berat_badan);
$('#last-tb').text(data.tinggi_badan);
$('#last-lila').text(data.lila);
$.get(`/pengukuran-ibu-hamil/last/${ibuId}`, function(data) {
if (data.found) {
let rows = '';
data.data.forEach(function(item, index) {
let badgeColor = '#6c757d'; // default abu
let status = item.status_gizi ?? '-';
if (data.status_gizi) {
$('#last-status').text(data.status_gizi);
$('#last-status-wrap').show();
} else {
$('#last-status-wrap').hide();
}
if (status.toLowerCase().includes('kurang')) badgeColor = '#dc3545'; // merah
else if (status.toLowerCase().includes('normal')) badgeColor = '#28a745'; // hijau
else if (status.toLowerCase().includes('lebih')) badgeColor = '#ffc107'; // kuning
else if (status.toLowerCase().includes('obesitas')) badgeColor = '#fd7e14'; // oranye
$('#last-history').slideDown(300);
} else {
$('#last-history').slideUp(300);
}
});
} else {
$('#last-history').slideUp(300);
}
rows += `
<tr ${index === 0 ? 'style="background:#fff5f0; font-weight:600;"' : ''}>
<td>${item.tanggal}</td>
<td>${item.usia_kehamilan} minggu</td>
<td>${item.berat_badan} kg</td>
<td>${item.tinggi_badan} cm</td>
<td>${item.lila} cm</td>
<td>
<span class="badge px-2 py-1" style="background:${badgeColor}; border-radius:20px;">
${status}
</span>
</td>
</tr>
`;
});
$('#last-history-tbody').html(rows);
$('#last-history').slideDown(300);
} else {
$('#last-history').slideUp(300);
}
});
} else {
$('#last-history').slideUp(300);
}
});
});
</script>