ERM System: Enterprise Risk Management
Overview
Platform Enterprise Risk Management (ERM) untuk mengelola risiko organisasi di seluruh unit bisnis. Dibangun dari awal sebagai single-page application oleh sole frontend engineer.
Tech Stack:
- Nuxt 3 (SSR) — Vue framework dengan server-side rendering
- Vue 3 + TypeScript — Frontend core
- Pinia — State management (30+ stores)
- Tailwind CSS + Sass — Styling
- Headless UI — Accessible UI primitives
- ApexCharts — Data visualization (bar, donut charts)
- Quill Editor — Rich text editing
- Vee-Validate + Yup — Form validation
- Axios — HTTP client dengan enkripsi AES-CBC
- Docker + Jenkins + Kubernetes — Deployment pipeline
Kontribusi Utama
Architecture & Tooling
Nuxt 3 dengan SSR, Pinia untuk state management, dan modular folder structure untuk 13+ modul bisnis. Konfigurasi Docker, Jenkins, dan Kubernetes.
Component Library (~60+ Komponen)
Form inputs (text, number, price, datepicker, select, switch, file upload, rich text, signature pad, CAPTCHA), data display (tables dengan expandable rows, color-coded status tags, tooltips, dropdown menus), dan chart components.
Modul Bisnis
Risk Register
Multi-step wizard form (identifikasi, pengukuran, treatment, residual risk, PIC assignment) dengan 9-state approval workflow (Draft → Submitted → Reviewed → Approved / Returned / Dropped / Revised).
Risk Library
Risk universe overview, corporate risk periods, risk database dengan general & information security tabs, key risk indicator library.
Risk Treatment
PIC-assigned mitigation plans dengan deadline tracking, approval workflow, dan status management (Need to Update / Needs Approval / Approved / Overdue).
Loss Event
Employee incident reporting dengan manager approval queue, evidence upload, dan 6-state status workflow.
Risk Function
Performance review, risk owner/champion/reviewer/inventor assignment per business unit per period.
Master Data
20+ konfigurasi entitas (risk criteria, scoring matrices, ISMS controls, asset IDs, notification triggers, taxonomies).
User & Access Management
Full CRUD untuk users dengan RBAC — 814+ granular permission rules mengontrol menu visibility, button actions, dan data scoping.
Keamanan
RBAC pada setiap menu, halaman, dan action button. Content Security Policy (CSP). Session timeout detection dengan auto-logout pada 403 response. Math CAPTCHA dan reCAPTCHA pada authentication flows. Enkripsi AES-CBC pada seluruh request/response payload via Axios interceptor.
UX
Lottie animations untuk loading, empty, success, dan error states. Login page dengan animated particle background dan typing text effect. Responsive sidebar dengan collapsible mobile navigation dan role-based menu filtering.