Skip to main content

Admin — Recipient List

Overview​

Halaman Recipient List digunakan untuk mengelola akun rekening penerima (recipient) yang terhubung dengan payment gateway tertentu. Admin dapat melihat daftar rekening penerima berdasarkan filter Payment Gateway dan Bank, menambahkan rekening baru, serta menghapus rekening yang sudah ada.

Access​

  • URL: /dashboard/recipient-list
  • Role required: Admin
  • Navigation path: Sidebar > Payment Gateway > Recipient List
LabelURLDocs
Deposit List/dashboard/deposit-list10_1_deposit-list.md
Disbursement/dashboard/disbursement10_2_disbursement.md
Balance History/dashboard/disbursement-balance-history10_3_balance-history.md
Recipient List/dashboard/recipient-list10_4_recipient-list.md
Report Payment Gateway/dashboard/report-payment-gateway10_5_report-payment-gateway.md
Settlement History/dashboard/settlement-history10_6_settlement-history.md
Setting Price/dashboard/setting-price10_7_setting-price.md

Page Layout​

ElemenTipeDeskripsi
Recipient ListJudul halaman (H1)Nama halaman
Create RecipientButton (atas kanan)Membuka modal form untuk menambahkan rekening penerima baru

Filter Area​

Filter terletak di bagian atas konten utama. Terdapat tiga filter untuk menyaring data recipient.

ElemenTipeDefaultWajibKeterangan
CurrencyTextbox (disabled)IDRYa (*)Read-only, nilai tetap IDR
BankDropdown (React Select)AllTidakPilih bank tertentu atau "All" untuk semua bank
Payment GatewayDropdown (React Select)(kosong)TidakPilih payment gateway untuk memfilter data
SearchButton——Menjalankan pencarian berdasarkan filter aktif

Catatan: Tidak ada tombol Reset pada halaman ini. Untuk mereset filter, reload halaman atau ubah nilai filter secara manual.

Opsi Payment Gateway (16 opsi):​

ppay, zpay, spay, gpay, hpay, dpay

Tabel Recipient​

Tabel menampilkan daftar rekening penerima sesuai filter yang diterapkan.

KolomTipe DataDeskripsi
NoNomor urutNomor urut data dalam halaman
Bank NameTeksNama bank atau alias bank yang terdaftar
Payment GatewayTeksKode payment gateway pemilik rekening ini
Account NoTeksNomor rekening / virtual account
Account NameTeksNama pemilik rekening
Create TimeTimestamp (ISO 8601)Waktu data recipient dibuat, format: YYYY-MM-DDTHH:mm:ss.xxxxxxZ
StatusBadge teksStatus rekening: Active / Inactive
ActionsButtonTombol aksi yang tersedia untuk baris tersebut

Pagination​

ElemenDeskripsi
X DataJumlah total data yang ditemukan
Navigasi halamanTombol first/prev/next/last + nomor halaman aktif
Go to pageInput angka + tombol untuk langsung loncat ke halaman tertentu

Features​

1. Filter & Pencarian Data​

Data recipient tidak ditampilkan secara default. Admin perlu memilih Payment Gateway (atau Bank) lalu klik Search.

Langkah:

  1. Pilih Payment Gateway dari dropdown (contoh: luna)
  2. Opsional: pilih Bank untuk mempersempit filter
  3. Klik tombol Search

Hasil: Tabel menampilkan daftar recipient sesuai filter yang dipilih beserta jumlah total data (misal: 3 Data).

2. Create Recipient (Tambah Rekening Penerima)​

Menambahkan rekening penerima baru ke dalam sistem.

Langkah:

  1. Klik tombol Create Recipient di kanan atas halaman
  2. Modal Create Recipient terbuka
  3. Isi semua field wajib (bertanda *):
    • Payment Gateway — pilih dari dropdown
    • Bank — pilih dari dropdown (opsi bank bergantung pada payment gateway yang dipilih)
    • Account Number — ketik nomor rekening
    • Account Name — ketik nama pemilik rekening
  4. Field Currency terisi otomatis (IDR) dan tidak dapat diubah
  5. Klik tombol Save untuk menyimpan

Hasil: Recipient baru ditambahkan dan muncul di tabel setelah Search ulang.

Tombol lain: Klik Cancel atau ikon Close (×) untuk menutup modal tanpa menyimpan.

3. Delete Recipient (Hapus Rekening Penerima)​

Menghapus data recipient dari sistem.

Langkah:

  1. Temukan baris data yang ingin dihapus di tabel
  2. Klik tombol Delete (merah) pada kolom Actions
  3. Dialog konfirmasi muncul dengan pesan:

    "Are you sure you want to delete this recipient?"

  4. Klik Confirm untuk melanjutkan penghapusan
  5. Klik Cancel untuk membatalkan

Hasil: Data recipient dihapus dari sistem dan tidak muncul lagi di tabel.

UI Elements Reference​

LabelTipeLokasiDeskripsi
Create RecipientButtonHeader kanan atasMembuka modal tambah recipient
CurrencyTextbox (disabled)Area filterMenampilkan currency aktif (IDR), read-only
BankDropdown (React Select)Area filterFilter berdasarkan bank
Payment GatewayDropdown (React Select)Area filterFilter berdasarkan payment gateway
SearchButton (kuning)Area filterJalankan filter/pencarian
DeleteButton (merah)Kolom Actions per barisHapus recipient, memunculkan konfirmasi
FieldTipeWajibPlaceholderKeterangan
Payment GatewayDropdown (React Select)Ya (*)Select Payment GatewayPilih payment gateway tujuan
CurrencyTextbox (disabled)—IDROtomatis terisi IDR, tidak dapat diubah
BankDropdown (React Select)Ya (*)Select...Pilih bank recipient
Account NumberText inputYa (*)Type Account NumberNomor rekening atau virtual account
Account NameText inputYa (*)Type Account NameNama pemilik rekening
CancelButton——Tutup modal tanpa menyimpan
SaveButton——Simpan data recipient baru
ElemenKeterangan
IconWarning (merah)
Pesan"Are you sure you want to delete this recipient?"
CancelBatalkan penghapusan, tutup dialog
ConfirmLanjutkan dan hapus data recipient

Data Displayed​

Contoh data yang tampil dengan filter Payment Gateway = luna:

NoBank NamePayment GatewayAccount NoAccount NameCreate TimeStatus
1BNI VA LUNAluna2233445566Luna Recipient2025-11-06T02:33:24.433351ZActive
2BCAluna34567890tyuiopasf2025-11-06T01:42:32.463301ZActive
3BNIluna123409876SPEED2025-08-26T07:49:44.907107ZActive

Notes​

  • Halaman tidak menampilkan data secara default — harus klik Search terlebih dahulu setelah memilih filter.
  • Field Currency selalu IDR dan tidak dapat diubah di filter maupun di modal.
  • Tidak ada tombol Edit — perubahan data hanya bisa dilakukan dengan menghapus lalu membuat ulang.
  • Tidak ada tombol Reset di area filter — reload halaman untuk mereset semua filter.
  • Kolom Actions hanya memiliki satu aksi: Delete (tidak ada Edit/View).
  • Status yang terlihat: Active. Kemungkinan ada status Inactive untuk recipient yang dinonaktifkan.

Screenshots​

ScreenshotDeskripsi
recipient-list.pngHalaman awal sebelum filter diterapkan
recipient-list-table.pngTabel dengan filter Payment Gateway = luna (3 data)
recipient-list-delete-confirm.pngDialog konfirmasi Delete recipient
recipient-list-create.pngModal Create Recipient