- PDF Free Download

Transkripsi

1 44 BAB IV IMPLEMENTASI DAN PENGUJIAN SISTEM 4.1. Implementasi Dalam implementasi Monitoring SP2D dan SPM berbasis Web di BPKAD Pemerintah Kabupaten Tagerang., program akan di-install pada server yang disediakan oleh Pemerintah Kabupaten Tangerang. Server tersebut dihubungkan melalui jaringan intranet, yang memungkinkan pengguna bisa mengakses aplikasi tersebut melalui browser. Dalam jaringan intranet dibutuhkan satu komputer yang terhubung dengan printer yang berfungsi untuk mencetak laporan. Untuk itu dibutuhkan beberapa perangkat lunak serta perangkat keras dengan spesifikasi sebagai berikut: 1. Perangkat Keras a. Server i. Computer Type : Server ii. Processor : Intel(R) Xeon(R) CPU E GHz iii. RAM : 6GB iv. Hardisk : 500GB v. Monitor : 14" b. Client i. Computer Type : PC/Laptop Compaq Presario CQ42 14,1 inch ii. Processor : Intel Dual Core CPU iii. RAM : 2GB iv. Hardisk : 500GB v. Memory : 4096 Mb 2. Perangkat Lunak (Server) i. Application Server Package : XAMPP ii. Operating System : Microsoft Windows 7 iii. Database : MySQL (phpmyadmin) iv. Web Server : Apache 3.1 v. Server Side Scripting : PHP 5.4.7

2 45 vi. Aplikasi Web Browser : Google Chrome 30 or Later vii. Office Application : Microsoft Excel Implementasi Database Tahap awal dalam pembuatan aplikasi ini yaitu pembuatan database. Berikut adalah spesifikasi database dibutuhkan: Gambar 4.1 Database db_wira Sistem Aplikasi Berikut adalah tabel-tabel yang dibutuhkan pada database tersebut dari sisi sistem aplikasi:

3 46 Tabel Dinas Gambar 4.2 Tabel Dinas Berikut adalah source code untuk membuat tabel dinas: CREATE TABLE IF NOT EXISTS `tbl_dinas` ( `kd_dinas` char(7) NOT NULL, `nm_dinas char(60) NOT NULL, keterangan char(50) NULL ) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=52 ;

4 47 Tabel Info Gambar 4.3 Tabel info Berikut adalah souce code untuk membuat tabel info: CREATE TABLE IF NOT EXISTS `tbl_info` ( `kd_dinas` char(7) NOT NULL, `no_spm` varchar(50) NOT NULL, `tgl_spm` varchar(30) NOT NULL, `no_spp` varchar(50) NOT NULL, `tgl_spp` varchar(30) NOT NULL, `no_sp2d` varchar(50) NOT NULL, `tgl_sp2d` varchar(30) NOT NULL, `no_advice` varchar(50) NOT NULL, `tgl_advice` varchar(30) NOT NULL,

5 48 `status` char(3) NOT NULL, PRIMARY KEY (`no_spm`) ) ENGINE=InnoDB DEFAULT CHARSET=latin1; 4.3 Struktur File Program Pada tahap pengkodean menggunakan PHP yang merupakan bahasa pemograman web server-side yang bersifat open source. Di bawah ini adalah struktur file pada aplikasi Perancangan sistem informasi monitoring SPM dan SP2D dilingkungan pemerintahan Kabupaten Tangerang. Gambar 4.4 Struktur file Monitoring SPM dan SP2D

6 Tampilan Antar Muka Berikut adalah tampilan antar muka aplikasi perancangan sistem informasi monitoring SPM dan SP2D pada Badan Pengelola Keuangan dan Aset Daerah Kabupaten Tangerang. Login Pada saat pengguna membuka aplikasi, maka tampil halaman login. pengguna wajib memiliki userid dan password yang telah dibuat oleh administrator. Berikut ini adalah tampilan login. Gambar 4.5 Tampilan Login Isi userid dan password pada halaman login, lalu tekan enter atau klik tombol Masuk. Jika userid dan password sesuai, maka pengguna akan masuk ke halaman menu utama aplikasi. Namun, jika username dan password tidak sesuai maka akan muncul pesan "Anda belum terdaftar atau Anda di Blokir di aplikasi ini ". Berikut adalah potongan source code untuk proses login: Tampilan menu Login: <div class="col-sm-8"> <div style="float:right;"> <form class="form-inline" role="form" id="frm_login" name="frm_login"> <div class="form-group"> <input id="userid" name="userid" placeholder="user ID" size="15" class="form- control" style="height: 25px; font-size:11px" type="text"> </div> <div class="form-group">

7 50 <input id="password" name="password" placeholder="password" size="15" class="form-control" style="height: 25px; font-size:11px" type="password"> </div> <div class="form-group"> <input id="btn_login" name="btn_login" value="login" class="btn btn-default" style="display: inline-block; height: 25px; font-size:11px" onclick="fn_login()" type="button"> </div> </form> </div> </div> Proses Login Java Script: function fn_login(){ var id_login = document.getelementbyid('userid').value; var pass_login = document.getelementbyid('password').value; if (id_login == ''){ f_pesan("user ID tidak boleh kosong!"); return false; if (pass_login == ''){ f_pesan("password tidak boleh kosong!"); return false; if (pass_login.length < 5){ f_pesan("password minimal 5 karakter!"); return false;

8 51 var s_formlogin = $('#frm_login').serialize(); $.ajax({ type: "POST", url: "././source/ajax_file.php", data: {value:s_formlogin, marked:'login', success: function(data) { if (data.search('sukses') > 0) { window.location=('././source/home.php'); else{ f_pesan(data); return (false); ); <?php include "DBConnect.php"; if (is_ajax()) { $marked = $_POST["marked"]; switch($marked){ case "login": $value = $_POST["value"]; parse_str($value); $query = "select * FROM tbl_login WHERE user_id ='$userid' and password=md5('$password')"; $stmt = $con->prepare($query); if ($stmt->execute()){

9 52 salah!!"; session belum aktif, aktifin session >fetch(pdo::fetch_assoc); $userid; = $hasil['user_name']; break; else{ $cek = $stmt->rowcount(); if ($cek < 1){ echo "password atau user id else{ if(empty($_session)){ // jika session_start(); $hasil = $stmt- $_SESSION['userid'] = $_SESSION['username'] echo "login sukses!!"; echo "login gagal!!"; function is_ajax() { return isset($_server['http_x_requested_with']) && strtolower($_server['http_x_requested_with']) == 'xmlhttprequest';?>

10 53 Menu Utama Setelah login berhasil, aplikasi akan menampilkan halaman utama. Berikut adalah halaman utama aplikasi. Gambar 4.6 Tampilan Menu Utama Halaman utama menampilkan semua menu yang berfungsi untuk membuka halaman lain pada aplikasi. Menu yang ditampilkan adalah sesuai dengan hak akses pengguna tersebut. Dengan pengaturan hak akses pengguna, maka diharapkan keamanan data pada aplikasi terjaga dengan baik dan tidak semua pengguna dapat dengan bebas membuka atau mengakses fitur-fitur yang ada pada aplikasi. Berikut adalah potongan source code untuk menampilkan menu: <input id="btn_cari" class="btn btn-success" onclick="fn_search();" style="fontsize:12px; font-family:tahoma;margin:1% 0%;" value="search" type="button">

11 54 -- proses cari javascript (call ajax) function fn_search(){ var dinas = document.getelementbyid('cb_dinas').value; var no_spm = document.getelementbyid('txt_nospm').value; if (dinas == ''){ f_pesan('dinas belum di set!!!'); return false; if (no_spm == ''){ f_pesan('no. SPM harus di isi!!!'); return false; var s_frm_search = $('#frm_search').serialize(); $.ajax({ type: "POST", url: "ajax_file.php", data: {value:s_frm_search, marked:'cari', success: function(data) { $("#tabel").html(data); return (false); );

12 55 Item Cari Informasi SPM dan SP2D Tampilan menu data master berisikan item aplikasi cari informasi SPM dan SP2D, Berikut adalah tampilannya. Gambar 4.7 Tampilan cari informasi SPM dan SP2D Halaman user dapat mencari data item cari informasi SPM dan SP2D dengan mencari berdasarkan SKPD yang dituju sesuai pilihan Dinas dan ketikan nomor SPM yang akan dicari kemudian user dapat menekan tombol Cari. Berikut adalah potongan source code untuk menampilkan item verifikasi: <?php include "DBConnect.php"; if (is_ajax()) { $marked = $_POST["marked"];

13 56 switch($marked){ case "cari": $value = $_POST["value"]; parse_str($value); $query = "select * FROM tbl_info WHERE kd_dinas ='$cb_dinas' and no_spm='$txt_nospm'"; $stmt = $con->prepare($query); if ($stmt->execute()){ $cek = $stmt->rowcount(); if ($cek > 0){ $row = $stmt- >fetch(pdo::fetch_assoc); extract($row); if (rtrim(strtoupper($status)) == "SELESAI"){ $message = ""; else{ $message = "<span style='color:#ff0000;'><b>*) Dimohon untuk menghubungi dinas terkait.</b></span>"; style='font-size:12px; font-family:arial;'> SPM</b></td> $tabel = " <table width='100%' class='table' <tr> <td width='25%'><b>no.

14 57 type='text' value='".$no_spm."' disabled /></td> width='5%'><b>tgl</b></td> type='text' value='".$tgl_spm."' disabled /></td> SPP</b></td> value='".$no_spp."' disabled /></td> value='".$tgl_spp."' disabled /></td> SP2D</b></td> value='".$no_sp2d."' disabled /></td> value='".$tgl_sp2d."' disabled /></td> Advice</b></td> value='".$no_advice."' disabled /></td> </tr> <tr> </tr> <tr> </tr> <tr> <td width='30%'><input <td <td width='45%'><input <td><b>no. <td><input type='text' <td><b>tgl</b></td> <td><input type='text' <td><b>no. <td><input type='text' <td><b>tgl</b></td> <td><input type='text' <td><b>no. <td><input type='text'

15 58 <td><b>tgl</b></td> <td><input type='text' value='".$tgl_advice."' disabled /></td> </tr> <tr> <td><b>status</b></td> <td><input type='text' value='".strtoupper($status)."' disabled /></td> <td colspan='2'>".$message."</td> </tr> <tr> <td></td> <td></td> <td></td><td></td> </tr> </table>"; else{ $tabel = "Data yang anda cari tidak ada!!!"; else{ $tabel = "Select data gagal!!!"; echo $tabel; break;

16 59 function is_ajax() { return isset($_server['http_x_requested_with']) && strtolower($_server['http_x_requested_with']) == 'xmlhttprequest';?> Input item logout Untuk keluar dari menu utama maka user dapat melakukan Logout sebelum aplikasi. Berikut ini adalah tampilan input item logout. <input id="btn_logout" name="btn_logout" value="logout" class="btn btn-default" onclick="fn_logout();" style="display: inline-block; height: 25px; font-size:11px;" type="button"> -- proses logout di javascript (call ajax) function fn_logout(){ $.ajax({ type: "POST", url: "ajax_file.php", data: {marked:'logout', success: function(data) { if (data.search('sukses') > 0) { window.location=('../index.php'); return (false); );

17 60 -- proses logout di php (call ajax) <?php include "DBConnect.php"; if (is_ajax()) { $marked = $_POST["marked"]; switch($marked){ case "logout": session_start(); unset($_session['userid']); unset($_session['username']); session_destroy(); echo "logout sukses!!"; exit; function is_ajax() { return isset($_server['http_x_requested_with']) && strtolower($_server['http_x_requested_with']) == 'xmlhttprequest';?> 4.5 Pengujian Aplikasi Pengujian sistem yang dilakukan bertujuan untuk mengetahui apakah aplikasi yang dikembangkan dapat berjalan sebagaimana mestinya sesuai dengan rancangan. Selain itu, hal ini juga dilakukan untuk menghindari terjadinya kesalahan-kesalahan pada saat aplikasi di jalankan.

18 Metode Pengujian Metode pengujian yang dilakukan adalah metode black box testing. Metode ini merupakan metode pengujian yang menekankan pada berhasil atau tidaknya menjalankan fungsi dari web yang telah dibuat tanpa memperdulikan code source yang ada. Adapun metode black box testing ini bertujuan untuk mencari kesalahan diantaranya kesalahan berupa fungsi yang salah atau hilang, kesalahan pada tampilan layar (interface), kesalahan pada struktur data atau akses basis data (database), kesalahan performansi, kesalahan inisialisasi dan tujuan akhir Metode penggunaan black box testing ini dapat dilakukan dengan memberikan sejumlah masukan (input) pada sistem informasi yang kemudian diproses sesuai dengan kebutuhan funsionalnya untuk melihat apakah sistem meghasilkan keluaran (output) yang diinginkan dan sesuai dengan fungsi sistem tersebut. Apabila dari input yang diberikan menghasikan keluaran (output) yang sesuai dengan kebutuhan fungsionalnya, maka sistem yang dibuat telah berjalan dengan benar akan tetapi apabila output yang dihasilkan tidak sesuai dengan kebutuhan fungsionalnya, maka masih terdapat kesalahan pada sistem tersebut. Pengujian dilakukan dengan mencoba semua kemungkinan yang terjadi dan dilakukan secara bertahap dan berulang ulang. Jika dalam pengujian ditemukan kesalahan, maka akan dilakukan perbaikan (debugging) untuk memperbaikinya dan dilakukan pengujian kembali jika perbaikan sudah selesai. Pengujian dan perbaikan dilakukan secara terus menerus hingga diperoleh hasil yang baik Skenario Pengujian Berikut adalah skenario pengujian yang dilakukan :

19 62 Antar muka No yang diuji 1 Halaman Login 2 Halaman Menu Utama Aplikasi 3 Halaman Logout Bagian dari antar muka yang diuji Form input login Menu - menu untuk user Form input logout Status aplikasi Halaman login tampil Halaman menu utama tampil Halaman logout tampil Skenario pengujian Mengisi User ID dan Password Menekan Tombol Masuk Membuka Halaman Melakukan klik pilihan dinas dan no SPM dan menekan tombol Search Melakukan klik link Keluar Melakukan klik link Keluar Hasil yang diharapkan Dapat menjadi parameter untuk validasi user id dan password tidak boleh kosong atau harus diisi. Dapat melakukan validasi user dan password yang berhak masuk ke sistem. Dapat membuka halaman dari menu yang sesuai pilihan Diharapkan dapat menampilkan informasi SPM dan SP2D Dapat melakukan keluar dari aplikasi dan menampilkan halaman login Dapat melakukan keluar dari aplikasi dan menampilkan halaman login Tabel 4.1 Skenario Pengujian Aplikasi Perancangan Sistem Informasi Monitoring SPM dan SP2D Hasil Pengujian Berdasarkan skenario pengujian yang telah dilakukan, diperoleh hasil pengujian sebagai berikut:

20 63 Antar muka No yang diuji 1 Halaman Login 2 Halaman Menu Utama Aplikasi Bagian dari antar muka yang diuji Form input login Menu - menu untuk user Status aplikasi Halaman login tampil Halaman menu utama tampil Skenario pengujian Mengisi User ID dan Password Menekan Tombol Masuk Membuka Halaman Melakukan klik pilihan dinas dan no SPM dan menekan tombol Search Melakukan klik link Keluar Hasil yang didapat Dapat menjadi parameter untuk validasi user id dan password tidak boleh kosong atau harus diisi. Dapat melakukan validasi user dan password yang berhak masuk ke sistem. Dapat membuka halaman dari menu yang sesuai pilihan dapat menampilkan informasi SPM dan SP2D Dapat melakukan keluar dari aplikasi dan menampilkan halaman login 3 Halaman Logout Form input logout Halaman logout tampil Melakukan klik link Keluar Dapat melakukan keluar dari aplikasi dan menampilkan halaman login Tabel 4.2 Hasil Pengujian Skenario Aplikasi Perancangan Sistem Informasi Monitoring SPM dan SP2D

21 Analisa Hasil Pengujian Setelah dilakukan pengujian secara menyeluruh, maka dapat disimpulkan bahwa pengujian telah menunjukan hasil keluaran (output) dan proses yang sesuai dengan Perancangan Sistem Informasi Monitoring SPM dan SP2D dilingkungan Pemerintah Kabupaten Tangerang. Hasil dari pengujian ini dapat dikatakan bahwa sistem ini dapat dikatakan bahwa sistem ini dapat berfungsi dengan baik dan benar, karena telah dibuktikan dari hasil skenario pengujian. Hasil pengujian yang diperoleh dapat dianalisis sebagai berikut : 1. Halaman Login yang mengontrol aktivitas menu menu atau form form dalam sistem berjalan dengan baik 2. Halaman utama yang mehubungkan antar interface yang terdapat dalam menu berjalan dengan baik. 3. Proses pencarian dengan inputan pilihan dinas yang sesuai kebutuhan user dapat dijalankan dengan baik. 4. Sistem ini telah dilakukan pengujian dan dapat dijalankan sesuai dengan rancangan sistem yang telah dibangun. 5. Hasil keluaran (output) dapat dilihat sebagai informasi SPM dan SP2D Aplikasi ini menghasilkan informasi, diantaranya yaitu: 1. Pilihan Dinas dapat dilihat sebagai acuan user mecari SKPD yang akan dilihat. 2. Nomor SPM adalah konfersi dari yang sudah dilakukan pada saat membuat SPM di aplikasi SIPKD 3. Status data atau informasi akan terlihat dalam aplikasi baik nomor SPM,tgl SPM, nomor SP2D, tgl SP2D, nomor Advice, tgl advice, dan status

22 65 BAB V KESIMPULAN DAN SARAN 5.1 Kesimpulan Setelah mempelajari masalah yang dihadapi dan juga solusi permasalahan yang ditawarkan dalam pembuatan informasi monitoring SPM dan SP2D berbasis wed dilingkungan pemerintah Kabupaten Tangerang ini, maka dapat diambil beberapa kesimpulan antara lain : 1. Menyediakan informasi tentang Pengelolaan Anggaran, Perbendaharaan dan Laporan Keuangan Daerah di Pemerintah Daerah Kabupaten Tangerang melalui Website. 2. Menghasilkan dampak positif bagi perkembangan dan kemajuan Instansi Badan Pengelola Keuangan dan Aset Daerah Kabupaten Tangerang. 3. Home Page/Website ini akan difungsikan juga sebagai sarana BPKAD agar lebih dikenal masyarakat secara luas, selain itu merupakan sarana bagi BPKAD dalam membina hubungan dengan instansi-instansi lain di lingkungan Kabupaten Tangerang. 4. Menjadikan sarana penyampaian informasi dalam pencarian jenis SPM dan SP2D yang telah diajukan oleh seluruh SKPD yang tersebar diwilayah Kabupaten Tangerang ke Badan Pengelola Keuangan dan Aset Daerah 5.2 Saran Berikut beberapa hal yang perlu dilakukan untuk mengembangkan aplikasi ini: 1. Aplikasi ini dapat dikembangkan dengan menambahkan form untuk pengelolaan SPM dan SP2D agar dapat memantau hasil realisasi pencairan per SKPD. 2. Aplikasi ini dapat dikembangkan dengan ditambahkan informasi mengenai pedoman dan ketentuan-ketentuan pada SKPD dan BPKAD sehingga mempermudah verifikator dalam memverifikasi pekerjaan. 3. Menambahkan form-form presentasi kegiatan yang telah dicairkan oleh setiap SKPD.

23 66 DAFTAR PUSTAKA Moekijat. Prasojo. Pengantar Sistem Informasi Manajemen Bandung: CV. Remadja Karya Tata Sutabri. Konsep Sistem Informasi Yogyakarta: Andi, 2012 Peraturan Dalam Negeri Nomor 55 Tahun 2008 Tentang Tata Cara Penatausahaan dan Penyusunan Laporan Pertanggungjawaban Bendahara Serta penyampaiannya dalam Bab 1 ketentuan umum pasal 17 dan 18 Dennis, Alan et al. System Analis and Design UML Version 2.0 And Object Oriented Approach. USA : John Willey & Kevin Inc Dennis, Alan et al. System Analis and Design UML 5 Edition h. USA : John Willey & Kevin Inc Pusat Bahasa Departemen Pendidikan Nasional. Kamus Besar Bahasa Indonesia. Jakarta: Balai Pustaka, Definisi dan Pengertian Web Menurut Para Ahli. [Online]. Tersedia: [29 September 2012, WIB]. Fathansyah. Buku Teks Ilmu Komputer Basis Data (Edisi Revisi). Bandung: Informatika, Arief M Rudianto, Pemrograman Web Dinamis menggunakan PHP dan MySQL. Yogyakarta : C.V ANDI OFFSET, 2011 Sibero, Alexander F.K. Kitab Suci Web Programing. Yogyakarta: Mediakom

24 67 LAMPIRAN

25 68.

26 69

27 70