9.1 KiB
Codingan Diagram (Mermaid) Lengkap - Sistem Monitoring Penugasan
Anda dapat menyalin (copy) kode-kode di bawah ini ke dalam Mermaid Live Editor (https://mermaid.live/) atau Draw.io (Insert > Advanced > Mermaid) untuk menjadikannya gambar.
1. Usecase Diagram Lengkap (Termasuk CRUD)
Menggambarkan interaksi menyeluruh dari autentikasi, CRUD data, hingga ekspor.
usecaseDiagram
actor Pegawai
actor Admin
actor "Super Admin" as SA
rectangle "Sistem Monitoring Penugasan" {
%% Autentikasi
usecase "Melakukan Login & Logout" as Auth
usecase "Mengelola Profil Diri" as Profil
%% CRUD Kegiatan
usecase "Melihat Daftar Kegiatan (Read)" as CRUD_R
usecase "Menambah Laporan Baru (Create)" as CRUD_C
usecase "Mengubah Laporan (Update)" as CRUD_U
usecase "Menghapus/Membatalkan Laporan (Delete)" as CRUD_D
%% Tindakan Lanjutan
usecase "Meninjau Kegiatan (Ubah ke Ditinjau)" as Review
usecase "Menyetujui Kegiatan (Ubah ke Selesai)" as Approve
usecase "Melihat Statistik Dashboard" as Dash
%% CRUD Pengguna
usecase "Manajemen Akun User & Pegawai (CRUD)" as KelolaUser
usecase "Mengekspor Laporan Excel" as Export
}
Pegawai --> Auth
Pegawai --> Profil
Pegawai --> CRUD_R
Pegawai --> CRUD_C
Pegawai --> CRUD_U
Admin --> Auth
Admin --> Profil
Admin --> Dash
Admin --> CRUD_R
Admin --> Review
Admin --> KelolaUser
SA --> Auth
SA --> Profil
SA --> Dash
SA --> CRUD_R
SA --> Approve
SA --> CRUD_D
SA --> KelolaUser
SA --> Export
2. Flowchart Sistem (Menyesuaikan dengan Gambar Referensi)
Flowchart ini disusun persis seperti gambar alur sistem yang Anda lampirkan, disesuaikan dengan arsitektur backend Monitoring Penugasan Pegawai di Dinas Tenaga Kerja dan Transmigrasi.
flowchart TD
%% Tampilan (Styling) Node agar rapi
classDef startEnd fill:#fff,stroke:#333,stroke-width:2px;
classDef process fill:#fff,stroke:#333,stroke-width:1px;
classDef decision fill:#fff,stroke:#333,stroke-width:1px;
classDef io fill:#fff,stroke:#333,stroke-width:1px;
Start([Mulai]):::startEnd --> B[Membuka Aplikasi]:::process
B --> C[Login]:::process
C --> D[/Input Username dan Password/]:::io
D --> E{Validasi?}:::decision
E -- Tidak --> D
E -- Ya --> F[Sistem Mengecek Role]:::process
F --> R_USER[Dashboard Pegawai]:::process
F --> R_ADMIN[Dashboard Admin]:::process
F --> R_SA[Dashboard Super Admin]:::process
%% ================= ALUR PEGAWAI =================
R_USER --> U_M{Menu User}:::decision
U_M --> U_M1[Tambah Laporan]:::process
U_M1 --> U_M1A[/Input Data & Upload Berkas/]:::io
U_M1A --> U_M1B[Simpan Data ke Database]:::process
U_M1B --> J1(( ))
U_M --> U_M2[Riwayat Laporan]:::process
U_M2 --> U_M2A[/Lihat Seluruh Laporan/]:::io
U_M2A --> U_M2B{Status Laporan?}:::decision
U_M2B -- Ditolak / Pending --> U_M2B1[/Input Data & Upload Berkas Ulang/]:::io
U_M2B1 --> J1
U_M2B -- Diterima / Selesai --> J1
%% ================= ALUR ADMIN =================
R_ADMIN --> A_M{Menu Admin}:::decision
A_M --> A_M1[Kelola Laporan]:::process
A_M1 --> A_M1A[/Lihat Laporan Masuk/]:::io
A_M1A --> A_M1B{Status Laporan?}:::decision
A_M1B -- Valid --> A_M1B1[Update Status 'Telah Ditinjau']:::process
A_M1B1 --> A_M1B1A[Update Data di DB]:::process
A_M1B1A --> J2(( ))
A_M1B -- Tidak Valid --> A_M1B2[Revisi Laporan / Tolak]:::process
A_M1B2 --> A_M1B2A[Update Data di DB]:::process
A_M1B2A --> J2
A_M1B -- Dipending --> A_M1B3[/Lihat Detail Laporan/]:::io
A_M1B3 --> J2
A_M --> A_M2[Riwayat Laporan]:::process
A_M2 --> A_M2A[/Lihat Seluruh Laporan/]:::io
A_M2A --> A_M2B[/Unduh Laporan/]:::io
A_M2B --> J2
A_M --> A_M3[Kelola Data Akun & Berkas]:::process
A_M3 --> A_M3A[/Input Data Pegawai Baru/]:::io
A_M3A --> A_M3B[Simpan Data di Database]:::process
A_M3B --> J2
%% ================= ALUR SUPER ADMIN =================
R_SA --> SA_M{Menu Super Admin}:::decision
SA_M --> SA_M1[Lihat Laporan]:::process
SA_M1 --> SA_M1B{Status Laporan?}:::decision
SA_M1B -- Diterima (Approve) --> SA_M1B1[/Update Status 'Selesai'/]:::io
SA_M1B -- Ditolak / Dipending --> SA_M1B2[/Lihat Detail Laporan/]:::io
SA_M1B1 --> J3(( ))
SA_M1B2 --> J3
%% ================= PENYELESAIAN =================
J1 --> N[/Notifikasi/]:::io
J2 --> N
J3 --> N
N --> K[Menu Profil]:::process
K --> L[Logout]:::process
L --> End([Selesai]):::startEnd
2.B Flowchart Logika Backend Murni (Alur Proses API & Database)
Flowchart ini adalah flowchart yang sangat disarankan untuk digunakan dalam Laporan Anda karena berfokus pada apa yang terjadi di "belakang layar" (Backend), mulai dari penerimaan Request HTTP, middleware, validasi, hingga interaksi dengan Database MySQL.
flowchart TD
classDef startEnd fill:#fff,stroke:#333,stroke-width:2px;
classDef process fill:#fff,stroke:#333,stroke-width:1px;
classDef decision fill:#fff,stroke:#333,stroke-width:1px;
classDef io fill:#fff,stroke:#333,stroke-width:1px;
Start([Mulai (Request dari Frontend)]):::startEnd --> REQ[/Menerima HTTP Request\n(POST/GET/PUT/DELETE)/]:::io
%% Middleware Auth & Role
REQ --> MID_AUTH{Cek Token Sanctum?}:::decision
MID_AUTH -- Tidak Valid / Kosong --> ERR401[/Return JSON: 401 Unauthorized/]:::io
MID_AUTH -- Valid --> MID_ROLE{Cek Role Akses?}:::decision
MID_ROLE -- Ditolak --> ERR403[/Return JSON: 403 Forbidden/]:::io
%% Validasi Controller
MID_ROLE -- Diizinkan --> CTRL[Controller Menerima Request]:::process
CTRL --> VAL{Validasi Payload Data\n(Input Kosong/Salah)?}:::decision
VAL -- Gagal --> ERR422[/Return JSON: 422 Unprocessable Entity/]:::io
%% Proses Database
VAL -- Sukses --> DB_OP[Eksekusi Logika Bisnis & Query Database]:::process
DB_OP --> DB_ACT{Jenis Operasi?}:::decision
DB_ACT -- Create/Insert --> DB1[Simpan Data Baru ke Tabel]:::process
DB_ACT -- Read/Select --> DB2[Ambil Data dari Tabel]:::process
DB_ACT -- Update --> DB3[Perbarui Data di Tabel]:::process
DB_ACT -- Delete --> DB4[Soft Delete Data (Ubah deleted_at)]:::process
DB1 --> RES[/Return JSON: 201 Created/]:::io
DB2 --> RES2[/Return JSON: 200 OK + Data/]:::io
DB3 --> RES2
DB4 --> RES2
%% End
ERR401 --> End([Selesai (Response Terkirim)]):::startEnd
ERR403 --> End
ERR422 --> End
RES --> End
RES2 --> End
3. Data Flow Diagram (DFD) Level 0 (Konteks)
Menggambarkan aliran input/output makro sistem.
flowchart LR
P[Pegawai] -- "Data Kredensial\nData Laporan Kegiatan\nData Edit Kegiatan" --> S((Sistem Monitoring\nPenugasan Pegawai))
S -- "Status Laporan\nDaftar Kegiatanku\nKonfirmasi Login" --> P
A[Admin] -- "Data Manajemen User (CRUD)\nInstruksi Review Laporan\nData Kredensial" --> S
S -- "Rekap Seluruh Laporan (Proses)\nData Tabel Pegawai\nDashboard Stats" --> A
SA[Super Admin] -- "Instruksi Approval (Selesai)\nInstruksi Pembatalan (Delete)\nPerintah Export Excel" --> S
S -- "Rekap Seluruh Laporan (Ditinjau)\nFile Export (XLSX)\nDashboard Stats" --> SA
4. Entity Relationship Diagram (ERD) Komprehensif
Menggambarkan seluruh struktur database berbasis Laravel Backend, termasuk token otentikasi Sanctum dan soft deletes (Fitur Hapus).
erDiagram
USERS ||--o| PEGAWAI : "Satu profil per user"
USERS ||--o{ PENUGASAN : "Dibuat oleh (created_by)"
USERS ||--o{ PENUGASAN : "Disetujui oleh (approved_by)"
PEGAWAI }|--|{ PENUGASAN_PEGAWAI : "Ditugaskan pada"
PENUGASAN }|--|{ PENUGASAN_PEGAWAI : "Melibatkan pegawai"
USERS ||--o{ PERSONAL_ACCESS_TOKENS : "Memiliki token (Login)"
USERS {
bigint id PK
string name
string username "UNIQUE"
string email "UNIQUE"
string password
enum role "superadmin, admin, user"
string jabatan "nullable"
timestamp created_at
timestamp updated_at
}
PEGAWAI {
bigint id PK
string nip "UNIQUE"
string nama
string jabatan
bigint user_id FK
timestamp deleted_at "Soft Deletes"
}
PENUGASAN {
bigint id PK
string nomor_surat "UNIQUE"
string kegiatan
string lokasi
text keterangan
date tanggal_mulai
date tanggal_selesai
enum status "proses, selesai, telah_ditinjau"
bigint created_by FK
bigint approved_by FK
timestamp approved_at
text alasan_hapus
timestamp deleted_at "Soft Deletes"
}
PENUGASAN_PEGAWAI {
bigint id PK
bigint penugasan_id FK
bigint pegawai_id FK
}
PERSONAL_ACCESS_TOKENS {
bigint id PK
string tokenable_type
bigint tokenable_id FK
string name
string token "UNIQUE"
text abilities
timestamp last_used_at
timestamp expires_at
}