GitHub GitHub GitHub

Daftar Customer

Overview
Menambahkan Customer

Halaman utama modul Customers menampilkan seluruh data perusahaan pelanggan dalam format tabel yang terstruktur. Halaman ini menjadi titik masuk utama untuk semua operasi terkait customer.

Cognivo UI Screenshot

Gambar 1 — Tampilan halaman utama Daftar Customer

2.1 Elemen Antarmuka

Halaman Daftar Customer terdiri dari beberapa elemen utama sebagai berikut:

Elemen Deskripsi
Tombol + Add Customer Membuka modal form untuk menambahkan data customer baru ke sistem.
Search customer... Field pencarian untuk memfilter customer berdasarkan nama secara real-time.
Tombol Filter Membuka panel filter lanjutan untuk menyaring data berdasarkan kriteria tertentu.
Tabel Customer Menampilkan daftar semua customer dalam format baris dan kolom.
Pagination Kontrol navigasi halaman (<<, <, >, >>) beserta pengaturan jumlah baris per halaman (default: 20).
Checkbox Row Memilih satu atau beberapa baris untuk operasi massal.
Action Icons Ikon aksi cepat per baris: telepon, pesan, lihat detail, dan menu opsi lanjutan.

2.2 Kolom Tabel

Tabel Daftar Customer menampilkan kolom-kolom berikut:

Kolom Keterangan
Customer Name Nama customer beserta avatar/inisial. Dapat diurutkan (sort) secara ascending/descending.
Company Name Nama perusahaan resmi yang terdaftar. Dapat diurutkan.
Industry Kategori industri perusahaan (contoh: Technology, Healthcare, Cybersecurity, Agriculture).
Address Alamat lengkap perusahaan.
Source Tag sumber akuisisi dalam format badge/chip (contoh: youtube, wa, instagram, facebook).
Created At Tanggal record customer dibuat di sistem.
Action Kolom aksi yang berisi ikon: telepon (WA Call), chat (buka Interaction), lihat detail, dan menu titik tiga.

2.3 Fitur Pencarian

Pengguna dapat mencari customer menggunakan field Search customer... di bagian atas tabel. Pencarian dilakukan secara real-time berdasarkan nama customer. Untuk hasil yang lebih spesifik, gunakan kombinasi pencarian dengan Filter.

2.4 Fitur Filter

Tombol Filter di pojok kanan atas membuka panel filter lanjutan. Filter memungkinkan pengguna menyaring data berdasarkan satu atau lebih kriteria secara bersamaan. Logika filter antar panel menggunakan AND, sementara opsi dalam satu panel menggunakan OR.

2.5 Action Cepat Per Baris

Setiap baris pada tabel memiliki ikon aksi yang dapat digunakan langsung tanpa membuka halaman detail:

  • Ikon Telepon — Memulai WA Call langsung ke nomor customer

  • Ikon Chat — Membuka Interaction (percakapan WhatsApp) dengan customer

  • Ikon Mata — Membuka panel Quick Preview customer di sisi kanan layar

  • Ikon Titik Tiga (...) — Menampilkan menu opsi tambahan seperti Edit atau Delete