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

# Detail Tugas

> Cara membaca dan memahami informasi lengkap pada halaman detail  tugas di aplikasi mobile OpteraOne.

Halaman **Detail Tugas** menampilkan seluruh informasi yang Anda butuhkan sebelum dan selama mengerjakan tugas — mulai dari lokasi pekerjaan, kontak pelanggan, hingga checklist dan lampiran referensi.

<Note>
  Panduan ini menjelaskan cara **membaca** halaman Detail Tugas. Untuk panduan cara **mengerjakan** tugas, mengisi checklist dan mengirim laporan — lihat seksi [Penyelesaian Tugas →](/memulai-tugas).
</Note>

***

## Membuka Halaman Detail Tugas

Ketuk salah satu kartu tugas dari **Halaman Beranda** atau **Halaman Daftar Tugas** untuk membuka halaman Detail Tugas.

<Frame>
  <img src="https://mintlify.s3.us-west-1.amazonaws.com/ait-8f7a7cd9/images/app-taskdetail-overview.png" alt="Tampilan halaman detail tugas aplikasi" />
</Frame>

***

## Header Informasi Tugas

Bagian atas halaman menampilkan **7 informasi utama** tugas secara sekilas tanpa perlu membuka tab apa pun:

<Frame>
  <img src="https://mintlify.s3.us-west-1.amazonaws.com/ait-8f7a7cd9/images/app-taskdetail-header.png" alt="Header informasi detail tugas" />
</Frame>

| #      | Elemen          | Keterangan                               | Contoh                                  |
| ------ | --------------- | ---------------------------------------- | --------------------------------------- |
| **#1** | Nomor Tugas     | Nomor identifikasi unik tugas            | #AKUANAKAIT-2025013000001               |
| **#2** | Nama Tugas      | Judul pekerjaan yang akan dilakukan      | Upgrade Sistem Keamanan Otomatis        |
| **#3** | Kategori Tugas  | Jenis kategori pekerjaan                 | Sistem Keamanan                         |
| **#4** | Prioritas Tugas | Level urgensi tugas                      | ↑ Prioritas Tinggi                      |
| **#5** | Periode Tugas   | Tanggal & jam mulai hingga berakhir      | 31 Jan 2025, 09:00 — 28 Feb 2025, 13:00 |
| **#6** | Ditugaskan ke   | Nama Agen/Teknisi yang bertanggung jawab | John Doe, Heri Suprapto, +3 lainnya     |
| **#7** | Status Tugas    | Status terkini tugas                     | Aktif                                   |

***

## Tiga Tab Navigasi

Di bawah header informasi, terdapat tiga tab yang dapat diakses dengan mengetuknya:

<Tabs>
  <Tab title="Info Tugas">
    Tab **Info Tugas** adalah tab default yang terbuka pertama kali saat membuka halaman Detail Tugas. Tab ini berisi tiga sub-seksi utama.

    ***

    ### Lokasi Tugas

    Menampilkan alamat lengkap lokasi pekerjaan beserta informasi tambahan seperti nama gedung, lantai, atau landmark terdekat.

    <Frame>
      <img src="https://mintlify.s3.us-west-1.amazonaws.com/ait-8f7a7cd9/images/app-taskdetail-location.png" alt="Seksi lokasi tugas di tab info tugas" />
    </Frame>

    Ketuk tombol **"Buka Map"** untuk membuka rute navigasi ke lokasi pekerjaan langsung di:

    * **Google Maps** (Android & iOS)
    * **Apple Maps** (iOS)

    <Tip>
      Buka Maps **sebelum** berangkat ke lokasi untuk memperkirakan waktu tempuh dan memastikan Anda tiba tepat waktu sesuai jadwal tugas.
    </Tip>

    ***

    ### Kontak Pelanggan

    Menampilkan informasi kontak dari pelanggan atau pihak yang mengajukan permintaan tugas:

    <Frame>
      <img src="https://mintlify.s3.us-west-1.amazonaws.com/ait-8f7a7cd9/images/app-taskdetail-contact.png" alt="Seksi kontak pelanggan di tab info tugas" />
    </Frame>

    | Field          | Keterangan                                 |
    | -------------- | ------------------------------------------ |
    | **Perusahaan** | Nama organisasi atau perusahaan pelanggan  |
    | **Kontak**     | Nama person yang dapat dihubungi di lokasi |
    | **Nomor HP**   | Nomor telepon kontak                       |

    Ketuk tombol **"Hubungi"** untuk langsung melakukan panggilan telepon ke nomor kontak pelanggan.

    ***

    ### Hubungi Admin

    Menampilkan informasi kontak admin yang dapat dihubungi jika ada pertanyaan, kendala, atau kebutuhan koordinasi saat mengerjakan tugas:

    <Frame>
      <img src="https://mintlify.s3.us-west-1.amazonaws.com/ait-8f7a7cd9/images/app-taskdetail-admin.png" alt="Seksi kontak admin di tab info tugas" />
    </Frame>

    | Field        | Keterangan                                       |
    | ------------ | ------------------------------------------------ |
    | **Nama**     | Nama admin yang bertanggung jawab atas tugas ini |
    | **Nomor HP** | Nomor telepon admin                              |

    Ketuk tombol **"Hubungi"** untuk langsung menghubungi admin.

    <Note>
      Jika ada situasi darurat atau kendala di lapangan yang tidak dapat diselesaikan sendiri, segera hubungi admin melalui tombol ini — jangan tunggu sampai laporan dikirim.
    </Note>
  </Tab>

  <Tab title="Ceklis">
    Tab **Ceklis** menampilkan daftar checklist pekerjaan yang harus diselesaikan sebagai bagian dari tugas ini.

    <Frame>
      <img src="https://mintlify.s3.us-west-1.amazonaws.com/ait-8f7a7cd9/images/app-taskdetail-checklist.png" alt="Tab ceklis di halaman detail tugas" />
    </Frame>

    ***

    ### Indikator Progress

    Di bagian atas tab Ceklis terdapat **progress bar** yang menunjukkan persentase checklist yang sudah diselesaikan:

    <Frame>
      <img src="https://mintlify.s3.us-west-1.amazonaws.com/ait-8f7a7cd9/images/app-taskdetail-progress.png" alt="Progress bar checklist tugas" />
    </Frame>

    | Tampilan                       | Keterangan                                         |
    | ------------------------------ | -------------------------------------------------- |
    | **0/16 Tugas Selesai — 0%**    | Tugas baru dimulai, belum ada checklist yang diisi |
    | **8/16 Tugas Selesai — 50%**   | Separuh checklist sudah diselesaikan               |
    | **16/16 Tugas Selesai — 100%** | Semua checklist sudah diisi, laporan siap dikirim  |

    Progress bar terbarui secara **otomatis** setiap kali Anda menyimpan satu checklist.

    ***

    ### Daftar Seksi Checklist

    Checklist dikelompokkan dalam **beberapa seksi** yang masing-masing mewakili tahapan pekerjaan. Setiap seksi dapat diketuk untuk membuka dan mengisi checklist di dalamnya.

    <Frame>
      <img src="https://mintlify.s3.us-west-1.amazonaws.com/ait-8f7a7cd9/images/app-taskdetail-checklist-sections.png" alt="Daftar seksi checklist tugas" />
    </Frame>

    Contoh seksi yang umum ditemukan:

    | Seksi                         | Contoh Isi Checklist                               |
    | ----------------------------- | -------------------------------------------------- |
    | **Menuju Lokasi**             | Waktu berangkat, waktu tiba di lokasi, foto lokasi |
    | **Persiapan**                 | Dokumentasi peralatan, pengecekan kondisi awal     |
    | **Eksekusi / Upgrade Sistem** | Langkah-langkah pekerjaan utama                    |
    | **Pengujian Sistem**          | Uji coba hasil pekerjaan                           |
    | **Laporan Akhir**             | Foto hasil akhir, catatan penutup                  |

    <Note>
      Isi dan struktur checklist **berbeda-beda** tergantung kategori dan jenis tugas yang ditugaskan. Checklist dirancang oleh Admin di CMS sesuai standar operasional yang berlaku di organisasi Anda.
    </Note>

    ***

    ### Status Tiap Seksi

    Setelah mengisi dan menyimpan checklist dalam sebuah seksi, seksi tersebut akan menampilkan label status di sebelah kanannya:

    | Label                        | Keterangan                                      |
    | ---------------------------- | ----------------------------------------------- |
    | *(tidak ada label)*          | Seksi belum dibuka atau belum diisi             |
    | **Selesai** (hijau)          | Semua item dalam seksi sudah diisi dan disimpan |
    | **Butuh Perbaikan** (oranye) | Admin menandai seksi ini perlu direvisi         |

    <Warning>
      Checklist **hanya dapat diisi setelah tombol "Mulai Tugas" ditekan**. Jika tombol Mulai Tugas belum aktif, Anda hanya dapat membaca isi checklist sebagai referensi — belum bisa mengisinya.
    </Warning>
  </Tab>

  <Tab title="Lampiran">
    Tab **Lampiran** menampilkan dokumen dan file referensi yang dilampirkan oleh Admin sebagai panduan tambahan untuk mengerjakan tugas.

    <Frame>
      <img src="https://mintlify.s3.us-west-1.amazonaws.com/ait-8f7a7cd9/images/app-taskdetail-attachments.png" alt="Tab lampiran di halaman detail tugas" />
    </Frame>

    ***

    ### Jenis File Lampiran

    | Tipe        | Format    | Keterangan                                       |
    | ----------- | --------- | ------------------------------------------------ |
    | **Dokumen** | PDF       | Instruksi kerja, form permintaan, atau SOP       |
    | **Gambar**  | JPG / PNG | Foto referensi atau contoh hasil yang diharapkan |

    ***

    ### Mengunduh Lampiran

    Ketuk ikon **unduh (⬇)** di sebelah kanan nama file untuk menyimpan lampiran ke perangkat Anda.

    <Tip>
      Unduh semua lampiran **sebelum berangkat ke lokasi** terutama jika lokasi kerja memiliki sinyal terbatas. File yang sudah diunduh dapat dibuka secara offline.
    </Tip>

    <Note>
      Lampiran bersifat **read-only** — Anda tidak dapat mengubah atau menghapus file yang dilampirkan oleh Admin. Lampiran hanya tersedia sebagai referensi.
    </Note>
  </Tab>
</Tabs>

***

## Tombol Mulai Tugas

Di bagian paling bawah halaman Detail Tugas terdapat tombol **"Mulai Tugas"** — ini adalah tombol yang memulai pengerjaan tugas secara resmi dan mengaktifkan kemampuan mengisi checklist.

<Frame>
  <img src="https://mintlify.s3.us-west-1.amazonaws.com/ait-8f7a7cd9/images/app-taskdetail-start-button.png" alt="Tombol mulai tugas di bagian bawah halaman detail" />
</Frame>

### Kondisi Tombol

Tombol Mulai Tugas memiliki dua kondisi tampilan yang berbeda:

<CardGroup cols={2}>
  <Card title="Tombol Aktif" icon="circle-play">
    Tombol berwarna **biru penuh** dan dapat ditekan. Kondisi ini muncul ketika waktu saat ini sudah masuk dalam periode tugas (antara jam mulai dan jam berakhir).
  </Card>

  <Card title="Tombol Tidak Aktif" icon="circle-pause">
    Tombol berwarna **abu-abu** dan tidak dapat ditekan. Kondisi ini muncul ketika waktu saat ini belum masuk dalam periode tugas yang ditentukan.
  </Card>
</CardGroup>

<Warning>
  Tombol **"Mulai Tugas"** hanya aktif dalam rentang waktu antara **jam mulai** dan **jam berakhir** tugas yang sudah ditentukan oleh Admin. Di luar rentang waktu tersebut, tombol tidak dapat ditekan meskipun Anda sudah berada di lokasi.

  Jika Anda perlu memulai tugas di luar periode yang ditentukan, hubungi Admin untuk melakukan penyesuaian jadwal tugas melalui CMS.
</Warning>

***

## Semua Status Tugas yang Mungkin Ditampilkan

Seiring progres pengerjaan, status tugas akan berubah dan tercermin di header halaman Detail Tugas:

| Status                   | Warna     | Ditampilkan Ketika                                     |
| ------------------------ | --------- | ------------------------------------------------------ |
| **Aktif**                | Biru      | Tugas sudah ditugaskan dan siap dimulai                |
| **Sedang Berlangsung**   | Hijau     | Tombol Mulai Tugas sudah ditekan                       |
| **Menunggu Persetujuan** | Kuning    | Laporan sudah dikirim dan menunggu review admin        |
| **Selesai**              | Hijau tua | Tugas selesai — disetujui admin atau tanpa persetujuan |
| **Butuh Perbaikan**      | Oranye    | Admin mengembalikan tugas untuk direvisi               |
| **Ditolak**              | Merah     | Admin menolak laporan tugas                            |

***

## Langkah Selanjutnya

Setelah memahami halaman Detail Tugas, Anda siap untuk mulai mengerjakan tugas secara resmi.

<CardGroup cols={2}>
  <Card title="Memulai Tugas →" icon="play" href="/memulai-tugas">
    Pelajari cara menekan tombol Mulai Tugas dan mulai mengisi checklist pekerjaan.
  </Card>

  <Card title="Mengisi Checklist →" icon="list-check" href="/mengisi-checklist">
    Pelajari cara mengisi setiap jenis komponen checklist yang ada dalam tugas Anda.
  </Card>
</CardGroup>
