> ## Documentation Index
> Fetch the complete documentation index at: https://docs.quinnsambal.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Company HR — Hub SDM

> Hub manajemen SDM: direktori karyawan, pengelolaan cuti, pinjaman karyawan, dan widget KPI di SNISHOP ERP.

# Company HR — Hub SDM

<img src="https://mintcdn.com/quinnofspicy/e4f_upKhVWcjsUmM/docs/mintlify/screenshots/hr/company-hr.png?fit=max&auto=format&n=e4f_upKhVWcjsUmM&q=85&s=37569785e18a93164a34d58a9ff47b57" alt="Company HR" width="1920" height="1080" data-path="docs/mintlify/screenshots/hr/company-hr.png" />

Company HR adalah pusat manajemen SDM perusahaan. Halaman ini menggabungkan direktori karyawan, pengelolaan cuti, pinjaman karyawan, dan widget KPI dalam satu dashboard yang terintegrasi.

## Arsitektur

```mermaid theme={null}
graph TB
    subgraph TABS["3 Tab Utama"]
        EMP[Tab: Employees<br/>EmployeeList]
        LV[Tab: Leaves<br/>LeaveManagement]
        LN[Tab: Loans<br/>Inline Cards]
    end

    subgraph HEADER["Hero Header"]
        STAT[Stat Strip<br/>Glassmorphism]
        KPI2[KPI Row<br/>Secondary Metrics]
    end

    subgraph SIDEBAR["Sidebar Widgets"]
        DEPT[Department Breakdown<br/>Progress Bars]
        RLV[Recent Leave Requests]
        QL[Quick Links]
        ROLE[Role Distribution<br/>Badges]
    end

    subgraph ENTITIES["Entitas"]
        CM[CompanyMember]
        CL[CompanyLeave]
        CLN[CompanyLoan]
        CK[CompanyKPI]
    end

    HEADER --> TABS
    EMP --> CM
    LV --> CL
    LN --> CLN
    SIDEBAR --> CM
    SIDEBAR --> CL
    QL --> ATT[Attendance]
    QL --> PAY[Payroll]
    QL --> PR[Performance]
    QL --> REC[Recruitment]
```

## Akses Halaman

URL: `/hr` (halaman default modul HR)

## Tiga Tab Utama

| Tab | Label | Komponen | Fungsi |
| - | - | - | - |
| `employees` | Karyawan | `EmployeeList` | Direktori dan CRUD karyawan |
| `leaves` | Cuti | `LeaveManagement` | Approve/reject pengajuan cuti |
| `loans` | Pinjaman | Inline Cards | Approve/reject pinjaman karyawan |

## Hero Header: Stat Strip

Dashboard menampilkan stat strip dengan efek glassmorphism:

| Metrik | Sumber | Keterangan |
| - | - | - |
| **Total Karyawan** | `CompanyMember` | Total seluruh karyawan |
| **Karyawan Aktif** | `CompanyMember` | Status `active` |
| **Cuti Pending** | `CompanyLeave` | Status `pending` |
| **Pinjaman Aktif** | `CompanyLoan` | Status `approved` |

### KPI Row Sekunder

| Metrik | Perhitungan |
| - | - |
| **Total Pinjaman** | SUM `amount` semua pinjaman |
| **Pinjaman Pending** | SUM `amount` pinjaman `pending` |
| **Cuti Disetujui** | COUNT approved + total hari terpakai |
| **Jumlah Departemen** | COUNT DISTINCT `department` |

## Tab Employees: Direktori Karyawan

Komponen `EmployeeList` menampilkan tabel karyawan dengan kolom:

| Kolom | Field | Deskripsi |
| - | - | - |
| Nama | `user_name` | Nama lengkap karyawan |
| Posisi | `position` | Jabatan |
| Departemen | `department` | Departemen |
| Role | `role` | Role akses sistem |
| Status | `status` | active / inactive / pending |
| Gaji | `salary` | Gaji pokok (format Rupiah) |
| Aksi | — | Edit, Hapus |

### Fitur Direktori

* **Search**: Filter karyawan berdasarkan nama
* **Create**: Tambah karyawan baru via `EmployeeForm`
* **Edit**: Update data karyawan
* **Delete**: Hapus karyawan (owner tidak bisa dihapus)

### Alur Tambah Karyawan

```mermaid theme={null}
sequenceDiagram
    participant Admin
    participant Form as EmployeeForm
    participant SF as Server Function
    participant BC as BroadcastChannel
    participant Email

    Admin->>Form: Isi data karyawan
    Form->>SF: createCompanyEmployee(data)
    SF-->>Form: Employee created
    Form->>SF: createCompanyInvitation(email)
    SF-->>Form: Invitation sent
    Form->>BC: Broadcast new member
    Form->>Email: SendEmail(invitation)
    Form->>SF: refreshCompanyEmployeeCount()
```

### Role-Based Permission Auto-Assignment

Saat membuat karyawan baru, sistem otomatis menetapkan permission berdasarkan role:

| Role | Permission Default |
| - | - |
| `owner` | Semua permission |
| `admin` | Semua permission |
| `hr_admin` | `can_view_hr`, `can_edit_hr`, `can_view_finance` |
| `finance_admin` | `can_view_finance`, `can_edit_finance` |
| `supervisor` | `can_view_hr` (team), `can_view_finance` |
| `employee` | `can_view_hr` (self only) |

## Tab Leaves: Pengelolaan Cuti

Komponen `LeaveManagement` menampilkan daftar pengajuan cuti dengan aksi approve/reject.

### Entitas: CompanyLeave

| Field | Tipe | Deskripsi |
| - | - | - |
| `company_id` | string | ID perusahaan |
| `employee_id` | string | ID karyawan |
| `employee_name` | string | Nama karyawan |
| `leave_type` | enum | Jenis cuti (6 tipe) |
| `start_date` | date | Tanggal mulai |
| `end_date` | date | Tanggal selesai |
| `total_days` | number | Total hari (auto-hitung) |
| `reason` | string | Alasan cuti |
| `description` | string | Deskripsi detail |
| `status` | enum | Status persetujuan |
| `approved_at` | datetime | Waktu persetujuan |
| `approved_by` | string | ID approver |

### Jenis Cuti

| Tipe | Label | Keterangan |
| - | - | - |
| `annual` | Cuti Tahunan | Cuti tahunan reguler |
| `sick` | Cuti Sakit | Cuti karena sakit (dengan surat dokter) |
| `unpaid` | Cuti Tanpa Bayaran | Cuti di luar tanggungan perusahaan |
| `maternity` | Cuti Melahirkan | Cuti melahirkan |
| `paternity` | Cuti Ayah | Cuti kelahiran anak |
| `emergency` | Cuti Darurat | Cuti keadaan darurat |

### Status Cuti

| Status | Warna | Aksi yang Tersedia |
| - | - | - |
| `pending` | Kuning | Approve, Reject |
| `approved` | Hijau | Cancel |
| `rejected` | Merah | — |
| `cancelled` | Abu-abu | — |

## Tab Loans: Pinjaman Karyawan

### Entitas: CompanyLoan

| Field | Tipe | Deskripsi |
| - | - | - |
| `company_id` | string | ID perusahaan |
| `employee_id` | string | ID karyawan |
| `employee_name` | string | Nama karyawan |
| `amount` | number | Nominal pinjaman |
| `purpose` | string | Tujuan pinjaman |
| `status` | enum | `pending`, `approved`, `rejected` |
| `created_at` | datetime | Waktu pengajuan |

Pinjaman yang disetujui akan muncul sebagai deduction di slip gaji karyawan.

## Sidebar Widgets

### Department Breakdown

Progress bar menampilkan distribusi karyawan per departemen:

```
Produksi    ████████████░░░░ 12 orang
Penjualan   ██████░░░░░░░░░░  6 orang
Keuangan    ████░░░░░░░░░░░░  4 orang
```

### Recent Leave Requests

Daftar pengajuan cuti terbaru dengan status badge.

### Quick Links

Navigasi cepat ke halaman HR lainnya:

| Link | Target |
| - | - |
| Employee Portal | `/employee-portal` |
| Company Attendance | `/company-attendance` |
| Payroll Automation | `/payroll` |
| Performance Reviews | `/performance-reviews` |
| Recruitment ATS | `/recruitment-ats` |

### Role Distribution

Badge menampilkan distribusi role di perusahaan:

| Badge | Count |
| - | - |
| Admin | 2 |
| HR Admin | 1 |
| Supervisor | 3 |
| Employee | 15 |
| Production Operator | 8 |

## Realtime Refresh

Halaman menggunakan `useRealtimeRefresh` untuk auto-refresh saat ada perubahan di entity:

```
watched entities: ['CompanyMember', 'CompanyLeave', 'CompanyLoan']
→ trigger: loadData()
```

## Entitas: CompanyMember (Detail)

| Field | Tipe | Deskripsi |
| - | - | - |
| `company_id` | string | ID perusahaan |
| `user_id` | string | ID user |
| `user_name` | string | Nama lengkap |
| `user_email` | string | Email |
| `phone` | string | Nomor telepon |
| `department` | string | Departemen |
| `position` | string | Jabatan |
| `salary` | number | Gaji pokok |
| `status` | enum | `active`, `inactive`, `pending` |
| `role` | enum | 13 role (lihat tabel di overview) |
| `joined_date` | date | Tanggal bergabung |
| `working_hours` | string | Jam kerja |
| `permissions` | object | Hak akses per modul |
| `avatar_url` | string | URL foto profil |


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.