🏗️ Arsitektur Sistem Manajemen Fee (FMS)

I. Stack Teknologi dan Arsitektur Dasar

Komponen

Teknologi

Peran

Framework (Backend)

Laravel (PHP)

Menyediakan struktur MVC, ORM (Eloquent), Routing, Otentikasi, dan Middleware.

Database

MySQL (via phpMyAdmin)

Menyimpan semua data transaksional dan master.

Frontend/UI

Blade Templating + Tailwind CSS

Membangun antarmuka yang Responsif dan Mobile-Friendly.

Grafik/Visualisasi

Chart.js atau sejenisnya

Digunakan di sisi Frontend untuk menampilkan data statistik Dashboard.

II. Struktur Database (Model Eloquent Laravel)

Kami mengadopsi skema sebelumnya dengan penyesuaian nama untuk mengikuti konvensi Laravel (plural untuk nama tabel, Singular untuk nama Model).

1. Model: User (users)

Fungsi: Otentikasi dan Otorisasi.

Relasi:

hasMany(Marketing::class): Sebagai PIC Owner.

hasMany(PengajuanFee::class): Sebagai PIC Pengaju.

2. Model: Marketing (marketings)

Fungsi: Data rekening penerima fee.

Relasi:

belongsTo(User::class, 'id_pic_owner'): Pemilik data rekening.

hasMany(PengajuanFee::class): Dapat diajukan berkali-kali.

Kunci Penting: id_pic_owner (FK) memastikan data hanya diakses oleh pemiliknya.

3. Model: PengajuanFee (pengajuan_fees)

Fungsi: Data transaksi inti.

Relasi:

belongsTo(User::class, 'id_pic_pengaju'): PIC yang mengajukan.

belongsTo(Marketing::class, 'id_marketing_penerima'): Data rekening yang dituju.

III. Komponen Backend (Laravel Development)

1. Otentikasi dan Otorisasi (Middleware & Gates/Policies)

Komponen

Keterangan

Authentication

Menggunakan Laravel Breeze/Jetstream atau scaffolding Auth dasar.

Middleware Role

Middleware (RoleCheck) yang memisahkan akses: isPIC dan isKeuangan.

Policies

Digunakan untuk mengamankan data pada level Model. Contoh: MarketingPolicy memastikan update dan delete hanya diizinkan jika Marketing.id_pic_owner == Auth::id().

2. Struktur Controller dan Routing

Pengelompokan rute harus menggunakan middleware untuk membatasi akses sesuai peran.

Peran

Controller

Rute Utama

Fungsi Utama

Umum

AuthController

/login, /logout

Proses masuk dan keluar.

PIC

PIC\MarketingController

/pic/marketing

CRUD data Marketing (rekening tujuan).

PIC

PIC\PengajuanController

/pic/pengajuan

CRUD Pengajuan (PIC hanya bisa melihat data sendiri).

Keuangan

Keuangan\DashboardController

/keuangan/dashboard

Menampilkan Statistik dan Grafik.

Keuangan

Keuangan\DataPengajuanController

/keuangan/data-pengajuan

Menampilkan semua pengajuan untuk verifikasi.

Keuangan

Keuangan\UserController

/keuangan/users

CRUD user (Penerima yang mengelola user).

IV. Komponen Frontend (UI dan Navigasi Mobile-First)

1. Dashboard Keuangan (Penerima)

Fokus: Rangkuman Keuangan dan Kinerja

Bagian

Konten

Logic Data

Summary Cards

Total Fee Belum Dibayar, Total Pengajuan Bulan Ini, Jumlah Plafon Cair Tertunda.

Query agregasi status 'Menunggu Verifikasi' dan 'Disetujui'.

Grafik Kinerja Tim (PIC)

Bar Chart: Top 5 PIC/Tim dengan Fee Tertinggi.

Query: Group by id_pic_pengaju, SUM(jumlah_fee), Order by total DESC.

Grafik Kinerja Marketing

Bar Chart: Top 5 Marketing dengan Fee Tertinggi.

Query: Group by id_marketing_penerima, SUM(jumlah_fee), Join ke tabel Marketing. Order by total DESC.

Grafik Status

Pie Chart: Proporsi Status Pengajuan (Menunggu, Disetujui, Ditolak).

Query: Count by status.

2. Halaman Data Pengajuan (Keuangan)

Fokus: Operasional dan Verifikasi

Tampilan: Tabel besar (datatable) yang menampilkan semua data, dengan filter cepat berdasarkan status.

Detail Transaksi: Saat Penerima mengklik, muncul modal atau halaman detail yang menampilkan semua informasi (Plafon, Hitungan Fee, Detail Rekening Marketing, Nama PIC Pengaju).

Tombol Aksi: Tampilkan tombol SETUJUI, TOLAK (wajib input alasan), dan TANDAI SUDAH DIBAYAR di halaman detail ini.

3. Navigasi Responsif

Peran

Mobile Nav (Bottom Bar)

Desktop Nav (Sidebar)

PIC (Pengaju)

1. Ajukan Fee (Form) 



 2. Riwayat (List data sendiri)

Menu Manajemen Marketing (CRUD Rekening) juga diletakkan di Sidebar.

Keuangan (Penerima)

1. Dashboard 



 2. Data Pengajuan (List semua data) 



 3. Kelola User

Menu Kelola User dan Data Pengajuan diprioritaskan di Sidebar.

V. Logika Khusus Pelaporan (Eloquent Query Blueprint)

Grafik di Dashboard Penerima (Keuangan) memerlukan query yang efisien. Asumsikan kita hanya menghitung fee yang sudah disetujui (status = 'Disetujui' atau status = 'Sudah Dibayar').

1. Query Top PIC/Tim (Fee Tertinggi)

// Laravel Eloquent Blueprint - Top PIC
$topPICs = PengajuanFee::selectRaw('id_pic_pengaju, SUM(jumlah_fee) as total_fee')
    ->whereIn('status', ['Disetujui', 'Sudah Dibayar'])
    ->groupBy('id_pic_pengaju')
    ->orderByDesc('total_fee')
    ->limit(5)
    ->with('pengaju') // Join ke tabel User
    ->get();


2. Query Top Marketing (Fee Tertinggi)

// Laravel Eloquent Blueprint - Top Marketing
$topMarketings = PengajuanFee::selectRaw('id_marketing_penerima, SUM(jumlah_fee) as total_fee')
    ->whereIn('status', ['Disetujui', 'Sudah Dibayar'])
    ->groupBy('id_marketing_penerima')
    ->orderByDesc('total_fee')
    ->limit(5)
    ->with('penerimaMarketing') // Join ke tabel Marketing
    ->get();


Dengan arsitektur ini, Anda memiliki pembagian tugas yang jelas (PIC untuk input, Keuangan untuk verifikasi/pembayaran) dan logic query siap untuk diimplementasikan menggunakan Laravel Eloquent.