27. M elihat Galeri
3.9.3 Class Diagram S istem yang dirancang
Class Diagram digunakan untuk mencari atribut, objek, dan operasi yang
ada dalam sistem. Dengan mengetahui melalui survei, maka dapat dikumpulkan objek-objek beserta atribut dan operasinya untuk membantu dalam perancangan dan analisis sistem. Berikut ini adalah gambar class diagram sistem yang sedang dirancang :
+ubah kios() +hapus kios()
+masukkan kios kosong() - PK kdKios : int - namaKios : Str ing - FK kdJenisDagang : String - lokasi : Str ing - noTelpKios : String - FK kdStatus : String - FK kdPemilik : int kios +masukkan acara() +ubah acara() +hapus acara() -PK kdAcar a : int -namaAcara : Str ing -tanggalMulai : Date -tanggalSelesai : Date -lokasi : String -partner : String acara +masukkan berita() +ubah berita() +hapus berita() -PK kdBer ita : int -judulBerita : Str ing -isiBerita : Str ing -tanggalPosting : String berit a +masukkan komentar( ) +lihat komentar () +hapus komentar () -PK kdKomentar : int -nama : String -isiKomentar : Str ing -tanggalKomentar : String koment ar +login() +ubah admin() +logout() -PK idAdmin : int -username : Str ing -password : String -inisial : String ad min
+lihat kios yang tersedia() +isi form sewa kios() +ubah status sewa kios( ) -PK idUser : int -namaPemilik : String -alamat : String -namaKios : String -email : String -noTelp : Str ing -FK kdKios : String -FK kdJenisDagang : String -FK kdStatus : String sewaKios +simpan komentar() +pesan kios() user 1 0..* 1 0..* 1 1..* 1 0..* 1 0..* 0..* 1 +masukkan gambar( ) +ubah gambar( ) +hapus gambar () -PK kdGaleri : int -nama : String -keterangan : String -url : String galeri 1 0..*
Gambar 3.18 Class Diagram perancangan sistem
Pada Gambar diatas, terdapat 8 kelas. Kelas-kelas tersebut adalah kelas kios, kelas komentar, kelas user, kelas admin, kelas acara, kelas sewa kios, kelas berita, dan kelas galeri. Dalam gambar diagram diatas terdapat 20 hubungan yang terjadi antar kelas. Hubungan tersebut adalah :
• Satu admin dapat mengubah satu atau lebih detail kios • Satu admin dapat menghapus satu atau lebih detail kios • Satu admin dapat memasukkan satu atau lebih kios kosong • Satu admin dapat melihat satu atau lebih komentar
• Satu admin dapat menghapus satu atau lebih komentar • Satu admin dapat memasukkan satu atau lebih acara baru • Satu admin dapat mengubah satu atau lebih acara
• Satu admin dapat menghapus satu atau lebih acara
• Satu admin dapat memasukkan satu atau lebih berita baru • Satu admin dapat mengubah satu atau lebih berita
• Satu admin dapat menghapus satu atau lebih berita
• Satu admin dapat memasukkan satu atau lebih gambar baru • Satu admin dapat mengubah satu atau lebih gambar
• Satu admin dapat menghapus satu atau lebih gambar • Satu admin dapat melihat satu atau lebih status sewa kios • Satu admin dapat mengubah satu atau lebih status sewa kios • Satu user dapat memasukkan satu atau lebih komentar baru • Satu user dapat melihat satu atau lebih komentar
• Satu user dapat mengisi satu atau lebih form sewa kios • Satu user dapat melihat satu atau lebih kios yang tersedia
Untuk memperjelas hubungan dari class diagram pada Gambar 3.18, maka penulis menyertakan sequence diagram. Sequence diagram yang dibuat adalah :
a. Sequence diagram login admin
actadmin
aplikasi admin database
buka halaman() login()
pesan berhasil()
cek login()
Gambar 3.19 Sequence diagram login admin Dari Gambar 3.19 dapat dijelaskan prosesnya sebagai berikut : 1. admin membuka halaman aplikasi.
2. admin melakukan login.
3. Halaman admin melakukan cek ke dalam database. 4. Halaman aplikasi mengirim pesan bahwa login berhasil.
b. Sequence diagram lihat komentar
a ctadmin
ap likasi da taba se
b uka ha la man ()
load d atab ase()
tampilka n komentar() actu se r
buka h alama n()
ta mpilkan komenta r()
Gambar 3.20 Sequence diagram lihat komentar Dari Gambar 3.20 dapat dijelaskan prosesnya sebagai berikut :
1. Admin atau user membuka halaman aplikasi.
2. Data yang berisi komentar diambil dari dalam database. 3. Halaman aplikasi menampilkan komentar yang ada.
c. Sequence diagram hapus komentar
actadmin
aplikasi admin dat abase
buka halaman() login() pesan berhasil() hapus komentar() tampilkan data() delete() pilih komentar()
Gambar 3.21 Sequence diagram hapus komentar Dari Gambar 3.21 dapat dijelaskan prosesnya sebagai berikut :
1. Admin membuka halaman aplikasi.
2. Admin melakukan login.
3. Admin memilih komentar yang diinginkan.
4. Admin menghapus komentar yang dipilih.
5. Data dihapus dari dalam database.
6. Halaman aplikasi mengirim pesan bahwa hapus komentar berhasil.
d. Sequence diagram menambah detail kios baru
actad min
aplikasi admin da tabase
buka ha la man() login()
pesan berhasil()
masu kkan deta il kios()
in se rt()
Gambar 3.22 Sequence diagram menambah detail kios baru Dari Gambar 3.22 dapat dijelaskan prosesnya sebagai berikut :
1. Admin membuka halaman aplikasi.
2. Admin melakukan login.
3. Admin memasukkan detail setiap kios baru.
4. Data dimasukkan ke dalam database.
e. Sequence diagram ubah kios
acta dmin
a plika si ad min data base
b uka ha la man ()
log in () p esan berhasil()
ubah det ail kios() t amp ilkan data ()
up date ()
p ilih de tail kio s()
Gambar 3.23 Sequence diagram ubah kios Dari Gambar 3.23 dapat dijelaskan prosesnya sebagai berikut : 1. Admin membuka halaman aplikasi.
2. Admin melakukan login.
3. Admin memilih detail kios yang diinginkan. 4. Admin mengubah detail kios tersebut. 5. Data di-update ke dalam database.
6. Aplikasi menampilkan pesan bahwa ubah kios berhasil. 7. Aplikasi menampilkan data kios yang ada.
f. Sequence diagram hapus kios
a ctad min
aplikasi admin database
buka halaman() lo gin()
pesan berhasil()
de lete() pilih kios()
hapus kio s()
tampilkan data()
Gambar 3.24 Sequence diagram hapus kios Dari Gambar 3.24 dapat dijelaskan prosesnya sebagai berikut : 1. Admin membuka halaman aplikasi.
2. Admin melakukan login.
3. Admin memilih kios yang diinginkan. 4. Admin menghapus kios yang telah dipilih. 5. Data dihapus dari dalam database.
6. Aplikasi menampilkan pesan bahwa hapus kios berhasil. 7. Aplikasi menampilkan data kios yang ada.
g. Sequence diagram memasukkan kios kosong
actad min
aplikasi adm in da tabase
buka ha la man() login()
pesan berhasil()
masu kkan deta il kios()
in se rt()
Gambar 3.25 Sequence diagram menambah detail kios baru Dari Gambar 3.25 dapat dijelaskan prosesnya sebagai berikut :
1. Admin membuka halaman aplikasi.
2. Admin melakukan login.
3. Admin memasukkan detail kios kosong.
4. Data dimasukkan ke dalam database.
5. Halaman aplikasi menampilkan pesan bahwa insert kios kosong berhasil
h. Sequence diagram masukkan komentar aplikasi database insert() actuser buka halaman() pesan berhasil() komentar tulis komentar()
Gambar 3.26 Sequence diagram masukkan komentar Dari Gambar 3.26 dapat dijelaskan prosesnya sebagai berikut :
1. user membuka halaman aplikasi.
2. user mengisi form komentar.
3. Data dimasukkan ke dalam database.
i. Sequence diagram isi form sewa kios actu ser a plikasi database buka halama n() pesan b erhasil() insert() form isi form()
Gambar 3.27 Sequence diagram isi form sewa kios Dari Gambar 3.27 dapat dijelaskan prosesnya sebagai berikut :
1. user membuka halaman aplikasi.
2. user mengisi form penyewaan kios.
3. Data dimasukkan ke dalam database.
4. Halaman aplikasi mengirim pesan bahwa pengisian form sewa kios berhasil.
j. Sequence diagram lihat kios yang tersedia actuser aplikasi database buka halaman() pesan berhasil() tampilkan() cek database()
Gambar 3.28 Sequence diagram lihat kios yang tersedia Dari Gambar 3.28 dapat dijelaskan prosesnya sebagai berikut :
1. user membuka halaman aplikasi.
2. Data diambil dari dalam database. 3. Data ditampilkan ke dalam aplikasi.
k. Sequence diagram lihat status sewa kios
actadm in
ap likasi a dmin d ataba se
bu ka halama n()
login() lihat sta tus sewa kios() ta mpilka n data ()
loa d dat abase()
Gambar 3.29 Sequence diagram lihat status sewa kios Dari Gambar 3.29 dapat dijelaskan prosesnya sebagai berikut : 1. Admin membuka halaman aplikasi.
2. Admin melakukan login.
3. Halaman admin mengambil data dari database. 4. Admin melihat status sewa kios.
l. Sequence diagram ubah status sewa kios
actadmi n
aplikasi admin database
buka halaman() login()
pesan berhasil()
ubah stat us sewa kios() tampilkan dat a()
update() pilih form sewa kios()
Gambar 3.30 Sequence diagram ubah status sewa kios Dari Gambar 3.30 dapat dijelaskan prosesnya sebagai berikut : 1. Admin membuka halaman aplikasi.
2. Admin melakukan login.
3. Admin memilih form sewa kios yang diinginkan.
4. Admin mengubah status sewa kios.
5. Data di-update ke dalam database.
6. Aplikasi menampilkan pesan bahwa ubah status berhasil. 7. Aplikasi menampilkan status sewa kios yang ada.
m. Sequence diagram masukkan acara
actadmin
aplikasi admin dat abase
buka halaman()
login() pesan berhasil() masukkan acara() tampilkan data()
insert()
Gambar 3.31 Sequence diagram masukkan acara Dari Gambar 3.31 dapat dijelaskan prosesnya sebagai berikut : 1. Admin membuka halaman aplikasi.
2. Admin melakukan login.
3. Admin memasukkan daftar acara baru.
4. Data dimasukkan ke dalam database.
5. Aplikasi menampilkan pesan bahwa masukkan acara berhasil. 6. Aplikasi menampilkan daftar acara yang ada.
n. Sequence diagram ubah acara
actadmin
a plikasi adm in database
buka halaman() login() pesan berhasil() ubah acara() tampilkan data() update() pilih acara()
Gambar 3.32 Sequence diagram ubah acara Dari Gambar 3.32 dapat dijelaskan prosesnya sebagai berikut : 1. Admin membuka halaman aplikasi.
2. Admin melakukan login.
3. Admin memilih acara yang diinginkan.
4. Admin mengubah acara tersebut.
5. Data di-update ke dalam database.
6. Aplikasi menampilkan pesan bahwa ubah acara berhasil. 7. Aplikasi menampilkan daftar acara yang ada.
o. Sequence diagram hapus acara
act admin
aplikasi admin data base
bu ka hala man() login() pe sa n berhasil() h apus acara () ta mpilkan d ata() delete () pilih acara()
Gambar 3.33 Sequence diagram hapus acara Dari Gambar 3.33 dapat dijelaskan prosesnya sebagai berikut : 1. Admin membuka halaman aplikasi.
2. Admin melakukan login.
3. Admin memilih acara yang diinginkan.
4. Admin menghapus acara tersebut.
5. Data dihapus dari dalam database.
6. Aplikasi menampilkan pesan bahwa hapus acara berhasil. 7. Aplikasi menampilkan daftar acara yang ada.
p. Sequence diagram masukkan berita baru
actadmin
aplikasi admin database
buka halaman()
login() pesan berhasil() masukkan berita baru() tampilkan data()
insert()
Gambar 3.34 Sequence diagram masukkan berita baru Dari Gambar 3.34 dapat dijelaskan prosesnya sebagai berikut : 1. Admin membuka halaman aplikasi.
2. Admin melakukan login.
3. Admin memasukkan berita baru.
4. Data dimasukkan ke dalam database.
5. Aplikasi menampilkan pesan bahwa masukkan berita baru berhasil. 6. Aplikasi menampilkan berita yang ada.
q. Sequence diagram ubah berita
actadmin
a plikasi ad min databa se
buka ha la man()
login() pesan berh asil()
u bah be rita() tam pilkan d ata()
up date()
pilih berita()
Gambar 3.35 Sequence diagram ubah berita
Dari Gambar 3.35 dapat dijelaskan prosesnya sebagai berikut : 1. Admin membuka halaman aplikasi.
2. Admin melakukan login.
3. Admin memilih berita yang diinginkan.
4. Admin mengubah berita tersebut.
5. Data di-update ke dalam database.
6. Aplikasi menampilkan pesan bahwa ubah berita berhasil. 7. Aplikasi menampilkan berita yang ada.
r. Sequence diagram hapus berita
act admin
aplikasi admin database
buka halaman()
login() pesan berhasil()
hapus berita() tampilkan dat a()
delete()
pilih berita()
Gambar 3.36 Sequence diagram hapus berita Dari Gambar 3.36 dapat dijelaskan prosesnya sebagai berikut : 1. Admin membuka halaman aplikasi.
2. Admin melakukan login.
3. Admin memilih berita yang diinginkan.
4. Admin menghapus berita tersebut.
5. Data dihapus dari dalam database.
6. Aplikasi menampilkan pesan bahwa hapus berita berhasil. 7. Aplikasi menampilkan berita yang ada.
s. Sequence diagram masukkan gambar
actadmin
aplikasi admin database
buka halaman( )
login() pesan berhasil() masukkan gambar( ) tampilkan data()
insert()
Gambar 3.37 Sequence diagram masukkan gambar Dari Gambar 3.37 dapat dijelaskan prosesnya sebagai berikut : 1. Admin membuka halaman aplikasi.
2. Admin melakukan login.
3. Admin memasukkan gambar.
4. Data dimasukkan ke dalam database.
5. Aplikasi menampilkan pesan bahwa masukkan gambar berhasil. 6. Aplikasi menampilkan gambar yang ada.
t. Sequence diagram hapus gambar
actad min
ap likasi a dmin dat abase
buka h alama n()
lo gin() pesan berhasil()
h apus g amb ar() tampilkan data ()
d ele te()
pilih gambar()
Gambar 3.38 Sequence diagram hapus gambar Dari Gambar 3.38 dapat dijelaskan prosesnya sebagai berikut : 1. Admin membuka halaman aplikasi.
2. Admin melakukan login.
3. Admin memilih gambar yang diinginkan.
4. Admin menghapus gambar tersebut.
5. Data dihapus dari dalam database.
6. Aplikasi menampilkan pesan bahwa hapus gambar berhasil. 7. Aplikasi menampilkan gambar yang ada.
u. Sequence diagram logout admin
actadmin
aplik asi admin
buka halaman() logout()
pesan berhasil()
Gambar 3.39 Sequence diagram logout admin Dari Gambar 3.39 dapat dijelaskan prosesnya sebagai berikut : 1. Admin membuka halaman aplikasi.
2. Admin melakukan logout.
Rancangan activity diagram yang dihasilkan dari sequence diagram dari sistem yang dirancang, yaitu :
1. Activity Diagram admin login
login validasi admin buat session pesan error [valid] [invalid] / insert dat a [admin] logout halaman admin
2. Activity Diagram pengelolaan kios
halaman admin [admin]
kios
masukkan kios ubah kios hapus kios
/ inser t / update / delete
simpan database ubah database hapus database
3. Activity Diagram pengelolaan lainnya
ha laman admin [a dmin]
gale ri
masukkan gamba r hapus gambar / insert
/ del ete
simpan databa se
ha pus data base a ca ra be rita ub ah berita / update u bah database ub ah acara / update ubah databa se komentar h apus komentar
masu kka n b erita h apus berita
/ i nsert / de lete
simpan database hapu s databa se masukkan acara
/ in se rt
simpa n d ata base masukkan komentar
/ insert
simpan da tab ase
/ de lete
hapus database
hapu s acara
/ dele te
ha pus data base