BAB III ANALISIS DAN DESAIN SISTEMrepository.potensi-utama.ac.id/jspui/bitstream/123456789/65/3/BAB...
Transcript of BAB III ANALISIS DAN DESAIN SISTEMrepository.potensi-utama.ac.id/jspui/bitstream/123456789/65/3/BAB...
29
BAB III
ANALISIS DAN DESAIN SISTEM
III.1. Analisis Masalah
Rute jalur terpendek merupakan suatu persoalan untuk mencari lintasan
menuju toko Majestyk yang dilalui dengan jumlah yang paling minimum. Maka
dibutuhkan algoritma Dijkstra untuk mencari rute jalur terpendek. Banyaknya
konsumen yang membutuhkan informasi mengenai data tempat toko majestyk
yang terdekat maka perlu dibangun sebuah sistem informasi geografis yang dapat
memudahkan konsumen dalam mencari lokasi tempat toko majestyk terdekat di
kota Medan.
III.1.1. Analisis Input
Dalam hal ini sistem yang digunakan belum efektif di karenakan sistem
informasi yang digunakan masih bersifat manual hanya melakukan penginputan
informasi belum terkomputerisasi dalam mendapatkan informasi tentang
keberadaan toko majestyk terdekat. Namun dengan sistem informasi yang
dirancang sistem akan lebih mudah karena telah menggunakan aplikasi yang
dibuat sesederhana mungkin yang lebih efektif dan efisien dalam mengakses
informasi keberadaan toko majestyk terdekat. hal ini bertujuan untuk
mempermudah pihak pengguna dalam pencarian lokasi yang ada dan didukung
dengan database yang berperan dalam menyimpan data-data yang telah diinput
dan jika adanya perubahan informasi akan lebih mudah untuk perawatan
30
III.1.2. Analisis Process
Proses yang terjadi pada sistem yang dijelaskan pada langkah-langkah:
Sistem Informasi Geografis Pencarian Rute Jalur Terpendek Toko majestyk dengan Algoritma Dijkstra.
Admin Masyarakat
Phas
e
Mengingat Alamat
Mengunjungi Toko
Majestyk
Mengunjungi Toko Majestyk
SELESAI
Papan Iklan / Brosur Toko Majestyk
MULAI
Papan Iklan / Brosur Toko majestyk
Gambar III.1. Flow Of Document Lokasi Toko majestyk
Penjelasan FOD :
1. Masyarakat mendapatkan informasi mengenai lokasi toko majestyk yang
berada di kota Medan.
2. Kemudian Masyarakat mengingat atau mencatat alamat lokasi toko majestyk
tersebut.
3. Setelah mendapatkan informasi lokasi toko majestyk, masyarakat melakukan
pengunjungan ke lokasi toko majestyk yang mereka ketahui.
31
III.1.3. Analisis Output
Output yang dihasilkan dari sistem adalah informasi-informasi tempat
Lokasi Toko majestyk yang ada di kota dan mengunjungi Lokasi Toko majestyk
yang di inginkan maka Masyarakat akan mendapatkan jasa pelayanan sesuai
dengan kebutuhan Masyarakat yang diberikan oleh pihak lokasi toko majestyk
yang bersangkutan.
Tabel.III.1. Daftar Toko majestyk
No
Nama Toko
majestyk
Alamat Lengkap Longitudinal Latitude
1.
2.
3.
4.
III.2. Evaluasi Sistem Yang Berjalan
Sistem Informasi Geografis saat ini hanya sebatas teori seperti
pemberitahuan informasi geografis. Kelemahan dari system ini adalah data
tentang lokasi dan jarak , tidak akurat karena system informasi tersebut sebatas
simulasi teori.
Maka solusinya yang penulis buat untuk mengatasi masalah tersebut
adalah membuat suatu system Informasi Geografis toko majestyk menggunakan
32
web berbasis online dengan metode djikstra yang dilengkapi simulasi sesuai
dengan analisa penulis dilapangan serta database di MySQL.
Algoritma Dijkstra adalah suatu algoritma untuk menentukan jalur
terpendek antar node dengan berdasar pada basis penghitungan "dari satu node
menuju seluruh node". Algoritma Dijkstra termasuk dalam jenis algoritma Link
State, yaitu memperhatikan total jarak dan rute yang akan dilalui. Pada dasarnya,
terdapat beberapa notasi utama dalam pengerjaan Algoritma Dijkstra ini :
Untuk proses inisialisasi, dibentuk suatu array/himpunan N dengan
anggota s (s adalah lambang untuk suatu node sumber). Nilai D adalah jarak yang
akan tersedia pada tabel hasil algoritma, sementara C adalah nilai jarak pada map
yang tersedia. Maka pada tahap inisialisasi ini nilai Dj (jarak pada hasil tabel
antara node s dengan node j, dengan j tidak sama dengan s) dimasukkan nilai yang
sebenarnya. Jika tidak tersambung secara langsung maka akan dianggap tak
terdefinisi. Untuk jarak Ds tentu saja bernilai 0.
perulangan tiap baris dimasukkan node i yang belum termasuk pada
array/himpunan N untuk nanti node i tersebut dijadikan sebagai "perpanjangan"
dari node s, dengan node i juga merupakan node tetangga dari node s. Node i yang
dimasukkan pada himpunan N berdasarkan pada jarak terkecil dengan node s. Dan
jika seluruh node sudah masuk dalam himpunan N, maka iterasi akan berhenti.
Untuk setiap node j (dalam tabel hasil: tiap kolom) diperbaharui nilainya yang
paling kecil yaitu membandingkan antara nilai Dj sebelumnya dengan hasil
penjumlahan (Di+Cij), yaitu penjumlahan jarak node s ke node i dengan jarak
sebenarnya dari node i ke node j.
33
Jaringan yang sama dengan yang ada pada postingan Bellman-Ford yang lalu :
Majestyk 3
Majestyk 4
Maj
esty
k
1
Majestyk
2
Potensi
1,6
3,9
4,9
5,35,9
2,24,4
Gambar III.2. Algoritma Dijkstra untuk mencari path terpendek.
Pada metode dijkstra, titik atau jarak digunakan karena metode dijkstra
menggunakan graph berarah dalam menentukan jalur rute terpendek.
Gambar III. 3. Flowchart Algoritma Dijkstra.
Untuk mempermudah, buatlah tabel seperti berikut ini:
Mulai
Inisialisasi Titik Awal Dan
Jarak Titik Tetangga
Beri Label Sementara
Untuk Jarak Antar Titik
Tetangga Maks 50 Km
Tentukan Jarak
Minimum Dari Tiap
Titik Tetangga
Ambil masukkan jarak
kedalam table jarak, sebagai
titik terdekat
Titik Terdekat Sudah
Ada Dalam Array Rute?
Masukkan Titik Terdekat
Sebagai array Rute
Selesai
Tidak
Ya
34
Misalnya kita akan menggunakan algoritma Dijkstra untuk mencari Jalur
terpendek dari potensi.
(Notasi dalam tabel algoritma Dijkstra memiliki format jalur terdekat, dimana
jarak menunjukkan rute dari lokasi sebelumnya menuju lokasi selanjutnya.
1. Baris pertama masih berupa inisialisasi, yaitu potensi akan memiliki nilai
jika tersambung langsung dan tidak memiliki nilai jika tidak tersambung
langsung. Karena potensi kebetulan hanya memiliki 1 tetangga yaitu
majestyk1, maka nilai jarak = 2. Table dibawah ini :
Lokasi
Potensi
Majestyk 1
{potensi,Majestyk1}=1,6
Majestyk 2
{potensi,Majestyk2}= 2,2
Majestyk 3{potensi,Majestyk1,Majestyk3
} = 1,6 +3,9 =5,5
Majestyk 4{potensi,Majestyk2,Majes
tyk4}=2,2 + 4,4 = 6,6
Majestyk sudah berperan sebagai "perpanjangan" lokasi sumber potensi, sehingga
sekarang lokasi-lokasi yang terhubung dengan majestyk sudah bisa "dijangkau"
oleh potensi via majestyk1. Diketahui majestyk 2 dan majestyk 3 terhubung
langsung dengan majestyk 1, sehingga rutenya ditulis (potensi-majestyk1-
majestyk 2) dan (potensi-majestyk 1 - Majestyk 3).bisa dilihat di table dibawah ini
:
Lokasi
Potensi
Majestyk 1
{potensi,Majestyk1}=1,6
{potensi,Majestyk1}=1,6
Majestyk 2
{potensi,Majestyk2}= 2,2{potensi,Majestyk 1,
Majestyk2}=1,6+4,9 = 6,5
Majestyk 3{potensi,Majestyk1,Majestyk3}=1,6 +3,9
= 5,5{potensi,Majestyk1,Majestyk3=1,6
+3,9 = 5,5
Majestyk 4{potensi,Majestyk1,Majestyk3,Majesty
k4}= 1,6+3,9+5,9 = 11,4
{potensi,Majestyk1,Majestyk3,Majestyk,4} = 1,6 + 3,9 +5,9 = 11,4 Potensi,majestyk1
Untuk langkah selanjutnya dipilih jarak yang telah tersambung dengan jarak
lainnya namun belum masuk dalam himpunan jarak. Diketahui yaitu majestyk2
35
dan majestyk3. Jarak yang dipilih adalah majestyk2 menuju majestyk3. Sehingga
didapat dilihat di tabel berikut.
Lokasi
potensi
majestyk1
{potensi,majestyk1}=2
{potensi,majestyk1}=2
majestyk2
XXXXXXXXXX
{potensi,majestyk1,majestyk2}=5
majestyk3
XXXXXXXX
{potensi,majestyk1,majestyk3}=3
majestyk 4
XXXXX
XXXXXpotensi,majestyk1{Majestyk1,Majestyk2,Majestyk3}=
4,9+5,3 = 10,2XXXXXXXXX {majestyk2,majestyk3}=7 XXXXXmajestyk2,majestyk3
Potensi {potensi,Majestyk1}=1,6 {potensi,Majestyk2}= 2,2{potensi,Majestyk1,Majestyk3}=1,6 +3,9
= 5,5{potensi,Majestyk1,Majestyk3,Majesty
k4}= 1,6+3,9+5,9 = 11,4
{potensi,Majestyk1}=1,6{potensi,Majestyk 1,
Majestyk2}=1,6+4,9 = 6,5{potensi,Majestyk1,Majestyk3=1,6
+3,9 = 5,5Potensi,majestyk1 {potensi,Majestyk1,Majestyk3,Majestyk4}= 1,6+3,9+5,9 = 11,4
{Majestyk1,Majestyk2,Majestyk3}= 4,9+5,3 = 10,2
{Majestyk1,Majestyk2,Majestyk3}= 4,9+5,3 = 10,2
{Majestyk1,Majestyk2,Majestyk3,Majestyk4}= 4,9+5,3+5,9 = 16,1
Potensi Majestyk1 = 1,6
Majestyk1 Majestyk2 = 4,9
Majestyk1 majestyk3= 3,9
majestyk2 majestyk3= 5,3
Potensi ke majestyk2 = jalurnya {Potensi,majestyk1,majestyk2}1,6+4,9=6,5
Potensi ke majestyk3 = jalurnya yang di pilih paling Minimum
{Potensi,majestyk1,majestyk3}1,6+3,9=5,5
Sedangkan lokasi terdekat merupakan majestyk 1,6 karena jarak antara potensi
menuju majestyk {Potensi,majestyk1} = 1,6 adalah jarak terdekat.
III.3. Desain Sistem Baru
Desain Sistem Baru menggunakan bahasa pemodelan UML yang terdiri dari
Usecase Diagram, Class Diagram, Activity Diagram dan Sequence Diagram.
III.3.1. Usecase Diagram
Secara garis besar, bisnis proses sistem yang akan dirancang digambarkan
dengan usecase diagram yang terdapat pada Gambar III.4 :
36
Penerapan Metode Djikstra Pada Sistem Informasi Geografis
Rute Jalur Toko Majestyk Berbasis Online
Administrator
Login
Data produk
Peta Majestyk
Tentang kami
Data toko
User
Daftar Majestyk
Jarak majestyk
Gambar III.4. Use Case Diagram Sistem Geografis lokasi toko majestyk
Medan
III.3.2. Class Diagram
Rancangan kelas-kelas yang akan digunakan pada sistem yang akan
dirancang dapat dilihat pada gambar III.5 :
using
using
using
Toko
- Id_toko- Nama_toko- Alamat- Long- Lat- Photo-telp
jarak
- Id - titik- titik2- jarak
Connection
ConnectionManager()
user
- Username- Password
1
1..*
1..*
1..*
1
1
Gambar III.5. Class Diagram Sistem Informasi GIS Lokasi Toko Majestyk
37
III.3.3. Activity Diagram
Bisnis proses yang telah digambarkan pada use case diagram di atas dijabarkan
dengan activity diagram :
1. Activity Diagram Melihat Peta
Aktivitas melihat peta diterangkan dalam langkah-langkah state, dimulai dari
kegiatan melihat panel peta kemudian mencari Artikel Lokasi Toko Majestyk,
selanjutnya menekan tombol atau link yang ada pada peta dan yang terakhir
melihat informasi yang di sajikan dalam peta yang ditunjukkan pada gambar III.6:
Halaman Utama
Click jarak
Click Salah Satu Rute majestyk
Melihat Informasi Lokasi majestyk
Gambar III.6. Activity Diagram Melihat Peta
2. Activity Diagram Login Administrator Website
Aktvitas proses login admin diterangkan dalam langkah-langkah state,
dimulai dari memasukkan username, memasukkan password, jika profil valid
maka sistem akan mengaktifkan menu administrator, sedangkan jika tidak valid,
maka tampilkan pesan kesalahan yang ditunjukkan pada gambar III.7:
38
Memasukkan Username
Memasukkan Password
Aktifkan Menu Administrator Menampilkan Pesan Error
invalidValid
Gambar III.7. Activity Diagram Login Admin
3. Activity Diagram Mengolah Data Lokasi Toko Majestyk
Aktivitas proses mengolah data Lokasi Toko Majestyk diterangkan dalam
langkah-langkah state yang ditunjukkan pada gambar III.8:
Memilih aksi pada form data majestyk
Memilih Pencarian
Mengetik Kata Kunci
Menekan Enter
Mengisi Data
Menekan Tombol Simpan
Menyimpan Data
Memilih Data
Mengubah Data
Menyimpan Data
Memilih Data
Konfirmasi Penghapusan
Menghapus Data
Tidak
Ya
Pencarian Tambah Ediit Hapus
Gambar III.8. Activity Diagram Mengolah Data Lokasi Toko Majestyk
4. Activity Diagram Mengolah Data Buku Tamu
Aktvitas proses mengolah data Buku Tamu diterangkan dalam langkah-
langkah state yang ditunjukkan pada gambar III.9:
39
Memilih aksi pada form Buku Tamu
Mengisi Data
Menekan Tombol Kirim
Menyimpan Data
Memilih Data
Konfirmasi Penghapusan
Menghapus Data
Tambah Hapus
Tidak
Ya
Gambar III.9. Activity Diagram Mengolah Data Buku Tamu
5. Activity Diagram Melihat Tentang Program
Pada activity diagram About menjelaskan bahwa informasi atau data diri pembuat
program. Adapun Activity Diagram Tentang Program dapat dilihat pada gambar
III.10.
Masuk Menu Utama
Pilih Tentang Program
Lihat Informasi
Tentang Program
Gambar III.10. Activity Diagram Melihat About
40
III.3.4. Sequence Diagram
Rangkaian kegiatan pada setiap terjadi event sistem digambarkan pada
sequence diagram berikut:
1. Sequence Diagram pada Form Jarak Peta
Serangkaian kegiatan saat terjadi event pada form peta dapat dilihat pada
gambar III.11:
Main form Form jarak
Menu ()
click form jarak ()
Koneksi database ()
User
Tampilkan Menu ()
Gambar III.11. Sequence Diagram Form Peta
2. Sequence Diagram pada Form Login
Serangkaian kegiatan saat terjadi event pada form login dapat dilihat pada
gambar III.12 :
41
Main form Form Login Proses Login
Tampilkan Fom ()
Menu ()
click form loginValidasi nama
dan password ()
Login sukses ()
Invalid ()
Halaman Administrator
Administrator Website
Gambar III.12. Sequence Diagram Form Login
3. Sequence Diagram pada Form Data Toko majestyk
Serangkaian kegiatan saat terjadi event pada form Tempat Majestyk dapat
dilihat pada gambar III.13 :
Main form Form Data toko Proses
Tampilkan Fom ()
Menu ()
click form toko ()
update data ()
Administrator Website
Koneksi database ()
Koneksi database ()
delete data ()
Close form ()
toko
Update data toko
Gambar III.13. Sequence Diagram Form Toko Majestyk
4. Sequence Diagram pada Form Data Buku Tamu
42
Serangkaian kegiatan saat terjadi event pada form buku tamu dapat dilihat
pada gambar III.14 :
Main form Form Data Buku Tamu Proses
Tampilkan Fom ()
Menu ()
click form Buku Tamu ()
update data ()
Administrator Website
Koneksi database ()
Koneksi database ()
deletel data ()
Close form ()
Buku tamu
Update data buku tamu
Gambar III.14. Sequence Diagram Form Buku Tamu
5. Sequence Diagram pada Form Tentang Kami
Serangkaian kegiatan saat terjadi event pada form Tentang kami dapat dilihat
pada gambar III.15 :
Main form Form Tentang Kami Proses
Tampilkan Fom ()
Menu ()
click form Tentang Kami ()
Administrator Website
Koneksi database ()
deletel data ()
Close form ()
Koneksi database ()
update data ()
Tentang Kami
Gambar III.15. Sequence Diagram Form Tentang Kami
43
III.4. Desain Database
Desain database terdiri dari tahap merancang kamus data dan melakukan
normalisasi pada tabel.
1. Normalisasi
Normalisasi merupakan sebuah daftar yang terorganisasi dari elemen data
yang berhubungan dengan sistem, dengan definisi yang tepat dan teliti sehingga
pemakai dan analis sistem akan memiliki pemahaman yang umum mengenai
input, output, dan komponen penyimpan. Kamus data penyimpanan sistem yang
akan dirancang dapat dilihat sebagai berikut :
users = ({username} + pass)
toko = ({id_toko} + nama_toko+ long+lat+alamat+photo+telp)
produk= ({id_produk} + nama_produk+ harga + gambar)
jarak = ({id} + titik +titik2+jarak)
bukutamu = ({id } + nama +email+ + komentar)
III.4.1. Desain Tabel
Setelah melakukan tahap normalisasi, maka tahap selanjutnya yang dikerjakan
yaitu merancang struktur tabel pada basis data sistem yang akan dibuat, berikut ini
merupakan rancangan struktur tabel tersebut:
mengenai struktur tabel ini dapat dilihat pada tabel di bawah ini :
Tabel III.2 Rancangan Tabel user Nama Database Elisabet
Nama Tabel User
44
No Nama Field Tipe Data Boleh Kosong Kunci
1. Username varchar(30) Tidak Primary Key
2. Pass varchar(30) Tidak -
Tabel III.3 Rancangan Tabel Jarak
Nama Database Elisabet
Nama Tabel Jarak
No Nama Field Tipe Data Width Kunci
1. Id Int 11 Primary Key
2. Titik Char 25 -
3. titik2 Char 25 -
4. Jarak Float 0 -
Tabel III.4 Rancangan Tabel Toko
Nama Database Elisabet
Nama Tabel Toko
No Nama Field Tipe Data Width Kunci
1. id_toko Int 5 Primary Key
2. Namatoko varchar 255 -
3. Long double 0 -
4. lat double 0 -
5. alamat varchar 255 -
6 photo varchar 255 -
7 telp varchar 20 -
Tabel III.5 Rancangan Tabel Produk
Nama Database Elisabet
Nama Tabel Produk
No Nama Field Tipe Data Width Kunci
1. Id_produk int(5) Tidak Primary Key
45
2. Nama_produk varchar(25) Tidak -
3. harga Int Tidak -
4. Gambar - Tidak -
Tabel III.6. Rancangan Tabel Bukutamu
Nama Database Elisabet
Nama Tabel Bukutamu
No Nama Field Tipe Data Width Kunci
1. id int 11 Primary Key
2. nama varchar 15 -
3. email varchar 15 -
4. komentar text 0 -
III.5. Desain User Interface
Tahap perancangan berikutnya yaitu desain user interface yang meliputi
desain output sistem, desain input sistem, dan desain database.
III.5.1. Desain Output
Berikut ini adalah rancangan tampilan desain peta yang akan dihasilkan
oleh sistem:
1. Rancangan Form Home
Form ini berfungsi untuk menampilkan home Penerapan Metode Djikstra
Pada Sistem Informasi Geografis Rute Jalur Toko Majestyk Berbasis Online,
rancangan dapat dilihat pada gambar berikut :
wahana
Cari berdasarkan
cari
Peta letak wahana permainan
Hill Park Sibolangit
Wisata idaman keluarga anda
Jarak Terdekat
informasi
Gambar
Hub. Kami tentang kami Toko Kami Home Login admin
informasi
46
Gambar III.16. Desain Tampilan Peta
2. Rancangan Form Buku Tamu
Form daftar toko majestyk berfungsi untuk menampilkan informasi –
informasi toko majestyk yang disajikan dalam bentuk tabel, rancangan dapat
dilihat pada gambar berikut :
wahana
Cari berdasarkan
cari
Peta letak wahana permainan
Hill Park Sibolangit
Wisata idaman keluarga anda
Jarak Terdekat
informasi
Gambar
Hub. Kami tentang kami Toko Kami Home Login admin
informasi ID E-mail
Jenis Pertanyaan
Isi pertanyaan
47
Gambar III.17. Desain Tampilan Buku Tamu
3. Rancangan Form Daftar Toko majestyk
Form daftar toko majestyk berfungsi untuk menampilkan informasi –
informasi Toko majestyk Toko majestyk yang disajikan dalam bentuk tabel,
rancangan dapat dilihat pada gambar berikut :
Footer
gambar
Send
wahana
Cari berdasarkan
cari
Peta letak wahana permainan
Hill Park Sibolangit
Wisata idaman keluarga anda
Jarak Terdekat
informasi
Gambar
Hub. Kami tentang kami Toko Kami Home Login admin
informasi
gambar Nama toko: ………………….. Alamat: …………………………. No.telp……………………………
48
Gambar III.18. Desain Tampilan Daftar Toko majestyk
4. Rancangan Form Tentang Kami
Form ini menjelaskan daftar Toko majestyk berfungsi untuk menampilkan
informasi – informasi Toko majestyk, rancangan dapat dilihat pada gambar
berikut :
Footer
gambar
gambar
Nama toko: ………………….. Alamat: …………………………. No.telp……………………………
Nama toko: ………………….. Alamat: …………………………. No.telp……………………………
wahana
Cari berdasarkan
cari
Peta letak wahana permainan
Hill Park Sibolangit
Wisata idaman keluarga anda
Jarak Terdekat
informasi
Gambar
Hub. Kami tentang kami Toko Kami Home Login admin
informasi
gambar
49
Gambar III.19. Desain Tampilan Tentang Kami
5. Rancangan Form Jarak Terdekat
Form daftar Toko majestyk berfungsi untuk menampilkan informasi –
informasi Toko majestyk Toko majestyk yang disajikan dalam bentuk tabel,
rancangan dapat dilihat pada gambar berikut :
Footer
Keterangan tentang Perusahaan :………………………………………………………………………….
wahana
Cari berdasarkan
cari
Peta letak wahana permainan
Hill Park Sibolangit
Wisata idaman keluarga anda
Jarak Terdekat
informasi
Gambar
Hub. Kami tentang kami Toko Kami Home Login admin
informasi
Tentukan Lokasi Awal
50
Gambar III.20. Desain Tampilan Jarak Terdekat
III.5.2. Desain Input
Berikut ini adalah rancangan atau desain input sebagai antarmuka pengguna:
1. Desain Form Login
Desain form login dapat dilihat pada gambar III.21:
Gambar
Username
:
Password :
Login
Footer
Ganti Jenis Peta
Koordinal Long
Koordinal Lat
Cek Rute
51
Gambar III.21. Desain Form Login
2.Tampilan Halaman menu utama Admin
Pada form ini menggambarkan Menu Utama Admin dapat ditunjukkan pada
gambar III.22 berikut ini :
Gambar III.22. Perancangan Halaman Menu Utama Admin
1. Tampilan Menu edit Produk
Hill Park Sibolangit
Wisata idaman keluarga
anda
Gambar
Menu Administrator
Produk
Tambah
Edit
Hapus
Toko
Tambah
Edit
Hapus
Kembali Ke Menu Administrator
Gambar
Edit Produk
Kembali Ke Menu Administrator
52
Gambar III.23. Perancangan Tampilan Menu Edit Produk
2. Tampilan Menu hapus Produk
Gambar
Hapus Data Produk
Nama Produk Harga Gambar Pilih
XXXXX XXXXX XXXXX
XXXXX XXXXX XXXXX
XXXXX XXXXX XXXXX
XXXXX XXXXX XXXXX Hapus
53
Gambar III.24. Perancangan Tampilan Menu Hapus Produk
3. Tampilan Menu Tambah Toko
Gambar
Tambah Data Toko
Kembali Ke Menu Administrator
Pilih
Simpan
Peta
54
Gambar III.25. Perancangan Tampilan Menu Tambah Toko
4. Tampilan Menu Edit Toko
Gambar
Edit Data Toko
Kembali Ke Menu Administrator
Pilih
Simpan
Peta
55
Gambar III.26. Perancangan tampilan menu edit toko
5. Tampilan Menu Hapus Toko
Nama Toko Alamat Gambar Pilih
XXXXX XXXXX XXXXX
XXXXX XXXXX XXXXX
XXXXX XXXXX XXXXX
XXXXX XXXXX XXXXX
XXXXX XXXXX XXXXX
Gambar
Hapus Data Toko
Kembali Ke Menu Administrator
Hapus
56
Gambar III.27. Perancangan tampilan menu hapus toko
57