Versi awal saat mulai :

Siap, aku sudah baca page-sales.php, ini pemahaman menyeluruh tentang kondisi halaman Sales sekarang, apa yang sudah jalan, apa yang masih placeholder, dan tabel/field apa saja yang terlibat.

1) Peran halaman Sales di CRM Web Builder

Halaman /sales adalah pipeline untuk “deal”, yaitu lead yang sudah dianggap punya potensi beli, lalu diproses tim sales sampai handover ke Project Management.

Framework yang dipakai: 6 Stage Sales Pipeline

1. Contact
2. Qualification
3. Meeting
4. Proposal
5. Close
6. Follow-Up (handover)

Secara konsep, deal ini idealnya berasal dari modul Marketing (lead dipromosikan ke Sales), dan di Sales fokusnya bukan “traffic temperature”, tapi progres menuju transaksi dan handover.

2) Data utama yang dipakai

Tabel utama: tb_sales_deals

Halaman ini sudah pakai database, bukan dummy.

Query mengambil data dari tb_sales_deals dengan filter:

• created_at BETWEEN start 00:00:00 AND end 23:59:59
• optional search q (LIKE) ke 10 kolom
• ORDER BY created_at DESC
• LIMIT 500

Kolom yang di SELECT dan dipakai (dikelompokkan sesuai kebutuhan pipeline):

A. Identitas, status umum

• id_sales_deal
• id_lead (link balik ke lead asal dari Marketing)
• created_at
• stage (contact, qualification, meeting, proposal, close, followup)
• deal_status (sudah ada di DB, belum dipakai di UI)
• is_won (dipakai untuk badge status)

B. Info deal dan kontak

• deal_name
• pic_name
• email
• phone
• source
• channel
• interest
• owner

C. Nilai dan aktivitas follow up

• deal_value
• prob
• last_touch_at (sudah ada, belum ditampilkan)
• next_followup_at (dipakai untuk overdue dan tampilan next follow up)
• next_action (ditampilkan sebagai catatan kecil di bawah next follow up)

D. Qualification fields

• qual_budget_range
• qual_timeline
• qual_decision_maker
• qual_score
• qual_need

E. Meeting fields

• meeting_at
• meeting_type
• meeting_summary

F. Proposal fields

• proposal_sent_at
• proposal_expiry
• proposal_link
• proposal_status

G. Close fields

• payment_type
• invoice_status
• agreement_status

H. Follow-Up, handover ke PM

• handover_at
• handover_project_id
• onboarding_status
• next_checkin

Catatan penting: saat ini halaman menyimpan “data per stage” sebagai kolom-kolom di satu tabel yang sama, jadi sifatnya snapshot, bukan histori berlapis.

3) Struktur UI dan cara kerja halaman (yang sudah ada)

A. KPI di atas

Dihitung dari hasil query yang sudah terfilter tanggal dan search:

• Total Deals = count hasil filter
• Pipeline Value (Bruto) = sum deal_value
• Weighted Forecast = sum round(deal_value * prob / 100)
• Overdue Follow Up = count deal yang:
  • stage != followup
  • is_won kosong
  • next_followup_at < waktu sekarang

B. Filter

Input GET:

• tab (default all)
• q (search)
• start dan end (format Y-m-d, default 3 bulan terakhir sampai hari ini)

Validasi format tanggal sudah ada, kalau invalid balik ke default.

Catatan: filter tanggal berbasis created_at, artinya deal lama yang masih aktif bisa “hilang” dari tampilan kalau range default 3 bulan tidak mencakup created_at nya.

C. Tabs 6 stage + Semua

Tabs menggunakan Bootstrap Tabs (client side), tetapi halaman juga punya parameter tab untuk menentukan tab aktif saat load pertama.

Yang ditampilkan:

• Tab “Semua”, tabel lengkap
• Tab per stage, tabel versi ringkas sesuai kebutuhan stage itu

Counting badge tiap tab dihitung dari hasil data yang sudah ke-load, memakai stage.

D. Status badge (logika sudah ada)

Fungsi wb_status_badge(stageKey, next_followup, isWon):

• Jika is_won true, badge Won
• Jika stage followup, badge Handover
• Jika overdue (next_followup lewat), badge Overdue
• Jika punya next_followup (tidak overdue), badge On Track
• Jika tidak ada next_followup, badge Needs Plan

E. Format tanggal Indonesia (sudah ada)

• Tanggal: 8 Februari 2026
• Datetime: 8 Februari 2026 - 4:00 PM

Ini sudah sesuai pola yang kamu minta.

F. Toast notifikasi (sudah ada)

Toast muncul berdasarkan query param:

• ?ok=1 atau ?updated=1 = sukses
• ?err=1&msg=... = gagal

Setelah toast muncul, script menghapus parameter tersebut dari URL (clean URL).

4) Apa yang “terlihat ada” di UI, tapi sebenarnya belum jalan (placeholder)

Di beberapa tempat ada tombol dan dropdown action, tapi link-nya masih href="#", jadi belum ada endpoint maupun handler:

• Tombol Tambah Deal
• Dropdown di tab “Semua”: Detail, Edit, Hapus
• Dropdown stage:
  • Contact: “Pindah ke Qualification”
  • Qualification: “Jadwalkan Meeting”
  • Meeting: “Siapkan Proposal”
  • Proposal: “Pindah ke Close”
  • Close: “Mark Paid, pindah Follow-Up”
  • Follow-Up: “Buka Project”

Artinya, sekarang halaman Sales baru berfungsi sebagai:

• viewer pipeline,
• filter,
• KPI,
• indikator overdue,
  belum sebagai workflow operasional end to end.

5) Bagian “history per stage” yang kamu sebut, saat ini bentuknya bagaimana

Dari implementasi sekarang, “catatan tiap stage” bukan disimpan sebagai list histori, tapi sebagai field snapshot di tb_sales_deals, contohnya:

• Qualification: budget_range, timeline, score, need, decision_maker
• Meeting: meeting_at, type, summary
• Proposal: sent_at, expiry, link, status
• Close: payment_type, invoice_status, agreement_status
• Follow-Up: handover_at, project_id, onboarding_status, next_checkin

Kalau tujuanmu adalah “mencatat history yang terjadi di masing masing tahap” sebagai timeline log yang bisa banyak entri, itu belum terlihat di code ini, karena belum ada tabel log seperti tb_sales_deal_logs atau tb_sales_stage_histories. Saat ini baru siap untuk 1 data terakhir per jenis stage.

6) Keterkaitan dengan modul Marketing (secara konsep)

Di tabel ada id_lead, jadi desainnya jelas mengarah ke:

• Lead dari Marketing dipromosikan ke Sales,
• Lalu dibuat record di tb_sales_deals yang menyimpan id_lead sebagai referensi.

Namun di page-sales.php ini belum ada mekanisme create dari Marketing, dan belum ada “detail view” yang membuka data lead asal.

7) Ringkasan: apa yang sudah ada vs belum ada

Sudah ada

• Struktur pipeline 6 stage (config stage, badge, tab, counting)
• Load data real dari tb_sales_deals
• KPI per range tanggal + search
• Filter dan pencarian
• Overdue detection
• Format tanggal rapi
• Toast sukses/gagal berbasis query param

Belum ada (masih placeholder)

• Tambah deal (form modal atau halaman create)
• Detail deal
• Edit deal
• Hapus deal + konfirmasi
• Aksi pindah stage dan update field per stage
• Pencatatan histori berulang per stage (timeline logs)
• Integrasi otomatis dari Marketing ke Sales (create deal dari lead)
• Handover otomatis ke Project Management (baru teks catatan, belum implement)

Kalau instruksi berikutnya nanti adalah “mulai bikin operasionalnya jalan”, berarti step paling dekat biasanya: buat halaman Detail Deal, lalu dari detail itu ada form update per stage + tombol pindah stage, baru setelah itu integrasi create dari Marketing dan handover ke PM.