55
BAB IV IMPLEMENTASI SISTEM
Pada bab ini akan dijelaskan lebih lanjut mengenai implementasi dari perancangan “Sistem Informasi Perpustakaan LSM YIS Berbasis Web” yang telah
dibuat pada analisa dan perancangan sistem.
4.1. Karakteristik Sistem
Sistem yang dikembangkan merupakan sistem berbasis web dengan dua tampilan yaitu untuk pengguna dan administrator. Data yang terdapat pada
sistem akan disimpan dalam database “yis_perpus”. Dalam tahapan implementasi, sistem akan menggunakan frameworkCodeIgniter
yang menggunakan sistem model dan controller, hal ini bertujuan untuk keamanan
web, pengerjaan implementasi lebih ringkas bila masing-masing fungsi dikelompokkan sendiri-sendiri, dan dapat berjalan dengan baik pada browser
apapun. Adapun data yang dimasukkan kedalam s istem ini menggunakan
contoh data fiktif yang dikumpulkan oleh penulis kecuali data kategori, dan buku.
4.2. Perangkat Kebutuhan Sistem 4.2.1.
Perangkat Keras hardware
Spesifikasi perangkat keras yang digunakan adalah:
Processor AMD Turion 64 X2 2.0 Ghz atau setaranya
Memory 2 Gb
Harddisk 80 Gb
Ethernet
Monitor resolusi 1024 x 768
Keyboard dan Mouse
4.2.2. Perangkat Lunak
software
Spesifikasi perangkat lunak yang digunakan adalah:
Sistem Operasi Microsoft Windows XP service pack 2
Xamp 1.8.1
phpMyAdmin
3.5.2.2
MySQ L
5.5
SQLyog 7.2
PHP
Netbeans 6.9
Mozilla Firefox
4.3. Implementasi Database
Langkah pertama yang harus dilakukan dalam bab ini adalah membuat database. Software
yang digunakan dalam pembuatan database sistem ini adalah SQLyogver 7.2.
Dalam sistem ini terdapat 12 tabel yang dibuat sesuai dengan rancangan sistem.Tabel-tabel tersebut adalah sebagai berikut:
Gambar 4.1 Database yis_perpus
1. Tabel anggota, dibuat dengan syntax SQL
DROP TABLE IF EXISTS `anggota`;
CREATE TABLE `anggota` `id_anggota` int10 NOT NULL AUTO_INCREMENT,
`nama` varchar100 DEFAULT NULL, `id_jabatan` int10 DEFAULT NULL,
`tempat_lahir` varchar40 DEFAULT NULL, `tgl_lahir` date DEFAULT NULL,
`alamat` varchar200 DEFAULT NULL, `kelamin` enumL,P DEFAULT L,
`telepon` int10 DEFAULT NULL, `bacaan_fav` varchar40 DEFAULT NULL,
`username` varchar40 DEFAULT NULL, `password` varchar20 DEFAULT NULL,
PRIMARY KEY `id_anggota` ENGINE=InnoDB AUTO_INCREMENT DEFAULT CHARSET=latin1
CHECKSUM=1 DELAY_KEY_WRITE=1 ROW_FORMAT=DYNAMIC;
2. Tabel buku, dibuat dengan syntax SQL
CREATE TABLE `buku` `kode_buku` varchar40 NOT NULL,
`judul` varchar200 DEFAULT NULL, `id_penerbit` int10 DEFAULT NULL,
`id_subkat` int10 DEFAULT NULL, `kolasi` text,
`rak` varchar40 DEFAULT NULL, `jml_eksemplar` int10 DEFAULT NULL,
`tahun` year4 DEFAULT NULL, `ISBN` varchar40 DEFAULT NULL,
`harga_buku` double10,2 DEFAULT NULL, `tgl_input` date DEFAULT NULL,
`keterangan` date DEFAULT NULL, PRIMARY KEY `kode_buku`
ENGINE=InnoDB DEFAULT CHARSET=latin1 CHECKSUM=1 DELAY_KEY_WRITE=1 ROW_FORMAT=DYNAMIC;
3. Tabel copy_buku, dibuat dengan syntax SQL
CREATE TABLE `copy_buku` `id_copybuku` varchar40 DEFAULT NULL,
`kode_buku` varchar40 DEFAULT NULL, `status` enumAda,Keluar DEFAULT Ada
ENGINE=InnoDB DEFAULT CHARSET=latin1 CHECKSUM=1 DELAY_KEY_WRITE=1 ROW_FORMAT=DYNAMIC;
4. Tabel detail_peminjam, dibuat dengan syntax SQL
CREATE TABLE `detail_peminjam` `id_detpeminjam` int10 NOT NULL AUTO_INCREMENT,
`id_pinjam` int10 DEFAULT NULL, `id_copybuku` varchar40 DEFAULT NULL,
` kode_buku ` varchar40 DEFAULT NULL, PRIMARY KEY `id_detpeminjam`
ENGINE=InnoDB AUTO_INCREMENT DEFAULT CHARSET=latin1 CHECKSUM=1 DELAY_KEY_WRITE=1 ROW_FORMAT=DYNAMIC
5. Tabel detail_pengarang, dibuat dengan syntax SQL
CREATE TABLE `detail_pengarang`
`id_pengarang` int10 NOT NULL, `kode_buku` varchar40 NOT NULL
ENGINE=InnoDB DEFAULT CHARSET=latin1;
6. Tabel jabatan, dibuat dengan syntax SQL
CREATE TABLE `jabatan` `id_jabatan` int10 NOT NULL AUTO_INCREMENT,
`nama_jabatan` varchar40 DEFAULT NULL, PRIMARY KEY `id_jabatan`
ENGINE=InnoDB AUTO_INCREMENT DEFAULT CHARSET=latin1 CHECKSUM=1 DELAY_KEY_WRITE=1 ROW_FORMAT=DYNAMIC;
7. Tabel kategori_buku, dibuat dengan syntax SQL
CREATE TABLE `kategori_buku` `id_kategori` int10 NOT NULL AUTO_INCREMENT,
`kode_kategori` varchar10 DEFAULT NULL, `nama_kategori` varchar40 DEFAULT NULL,
PRIMARY KEY `id_kategori` ENGINE=InnoDB AUTO_INCREMENT DEFAULT CHARSET=latin1
CHECKSUM=1 DELAY_KEY_WRITE=1 ROW_FORMAT=DYNAMIC;
8. Tabel peminjaman, dibuat dengan syntax SQL
CREATE TABLE `peminjaman` `id_pinjam` int10 NOT NULL AUTO_INCREMENT,
`id_anggota` int10 DEFAULT NULL, `tgl_pinjam` date DEFAULT NULL,
`tgl_jatuhtempo` date DEFAULT NULL, `tgl_kembali` date DEFAULT NULL,
`denda` int10 DEFAULT NULL, `statuspinjam` enumpinjam,kembali DEFAULT
pinjam, PRIMARY KEY `id_pinjam`
ENGINE=InnoDB AUTO_INCREMENT DEFAULT CHARSET=latin1 CHECKSUM=1 DELAY_KEY_WRITE=1 ROW_FORMAT=DYNAMIC;
9. Tabel penerbit, dibuat dengan syntax SQL
CREATE TABLE `penerbit` `id_penerbit` int10 NOT NULL AUTO_INCREMENT,
`nama_penerbit` varchar50 DEFAULT NULL, PRIMARY KEY `id_penerbit`
ENGINE=InnoDB AUTO_INCREMENT DEFAULT CHARSET=latin1 CHECKSUM=1 DELAY_KEY_WRITE=1 ROW_FORMAT=DYNAMIC;
10. Tabel pengarang, dibuat dengan syntax SQL
CREATE TABLE `pengarang` `id_pengarang` int10 NOT NULL AUTO_INCREMENT,
`nama_pengarang` varchar50 DEFAULT NULL, PRIMARY KEY `id_pengarang`
ENGINE=InnoDB AUTO_INCREMENT DEFAULT CHARSET=latin1 CHECKSUM=1 DELAY_KEY_WRITE=1 ROW_FORMAT=DYNAMIC;
11. Tabel sub_kategori, dibuat dengan syntax SQL
CREATE TABLE `sub_kategori` `id_subkat` int10 NOT NULL AUTO_INCREMENT,
`id_kategori` int10 DEFAULT NULL, `kode_sub_kategori` varchar10 DEFAULT NULL,
`nama_sub_kategori` varchar20 DEFAULT NULL, PRIMARY KEY `id_subkat`
ENGINE=InnoDB AUTO_INCREMENT DEFAULT CHARSET=latin1;
12. Tabel usulan_buku, dibuat dengan syntax SQL
CREATE TABLE `usulan_buku` `id_usulan` int10 NOT NULL AUTO_INCREMENT,
`nama_pengusul` varchar40 DEFAULT NULL,
`judul_buku` varchar200 DEFAULT NULL, `penerbit` varchar40 DEFAULT NULL,
`pengarang` varchar50 DEFAULT NULL, `keterangan` text,
`tanggalusul` date DEFAULT NULL, PRIMARY KEY `id_usulan`
ENGINE=MyISAM AUTO_INCREMENT DEFAULT CHARSET=latin1;
4.4. Implementasi Antarmuka
Antarmukauser interface merupakan tampilan dari sistem yang nantinya akan berinteraksi langsung dengan pengguna user.
4.4.1. Halaman Pengguna
4.4.1.1. Halaman Utama Pengguna
Gambar 4.2Halaman Utama Pengguna
Gambar diatas adalah antarmuka halaman utama pengguna yang menampilkan data buku yang telah terekam pada database.Data yang
ditampilkan berupa judul buku, sub kategori buku, penerbit, pengarang, letak rak buku, jumlah buku, buku yang keluar, dan stok buku yang ada
pada saat itu.Pada halaman ini pengguna juga langsung bisa melakukan pencarian data buku yang diinginkan dengan memasukkan kata kunci
berdasarkan pilihan pencarian yang telah dipilih. Halaman ini adalah
halaman utama pengguna Pada halaman pengguna juga terdapat menu usulan buku.
Misalkan pengguna ingin mencari data buku berdasarkan judul buku, maka pengguna memilih pencarian berdasarkan “Judul Buku”,
kemudian mengetikkan kata kunci “Game” maka hasil yang akan muncul adalah sebagai berikut:
Gambar 4.3Halaman Hasil Pencarian Buku
4.4.1.2. Halaman Usulan Buku
Gambar 4.4Halaman Usulan Buku
Halaman ini adalah halaman usulan buku pengguna, dimana siapapun pengguna yang mengakses Sistem Informasi ini dapat
mengusulkan buku
kepada administrator.
Didalamnya terdapat
form masukkan seperti nama pengusul, judul buku, penerbit, pengarang
dan keterangan mengenai buku yang akan diusulkan.
4.4.1.3. Halaman Login
Gambar 4.5Halaman Login
Halaman login ini akan muncul jika pengguna memilih menu login, fungsi dari halaman ini yaitu untuk login administrator.Administrator
harus memasukkan username dan password untuk kemudian di validasi sistem lalu diteruskan kehalaman yang berkaitan dengan administrator.
Berikut penggalan syntaxvalidasi login dari sistem
function setFormgetlogin { this-load-helperform;
xBuff = ; xBuff.=div id=loginh4Form Loginh4;
xBuff .=label
for=edUser style=margin-left:
150px; User Namelabel .
form_inputedUser, , 100 id=edUser . div class=cleardiv;
xBuff .=label for=edPassword style=margin-left: 150px;Passwordlabel .
form_passwordedPassword, ,
100 id=edPassword . div class=cleardiv
; xBuff.=
form_buttonbtLogin, login,
onclick=dologin; style=margin-left:
250px; width:150px;;
xBuff.= div; return xBuff;
} function dologin {
this-load-helperjson; edUser = _POST[edUser];
edPassword = _POST[edPassword]; this-load-modelmodelanggota;
rowuser = this-modelanggota-getDataLoginedUser, edPassword;
this-json_data[data] = false; if emptyrowuser {
this-session-set_userdatauser, rowuser-
username; this-session-set_userdataidpegawai,
rowuser-id_anggota; this-session-set_userdatanama,
rowuser- nama;
this-json_data[data] = true; ifrowuser-id_anggota = 1{
this-json_data[location] =
site_url .
pemesananuser; }else
this-json_data[location] =
site_url .
home; }
echo json_encodethis-json_data; }
Listing Program 4.1 Controllerhome.php
function getDataLoginxUser, xPassword { xStr = SELECT FROM anggota
WHERE username = . addslashesxUser . and password =
.addslashesxPassword . ; query = this-db-queryxStr;
row = query-row; return row;
}
Listing Program 4.2 Modelhome.php
function dologin{ document.readyfunction{
.ajax{ url: getBaseURL+index.phphomedologin,
data: edUser=+edUser.val+edPassword=+edPassword.
val, cache: false,
dataType: json, type: POST,
success: functionjson{ alert json.location;
ifjson.data{ document.location = json.location;
}else {
alertLogin Anda Salah Silahkan di ulangi; }
}, error: function xmlHttpRequest, textStatus, errorThrown {
start = xmlHttpRequest.responseText.searchtitle + 7; end = xmlHttpRequest.responseText.searchtitle;
errorMsg = ;
if start 0 end 0
alertRangerti +errorMsg +xmlHttpRequest.responseText+ [ + xmlHttpRequest.responseText.substringstart, end +
]; else
alertError juga +errorMsg+xmlHttpRequest.responseText; }
}; };
}
Listing Program 4.3 Ajax home.js
4.4.2. Halaman Administrator
4.4.2.1. Halaman Utama Administrator
Gambar 4.6Halaman Utama Administrator
Gambar diatas ini adalah halaman utama administrator yang akan muncul setelah login sebagai administrator. Pada halaman ini terdapat 3
menu utama yaitu Kelola Anggota, Kelola Buku, dan Logout.Pada menu Kelola Anggota terdapat 2 Sub Menu yaitu Setting Jabatan dan
Setting Anggota. Didalam menu Kelola Buku terdapat 6 Sub Menu
yaitu Sirkulasi Buku, Setting Buku, Cetak Peminjaman Buku, Cetak data buku, Setting Subkategori buku, dan Data usulan buku. Sedangkan
menu Logout berfungsi keluar dari halaman administrator menju halaman utama pengguna
4.4.2.2. Halaman Setting Jabatan
Gambar 4.7Halaman Setting Jabatan
Halaman ini adalah SubMenu dari Kelola Anggota. Pada tampilan menu, admin sudah bisa melihat jabatan apa saja yang sudah
dimasukkan pada database. Pada halaman ini administrator dapat melakukan beberapa aksi pada halaman ini yaitu, menyimpan data
jabatan baru,
mengubah data
jabatan, dan
menghapus data
jabatan.Berikut adalah penggalan syntax untuk menampilkan data jabatanyang telah terekam.
function getListJabatanxstart, search { xend = 30;
this-load-modelmodeljabatan; this-load-helpertable;
this-load-helperform; no = 1;
xquery = this-modeljabatan-getListjabatanxstart, xend, search;
xbuf =
tbaddrowtbaddcellNo, padding:10px;
width:15, . tbaddcellNama Jabatan, padding:10px; width:70, .
tbaddcellEdit Hapus,
padding:10px; width:5,
, ,
true; foreach xquery-resultas row {
btnedit =
img src=
. base_url
. resourcecssimagesedit.jpg
alt=Edit Data
onclick =
doeditjabatan\ .
row-id_jabatan .
\; style=border:none;width:20px; cursor:pointer;;
xbtndelete =
img src=
. base_url
. resourcecssimagesdelete.png
alt=Hapus Data
onclick =
dodeletejabatan\ .
row-id_jabatan .
\,\ .
substrrow-nama_jabatan, 0,
20 .
\; style=border:none;width:20px;cursor:pointer;;
xbuf.=tbaddrowtbaddcellno++ . tbaddcellrow-nama_jabatan .
tbaddcellbtnedit . . xbtndelete; }
xbuf .=
tbaddrowtbaddcell ,
, width=10
height=35 colspan=2 . tbaddcellnbspnbsp,
, width=50
height=35 colspan
=1, , TRUE; xbuf = tablegridxbuf;
return div
id=tabledata name
=tabledata class=tc1
style=width:100;left:-25px; . xbuf . div; }
Listing Program 4.4 Controller SettingJabatan.php
function getListjabatanxAwal, xLimit, xSearch = { if emptyxSearch {
xSearch = Where nama_jabatan like . xSearch .
; }
xStr =
SELECT FROM
jabatan xSearch
order by
id_jabatan DESC limit . xAwal . , . xLimit; query = this-db-queryxStr;
return query; }
Listing Program 4.5 ModelJabatan.php
4.4.2.3. Halaman Setting Anggota
Gambar 4.8Halaman Setting Anggota
Halaman ini adalah SubMenu dari Kelola Anggota.Pada tampilan menu, admin sudah bisa melihat siapa saja anggota yang sudah terekam
pada database.Pada halaman ini administrator dapat melakukan beberapa aksi pada halaman ini yaitu, menyimpan data anggota baru,
mengubah data anggota, menghapus data anggota dan mencari anggota berdasarkan
namanya. Berikut
adalah penggalan
syntax untuk
menyimpan data anggota beserta hasilnya
function setFormAnggota { this-load-helperform;
this-load-modelmodeljabatan; xBuff = ;
xBuff.=div id=primary
style=width:977px; margin:0px; h3
style= text-align: left; color: 993300;
margin-left:20px;Tambah Anggotah3div
class=cleardiv; xBuff
.= input
type=hidden name=id_anggota
id=id_anggota value=0 input; xBuff.=label for=ednamaanggota style=margin-left:
30px; padding-right:50px;
color: 993300;
font- size:14px;Nama Anggotalabel . form_inputednamaanggota,
, id=ednamaanggota
style=width:200px; .
div class=cleardiv;
xBuff.=label for=jns_kelamin
style=margin-left: 30px;padding-right:38px;
color: 993300;
font- size:14px;Jenis
Kelaminlabel .
form_dropdownjns_kelamin, this-getJenisKelamin,
, id=jns_kelamin
style=width:160px; margin-left:20px;
. div class=cleardiv;
xBuff.=label for=tmpt_lhr
style=margin-left: 30px;
padding-right:59px; color:
993300; font-
size:14px;Tempat Lahirlabel
. form_inputtmpt_lhr,
, id=tmpt_lhr
style=width:200px; .
div class=cleardiv;
xBuff.=label for=tgl_lahir
style=margin-left: 30px;
padding-right:57px; color:
993300; font-
size:14px;Tanggal Lahirlabel
. form_inputtgl_lahir,
, id=tgl_lahir
style=width:200px; .
div class=cleardiv;
xBuff.=label for=ednamajabatan style=margin-left: 30px;padding-right:72px;
color: 993300;
font- size:14px;jabatan
label .
form_dropdownednamajabatan, this-modeljabatan-getArrayjabatan, , id=ednamajabatan
style=width:160px; margin-left:20px;
. div
class=cleardiv; xBuff.=label
for=tlp style=margin-left:
30px; padding-right:89px;
color: 993300;
font- size:14px;Teleponlabel
. form_inputtelepon,
, id=tlp style=width:200px; . div class=cleardiv;
xBuff.=label for=alamat
style=margin-left: 30px;padding-right:94px;
color: 993300;
font- size:14px;Alamatlabel
. form_inputalamat,
, id=alamat
style=width:200px; .
div class=cleardiv;
xBuff.=label for=bacaan
style=margin-left: 30px;padding-right:50px;
color: 993300;
font- size:14px;Bacaan
Favoritlabel .
form_inputbacaan, ,
id=bacaan style=width:200px;
. div
class=cleardiv; xBuff.=label
for=username style=margin-left:
30px;padding-right:78px; color:
993300; font-
size:14px;Usernamelabel .
form_inputusername, ,
id=username style=width:200px;
. div
class=cleardiv; xBuff.=label
for=password style=margin-left:
30px;padding-right:78px; color:
993300; font-
size:14px;Passwordlabel .
form_inputpassword, ,
id=password style=width:200px;
. div
class=cleardiv; xBuff.=
form_buttonbtnsimpan, Simpan,
onclick=dosave; style=margin-left:
25px; width:150px;cursor:pointer; . form_buttonbtnbaru, Baru,
onclick=doclear; style=margin-left:
25px; width:150px;cursor:pointer;;
xBuff.=div class=cleardiv; xBuff.=this-getListAnggota0, ;
xBuff.=div; return xBuff;
} function save {
this-load-modelmodelanggota; this-load-modelmodeluser;
this-load-modelmodeljabatan; this-load-helperjson;
idanggota = this-session-userdataidpegawai; if empty_POST[id_anggota] {
xidanggota = _POST[id_anggota]; } else {
xidanggota = 0; }
if emptyidanggota { ednamaanggota = _POST[ednamaanggota];
jns_kelamin = _POST[jns_kelamin]; tmpt_lhr = _POST[tmpt_lhr];
tgl_lahir = _POST[tgl_lahir]; ednamajabatan = _POST[ednamajabatan];
tlp = _POST[tlp]; alamat = _POST[alamat];
bacaanfav = _POST[bacaan]; username = _POST[username];
password = _POST[password];
if empty_POST[ednamaanggota]empty_POST[tmpt_lhr]
empty_POST[tlp]empty_POST[alamat]empty_POST[ username]empty_POST[password] {
if xidanggota = 0 { this-json_data[data] = true;
this-modelanggota- setUpdateAnggotaxidanggota,
ednamaanggota, ednamajabatan,
tmpt_lhr, tgl_lahir, alamat, jns_kelamin, tlp, bacaanfav, username, password;
} else { this-json_data[data] = true;
this-modelanggota- setInsertanggotaxidanggota,
ednamaanggota, jns_kelamin,
tmpt_lhr, tgl_lahir,
ednamajabatan, tlp,
alamat, bacaanfav, username, password;
lastidanggota =
this-modelanggota- getLastanggota-id_anggota;
if ednamajabatan = 1 { this-modeluser-setInsertUser,
9, lastidanggota; }
} }else{
this-json_data[data] = false; }
} echo json_encodethis-json_data;
}
Listing Program 4.6 Controller anggota.php
function setInsertAnggotaid_anggota,
nama, id_bagian,
Tempat_lahir, Tgl_lahir,
Alamat, kelamin,
telepon, bacaan_fav, username, password {
xStr = Insert into anggota . id_anggota, .
nama, . kelamin, .
Tempat_lahir, . Tgl_lahir, .
id_bagian, . telepon, .
alamat, . bacaan_fav, .
username, . password values . id_anggota . , .
nama . , . id_bagian . , . Tempat_lahir . , . Tgl_lahir
. ,
. Alamat
. ,
. kelamin
. ,
. telepon . , . bacaan_fav . , . username . , .
password . ; query = this-db-queryxStr;
return id_anggota; }
Listing Program 4.7 Model anggota.php
function dosave{ document.readyfunction{
alertid_subkat=+id_subkat.val; .ajax{
url: getBaseURL+index.phpanggotasave, data: id_anggota=+id_anggota.
val+ednamaanggota=+ednamaanggota. val+jns_kelamin=+jns_kelamin.
val+tmpt_lhr=+tmpt_lhr. val+tgl_lahir=+tgl_lahir.
val+id_bagian=+id_bagian. val+ednamajabatan=+ednamajabatan.
val+tlp=+tlp. val+alamat=+alamat.
val+bacaan=+bacaan. val+username=+username.
val+password=+password. val,
cache: false, dataType: json,
type: POST, success: functionjson{
ifjson.data{ dosearchanggota-99;
alertData berhasil di Simpan; doclear;
}else{ alertData belum Terisi Semua;
} },
error: function xmlHttpRequest, textStatus, errorThrown { start = xmlHttpRequest.responseText.searchtitle + 7;
end = xmlHttpRequest.responseText.searchtitle; errorMsg =
; if start 0 end 0
alertRangerti +errorMsg +xmlHttpRequest.responseText+ [ +
xmlHttpRequest.responseText.substringstart, end + ]; else
alertError juga +errorMsg+xmlHttpRequest.responseText; }
}; };
}
Listing Program 4.8 ajaxanggota.js
Gambar 4.9Halaman Peringatan Simpan Anggota
4.4.2.4. Halaman Setting Buku
Gambar 4.10Halaman Setting Buku
Halaman ini adalah SubMenu dari Kelola Buku. Pada tampilan menu ini, admin sudah bisa melihat buku apa saja yang telah terekam
pada database. Pada halaman ini administrator dapat melakukan beberapa aksi pada halaman ini yaitu, menyimpan data buku baru,
mengubah data buku, dan mencari buku berdasarkan judul buku. Berikut adalah penggalan syntax untuk mengubah data buku beserta
hasilnya
function doeditbuku { xIdEdit = _POST[edkodebuku];
this-load-modelmodelbuku; this-load-modelmodelpenerbit;
this-load-modelmodelsub_kategori; this-load-modelmodeldetail_pengarang;
this-load-modelmodelpengarang; xrow
= this-modeldetail_pengarang-
getDetailbykode_bukuxIdEdit; row
= this-modelbuku-
getDetailbyKodebukuxIdEdit; this-load-helperjson;
this-json_data[judul] = row-judul; this-json_data[kode_buku] = row-kode_buku;
this-json_data[id_penerbit] =
row- id_penerbit;
this-json_data[nama_penerbit] =
this- modelpenerbit-getDetailbyIdpenerbitrow-id_penerbit-
nama_penerbit; this-json_data[id_subkat] = row-id_subkat;
this-json_data[nama_subkat] =
this- modelsub_kategori-getDetailbyidb_kategorirow-
id_subkat-nama_sub_kategori; this-json_data[kolasi] = row-kolasi;
this-json_data[rak] = row-rak; this-json_data[jml_eksemplar]
= row-
jml_eksemplar;
this-json_data[ISBN] = row-ISBN; this-json_data[tahun] = row-tahun;
this-json_data[harga_buku] =
row- harga_buku;
this-json_data[keterangan] =
row- keterangan;
this-json_data[id_pengarang] =
xrow- id_pengarang;
xidpengrang =
this-modeldetail_pengarang- getDetailbykode_bukurow-kode_buku-id_pengarang;
this-json_data[nama_pengarang] =
this- modelpengarang-getDetailbyIdpengarangxidpengrang-
nama_pengarang; xidpengrang
= this-modeldetail_pengarang-
getDetailbykode_bukupengarang2row-kode_buku- id_pengarang;
this-json_data[nama_pengarang2] =
this- modelpengarang-getDetailbyIdpengarangxidpengrang-
nama_pengarang; echo json_encodethis-json_data;
}
Listing Program 4.9 Controller settingbuku.php
function setUpdatebuku
kode_buku, judul,
id_penerbit, id_subkat,
kolasi, rak,
jml_eksemplar, tahun,
ISBN, harga_buku, tgl_input, keterangan {
xStr = UPDATE buku SET . kode_buku= . kode_buku . , .
judul= . judul . , . id_penerbit= . id_penerbit . , .
id_subkat= . id_subkat . , . kolasi= . kolasi . , .
rak= . rak . , . jml_eksemplar= . jml_eksemplar . , .
tahun= . tahun . , . ISBN= . ISBN . , .
harga_buku= . harga_buku . , . tgl_input= . tgl_input ., .
keterangan= . keterangan . WHERE kode_buku = . kode_buku . ;
query = this-db-queryxStr; return kode_buku;
}
Listing Program 4.10 Model buku.php
function doeditbukuedkodebuku{ document.readyfunction{
alertid_buku=+id_buku; .ajax{
url: getBaseURL+index.phpsettingbukudoeditbuku, data: edkodebuku=+edkodebuku,
cache: false, dataType: json,
type: POST, success: functionjson{
id_buku.valjson.id_buku; id_penerbit.valjson.id_penerbit;
id_subkat.valjson.id_subkat; id_pengarang.valjson.id_pengarang;
ednamabuku.valjson.judul; ednamapenerbit.valjson.nama_penerbit;
edkodebuku.valjson.kode_buku; ednamakategori.valjson.nama_subkat;
edkolasi.valjson.kolasi; edrak.valjson.rak;
edjmleksp.valjson.jml_eksemplar; edtahun.valjson.tahun;
edisbn.valjson.ISBN; edharga.valjson.harga_buku;
ednamapengarang.valjson.nama_pengarang; ednamapengarang_2.valjson.nama_pengarang2;
edketerangan.valjson.keterangan; },
error: function xmlHttpRequest, textStatus, errorThrown { start = xmlHttpRequest.responseText.searchtitle + 7;
end = xmlHttpRequest.responseText.searchtitle; errorMsg = Ga bisa update +xmlHttpRequest.responseText;
if start 0 end 0 alertOn Edit +errorMsg +
[ +
xmlHttpRequest.responseText.substringstart, end
+ ];
else alertError
+errorMsg; }
}; };
}
Listing Program 4.11 Ajaxsettingbuku.js
Gambar 4.11Halaman Peringatan Berhasil Update Buku
4.4.2.5. Halaman Penerbit
Gambar 4.12Halaman Penerbit
Halaman ini adalah bagian dari halaman setting buku.Halaman ini muncul jika tombol “+” pada masukkan data penerbit ditekan.Pada
tampilan halaman ini, admin telah bisa melihat siapa saja penerbit yang telah terekam pada database.Pada halaman ini administrator dapat
melakukan beberapa aksi yaitu, menyimpan data penerbit baru, mengubah data penerbit, menghapus data penerbit dan mencari penerbit
berdasarkan namanya.Mekanisme alur syntax pada penerbit sama halnya seperti syntax yang sudah dicantumkan.
4.4.2.6. Halaman Pengarang
Gambar 4.13Halaman Pengarang
Halaman ini adalah bagian dari halaman setting buku.Halaman ini muncul jika tombol “+” pada masukkan data pengarang ditekan.Pada
tampilan halaman ini, admin sudah bisa melihat siapa saja pengarang yang telah terekam pada database.Pada halaman ini administrator dapat
melakukan beberapa aksi yaitu, menyimpan data pengarang baru, mengubah data pengarang, menghapus data pengarang dan mencari
pengarang berdasarkan namanya.
Mekanisme alur syntax
pada pengarang sama halnya seperti syntax yang sudah dicantumkan.
4.4.2.7. Halaman Sub Kategori Buku
Gambar 4.14Halaman Sub Kategori Buku
Halaman ini adalah SubMenu dari Kelola Buku.Pada tampilan halaman ini, admin sudah bisa melihat data subkategori yang telah
terekam pada database. Pada halaman ini administrator dapat melakukan beberapa aksi yaitu, menyimpan data subkategori buku,
mengubah data subkategori buku, menghapus subkategori buku dan mencari subkategori buku berdasarkan nama subkategori. Berikut
adalah penggalan syntax untuk mencari datasubkategori buku beserta hasilnya
function searchsubkategori { xstart = _POST[xstart];
xSearch = _POST[xSearch]; this-load-helperjson;
if xstart + 0 == -99 { xstart
= this-session-userdataawal,
xstart;
} if xstart + 0 = -1 {
xstart = 0; this-session-set_userdataawal, xstart;
} else { this-session-set_userdataawal, xstart;
} this-json_data[tabledata]
= this-
getListkategorixstart, xSearch; echo json_encodethis-json_data;
}
Listing Program 4.12 Controller settingsubkategori.php
function getListsub_kategorixAwal, xLimit, xSearch = {
if emptyxSearch { xSearch
= Where
nama_sub_kategori like
. xSearch . ;
} xStr = SELECT FROM sub_kategori xSearch order by
id_subkat DESC limit . xAwal . , . xLimit; query = this-db-queryxStr;
return query; }
Listing Program 4.13 Model settingsubkategori.php
function dosearchsubkategorixstart{ xSearch =;
try { if edSearch.val={
xSearch = edSearch.val;} }catcherr{
xSearch =;} if typeofxSearch ==undefined{
xSearch =;}
document.readyfunction{ .ajax{
url: getBaseURL+index.phpsettingsubkategorisearchsubkategori
, data: xstart=+xstart+xSearch=+xSearch,
cache: false, dataType: json,
type: POST, success: functionjson{
tabledata.htmljson.tabledata; },
error: function xmlHttpRequest, textStatus, errorThrown { start = xmlHttpRequest.responseText.searchtitle + 7;
end = xmlHttpRequest.responseText.searchtitle;
errorMsg =
error on
search jadwal
+xmlHttpRequest.responseText; if start 0 end 0
alertRangerti +errorMsg
+ [
+ xmlHttpRequest.responseText.substringstart, end + ];
else alertError juga+errorMsg;
} };};}
Listing Program 4.14 Ajaxsubkategori.js
Gambar 4.15Halaman Pencarian Sub Kategori Buku
4.4.2.8. Halaman Data Usulan Buku
Gambar 4.16Halaman Data Usulan Buku
Halaman ini adalah SubMenu dari Kelola Buku.Pada tampilan halaman ini, admin sudah bisa melihat data pengusul buku yang
telahmengusulkan buku pada halaman
pemesanan
buku.Pada halaman ini administrator hanya dapat menghapus data usulan buku.
4.4.2.9. Halaman Sirkulasi Buku
Gambar 4.17Halaman Data Sirkulasi Buku
Halaman ini adalah SubMenu dari Kelola Buku.Pada tampilan halaman ini, admin sudah bisa melihat data pengguna yang telah
meminjam buku. Pada halaman ini administrator dapat melakukan beberapa aksi yaitu, menambah data peminjam buku, dan mencari
peminjam buku berdasarkan nama peminjam. Mekanisme alur syntax penambahan dan melihat data sama halnya seperti syntax yang sudah
dicantumkan.
4.4.2.10. Halaman Pengembalian Buku
Gambar 4.18Halaman Pengembalian Buku
Halaman ini adalah bagian dari halaman sirkulasi buku.Halaman ini muncul jika tombol pengembalian ditekan. Pada tampilan halaman ini,
admin memasukkan nama anggota yang akan mengembalikan buku, kemudian setelah dimasukkan, maka secara otomatis akan muncul data
yang berisi data peminjaman buku anggota tersebut. Pada halaman ini administrator hanya dapat mengubah data pinjam menjadi kembali pada
anggota yangakan mengembalikan buku.Berikut adalah penggalan syntax
untuk pengembalian buku beserta hasilnya
function dokembali { xIdkembali = _POST[idanggota_];
this-load-modelmodelcopy_buku; this-load-modelmodeldetailpinjam;
this-load-modelmodelpeminjaman; this-load-helperjson;
tgl = dateY-m-d; status = Ada;
statuspinjam = kembali; xidpinjam = ;
xquery =
this-modeldetailpinjam- getListdetailpengembalian0, 10, xIdkembali;
foreach xquery-resultas row { xidpinjam = row-id_pinjam;
this-modelcopy_buku- setUpdateDetailcopybukustatuskembalirow-id_copybuku,
row- kode_buku, status;
} xtgljatuhtempo
= this-modelpeminjaman-
getDetailbyId_pinjamrow-id_pinjam-tgl_jatuhtempo; xjmlbuku=this-modeldetailpinjam-
countpinjamxidpinjam-TotalPinjam; if xtgljatuhtempo = tgl {
xtgltempo=explode-, xtgljatuhtempo; xday=dated;
xselish=xday-xtgltempo[2]; xjmdenda=xjmlbuku500xselish;
this-json_data[data]=Anda Mendapat
Denda Rp.
.xjmdenda; }else{
this-json_data[data]=Anda Tidak Mendapat Denda Rp. 0;
} this-modelpeminjaman-setUpdatepinjamxidpinjam,
tgl, statuspinjam; echo json_encodethis-json_data;
}
Listing Program 4.15Controller peminjaman.php
function setUpdatepinjamid_pinjam, tgl, status { xStr = UPDATE peminjaman SET .
tgl_kembali= . tgl . , . statuspinjam= . status . .
WHERE id_pinjam = . id_pinjam . ; query = this-db-queryxStr;
return id_pinjam; }
Listing Program 4.16Model peminjaman.php
function setUpdateDetailcopybukustatuskembaliid_copybuku, id_buku,
status{ xStr= update yis_perpus.copy_buku set .
status = .status.. where id_copybuku = .id_copybuku. and id_buku =
.id_buku.; query = this-db-queryxStr;
return id_copybuku;}
Listing Program 4.17Model copy_buku.php
function dokembaliid_pinjam, copybuku, buku{ document.readyfunction{
.ajax{ url: getBaseURL+index.phppeminjamandokembali,
data: id_pinjam=+id_pinjam
+id_copybuku=+copybuku+id_buku=+buku, cache: false,
dataType: json, type: POST,
success: functionjson{ alertBuku Sudah kembali;
dosearchdatapengembalian-99; },
error: function xmlHttpRequest, textStatus, errorThrown { start = xmlHttpRequest.responseText.searchtitle + 7;
end = xmlHttpRequest.responseText.searchtitle; errorMsg = Pengembalian Error +xmlHttpRequest.responseText;
if start 0 end 0 alertOn Edit +errorMsg +
[ + xmlHttpRequest.responseText.substringstart, end + ];
else alertError juga +errorMsg;
} };
}; }
Listing Program 4.18Ajaxpeminjaman.js
Gambar 4.19Halaman Hasil Pengembalian Buku
4.4.2.11. Halaman Cetak Data Peminjam
Gambar 4.20Halaman Cetak Data Peminjam Buku
Halaman ini adalah SubMenu dari Kelola Buku dan merupakan output
dari sirkulasi buku yang nantinya akan berupa laporan berformat Excel. Laporan ini berupa rekap data anggota yang belum
mengembalikan buku dari seluruh bulan.Berikut adalah penggalan syntax
untuk mencetak data peminjaman beserta hasilnya
function exportkeexcelsearch { ifsearch==0{
search=; }
xbufresult =
headerContent-type: applicationoctet-
stream . \n . headerContent-Disposition:
attachment; filename=databuku.xls
. \n .
headerPragma: no-cache . \n . headerExpires: 0;
xbufresult .= this-getListBukuKembali0,search; echo xbufresult;
}
Listing Program 4.19Controller SearchPeminjaman.php
function showxls{ document.readyfunction{
document.location = getBaseURL+index.phpsearchpeminjamanexportkeexcel+edm
ount.val; };
}
Listing Program 4.20AjaxSettingPeminjaman.js
Gambar 4.21Laporan Cetak Data Peminjaman Buku
4.4.2.12. Halaman Cetak Data Buku
Gambar 4.22 Halaman Cetak Data Buku
Halaman ini adalah SubMenu dari Kelola Buku dan merupakan output dari setting buku yang nantinya akan berupa laporan berformat
lembar kerja spreadsheet. Laporan ini berupa rekap data buku dari seluruh bulan.Mekanisme alur syntax cetak data buku sama halnya
seperti syntax yang sudah dicantumkan.
94
BAB V ANALISA IMPLEMENTASI SISTEM
Bab ini berisi tentang analisa hasil pembangunan sistem yang meliputi kelebihan dan kekurangan sistem serta analisa hasil uji coba sistem terhadap
pengguna.
5.1. Analisa Hasil Perangkat Lunak
Sistem Informasi PerpustakaanBerbasis Web yang telah dibangun ini secara umum telah berfungsi dengan baik. Sistem yang telah melalui tahap
implementasi inikemudian diujicobakan pada beberapa pengguna dan Administrator yang berada di LSM YIS.
5.1.1. Analisa terhadap pengguna
Pada pengujian ini terdapat 2 poin utama yang dinilai, yaitu hal mengenai tampilan dan hal mengenai fungsi-fungsi yang terdapat pada
sistem.Pengujian sistem ini melibatkan 10 orang pengguna yang berada di LSM.Evaluasi terhadap sistem dilakukan dengan cara mengisi
kuisioner setelah melakukan ujicoba pada sistem. Kuisioner ini bertujuan agar
penulis mengetahui
apakah terdapat
kesulitan pada
saat menggunakan sistem ini dan apakah fungsi-fungsi dalam sistem ini
membantu pengguna.
Kategori