30 BAB III ANALISA DAN PERANCANGAN SISTEM 3.1. Gambaran Umum Tujuan dari Membuat aplikasi Sistem Informasi Monitoring SP2d dan SPM berbasis Web dilingkungan Badan Pengelola Keuangan dan Aset Daerah Kabupaten Tangerang, memudahkan pencarian informasi proses pengajuan SP2D dan SPM, menjadi media alternatif untuk dinas dinas yang ingin mengetahui seberapa jauh proses SP2D dan SPM yang diajukan, dapat mengetahui dimana kesalahan dari pengajuan SP2d dan SPM tersebut, menyediakan informasi tentang Pengelolaan Anggaran, Perbendaharaan dan Laporan Keuangan Daerah di Pemerintah Daerah Kabupaten Tangerang melalui Website. 3.2. Analisa Sistem Yang Berjalan Sistem sekarang yang berjalan yaitu masih menggunakan cara manual, melihat informasi dengan menggunakan buku ekpedisi yang sudah masuk keloket Perbendaharaan. Isi buku tersebut adalah menerangkan bahwa dokumen pengajuan SPP dan SP2D dalam proses perbendaharaan. Informasi yang dibutuhkan agar sistem dapat bekerja dengan baik adalah dengan membuat sebuah website untuk sistem informasi tersebut, sehingga informasi dapat di akses. Informasi yang dihasilkan dari sistem ini sebagai berikut: 1. Nomor dan Tanggal SPP 2. Nomor dan Tanggal SPM 3. Nomor dan Tanggal SP2D 4. Nomor dan Tanggal Advice yang sudah dikeluarkan oleh Perbendaharan 5. Status
31 3.2.2 Use Case Diagram Sistem Berjalan Lihat Expedisi Loket Perbendaharaan Catat Pengajuan SPM dan SP2D Lihat Informasi SPM dan SP2D SKPD Gambar 3.1 Use Case Sistem Berjalan Tabel 3.1 Skenario Use Case Sistem Berjalan Nama Use Case Lihat Ekpedisi Loket Perbendaharaan Actor Deskripsi Untuk melihat buku Expedisi Loket Perbendaharaan Skenario Staf istrasi mempunyai buku ekspedisi tentang data loket perbendaharaan. Jika ada skpd yang ingin menanyakan informasi SPM dan SP2D, barulah staf administrasi mencari informasi di buku data loket perbendaharaan. Mencatat segala pengajuan SPM dan SP2D dari SKPD terkait SKPD bisa menanyakan informasi SP2D datang langsung ke loket perbendaharaan Post Kondisi SKPD mendapatkan informasi yang dibutuhkan.
32 Tabel 3.2 Skenario Use Case Sistem Berjalan Nama Use Case Catat Pengajuan SPM dan SP2D Actor Deskripsi Untuk mencatat Pengajuan SPM dan SP2D Skenario Staf istrasi mempunyai buku ekspedisi tentang data loket perbendaharaan. Staff istrasi Mencatat segala pengajuan SPM dan SP2D dari SKPD terkait SKPD bisa menanyakan informasi SP2D bisa datang langsung ke loket perbendaharaan Post Kondisi SKPD mendapatkan informasi yang dibutuhkan. Tabel 3.3 Skenario Use Case Sistem Berjalan Nama Use Case Lihat Informasi SPM dan SP2D Actor SKPD Deskripsi Melihat Pengajuan SPM dan SP2D Skenario SKPD mendatangi loket perbendaraan untuk melihat pengajuan SPM dan SP2D SKPD menanyakan informasi SP2D datang langsung ke loket perbendaharaan Post Kondisi SKPD mendapatkan informasi yang dibutuhkan. 3.3. Perancangan Sistem Usulan Dalam perancangan website ini, penulis menggunakan metode UML. Perlu diketahui metode UML merupakan metode object oriented programming (OOP) yang menggunakan notasi grafis dalam menyatakan suatu desain. Pemodelan dengann UML menggambarkan yang ada dalam dunia nyata ke dalam bentuk yang dapat diapahami dengan notasi standar UML..
33 3.3.1 Use Case Diagram Sistem Usulan Mengelola Informasi SPM dan SP2D <<include>> Login Melihat Informasi SPM dan SP2D <<include>> SKPD Gambar 3.2 Use Case Sistem Usulan Tabel 3.4 Skenario Use Case Login Nama Use Case Login Actor, SKPD Deskripsi Untuk memasuki admin terlebih dahulu harus melakukan login Pra Kondisi - Skenario Jika admin ingin melakukan login maka mengisi username dan password Post Kondisi dapat melakukan aktifitas selanjutnya di dalam aplikasi utama setelah melakukan login Nama Use Case Actor Deskripsi Pra Kondisi Skenario Post Kondisi Tabel 3.5 Skenario Use Case Mengelola Informasi SPM dan SP2D Mengelola informasi SPM dan SP2D mengelola informasi SPM dan SP2D Melakukan login Untuk mengelola informasi SPM dan SP2D, admin melakukan login kemudian masuk ke halaman informasi SPM dan SP2D, dan bisa mengubah, menambah dan menghapus. Jika sudah selesai lalu simpan Informasi yang dikelola dapat dibaca oleh user untuk mendapatkan informasi terbaru
34 Tabel 3.6 Skenario Use Case Mencari Informasi SPM dan SP2D Nama Use Case Melihat informasi SPM dan SP2D Actor SKPD Deskripsi Untuk memasuki User terlebih dahulu harus melakukan login Pra Kondisi - Skenario Jika SKPD ingin mencari informasi SPM dan SP2D, maka SKPD harus klik pilihan SKPD dan masukan nomor SPM kemudian akan tampil informasi SPM dan SP2D yang terdiri dari : Nomor dan Tanggal SPM Post Kondisi Nomor dan Tanggal SPP Nomor dan Tanggal SP2D Nomor dan Tanggal Advice yang sudah dikeluarkan oleh Perbendaharan Status User mendapatkan informasi SPM dan SP2D 3.3.2 Activity Diagram Login () Sistem Mulai Buka situs Web Menampilkan Informasi SPM dan SP2D Masukan username dan pasword Mengecek username dan password Tidak Ya Tampil halaman admin Selesai Gambar 3.3 Activity Diagram Login ()
35 Tabel 3.7 Keterangan Activity Diagram Login () Nama Activity Activity Diagram Login () Deskripsi 1. Aktor membuka web informasi SPM dan SP2D 2. Masukan username dan password. Jika salah maka masukan kembali username dan password yang benar. 3. Jika benar maka aplikasi dapat dijalankan 3.3.2.1 Activity Diagram Infromasi SPM dan SP2D () Sistem Mulai Buka situs Web Tampil form Informasi SP2D dan SPM Masukan username dan password Mengecek username dan password Mengelola informasi SPM dan SP2D Tambah data Ubah data Hapus data Data tersimpan Selesai Gambar 3.4 Activity Diagram Informasi SPM dan SP2D ()
36 Tabel 3.8 Keterangan Activity Diagram Halaman Utama () Nama Activity Activity Diagram Halaman Utama () Deskripsi 1. admin memasuki halaman utama maka admin harus melakukan login dengan mengisi username dan password form login. 2. Apabila username dan password tidak valid dalam database maka akan kembali pada form login, jika username dan password valid maka selanjutnya administrator masuk pada halaman admin. 3. Pada halaman admin menampilkan beberapa form terdiri dari Pilih Dinas/SKPD,Masukan nomor SPM, tombol Search, Form nomor SPM,SPP,SP2D, Advice, status dan tanggal 4. Setelah login berhasil, dapat mengelola informasi SPM dan SP2D 5. dapat mengubah, menambah dan menghapus data tersebut. Jika selesai lalu simpan 3.3.2.6 Activity Diagram Halaman Utama (User) SKPD Sistem Mulai Buka situs Web Tampil hal. Informasi SPM dan SP2D Masukan username dan pasword Tampil Informasi SPM dan SP2D Selesai Gambar 3.5 Activity Diagram Halaman Utama (User)
37 Tabel 3.9 Keterangan Activity Diagram Halaman Utama (User) Nama Activity Activity Diagram Halaman Utama (User) Deskripsi 1. User membuka situs web Informasi SPM dan SP2D 2. Sistem akan menampilkan Halaman informasi SPM dan SP2D 3. User diberikan beberapa tampilan yaitu : a. Pilihan Dinas b. Masukan No SPM c. Tombol Search 4. Sistem akan menampilkan informasi SPM dan SP2D 3.3.3 Sequence Diagram 3.3.3.1 Sequence Diagram Halaman Utama () Cek Login Halaman Utama Hal. Pencarian Hal. Informasi Lakukan Login Login berhasil Login gagal Keluar Gambar 3.6 Sequence Diagram Halaman Utama ()
38 Tabel 3.10 Keterangan Sequence Diagram Halaman Utama () Nama Sequence Sequence Diagram Halaman Utama Deskrip Singkat Menjelaskan tampilan halaman utama Aktor Pra Kondisi Membuka website Tindakan Utama memasukan username dan password untuk masuk kedalam sistem, admin dapat mengelola dari masing-masing tab tersebut. Tindakan Alternatif - Pasca Kondisi Bila berhasil admin masuk kedalam sistem. Bila gagal admin diminta untuk kembali memasukan username dan password. 3.3.3.2 Sequence Diagram Halaman Pencarian () Halaman Utama Hal. Pencarian Database Login berhasil Buka Input data Simpan Cari dan ubah data Simpan Cari dan hapus data Simpan Gambar 3.7 Sequence Diagram Halama Pencarian ()
39 Tabel 3.11 Keterangan Sequence Diagram Halaman Pencarian () Nama Sequence Deskrip Singkat Aktor Pra Kondisi Tindakan Utama Sequence Diagram Halaman Pencarian Menjelaskan tampilan Halaman Pencarian Membuka website memasukan username dan password, lalu Tindakan Alternatif - memilih tab halaman pencairan dan update data SP2D dan SPM Pasca Kondisi Jika update data sukses dijalankan, data yang ada pada website akan berubah dan akan tersimpan ke dalam database sistem. 3.3.3.3 Sequence Diagram Halaman Utama (User) Cek Login Halaman Utama Hal. Pencarian Hal. Informasi User Lakukan Login Login berhasil Mengisi Nomor SPM Kembali ke Hal. Pencarian Login gagal Keluar Gambar 3.8 Sequence Diagram Halaman Utama (User)
40 Tabel 3.12 Keterangan Sequence Diagram Halaman Utama (User) Nama Sequence Deskrip Singkat Sequence Diagram Halaman Utama Tampilan utama pada halaman web sistem informasi SP2D dan SPM Aktor Pra Kondisi User User menggunakan browser internet untuk memasuki halaman website SP2D dan SPM Tindakan Utama Di dalam halaman tersebut user dapat memasukan nomor SPM yang akan dicari dan dapat kembali melakukan pencarian informasi SP2D yang dimaksud Tindakan Alternatif - Pasca Kondisi - 3.3.4 Class Diagram tbl_dinas -kd_dinas -nm_dinas -keterangan * tbl_login -id_user -password -group -falg_blokir +add() +edit() +delete() +get() 1 * +add() +edit() +delete() +get() 1 tbl_info -kd_dinas -no_spm -tgl_spm -no_spp -tgl_spp -no_sp2d -tgl_sp2d -no_advice -status -password -group -falg_blokir +add() +edit() +delete() +get() Gambar 3.9 Class Diagram
41 3.3.5 Perancangan Database 1. Nama Tabel : Login Tabel 3.13 Tabel Login No Nama Field Tipe Data Panjang Keterangan 1 user_id* Varchar 4 Primary key 2 username Varchar 15 3 password Varchar 32 4 role Varchar 15 5 Created_date Date 2. Nama Tabel : Dinas Tabel 3.14 Tabel dinas No Nama Field Tipe Data Panjang Keterangan 1 kd_dinas* Varchar 7 Primary key 2 nm_dinas Varchar 60 3 keterangan Varchar 50 3. Nama Tabel : Info Tabel 3.15 Tabel Info No Nama Field Tipe Data Panjang Keterangan 1 kd_dinas* Varchar 7 Primary key 2 no_spm* Varchar 10 Primary key 3 tgl_spm Date 4 no_spp Varchar 10 5 tgl_spp Date 6 no_sp2d Varchar 10 7 tgl_sp2d Date 8 no_advice Varchar 10 9 tgl_advice Date 10 status Varchar 10
42 3.4 Perancangan Layar 3.4.1 Rancangan Layar Login Gambar 3.10 Tampilan Layar Login 3.4.2 Rancangan Layar Halaman Pencarian dan User LOGO WEBSITE RUNNING TEXT WEBSITE NAME PILIH SKPD NOMOR SPM CARI Gambar 3.11 Tampilan Layar Halaman Utama dan User
43 3.4.4 Rancangan Layar Informasi LOGO WEBSITE RUNNING TEXT WEBSITE NAME PILIH DINAS MASUKAN NO.SPM CARI NO.SPM NO.SPP NO.SP2D NO.ADVICE TGL TGL TGL TGL STATUS Gambar 3.12 Tampilan Layar Informasi