# Checklist UI Hirarki Piutang (Reusable)

Checklist ini khusus untuk perubahan tampilan (UI only) dan bisa dipakai ulang di aplikasi lain berbasis PHP 5.6 + CodeIgniter 3.

## 1. Scope & Guardrail
- [ ] Pastikan perubahan hanya di layer `view`, CSS, dan JS.
- [ ] Jangan ubah struktur tabel database, query bisnis inti, atau posting jurnal.
- [ ] Tentukan status akun legacy sejak awal (ditampilkan atau disembunyikan).

## 2. Discovery File
- [ ] Identifikasi controller yang menyiapkan data halaman piutang.
- [ ] Identifikasi view utama yang merender kartu summary + tabel detail.
- [ ] Identifikasi helper/fungsi filter periode yang dipakai halaman.

## 3. Desain Hirarki Tampilan
- [ ] Tampilkan Level 1: akun utama piutang dagang.
- [ ] Tampilkan Level 2: `Reguler` dan `Project`.
- [ ] Tampilkan ringkasan saldo + jumlah customer per kartu bisnis.
- [ ] Pastikan akun `Marketplace (Legacy)` mengikuti keputusan scope (mis. hidden).
- [ ] Tampilkan total gabungan `Reguler + Project`.

## 4. Konsistensi Label
- [ ] Gunakan kode rekening yang konsisten di kartu (contoh: `1010020010`, `1010020080`).
- [ ] Gunakan label bisnis yang sama di panel, tabel, dan judul filter.
- [ ] Tambahkan catatan mode aktif agar user tahu aturan tampilan.

## 5. Validasi Fungsi Existing
- [ ] Filter periode tetap berjalan.
- [ ] Pencarian keyword tetap berjalan.
- [ ] Link detail per kartu tetap mengarah ke halaman yang benar.
- [ ] Export/print yang sudah ada tetap tidak rusak.

## 6. Validasi Data Ringkasan
- [ ] Nilai saldo kartu sesuai data sumber (debet - kredit).
- [ ] Hitung jumlah customer unik per kategori.
- [ ] Total `Reguler + Project` sesuai penjumlahan kartu aktif.
- [ ] Jika legacy disembunyikan, pastikan tidak muncul di panel UI.

## 7. Quality Gate
- [ ] Lulus syntax check PHP (`php -l`) untuk file yang diubah.
- [ ] Uji tampilan desktop dan mobile.
- [ ] Uji role user minimal 1 role operasional dan 1 role holding (jika ada).

## 8. Dokumentasi Perubahan
- [ ] Catat daftar file yang diubah.
- [ ] Catat keputusan bisnis (contoh: `Marketplace (Legacy) hidden sementara`).
- [ ] Simpan screenshot sebelum/sesudah untuk audit internal.

## 9. Fine-Tuning Visual (Pixel-Perfect)
- [ ] Samakan skema warna panel summary dengan desain acuan.
- [ ] Samakan komposisi layout kartu (label sisi kiri + kartu nilai utama).
- [ ] Samakan hierarchy tipografi (judul, subjudul, nilai saldo, meta customer).
- [ ] Samakan style area filter periode (warna, border, tombol terapkan).
- [ ] Samakan style area pencarian (input, tombol reset, tombol cari).
- [ ] Samakan style header tabel (warna header, kapitalisasi, spacing).

## Catatan Implementasi san_15apr (2026-04-15)
- [x] Hirarki piutang `Reguler` + `Project` sudah ditampilkan di panel ringkasan.
- [x] `Marketplace (Legacy)` di-hide dari tampilan UI.
- [x] Fine-tuning visual tahap 2 sudah diterapkan: panel summary, filter periode, search bar, dan header tabel.