# Ringkasan Proyek: Toko Kusen & Gypsum Budi Jaya
**E-Commerce PHP Native + MySQL + Bootstrap 5.3.3**

---

## Stack Teknologi

- **Backend**: PHP Native, PDO MySQL
- **Frontend**: Bootstrap 5.3.3, Bootstrap Icons 1.11.3
- **Font**: Playfair Display + Nunito (Google Fonts)
- **Payment**: Midtrans Snap (VA Bank, QRIS, GoPay, ShopeePay, Kartu Kredit)
- **Server lokal**: XAMPP Windows
- **Tema warna**: Primary `#8B5E3C` (wood brown), Accent `#D4A853` (gold), BG `#FBF7F2` (cream)

---

## Struktur File Lengkap

### Root (11 file)
| File | Baris | Fungsi |
|---|---|---|
| (d)index.php` | 552 | Landing page (Beranda, Profil, Galeri, Maps) |
| `katalog.php(A) | 459 | Daftar produk dengan filter & search |
| `produk.php(A) | 814 | Detail produk + image slider + kalkulator meter |
| `keranjang.php(A) | 327 | Keranjang belanja berbasis session |
| `checkout.php(A) | 453 | Form checkout + Midtrans Snap popup |
| `konfirmasi.php(A) | 13 | Redirect ke payment_finish.php |
| `tracking.php(A) | 356 | Lacak status pesanan via kode/HP |
| `payment_finish.php(A) | 236 | Halaman return dari Midtrans (sukses/pending/gagal) |
| `midtrans_notification.php(A) | 122 | Webhook Midtrans → update status otomatis |
| (D)login.php` | 281 | Halaman login admin (standalone, tanpa header publik) |
| `logout.php(A) | 16 | Proses logout + flash message |

### Admin Panel — `admin/` (14 file)
| File | Baris | Fungsi |
|---|---|---|
| (D)index.php` | 431 | Dashboard: stat cards, chart 7 hari, pesanan terbaru, stok rendah |
| (D)produk.php` | 228 | Daftar produk + filter + toggle aktif |
| `produk_tambah.php(A) | 401 | Form tambah produk + multi-upload foto drag & drop |
| `produk_edit.php(A) | 453 | Edit produk + kelola foto existing (hapus, jadikan utama) |
| `produk_hapus.php(A) | 55 | Proses hapus produk + semua foto fisik |
| `kategori.php(A) | 212 | CRUD kategori inline |
| (D) pesanan.php' | 271 | Daftar pesanan + filter status + quick verify |
| `pesanan_detail.php(A) | 463 | Detail pesanan + update status + catatan admin |
| `galeri.php(A) | 223 | Daftar galeri + filter kategori + edit inline (modal) |
| `galeri_tambah.php(A) | 288 | Upload foto galeri + drag & drop + preview |
| `galeri_hapus.php(A) | 48 | Proses hapus foto galeri |
| `rekening.php(A) | 195 | CRUD rekening bank (tidak dipakai sejak Midtrans, tapi tetap ada) |
| (d)admin_layout.php` | 91 | Sidebar + topbar + flash message (shared layout) |
| (d)admin_footer.php` | 13 | Penutup HTML + Bootstrap JS + admin.js |

### Includes — `includes/` (9 file)
| File | Baris | Fungsi |
|---|---|---|
| `config.php(A) | 61 | Konstanta toko, DB, path, Midtrans keys |
| `db.php(A) | 41 | Koneksi PDO singleton |
| `functions.php(A) | 143 | Helper: formatRupiah, e(), slug, flash, upload, dsb |
| `auth.php | 75 | Login, logout, isAdmin, requireAdmin (fix session XAMPP) |
| `header.php(A) | 133 | Navbar publik Bootstrap 5 |
| `footer.php(A) | 119 | Footer publik + WhatsApp floating button |
| `midtrans.php | 150 | Helper: createTransaction, buildPayload, verifySignature, mapStatus |
| `admin_header.php | 42 | Bridge ke admin/admin_layout.php |
| `admin_footer.php | 24 | Bridge ke admin/admin_footer.php |

### Assets
| File | Baris | Isi |
|---|---|---|
| (D) assets/css/style.css` | 3.589 | CSS publik lengkap (landing, katalog, produk, checkout, tracking) |
| `assets/css/admin.css(A) | 687 | CSS admin panel (52 class `adm-*` + pre-existing) |
| `assets/js/app.js(A) | 139 | JS publik: kalkulator real-time, slider, dll |
| `assets/js/admin.js(A) | 98 | JS admin: sidebar toggle, confirm hapus, tooltips, spec rows |

### Database
- `database/budijaya.sql` — 242 baris, 9 tabel lengkap

---

## Database — 9 Tabel

| Tabel | Kolom Utama | Keterangan |
|---|---|---|
| `users` | id, nama, email, password, role | Admin & user, bcrypt hash |
| `kategori` | id, nama, slug, deskripsi | Kategori produk |
| `produk` | id, nama, slug, harga, satuan, stok, stok_minimum, berat_per_m, is_aktif | Produk utama |
| `produk_foto` | id, produk_id, nama_file, urutan | Foto produk (maks 10) |
| `keranjang` | id, session_id, produk_id, jumlah | Session-based, UNIQUE(session_id, produk_id) |
| `pesanan` | id, kode_pesanan, nama_pembeli, no_hp, alamat, total_harga, status | Status: pending→dibayar→diverifikasi→diproses→selesai/dibatalkan |
| `pesanan_item` | id, pesanan_id, produk_id, nama_produk, harga_satuan, jumlah, subtotal | Snapshot harga saat order |
| `pembayaran` | id, pesanan_id, midtrans_order_id, midtrans_token, midtrans_status, payment_type, diverifikasi | Diupdate otomatis via webhook |
| `galeri` | id, judul, deskripsi, nama_file, kategori_id, urutan | Foto portofolio |

---

## Alur Sistem

### Alur Belanja Pelanggan
```
index.php → katalog.php → produk.php → keranjang.php
    → checkout.php (isi nama/HP/alamat)
    → Midtrans Snap popup (VA/QRIS/GoPay/Kartu Kredit)
    → Bayar
    → payment_finish.php (konfirmasi)
    → tracking.php (cek status kapan saja)
```

### Alur Pembayaran Midtrans (Otomatis)
```
checkout.php → midtransBuildPayload() → midtransCreateTransaction()
    → Snap token tersimpan di tabel pembayaran
    → Pelanggan bayar di Snap popup
    → Midtrans kirim webhook → midtrans_notification.php
    → Status pesanan update otomatis (diverifikasi)
    → Admin tidak perlu verifikasi manual
```

### Alur Admin
```
login.php → admin/index.php (dashboard)
    → admin/pesanan.php → admin/pesanan_detail.php (update status, catatan)
    → admin/produk.php → tambah/edit/hapus produk
    → admin/galeri.php → upload/edit/hapus foto portofolio
    → admin/kategori.php → kelola kategori
```

---

## Fitur Utama Per Halaman

### Landing Page (`index.php`)
- Hero section dengan CTA
- Section profil toko + statistik (tahun berdiri, proyek selesai, dsb)
- Grid galeri portofolio dari database
- Google Maps embed
- Floating WhatsApp button

### Katalog (`katalog.php`)
- Filter per kategori
- Search real-time
- Sort: terbaru, termurah, termahal, nama A-Z
- Card produk dengan foto, harga, satuan (per meter/unit/lembar)
- Pagination

### Detail Produk (`produk.php`)
- Image slider multi-foto
- Kalkulator real-time (input meter → hitung total harga)
- Tabel spesifikasi dari JSON
- Tombol "Tambah ke Keranjang" + redirect ke keranjang

### Dashboard Admin (`admin/index.php`)
- 7 stat cards (pending, menunggu verif, diproses, selesai bulan ini, total produk, stok rendah, pendapatan bulan ini)
- Bar chart pesanan 7 hari terakhir (Chart.js)
- Tabel 10 pesanan terbaru + quick verify button
- List stok rendah dengan progress bar
- Quick actions: tambah produk, verifikasi pembayaran, dsb
- Banner notifikasi jika ada pesanan butuh aksi

---

## Bug yang Diperbaiki

| Bug | Penyebab | Solusi |
|---|---|---|
| Login selalu gagal di XAMPP | `session_regenerate_id(true)` menghapus session sebelum data selesai ditulis | Ubah ke `false` + `session_write_close()` |
| `admin_layout.php` not found | File belum di-copy ke folder `admin/` di XAMPP | Copy dari output ke `C:\xampp\htdocs\...\admin\` |
| Midtrans API 401 Unauthorized | Server Key dari dashboard Production, bukan Sandbox | Ambil key dari `dashboard.sandbox.midtrans.com` |
| `Unknown column 'midtrans_token'` | Tabel `pembayaran` masih struktur lama (belum di-ALTER) | Jalankan `ALTER TABLE pembayaran ADD COLUMN ...` di phpMyAdmin |
| Snap popup tidak muncul | `snap.js` dimuat tapi dipanggil sebelum siap | Ubah ke dynamic script inject dengan Promise + `onload` handler |
| File lama (`cart.php`, `product.php`, `order-confirm.php`) | Sisa proyek versi berbeda, struktur include berbeda | Dihapus dari folder proyek |
| Dua metode pembayaran bertabrakan | `konfirmasi.php` (upload manual) masih aktif bersamaan dengan Midtrans | `konfirmasi.php` dijadikan redirect saja, `tracking.php` dibersihkan dari logika manual |

---

## Konfigurasi Midtrans

```php
// File: includes/config.php
define('MIDTRANS_SERVER_KEY',    'Mid-server-xxxx');  // dari dashboard Midtrans
define('MIDTRANS_CLIENT_KEY',    'Mid-client-xxxx');  // dari dashboard Midtrans
define('MIDTRANS_IS_PRODUCTION', false);              // false = Sandbox, true = Production
```

### Metode Pembayaran Aktif
- Transfer Bank: Virtual Account BCA, BRI, BNI, Permata, Other VA
- E-Wallet: GoPay, ShopeePay, QRIS
- Kartu Kredit (3D Secure)

### Webhook (Notification URL)
Daftarkan di Midtrans Dashboard → Settings → Configuration:
```
https://DOMAIN_ANDA/budijaya_ecommerce/midtrans_notification.php
```
Di localhost XAMPP: gunakan **ngrok** untuk expose ke internet.

---

## Akun Admin Default

- **Email**: `admin@budijaya.com`
- **Password**: `admin123`
- **Role**: admin

> Ganti password setelah deploy ke hosting!

---

## File Debug (Hapus setelah selesai!)

| File | Fungsi |
|---|---|
| `debug_login.php` | Diagnosa 9 langkah masalah login (session, hash, role, dsb) |
| `debug_midtrans.php` | Test koneksi API Midtrans + buka Snap popup langsung |
| `reset_password.php` | Reset/buat ulang akun admin via browser |

---

## Langkah Selanjutnya (Opsional)

1. **Webhook ngrok** — setup agar status pesanan update otomatis saat test di localhost
2. **Email notifikasi** — kirim email ke pelanggan saat pesanan diverifikasi (PHPMailer)
3. **Export pesanan** — download daftar pesanan sebagai CSV/Excel dari admin panel
4. **Deploy ke hosting** — upload semua file, import SQL, ganti `BASE_URL` dan Midtrans ke Production key
5. **Hapus file debug** — `debug_login.php`, `debug_midtrans.php`, `reset_password.php`