forked from izu/student-web-if-development-kit
cygouw
126 lines
4.8 KiB
Markdown
126 lines
4.8 KiB
Markdown
# Panduan Pengelolaan Data Kelompok C4A
|
||
|
||
Dokumentasi ini dibuat untuk memudahkan pengembang atau pengguna berikutnya dalam mengelola data Staf Pendukung, SOP, dan FAQ pada halaman C4A.
|
||
|
||
---
|
||
|
||
## 📋 Aturan Umum Pengelolaan Data
|
||
|
||
1. **Lokasi Berkas Data**:
|
||
Seluruh data disimpan dalam format JSON di direktori `groups/C4A/data/`:
|
||
- Data Staf: `groups/C4A/data/data-staff.json`
|
||
- Data SOP: `groups/C4A/data/data-sop.json`
|
||
- Data FAQ: `groups/C4A/data/data-faq.json`
|
||
|
||
2. **Dukungan Bilingual (ID/EN)**:
|
||
Semua teks konten yang ditampilkan ke pengguna mendukung dua bahasa. Anda perlu menggunakan objek dengan properti `id` (Bahasa Indonesia) dan `en` (Bahasa Inggris) pada setiap field teks. Jika properti `en` tidak diisi atau data masih berupa *string* biasa, sistem akan otomatis menggunakan Bahasa Indonesia sebagai *fallback*.
|
||
|
||
3. **Ikon FontAwesome (v4)**:
|
||
Jika ingin mengubah atau menambahkan logo/ikon pada data SOP, harap gunakan daftar ikon dari **FontAwesome v4** melalui tautan berikut:
|
||
👉 **[FontAwesome v4 Icons](https://fontawesome.com/v4/icons/)** (Contoh penggunaan: `fa-dot-circle-o`, `fa-graduation-cap`, `fa-flask`).
|
||
|
||
4. **Field Opsional**:
|
||
Pada data SOP, properti **`staff_responsible`** (Staf Bertanggung Jawab) dan **`additional_info`** (Informasi Tambahan) bersifat **opsional**. Jika informasi tersebut tidak tersedia, kosongkan nilainya atau hapus propertinya dari JSON agar UI secara otomatis menyembunyikan bloknya.
|
||
|
||
---
|
||
|
||
## 🛠️ Template Penambahan Data
|
||
|
||
Silakan salin-tempel (copy-paste) format di bawah ini ke dalam array JSON yang sesuai di folder `data/` untuk menambahkan data baru.
|
||
|
||
### 1. Template Data Staf (`data-staff.json`)
|
||
```json
|
||
{
|
||
"id": 3,
|
||
"name": "Nama Staf Beserta Gelar",
|
||
"role": {
|
||
"id": "Peran / Jabatan Staf",
|
||
"en": "Staff Role / Title"
|
||
},
|
||
"image": "assets/images/nama-file-foto.png",
|
||
"location": {
|
||
"id": "Lokasi Ruang Kerja / Kantor Staf",
|
||
"en": "Staff Workspace / Office Location"
|
||
},
|
||
"contact_consent": true,
|
||
"phone": "628xxxxxxxxxx",
|
||
"schedule": [
|
||
{
|
||
"day": {
|
||
"id": "Hari Kerja (contoh: Senin – Jumat)",
|
||
"en": "Work Days (e.g., Monday – Friday)"
|
||
},
|
||
"time": "07.30–16.00 WIB",
|
||
"break": {
|
||
"id": "Jam Istirahat (contoh: istirahat 12.00–13.00 WIB)",
|
||
"en": "Break Time (e.g., break 12.00–13.00 WIB)"
|
||
}
|
||
}
|
||
],
|
||
"tasks": [
|
||
{
|
||
"id": "Tugas dan tanggung jawab utama 1",
|
||
"en": "Main task and responsibility 1"
|
||
},
|
||
{
|
||
"id": "Tugas dan tanggung jawab utama 2",
|
||
"en": "Main task and responsibility 2"
|
||
}
|
||
]
|
||
}
|
||
```
|
||
*Catatan: Letakkan file gambar/foto staf ke dalam direktori `groups/C4A/assets/images/` dan masukkan nama berkas fotonya pada properti `image` di atas. Untuk nomor telepon (`phone`), Anda dapat menggunakan format `08xxxxxxxxxx` atau `628xxxxxxxxxx` karena skrip JavaScript akan melakukan normalisasi secara otomatis.*
|
||
|
||
### 2. Template Data SOP (`data-sop.json`)
|
||
```json
|
||
{
|
||
"tab_id": "id-unik-sop-tanpa-spasi",
|
||
"tab_number": 9,
|
||
"category": "akademik",
|
||
"icon": "fa-file-text",
|
||
"title": {
|
||
"id": "Judul Lengkap SOP",
|
||
"en": "Full SOP Title"
|
||
},
|
||
"description": {
|
||
"id": "Deskripsi singkat mengenai SOP ini.",
|
||
"en": "Brief description of this SOP."
|
||
},
|
||
"purpose": {
|
||
"id": "Tujuan dibuatnya standar operasional prosedur ini.",
|
||
"en": "The purpose of creating this standard operating procedure."
|
||
},
|
||
"requirements": [
|
||
{ "id": "Persyaratan administratif/akademik 1", "en": "Administrative/academic requirement 1" },
|
||
{ "id": "Persyaratan administratif/akademik 2", "en": "Administrative/academic requirement 2" }
|
||
],
|
||
"procedures": [
|
||
{ "id": "Langkah alur prosedur ke-1", "en": "Procedure flow step 1" },
|
||
{ "id": "Langkah alur prosedur ke-2", "en": "Procedure flow step 2" }
|
||
],
|
||
"staff_responsible": [
|
||
"👤 Staf Administrasi Informatika / Informatics Administrative Staff"
|
||
],
|
||
"additional_info": {
|
||
"id": "Informasi tambahan penting.",
|
||
"en": "Important additional information."
|
||
}
|
||
}
|
||
```
|
||
*Catatan: Properti `category` bernilai antara `"akademik"` atau `"praktikum"`. Properti `staff_responsible` dan `additional_info` bersifat opsional.*
|
||
|
||
### 3. Template Data FAQ (`data-faq.json`)
|
||
```json
|
||
{
|
||
"id": 11,
|
||
"question": {
|
||
"id": "Pertanyaan yang sering diajukan?",
|
||
"en": "Frequently asked question?"
|
||
},
|
||
"answer": {
|
||
"id": "Jawaban dari pertanyaan tersebut. Boleh menggunakan tag HTML seperti <strong>tebal</strong>.",
|
||
"en": "Answer to the question. HTML tags like <strong>bold</strong> can be used."
|
||
}
|
||
}
|
||
```
|