03. Transaksi Kasir, Keranjang & Pembayaran (POS Core)
Halaman POS adalah pusat operasional utama kasir pada aplikasi Flink POS. Antarmuka dirancang dengan tata letak dua panel yang ergonomis: Panel Kiri untuk katalog & pencarian produk, serta Panel Kanan untuk manajemen keranjang belanja (cart) dan pembayaran.
Gambar: Tata letak utama kasir dengan katalog produk (kiri) dan keranjang pesanan (kanan).
1. Panel Katalog Produk (Sisi Kiri)
Panel kiri dibagi menjadi dua komponen utama: Brand Sidebar dan Area Grid Produk.
A. Navigasi Brand (Brand Sidebar)
Di kolom paling kiri (lebar 130px):
- Tombol "All" (
CupertinoIcons.square_grid_2x2_fill): Menampilkan seluruh produk dari semua brand/kategori tanpa filter. - Daftar Brand (Accordion): Menampilkan nama-nama brand toko. Mengetuk nama brand akan menyaring produk di grid hanya untuk brand tersebut. Mengetuknya sekali lagi akan menutup filter kembali ke mode "All".
B. Pencarian Produk & Kode Barcode
Di bagian atas area produk:
- Bilah Pencarian (Search Bar): Ketikkan nama produk atau kode barcode (
kode_produk) pada kolom input "Search products...". Sistem secara otomatis menyaring katalog secara real-time baik berdasarkan nama maupun kode produk. - Tombol Hapus (Clear): Ikon silang (✕) di sebelah kanan kolom pencarian untuk menghapus kata kunci dan menampilkan kembali seluruh produk.
- Pencarian via Barcode Scanner Eksternal: Jika menggunakan barcode scanner eksternal (mode keyboard HID), pastikan kursor aktif pada kolom pencarian "Search products...". Ketika barcode dipindai, nomor barcode akan terisi ke kolom pencarian dan menampilkan produk terkait di grid, lalu kasir mengetuk kartu produk tersebut untuk memasukkannya ke keranjang. Tidak ada fitur otomatis masuk keranjang di latar belakang tanpa memilih produk.
C. Kartu Produk (Product Cards)
Setiap kartu produk di grid menampilkan:
- Foto Produk: Gambar visual menu/barang.
- Nama & Harga Jual: Nama produk dan nominal harga (serta coret harga awal jika produk sedang diskon promo).
- Indikator Stok: Menampilkan sisa stok gudang (dapat diaktifkan/dinonaktifkan di menu Pengaturan).
- Badge Jumlah di Keranjang: Jika produk sudah ditambahkan, kartu produk akan menampilkan penanda kuantitas yang telah dipilih.
Cukup ketuk kartu produk satu kali untuk memasukkannya ke keranjang. Mengetuknya berulang kali akan otomatis menambah kuantitas (+1) produk tersebut.
2. Panel Keranjang Belanja (Sisi Kanan)
Panel kanan menangani seluruh rincian transaksi sebelum pembayaran diproses.
A. Header Keranjang (Cart Header)
Header keranjang memuat 3 elemen penting:
- Pemilih Pelanggan (Customer Selector):
- Default: "Walk-in Customer" (pelanggan umum).
- Ketuk area ini untuk mencari member terdaftar berdasarkan nama atau nomor telepon. Jika member terpilih memiliki poin, jumlah saldo poin akan muncul di sebelah kanan (contoh:
150 Pts).
- Tombol Menu Tambahan (More Menu - Titik Tiga
...):- Apply Promo: Menampilkan dan menerapkan promo diskon toko atau paket bundling yang sedang aktif.
- Tukar Poin: Membuka dialog penukaran poin reward loyalitas member menjadi potongan belanja.
- Discount: Membuka keypad untuk memberikan diskon manual transaksi (persentase
%atau nominalRp). - Clear Order: Mengosongkan seluruh item dari keranjang tanpa membatalkan pesanan di sistem.
- Cancel Order: Membatalkan pesanan yang sedang aktif di sistem.
- Cash Flow: (Dalam Pengembangan) Pencatatan arus kas operasional harian kasir (petty cash).
- Sync Data: Menjalankan sinkronisasi master data katalog produk & member secara manual ke server.
- Baris Aksi Cepat (Quick Actions):
- Tipe Pesanan (
selectedOrderTypeLabel): Memilih antara Dine In (Makan di tempat), Take Away (Bawa pulang), atau saluran online/merchant (seperti GoFood, GrabFood, ShopeeFood, TikTok Shop). Setiap tipe pesanan dapat memiliki penyesuaian harga jual dinamis (dynamic pricing). - Catatan Pesanan (Order Note): Menambahkan label pesanan pelanggan (contoh: nomor meja "Meja 05" atau nama tamu).
- Tipe Pesanan (
Gambar: Dialog pengaturan tipe pesanan dan input catatan pesanan.
3. Mengelola & Mengedit Item di Keranjang
Untuk mengubah kuantitas atau menyesuaikan pesanan item yang sudah ada di keranjang:
- Ketuk pada baris item yang ingin diubah di panel keranjang belanja.
- Dialog popup "Edit Order" akan terbuka:
- Ubah Kuantitas (Quantity): Gunakan tombol minus (
-) atau plus (+).
- Ubah Kuantitas (Quantity): Gunakan tombol minus (
Tombol minus (-) akan tertahan pada angka 1 dan tidak akan menghapus item. Hal ini dirancang untuk mencegah kasir tidak sengaja menghapus pesanan saat mengurangi jumlah.
- Hapus Item dari Keranjang: Untuk membuang item dari keranjang, tekan tombol merah bertuliskan "Delete" (ikon tempat sampah
CupertinoIcons.trash) di bagian kiri bawah dialog Edit Order. - Catatan Khusus (Notes / Special Requests): Tuliskan instruksi menu khusus pada kolom teks (contoh: "Less sugar", "Tanpa bawang", "Pedas level 3"). Catatan ini akan otomatis tercetak pada tiket pesanan dapur.
- Ubah Tipe Pesanan Per Item (Order Type): Mengubah pesanan item tertentu menjadi Dine In atau Take Away jika dalam satu transaksi terdapat pesanan campuran.
- Tekan tombol "Update Order" untuk menyimpan perubahan kembali ke keranjang.
- (Opsional) Jika ingin mengosongkan seluruh keranjang belanja sekaligus, ketuk ikon titik tiga (
...) di pojok kanan atas keranjang lalu pilih "Clear Order".
4. Penerapan Promo Toko & Paket Bundling (Promo Engine)
Aplikasi Flink POS dilengkapi mesin promosi cerdas (Promo Engine) yang berjalan secara offline-first di perangkat lokal tablet. Promo secara otomatis disinkronkan dari server manajemen.
A. Indikator Visual Promo pada Katalog
Pada panel katalog produk (sisi kiri):
- Badge "PROMO": Produk yang sedang masuk dalam program diskon produk reguler akan ditandai dengan badge promo dan harga coret (harga awal vs harga promo).
- Badge "BUNDLING": Produk yang merupakan bagian dari paket bundling hemat akan memiliki penanda khusus bundling.
B. Menerapkan Promo ke Keranjang Belanja
Untuk memilih dan mengaktifkan promo pada pesanan:
- Masukkan menu-menu pesanan ke dalam keranjang belanja.
- Ketuk ikon titik tiga (
...) di pojok kanan atas panel keranjang belanja. - Pilih menu "Apply Promo".
- Dialog modal "Apply Promo" akan muncul menampilkan daftar seluruh promo toko yang sedang aktif:
- Nama Promo & Deskripsi: Menampilkan judul program promo toko.
- Status & Syarat: Menampilkan kriteria atau minimal item.
- Ketuk kartu promo yang diinginkan untuk menerapkannya ke keranjang.
- Nilai potongan promo akan otomatis dihitung dan mengurangi total tagihan pada ringkasan keranjang.
- Membatalkan Promo (Clear Promo): Jika kasir ingin melepas promo yang telah terpasang, buka kembali dialog Apply Promo lalu ketuk tombol merah "Clear Promos" di bagian atas daftar.
C. Mengenal Jenis-Jenis Promo di Flink POS
Sistem mendukung beberapa model promosi operasional:
- Promo Produk Reguler:
- Persentase (%): Potongan harga sebesar persentase tertentu (misal: Diskon 20%).
- Nominal Tetap (Fixed Rp): Potongan harga langsung dengan nominal pasti (misal: Potongan Rp 5.000).
- Harga Pas (Final Price): Mengubah harga jual menjadi nominal khusus (misal: Promo Serba Rp 15.000).
- Promo Paket Bundling:
- Menghitung paket kombinasi menu (contoh: Beli 1 Makanan + 1 Minuman seharga Rp 25.000).
- Mesin promo otomatis memeriksa apakah menu-menu di keranjang memenuhi kombinasi paket (
target_id, kuantitas, dan aturan menu berbedamust_be_different). - Jika pelanggan memesan kelipatan paket (misal: 2 Makanan + 2 Minuman), potongan harga bundling dapat otomatis terhitung secara kelipatan (multiplied).
- Aturan Promo Bertumpuk (Stackable vs Non-Stackable):
- Non-Stackable: Jika terdapat beberapa promo yang memenuhi syarat, sistem secara cerdas menghitung dan memilih promo yang memberikan potongan paling menguntungkan bagi pelanggan (Best Price Guarantee).
- Stackable: Promo yang ditandai dapat digabungkan (stackable) akan dihitung secara berantai di atas potongan diskon yang sudah ada.
- Kesesuaian Saluran Pesanan (Order Type Matching):
- Promo dapat disetel khusus untuk saluran penjualan tertentu (misalnya: promo tertentu hanya berlaku untuk pesanan Dine In, atau khusus pesanan GrabFood/GoFood). Promo tidak akan diterapkan jika tipe pesanan tidak sesuai kriteria.
5. Penukaran Poin Loyalitas Member (Tukar Poin)
Jika pelanggan yang memesan adalah member terdaftar dan ingin menggunakan saldo poinnya:
- Pastikan profil member sudah dipilih di bagian atas keranjang (Customer Selector).
- Ketuk ikon titik tiga (
...) di pojok kanan atas keranjang belanja. - Pilih submenu "Tukar Poin".
- Dialog penukaran poin akan terbuka menampilkan opsi penukaran poin yang tersedia sesuai saldo member.
- Pilih reward atau jumlah poin yang ingin dikonversikan menjadi potongan transaksi.
- Potongan poin akan langsung mengurangi total pembayaran di keranjang belanja.
Jika pesanan yang menggunakan tukar poin dibatalkan di menu Order (Cancel Order / Void), sistem Flink POS secara otomatis mengembalikan poin yang telah dipotong ke akun member secara utuh.
6. Memberikan Diskon Transaksi (Discount Keypad)
Jika supervisor/kasir ingin memberikan potongan harga langsung pada total transaksi:
- Ketuk ikon titik tiga (
...) di pojok kanan atas keranjang. - Pilih menu Discount.
- Dialog keypad angka virtual (
CustomKeypadDialog) akan muncul:- Pilih mode % (Persentase) atau Rp (Nominal Rupiah).
- Masukkan nilai diskon menggunakan tombol angka.
- Tekan Terapkan / Confirm.
- Nilai potongan diskon akan langsung terlihat di rincian biaya keranjang belanja (Summary Section).
Gambar: Keypad virtual untuk memasukkan nilai diskon persen atau nominal rupiah.
7. Tiga Tombol Aksi di Footer Keranjang
Di bagian bawah keranjang terdapat rincian Subtotal, Pajak/Tax, Diskon, dan Total Pay berukuran besar, diikuti 3 tombol aksi operasional:
| Tombol | Ikon | Fungsi |
|---|---|---|
| Send to Kitchen | CupertinoIcons.lab_flask_solid | Mengirim tiket pesanan makanan/minuman ke layar Dapur (KDS) tanpa langsung menyelesaikan pembayaran. Cocok untuk sistem restoran Dine-in (Pesan Dulu, Bayar Nanti). |
| Save | CupertinoIcons.square_arrow_down | Menyimpan pesanan sementara (Hold Order / Draft). Keranjang kasir akan kembali kosong sehingga kasir bisa langsung melayani pelanggan berikutnya di antrean. |
| Pay Now | CupertinoIcons.creditcard_fill | Melanjutkan pesanan ke layar proses pembayaran (Payment Screen). |
8. Proses Pembayaran (Payment Screen)
Saat kasir menekan tombol Pay Now, sistem akan membuka layar Payment Screen:
Gambar: Layar Payment Review Order (kiri) dan Pilihan Metode Pembayaran (kanan).
A. Review Pesanan (Kolom Kiri)
Memastikan seluruh item pesanan, varian, catatan dapur, diskon, dan tarif pajak sudah terhitung benar sebelum uang diterima.
B. Memilih Metode Pembayaran (Kolom Kanan)
1. Pembayaran Non-Tunai (Cashless)
Sistem menampilkan daftar metode non-tunai yang aktif dan tersinkronisasi dari sistem toko:
- QRIS: Digunakan untuk mencatat pembayaran melalui QRIS (misalnya pelanggan memindai barcode QRIS statis toko/meja kasir menggunakan aplikasi m-banking atau e-wallet seperti GoPay, OVO, Dana, ShopeePay, BCA, dll).
- Bank Transfer / EDC Kartu: Digunakan untuk mencatat pembayaran via transfer rekening bank atau mesin EDC kartu debit/kredit yang ada di toko.
Pada pembayaran Cashless, sistem otomatis mengatur nominal uang diterima tepat sama dengan total tagihan (Uang Pas / Tidak Ada Kembalian). Kasir cukup memverifikasi bahwa pembayaran telah berhasil masuk ke rekening/notifikasi toko, lalu memilih metode yang sesuai dan melanjutkan transaksi.
2. Pembayaran Tunai (Cash) & Kalkulator Kembalian
Jika pelanggan membayar menggunakan uang tunai:
- Tombol Uang Cepat (Quick Cash):
- Uang Pas (Total Amount): Menyesuaikan nominal uang tepat dengan total tagihan.
- Rp 50.000: Pecahan lima puluh ribu rupiah.
- Rp 100.000: Pecahan seratus ribu rupiah.
- Insert Manually: Jika pelanggan membayar dengan pecahan lain (misal: Rp 150.000 atau Rp 70.000), ketuk opsi ini untuk membuka keypad angka dan memasukkan jumlah uang fisik yang diterima.
Gambar: Pilihan tombol nominal tunai cepat dan tampilan hitungan kembalian otomatis.
9. Konfirmasi Pembayaran & Cetak Struk
- Tekan tombol "Continue Transaction" (atau "Bayar dengan Poin" untuk transaksi penukaran poin) di bagian bawah panel pembayaran.
- Dialog "Konfirmasi Pesanan" akan muncul menampilkan rincian:
- Nomor Pesanan & Waktu Transaksi
- Total Tagihan
- Metode Pembayaran
- Nominal Diterima & Kembalian
- Tekan tombol "Kirim" (atau tekan "Batalkan" jika ingin memeriksa kembali):
- Transaksi resmi tersimpan ke database lokal SQLite.
- Jika opsi cetak otomatis (auto print) aktif di pengaturan, printer thermal akan langsung mencetak struk belanja.
- Sistem menampilkan dialog "Pembayaran Berhasil!" ("Jangan lupa ucapkan terima kasih kepada pelanggan"):
- Kasir dapat menekan tombol "Cetak Ulang" jika pelanggan meminta salinan struk tambahan.
- Tekan tombol "Selesai" untuk menutup transaksi dan kembali ke layar kasir yang bersih siap melayani pelanggan berikutnya.
Gambar: Dialog pembayaran berhasil dengan rincian total transaksi, nominal kembalian, serta tombol aksi cetak struk.
Langkah Selanjutnya
Bagaimana jika pelanggan ingin menunda pembayaran atau membuka pesanan meja (Open Bill)?
Lanjut ke Modul 04: Manajemen Pesanan & Tagihan Tertunda (Order Management)