• Tidak ada hasil yang ditemukan

Sequence diagram digunakan untuk memberikan gambaran function yang digunakan dalam sistem dan juga class yang digunakan. Terdapat empat belas diagram dalam perancangan aplikasi mobile ini. Berikut penjelasan lebih lanjut untuk masing-masing sequence diagram.

Tampilan awal aplikasi adalah halaman LoginPage, halaman ini dapat diakses dengan membuka aplikasi. Pada halaman LoginPage, user harus menginput email dan password dari akun mereka kemudian dengan menekan

43 tombol login maka akan memanggil function login. Apabila user berhasil login, akan dilanjutkan dengan menjalankan function getUserDetail dari EmployeeAPI.

Dari function ini akan direturn detail dari user dan dilanjutkan berpindah ke halaman homepage. Alur proses ini digambarkan pada Gambar 3.19.

Gambar 3.19 Sequence Diagram Sign In

Saat melakukan login, data yang dikirim akan melalui proses validasi akun.

Ketika melakukan validasi akun, data akan melalui proses authentication dengan function getAuthentication. Jika data ditemukan, controller Auth akan mengenerate unique token yang kemudian dikirim bersama dengan status autentikasi. Alur proses ini digambarkan pada Gambar 3.20.

44 Gambar 3.20 Sequence Diagram Validate Account

Setelah berhasil login, user akan diarahkan pada halaman homepage.

Halaman homepage memuat beberapa informasi dan menyimpan beberapa informasi penting. Informasi yang disimpan adalah data user. Sesaat setelah login, user akan me-request data ke EmployeeAPI dan API akan menjalankan function getUserDetail untuk mengambil data user secara spesifik. Data yang sudah didapatkan akan direturn kembali kepada user untuk disimpan dan sebagian ditampilkan. Alur proses ini digambarkan pada Gambar 3.21.

45 Gambar 3.21 Sequence Diagram Get User

Selain data user, adapun status presensi yang menunjukkan status kehadiran user. Setelah mendapatkan data user, aplikasi akan langsung melanjutkan mengambil status presensi dengan melempar request getAttendanceStatus kepada AttendanceAPI, AttendanceAPI akan melanjutkan request dengan menjalankan function getAttendanceData. Setelah melakukan pengecekkan ketersediaan data presensi hari tersebut, maka status akan dikirimkan kembali ke halaman homepage guna menampilkan button presensi. Apabila button menampilkan warna merah, user dapat melakukan presensi. Ketika menekan presensi, halaman homepage akan menjalankan function doAttendance yang diteruskan ke AttendanceAPI untuk melakukan insert data presensi dengan function

46 insertAttendanceData. Setelah insert selesai, status penginputan akan dikirimkan dan mengupdate status presensi serta mengubah warna tombol menjadi hijau. Alur proses ini digambarkan pada Gambar 3.22.

Gambar 3.22 Sequence Diagram Get Attendance

Setelah status presensi didapatkan, aplikasi juga akan mengambil data task secara keseluruhan untuk ditampilkan di halaman homepage. Aplikasi akan me-request data dengan function getAllTask kepada TaskAPI, kemudian TaskAPI

47 yang menerima request akan mengambil data task yang berhubungan dengan user tersebut. Alur proses ini digambarkan pada Gambar 3.23.

Gambar 3.23 Sequence Diagram Get Task

Ketika list task sudah muncul, user dapat memilih salah satu task yang ditampilkan. Sesudah task dipilih, aplikasi akan mengirim request melalui function getTaskDetail, setelah terhubung dengan TaskAPI, TaskAPI akan menjalankan function getTaskDetail terhadap model Task untuk mendapatkan detail plan. Data yang sudah didapatkan akan ditampilkan di halaman detail. Pada halaman detail terdapat button aksi yang dapat dipilih untuk mengirimkan request checking. Ketika button ini dipilih, request checking dikirim ke sequence Mark for checking untuk kemudian akan berubah status task tersebut. Setelah task berubah,

48 user tinggal menunggu status selanjutnya dari user Supervisor. Alur proses ini digambarkan pada Gambar 3.24.

Gambar 3.24 Sequence Diagram Get Task Detail

Untuk memanage data dari user, terdapat halaman profile yang dapat diakses via navigation bar. Saat pertama memasuki halaman profile, user akan mengirimkan request ke EmployeeAPI dengan function getProfile, kemudian dari EmployeeAPI akan melanjutkan request dan mengakses data user dengan function getUserDetail. Data yang sudah didapatkan dikembalikan ke halaman profile untuk ditampilkan. Pada halaman profile pun terdapat tombol edit profile yang

49 mengarahkan user menuju form edit profile. Alur proses ini digambarkan pada Gambar 3.25.

Gambar 3.25 Sequence Diagram Manage Profile

Setelah memasuki halaman edit profile, akan muncul beberapa field yang dapat diisi untuk mengubah data dari user. Ketika sudah mengisi field yang disediakan, user dapat menekan tombol ubah data untuk mengirim data dan request ke EmployeeAPI yang kemudian akan mengubah data dengan function updateProfile. Data user yang sudah diupdate akan dikirim ke halaman profile dan tampilan diupdate. Alur proses ini digambarkan pada Gambar 3.26.

50 Gambar 3.26 Sequence Diagram Edit Profile

Pada halaman profile terdapat button leaderboard yang berguna menampilkan posisi user berdasarkan poin yang dikumpulkan. Request akan dikirim seketika masuk ke halaman leaderboard, aplikasi akan me-request list leaderboard melalui function getLeaderboard. Terhubung dengan leaderboardAPI, API akan mengambil data users kemudian diurutkan berdasarkan urutan poin terbesar kemudian mengirimkannya kembali kepada user untuk ditampilkan. Alur proses ini digambarkan pada Gambar 3.27.

51 Gambar 3.27 Sequence Diagram Get Leaderboard

Adapula button Achievemenet saya yang terhubung dengan halaman achievement. Ketika masuk ke halaman achievement request akan dikirim kepada API melalui function getAllAchievement. Pada AchievementAPI, data achievement user yang bersangkutan akan dikumpulkan kemudian data akan dikembalikan dalam bentuk list. Data tersebut akan digenerate dalam bentuk badges dan deskripsi pencapaian. Alur proses ini digambarkan pada Gambar 3.28.

52 Gambar 3.28 Sequence Diagram Get Achievement

Pada user Supervisor, user dapat melakukan pengecekkan semua task oleh user Staff. Halaman Task akan mengirim request getAllTask yang me-request kepada TaskAPI untuk mengambil semua task tanpa melihat user tertentu. Semua task akan direturn kemudian ditampilkan pada halaman Task. User Supervisor pun memiliki piihan untuk menekan tombol selesai maka akan dialihkan pada sequence Mark For Checking dan jika menekan tombol revisi maka akan dialihkan ke sequence Mark As Revision. Alur proses ini digambarkan pada Gambar 3.29.

53 Gambar 3.29 Sequence Diagram Check Task

Ketika user supervisor mengisi inputan revisi dan juga menekan tombol revisi, maka data akan dikirim ke TaskAPI yang kemudian akan mengubah status dari task yang bersangkutan. Selain itu, terdapat tambahan revisi terhadap task tersebut yang akan ditampilkan kepada user Staff. Alur proses ini digambarkan pada Gambar 3.30.

54 Gambar 3.30 Sequence Diagram Mark As Revision

Ketika user supervisor menekan tombol selesai, maka data status complete akan dikirim ke TaskAPI. TaskAPI akan menjalankan function sendReward untuk menambahkan poin kepada user Staff yang bersangkutan. Setelah poin user Staff berubah, barulah TaskAPI menjalankan function updateTaskStatus kepada task yang bersangkutan dan merubah status menjadi complete. Alur proses ini digambarkan pada Gambar 3.31.

Gambar 3.31 Sequence Diagram Mark As Complete

55 Pada saat user Supervisor menekan tombol selesai, maka halaman Task akan mengirim status complete dan mengupdate status task tersebut. Karena status sudah selesai, maka TaskAPI akan mengirim poin kepada user bersangkutan dan mengupdate profile user tersebut. Setelah itu TaskAPI akan mengirim notifikasi dengan function addNotification kepada user. Alur proses ini digambarkan pada Gambar 3.32.

Gambar 3.32 Sequence Diagram Give Poin

Pada halaman task, user Supervisor dapat membuat task dengan masuk ke halaman AddTaskPage, kemudian mengisi data yang dibutuhkan. Setelah tombol submit dipilih, AddTaskPage akan mengirim request ke TaskAPI untuk menyimpan task dengan function saveTask. Setelah data tersimpan, TaskAPI akan

56 mengirimkan request ke UserNotification untuk membuat notifikasi kepada user Staff yang diassign. Alur proses ini digambarkan pada Gambar 3.33.

Gambar 3.33 Sequence Diagram Create Task

Staff yang berhasil mengerjakan task dapat melakukan update status task kepada supervisor agar dilakukan pengecekan. Dengan menekan tombol check, maka status request check akan dikirim dari TaskAPI untuk mengupdate task yang bersangkutan. Alur proses ini dapat dilihat pada Gambar 3.34.

57 Gambar 3.34 Sequence Diagram Mark For Checking

Dokumen terkait