pembuatan aplikasi covid-19 untuk keselamatan, kesehatan

83
1 KERJA PRAKTIK KI141330 Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan Kerja dan Lingkungan PT PLN Unit Induk Distribusi Jawa Timur PT BADAN EMAS INDONESIA Jl. Mojo 3A no 8A, Surabaya Periode: 1 Juli 2020 - 15 November 2020 Oleh: Ananta Dwi Prasetya Purna Yuda 05111740000029 Anggar Wahyu Nur Wibowo 05111740000052 Pembimbing Jurusan Ary Mazharuddin Shiddiqi, S.Kom., M.Comp.Sc., Ph.D Pembimbing Lapangan Bravel Henri A Sigalingging DEPARTEMEN TEKNIK INFORMATIKA Fakultas Teknologi Elektro dan Informatika Cerdas Institut Teknologi Sepuluh Nopember Surabaya 2020

Upload: others

Post on 16-Oct-2021

4 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

1

KERJA PRAKTIK – KI141330

Pembuatan Aplikasi Covid-19 untuk Keselamatan,

Kesehatan Kerja dan Lingkungan PT PLN Unit

Induk Distribusi Jawa Timur

PT BADAN EMAS INDONESIA

Jl. Mojo 3A no 8A, Surabaya

Periode: 1 Juli 2020 - 15 November 2020

Oleh:

Ananta Dwi Prasetya Purna Yuda 05111740000029

Anggar Wahyu Nur Wibowo 05111740000052

Pembimbing Jurusan

Ary Mazharuddin Shiddiqi, S.Kom., M.Comp.Sc., Ph.D

Pembimbing Lapangan

Bravel Henri A Sigalingging

DEPARTEMEN TEKNIK INFORMATIKA

Fakultas Teknologi Elektro dan Informatika Cerdas

Institut Teknologi Sepuluh Nopember

Surabaya 2020

Page 2: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

2

KERJA PRAKTIK – KI141330

Pembuatan Aplikasi Covid-19 untuk Keselamatan,

Kesehatan Kerja dan Lingkungan PT PLN Unit

Induk Distribusi Jawa Timur

PT BADAN EMAS INDONESIA

Jl. Mojo 3A no 8A, Surabaya

Periode: 1 Juli 2020 - 15 November 2020

Oleh:

Ananta Dwi Prasetya Purna Yuda 05111740000029

Anggar Wahyu Nur Wibowo 05111740000052

Pembimbing Jurusan

Ary Mazharuddin Shiddiqi, S.Kom., M.Comp.Sc., Ph.D

Pembimbing Lapangan

Bravel Henri A Sigalingging

DEPARTEMEN TEKNIK INFORMATIKA

Fakultas Teknologi Elektro dan Informatika Cerdas

Institut Teknologi Sepuluh Nopember

Surabaya 2020

Page 3: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

3

[Halaman ini sengaja dikosongkan]

Page 4: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

4

LEMBAR PENGESAHAN KERJA PRAKTIK

Pembuatan Aplikasi Covid-19 untuk Keselamatan,

Kesehatan Kerja dan Lingkungan PT PLN Unit Induk

Distribusi Jawa Timur

Oleh:

Ananta Dwi Prasetya Purna Yuda 05111740000029

Anggar Wahyu Nur Wibowo 05111740000052

Mengetahui, Menyetujui,

PT Badan Emas Indonesia Dosen Pembimbing

Pembimbing Kerja Praktik Kerja Praktik

Bravel Henri A Sigalingging Ary Mazharuddin Shiddiqi

NIP. 198106202005011003

SURABAYA

28 Desember 2020

Page 5: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

5

[Halaman ini sengaja dikosongkan]

Page 6: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

6

Pembuatan Aplikasi Covid-19 untuk Keselamatan,

Kesehatan Kerja dan Lingkungan PT PLN Unit Induk

Distribusi Jawa Timur

Nama Mahasiswa : Ananta Dwi Prasetya Purna Yuda

(05111740000029)

Anggar Wahyu Nur Wibowo

(05111740000052)

Departemen : Teknik Informatika FTEIC-ITS

Pembimbing Jurusan : Ary Mazharuddin Shiddiqi

Pembimbing Lapangan : Bravel Henri A Sigalingging

ABSTRAK

Covid-19 merupakan pandemi yang tak terduga di tahun

2020 ini. Seluruh sektor terkena dampak mulai dari pendidikan,

ekonomi, maupun sosial. Dalam mengatasi keterpurukan ekonomi,

pemerintah telah menerapkan new normal (kebiasaan baru). Salah

satu hal yang telah diterapkan adalah diperbolehkannya pekerja

kembali bekerja di kantor dengan catatan selalu menaati protokol

kesehatan.

Namun pada kenyataannya, menaati protokol kesehatan

terkadang masih sulit dilakukan. Oleh karena itu untuk membantu

terlaksananya kebiasaan baru tersebut PT PLN UID Jawa Timur

membutuhkan alat untuk mengontrol setiap pegawainya dengan cara memantau lokasi yang dikunjungi, mencatat hasil-hasil tes,

serta mendeteksi kontak fisik. Diharapkan aplikasi keluaran dari

kerja praktik ini dapat mengatasi kebutuhan tersebut.

Kata kunci: monitoring, covid, mobile

Page 7: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

7

[Halaman ini sengaja dikosongkan]

Page 8: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

8

KATA PENGANTAR

Puji syukur kami panjatkan kepada Allah SWT karena berkat

rahmat-Nya kami dapat melaksanakan salah satu kewajiban kami

sebagai mahasiswa Departemen Informatika, yaitu Kerja Praktek

(KP).

Kami menyadari masih ada kekurangan baik dalam

pelaksanaan kerja praktik maupun penyusunan buku laporan ini.

Namun, kami berharap buku laporan ini dapat menambah wawasan

pembaca dan dapat menjadi sumber referensi. Kami mengharapkan

kritik dan saran yang membangun untuk kesempurnaan buku

laporan kerja praktik ini.

Melalui buku ini, kami juga ingin menyampaikan rasa terima

kasih kepada orang-orang yang telah membantu, baik langsung

maupun tidak langsung, dalam pelaksanaan kerja praktik hingga

penyusunan laporan. Orang-orang tersebut antara lain adalah:

1. Kedua orang tua penulis.

2. Bapak Ary Mazharuddin Shiddiqi S.Kom., M.Comp.,

Ph.D selaku koordinator kerja praktik serta dosen

pembimbing kerja praktik kami.

3. Bapak Bravel Henri A Sigalingging, selaku pembimbing

lapangan kami di PT Badan Emas Indonesia.

4. Bapak Agus Sartono, selaku direktur PT Badan Emas

Indonesia yang mengijinkan kami melakukan kerja

praktik.

Surabaya, Desember 2020

Ananta Dwi Prasetya Purna Yuda dan Anggar Wahyu Nur Wibowo

Page 9: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

9

[Halaman ini sengaja dikosongkan]

Page 10: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

10

DAFTAR ISI

LEMBAR PENGESAHAN ....................................................................... 4

ABSTRAK ........................................................................................... 6

KATA PENGANTAR ............................................................................. 8

DAFTAR ISI ........................................................................................10

BAB I PENDAHULUAN .......................................................................14

1.1. LATAR BELAKANG......................................................................... 14 1.2. TUJUAN ..................................................................................... 14 1.3. MANFAAT .................................................................................. 14 1.4. RUMUSAN MASALAH.................................................................... 15 1.5. LOKASI DAN WAKTU KERJA PRAKTIK ................................................ 15 1.6. METODOLOGI KERJA PRAKTIK ........................................................ 16 1.7. SISTEMATIKA LAPORAN ................................................................. 17

BAB II PROFIL PERUSAHAAN .............................................................20

2.1. PROFIL PT BADAN EMAS INDONESIA ............................................... 20 2.2. PROFIL PT PLN UNIT INDUK DISTRIBUSI JAWA TIMUR ........................ 20

BAB III TINJAUAN PUSTAKA ..............................................................24

3.1. JAVASCRIPT ................................................................................ 24 3.2. REACT NATIVE ............................................................................. 24 3.3. GIT............................................................................................ 24 3.4. AXIOS ........................................................................................ 25 3.5. BLUETOOTH LOW ENERGY ............................................................. 25 3.6. GLOBAL POSITIONING SYSTEM ....................................................... 25 3.7. REDUX ....................................................................................... 26

BAB IV IMPLEMENTASI SISTEM ..........................................................28

4.1. RAPID TEST ................................................................................. 29 4.1.1. Deskripsi ......................................................................... 29 4.1.2. Tampilan layar ............................................................... 29 4.1.3. Kode sumber................................................................... 29

4.2. PCR TEST ................................................................................... 42

Page 11: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

11

4.2.1. Deskripsi ......................................................................... 42 4.2.2. Tampilan layar ............................................................... 42 4.2.3. Kode sumber................................................................... 42

4.3. TRACKING LOKASI ........................................................................ 54 4.3.1. Deskripsi ......................................................................... 54 4.3.2. Tampilan layar ............................................................... 54 4.3.3. Kode sumber................................................................... 54

4.4. DETEKSI KONTAK ......................................................................... 58 4.4.1. Deskripsi ......................................................................... 58 4.4.2. Tampilan layar ............................................................... 58 4.4.3. Kode sumber................................................................... 59

BAB V PENGUJIAN DAN EVALUASI ....................................................68

5.1. TUJUAN PENGUJIAN ..................................................................... 68 5.2. KRITERIA PENGUJIAN .................................................................... 68 5.3. SKENARIO PENGUJIAN................................................................... 68 5.4. DAFTAR DATA UJI ........................................................................ 69 5.5. HASIL PENGUJIAN ........................................................................ 70 5.6. EVALUASI PENGUJIAN ................................................................... 76

BAB VI KESIMPULAN DAN SARAN ......................................................78

6.1. KESIMPULAN ............................................................................... 78 6.2. SARAN ....................................................................................... 78

DAFTAR PUSTAKA .............................................................................80

BIODATA PENULIS .............................................................................82

Page 12: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

12

DAFTAR TABEL

TABEL 5.1 DATA UJI RAPID .............................................................................. 69 TABEL 5.2 DATA UJI PCR ................................................................................ 69 TABEL 5.3 DATA UJI PELACAKAN LOKASI............................................................. 69 TABEL 5.4 DATA UJI PHYSICAL DISTANCING ......................................................... 70 TABEL 5.5 HASIL PENGUJIAN RAPID 1 ................................................................ 70 TABEL 5.6 HASIL PENGUJIAN RAPID 2 ................................................................ 71 TABEL 5.7 HASIL PENGUJIAN RAPID TEST 3 ......................................................... 71 TABEL 5.8 HASIL PENGUJIAN PCR 1 ................................................................. 72 TABEL 5.9 HASIL PENGUJIAN PCR 2 ................................................................. 72 TABEL 5.10 HASIL PENGUJIAN PCR 3 ............................................................... 73 TABEL 5.11 HASIL PENGUJIAN PELACAKAN LOKASI 1 ............................................ 73 TABEL 5.12 HASIL PENGUJIAN PELACAKAN LOKASI 2 ............................................ 74 TABEL 5.13 HASIL PENGUJIAN DETEKSI KONTAK .................................................. 75 TABEL 5.14 HASIL EVALUASI PENGUJIAN FITUR ................................................... 76

DAFTAR GAMBAR

GAMBAR 4.1 STRUKTUR KODE ......................................................................... 28 GAMBAR 4.2 TAMPILAN LAYAR FITUR RAPID TEST ............................................... 29 GAMBAR 4.3 TAMPILAN LAYAR FITUR PCR TEST ................................................. 42 GAMBAR 4.4 TAMPILAN LAYAR FITUR DETEKSI KONTAK........................................ 58

DAFTAR KODE

KODE 4.1 KODE SUMBER RAPIDSCREEN.TSX ....................................................... 31 KODE 4.2 KODE SUMBER RAPIDDETAILSCREEN.TSX ............................................. 34 KODE 4.3 KODE SUMBER RAPIDINPUTSCREEN.TSX .............................................. 41 KODE 4.4 KODE SUMBER PCRSCREEN.TSX .......................................................... 44 KODE 4.5 KODE SUMBER PCRINPUTSCREEN.TSX ................................................. 49 KODE 4.6 KODE SUMBER PCRDETAILSCREEN.TSX ................................................ 53 KODE 4.7 KODE SUMBER INDEX.JS .................................................................... 55 KODE 4.8 KODE SUMBER TRACKLOCATION.JS ..................................................... 57 KODE 4.9 KODE SUMBER INDEX.JS .................................................................... 60

Page 13: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

13

KODE 4.10 KODE SUMBER BLEADVERT.TS .......................................................... 62 KODE 4.11 KODE SUMBER BLESCAN.TS ............................................................. 65 KODE 4.12 KODE SUMBER NOTIFICATION.TS ...................................................... 66

Page 14: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

14

BAB I

PENDAHULUAN

1.1. Latar Belakang

Pandemi merupakan hal yang mengejutkan yang terjadi di

tahun 2020 ini. Agar dapat bertahan dalam pandemi ini diperlukan

kehati-hatian dalam melakukan aktivitas sehari-hari. Dalam hal ini

PT PLN Unit Induk Distribusi Jawa Timur tidak lepas untuk

melakukan adaptasi tentang tata cara kerja ke kebiasaan baru.

Adaptasi ke kebiasaan baru (new normal) ini dilakukan

dengan menaati rambu-rambu pada protokol kesehatan yang ada.

Partisipasi oleh pegawainya penting untuk dilakukan agar

pembiasaan baru ini berjalan sesuai. Agar dapat membantu

pelaksanaannya, dibuatlah sistem pengawasan ke pegawai dengan

bantuan gawai telpon pintar yang dimiliki masing-masing pegawai.

1.2. Tujuan

Tujuan utama dari kerja praktik ini adalah untuk

menyelesaikan kewajiban kuliah kerja praktik di Institut Teknologi

Sepuluh Nopember dengan total kredit dua SKS. Selain itu juga

untuk membantu mencatat, melacak, dan mengingatkan pegawai

PT PLN dalam menaati protokol kesehatan agar tercegahnya

penularan Covid-19 di lingkungan PT PLN Unit Induk Distribusi

Jawa Timur.

1.3. Manfaat

Berikut manfaat yang dapat diperoleh dari kerja praktik ini:

1. Penulis dapat mengembangkan diri dan menambah wawasan

secara langsung.

2. Bagi PT PLN, diharapkan dapat membantu dalam

mengontrol pegawai untuk menaati protokol kesehatan.

Page 15: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

15

3. Bagi PT BEI, diharapkan kerja praktik ini dapat menjadi

salah satu produk yang dihasilkan.

4. Bagi civitas academica, diharapkan kerja praktik ini menjadi

sumbangan pemikiran dalam menangani Covid-19.

1.4. Rumusan Masalah

Berikut adalah rumusan masalah pada kerja praktik ini :

1. Bagaimana cara mengetahui kondisi/status kesehatan

pegawai PT PLN?

2. Bagaimana cara mengetahui seberapa jauh pegawai PT PLN

dalam menerapkan protokol kesehatan seperti physical

distancing?

3. Bagaimana cara mengingatkan pegawai PT PLN akan

pentingnya protokol kesehatan seperti physical distancing?

1.5. Lokasi dan Waktu Kerja Praktik

Kerja praktik ini dilaksanakan pada waktu dan tempat

sebagai berikut:

Lokasi : Rumah penulis masing-masing

Waktu : 1 Juli 2020 - 15 November 2020

Hari Kerja : Senin - Jumat

Jam Kerja : Fleksibel

Page 16: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

16

1.6. Metodologi Kerja Praktik

Tahapan pengerjaan kerja praktik dapat dijabarkan sebagai

berikut:

1. Perumusan Masalah

Untuk mengetahui permasalahan apa yang harus

diselesaikan, diberikan penjelasan mengenai alasan mengapa

fungsi-funsi dibutuhkan untuk mempermudah jalan nya aplikasi

yang sudah ada dari perusahaan sendiri. Dijelaskan juga secara

rinci mengenai bagaimana alur sistem itu akan berjalan. penjelasan

mengenai hal ini dijelaskan oleh pembimbing lapangan kerja

praktik. Dari penjelasannya dihasilkan catatan-catatan penting

mengenai gambaran sistem berbasis mobile secara menyeluruh.

2. Studi Literatur

Setelah ditentukan teknologi, bahasa pemrograman, dan serta

tools tambahan yang akan digunakan, dilakukan studi literatur

mengenai cara mengimplementasi hal-hal tersebut. Pada tahap ini

dilakukan proses pencarian, pembelajaran, pengumpulan dan

pemahaman informasi serta literature yang berkaitan untuk

membantu dalam implementasi teknologi yang akan digunakan.

Informasi bisa didapat dari internet dengan melihat langsung

dokumentasi atau artikel dari teknologi terkait.

3. Analisis dan Perancangan

Pada tahap ini akan dilakukan analisa kelebihan dan

kekurangan dari teknologi yang akan digunakan. Selanjutnya akan

dilakukan perancangan aplikasi yang akan dibuat.

Langkah-langkah yang dikerjakan juga didefinisikan ditahap

ini sebagai berikut:

a. Memahami kerangka kerja React Native dan bahasa

pemrograman JavaScript.

b. Memahami serta menganalisa library pendukung yang akan

digunakan.

Page 17: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

17

c. Merancang aplikasi dari alur proses bisnis, desain antarmuka

pengguna, hingga integrasi dengan library pendukung.

4. Implementasi Sistem

Implementasi sistem didasarkan karena adanya kebutuhan

bagi mobile developer untuk membuat aplikasi pengawasan

terhadap ketaatan pelaksanaan kebiasaan baru. Pada tahap ini kami

membuat aplikasi mobile yang dapat melakukan fungsi pelacakan

lokasi terjadwal dan deteksi adanya kontak fisik antar pegawai.

Selain itu juga terdapat pencatatan riwayat uji klinis dari setiap

pegawai yang digunakan untuk penyesuaian profil pengawasan

terhadapnya.

5. Pengujian dan Evaluasi

Pengujian dilakukan dengan menguji aplikasi mobile

tersebut. Pengujian pertama dilakukan terhadap fungsionalitas

pencatatan riwayat uji klinis dari pegawai. Pengujian selanjutnya

dilakukan terhadap fungsi pelacakan dari aplikasi mobile.

Pengujian berikutnya berupa pengujian antar perangkat untuk

pengujian penjagaan jarak dan kontak fisik antar pegawai. Dari

keseluruhan hasil evaluasi tersebut akan ditentukan kesesuaian

dengan kebutuhan.

6. Kesimpulan dan Saran

Kesimpulan yang kami dapatkan diantaranya adalah

perlunya penyesuaian atau pemahaman terhadap masalah yang

dibutuhkan dalam membuat aplikasi Covid-19 dan dibutuhkan

komunikasi jika ada sesuatu yang kurang jelas dengan

permasalahan yang diberikan agar pada saat pengerjaan tidak

terjadi salah dalam pemahaman masalah, karena akan berpengaruh

terhadap alur aplikasi yang akan dibuat.

1.7. Sistematika Laporan

Page 18: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

18

Laporan kerja praktik ini terdiri dari enam bab dengan

rincian sebagai berikut:

1. Bab I Pendahuluan

Pada bab ini dijelaskan tentang latar belakang permasalahan,

tujuan, waktu pelaksanaan, serta sistematika pengerjaan kerja

praktik dan juga penulisan laporan kerja praktik.

2. Bab II Profil Perusahaan

Pada bab ini, dijelaskan secara rinci tentang profil

perusahaan tempat kami melaksanakan kerja praktik, yakni PT.

PLN Unit Induk Distribusi Jawa Timur dan PT. Badan Emas

Indonesia.

3. Bab III Tinjauan Pustaka

Pada bab ini, dijelaskan mengenai tinjauan pustaka dan

literatur yang digunakan dalam penyelesaian kerja praktik.

4. Bab IV Implementasi Sistem

Pada bab ini, berisi penjelasan tahap-tahap yang dilakukan

untuk proses implementasi aplikasi mobile dengan framework

React Native.

5. Bab V Pengujian dan Evaluasi

Pada bab ini, dijelaskan tentang hasil pengujian dan evaluasi

dari sistem yang telah dikembangkan selama pelaksanaan kerja

praktik.

6. Bab VI Kesimpulan dan Saran

Pada bab ini, dipaparkan kesimpulan yang dapat diambil dan

juga saran selama pengerjaan kerja praktik.

Page 19: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

19

[Halaman ini sengaja dikosongkan]

Page 20: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

20

BAB II

PROFIL PERUSAHAAN

2.1. Profil PT Badan Emas Indonesia

PT Badan Emas Indonesia merupakan perusahaan yang

bergerak dalam bidang jasa pengembangan perangkat lunak.

Produk perangkat lunak yang dihasilkan dapat berupa aplikasi

mobile maupun website. Perusahaan ini berdomisili di Surabaya

dengan lokasi tepatnya di Jl Mojo 3A no 8A. Perusahaan ini masih

tergolong perusahaan rintisan yang baru saja didirikan pada tahun

2019 lalu. Salah satu perintisnya adalah alumni Departemen Teknik

Informatika ITS. Saat buku ini dibuat, salah satu klien yang telah

menggunakan jasa perusahaan ini adalah PT PLN UID Jawa Timur.

2.2. Profil PT PLN Unit Induk Distribusi Jawa Timur

PT. PLN Unit Induk Distribusi Jawa Timur adalah

perusahaan negara yang bergerak dalam proses pendistribusian

energi listrik di area Jawa Timur. Perusahaan ini merupakan salah

satu unit yang bertanggung jawab langsung kepada PT PLN

(Persero) Kantor Pusat dalam hal distribusi.

2.2.1. Unit Pelayanan

Wilayah usaha PT. PLN (Persero) Unit Induk Distribusi

Jawa Timur dibagi menjadi beberapa daerah pelayanan yang

melayani wilayah administrasi provinsi Jawa Timur

1. Area Pelayanan & Jaringan Surabaya Selatan

2. Area Pelayanan & Jaringan Surabaya Utara

3. Area Pelayanan & Jaringan Surabaya Barat

4. Area Pelayanan & Jaringan Malang melayani Kota Malang,

Kota Batu dan Kabupaten Malang.

Page 21: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

21

5. Area Pelayanan & Jaringan Pasuruan melayani Kota

Pasuruan, Kota Probolinggo, Kabupaten Pasuruan dan

Kabupaten Probolinggo.

6. Area Pelayanan & Jaringan Kediri melayani Kota Kediri,

Kota Blitar, Kabupaten Kediri, Kabupaten Tulungagung dan

Kabupaten Blitar.

7. Area Pelayanan & Jaringan Mojokerto melayani Kota

Mojokerto, Kabupaten Jombang, Kabupaten Nganjuk dan

Kabupaten Mojokerto.

8. Area Pelayanan & Jaringan Madiun melayani Kota Madiun,

Kabupaten Magetan, Kabupaten Ngawi dan Kabupaten

Madiun.

9. Area Pelayanan & Jaringan Jember melayani Kabupaten

Jember dan Kabupaten Lumajang.

10. Area Pelayanan & Jaringan Bojonegoro melayani Kabupaten

Bojonegoro, Kabupaten Lamongan dan Kabupaten Tuban.

11. Area Pelayanan & Jaringan Banyuwangi melayani

Kabupaten Banyuwangi.

12. Area Pelayanan & Jaringan Pamekasan melayani Kabupaten

Pamekasan, Kabupaten Sampang, Kabupaten Sumenep dan

Kabupaten Bangkalan.

13. Area Pelayanan & Jaringan Situbondo melayani Kabupaten

Situbondo dan Kabupaten Bondowoso.

14. Area Pelayanan & Jaringan Gresik melayani Kabupaten

Gresik sampai Kecamatan Bawean.

15. Area Pelayanan & Jaringan Sidoarjo melayani Kabupaten

Sidoarjo.

16. Area Pelayanan & Jaringan Ponorogo melayani Kabupaten

Ponorogo, Kabupaten Trenggalek dan Kabupaten Pacitan.

2.2.2. Sejarah Perusahaan

Sejarah berdirinya PT PLN (Persero) berawal di akhir abad

19, bidang pabrik gula dan pabrik ketenagalistrikan di Indonesia

mulai ditingkatkan saat beberapa perusahaan asal Belanda yang

Page 22: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

22

bergerak di bidang pabrik gula dan pabrik teh mendirikan

pembangkit tenaga lisrik untuk keperluan sendiri.

Antara tahun 1942-1945 terjadi peralihan pengelolaan

perusahaan-perusahaan Belanda tersebut oleh Jepang, setelah

Belanda menyerah kepada pasukan tentara Jepang di awal Perang

Dunia II. Proses peralihan kekuasaan kembali terjadi di akhir

Perang Dunia II pada Agustus 1945, saat Jepang menyerah kepada

sekutu. Kesempatan ini dimanfaatkan oleh para pemuda dan buruh

listrik melalui delegasi Buruh/Pegawai Listrik dan Gas yang

bersama-sama dengan Pemimpin KNI Pusat berinisiatif menghadap

Presiden Soekarno untuk menyerahkan perusahaan-perusahaan

tersebut kepada Pemerintah Republik Indonesia. Pada 27 Oktober

1945, Presiden Soekarno membentuk Jawatan Listrik dan Gas di

bawah Departemen Pekerjaan Umum dan Tenaga dengan kapasitas

pembangkit tenaga listrik sebesar 157,5 MW. Pada tanggal 1 Januari 1961, Jawatan Listrik dan Gas diubah

menjadi BPU-PLN (Bada Pemimpin Umum Perusahaan Listrik

Negara) yang bergerak di bidang listrik, gas dan kokas yang

dibubarkan pada tanggal 1 Januari 1965. Pada saat yang sama, 2

(dua) perusahaan negara yaitu Perusahaan Listrik Negara (PLN)

sebagai pengelola tenaga listrik milik negara dan Perusahaan Gas

Negara (PGN) sebagai pengelola gas diresmikan. Pada tahun 1972, sesuai dengan Peraturan Pemerintah No.

17, status Perusahaan Listrik Negara (PLN) ditetapkan sebagai

Perusahaan Umum Listrik Negara dan sebagai Pemegang Kuasa

Usaha Ketenagalistrikan (PKUK) dengan tugas menyediakan

tenaga listrik bagi kepentingan umum. Seiring dengan kebijakan pemerintah yang memberikan

kesempatan kepada sektor swasta untuk bergerak dalam bisnis

penyediaan listrik, maka sejak tahun 1994 status PLN beralih dari

Perusahaan Umum menjadi Perusahaan Perseroan (Persero) dan

juga sebagai PKUK dalam menyediakan listrik bagi kepentingan

umum hingga sekarang.

Page 23: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

23

[Halaman ini sengaja dikosongkan]

Page 24: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

24

BAB III

TINJAUAN PUSTAKA

3.1. JavaScript

JavaScript merupakan bahasa pemrograman tingkat tinggi

yang telah ada sejak 25 tahun yang lalu. Dulu, umumnya JavaScript

hanya digunakan untuk mengembangkan website [1]. Namun

seiring berjalannya waktu JavaScript dapat digunakan untuk

mengembangkan aplikasi website, desktop, maupun mobile. Hal ini

berkat adanya NodeJS yang merupakan mesin untuk menjalankan

JavaScript di berbagai platform [2]. Dengan begitu, hanya dengan

penguasaan satu bahasa pemrograman dapat membantu developer

untuk membangun aplikasi multi-platform.

3.2. React Native

React Native merupakan sebuah framework atau kerangka

kerja berbasis antarmuka pengguna untuk platform Android

maupun iOS. React Native dirilis oleh Facebook pada tahun 2015

dengan memberikan sumber kode terbuka. React Native ditulis

dengan bahasa JavaScript dan menawarkan performa yang sama

seperti aplikasi native (aplikasi yang dibuat dengan bahasa aslinya,

seperti Java untuk Android). Selain itu React Native juga

memberikan 4 kelebihan lainnya, yaitu: deklaratif, berbasis

komponen, fast reload, dan portable [3].

3.3. Git

Git adalah perangkat lunak version control system yang

dapat digunakan oleh pengembang agar dapat mengembangkan

perangkat lunak secara bersama-sama. Fungsi dari git sendiri

adalah pelacakan perubahan kode sumber pengembangan baik

penambahan atau pengurangan. Dalam git juga dapat dilakukan

Page 25: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

25

percabngan (branching) kode sumber untuk meminimalisir konflik

yang ada pada perubahan kode [4].

3.4. Axios

Axios merupakan package atau library JavaScript yang

digunakan sebagai klien HTTP untuk membuat request ke server.

Axios fungsinya hampir sama dengan fetch yang ada di bahasa

JavaScript, namun Axios menawarkan fitur lebih yang tidak

dimiliki fetch. Fitur-fitur tersebut antara lain: dapat meng-intercept

request dan response, dapat mentransformasikan data request dan

response, dapat menghentikan request, mentransformasikan data

berformat JSON secara otomatis, dukungan proteksi terhadap

serangan XSRF [5].

3.5. Bluetooth Low Energy

Bluetooth Low Energy adalah varian dari protokol

komunikasi Bluetooth yang dirancang ntuk pengoperasian dengan

daya sangat rendah. Pengoperasian dilakukan di pita frekuensi 2,4

GHz dengan pemanfaatan 40 kanal transmisi [6]. Protokol ini

diperkenalkan pada perangkat bergerak dengan sistem operasi

Android pada SDK 18 (Android 4.3) yang dapat digunakan untuk

mencari perangkat, melakukan service, hingga transmisi data [7].

3.6. Global Positioning System

Global Positioning System atau GPS merupakan alat yang

menyediakan PNT (Positioning, Navigation, dan Timing) ke

pengguna. Dalam menyediakan layanan tersebut, GPS

menggunakan satelit agar memberikan hasil yang akurat [8]. Saat

ini GPS sudah menjadi hal yang umum dan harus ada di setiap

perangkat bergerak dengan sistem operasi Android maupun iOS.

Page 26: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

26

3.7. Redux

Redux adalah pustaka Javascript yang digunakan untuk

melakukan manajemen global state pada aplikasi. Redux memiliki

prinsip unidirectional data flow di mana proses pengubahan state

hanya melalui satu arah dan melewati beberapa tahapan seperti

state dispatching, reducer dan middleware. Dari tahapan-tahapan

tersebut nantinya bisa diperoleh state terbaru sesuai dengan yang

diinginkan [9].

Page 27: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

27

[Halaman ini sengaja dikosongkan]

Page 28: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

28

BAB IV

IMPLEMENTASI SISTEM

Pada bab ini menjelaskan tahap implementasi yang

dilakukan, terdapat 4 fitur utama yang dikerjakan dengan semua

fitur sudah dapat berjalan sesuai dengan yang diharapkan. Struktur

kode secara keseluruhan dapat dilihat pada gambar berikut.

Gambar 4.1 Struktur kode

Page 29: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

29

4.1. Rapid Test

4.1.1. Deskripsi

Fitur ini digunakan untuk pencatatan hasil tes Rapid. Data

yang harus ditambahkan adalah lokasi tes, hasil tes (igC, igG, dan

igM), serta foto hasil tes.

4.1.2. Tampilan layar

Gambar 4.2 Tampilan layar fitur Rapid Test

4.1.3. Kode sumber

import React, {useEffect} from "react"; import {Alert, FlatList, Text, View} from "react-native"; import {FloatingButton} from "../../components/Button"; import {styles} from "../../res/styles"; import {NavigationProp} from "@react-navigation/native"; import {Item} from "../../components/Item";

Page 30: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

30

import {useDispatch, useSelector} from "react-redux"; import {AppState} from "../../store"; import {fetchRapidList} from "../../store/rapid/action"; import {RapidState} from "../../store/rapid/types";

type Props = { navigation: NavigationProp<any, any>; };

export default function RapidScreen({ navigation }: Props) { const dispatch = useDispatch(); const data: RapidState = useSelector((state: AppState) =>

state.rapid); const user = useSelector((state: AppState) => state.user);

useEffect(() => { if (user.status == "reaktif") { Alert.alert( "Hasil Tes Reaktif", "Silakan segera melakukan dan mengisi test PCR", [{ text: "Isi", onPress: () => navigation.navigate("PcrInput"), }, { text: "Lewati", }],); }

dispatch(fetchRapidList()); }, []);

return ( <View style={{ flex: 1 }}> <FlatList data={data.rapids} style={{marginBottom: 60}} refreshing={false} onRefresh={() => dispatch(fetchRapidList())} renderItem={({ item }) => ( <Item onPress={() => { navigation.navigate("RapidResult", { item }); }} item={item} /> )} keyExtractor={(item) => (item.id ? item.id :

Math.random().toString())} ListEmptyComponent={() => ( <View style={styles.container}> <Text style={{ marginTop: 20, fontSize: 16 }}>

Page 31: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

31

Belum ada data hasil Rapid. </Text> <Text style={{ fontSize: 16 }}> Segera masukkan data Rapid test Anda. </Text> </View> )} /> <View style={styles.bottomBar} /> <FloatingButton onPress={() =>

navigation.navigate("RapidInput")} /> </View> ); }

Kode 4.1 Kode sumber RapidScreen.tsx

Page 32: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

32

import React, {useEffect, useState} from "react"; import {BackHandler, Dimensions, Image, ScrollView, View,} from

"react-native"; import {Table, TableHeader} from "../../components/Table"; import {NavigationProp, RouteProp, useFocusEffect,} from "@react-

navigation/native"; import {RapidState, RecordReactive} from

"../../store/rapid/types"; import {useDispatch, useSelector} from "react-redux"; import {AppState} from "../../store"; import {fetchRapid} from "../../store/rapid/action"; import {styles} from "../../res/styles"; import ModalLoading from "../../components/ModalLoading";

type Props = { navigation: NavigationProp<any, any>; route: RouteProp<any, any>; };

const screen = Dimensions.get("screen");

export default function PcrDetailScreen({ route, navigation }:

Props) { const item = route.params.item; const data: RapidState = useSelector((state: AppState) =>

state.rapid); const dispatch = useDispatch(); const [imageDim, setImageDim] = useState({ width: 1, height: 1

}); const [loading, setLoading] = useState(true);

useFocusEffect( React.useCallback(() => { const onBackPress = () => { navigation.navigate("Rapid"); return true; };

BackHandler.addEventListener("hardwareBackPress",

onBackPress); return () => BackHandler.removeEventListener("hardwareBackPress",

onBackPress); }, []) );

useEffect(() => { if (data.rapid.attachment) { Image.getSize( `data:image/jpeg;base64,${data.rapid.attachment}`,

Page 33: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

33

(w, h) => setImageDim({ width: w, height: h }), (e) => console.error(e) ); } }, [data.rapid.attachment]);

useEffect(() => { if (data.rapid.id == item.id) setLoading(false); }, [data, item]);

useEffect(() => { if (data.rapid) dispatch(fetchRapid(item.id)); }, []);

return ( <ScrollView style={{ flex: 1 }}> <TableHeader text="Data" /> <Table table={[ ["Rapid Ke-", data.rapid.index || "[periksa internet

anda]"], ["Tanggal test", data.rapid.date || "[periksa internet

anda]"], ["Lokasi test", data.rapid.location || "[periksa

internet anda]"], ]} /> <TableHeader text="Hasil" /> <Table table={[ ["igC", new RecordReactive(data.rapid.igc_reactive)], ["igG", new RecordReactive(data.rapid.igg_reactive)], ["igM", new RecordReactive(data.rapid.igm_reactive)], ]} /> <TableHeader text="Bukti Foto" style={{ marginBottom: 0 }}

/> <View style={[styles.imageCardContainer, {marginBottom:

16}]}> <Image style={{ resizeMode: "contain", width: screen.width - 20, height: ((screen.width - 20) / imageDim.width) *

imageDim.height, }} source={{ uri: "data:image/jpeg;base64," +

data.rapid.attachment, }} /> </View>

Page 34: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

34

<ModalLoading navigation={navigation} loading={loading}/> </ScrollView> ); }

Kode 4.2 Kode sumber RapidDetailScreen.tsx

Page 35: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

35

import React, {useEffect, useLayoutEffect, useState} from "react"; import {Dimensions, Image, ScrollView, Text, TextInput, View} from

"react-native"; import DateTimePicker from "@react-native-

community/datetimepicker"; import {TableHeader, TableInput, TableRow} from

"../../components/Table"; import {styles} from "../../res/styles"; import ImagePicker from "react-native-image-crop-picker"; import {HeaderButton, TextButton} from "../../components/Button"; import {useDispatch, useSelector} from "react-redux"; import {Rapid, RapidState} from "../../store/rapid/types"; import Snackbar from "react-native-snackbar"; import {colors} from "../../res/colors"; import {NavigationProp} from "@react-navigation/native"; import {AppState} from "../../store"; import {MaterialCommunityIcons} from "@expo/vector-icons"; import {addRapid} from "../../store/rapid/action"; import ModalLoading from "../../components/ModalLoading";

type Props = { navigation: NavigationProp<any, any>; };

const screen = Dimensions.get("screen");

export default function RapidInputScreen({ navigation }: Props) { const [show, setShow] = useState(false); const [image, setImage] = useState(""); const [imageDim, setImageDim] = useState({width: 1,height: 1}); const [loading, setLoading] = useState<boolean>(false);

const data: RapidState = useSelector((state: AppState) =>

state.rapid);

const [item, setItem] = useState<Rapid>({ id: "", date: new Date(), location: "", index: data.rapids.length + 1, igc_reactive: false, igg_reactive: false, igm_reactive: false, attachment: "", }); const dispatch = useDispatch();

const _pickImage = async () => { try { let result = await ImagePicker.openCamera({ cropping: true,

Page 36: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

36

includeBase64: true, compressImageQuality: 0.8, compressImageMaxWidth: 720, forceJpg: true, });

if (result) { //@ts-ignore setImage(result.data ? result.data : ""); } } catch (err) { console.log(err); } };

const snackBarCatcher = (message: string) => { Snackbar.show({ text: message, duration: Snackbar.LENGTH_SHORT, backgroundColor: colors.PRIMARY_BLUE, textColor: colors.SECONDARY_ORANGE, }); };

const onSubmit = async () => { setLoading(true);

if (item.location == "") { setLoading(false); return snackBarCatcher("Isikan data dengan benar"); }

let req = await dispatch(addRapid({ ...item, attachment: image

})); navigation.navigate("Rapid"); setLoading(false); };

useEffect(() => { if(image){ Image.getSize( `data:image/jpeg;base64,${image}`, (w, h) => setImageDim({width: w, height: h}), (e) => console.error(e), ); } }, [image]);

useLayoutEffect(() => { navigation.setOptions({ headerRight: () => (

Page 37: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

37

<HeaderButton onPress={() => onSubmit()} children="Simpan"

/> ), }); }, [navigation, onSubmit]);

return ( <ScrollView style={{ flex: 1 }}> <View> {show && ( <DateTimePicker testID="dateTimePicker" value={item.date} display="default" onChange={(e: any, date) => { setShow(false); setItem({ ...item, date: date ? date : item.date }); }} /> )}

<TableHeader text="Rapid" /> <TableRow key="index" label="Rapid Ke-" value={item.index} style={styles.textInputStyle} > <Text style={{ color: "gray" }}>{item.index}</Text> </TableRow> <TableInput key="date" style={styles.textInputStyle} table={[["Tanggal Test", item.date, () =>

setShow(true)]]} /> <TableRow key="loc" label="Location" value={item.location} style={styles.textInputStyle} > <TextInput style={{ padding: 0 }} multiline placeholder="Rumah Sakit Surabaya" onChangeText={(t: string) => { setItem({ ...item, location: t }); }} /> </TableRow> <TableHeader text="Hasil" />

Page 38: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

38

<TableRow key="igc_reactive" label="igC" value={item.igc_reactive} style={{ flexDirection: "row", padding: 0 }} > <View style={[ styles.selectionContainer, item.igc_reactive ? [styles.selected, { backgroundColor: "pink" }] : null, ]} onTouchEnd={() => setItem({ ...item, igc_reactive:

true })} > <MaterialCommunityIcons name={item.igc_reactive ? "radiobox-marked" :

"radiobox-blank"} size={20} style={{ margin: 4 }} /> <Text>Reaktif</Text> </View> <View style={[ styles.selectionContainer, item.igc_reactive ? null : [styles.selected, { backgroundColor:

"lightgreen" }], ]} onTouchEnd={() => setItem({ ...item, igc_reactive:

false })} > <MaterialCommunityIcons name={!item.igc_reactive ? "radiobox-marked" :

"radiobox-blank"} size={20} style={{ margin: 4 }} /> <Text>Non-reaktif</Text> </View> </TableRow> <TableRow key="igg_reactive" label="igG" value={item.igg_reactive} style={{ flexDirection: "row", padding: 0 }} > <View style={[ styles.selectionContainer,

Page 39: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

39

item.igg_reactive ? [styles.selected, { backgroundColor: "pink" }] : null, ]} onTouchEnd={() => setItem({ ...item, igg_reactive:

true })} > <MaterialCommunityIcons name={item.igg_reactive ? "radiobox-marked" :

"radiobox-blank"} size={20} style={{ margin: 4 }} /> <Text>Reaktif</Text> </View> <View style={[ styles.selectionContainer, item.igg_reactive ? null : [styles.selected, { backgroundColor:

"lightgreen" }], ]} onTouchEnd={() => setItem({ ...item, igg_reactive:

false })} > <MaterialCommunityIcons name={!item.igg_reactive ? "radiobox-marked" :

"radiobox-blank"} size={20} style={{ margin: 4 }} /> <Text>Non-reaktif</Text> </View> </TableRow> <TableRow key="igm_reactive" label="igM" value={item.igm_reactive} style={{ flexDirection: "row", padding: 0 }} > <View style={[ styles.selectionContainer, item.igm_reactive ? [styles.selected, { backgroundColor: "pink" }] : null, ]} onTouchEnd={() => setItem({ ...item, igm_reactive:

true })} > <MaterialCommunityIcons name={item.igm_reactive ? "radiobox-marked" :

Page 40: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

40

"radiobox-blank"} size={20} style={{ margin: 4 }} /> <Text>Reaktif</Text> </View> <View style={[ styles.selectionContainer, item.igm_reactive ? null : [styles.selected, { backgroundColor:

"lightgreen" }], ]} onTouchEnd={() => setItem({ ...item, igm_reactive:

false })} > <MaterialCommunityIcons name={!item.igm_reactive ? "radiobox-marked" :

"radiobox-blank"} size={20} style={{ margin: 4 }} /> <Text>Non-reaktif</Text> </View> </TableRow> <TableRow key="image" label="Foto Hasil Test" style={{ flexDirection: "row", padding: 0 }} > <TextButton onPress={() => _pickImage()}>Upload

Foto</TextButton> </TableRow> {image === "" ? null : ( <TableRow label="Preview"> </TableRow> )} <View style={[styles.imageCardContainer, {marginBottom:

16}]}> <Image style={{ resizeMode: "contain", width: screen.width-20, height: ((screen.width-20)/imageDim.width) *

imageDim.height, }} source={{ uri: "data:image/jpeg;base64," + image, }} /> </View> </View>

Page 41: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

41

<ModalLoading navigation={navigation} loading={loading} title="Mengupload data" message="Harap tunggu. Pastikan anda terkoneksi

internet."/> </ScrollView> ); }

Kode 4.3 Kode sumber RapidInputScreen.tsx

Page 42: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

42

4.2. PCR Test

4.2.1. Deskripsi

Fitur ini digunakan untuk mencatat hasil tes PCR. Data yang

harus ditambahkan adalah lokasi tes, hasil tes (positif atau negatif),

serta foto hasil tes.

4.2.2. Tampilan layar

Gambar 4.3 Tampilan layar fitur PCR Test

4.2.3. Kode sumber

import React, { useEffect } from "react"; import { View, Text, FlatList } from "react-native"; import { FloatingButton } from "../../components/Button"; import { styles } from "../../res/styles"; import { NavigationProp } from "@react-navigation/native"; import { Item } from "../../components/Item";

Page 43: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

43

import { useDispatch, useSelector } from "react-redux"; import { AppState } from "../../store"; import { fetchPcrList } from "../../store/pcr/actions"; import { PcrState } from "../../store/pcr/types";

type Props = { navigation: NavigationProp<any, any>; };

export default function PcrScreen({ navigation }: Props) { const dispatch = useDispatch(); const data: PcrState = useSelector((state: AppState) =>

state.pcr);

useEffect(() => { dispatch(fetchPcrList()); }, []);

return ( <View style={{ flex: 1 }}> <FlatList data={data.pcrs} style={{marginBottom: 60}} refreshing={false} onRefresh={() => dispatch(fetchPcrList())} renderItem={({ item }) => ( <Item onPress={() => { navigation.navigate("PcrResult", { item }); }} item={item} /> )} keyExtractor={(item) => (item.id ? item.id : "")} ListEmptyComponent={() => ( <View style={styles.container}> <Text style={{ marginTop: 20, fontSize: 16 }}> Belum ada data hasil PCR. </Text> <Text style={{ fontSize: 16 }}> Segera masukkan data PCR test Anda. </Text> </View> )} /> <View style={styles.bottomBar} /> <FloatingButton onPress={() =>

navigation.navigate("PcrInput")} /> </View> ); }

Page 44: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

44

Kode 4.4 Kode sumber PcrScreen.tsx

Page 45: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

45

import React, {useEffect, useLayoutEffect, useState} from "react"; import {Dimensions, Image, ScrollView, Text, TextInput, View} from

"react-native"; import DateTimePicker from "@react-native-

community/datetimepicker"; import {TableHeader, TableInput, TableRow} from

"../../components/Table"; import {styles} from "../../res/styles"; import {colors} from "../../res/colors"; import {HeaderButton, TextButton} from "../../components/Button"; import ImagePicker from "react-native-image-crop-picker"; import {useDispatch, useSelector} from "react-redux"; import {MaterialCommunityIcons} from "@expo/vector-icons"; import Snackbar from "react-native-snackbar"; import {NavigationProp} from "@react-navigation/native"; import {PCR, PcrState} from "../../store/pcr/types"; import {addPcr} from "../../store/pcr/actions"; import {AppState} from "../../store";

type Props = { navigation: NavigationProp<any, any>; };

const screen = Dimensions.get("screen");

export default function PcrInputScreen({ navigation }: Props) { const [show, setShow] = useState(false); const [image, setImage] = useState(""); const data: PcrState = useSelector((state: AppState) =>

state.pcr); const [imageDim, setImageDim] = useState({width: 1,height: 1});

const [item, setItem] = useState<PCR>({ id: "", index: data.pcrs.length + 1, date: new Date(), location: "", is_positive: false, attachment: "", }); const dispatch = useDispatch();

const _pickImage = async () => { try { let result = await ImagePicker.openCamera({ cropping: true, includeBase64: true, compressImageQuality: 0.8, compressImageMaxWidth: 720, forceJpg: true, });

Page 46: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

46

if (result) { //@ts-ignore setImage(result.data ? result.data : ""); } } catch (err) { console.log(err); } };

const snackBarCatcher = (message: string) => { Snackbar.show({ text: message, duration: Snackbar.LENGTH_SHORT, backgroundColor: colors.PRIMARY_BLUE, textColor: colors.SECONDARY_ORANGE, }); };

const onSubmit = async () => { if (item.location == "") { return snackBarCatcher("Isikan data dengan benar"); } let req = await dispatch(addPcr({ ...item, attachment: image

})); console.log("req: ", req); navigation.navigate("Pcr"); };

useLayoutEffect(() => { navigation.setOptions({ headerRight: () => ( <HeaderButton onPress={() => onSubmit()} children="Simpan"

/> ), }); }, [navigation, onSubmit]);

useEffect(() => { if(image){ Image.getSize( `data:image/jpeg;base64,${image}`, (w, h) => setImageDim({width: w, height: h}), (e) => console.error(e), ); } }, [image]);

console.log(imageDim);

return (

Page 47: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

47

<ScrollView> {show && ( <DateTimePicker key="tanggal" testID="dateTimePicker" value={item.date} display="default" onChange={(e: any, date) => { setShow(false); setItem({ ...item, date: date ? date : item.date }); }} /> )} <TableHeader text="PCR" /> <TableRow key="index" label="PCR ke-" value={item.index} style={styles.textInputStyle} > <Text style={{ color: "gray" }}>{item.index}</Text> </TableRow> <TableInput key="tanggal2" style={styles.textInputStyle} table={[["Tanggal test", item.date, () => setShow(true)]]} /> <TableRow key="loc" label="Lokasi test" value={item.location} style={styles.textInputStyle} > <TextInput multiline key="lokasi" style={{ padding: 0 }} placeholder="Rumah Sakit Surabaya" onChangeText={(t: string) => { setItem({ ...item, location: t }); }} /> </TableRow> <TableHeader text="Hasil" /> <TableRow key="res" label="Hasil Test" value={item.is_positive} style={{ flexDirection: "row", padding: 0 }} > <View style={[ styles.selectionContainer,

Page 48: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

48

item.is_positive ? [styles.selected, { backgroundColor: "pink" }] : null, ]} onTouchEnd={() => setItem({ ...item, is_positive: true

})} > <MaterialCommunityIcons name={item.is_positive ? "radiobox-marked" :

"radiobox-blank"} size={20} style={{ margin: 4 }} /> <Text>Positif</Text> </View> <View style={[ styles.selectionContainer, item.is_positive ? null : [styles.selected, { backgroundColor: "lightgreen"

}], ]} onTouchEnd={() => setItem({ ...item, is_positive: false

})} > <MaterialCommunityIcons name={!item.is_positive ? "radiobox-marked" :

"radiobox-blank"} size={20} style={{ margin: 4 }} /> <Text>Negatif</Text> </View> </TableRow>

<TableRow key="image" label="Foto Hasil Test" style={{ flexDirection: "row", padding: 0 }} > <TextButton onPress={() => _pickImage()}>Upload

Foto</TextButton> </TableRow> {image === "" ? null : ( <TableRow label="Preview"> </TableRow> )} <View style={[styles.imageCardContainer, {marginBottom:

16}]}> <Image style={{ resizeMode: "contain",

Page 49: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

49

width: screen.width-20, height: ((screen.width-20)/imageDim.width) *

imageDim.height, }} source={{ uri: "data:image/png;base64," + image, }} /> </View> </ScrollView> ); }

Kode 4.5 Kode sumber PcrInputScreen.tsx

Page 50: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

50

import React, {useEffect, useState} from "react"; import {ActivityIndicator, BackHandler, Dimensions, Image, Modal,

ScrollView, Text, View,} from "react-native"; import {Table, TableHeader} from "../../components/Table"; import {NavigationProp, RouteProp, useFocusEffect,} from "@react-

navigation/native"; import {TouchableOpacity} from "react-native-gesture-handler"; import {styles} from "../../res/styles"; import {colors} from "../../res/colors"; import {MaterialCommunityIcons} from "@expo/vector-icons"; import {PcrState} from "../../store/pcr/types"; import {useDispatch, useSelector} from "react-redux"; import {AppState} from "../../store"; import {fetchPcr} from "../../store/pcr/actions"; import {fetchContact} from "../../store/contact/actions"; import Snackbar from "react-native-snackbar";

type Props = { navigation: NavigationProp<any, any>; route: RouteProp<any, any>; };

const screen = Dimensions.get("screen");

export default function PcrDetailScreen({ route, navigation }:

Props) { const item = route.params.item; const data: PcrState = useSelector((state: AppState) =>

state.pcr); const dispatch = useDispatch(); const [imageDim, setImageDim] = useState({ width: 1, height: 1

}); const [loading, setLoading] = useState(true);

useFocusEffect( React.useCallback(() => { const onBackPress = () => { navigation.navigate("Pcr"); return true; }; BackHandler.addEventListener("hardwareBackPress",

onBackPress); return () => BackHandler.removeEventListener("hardwareBackPress",

onBackPress); }, []) );

useEffect(() => { if (data.pcr.attachment) { Image.getSize(

Page 51: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

51

`data:image/jpeg;base64,${data.pcr.attachment}`, (w, h) => setImageDim({ width: w, height: h }), (e) => console.error(e) ); } }, [data.pcr.attachment]);

useEffect(() => { if (data.pcr) dispatch(fetchPcr(item.id)); }, []);

useEffect(() => { if (data.pcr.id == item.id) setLoading(false); }, [data, item]);

const onTrackFilling = async () => { const res = await dispatch(fetchContact(data.pcr.id));

// @ts-ignore if(res.success){ navigation.navigate("Record"); } else { Snackbar.show({ text: "Server masih melakukan komputasi data tracking.

Harap cek lagi nanti.", duration: Snackbar.LENGTH_LONG, backgroundColor: colors.PRIMARY_BLUE, textColor: colors.SECONDARY_ORANGE, }); } };

return ( <ScrollView style={{ flex: 1 }}> <TableHeader text="Data" /> <Table table={[ ["PCR Ke-", data.pcr.index || "[periksa internet

anda]"], ["Tanggal test", data.pcr.date || "[periksa internet

anda]"], ["Lokasi test", data.pcr.location || "[periksa internet

anda]"], ]} /> <TableHeader text="Hasil" /> <Table table={[["Hasil PCR", data.pcr.is_positive]]} /> {data.pcr.is_positive ? ( <TouchableOpacity style={{ backgroundColor: colors.WHITE,

Page 52: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

52

marginHorizontal: 8, marginTop: 8, }} onPress={() => onTrackFilling()} > <View style={{ flexDirection: "row" }}> <View style={[ styles.container, { flex: 1, backgroundColor: colors.SECONDARY_ORANGE, padding: 12, }, ]} > <MaterialCommunityIcons style={{ alignSelf: "center" }} name="alert" size={28} color={colors.PRIMARY_DARK} /> </View> <View style={[styles.container, { flex: 3, alignItems:

"flex-start" }]} > <Text style={{ fontSize: 24, fontWeight: "bold", textAlign: "left", color: colors.PRIMARY_BLUE, marginLeft: 20, }} > Isi Form Tindakan </Text> </View> </View> </TouchableOpacity> ) : null} <TableHeader text="Bukti Foto" /> <View style={[styles.imageCardContainer, {marginBottom:

16}]}> <Image style={{ resizeMode: "contain", width: screen.width - 20, height: ((screen.width - 20) / imageDim.width) *

imageDim.height, }} source={{

Page 53: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

53

uri: "data:image/png;base64," + data.pcr.attachment, }} /> </View> <Modal animationType="fade" transparent={true} visible={loading} onRequestClose={() => { navigation.goBack(); }} > <View style={{ flex: 1 }}> <View style={[ styles.modalForeground, { backgroundColor: "rgba(0,0,0, 0.9)" }, ]} > <ActivityIndicator size="large"

color={colors.SECONDARY_ORANGE} /> <Text style={{ color: colors.WHITE, fontSize: 18 }}> Memuat Data </Text> <Text style={{ color: colors.WHITE }}> Pastikan internet terkoneksi </Text> </View> </View> </Modal> </ScrollView> ); }

Kode 4.6 Kode sumber PcrDetailScreen.tsx

Page 54: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

54

4.3. Tracking Lokasi

4.3.1. Deskripsi

Tracking lokasi merupakan fitur untuk melacak pegawai.

Seluruh pegawai akan dicatat lokasi dan waktunya. Dari lokasi

yang dicatat akan diolah untuk melihat kontak fisik yang pernah

terjadi di hari-hari sebelumnya. Jika salah satu pegawai dinyatakan

positif, pegawai lainnya yang berada disekitar pada beberapa hari

sebelumnya akan muncul notifikasi untuk segera melakukan tes

rapid/PCR.

Selain itu khusus untuk pegawai berkondisi sehat juga

dilacak lokasinya yang digunakan untuk melihat seberapa patuh

pegawai dengan tetap berada di lingkungan kerja. Hal ini ditujukan

untuk mengantisipasi tersebarnya Covid-19 antar wilayah.

4.3.2. Tampilan layar

Tidak ada tampilan layar. Fitur ini dieksekusi di latar

belakang.

4.3.3. Kode sumber

import {registerRootComponent} from "expo"; import App from "./App"; import {AppRegistry} from "react-native"; import messaging from '@react-native-firebase/messaging'; import "expo-asset";

import {store} from "./src/store"; import * as Notifications from "./src/services/notifications"; import * as BleScan from "./src/services/bleScan"; import * as BleAdvert from "./src/services/bleAdvert"; import * as TrackLocation from "./src/services/trackLocation"; import {SURVEIL_PERIOD_TIME} from "./src/services/trackLocation";

Notifications.bootstrap(); BleScan.bootstrap();

let surveilCounter = 0;

Page 55: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

55

// Run in every minute const headlessTask = async () => { const user = store.getState().user; await BleAdvert.stop();

TrackLocation.track().then(); if(user.status === "reaktif" || user.status === "positif") { BleAdvert.advertPositive().then(); } else if (user.status === "sehat") { BleAdvert.advertSocialDistancing().then(); BleScan.scan();

if (surveilCounter % SURVEIL_PERIOD_TIME === 0){ TrackLocation.surveil().then() surveilCounter = 0 } surveilCounter++ } else { Notifications.clear().then(); } };

messaging().setBackgroundMessageHandler(async remoteMessage => { console.log('Message handled in the background!',

remoteMessage); });

// registerRootComponent calls

AppRegistry.registerComponent('main', () => App); // It also ensures that whether you load the app in the Expo

client or in a native build, // the environment is set up appropriately AppRegistry.registerHeadlessTask("Timer", () => headlessTask); registerRootComponent(App);

Kode 4.7 Kode sumber index.js

Page 56: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

56

import {Accuracy, getCurrentPositionAsync} from "expo-location"; import {store} from "../store"; import { addCoordinate, postCoordinate, postSocialDistancingCoord, postSurveilCoord, resetCoordinate } from "../store/coordinate/actions";

export const SURVEIL_PERIOD_TIME = 60 //in minutes

export const track = async () => { const coords = await getCurrentPositionAsync({ accuracy: Accuracy.Highest, });

const coord = { altitude: coords["coords"]["altitude"], latitude: coords["coords"]["latitude"], longitude: coords["coords"]["longitude"], speed: coords["coords"]["speed"], heading: coords["coords"]["heading"], accuracy: coords["coords"]["accuracy"], timestamp: coords["timestamp"], };

store.dispatch( postCoordinate({ latitude: coord.latitude, longitude: coord.longitude, timestamp: coord.timestamp.toString().slice(0, -3), }) );

// Expect only 20 coords persisted if (Math.random() < 0.05) { store.dispatch(resetCoordinate()); } else { store.dispatch(addCoordinate(coord)); } }

export const surveil = async () => { console.log("surveil location") const coords = await getCurrentPositionAsync({ accuracy: Accuracy.Highest, });

const coord = { latitude: coords["coords"]["latitude"],

Page 57: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

57

longitude: coords["coords"]["longitude"], timestamp: coords["timestamp"], };

store.dispatch( postSurveilCoord({ latitude: coord.latitude, longitude: coord.longitude, timestamp: coord.timestamp.toString().slice(0, -3), }) ); }

export const socialDistancing = async () => { console.log("social distancing location") const coords = await getCurrentPositionAsync({ accuracy: Accuracy.Highest, });

const coord = { latitude: coords["coords"]["latitude"], longitude: coords["coords"]["longitude"], timestamp: coords["timestamp"], };

store.dispatch( postSocialDistancingCoord({ latitude: coord.latitude, longitude: coord.longitude, timestamp: coord.timestamp.toString().slice(0, -3), }) ); }

Kode 4.8 Kode sumber trackLocation.js

Page 58: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

58

4.4. Deteksi Kontak

4.4.1. Deskripsi

Fitur ini digunakan untuk mendeteksi adanya kontak antara

pegawai. Fitur ini menggunakan Bluetooth Low Energy untuk

mengetahui seberapa dekat pegawai. Jika salah satu pegawai

berstatus reaktif atau positif, pegawai lain akan mendapatkan

notifikasi kemungkinan kontak serta menyarankannya untuk

melakukan tes Rapid/PCR.

Selain itu fitur ini digunakan untuk mengingatkan pegawai

untuk selalu menerapkan protokol kesehatan physical distancing.

Jika terdapat beberapa pegawai yang saling berdekatan kurang dari

2 meter, tiap pegawai akan mendapatkan notifikasi untuk selalu

menjaga jarak aman.

4.4.2. Tampilan layar

Gambar 4.4 Tampilan layar fitur deteksi kontak

Page 59: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

59

4.4.3. Kode sumber

import {registerRootComponent} from "expo"; import App from "./App"; import {AppRegistry} from "react-native"; import messaging from '@react-native-firebase/messaging'; import "expo-asset";

import {store} from "./src/store"; import * as Notifications from "./src/services/notifications"; import * as BleScan from "./src/services/bleScan"; import * as BleAdvert from "./src/services/bleAdvert"; import * as TrackLocation from "./src/services/trackLocation"; import {SURVEIL_PERIOD_TIME} from "./src/services/trackLocation";

Notifications.bootstrap(); BleScan.bootstrap();

let surveilCounter = 0;

// Run in every minute const headlessTask = async () => { const user = store.getState().user; await BleAdvert.stop();

if(user.status === "reaktif" || user.status === "positif") { TrackLocation.track().then(); BleAdvert.advertPositive().then(); } else if (user.status === "sehat") { BleAdvert.advertSocialDistancing().then(); BleScan.scan();

if (surveilCounter % SURVEIL_PERIOD_TIME === 0){ TrackLocation.surveil().then() surveilCounter = 0 } surveilCounter++ } else { Notifications.clear().then(); } };

messaging().setBackgroundMessageHandler(async remoteMessage => { console.log('Message handled in the background!',

remoteMessage); });

// registerRootComponent calls

Page 60: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

60

AppRegistry.registerComponent('main', () => App); // It also ensures that whether you load the app in the Expo

client or in a native build, // the environment is set up appropriately AppRegistry.registerHeadlessTask("Timer", () => headlessTask); registerRootComponent(App);

Kode 4.9 Kode sumber index.js

Page 61: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

61

import BLEPeripheral from "react-native-ble-peripheral"; import {BLE_SERVICE_POSITIVE_UUID,

BLE_SERVICE_SOCIAL_DISTANCING_UUID} from "../res/api"; import DeviceInfo from 'react-native-device-info';

const advertPositive = async () => { const isAdvertising = await BLEPeripheral.isAdvertising() BLEPeripheral.clearServices() BLEPeripheral.addService(BLE_SERVICE_POSITIVE_UUID, false)

BLEPeripheral.addCharacteristicToService(BLE_SERVICE_POSITIVE_UUID

, '5383be34-17b4-11eb-0001-0242ac120002', 16 | 1, 1) BLEPeripheral.setName(DeviceInfo.getDeviceNameSync())

if (!isAdvertising) { try { await BLEPeripheral.start() return Promise.resolve() } catch (e) { return Promise.reject(e) } } return Promise.reject("already advertising") }

const advertSocialDistancing = async () => { const isAdvertising = await BLEPeripheral.isAdvertising() BLEPeripheral.clearServices() BLEPeripheral.addService(BLE_SERVICE_SOCIAL_DISTANCING_UUID,

false)

BLEPeripheral.addCharacteristicToService(BLE_SERVICE_SOCIAL_DISTAN

CING_UUID, '5383be34-17b4-11eb-0001-0242ac120002', 16 | 1, 1) BLEPeripheral.setName(DeviceInfo.getDeviceNameSync())

if (!isAdvertising) { try { await BLEPeripheral.start() return Promise.resolve() } catch (e) { return Promise.reject(e) } } return Promise.reject("already advertising") }

const stop = async () => { const isAdvertising = await BLEPeripheral.isAdvertising(); if (isAdvertising) {

Page 62: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

62

BLEPeripheral.stop(); } return Promise.resolve(); }

export { advertPositive, advertSocialDistancing, stop };

Kode 4.10 Kode sumber bleAdvert.ts

Page 63: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

63

import {Alert, BackHandler, NativeEventEmitter, NativeModules}

from "react-native";

import BleManager from "react-native-ble-manager";

import {BLE_SERVICE_POSITIVE_UUID,

BLE_SERVICE_SOCIAL_DISTANCING_UUID} from "../res/api";

import * as Notifications from "./notifications";

import {store} from "../store";

import {postExposed} from "../store/contact/actions";

import * as Timer from "../Timer";

import {DateUtils} from "../utils/date";

import * as TrackLocation from "./trackLocation";

const bleManagerModule = NativeModules.BleManager;

const bleManagerEmitter = new

NativeEventEmitter(bleManagerModule);

const rssiToDistance = (rssi = -100, tx) => {

const measuredPower = tx ?? -60;

const power = (measuredPower - rssi)/(10 * 4);

return Math.pow(10, power);

}

let serviceFound: string[] = []

let socialDistancingTimestamp: number = 0

export const SOCIAL_DISTANCE_PERIOD_TIME = 15.0 //in minutes

// Binding event emitter

const handleDiscoverPeripheral = (peripheral) => {

if (!peripheral || !peripheral.advertising ||

!peripheral.advertising.serviceUUIDs ||

peripheral.advertising.serviceUUIDs.length <= 0)

return;

if

(serviceFound.includes(peripheral.advertising.serviceUUIDs[0]))

return;

const serviceUUID = peripheral.advertising.serviceUUIDs[0]

console.log(peripheral.name + JSON.stringify(peripheral))

let tx = peripheral.advertising.txPowerLevel;

if (tx === -2147483648) tx = null;

const rssi = peripheral.rssi;

const distance = rssiToDistance(rssi, tx);

switch (serviceUUID.toLowerCase()){

case BLE_SERVICE_POSITIVE_UUID.toLowerCase():

const user = store.getState().user;

if (distance < 2.0) {

serviceFound.push(serviceUUID)

if (!user.exposed) {

Notifications.showPositiveNotification();

Page 64: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

64

console.log("send notification")

}

console.log("exposed")

// @ts-ignore

store.dispatch(postExposed());

}

break

case BLE_SERVICE_SOCIAL_DISTANCING_UUID.toLowerCase():

if (distance < 2.0) {

serviceFound.push(serviceUUID)

const timestampNow = new Date().getTime()

if (DateUtils.diffInSeconds(socialDistancingTimestamp,

timestampNow) / 60 > SOCIAL_DISTANCE_PERIOD_TIME){

Notifications.showSocialDistancingNotification();

TrackLocation.socialDistancing().then()

socialDistancingTimestamp = timestampNow

}

console.log("social distancing")

}

break

}

}

const bootstrap = () => {

bleManagerEmitter.addListener('BleManagerDiscoverPeripheral',

handleDiscoverPeripheral);

BleManager.start({showAlert: false});

}

const scan = () => {

console.log("scanning");

serviceFound = []

BleManager.enableBluetooth().then(() => {

BleManager.scan([BLE_SERVICE_POSITIVE_UUID,

BLE_SERVICE_SOCIAL_DISTANCING_UUID], 50, false, {scanMode: 1})

.then(() => console.log("Scanning ..."))

.catch();

}).catch(reason => {

Alert.alert("Akses Bluetooth Ditolak!",

"Aplikasi membutuhkan akses bluetooth untuk penilaian resiko

terpapar Covid-19",

[

{

text: 'Tanya lagi',

onPress: () => scan()

},

{

text: 'Keluar',

onPress: () => {

Timer.stopService()

Page 65: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

65

BackHandler.exitApp()

},

style: 'cancel'

},

],

{ cancelable: false }

)

})

}

export { bootstrap, scan };

Kode 4.11 Kode sumber bleScan.ts

Page 66: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

66

import * as Notifications from "expo-notifications";

const bootstrap = () => { Notifications.setNotificationHandler({ handleNotification: async () => ({ shouldShowAlert: true, shouldPlaySound: true, shouldSetBadge: false, }), }); }

const clear = () =>

Notifications.cancelAllScheduledNotificationsAsync();

const dismiss = () =>

Notifications.dismissAllNotificationsAsync();

const showPositiveNotification = () => { const content = { title: 'Kemungkinan kontak Covid-19', body: 'Terindikasi adanya kemungkinan kontak, segera periksa

diri Anda!', autoDismiss: false, sticky: true };

Notifications.scheduleNotificationAsync({content, trigger:

{seconds: 1}}).catch(); }

const showSocialDistancingNotification = () => { const content = { title: 'Ingat Social Distancing!', body: 'Anda terdeteksi terlalu dekat dengan orang lain. Ingat

selalu jaga jarak aman minimal 2 meter!', };

Notifications.scheduleNotificationAsync({content, trigger:

{seconds: 1}}).catch(); }

export {bootstrap, showPositiveNotification,

showSocialDistancingNotification, clear, dismiss};

Kode 4.12 Kode sumber notification.ts

Page 67: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

67

[Halaman ini sengaja dikosongkan]

Page 68: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

68

BAB V

PENGUJIAN DAN EVALUASI

Bab ini menjelaskan tahap uji coba dilakukan terhadap

fungsi aplikasi telah dibuat.

5.1. Tujuan Pengujian

Pengujian dilakukan terhadap aplikasi yang telah dibuat agar

mengetahui kesesuaian kriteria fungsi yang diminta oleh klien.

5.2. Kriteria Pengujian

Penilaian atas pencapaian tujuan pengujian didapatkan

dengan memperhatikan beberapa hasil yang diharapkan berikut ini:

a. Kesesuaian dengan kriteria fungsi aplikasi yang diminta oleh

klien.

5.3. Skenario Pengujian

Skenario pengujian dilakukan sesuai dengan fungsionalitas

aplikasi yang ada. Pengujian baik dilakukan di perangkat tersebut

maupun antar perangkat. Pengujian dikatakan sudah sesuai jika

output yang dihasilkan sesuai dengan hasil yang diinginkan.

Page 69: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

69

5.4. Daftar Data Uji

Nama Field Value

Data Input-R01 Tanggal Test 2 November 2020

Location RS dr. Oen

igC Non-reaktif

igG Non-reaktif

igM Non-reaktif

Foto Hasil Test Berkas gambar

Tabel 5.1 Data uji rapid

Nama Field Value

Data Input-P01

Tanggal Test 2 November 2020

Location RS dr. Oen

Hasil Test Negatif

Foto Hasil Test Berkas gambar

Data Input-P02

Tanggal Test 2 November 2020

Location RS dr. Oen

Hasil Test Positif

Foto Hasil Test Berkas gambar

Tabel 5.2 Data uji PCR

Nama Condition Value

Data Test-T01 Lokasi Lokasi saat ini

Data Test-T02 Lokasi Lokasi dengan

jarak kurang dari

40 km dari kantor

Data Test-T03 Lokasi Lokasi dengan

jarak lebih dari 40

km dari kantor

Tabel 5.3 Data uji pelacakan lokasi

Nama Condition Value

Data Test-D01 Perangkat saling berdekatan Benar

Page 70: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

70

Status pengguna pertama Sehat

Status pengguna kedua Sehat

Data Test-D02

Perangkat saling berdekatan Benar

Status pengguna pertama Sehat

Status pengguna kedua Positif

Tabel 5.4 Data uji physical distancing

5.5. Hasil Pengujian

Terdapat hasil pengujian dari kode yang telah dibuat pada

Bab IV sebelumnya:

5.5.1. Rapid Test

5.5.1.1. Menampilkan daftar rapid test yang telah dilalui

Prasyarat:

User telah login ke sistem

Prosedur

pengujian

Masukan Keluaran

yang

diharapkan

Kriteria

evaluasi

Hasil yang

didapat

Hasil

akhir

Pilih menu

“Rapid

Test”

Kosong Sistem

menampilkan

riwayat rapid test yang

dilalui

Pengguna

dapat

melihat riwayat

rapid

testnya

Sistem

menampilkan

riwayat rapid test yang

dilalui

Diterima

Tabel 5.5 Hasil pengujian rapid 1

5.5.1.2. Memasukkan hasil rapid test yang dimiliki

Prasyarat:

User telah login ke sistem

Berada pada menu daftar hasil rapid test

Page 71: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

71

Prosedur

pengujian

Masukan Keluaran

yang

diharapka

n

Kriteria

evaluasi

Hasil yang

didapat

Hasil akhir

Tekan tombol

tambah di

bawah,

pengguna

mengisi isian yang

diperlukan

Data Input-R01

Sistem dapat

menyimpan

hasil rapid

test yang

dimasukkan

Pengguna memperole

h

konfirmasi

konfirmasi

bahwa data telah

tersimpan

Sistem dapat menyimpan

hasil rapid

test yang

dimasukkan

Diterima

Tabel 5.6 Hasil pengujian rapid 2

5.5.1.3. Melihat detail rapid test yang ada

Prasyarat:

User telah login ke sistem

Berada pada menu daftar hasil rapid test

Sudah memasukkan hasil rapid test ke sistem

Prosedur

pengujian

Masukan Keluaran

yang

diharapkan

Kriteria

evaluasi

Hasil yang

didapat

Hasil akhir

Pilih salah

satu hasil

rapid test

Kosong Sistem

menampilka

n detail test yang dipilih

Pengguna

dapat

melihat detail test

yang

dipilih

Sistem

menampilka

n detail test yang dipilih

Diterima

Tabel 5.7 Hasil pengujian rapid test 3

Page 72: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

72

5.5.2. PCR Test

5.5.2.1. Menampilkan daftar tes PCR yang telah dilalui

Prasyarat:

User telah login ke sistem

Prosedur

pengujian

Masukan Keluaran

yang

diharapkan

Kriteria

evaluasi

Hasil yang

didapat

Hasil akhir

Pilih menu

“PCR Test”

Kosong Sistem

menampilkan

riwayat PCR

test yang

dilalui

Pengguna

dapat

melihat

riwayat

PCR testnya

Sistem

menampilk

an riwayat

PCR test

yang dilalui

Diterima

Tabel 5.8 Hasil pengujian PCR 1

5.5.2.2. Memasukkan hasil PCR yang dimiliki

Prasyarat:

User telah login ke sistem

Berada pada menu daftar hasil PCR

Prosedur

pengujian

Masukan Keluaran

yang

diharapkan

Kriteria

evaluasi

Hasil yang

didapat

Hasil akhir

Pilih salah

satu hasil

PCR test

Kosong Sistem

menampilkan

detail test yang dipilih

Pengguna

dapat

melihat detail test

yang dipilih

Sistem

menampilk

an detail test yang

dipilih

Diterima

Tabel 5.9 Hasil pengujian PCR 2

Page 73: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

73

5.5.2.3. Melihat detail PCR yang ada

Prasyarat:

User telah login ke sistem

Berada pada menu daftar hasil PCR

Sudah memasukkan hasil PCR ke sistem

Prosedur

pengujian

Masukan Keluaran

yang

diharapkan

Kriteria

evaluasi

Hasil yang

didapat

Hasil akhir

Tekan

tombol

tambah di bawah,

pengguna

mengisi

isian yang

diperlukan

Data

Input-P01

Sistem dapat

menyimpan

hasil PCR test yang

dimasukkan

Pengguna

memperole

h konfirmasi

konfirmasi

bahwa data

telah

tersimpan

Sistem

dapat

menyimpan hasil PCR

test yang

dimasukkan

Diterima

Tabel 5.10 Hasil pengujian PCR 3

5.5.3. Pelacakan Lokasi

5.5.3.1. Pencatatan lokasi untuk keperluan tracing

Prasyarat:

User telah login ke sistem

User memperoleh notifikasi pelacakan

Prosedur

pengujian

Masukan Keluaran

yang

diharapkan

Kriteria

evaluasi

Hasil yang

didapat

Hasil akhir

Aplikasi

tidak

dibuka dan

berada di latar

belakang

Data

Test-T01

Sistem dapat

mengirimkan

data lokasi ke

server

Record

pada basis

data

bertambah oleh data

lokasi yang

dikirim

Sistem

dapat

mengirimka

n data lokasi ke

server

Diterima

Tabel 5.11 Hasil pengujian pelacakan lokasi 1

Page 74: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

74

5.5.3.2. Pengawasan jarak dari lingkungan kerja

Prasyarat:

User telah login ke sistem

User memperoleh notifikasi pelacakan

Prosedur

pengujian

Masukan Keluaran

yang

diharapkan

Kriteria

evaluasi

Hasil yang

didapat

Hasil

akhir

Aplikasi

tidak

dibuka dan berada di

latar

belakang

Data Test-

T02

Sistem dapat

mengirimkan

data lokasi ke server

Record lokasi

pada basis

data bertambah

dan pengguna

tidak

memperoleh

notifikasi peringatan

pelanggaran

jarak

Sistem dapat

mengirimkan

data lokasi ke server

Diterim

a

Aplikasi

tidak dibuka dan

berada di

latar

belakang

Data Test-

T03

Sistem dapat

mengirimkan data lokasi

ke server dan

sistem

memberikan

notifikasi peringatan

pelanggaran

jarak

Record lokasi

pada basis data

bertambah

dan pengguna

memperoleh

notifikasi peringatan

pelanggaran

jarak

Sistem dapat

mengirimkan data lokasi

ke server dan

sistem

memberikan

notifikasi peringatan

pelanggaran

jarak

Diterim

a

Tabel 5.12 Hasil pengujian pelacakan lokasi 2

Page 75: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

75

5.5.4. Deteksi Kontak

Prasyarat:

User telah login ke sistem

User memperoleh notifikasi pelacakan

Prosedur

pengujian

Masuka

n

Keluaran

yang

diharapkan

Kriteria

evaluasi

Hasil yang

didapat

Hasil akhir

Aplikasi

tidak

dibuka dan

berada di

latar belakang

Data

Test-D01

Sistem

memberikan

notifikasi

peringatan

pelanggaran kontak fisik

Pengguna

memperole

h notifikasi

pelanggara

n kontak fisik

Sistem

memberika

n notifikasi

peringatan

pelanggaran kontak

fisik

Diterima

Aplikasi

tidak

dibuka dan berada di

latar

belakang

Data

Test-D02

Sistem

memberikan

notifikasi peringatan

kemungkinan

pengguna

terpapar

Pengguna

memperole

h notifikasi kemungkin

an terpapar

Sistem

memberika

n notifikasi peringatan

kemungkin

an

pengguna

terpapar

Diterima

Tabel 5.13 Hasil pengujian deteksi kontak

Page 76: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

76

5.6. Evaluasi Pengujian

Hasil evaluasi pengujian aplikasi dapat dilihat pada tabel

5.14.

No. Kriteria Pengujian Hasil

Pengujian

1 Rapid test Terpenuhi

2 PCR test Terpenuhi

3 Pelacakan lokasi Terpenuhi

4 Deteksi kontak Terpenuhi

Tabel 5.14 Hasil evaluasi pengujian fitur

Dengan hasil pengujian pada tabel di atas, dapat disimpulkan

bahwa secara keseluruhan fitur-fitur yang diimplementasi telah

memenuhi kriteria-kriteria yang sudah disebutkan pada bagian-

bagian sebelumnya.

Page 77: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

77

[Halaman ini sengaja dikosongkan]

Page 78: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

78

BAB VI

KESIMPULAN DAN SARAN

6.1. Kesimpulan

Kesimpulan yang didapat setelah melakukan pembuatan

aplikasi pengawasan kebiasaan baru pada kegiatan kerja praktik di

PT Badan Emas Indonesia untuk PT PLN Unit Induk Distribusi

Jawa Timur adalah sebagai berikut:

● Dengan adanya aplikasi ini, para pegawai bisa

menginformasikan keadaannya terkait pandemi ke

perusahaan.

● Pegawai juga dapat mengetahui potensi resiko paparan

dirinya terhadap Covid-19 berdasarkan kontak antar pegawai

lainnya.

● Divisi K3L dari perusahaan ini bisa menjadi lebih mudah untuk melakukan pengawasan ke setiap pegawai PT PLN

UID Jawa Timur.

6.2. Saran

Saran untuk pengembangan sistem aplikasi pengawasan

pembiasaan baru terhadap Covid-19 adalah sebagai berikut:

● Dilakukan jajak pendapat kepada seluruh pegawai mengenai

aplikasi yang digunakan.

Page 79: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

79

[Halaman ini sengaja dikosongkan]

Page 80: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

80

DAFTAR PUSTAKA

[1] MDN, “What is JavaScript?,” [Online]. Available:

https://developer.mozilla.org/en-

US/docs/Learn/JavaScript/First_steps/What_is_JavaScript.

[Diakses 26 Desember 2020].

[2] W3Schools, “Node.js Introduction,” [Online]. Available:

https://www.w3schools.com/nodejs/nodejs_intro.asp. [Diakses 26

Desember 2020].

[3] Facebook, “React Native · A framework for building native apps

using React,” [Online]. Available: https://reactnative.dev/.

[Diakses 26 Desember 2020].

[4] Git, “About,” [Online]. Available: https://git-scm.com/about.

[Diakses 26 Desember 2020].

[5] axios, “axios/axios: Promise based HTTP client for the browser

and node.js,” [Online]. Available: https://github.com/axios/axios.

[Diakses 26 Desember 2020].

[6] Bluetooth SIG, “Bluetooth Radio Versions | Bluetooth®

Technology Website,” [Online]. Available:

https://www.bluetooth.com/learn-about-bluetooth/radio-versions/.

[Diakses 26 Desember 2020].

[7] Android, “Bluetooth low energy overview | Android Developers,”

[Online]. Available:

https://developer.android.com/guide/topics/connectivity/bluetooth-

le. [Diakses 26 Desember 2020].

[8] GPS.gov, “GPS.gov: GPS Overview,” [Online]. Available:

https://www.gps.gov/systems/gps/. [Diakses 26 Desember 2020].

[9] Redux, “Redux Essentials, Part 1: Redux Overview and Concepts |

Redux,” [Online]. Available:

https://redux.js.org/tutorials/essentials/part-1-overview-concepts.

[Diakses 26 Desember 2020].

Page 81: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

81

[Halaman ini sengaja dikosongkan]

Page 82: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

82

BIODATA PENULIS

Ananta Dwi Prasetya Purna Yuda, lahir pada tanggal 13

Desember 1998 di Surabaya. Saat buku ini dibuat penulis berstatus

sebagai mahasiswa semester 7 di S1 Departemen Teknik

Informatika, Institut Teknologi Sepuluh Nopember. Penulis dapat

dihubungi melalui email [email protected].

Anggar Wahyu Nur Wibowo, lahir pada tanggal 06 Juni

1999 di Sragen. Saat buku ini dibuat penulis berstatus sebagai

mahasiswa semester 7 di S1 Departemen Teknik Informatika,

Institut Teknologi Sepuluh Nopember. Penulis dapat dihubungi

melalui surel [email protected].

Page 83: Pembuatan Aplikasi Covid-19 untuk Keselamatan, Kesehatan

83

[Halaman ini sengaja dikosongkan]