api-btekno/DASHBOARD_TROUBLESHOOTING.md

Troubleshooting Dashboard Data Kosong

🔍 Checklist Debugging

1. Cek Console Browser

Buka browser console (F12) dan cek:

• Apakah ada error?
• Apakah API call berhasil?
• Apakah response data ada?

Expected logs:

[Dashboard] Summary response raw: {total_count: 47, total_amount: 112000, ...}
[Dashboard] By Category response raw: {labels: [...], series: {...}}
[Dashboard] State date: 2025-12-16
[Dashboard] Parsed summary: {totalAmount: 112000, summary: {...}}
[Dashboard] Final counts: {personCount: 33, motorCount: 12, carCount: 2, totalAmount: 112000}

2. Cek API Response

Test langsung API endpoint:

# Login dulu untuk dapat token
curl -X POST http://localhost:8000/auth/v1/login \
  -H "Content-Type: application/json" \
  -d '{"username":"admin","password":"password"}'

# Test summary endpoint (ganti YOUR_TOKEN)
curl "http://localhost:8000/retribusi/v1/dashboard/summary?date=2025-12-16" \
  -H "Authorization: Bearer YOUR_TOKEN"

# Expected response:
# {"success":true,"data":{"total_count":47,"total_amount":112000,...}}

3. Cek Data di Database

cd api-btekno
php bin/check_dashboard_data.php

Expected output:

• Entry Events: Ada data
• Daily Summary: Ada data untuk tanggal yang dipilih
• Test Query: Total Count > 0, Total Amount > 0

4. Cek Konfigurasi Frontend

File: retribusi (frontend)/public/dashboard/js/config.js

Pastikan BASE_URL benar:

// Untuk PHP built-in server
BASE_URL: 'http://localhost:8000'

// Untuk Laragon
BASE_URL: 'http://localhost/api-btekno/public'

5. Cek Default Date

File: retribusi (frontend)/public/dashboard/js/dashboard.js

Default date sudah di-set ke tanggal yang ada data:

const state = {
  date: '2025-12-16', // Tanggal yang ada data
  locationCode: '',
  gateCode: ''
};

🐛 Masalah Umum

Masalah 1: Data Kosong (0)

Penyebab:

• Date tidak sesuai dengan tanggal yang ada data
• Data belum di-aggregate ke daily_summary

Solusi:

1. Pilih tanggal yang ada data di filter date (2025-12-16)
2. Atau aggregate data: php bin/daily_summary.php 2025-12-16

Masalah 2: API Error 401

Penyebab:

• Token expired atau tidak valid
• Tidak ada Authorization header

Solusi:

1. Login ulang
2. Cek token di localStorage: localStorage.getItem('token')
3. Cek apakah token masih valid

Masalah 3: API Error 404

Penyebab:

• Route tidak ditemukan
• Base URL salah

Solusi:

1. Cek base URL di config.js
2. Pastikan API server running
3. Test health endpoint: http://localhost:8000/health

Masalah 4: CORS Error

Penyebab:

• CORS tidak dikonfigurasi dengan benar
• Origin tidak diizinkan

Solusi:

1. Cek .env di backend: CORS_ALLOWED_ORIGINS=*
2. Pastikan CORS middleware aktif
3. Restart API server

✅ Quick Fix

Jika data masih tidak muncul, coba:

1. Set date manual di browser console:

// Buka browser console (F12)
state.date = '2025-12-16';
loadSummaryAndCharts();

2. Cek response langsung:

// Di browser console
const response = await apiGetSummary({ date: '2025-12-16' });
console.log('Response:', response);

3. Force refresh:

• Hard refresh: Ctrl+Shift+R (Windows) atau Cmd+Shift+R (Mac)
• Clear cache dan reload

4. Cek Network Tab:

• Buka DevTools > Network
• Cek request ke /retribusi/v1/dashboard/summary
• Lihat response body dan status code

📝 Expected Data untuk 2025-12-16

Berdasarkan test:

• Total Count: 47
• Total Amount: 112,000
• Person Walk: 33
• Motor: 12
• Car: 2

Jika data ini tidak muncul, ada masalah dengan:

1. API call
2. Response parsing
3. Data rendering