BAB IV IMPLEMENTASI DAN PENGUJIAN
4.1
Implementasi Setelah tahap analisa dan tahap perancangan sistem aplikasi, maka tahap
selanjutnya merupakan tahap implementasi. Akan dibahas mengenai tahap implementasi pembuatan basis data dan implementasi perancangan antar muka Sistem Pencatatan Service Point Office, menggunakan PHP MySQL dan diperlukan
sebuah Web Server yang digunakan sebagai tempat penyimpanan program. Web server yang digunakan berupa XAMPP dengan Apache dan MySQL sebagai database server, untuk membuka program, jalankan browser modern seperti Chrome atau Firefox dan ketik alamat http://localhost/spobjps dan mulai login. Implementasi yang dilakukan menggunakan sebuah perangkat komputer untuk pembuatan dan uji coba. Berikut spesifikasi perangkat keras sebagai berikut : Tabel 4.1 Spesifikasi Perangkat Keras Perangkat Keras
Spesifikasi
Processor
AMD QuadCore A10 5745M
RAM
4096 MB
Graphic card
AMD Radeon HD8610G
Adapun perangkat lunak yang digunakan untuk melakukan implementasi pembuatan aplikasi ini adalah sebagai berikut : Tabel 4.2 Fungsi perangkat lunak Perangkat Lunak
Fungsi
Windows 10 Pro 64-bit
Sistem Operasi
Notepad++
IDE untuk scripting PHP
55
http://digilib.mercubuana.ac.id/
56
Tabel 4.3 Lanjutan Fungsi perangkat lunak Perangkat Lunak Xampp (dengan Apache & MySql) Microsoft Word 2013
4.2
Fungsi Web Server & Database Server Dokumentasi dan penulisan
Implementasi Basis Data
Implementasi basis data yang digunakan untuk aplikasi ini disesuaikan dengan class diagram. Pada gambar berikut dapat dilihat bahwa tabel yang dirancang sudah terpasang sesuai kebutuhan :
Gambar 4.1 Implementasi Tabel Basis Data 4.2.1
Implementasi Tabel Cabang
CREATE TABLE `tbcabang` ( `kode_cabang` VARCHAR(20) NOT NULL, `nama_cabang` VARCHAR(50) NULL DEFAULT NULL, `alamat_cabang` VARCHAR(70) NULL DEFAULT NULL, `no_telpon_cabang` VARCHAR(15) NULL DEFAULT NULL, `manager_cabang` VARCHAR(20) NOT NULL, `no_telpon_manager` VARCHAR(15) NULL DEFAULT NULL, `email` VARCHAR(30) NOT NULL, `status_kcp` CHAR(1) NOT NULL DEFAULT '1' COMMENT '1 Aktif, 0 Inactive (dihapus)', PRIMARY KEY (`kode_cabang`) ) COLLATE='latin1_swedish_ci' ENGINE=InnoDB ;
http://digilib.mercubuana.ac.id/
57
Gambar 4.2 Implementasi Tabel Cabang
4.2.2
Implementasi Tabel SPO
CREATE TABLE `tbspo` ( `kode_spo` VARCHAR(20) NOT NULL, `nama_spo` VARCHAR(50) NULL DEFAULT NULL, `alamat_spo` VARCHAR(70) NULL DEFAULT NULL, `no_telpon_spo` VARCHAR(15) NULL DEFAULT NULL, `manager_spo` VARCHAR(20) NOT NULL, `no_telpon_manager` VARCHAR(15) NULL DEFAULT NULL, `email` VARCHAR(30) NOT NULL, `kode_cabang` VARCHAR(20) NOT NULL, `status_spo` CHAR(1) NOT NULL DEFAULT '1' COMMENT '1 Aktif, 0 Inactive (dihapus)', PRIMARY KEY (`kode_spo`), INDEX `fk_spo_cabang` (`kode_cabang`), CONSTRAINT `fk_spo_cabang` FOREIGN KEY (`kode_cabang`) REFERENCES `tbcabang` (`kode_cabang`) ON UPDATE CASCADE ) COLLATE='latin1_swedish_ci' ENGINE=InnoDB ;
http://digilib.mercubuana.ac.id/
58
Gambar 4.3 Implementasi Tabel SPO
4.2.3
Implementasi Tabel User
CREATE TABLE `tbuser` ( `userlogin` VARCHAR(20) NOT NULL, `passwd` CHAR(32) NOT NULL, `nama_karyawan` VARCHAR(50) NULL DEFAULT NULL, `nik` VARCHAR(20) NULL DEFAULT NULL, `role_karyawan` VARCHAR(9) NOT NULL, `kode_cabang` VARCHAR(20) NOT NULL, `status_karyawan` CHAR(1) NOT NULL, PRIMARY KEY (`userlogin`), INDEX `fk_user_cabang` (`kode_cabang`), CONSTRAINT `fk_user_cabang` FOREIGN KEY (`kode_cabang`) REFERENCES `tbcabang` (`kode_cabang`) ON UPDATE CASCADE ) COLLATE='latin1_swedish_ci' ENGINE=InnoDB ;
http://digilib.mercubuana.ac.id/
59
Gambar 4.4 Implementasi Tabel User 4.2.4
Implementasi Tabel Header Transaksi
CREATE TABLE `tbtrans_hdr` ( `idtrans_hdr` VARCHAR(12) NOT NULL, `tanggal_upload` DATETIME NOT NULL, `userlogin` VARCHAR(20) NOT NULL, `kode_spo` VARCHAR(20) NOT NULL, `status` CHAR(1) NOT NULL, PRIMARY KEY (`idtrans_hdr`), INDEX `fk_hdr_userlogin` (`userlogin`), INDEX `fk_hdr_spo` (`kode_spo`), CONSTRAINT `fk_hdr_spo` FOREIGN KEY (`kode_spo`) REFERENCES `tbspo` (`kode_spo`) ON UPDATE CASCADE, CONSTRAINT `fk_hdr_userlogin` FOREIGN KEY (`userlogin`) REFERENCES `tbuser` (`userlogin`) ON UPDATE CASCADE ) COLLATE='latin1_swedish_ci' ENGINE=InnoDB ;
Gambar 4.5 Implementasi Tabel Header Transaksi
http://digilib.mercubuana.ac.id/
60
4.2.5 Implementasi Tabel Detail Transaksi CREATE TABLE `tbtrans_dtl` ( `idtrans_dtl` INT(11) NOT NULL AUTO_INCREMENT, `idtrans_hdr` VARCHAR(20) NOT NULL DEFAULT '0', `nama_tk` VARCHAR(100) NOT NULL DEFAULT '0', `no_kpj` VARCHAR(50) NOT NULL DEFAULT '0', `tanggal_pengajuan` DATETIME NOT NULL, `tanggal_status` DATETIME NOT NULL, `tanggal_dokumen` DATE NOT NULL, `status_dokumen` VARCHAR(50) NOT NULL, `no_agenda` VARCHAR(50) NOT NULL, `no_penetapan` VARCHAR(50) NULL DEFAULT NULL, `nominal_bersih` DECIMAL(16,2) NULL DEFAULT '0.00', `no_rekening_debet` VARCHAR(25) NULL DEFAULT '0', `no_rekening_tujuan` VARCHAR(25) NULL DEFAULT '0', `tanggal_pencarian` DATE NULL DEFAULT NULL, `kode_cabang` VARCHAR(5) NOT NULL DEFAULT '0', `nama_cabang` VARCHAR(20) NOT NULL DEFAULT '0', `kantor_cabang` VARCHAR(20) NOT NULL DEFAULT '0', `status` VARCHAR(50) NOT NULL DEFAULT '0', `created_user` VARCHAR(20) NOT NULL DEFAULT '0', PRIMARY KEY (`idtrans_dtl`), INDEX `fk_dtl_hdr` (`idtrans_hdr`), CONSTRAINT `fk_dtl_hdr` FOREIGN KEY (`idtrans_hdr`) REFERENCES `tbtrans_hdr` (`idtrans_hdr`) ON UPDATE CASCADE ) COLLATE='latin1_swedish_ci' ENGINE=InnoDB ;
Gambar 4.6 Implementasi Tabel Detail Transaksi
http://digilib.mercubuana.ac.id/
61
4.2.6 Implementasi Relasi Tabel
Gambar 4.7 Implementasi Relasi Tabel 4.3
Implementasi Antar Muka Aplikasi
4.3.1
Implementasi Antar Muka Login
Pada saat aplikasi dijalankan, maka akan muncul halaman login. Pada form ini pengguna diwajibkan mengisi username dan password. Antar muka login menampilkan logo BPJS Ketenagakerjaan dan textbox username dan password yang berfungsi untuk pengecekan hak akses.
Gambar 4.8 Implementasi Antar Muka Login
http://digilib.mercubuana.ac.id/
62
4.3.2 Implementasi Antar Muka Dashboard Setelah proses login berhasil maka pengguna diarahkan menuju dashboard sesuai dengan role masing-masing. Untuk dashboard admin menampilkan menu User, Cabang dan SPO. Masing-masing menu berfungsi melakukan manajemen master.
Gambar 4.9 Implementasi Antar Muka Dashboard Admin Dashboard keuangan menampilkan menu Upload yang berfungsi untuk upload data laporan SPO.
Gambar 4.10 Implementasi Antar Muka Dashboard Keuangan
http://digilib.mercubuana.ac.id/
63
Dashboard pelayanan menampilkan menu pencarian dan klaim JHT yang berfungsi untuk penarikan data SPO.
Gambar 4.11 Implementasi Antar Muka Dashboard Keuangan 4.3.3 Implementasi Antar Muka Cabang Untuk menu cabang menampilkan grid cabang dari BPJSTK yang menggunakan sistem pencatatan SPO ini, grid menampilkan detail nama, alamat, nomor telepon dan manager cabang. Serta terdapat tombol create cabang yang berfungsi untuk menambah cabang.
Gambar 4.12 Implementasi Antar Muka Indeks Cabang
http://digilib.mercubuana.ac.id/
64
Ketika tombol create ditekan maka akan menampilkan form tambah cabang, di dalam form tersebut terdapat textbox data cabang yang ingin di buat seperti kode, nama, alamat, nomor telepon, manager dan nomor telepon manager dan email.
Gambar 4.13 Implementasi Antar Muka Form Cabang
4.3.4
Implementasi Antar Muka SPO
Untuk menu SPO menampilkan grid SPO yang terdaftar dalam sistem pencatatan SPO ini, grid menampilkan detail kode, nama, alamat, manager dan nomor telepon. Serta terdapat tombol create SPO yang berfungsi untuk menambah SPO.
Gambar 4.14 Implementasi Antar Muka Indeks SPO
http://digilib.mercubuana.ac.id/
65
Ketika tombol create ditekan maka akan menampilkan form tambah SPO, di dalam form tersebut terdapat textbox data SPO yang ingin di buat seperti kode, nama, nomor telepon, manager dan nomor telepon manager, cabang SPO terdaftar dan email.
Gambar 4.15 Implementasi Antar Muka Form SPO
4.3.5
Implementasi Antar Muka User
Untuk menu User menampilkan grid User yang terdaftar dalam sistem pencatatan SPO ini, grid menampilkan detail username, nama, nik, dan role. Serta terdapat tombol create User yang berfungsi untuk menambah User.
Gambar 4.16 Implementasi Antar Muka Indeks User
http://digilib.mercubuana.ac.id/
66
Ketika tombol create ditekan maka akan menampilkan form tambah User, di dalam form tersebut terdapat textbox data User yang ingin di buat seperti username,password, nama, NIK, role, dan cabang User terdaftar.
Gambar 4.17 Implementasi Antar Muka Form User
4.3.6
Implementasi Antar Muka Upload
Untuk menu upload pada bagian keuangan, akan menampilkan grid riwayat data SPO yang sudah diupload sebelum nya, detail data antara lain ID upload hasil generate, tanggal upload, user yang melakukan upload dan kode SPO.
Gambar 4.18 Implementasi Antar Muka Indeks Upload
http://digilib.mercubuana.ac.id/
67
Ketika tombol Create Upload ditekan maka akan menampilkan form upload, terdapat tombol pilih file dengan dropdown SPO sesuai dengan cabang terdaftar oleh user keuangan.
Gambar 4.19 Implementasi Antar Muka Form Upload
4.3.7
Implementasi Antar Muka Pencarian
Untuk menu pencarian di bagian pelayanan, akan menampilkan form pencarian dengan berbagai kriteria berdasarkan data yang diupload oleh keuangan. Kriteria tersebut antara lain, nama, nomor kartu, bank SPO, cabang, dan nomor rekening.
Gambar 4.20 Implementasi Antar Muka Form Pencarian
http://digilib.mercubuana.ac.id/
68
Untuk hasil pencarian menampilkan nomor upload, nama tenaga kerja, nomor KPJ, nomor agenda, nomor penetapan, tanggal pengajuan, tanggal status, dan tanggal dokumen, dan bisa di export dalam bentuk excel atau pdf.
Gambar 4.21 Implementasi Antar Muka Hasil Pencarian
4.3.8 Implementasi Antar Muka Klaim JHT Untuk menu klaim JHT di bagian pelayanan, akan menampilkan form pencarian klaim JHT dengan berbagai kriteria berdasarkan data yang diupload oleh keuangan. Kriteria tersebut antara lain tanggal mulai, tanggal selesai dan cabang SPO.
Gambar 4.22 Implementasi Antar Muka Klaim JHT 4.4
Verifikasi Pengujian Pengujian perlu dilakukan untuk menguji sistem / aplikasi yang telah
dibuat apakah sudah sesuai dengan rancangan awal atau tidak. Pengujian yang akan dilakukan yaitu menguji semua proses pada semua halaman yaitu halaman login, Menu Admin, Keuangan, Pelayanan, Upload SPO, Pencarian Data,
http://digilib.mercubuana.ac.id/
69
Penarikan Data Klaim JHT, dan Manajemen data master cabang, SPO dan pengguna 4.5
Skenario Pengujian Uji coba dilakukan setelah pembuatan perangkat lunak selesai dengan
percobaan pada komputer tampilan pengguna. Dengan melakukan uji coba ini dapat dilakukan untuk mengetahui kemungkinan terjadinya kesalahan dan untuk memastikan fungsi-fungsi yang terdapat pada modul-modul aplikasi ini apakah sudah berjalan dengan baik. Dalam proses pengujiannya metode yang digunakan adalah black box. Metode ini dipilih karena pengetesan cukup mengetahui semua fungsi – fungsi yang ada dalam sistem berjalan tanpa ada kesalahan dan tidak memerlukan pengetesan secara detail / logis. Tabel 4.4 Skenario pengujian Black Box No
Antar Muka
1.
Login
2.
3.
Bagian Status antar Aplikasi muka yang diuji Proses Tampilan input di halaman form login login sudah terbuka
Skenario Pengujian
Hasil yang Hasil diinginkan Pengujian
Memasukan username dan password
Dashboard
Menguji tampilan dashboard dan menu
Tampilan halaman dashboard sudah terbuka
Pengecekan dashboard dan klik semua menu
Master Cabang
Menguji tambah, edit dan hapus cabang
Tampilan halaman master cabang sudah
Memasukan data cabang yang ingin di tambah, edit atau hapus
Data user login akan di cek, jika benar maka masuk ke halaman utama, jika salah maka tidak bisa masuk halaman utama Tampilan menu dan dashboard sesuai dengan jabatan user login Data cabang berhasil dieksekusi sesuai
http://digilib.mercubuana.ac.id/
Sesuai dengan yang diinginkan
Sesuai dengan yang diinginkan
Sesuai dengan yang diinginkan
70
terbuka
dengan permintaan
Tabel 4.5 Skenario pengujian Black Box lanjutan No
Antar Muka
4.
Master User
5.
Master SPO
6.
Halaman Upload SPO
7.
8.
Bagian antar muka yang diuji Menguji tambah, edit dan hapus user
Status Aplikasi
Skenario Pengujian
Hasil yang Hasil diinginkan Pengujian
Tampilan halaman master user sudah terbuka Menguji Tampilan tambah, halaman edit dan master hapus SPO SPO sudah terbuka Menguji Tampilan fungsi halaman upload upload file SPO SPO sudah terbuka
Memasukan data user yang ingin di tambah, edit atau hapus
Data user berhasil dieksekusi sesuai dengan permintaan Data SPO berhasil dieksekusi sesuai dengan permintaan File SPO berhasil di upload dan disimpan
Sesuai dengan yang diinginkan
Halaman Pencarian
Menguji fungsi pencarian
Tampilan halaman pencarian sudah terbuka
Memasukan klasifikasi pencarian
Menampilk an data sesuai dengan klasifikasi pencarian
Sesuai dengan yang diinginkan
Halaman Klaim JHT
Menguji fungsi klaim JHT
Tampilan halaman klaim JHT sudah terbuka
Memasukan filter data untuk klaim JHT
Menampilk an data klaim JHT sesuai filter
Sesuai dengan yang diinginkan
Memasukan data SPO yang ingin di tambah, edit atau hapus Memasukan file SPO yang ingin disimpan
http://digilib.mercubuana.ac.id/
Sesuai dengan yang diinginkan Sesuai dengan yang diinginkan
71
9.
4.6
Export dokumen
Menguji fungsi export hasil pencarian dan klaim JHT
Tampilan halaman export sudah terbuka
Menekan Berhasil tombol export data export ke excel dengan data yang ditampilkan
Sesuai dengan yang diinginkan
Analisa Hasil Pengujian
Dari keseluruhan proses pengujian dapat dianalisa bahwa : 1. Koneksi ke basis data berhasil dilakukan sehingga proses berjalan dengan sesuai. 2. Proses login berhasil dilakukan, dengan memasukan username dan password yang sesuai maka aplikasi akan mengarahkan halaman sesuai dengan jabatan nya. 3. Proses CRUD (Create, Read, Update, Delete) untuk data master Cabang, User dan SPO berhasil dilakukan. 4. Proses Upload file SPO berhasil dilakukan oleh bagian keuangan 5. Proses Pencarian dengan klasifikasi data berhasil dilakukan bagian pelayanan. 6. Proses klaim JHT berhasil dilakukan oleh bagian pelayanan. 7. Proses export hasil pencarian dan klaim JHT ke excel berhasil dilakukan.
http://digilib.mercubuana.ac.id/
