42
BAB IV IMPLEMENTASI SISTEM
Pada bab IV ini akan dibahas hasil pembuatan aplikasi Sistem Informasi Pembayaran Siswa Berbasis CakePHP
4.1. Kebutuhan Sistem
Ada beberapa hal dalam membangun aplikasi yang harus diperhatikan sebelum akhirnya sampai pada langkah menjalankan program atau aplikasi, antara
lain perangkat keras hardware, perangkat lunak software serta bagaimana akhirnya aplikasi dapat sampai ke tangan user pemakai.
Sistem Informasi Pembayaran Siswa Berbasis CakePHP, ini ditulis dengan bahasa Pemograman CakePHP dan membutuhkan web server serta database
server dalam proses implementasinya. Adapun web server yang digunakan dalam Tugas Akhir ini adalah XAMPP Server dan database servernya adalah MYSQL.
4.2. Imlementasi Sistem
Seperti yang telah disinggung pada bagian Kebutuhan Sistem di atas, sistem yang dibangun ini terdiri atas dua unsur utama, GUI Graphical User
Interface dan basis data. GUI direpresentasikan oleh website, sedangkan data
yang disajikan berasal dari database. Karena itu, uraian pada bagian Implementasi Sistem ini akan dibagi berdasarkan kedua unsur tersebut dengan
tujuan agar proses implementasi sistemnya lebih mudah untuk dimengerti.
4.2.1. Halaman Utama Sistem Informasi Pembayaran
Tampilan halaman utama atau halaman login untuk Sistem Informasi
Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.
Pembayaran Siswa Sekolah Dasar Hang Tuah 10 Kab.Sidoarjo http:localhostpembayaranuserslogin
seperti gambar dibawah ini.
Gambar 4.1. Halaman Utama Atau Login Sistem Pembayaran Siswa
Link pada bagian Menu ditampilkan dengan menggunakan sintaks HTML biasa. Hal ini dikarenakan link yang ada di Halaman Utama ini bersifat statis, sedangkan
potongan skript yang digunakan untuk menampilkan halaman Login tampak seperti dibawah ini.
table align=center width=355 h2centerfont
face=tahomaAplikasi Sistem
Informasi Pembayaran SPP Siswafontcenterh2 ?php echo html-imagelogin.png, arrayalign
=left; ? script diatas untuk membuat tabel dengan ukuran 355 px dengan
posisi tabel ditengah, login.png untuk menampilkan gambar yang ada dihalaman login
Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.
table tr
td font face=tahoma size=2 Username fonttd td : td td ?php echo form-inputusername; ? td
tr tr
td font face=tahoma size=2 Password fonttd td : td td ?php echo form-passwordpassword; ? td
tr tr
td ?php echo form-endLogin; ? td tr
table script untuk membuat sebuah tabel username, password dan tombol
Login, tampilannya tampak seperti gambar 4.2 dibawah ini
Gambar 4.2. Form Login Sistem Pembayaran Siswa
Setelah seorang admin menginputkan user name dan password kemudian dilanjutkan dengan klik tombol Login, kemudian sistem akan mengecek user
name dan password apakah memeliki hak akses atau tidak script yang digunakan untuk mefilter user name dan password tampak seperti dibawah ini.
Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.
?php class UsersController extends AppController {
var name = Users; Function index {
this-redirectuserslogin; }
function beforeFilter { this-__validateLoginStatus;
} function login {
this-layout = login; if emptythis-data == false {
if user
= this-User-validateLoginthis-
data[User] == true { this-Session-writeUser,
user; this-Session-setFlash
You Login Success
; this-
redirect userslogin;
jika seorang admin memasukan user name dengan benar maka dia akan dibawah kedalam halaman menu admin
You Login Success , jika
sebaliknya maka dia redirect
kehalaman login atau halaman utama.
Setelah berhasil login maka sistem akan membawa seorang user atau admin kehalaman menu Administrator, tampilan halaman menu Administrator
tampak seperti gambar 4.3
Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.
Gambar 4.3. Halaman Menu Administrator
Dari halaman menu administartor yang terlihat pada gambar 4.8 dari halaman
inilah sebuah Sistem Pembayaran Siswa akan dikelola oleh seorang admin, untuk
manajeman siswa, halaman menu manajemen siswa tampak seperti gambar dibawah ini.
Gambar 4.3. Halaman Menu Manajemen Siswa
Dari tampilan halaman menu berita, seorang admin bisa melakukan penambahan siswa berdasarkan kelas masing-masing sesuai dengan data atau banyaknya siswa
dan kelas yang ada disekolah bersangkutan tersebut.
Script yang digunakan untuk menampilkan seperti pada Gambar 4.3. Halaman Menu Manajemen Siswa
sebagai berikut.
h4?php echo form-Html-link__Tambah Siswa, true, add;
Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.
?h4 ?php echo form-createStudent, arrayurl = arrayaction
= siswa, inputDefaults = arraylabel = false, div = false; ?
table tr valign=top
td div id=tahoma Kelas div td td div id=tahoma : div td
td ?php echo form-inputkel; ? ?php echo form- endGo; ?td
tr table
Link Tambah Siswa merupakan link yang akan menghubungkan ke hamalan siswa tampak seperti gambar 4.4
Gambar 4.4. Halaman Tambah Siswa
Untuk melakukan manajemen kelas, seorang admin bisa mengklik manajemen kelas dan bentuk tampilannya seperti gambar dibawah ini.
Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.
Gambar 4.5. Halaman Tambah Kelas
Script yang digunakan untuk menampilkan halaman tambah kelas hampir sama
dengan script yang digunakan untuk menampilkan tambah siswa, dari menu manajemen kelas ini seorang admin dapat melakukan 2 aksi yaitu ubah kelas dan
hapus kelas. Untuk malakukan manajemen pambayaran siswa, seorang admin bisa
menggunakan fasilitas menu manajemen Transaksi Pembayaran, untuk tampilan menu tersebut tampak seperti pada gambar 4.6. halaman menu transaksi siswa.
Dari menu tersebut seorang admin bisa mengelola transaksi pembayaran siswa, dengan sistem ini pihak sekolah bisa merasa terbantu karena transaksi bisa
dilakukan berdasarkan kelas atau bisa secara personal masing-masing siswa.
Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.
Gambar 4.6. Halaman Transaksi Pembayaran
Script yang digunakan untuk menampilkan seperti pada Gambar 4.6. Halaman Menu Transaksi Pembayaran
sebagai berikut.
h4?php echo form-Html-link__Back, true, ..payments; ?h4
?php echo this-elementfungsi_indotgl;
tanggal = dateY-m-d; tgl = tgl_indotanggal;
? table width=100
tr tdh4 font face=tahoma
Transaksi Pembayaran fonth4td
td align=right div id=tahoma ?php echo tgl; ? div td
tr
Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.
table script ini berfungsi untuk membuat
table menu serta memberikan
judul menu
?php echo form-createPayment, arrayurl = arrayaction = pay, inputDefaults = arraydiv =
false, label = false; ? table width=100
tr td valign=top width=50
table tr
td div id=tahoma BulanTahun
div td td div id=tahoma : divtd
td ?php
options = array 01 = Januari,
echo form-selectbulan, options, 01; ? td
script ini berungsi untuk mencatat waktu,tanggal dan tahun
saat transaksi pembayaran dilakukan.
Menggunakan menu laporan pembayaran, setiap transaksi yang dilakukan pastinya akan dilaporkan kepada atasannya, untuk menggunkan fitur tersebut
seorang admin bisa memilih menu laporan pembayaran pada halaman menu administrator, adapun langkah-langkah yang digunakan untuk melihat laporan
pembayaran sebagai berikut :
Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.
1. Seorang admin diminta untuk memilih bulan, ini dimaksudkan agar data
yang ditampilkan sesuai bulan yang dipilih. 2.
Selanjutnya admin juga diharuskan menginputkan tahun, ini bertujuan untuk memperdetail dari transaksi pembayaran yang dilakukan.
3. Yang berikutnya adalah memilih kelas, ini bertujuan agar data yang
ditampilkan berdasarkan kelas dan nama siswa, untuk lebih jelasnya ada pada gambar 4.7 dibawah ini.
Gambar 4.7. Laporan Transaksi Pembayaran
Dari menu laporan transaksi pembayaran seorang admin akan memperoleh hasil laporan pembayaran seperti pada gambar dibawah ini.
Gambar 4.8. Laporan Transaksi Pembayaran Dengan Id Siswa 051
Dengan memasukan Id Siswa disetakan dengan bulan dan tahun, seorang admin
Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.
bisa mengetahui transaksi pembayaran satiap siswa.
Script yang digunakan untuk menampilkan Laporan Transaksi Pembayaran Dengan Id Siswa 051
pada gambar 4.8 sebagai berikut:
table border=0 cellpadding=0 cellspacing=0 width=850 align=center
tr td width=220 height=70 align=center ?php echo
html-imageas.jpg, arrayheight = 80; ?td td align=center valign=top h4font face=tahoma
SD Hang Tuah br JL. TANGKUBAN PERAHU NO. 5 TELP : 8667208 br
SEDATI - SIDOARJO . 61353 . Abr LAPORAN PEMBAYARAN SISWAfonth4td
tr table
table border=0 cellpadding=0 cellspacing=0 width=850 align=center
tr td width=40 font face=tahoma size=2 Bulan
fonttd td width=5 font face=tahoma size=2 : font td
td font face=tahoma size=2 ?php echo bln; ?fonttd
tr tr
Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.
td font face=tahoma size=2 Tahun font td td font face=tahoma size=2 : fonttd
td font face=tahoma size=2 ?php echo tahun; ?font td
tr table
table border=1 cellpadding=0 cellspacing=0 width=850 align=center
tr valign=top th font face=tahoma size=2 No fonttd
th font face=tahoma size=2 Id Siswa font th th width=130 font face=tahoma size=2 Nama font th
th font face=tahoma size=2 SPP font th th font face=tahoma size=2 Komite fontth
th font face=tahoma size=2 Evaluasi fontth th font face=tahoma size=2 Komputer fontth
th font face=tahoma size=2 Kegiatan fontth th font face=tahoma size=2 Lain-lain fontth
th font face=tahoma size=2 Total fontth script ini berfungsi untuk membuat tampilan atau layout laporan
pembayaran siswa
Selain menu Laporan Transaksi Pembayaran Dengan Siswa, seorang admin juga
bisa mengetahui informasi pembayaran siswa, informasi pembayaran ini hanya menampilkan informasi pembayaran siswa secara personal atau sesuai dengan id
siswa dengan menampilkan informasi berdasarkan tanggal dan tahun serta rincian pembayaran, untuk lebih jelasnya tampak seperti gambar dibawah ini.
Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.
Gambar 4.9. Informasi Pembayaran Siswa
Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.
55
BAB V PENGUJIAN SISTEM