Implementasi User Interface IMPLEMENTASI SISTEM

4.8. Implementasi User Interface

Gambar 4.13 berikut ini merupakan tampilan halaman home dari sistem monitoring pelanggan ini. Pada bagian atas Halaman home terdapat menubar yang terdiri dari menu HOME, menu OPERATOR untuk login operator, menu ADMIN untuk login administrator, dan menu DASHBOARD untuk melihat info monitoring per-unitup. Gambar 4. 13Interface halaman Home Sistem

4.8.1. Login Operator dan Administrator

Gambar 4.14 dan 4.15 berikut merupakan tampilan dari halaman login untuk user dengan tipe operator gambar 4.14 dan administrator gambar 4.15. User dapat mengisi username dan password kemudian memilih kode unit. PLAGIAT MERUPAKAN TINDAKAN TIDAK TERPUJI Gambar 4. 14 Interface menu login operator Gambar 4. 15Interface menu login admin

4.8.2. Halaman Utama Administrator Tingkat Area

Gambar 4.16 merupakan halaman utama untuk admin area jika berhasil login ke sistem. Dalam halaman ini terdapat menu tambah user, lihat data, monitoring, approve, cetak laporan, lihat detail pelanggan, dan logout. PLAGIAT MERUPAKAN TINDAKAN TIDAK TERPUJI Gambar 4. 16 Interface halaman Utama Admin Area Menu Lihat Data gambar 4.17 digunakan untuk melihat data pelanggan monitoring, menu ini terdiri dari 3 submenu yaitu Pelanggan kWh 0, Pelanggan kWh Maks, dan Tidak Beli Token 3 bulan. Gambar 4. 17 Menu Lihat Data Menu Monitoring gambar 4.18 digunakan untuk pengoleloaan data monitoring pelanggan. Menu ini terdiri dari 3 submenu yaitu kWh 0, kWh Maks, dan PPTBT 3bln. 3 submenu ini dipecah menjadi masing-masing yaitu Sudah Cek, Belum cek, Cek per-bulan. Gambar 4. 18 Menu Monitoring Gambar 4. 19 Menu Approve Menu Approve pada gambar 4.19 diatas digunakan untuk pengoleloaan approvedata monitoring pelanggan. Menu ini terdiri dari 3 submenu yaitu kWh 0, kWh Maks, dan PPTBT 3bln. 3 tiga submenu ini dipecah menjadi masing- masing yaitu Sudah Cek, Belum Cek, Cek per-bulan. Gambar 4. 20Menu Cetak Laporan Menu cetak laporan terdiri atas gambar 4.20 digunakan untuk kelola laporang monitoring pelanggan kwh 0, kwh maks, TBT, dan laporan rekomendasi untuk monitoring naik daya. Gambar 4.21 dibawah ini menunjukan panel untuk logout dari sistem. Gambar 4. 21 Panel Logout

4.8.3. Halaman Utama Administrator Tingkat Rayon

Gambar 4.22 merupakan halaman utama untuk admin rayon jika berhasil login ke sistem. Dalam halaman ini terdapat menu lihat data, monitoring, approve, lihat detail pelanggan, dan logout. Untuk submenu dari menubar pada umumnya sama dengan user admin area. Gambar 4. 22 Halaman utama admin tingkat rayon

4.8.4. Halaman Utama Operator Tingkat Area dan Rayon

Gambar 4.23 merupakan halaman utama untuk operator area dan rayon jika berhasil login ke sistem. Dalam halaman ini terdapat menu monitoring, lihat detail pelanggan, dan logout. Untuk menubar monitoring pada umumnya sama dengan user admin area. Yang berbeda dari dua tipe user ini adalah data yang bisa diakses oleh keduanya. Operator area dapat mengakses semua data diseluruh rayon, sedangkan untuk operator rayon hanya dapat mengakses datanya di rayon tempat diriny terdaftar sebagai user. Gambar 4. 23Halaman utama operator tingkat rayon dan area

4.8.5. Halaman Tambah User

Gambar 4.24 berikut ini adalah tampilan dari halaman tambah user yang digunakan untuk menambahkan user login ke sistem monitoring ini. Pada halaman ini ditampilkan daftar data user login dan terdapat tombol tambah user gambar 4.24 untuk tambah user dan edit user gambar 4.25 dan 4.27 untuk mengubah data login atau mutasi user. Namun untuk mengubah data user terlebih dahulu harus masuk ke halaman cari data user dengan memasukan data password dan username user gambar 4.26. PLAGIAT MERUPAKAN TINDAKAN TIDAK TERPUJI Gambar 4. 24 Halaman daftar user login Gambar 4. 25 Halaman tambah user login Gambar 4. 26 Halaman cari data user Gambar 4. 27 Halaman edit data user

4.8.6. Lihat Data Monitoring

Gambar 4.28 sd 4.31 berikut ini adalah tampilan dari menu monitoring kWh 0, yang terdiri dari halaman daftar pelanggan kWh 0 sudah cek, belum cek, dan cek perbulan. Untuk tampilan user interface daftar pelanggan kWh Maks sama seperti tampilan kWh 0. Sedangkan untuk data TBT akan ditunjukan pada gambar 4.32 sd 4.34. Operator atau admin dapat mencari daftar berdasarkan UNITUP tertentu dengan memilih pada menu dropdown UNITUP kemudian klik tombol CARI. Untuk operator dan admin rayon ditunjukan pada gambar 4.35 sd 4.40. Gambar 4. 28 Halaman lihat daftar kwh 0 sudah cek halaman kwh maks sama Gambar 4. 29 Halaman lihat daftar kwh 0 belum cek halaman kwh maks sama Gambar 4. 30 Halaman cari data monitoring perbulan Gambar 4. 31 Halaman daftar monitoring kwh 0 cek perbulan kwh maks sama PLAGIAT MERUPAKAN TINDAKAN TIDAK TERPUJI Gambar 4. 32 Halaman daftar TBT sudah cek Gambar 4. 33 Halaman daftar TBT belum cek Gambar 4. 34 Halaman daftar TBT cek perbulan Gambar 4. 35 Halaman kwh 0 sudah cek untuk user admin dan operator rayon Gambar 4. 36Halaman kwh 0 belum cek untuk user admin dan operator rayon Gambar 4. 37 Halaman kwh 0 cek perbulan untuk user admin dan operator rayon Gambar 4. 38 Halaman daftar TBT sudah cek untuk operator dan admin rayon Gambar 4. 39 Halaman daftar TBT sudah cek untuk operator dan admin rayon Gambar 4. 40 Halaman daftar TBT sudah cek untuk operator dan admin rayon

4.8.7. Upload data dan ubah data monitoring

Gambar 4.41 merupakan tampilan user inteface untuk halaman form upload hasil monitoring pelanggan kWh 0 dan kWh maks. Untuk upload data monitoring TBT ditunjukan pada gambar 4.42 semua user memiliki tampilan interfaceupload data yang sama. User mengisi koordinat, tanggal, verifikasi kemudian mengklik tombol SIMPAN, kemudian mengupload foto dengan mengklik tombol browse untuk memilih foto, untuk menyimpan foto klik UPLOAD. Data hasil monitoring untuk pelanggan tersebut akan disimpan di database. Untuk halaman ubah data akan ditunjukan pada gambar 4.43 dan 4.44. Gambar 4. 41 Halaman upload data monitoring kwh 0 dan kwh maks Gambar 4. 42Halaman upload data monitoring TBT Gambar 4. 43Halaman ubahdata monitoring kwh 0 dan kwh maks Gambar 4. 44Halaman ubahdata monitoring TBT

4.8.8. Lihat Data Approve

Gambar 4.45 sd 4.51 berikut ini adalah tampilan dari menu Approve kWh 0, yang terdiri dari halaman daftar pelanggan kWh 0 sudah Approve, belum cek, cek semua, dan cek Approve perbulan, cek data yang sama dan cek per-unitup untuk admin area. Untuk tampilan user interface daftar pelanggan kWh Maks dan TBT sama seperti tampilan kWh 0. Sedangkan interface admin rayon ditunjukan pada gambar 4.52 sd 4.54. Admin dapat mencari daftar berdasarkan bulan dan tahun tertentu dengan memilih pada menu dropdown bulan dan mengisi tahun kemudian klik tombol CARI. Gambar 4. 45 Halaman lihat data sudah approve untuk admin area Gambar 4. 46Halaman lihat data belumapprove untuk admin area Gambar 4. 47 Halaman cari data approve bulan dan tahun Gambar 4. 48 Halaman lihat daftar approve perbulan untuk admin area Gambar 4. 49Halaman lihat daftar approvecek semua untuk admin area Gambar 4. 50 Halaman cek data yang sama Gambar 4. 51 Halaman lihat data approve per-unitup Gambar 4. 52 Halaman lihat daftar sudah approve untuk user admin rayon Gambar 4. 53 Halaman lihat daftar belumapprove untuk user admin rayon Gambar 4. 54Halaman lihat daftar cek approveperbulan untuk user admin rayon

4.8.9. Approve Dan Batalkan Status Monitoring

Dalam halaman yang ditampilkan pada gambar 4.55 form atas petugas dapat memberikan approve terhadap data monitoring pelanggan. Namun, pada gambar 4.55 form bawah merupakan tampilan dari halaman pembatalan status monitoring dari data pelanggan yang sudah dimonitoring ini. User mengisi alasan pembatalan kemudian mengklik tombol BATALKAN. Yang akan ditampilkan pada gambar adalah contoh interface dari pelanggan kwh 0. Untuk pelanggan kwh maks dan TBT halaman interface yang dimiliki sama dengan kwh 0. PLAGIAT MERUPAKAN TINDAKAN TIDAK TERPUJI Gambar 4. 55 Halaman approve data dan pembatalan status monitoring pelanggan kwh 0

4.8.10. Lihat Detail Approve dan Pembatalan Status Approve

Data yang sudah diapprove data yang sudah dicek dan disetujui dapat dilihat kembali detailnya. Data ini pun dapat dibatalkan dengan alasan tertentu. Petugas akan mengisi alasan pembatalan dan kemudian klik tombol BATALKAN gambar 4.56. Selain itu dalam halaman yang sama terdapat tombol untuk melihat versi sebelum dan history monitoring data pelanggan tersebut. Masing-masing detailnya ditunjukan pada gambar 4.57dan gambar 4.58. Gambar 4. 56 Halaman detail approve data pelanggan Gambar 4. 57 Halaman liat detail versi sebelum Gambar 4. 58 Halaman history monitoring

4.8.11. Lihat Detail Pelanggan

Gambar 4.59 dan 4.60 adalah tampilan dari halaman yang cari pelanggan. User dapat melakukan pencarian pelanggan untuk melihat informasi mengenai history monitoring tiap bulannya dari pelanggan tersebut dengan memasukkan id pelanggan atau no meter dari pelanggan tersebut. Kata kunci pencarian dari menu cari pelanggan ini adalah id pelanggan atau no meter khusus pelanggan prabayar. Gambar 4. 59 Halaman pencarian detail pelanggan Gambar 4. 60 Halaman detail pelanggan

4.8.12. Dasboard

Menu Dasboard terdapat pada menubar home. Gambar 4.61 berikut ini menampilan salah satu dari halaman dashboard, yaitu dasboard kWh 0 yang berisi laporan monitoring pelanggan dari semua UNITUP pada bulan tertentu. Secara default halaman yang ditampilkan akan berisi tabel monitoring yang dilakukan pada bulan terakhir. PLAGIAT MERUPAKAN TINDAKAN TIDAK TERPUJI Gambar 4. 61Interface Laporan Monitoring Kwh 0

4.8.13. Cetak Laporan

Berikut ini pada gambar 4.62 sd 4.71 merupakan tampilan halaman interface cetak laporan. Yang ditampilkan pada gambar 4.62 sd 4.67 merupakan tampilan halaman untuk cetak laporan pelanggan kwh 0 dengan parameter bulan dan tahun tertentu dan dalam format beberapa bulan. Selanjutnya pada gambar 4.68 sd 4.71 merupakan tampilan dari cetak laporan rekomendasi monitoring naik daya dari pelanggan kwh maks dengan parameter atas bulan dan tahun dan dengan menggunakan 2 parameter yaitu bulan dan tahun untuk batas atas dan bulan dan tahun batas bawah. Petugas dapat memilih untuk mencetak langsung dengan klik tombol CETAK atau melihat data terlebih dahulu dengan klik tombol LIHAT. Untuk melihat lebih jelas dari printout laporan dapat dilihat dalam Lampiran B. Gambar 4. 62 Halaman cetak laporan monitoring kwh 0 Gambar 4. 63 Halaman daftar pelanggan monitoring perbulan yang akan dicetak Gambar 4. 64 Preview dari cetak laporan monitoring kwh 0 gambar 4.63 Gambar 4. 65Halaman daftar pelanggan monitoring beberapa bulan yang akan dicetak Gambar 4. 66Preview dari cetak laporan monitoring kwh 0 dari gambar 4.65 PLAGIAT MERUPAKAN TINDAKAN TIDAK TERPUJI Gambar 4. 67 Halaman cetak blangko monitoring kwh maks naik daya Gambar 4. 68Halaman daftar pelanggan monitoring kwh maks naik daya dengan parameter batas atas bulan dan tahun tertentu Gambar 4. 69Preview cetak dari gambar 4.67 Gambar 4. 70Halaman daftar pelanggan monitoring kwh maks naik daya dengan parameter batas atas dan batas bawah bulan dan tahun tertentu Gambar 4. 71Preview cetak laporan rekomendasi monitoring dari gambar 4.70 240

BAB V ANALISA HASIL PENGUJIAN