Setup SID Owner Dashboard
Multi-Tenant

Download 4 file berikut dari chat ini ke laptop kamu. Buat folder khusus, misalnya D:\SID-Dashboard\

Buka file config.php dengan Notepad atau VSCode. Ganti 4 baris ini:

// Ganti sesuai data ptborneorp.com
define('DB_NAME',   'u1376210_ptborneodb');
define('DB_USER',   'u1376210_brp_ro');   ← user yg akan dibuat
define('DB_PASS',   'isi_password_nanti'); ← isi setelah buat user
define('API_TOKEN', 'borneo-8f4a2b9c-1e7d-4f6a-9b3e-2c5d8a1f4e7b');

Cara buat TOKEN: Token adalah kata sandi rahasia API. Buat string acak yang panjang. Contoh mudah: gabungkan nama domain + angka acak + karakter unik.

• 1Buka browser di laptop
• 2Ketik di address bar: srv85.niagahoster.com:2083
• 3Masukkan username dan password cPanel
• 4Setelah masuk, klik ikon File Manager

• 1Di panel kiri File Manager, klik folder ptborneorp.com
• 2Pastikan address bar menunjukkan: /home/xxxxx/ptborneorp.com
• 3Lihat daftar file di kanan — ada index.php lama, dashboard.php, dll
• 4Klik tombol "+ Folder" di toolbar atas
• 5Isi nama folder: owner-api
• 6Klik "Create New Folder"

• 1Klik folder owner-api yang baru dibuat untuk masuk ke dalamnya
• 2Pastikan address bar: /home/xxxxx/ptborneorp.com/owner-api
• 3Klik tombol "Upload" di toolbar atas
• 4Upload 3 file ini: index.php, config.php, .htaccess
• 5Tunggu sampai progress bar 100%
• 6Klik "Go Back to /owner-api"
• 7Pastikan 3 file sudah terlihat di daftar

Langkah 6A — Buat User Baru:

• 1Klik logo cPanel di pojok kiri atas untuk kembali ke menu utama
• 2Cari dan klik "MySQL Databases"
• 3Scroll ke bagian "MySQL Users" → "Add New User"
• 4Isi username: brp_ro (nama lengkap jadi: u1376210_brp_ro)
• 5Klik "Password Generator" → copy password yang dibuat → simpan di spreadsheet
• 6Klik "Create User"

Langkah 6B — Tambahkan ke Database:

• 1Scroll ke bagian "Add User To Database"
• 2User: pilih u1376210_brp_ro
• 3Database: pilih u1376210_ptborneodb
• 4Klik "Add"

Langkah 6C — Set Privileges (PENTING!):

• 1Di halaman "Manage User Privileges" yang muncul
• 2CENTANG HANYA: SELECT
• 3Pastikan INSERT, UPDATE, DELETE, DROP, dll TIDAK dicentang
• 4Klik "Make Changes"

Langkah 6D — Update Password di config.php:

• 1Kembali ke File Manager → masuk ke folder owner-api
• 2Klik kanan config.php → pilih "Edit"
• 3Ganti baris DB_PASS dengan password yang dibuat di langkah 6A
• 4Klik "Save Changes"

Buka tab browser baru dan ketik URL ini (ganti TOKEN dengan milikmu):

https://ptborneorp.com/owner-api/index.php?action=ping&token=TOKEN_KAMU

Hasil yang BENAR — browser menampilkan JSON seperti ini:

{
  "success": true,
  "data": {
    "status": "OK",
    "database": "u1376210_ptborneodb",
    "timestamp": "2026-06-09 10:30:00"
  },
  "message": "Koneksi berhasil"
}

Kalau muncul JSON seperti itu → BERHASIL ✅ Lanjut ke Fase 2

Kalau muncul error → lihat tabel ini:

Setelah ping OK, test juga data nyata:

# Test semua data sekaligus
https://ptborneorp.com/owner-api/index.php?action=all&token=TOKEN

# Test per bagian
https://ptborneorp.com/owner-api/index.php?action=overview&token=TOKEN
https://ptborneorp.com/owner-api/index.php?action=proyek&token=TOKEN
https://ptborneorp.com/owner-api/index.php?action=approval&token=TOKEN

• 1Buka browser, ketik: nodejs.org
• 2Klik tombol besar "LTS" (bukan Current)
• 3Download file installer (.msi untuk Windows)
• 4Jalankan installer — klik Next terus sampai selesai
• 5Restart laptop setelah install

Cara cek berhasil:

# Buka Command Prompt (Win+R → ketik cmd → Enter)
node --version
# Harus muncul: v18.x.x atau v20.x.x

npm --version
# Harus muncul angka versi

Buka Command Prompt (Win+R → ketik cmd → Enter), lalu ketik perintah ini satu per satu:

# 1. Pindah ke Desktop
cd Desktop

# 2. Buat project React baru
npm create vite@latest sid-dashboard -- --template react
# Ketik Y kalau ada pertanyaan, tekan Enter

# 3. Masuk ke folder project
cd sid-dashboard

# 4. Install dependencies
npm install
npm install recharts

# 5. Tunggu sampai selesai (2-5 menit)

Setelah selesai, masukkan file dashboard:

• 1Buka File Explorer → Desktop → sid-dashboard → src
• 2Hapus file App.jsx yang ada
• 3Copy file sid-multitenant-dashboard.jsx ke folder src
• 4Rename file itu menjadi App.jsx

Buka App.jsx dengan VSCode atau Notepad. Cari bagian const TENANTS = [ dan tambahkan apiUrl dan token:

{
  id: "borneo",
  nama: "PT Borneo Real Properti",
  domain: "ptborneorp.com",
  apiUrl: "https://ptborneorp.com/owner-api/index.php",  ← tambah
  token: "borneo-8f4a2b9c-1e7d-4f6a-9b3e-2c5d8a1f4e7b",  ← tambah
  logo: "🏢",
  warna: "#1d4ed8"
},

Lalu cari fungsi loadData di dalam komponen CompanyDashboard dan ganti isinya:

// HAPUS baris mock data lama, GANTI dengan ini:
try {
  const res = await fetch(
    tenant.apiUrl + '?action=all',
    { headers: { 'Authorization': `Bearer ${tenant.token}` } }
  );
  const json = await res.json();
  if (!json.success) throw new Error(json.error);
  setData(json.data);
  setApprovs(json.data.approvals || []);
  setLastUpdate(json.data.lastUpdate || '');
} catch(err) {
  // Fallback ke mock data kalau API belum siap
  const mock = generateMockData(tenant.id);
  setData(mock);
  setApprovs(mock.approvals);
  setLastUpdate('Offline Mode');
} finally {
  setLoading(false);
}

Test di lokal dulu sebelum deploy:

# Di Command Prompt, di folder sid-dashboard
npm run dev

# Buka browser: http://localhost:5173
# Login: superadmin / SID@admin2026!

Langkah 11A — Buat Akun Vercel:

• 1Buka: vercel.com
• 2Klik "Sign Up"
• 3Pilih "Continue with GitHub" (daftar GitHub dulu kalau belum punya — gratis)
• 4Ikuti proses sampai akun aktif

Langkah 11B — Deploy Dashboard:

# Di Command Prompt, masih di folder sid-dashboard

# Install Vercel CLI
npm install -g vercel

# Login ke Vercel
vercel login
# Ikuti instruksi, login dengan email Vercel

# Deploy!
vercel
# Jawab semua pertanyaan dengan Enter atau Y
# Tunggu build selesai...

Untuk update dashboard di kemudian hari (setelah edit App.jsx):

vercel --prod

Untuk setiap domain baru, ulangi 4 langkah ini (±15 menit):

• 1Copy file config.php yang sudah ada
• 2Edit: ganti DB_NAME, DB_USER, DB_PASS, dan TOKEN dengan yang baru
• 3TOKEN harus berbeda dari domain lain — buat yang unik baru
• 4Catat semua di spreadsheet sebelum lanjut

• 1File Manager → masuk ke domain baru → buat folder owner-api
• 2Upload 3 file: index.php (sama), config.php (baru), .htaccess (sama)
• 3MySQL Databases → buat user readonly baru → tambah ke database → SELECT only
• 4Update DB_PASS di config.php

https://namadomainbaru.com/owner-api/index.php?action=ping&token=TOKEN_BARU
# Pastikan muncul {"success":true,...}

• 1Buka App.jsx → cari domain baru di array TENANTS
• 2Tambahkan apiUrl dan token yang baru
• 3Di Command Prompt: vercel --prod

Buka App.jsx, cari bagian const USERS = [, tambahkan akun:

const USERS = [
  // Super admin — bisa lihat semua perusahaan
  { username:"superadmin",    password:"SID@admin2026!",
    nama:"Super Administrator", role:"superadmin", tenantId:null },

  // Owner per perusahaan
  { username:"owner.borneo",   password:"BRP@owner2026!",
    nama:"Jesika Wianda Putri", role:"owner", tenantId:"borneo" },

  { username:"owner.aksis",    password:"Aksis@owner2026!",
    nama:"Owner Aksis",       role:"owner", tenantId:"aksis" },

  // Tambah terus untuk 40 perusahaan...
];

Setelah selesai edit, deploy ulang:

vercel --prod

Template pesan WhatsApp untuk dikirim ke masing-masing owner:

Yth. Bapak/Ibu [Nama Owner],

Dashboard monitoring proyek Anda sudah siap.

🔗 *Link:* https://sid-dashboard-xxx.vercel.app
👤 *Username:* owner.namaanda
🔑 *Password:* [isi password]

*Fitur yang tersedia:*
✅ Pantau semua proyek real-time
✅ Lihat saldo rekening bank tiap proyek
✅ Monitor performa tim marketing
✅ Approve/tolak pengajuan langsung dari HP
✅ Data update otomatis setiap 3 menit

Bisa diakses dari HP, tablet, atau komputer kapan saja.

Salam,
[Nama Kamu]