BAB 3 ANALIS IS DAN PERANCANGAN S OLUS I
3.5
Analisis Permasalahan 3.1.1
Analisis Proses Bisnis Berjalan Pada Aplikasi Sejenis Pada saat ini, terdapat beberapa aplikasi yang juga memanfaatkan teknologi pemetaan data berbasis pet sebagai dasar dari aplikasi, yaitu sebagai alat bantu untuk mencatat dan memetakan data yang dimiliki. Beberapa contoh aplikasi sejenis yang ditemui adalah : 1. www.madani-biz.net Aplikasi ini digunakan oleh salah satu partai politik yang ada di Indonesia. Tujuan utama dari aplikasi ini adalah untuk mencatat persebaran anggota dari partai tersebut dan aplikasi ini juga menjadi framework yang dapat terus menerus berkembang sesuai keinginan user atau pengguna aplikasi.
Gambar 3.1 Tampilan www.madani-biz.net
25
26
Beberapa kekurangan yang terdapat pada aplikasi ini adalah : •
Peta tidak ter-update secara otomatis. Peta masih menggunakan peta manual dan bila ingin meng-update maka administrator dari aplikasi ini harus meng-upload gambar yang baru dan men-tag ulang gambar untuk masing-masing wilayah
•
Untuk pengisian data detail (misalnya nilai dari suatu variabel) maka administrator harus membuka phpmyadmin
2. Library Science oleh Florida State University dan University of Florida Aplikasi ini digunakan oleh Florida State University dan University of Florida sebagai peta yang menampilkan analisa populasi wilayah, demografi, isu pengelolaan fasilitas, distribusi spasial perpusatakaan serta menampilkan atau berfungsi sebagai peta penunjuk arah letak perpustakaan. M enurut peneliti pada Florida State University yang dikutip dalam artikel “Library Science; Data from Florida State University provide new insights into library science”,
contoh
petadisertakanuntukmempermudahpemahamanpenggunatentangkemu ngkinan
–
kemungkinan
yangdiberikandenganmenggunakanGISdalampenelitianLIS and Information Science).
(Library
27
Gambar 3.2 Tampilan Library Science pada University of Florida Kelemahan pada aplikasi ini adalah informasi yang ditampilkan dalam aplikasi ini hanya tentang perpustakaan di University of Florida sehingga tidak memungkinkan penggunaan kembali aplikasi untuk digunakan pada sistem lainnya.
3. CLUES (Cape Land Use Expert System) oleh Dr Adriaan van Niekerk Dr Adriaan van Niekerk, dosen di Jurusan Geologi, Geografi dan Lingkungan Studi di Universitas Stellenbosch, membuat CLUES (Cape Land Use Expert System) sebagai tesis untuk gelar doktoralnya dalam studi geografis dan lingkungan. Sistem pada CLUES ini membuat lebih mudah dan lebih murah untuk para konsultan dan pengambil keputusan untuk menyusun peta kesesuaian lahan. Peta kesesuaian lahan sering digunakan untuk menggambarkan secara visual apakah lahan cocok untuk pengembangan, keperluan pertanian atau untuk kegunaan konservasi.
28
Gambar 3.3 Tampilan aplikasi CLUES Beberapa kekurangan pada aplikasi ini adalah : •
Aplikasi ini dibuat hanya untuk mencatat atau menggambarkan secara visual apakah lahan cocok pengembangan, keperluan pertanian atau untuk kegunaan konservasi. Dengan kata lain, aplikasi ini tidak memungkinkan penggunaan kembali kode untuk aplikasi tidak sejenis lainnya.
•
Aplikasi belum dapat menangani server dalam jumlah yang banyak.
4. MapPoint2010 oleh Microsoft MapPoint
2010
memungkinkan
visualisasi
data
bisnis,
berkomunikasi dengan wawasan yang berdampak cepat dan integrasi peta ke dalam pekerjaan yang dilakukan di dalam Microsoft Office. Beberapa fitur baru pada MapPoint 2010 :
memungkinkan
pengaturan peta untuk memilih detail tampilan, pushpin yang diperluas dan kemampuan untuk mengirimkan rute ke dalam alat GPS
29
(biasanya adalah telepon genggam). M enurut Eichingen (Marketing Manager di OPTI-TIME) dan Fanelli (Vice President of Sales and Marketing di dESCO), MapPoint2010 memungkinkan peningkatan pengambilan keputusan dengan memberikan kejelasan tabular data, mengintegrasikan peta ke dalam pekerjaan yang dilakukan dalam program Microsoft Office dan mengoptimasi perjalanan bisnis dengan fitur perencanaan perjalanan yang efisien.
Gambar 3.4 Pengaturan wilayah pada MapPoint 2010
30
Gambar 3.5 PinPoint Data pada MapPoint 2010 Beberapa kelemahan pada aplikasi ini adalah kurangnya fleksibilitas karena hanya dapat menunjukkan satu jenis data saja (satu kolom di dalam file Excel) dan peta hanya dapat di-update oleh Microsoft saja. Sebagai contoh, bila wilayah bertambah maka Microsoft akan meluncurkan MapPoint yang baru, dari MapPoint 2007 menjadi MapPoint 2010.
3.1.2
Analisis Kuesioner dan Wawancara Pada S tudi Kasus Dari analisis permasalahan yang dihadapi, maka disusunlah kuisioner yang bertujuan agar dapat mengumpulkan informasi dari beberapa perusahaan yang memiliki persebaran data yang tersebar di wilayah – wilayah Indonesia. Untuk pengumpulan data dilakukan dengan cara menyebarkan kuisioner. Populasi kuisioner berjumlah 30 orang dimana merupakan orang yang memiliki jabatan level manager ke atas.
31
Adapun alasan menggunakan kuisioner adalah banyaknya perusahaan besar yang memiliki persebaran di beberapa daerah sehingga untuk menghemat
waktu
pengambilan
informasi
diputuskan
untuk
menggunakan kuisioner. Kuisioner ini diambil pada tanggal 25Februari 2011 . Tabel 3.1 Table Pertanyaan Kuisioner untuk User No Daftar Pertanyaan 1. Berapa lama dalam sehari Anda menggunakan internet? 2. Browser apa yang sering Anda gunakan ketikabrowsing?
Alternatif Jawaban A. 1-4 Jam B. 5-8 Jam C. >8 Jam A. Mozilla Firefox B. Chrome C. Internet Explorer
3.
4.
5.
6.
Apakah perusahaan Anda membutuhkan data( misalnya data penjualan atau data penting lainnya) dari cabang di daerah lain?
A. Ya
Apakah data – data dari cabang lain tersebut mempengaruhi keputusan perusahaan? Apakah perusahaan Anda kesulitan untuk mendapatkan informasi tersebut? Apakah perusahaan Anda sudah menggunakan aplikasipemetaan data berbasis peta ?
A. Ya
B. Tidak
Tujuan dari pertanyaaan Untuk mengetahui tingkat ketergantungan user terhadap internet. Untuk mengetahui kompabilitas browser yang paling sering digunakan untuk menjadi patokan standarisasi. Untuk mengetahui tingkat kebutuhan data perusahaan.
Untuk mengetahui data dari perusahaan cabang benar-benar dibutuhkan
B. Tidak A. Ya
Untuk mengetahui kesulitan yang dialami oleh perusahaan.
B. Tidak
A. Sudah
Untuk mengetahui apakah user sudah menggunakan peta atau belum dalam pemvisualisasian data.
B. Belum
32
No Daftar Pertanyaan 7. M enurut Anda , bentuk data yang seperti apa yang mudah untuk dipahami dalam kuantitas banyak?
Alternatif Jawaban A. Tabel B. Chart C. Peta
Tujuan dari pertanyaaan Untuk mengetahui keinginan tampilan data yang menarik bagi user.
Dari hasil kuisioner tersebut, diperoleh analisa sebagai berikut : 1. Berapa lama dalam sehari Anda menggunakan internet ? 1– 4 jam
4 orang
5– 8 jam
4 orang
> 8 jam
22 orang
2. Berapa lama dalam sehari Anda menggunakan internet? 14% 13%
1 ‐ 4 jam 5 ‐ 8 jam
73%
> 8 jam
Gambar 3.6 Hasil kuisioner pertanyaan “Berapa lama dalam sehari Anda menggunakan internet ?” 2. Browser apa yang sering Anda gunakan ketika browsing ?
M ozilla Firefox
13 orang
Google Chrome
4 orang
Internet Explorer
13 orang
33
3. Browser apa yang sering Anda gunakan pada saat browsing?
43%
44% Mozilla Firefox Google Chrome Internet Explorer
13%
Gambar 3.7 Hasil kuisioner pertanyaan “Browser apa yang sering Anda gunakan ketika browsing ?” 3. Apakah perusahaan Anda membutuhkan data (misalnya data penjualan atau data penting lainnya) dari cabang di daerah lain? Ya
22 orang
Tidak
8 orang
4. Apakah perusahaan Anda membutuhkan data (misalnya data penjualan atau data penting lainnya) dari cabang di daerah lain? 27% Ya 73%
Tidak
34
Gambar 3.8 Hasil kuisioner pertanyaan “Apakah perusahaan Anda membutuhkan data (misalnya data penjualan atau data penting lainnya) dari cabang di daerah lain?” 4. Apakah data – data dari cabang lain tersebut mempengaruhi keputusan perusahaan? Ya
20 orang
Tidak
10 orang
5. Apakah data – data dari cabang lain tersebut mempengaruhi keputusan perusahaan?
33% Ya 67%
Tidak
Gambar 3.9 Hasil Kuisioner pertanyaan “Apakah data – data dari cabang lain tersebut mempengaruhi keputusan perusahaan?” 5. Apakah perusahaan Anda kesulitan untuk mendapatkan informasi tersebut?
Ya
23 orang
Tidak
7 orang
35
6. Apakah perusahaan Anda kesulitan untuk mendapatkan informasi tersebut?
23% Ya Tidak
77%
Gambar 3.10 Hasil Kuisioner pertanyaan “Apakah perusahaan Anda kesulitan untuk mendapatkan informasi tersebut?” 6. Apakah perusahaan Anda sudah menggunakan aplikasipemetaan data berbasis peta ? Sudah
5 orang
Belum
25 orang
7. Apakah perusahaan Anda sudah menggunakan aplikasi berbasis Sistem Informasi Geografis (GIS) ? 17% Sudah Belum
83%
Gambar 3.11 Hasil Kuisioner pertanyaan “Apakah perusahaan Anda sudah menggunakan aplikasipemetaan data berbasis peta ?”
36
7. M enurut Anda, bentuk data seperti apa yang mudah untuk dipahami dalam kuantitas banyak? Tabel
9 orang
Chart
5 orang
Peta
16 orang
8. Menurut Anda, bentuk data seperti apa yang mudah untuk dipahami dalam kuantitas banyak? 30% Tabel
53%
Chart
17%
Gambar
Gambar 3.12 Hasil Kuisioner pertanyaan “M enurut Anda, bentuk data seperti apa yang mudah untuk dipahami dalam kuantitas banyak?”
Dari keseluruhan hasil kuisioner yang diperoleh, maka disusun kesimpulan yang menyatakan bahwa aplikasi pemetaan data berbasis peta dimana peta yang digunakan bila menggunakan koneksi internet tidak akan mengganggu kinerja karyawan. Selain itu, untuk pembacaan data yang dimiliki lebih baik bila menggunakan peta sehingga data – data yang dimiliki di beberapa daerah dapat terlihat dengan jelas.
37
3.6
Analisis Pemecahan Masalah Solusi dari permasalahan yang terjadi di atas adalah dengan membangun aplikasi berbasis web yang dapat dengan cepat mendapatkan informasi dari perusahaan cabang serta menampilkannya dalam bentuk peta agar dapat membantu user lebih mudah dalam memahami data dan pengambilan keputusan.
3.7
Topologi yang Dipakai
Gambar 3.13 Topologi dalam Sistem
38
3.8
Perancangan S olusi Dalam perancangan solusi yang disusun berdasarkan analisis permasalahan yang telah diidentifikasi, aplikasi berbasis website yang akan dibuat diupayakan untuk dapat memecahkan masalah yang sedang dihadapi sekarang . 3.4.4
Perancangan Proses Bisnis Diusulkan Pada S olusi Sistem yang diusulkan untuk sistem terbagi menjadi dua bagian yaitu : front end user dan back end user. Pengguna aplikasi yang melihat data atau melihat pemvisualisasian data adalah front end user. Sedangkan yang menggunakan back end user adalah administratoryang mengerti tentang database sehingga dapat mengolah data yang ada di dalam sistem .
3.4.3
PerancanganUnifieldModellingLanguange (UML) 3.4.3.4 Usecase Diagram Perancangan Usecase dibuat berdasarkan analisa dari aplikasi sejenis. Usecase ini menggambarkan hubungan antara aktor, yaitu administrator dan user terhadap sistem yang akan dibuat.
39
Gambar 3.14 Usecase Diagram yang Diusulkan
40
3.4.3.5 Class Diagram
Gambar 3.15 Class Diagram yang Diusulkan
41
3.4.3.6 Sequence Diagram 3.4.2.3.1. Sequence Manage User Dibawah
ini
merupakan
sequence
diagram
Manage User yang terbagi atas tiga kegiatan yaitu Add User, Edit User dan Delete User. Terdapat serangkaian interaksi antara objek dan pesan dimana objeknya Administrator, Halaman Add User, Halaman Edit User, Halaman Delete User dan Database User saling berinteraksi melalui pesan yang dikirim dan diterima dari setiap objek.
Gambar 3.16 Sequence Manage User
42
3.4.2.3.2. Sequence Manage Page Access Dibawah
ini
merupakan
sequence
diagram
M anage Page Access yang terbagi atas tiga kegiatan yaitu Add Group, Edit Group dan Delete Group dimana terdapat serangkaian interaksi antara objek dan pesan. Dimana objeknya Administrator, Halaman Add Group, Halaman Edit Group, Halaman Delete Group dan Database Group saling berinteraksi melalui pesan – pesan yang dikirim dan diterima dari setiap objek.
Gambar 3.17 Sequence Manage Page Access
43
3.4.2.3.3. Sequence Manage Menu Dibawah
ini
merupakan
sequence
diagram
M anage M enu yang terbagi atas tiga kegiatan yaitu Add Menu,
Edit
Menu
dan
Delete
Menu.
Terdapat
serangkaian interaksi antara objek dan pesan dimana objeknya Administrator, Halaman Add Menu, Halaman Edit Menu, Halaman Delete Menu dan Database Menu saling berinteraksi melalui pesan-pesan yang dikirim dan diterima dari setiap objek.
Gambar 3.18 Sequence Manage Menu
44
3.4.2.3.4. Sequence Manage Location Dibawah
ini
merupakan
sequence
diagram
Manage Location yang terbagi atas tiga kegiatan yaitu Add Location, Edit Location dan Delete Location. Terdapat serangkaian interaksi antara objek dan pesan dimana objeknya Administrator, Halaman Add Location, Halaman Edit Location, Halaman Delete Location dan Database mapLevel saling berinteraksi melalui pesanpesan yang dikirim dan diterima dari setiap objek.
Gambar 3.19 Sequence Manage Location
45
3.4.2.3.5. Sequence Manage State Dibawah
ini
merupakan
sequence
diagram
Manage State yang terbagi atas tiga kegiatan yaitu Add State, Edit State dan Delete State. Terdapat serangkaian interaksi antara objek dan pesan dimana objeknya Administrator, Halaman Add State, Halaman Edit State, Halaman Delete State dan Database detailMap saling berinteraksi melalui pesan-pesan yang dikirim dan diterima dari setiap objek.
Gambar 3.20 Sequence Manage State
46
3.4.2.3.6. Sequence Manage Category Dibawah
ini
merupakan
sequence
diagram
M anage Category yang terbagi atas tiga kegiatan yaitu Add Category, Edit Category dan Delete Category. Terdapat serangkaian interaksi antara objek dan pesan dimana
objeknya
Administrator,
Halaman
Add
Category, Halaman Edit Category, Halaman Delete Category dan Database Category saling berinteraksi melalui pesan-pesan yang dikirim dan diterima dari setiap objek.
Gambar 3.21 Sequence Manage Category
47
3.4.2.3.7. Sequence Manage ProperyData Dibawah
ini
merupakan
sequence
diagram
Manage Property Data yang terbagi atas tiga kegiatan yaitu Add ProperyData, Edit ProperyData dan Delete ProperyData. Terdapat serangkaian interaksi antara objek dan pesan dimana objeknya Administrator, Halaman Add ProperyData, Edit ProperyData, Delete ProperyData
dan
Database
ProperyData
saling
berinteraksi melalui pesan-pesan yang dikirim dan diterima dari setiap objek.
Gambar 3.22 Sequence Manage Property Data
48
3.4.2.3.8. Sequence Update Account Dibawah ini merupakan sequence diagram Update Account. Terdapat serangkaian interaksi antara objek dan pesan dimana objeknya, Halaman UpdateAccount dan Database User saling berinteraksi melalui pesanpesan yang dikirim dan di terima dari setiap objek.
Gambar 3.23 Sequence Update Account Administrator
49
Gambar 3.24 Sequence Update Account User
3.4.2.3.9. Sequence View Data as Arranged Dibawah ini merupakan sequence diagram View Data as Arranged. Terdapat serangkaian interaksi antara objek dan pesan dimana objeknyaUser, Halaman Login, Halaman Home,
Database User,
Database
dan
Menu
Database
Database Group, GroupMap
saling
berinteraksi melalui pesan-pesan yang dikirim dan di terima dari setiap objek.
50
Gambar 3.25 Sequence Data Display as Arranged
3.4.2.3.10. Sequence Download Viewed Data Dibawah ini merupakan sequence diagram Download Viewed Data. Terdapat serangkaian interaksi antara objek dan
pesan
dimana objeknyaUser,
Halaman Home,
Database mapLevel, Database detailMap dan Database propertyData saling berinteraksi melalui pesan-pesan yang dikirim dan di terima dari setiap objek.
51
Gambar 3.26 Sequence Download Viewed Data 3.4.3
Perancangan Database 3.4.3.1 Entity Relationship Diagram
Gambar 3.27 Entity Relation Diagram yang Diusulkan
52
3.4.3.2 S pesifikasi Tabel Setelah perancangan layar selesai, maka selanjutnya dilakukan perancangan database. Perancangan database disusun dengan menggunakan database engine MYSQL . Berikut adalah tabel-tabel yang digunakan : 1. Tabel category Nama Tabel : category Deskripsi: Berisi informasi mengenai kategori-kategori yang ada. Primary Key : categoryId Tabel 3.2 Tabel category No. 1.
Nama Field
Tipe Data
categoryId
Int
Keterangan Primary Key , Auto Increment
2.
level
Int
3.
detail
Varchar(255)
4.
parentCategoryId Int
5.
parentLevel
Int
2. Tabel detailM ap Nama Tabel : detailM ap Deskripsi
: Berisi informasi mengenai map-map yang ada.
Primary Key : mapDataId
53
Tabel 3.3 Tabel detailMap No. 1.
Nama Field
Tipe Data
mapDataId
Keterangan
Int
Primary
Key
,
Auto Increment 2.
mapLevelId
Int
3.
mapDataName
Varchar(50)
4.
LongitudeLatitude Varchar(255)
5.
parentLevelId
Int
6.
parentM apDataId
Int
3. Tabel group Nama Tabel : group Deskripsi
: Berisi informasi mengenai group-group yang ada.
Primary Key : groupId Tabel 3.4 Tabel group No. 1.
Nama Field
Tipe Data
groupId
Keterangan
Int
Primary Key , Auto Increment
2.
groupName
Varchar(50)
3.
menuId
Varchar(255)
4.
userType
Varchar(13)
4. Tabel groupM ap Nama Tabel : groupM ap
54
Deskripsi: Berisi informasi pengaturan group sesuai dengan query yang dimiliki. Primary Key : groupId Tabel 3.5 Tabel groupMap No. 1.
Nama Field
Tipe Data
groupId
Int
Keterangan Primary Key , Auto Increment
2.
menuId
Int
3.
mapLevelId
Int
4.
Syntax
longtext
5.
Place
Varchar(50)
6.
Amout
Varchar(50)
5. Tabel mapLevel Nama Tabel : mapLevel Deskripsi
: Berisi informasi mengenai map-map yang ada.
Primary Key : mapLevelId Tabel 3.6 Tabel mapLevel No. 1.
Nama Field
Tipe Data
mapLevelId
Int
Keterangan Primary Key , Auto Increment
2.
mapLevelName Varchar(50)
3.
Zoom
Int
55
6. Tabel menu Nama Tabel : menu Deskripsi
: Berisi informasi mengenai menu-menu yang ada.
Primary Key : menuId Tabel 3.7 Tabel menu No. 1.
Nama Field
Tipe Data
menuId
Keterangan
Int
Primary
Key
,
Auto Increment 2.
menuName
Varchar(100)
3.
menuLevel
Int
4.
menuParentLevel
Int
5.
menuParentId
Int
7. Tabel propertydata Nama Tabel : propertydata Deskripsi:Berisi informasi mengenai nilai yang ada untuk kategori dan map. Primary Key: mapDataId Tabel 3.8 Tabel propertyData No. 1.
Nama Field
Tipe Data
mapDataId
Keterangan
Int
Primary Increment
2.
categoryId
Int
3.
Amount
Int
Key
,
Auto
56
8. Tabel user Nama Tabel : user Deskripsi
: Berisi informasi mengenai user-user yang ada.
Primary Key : userId Tabel 3.9 Tabel user No. 1.
Nama Field
Tipe Data
userId
Keterangan
Int
Primary Key , Auto Increment
2.
groupId
Int
3.
Username
Varchar(50)
4.
userPassword Varchar(50)
5.
userEmail
Varchar(50)
6.
userPhone
Varchar(15)
7.
userPhoto
Varchar(50)
8.
userType
Varchar(13)
3.4.4 Perancangan S truktur Fungsi/Menu Pada S olusi Untuk mencapai tujuan dari solusi yang telah dirancang, maka dirancanglah fungsi dan menu yang akan digunakan pada aplikasi . Berikut adalah rancangan menu untuk aplikasi yang akan dibuat :
3.4.4.2 Perancangan S truktur Menu
Menu Utama
Home
Access Management
Arrange User’s Page Access View User’s Page Access
User Management
Map Management
State Management
Data Type Management
Property of Data Management
Add User
Add Location
Add State
Add Data Type
Add Property Data
View User
View Location
View State
View Data Type
View Property Data
Account
Change Password
Add Menu View Menu
Gambar 3.28 Perancangan Struktural M enu
57
58
3.4.5 Perancangan Layar (Storyboard) Pada S olusi Berikut ini adalah rancangan layar-layar yang akan ditampilkan : 1. Rancangan Layar Login Berikut rancangan awal untuk login, baik sebagai user maupun Administrator. Login disini berguna untuk mengantarkan user yang akan login sesuai dengan role-nya masing–masing.
Gambar 3.29 Rancangan Layar Login
59
Halaman Administrator 1.
Home Berikut
rancangan
layar
untuk
menu
utama pada bagian
Administrator. Pada bagian Administratorterdiri dari delapan menu utama, yaitu : Home, Access Management, User Management, Map Management, State Management, Data Type Management, Property of Data Management dan Account .
Gambar 3.30 Rancangan Layar Home
60
2.
Access Management Pada bagian Access Management terdiri dari 2 sub-menu yaitu : Arrange User’s Access Page dan Add Menu. 2.1 Rancangan Layar Arrange User’s Access Page Berikut adalah rancangan layar Arrange User’s Access Page. Pada halaman ini, administrator mengatur daerah serta data yang akan ditampilkan pada user.
Gambar 3.31 Rancangan Layar Arrange User’s Access Page
61
2.2 Rancangan Layar View User’s Access Page Berikut adalah rancangan layar View User’s Access Page. Pada halaman ini, administrator dapat melihat group yang telah dibuat.
Gambar 3.32 Rancangan Layar View User’s Access Page 2.3 Rancangan Layar Add Menu Berikut rancangan layar Add Menu. Pada halaman ini, administrator mengatur nama data yang akan terlihat oleh user.
Gambar 3.33 Rancangan Layar Add Menu
62
2.4 Rancangan Layar View Menu Berikut rancangan layar View Menu. Pada halaman ini, administrator
dapat melihat
data nama menu
yang telah
dimasukkan.
Gambar 3.34 Rancangan Layar View Menu 3.
User Management Pada bagian User Management terdiri dari 2 sub-menu yaitu : Add User dan View User.
3.1 Rancangan Layar Add U ser Berikut rancangan layar untuk bagian Add User.User yang telah dibuat oleh administratorakan dapat mengakses bagian user dengan ketentuan–ketentuanyang telah diatur oleh administrator.
63
Gambar 3.35 Rancangan Layar Add User 3.2 Rancangan Layar View User Ini adalah rancangan layar untuk bagian View User.User yang telah dibuat oleh Administratorakan ditampilkan semuanya pada halaman
ini.Administratordapat
mengubah
data
user
dan
menghapus user.
Gambar 3.36 Rancangan Layar View User
64
4.
Map Management Pada bagian Map Management terdiri dari 2 sub-menu yaitu : Add Location dan View Location. 4.1
Rancangan Layar Add Location Ini adalah rancangan layar untuk bagian Add Location. Pada halaman ini administratordapat menambahkan lokasi dan juga dapat melihat lokasi-lokasi yang pernah dibuat sebelumnya .
Gambar 3.37 Rancangan Layar Add Location
4.2
Rancangan Layar View Location Berikut rancangan layar untuk bagian View Location.Lokasi– lokasiyang pernah dibuat oleh administratorsebelumnya akan ditampilkan semuanya pada halaman ini. Administratordapat mengubah data lokasi dan menghapus lokasi.
65
Gambar 3.38 Rancangan Layar View Location 5.
State Management Pada bagian State Management terdiri dari 2 sub-menu yaitu : Add state dan View state . 5.1
Rancangan Layar Add State Berikut
rancangan
layar
untuk
bagian
Add
State.Administratordapat menambah state setelah memilih level
yaitu
:
Add
administratordapat
Location.Setelah mengisi
memilih
nama
level
state-nya
peta terlebih dahulu.Level peta didapat dari menu sebelum nya peta, serta
koordinatlongitude dan lattitude.
66
Gambar 3.39 Rancangan Layar Add State 5.2
Rancangan Layar View State Berikut rancangan layar untuk bagian View State.State–state yang
sudah
dibuat
oleh
administratorsebelumnya
akan
ditampilkan semua pada bagian ini. Administratordapat mengubah data state dan menghapus state .
Gambar 3.40 Rancangan Layar View State
67
6.
Data Type Pada bagian Data Type terdiri dari 2 sub-menu yaitu : Add Data Type dan View Data Type. 6.1
Rancangan Layar Add Data Type Berikut
rancangan
layar
untuk
bagian
Add
Data
Type.Administratordapat menambah kategori setelah memilih urutan kategori terlebih dahulu, dimana jika memilih urutan kategorinya satu, maka hanya muncul deskripsi. Sedangkan jika memilih urutan dua atau seterusnya maka akan muncul selectbox untuk memilih kategori ini berasal dari parent yang mana.
Gambar 3.41 Rancangan Layar Add Data Type (sebelum terdapat data)
68
Gambar 3.42 Rancangan Layar Add Data Type (sesudah terdapat data) 6.2
Rancangan Layar View Data Type Berikut
rancangan
layar
Type.Kategori–kategoriyang
untuk sudah
bagian
View
dibuat
Data oleh
administratorsebelum nya akan ditampilkan semua pada bagian ini. Administratordapat mengubah data kategori dan menghapus kategori .
69
Gambar 3.43 Rancangan Layar View Data Type 7.
Property of Data Management Pada bagian Property of Data Management terdiri dari 2 sub-menu yaitu: Add Property of Data Management dan View Property of Data Management. 7.1
Rancangan Layar Add Property Of Data Management Berikut rancangan layar untuk bagian Add Property of Data Mangement. Halaman inimenungkinkan administrator untuk memasukkan nilai ke dalam nama state dan kategori. Nama state dan kategori yang ditampilkan pada halaman ini sudah merupakan kategori dan state dengan level paling rendah.
Gambar 3.44 Rancangan Layar Add Property of Data Management
70
7.2
Rancangan Layar View Property Of Data Management Berikut rancangan layar untuk bagian View Property of Data Mangement. Halaman ini menampilkan nama state, kategoriserta jumlahnya.Administratordapat mengubahdan atau pun menghapus nilainya.
Gambar 3.45 Rancangan Layar View Property of Data
Management 8.
Account 8.1
Rancangan Layar Edit Account Berikut
rancangan
passwordadministratoryang
layar
untuk
mengubah
digunakan
oleh
administratorsebelumnya.
71
Gambar 3.46 Rancangan Layar Edit Account
Halaman User Berikut ini adalah rancangan layar jika pengguna login dengan role sebagai user. 1.
Rancangan Layar U ser. Berikut adalah rancangan layar user. Pada halaman ini akan ditampilkan data – data yang telah diatur oleh administrator untuk
ditampilkan pada halaman user. Data – data akan ditampilkan dalam bentuk peta, chart dan tabel.
Gambar 3.47 Rancangan Layar User
72
3.5
S tate Transision Diagram(S TD)
Login
Aksi : Klik Button Login Reaksi : Muncul Halaman Home
Aksi : Klik Button Login Reaksi : Muncul Halaman Home
Login
Home
Gambar 3.48 STD Halaman Login Halaman login dapat diakses oleh semua jenis user, baik oleh administrator maupun user biasa. User akan dibawa ke halaman sesuai dengan jenis usernya bila melakukan penginputan data, yaitu username dan password dengan benar. Bila salah, akan kembali ke halaman login dengan pesan kesalahan.
Halaman Admin Halaman Home administrator terdiri dari menu-menu yang harus diklik
terlebih dahulu agar dapat melihat detail menu yang tersedia. M enu-menu tersebut adalah menu Home, Access Mangement, User Management, Map Management, State Management, Data Type Management, Property of data Management dan Account.
Aksi : Klik Button Menu Home
Aksi : Klik Button Menu
Home
State Management
Reaksi : Muncul Halaman
Reaksi : Muncul Menu
State Management
State Management
Access Management
Aksi : Klik Button Menu Access Management
Aksi : Klik Button Menu Data Type Management
Reaksi : Muncul Menu Access Management
Reaksi : Muncul Menu
Home
User Management
Data Type Management
Aksi : Klik Button Menu
Aksi : Klik Button Menu
User Management Reaksi : Muncul Menu
P roperty of Data Management
User Management
Reaksi : Muncul Menu P roperty of Data Management
Map
Aksi : Klik Button Menu Map Management
Aksi : Klik Button Menu Account
Management
Reaksi : Muncul Menu
Reaksi : Muncul Menu Account
Map Management
Data Type Management
P roperty of Data Management
Account
73
Gambar 3.49 STD Halaman HomeAdministrator
74 Arrange User’s Access P age
View User’s Access P age
Aksi : Klik dropdown
Aksi : Klik dropdown
Access Management
Access Management
Reaksi : Muncul menu
Reaksi : Muncul menu
Access Management Aksi : Klik Dropdown Access Management
Aksi : Klik Dropdown Access Management
Reaksi : Muncul Menu
Reaksi : Muncul Menu
Add Menu
View Menu
Gambar 3.50 STD M enu Access Management M enu Access Management berisi kumpulan menu-menu yang berhubungan dengan pengaturan hak akses halaman user. Terdiri dari empat menu yaitu : Arrange User’s Page Access, View User’s Page Access, Add Menu dan View Menu.
Arrange User’s Access P age
Aksi : Klik Menu Arrange User’s Access P age Reaksi : Muncul Halaman Arrange User’s Access P age Arrange User’s Access P age
Gambar 3.51 STD M enu Arrange User’s Page Access
75
Bila menu Arrange User’s Page Access diklik maka akan terbuka halaman Arrange User’s Page Access. Arrange User’s Access P age
Aksi : Klik Button Arrange
Aksi : Klik Button Arrange
User’s Access P age Reaksi : Muncul Halaman Arrange User’s Access P age Dengan P esan Error Bila Gagal
User’s Access P age Reaksi : Muncul Halaman Arrange User’s Access P age Dengan P esan Berhasil Bila Berhasil
Arrange User’s Access P age Dengan P esan Error
Arrange User’s Access P age Dengan P esan Sukses
Gambar 3.52 STD Halaman Arrange User’s Page Access Halaman Arrange User’s Page Access berfungsi untuk membuat suatu group yang berisi user – user yang diinginkan untuk masuk ke dalam grup ini dan juga berisi menu – menu yang nantinya akan diakses oleh user. Bila validasi sudah terpenuhi semua maka akan kembali ke halaman Arrange User’s Page Access dengan pesan sukses. Sebaliknya, bila ada validasi yang tidak terpenuhi
maka akan kembali ke halaman Arrange User’s Page Access dengan pesan error.
76
View User’s Access P age
Aksi : Klik Menu View User’s Access P age Reaksi : Muncul Halaman View User’s Access P age
View User’s Access P age
Gambar 3.53 STD M enu View User’s Page Access Bila menu View User’s Page Access diklik maka akan terbuka halaman Arrange View User’s Page Access.
View User’s Access P age
Aksi : Klik Nama Group Yang Ingin Dilihat Reaksi : Muncul Halaman Group Detail
View Group Detail
Gambar 3.54 STD Halaman View User’s Page Access Pada halaman View User’s Page Access akan berisi semua daftar grup yang dimiliki dan bila salah satu grup diklik maka akan dioper ke halaman View Group Detail.
77 View Group Detail
Aksi : Klik Button Edit
Aksi : Klik Button Delete P age Access Reaksi : Muncul Halaman View User’s Access P age
P age Access Reaksi : Muncul Halaman Edit P age Access
Edit P age Access
View User’s Access P age
Gambar 3.55 STD Halaman View Group Detail Halaman ini berisi detail-detail dari grup yang dipilih dan terdapat pilihan tombol “Edit Page Access” dan “Delete Page Access”. Bila tombol “Edit Page Access” yang ditekan maka akan diarahkan ke halaman Edit Page Access. Bila tombol “Delete Page Access” yang ditekan maka grup yang dipilih akan terhapus dan langsung diarahkan ke halaman View User’s Page Access.
Edit P age Access Aksi : Klik Button Arrange
Inputer Access P ages Reaksi : Muncul Halaman Edit P age Access Dengan P esan Error Bila Gagal
Inputer Access P ages Reaksi : Muncul Halaman View Group Detail Bila Berhasil
Edit P age Access Dengan P esan Error
Aksi : Klik Button Arrange
View Group Detail
Gambar 3.56 STD Halaman Edit Page Access Halaman ini memungkinkan administrator untuk mengedit data grup. Bila validasi terisi dengan benar maka akan diarahkan ke View Group Detail dengan
78
data yang sudah teredit. Sebaliknya, bila validasi data tidak terpenuhi maka akan diarahkan kembali ke halaman Edit Page Access dengan pesan kesalahan.
Add Menu Aksi : Klik Menu Add Menu Reaksi : Muncul Halaman Add Menu Add Menu
Gambar 3.57 STD M enu Add Menu Bila Add Menu ditekan maka akan terbuka halaman Add Menu. Add Menu
Aksi : Klik Button Add Menu
Aksi : Klik Button Add Menu
Reaksi : Muncul Halaman Add Menu Dengan P esan Error Bila Gagal
Reaksi : Muncul Halaman Add Menu Dengan P esan Berhasil Bila Berhasil
Add Menu
Add Menu
Gambar 3.58 STD Halaman Add Menu Halaman ini memungkinkan user untuk membuat menu yang nantinya akan dipakai administrator untuk mengisi data saat pembuatan grup. Bila validasi terisi dengan benar maka akan muncul pesan sukses di halaman Add menu. Sebaliknya, bila validasi tidak terisi dengan benar maka akan muncul pesan kesalahan pada halaman Add Menu.
79
View Menu Aksi : Klik Menu View Menu Reaksi : Muncul Halaman View Menu View Menu
Gambar 3.59 STD M enu View Menu Bila View Menu ditekan maka akan terbuka halaman View Menu.
View Menu Aksi : Klik Menu Yang Ingin Dilihat Reaksi : Muncul Halaman View Detail Menu View Menu Detail
Gambar 3.60 STD Halaman View Menu Halaman ini berisi daftar menu-menu yang tersedia. Bila salah satu menu
ditekan maka akan terbuka halaman View Menu Detail.
View Menu Detail
Aksi : Klik Button Edit Menu Reaksi : Muncul Halaman Edit Menu
Edit Menu
Aksi : Klik Button Delete Menu Reaksi : Muncul Halaman View Menu
View Menu
Gambar 3.61 STD Halaman View Menu Detail
80
Halaman ini berisi detail dari menu yang dipilih. Terdapat dua pilihan tombol yang dapat dipilih yaitu “Edit Menu” dan “Delete Menu”. Bila tombol “Edit Menu” yang dipilih maka akan terbuka halaman Edit Menu. Bila tombol “Delete Menu” maka menu akan terhapus dan akan diarahkan kembali ke halaman View Menu.
Edit Menu
Aksi : Klik Button Edit Aksi : Klik Button Cancel
Menu Reaksi : Muncul Halaman Edit Menu Dengan P esan Error Bila Gagal
Reaksi : Muncul Halaman View Menu
Edit Menu
View Menu Detail
Aksi : Klik Button Delete Menu Reaksi : Muncul Halaman View Menu Dengan P esan Sukses View Menu Detail Dengan P esan Sukses
Gambar 3.62 STD Halaman Edit Menu Halaman ini memungkinkan administrator untuk mengedit nama menu yang dipilih. Bila validasi terisi dengan benar maka akan diarahkan ke View Menu Detail dengan data yang sudah diganti dan pesan sukses. Sebaliknya, bila validasi data tidak terpenuhi maka akan diarahkan kembali ke halaman Edit Menu dengan pesan kesalahan. Bila tombol Cancel yang dipilih maka tidak akan terjadi apa pun pada datanya dan akan diarahkan ke halaman view Menu Detail.
81 User Management
Aksi : Klik Dropdown User Management
Aksi : Klik Dropdown User Management
Reaksi : Muncul Menu
Reaksi : Muncul Menu
User Management
User Management Add User
View User
Gambar 3.63 STD M enu User Management M enu User Management berisi kumpulan menu – menu yang berhubungan dengan pengaturan user. Terdiri dari dua menu yaitu : Add User dan View User.
Add User Aksi : Klik Menu Add User Reaksi : Muncul Halaman Add User Add User
Gambar 3.64 STD M enu Add User M enu Add User bila ditekan akan terbuka halaman Add User.
82 Add User
Aksi : Klik Button Add User
Aksi : Klik Button Add User
Reaksi : Muncul Halaman Add User Dengan P esan Error Bila Gagal
Reaksi : Muncul Halaman Add User Dengan P esan Berhasil Bila Berhasil
Add User
Add User
Gambar 3.65 STD Halaman Add User Halaman Add User ini mengatur tentang penambahan user pada sistem. Bila validasi telah terisi dengan benar maka akan muncul pesan sukses pada halaman Add User. Sebaliknya, bila validasi tidak terisi dengan benar maka akan muncul pesan kesalahan di halaman.
View User Aksi : Klik Menu View User
Reaksi : Muncul Halaman View User View User
Gambar 3.66 STD M enu View User Bila menu View User ditekan, maka akan diarahkan ke halaman View User.
83 View User
Aksi : Klik Button Edit Aksi : Klik Button Delete
User Reaksi : Muncul Halaman
Reaksi : Muncul Halaman View User dengan P esan Sukses Bila Berhasil
Edit User
Edit User
View User
Gambar 3.67 STD Halaman View User Halaman View User berisi daftar – daftar dari user. Pada halaman ini terdapat dua pilihan tombol yaitu “Edit” dan “Delete”. Bila tombol “Edit” ditekan maka akan diarahkan ke halaman EditUser. Bila tombol “Delete” ditekan maka user yang dihapus akan hilang dari daftar dan muncul pesan sukses pada halaman.
Edit User
Aksi : Klik Button Edit Aksi : Klik Button Delete Reaksi : Muncul Halaman Edit User dengan P esan Sukses Bila Berhasil
Edit User
User Reaksi : Muncul Halaman Edit User dengan P esan Error Bila Gagal
Edit User
Gambar 3.68 STD Halaman Edit User Halaman ini memungkinkan administrator untuk mengubah detail user yang dipilih. Bila validasi terisi dengan benar maka akan muncul pesan sukses pada halaman. Sebaliknya, bila validasi data tidak terpenuhi maka akan muncul pesan kesalahan di halaman tersebut.
84
Map Management
Aksi : Klik Dropdown Map Location
Aksi : Klik Dropdown Map Location
Reaksi : Muncul Menu Map Location
Reaksi : Muncul Menu Map Location
Add Location
View Location
Gambar 3.69 STD M enu Map Management M enu Map Management berisi kumpulan menu – menu yang berhubungan dengan pengaturan tipe wilayah (misalnya : provinsi, kabupaten, kota dan sebagainya). Terdiri dari dua menu yaitu : Add Location dan View Location.
Add Location Aksi : Klik Menu Add Location Reaksi : Muncul Halaman
Add Location Add Location
Gambar 3.70 STD M enu Add Location Bila menu Add Location ditekan, maka akan diarahkan ke halaman AddLocation.
85 Add Location
Aksi : Klik Button Add
Aksi : Klik Button Add
Reaksi : Muncul Halaman Add Location dengan P esan Error Bila Gagal
Reaksi : Muncul Halaman Add Location dengan P esan Sukses Bila Berhasil
Add Location
Add Location
Gambar 3.71 STD Halaman Add Location Halaman AddLocation ini mengatur tentang penambahan lokasi atau penambahan tipe wilayah. Bila validasi telah terisi dengan benar maka akan muncul pesan sukses pada halaman Add Location. Sebaliknya, bila validasi tidak terisi dengan benar maka akan muncul pesan kesalahan di halaman tersebut.
View Location Aksi : Klik Menu Reaksi : Muncul Halaman View Location
View Location
Gambar 3.72 STD M enu View Location Bila menu View Location ditekan, maka akan diarahkan ke halaman View Location.
86 View Location
Aksi : Klik Button Edit
Aksi : Klik Button Delete
Reaksi : Muncul Halaman
Reaksi : Muncul Halaman Edit User dengan P esan Sukses Bila Berhasil
Edit Location
Edit Location
View Location
Gambar 3.73 STD Halaman View Location Halaman View Location berisi daftar – daftar lokasi yang dimiliki. Pada halaman ini terdapat dua pilihan tombol yaitu “Edit” dan “Delete”. Bila tombol “Edit” ditekan maka akan diarahkan ke halaman Edit Location. Bila tombol “Delete” ditekan maka user yang dihapus akan hilang dari daftar dan muncul pesan sukses pada halaman tersebut.
Edit Location
Aksi : Klik Button Edit
View Location
Reaksi : Muncul Halaman View Location dengan P esan Sukses Bila Berhasil
Map Level Reaksi : Muncul Halaman View Location dengan P esan Error Bila Gagal
Aksi : Klik Button Edit Map Level
View Location
Gambar 3.74 STD Halaman Edit Location Halaman ini memungkinkan administrator untuk mengedit nama lokasi yang dipilih. Bila validasi terisi dengan benar maka akan muncul pesan sukses pada halaman. Sebaliknya, bila validasi data tidak terpenuhi maka akan muncul pesan kesalahan di halaman tersebut.
87 State Management
Aksi : Klik Dropdown State Location
Aksi : Klik Dropdown State Location Reaksi : Muncul Menu State Location
Reaksi : Muncul Menu State Location
Add State
View State
Gambar 3. 75 STD M enu State Management M enu State Management berisi kumpulan menu-menu yang berhubungan dengan pengaturan user. Terdiri dari dua menu yaitu : Add State dan View State.
Add State Aksi : Klik Menu Add State Reaksi : Muncul Halaman Add State Add State
Gambar 3.76 STD M enu Add State Bila menu Add State ditekan, maka akan diarahkan ke halaman Add State.
88 Add State
Aksi : Klik Button Add
Aksi : Klik Button Add
Location Reaksi : Muncul Halaman Add State dengan P esan Error Bila Gagal
Location Reaksi : Muncul Halaman Add State dengan P esan Sukses Bila Berhasil
Add State
Add State
Gambar 3.77 STD Halaman Add State Halaman Add State ini mengatur tentang penambahan isi dari wilayah atau isi dari tipe wilayah (M edan diisi pada kota di provinsi Sumatera Utara). Bila validasi telah terisi dengan benar maka akan muncul pesan sukses pada halaman Add State. Sebaliknya, bila validasi tidak terisi dengan benar maka akan muncul pesan kesalahan di halaman tersebut.
View State Aksi : Klik Menu View State
Reaksi : Muncul Halaman View State View State
Gambar 3.78 STD M enu View State Bila menu View State ditekan, maka akan diarahkan ke halaman View State.
89 View State
Aksi : Klik Button Edit
Aksi : Klik Button Delete
Reaksi : Muncul Halaman
Reaksi : Muncul Halaman View State dengan P esan Sukses Bila Berhasil
Edit Map
Edit Map
View State
Gambar 3.79 STD Halaman View State Halaman View State berisi daftar – daftar state yang dimiliki. Pada halaman ini terdapat dua pilihan tombol yaitu “Edit” dan “Delete”. Bila tombol “Edit” ditekan maka akan diarahkan ke halaman Edit Map. Bila tombol “Delete” ditekan maka user yang dihapus akan hilang dari daftar dan muncul pesan sukses pada halaman tersebut.
Edit Map
Aksi : Klik Button Edit
Aksi : Klik Button Edit Map Name Reaksi : Muncul Halaman Edit Map dengan P esan Sukses Bila Berhasil
Edit Map
Map Name Reaksi : Muncul Halaman Edit Map dengan P esan Error Bila Gagal
Edit Map
Gambar 3.80 STD Halaman Edit Map Halaman ini memungkinkan administrator untuk mengedit nama peta atau nama dari wilayah yang dipilih. Bila validasi terisi dengan benar maka akan muncul pesan sukses pada halaman. Sebaliknya, bila validasi data tidak terpenuhi maka akan muncul pesan kesalahan di halaman tersebut.
90 Data Type Management
Aksi : Klik Dropdown Aksi : Klik Dropdown
Data Type Management
Data Type Management Reaksi : Muncul Menu Reaksi : Muncul Menu
Data Type Management
Data Type Management Add Data Type
View Data Type
Gambar 3.81 STD Data Type Management M enu Data Type Management berisi kumpulan menu-menu yang berhubungan dengan pengaturan tipe – tipe data (misalnya : Pria, Wanita dan sebagainya). Terdiri dari dua menu yaitu : Add Data Type dan View Data Type.
Add Data Type Aksi : Klik Menu Add Data Type Reaksi : Muncul Halaman Add Data Type Add Data Type
Gambar 3.82 STD M enu Add Data Type Bila menu Add Data Type ditekan, maka akan diarahkan ke halaman Add Data Type.
91 Add Data Type
Aksi : Klik Button Add Category
Aksi : Klik Button Add Category
Reaksi : Muncul Halaman Add Data Type dengan P esan Error Bila Gagal
Reaksi : Muncul Halaman Add Data Type dengan P esan Sukses Bila Berhasil
Add Data Type
Add Data Type
Gambar 3.83 STD Halaman Add Data Type Halaman Add Data Type ini mengatur tentang penambahan tipe – tipe data. Bila validasi telah terisi dengan benar maka akan muncul pesan sukses pada halaman Add Data Type. Sebaliknya, bila validasi tidak terisi dengan benar maka akan muncul pesan kesalahan di halaman tersebut.
View Data Type Aksi : Klik Menu View Data Type Reaksi : Muncul Halaman View Data Type
View Data Type
Gambar 3.84 STD M enu Add Data Type Bila menu View Data Type ditekan, maka akan diarahkan ke halaman View Data Type.
92 View Data Type
Aksi : Klik Button Edit
Aksi : Klik Button Delete
Reaksi : Muncul Halaman
Reaksi : Muncul Halaman View Data Type dengan P esan Sukses Bila Berhasil
Edit Category
Edit Category
View Data Type
Gambar 3.85 STD Halaman View Data Type Halaman View Data Type berisi daftar – daftar tipe data yang dimiliki. Pada halaman ini terdapat dua pilihan tombol yaitu “Edit” dan “Delete”. Bila tombol “Edit” ditekan maka akan diarahkan ke halaman Edit Category. Bila tombol “Delete” ditekan maka user yang dihapus akan hilang dari daftar dan muncul pesan sukses pada halaman tersebut.
Edit Category
Aksi : Klik Button Edit
Category Reaksi : Muncul Halaman Edit Category dengan P esan Error Bila Gagal
Category Reaksi : Muncul Halaman Edit Category dengan P esan Sukses Bila h il
Edit Category
Aksi : Klik Button Edit
Edit Category
Gambar 3.86 STD Halaman Edit Category Halaman ini memungkinkan administrator untuk mengedit nama kategori yang dipilih. Bila validasi terisi dengan benar maka akan muncul pesan sukses pada halaman. Sebaliknya, bila validasi data tidak terpenuhi maka akan muncul pesan kesalahan di halaman tersebut.
93 P roperty of Data Management
Aksi : Klik Dropdown P roperty Of Data
Aksi : Klik Dropdown P roperty Of Data Reaksi : Muncul Menu P roperty Of Data Management
Reaksi : Muncul Menu P roperty Of Data Management
Add P roperty of Data Management
View P roperty of Data Management
Gambar 3.87 STD M enu Property of Data Management M enu Property of Data M anagement berisi kumpulan menu-menu yang berhubungan dengan pengaturan user. Terdiri dari dua menu yaitu : Add Property of Data Management dan View Property of Data Management.
Add P roperty of Data Management Aksi : Klik Menu Add P roperty Of Data Management
Add P roperty of Data Management
Reaksi : Muncul Halaman Add P roperty Of Data Management
Gambar 3.88 STD M enu Add Property of Data Management Bila menu Add Property of Data Management ditekan, maka akan diarahkan ke halaman Add Property of Data Management.
94 Add P roperty of Data Management Aksi : Klik Button Add Value
Aksi : Klik Button Add Value
Reaksi : Muncul Halaman Add P roperty of Data Management dengan P esan Error Bila Gagal
Reaksi : Muncul Halaman Add P roperty of Data Management dengan P esan Sukses Bila Berhasil
Add Data Type
Add P roperty of Data Management
Gambar 3.89 STD Halaman Property of Data Management Halaman Add Property of Data Management ini mengatur tentang penambahan isi data. Bila validasi telah terisi dengan benar maka akan muncul pesan sukses pada halaman Add Property of Data Management. Sebaliknya, bila validasi tidak terisi dengan benar maka akan muncul pesan kesalahan di halaman tersebut.
View P roperty of Data Management
View P roperty of Data Management
Aksi : Klik Menu View P roperty Of Data Management Reaksi : Muncul Halaman View P roperty Of Data Management
Gambar 3.90 STD M enu View Property of Data Management Bila menu View Property of Data Management ditekan, maka akan diarahkan ke halaman View Property of Data Management.
95 View P roperty of Data
Aksi : Klik Button Edit
Aksi : Klik Button Delete
Reaksi : Muncul Halaman
Reaksi : Muncul Halaman View P roperty of Data Management dengan P esan Sukses Bila Berhasil
Edit P roperty of Data
Edit P roperty of Data
View Data Type Dengan P esan Sukses
Gambar 3.91 STD Halaman View Property of Data Halaman View Property of Data berisi daftar – daftar is i data yang dimiliki. Pada halaman ini terdapat dua pilihan tombol yaitu “Edit” dan “Delete”. Bila tombol “Edit” ditekan maka akan diarahkan ke halaman Edit Property of Data. Bila tombol “Delete” ditekan maka user yang dihapus akan hilang dari daftar dan muncul pesan sukses pada halaman tersebut.
Edit Property of Data
Aksi : Klik Button Edit
Edit P roperty of Data Dengan P esan Error
Value Reaksi : Muncul Halaman Edit P roperty of Data dengan P esan Error Bila Gagal
Aksi : Klik Button Edit Value Reaksi : Muncul Halaman Edit P roperty of Data dengan P esan Sukses Bila Berhasil Edit P roperty of Data Dengan P esan Sukses
Gambar 3.92 STD Halaman Edit Property of Data Halaman ini memungkinkan administrator untuk mengedit isi dari data yang dipilih. Bila validasi terisi dengan benar maka akan muncul pesan sukses
96
pada halaman. Sebaliknya, bila validasi data tidak terpenuhi maka akan muncul pesan kesalahan di halaman tersebut.
Account
Aksi : Klik Dropdown Account Reaksi : Muncul Menu Account
Edit P assword
Gambar 3.93 STD M enu Account M enu Account berisi kumpulan menu-menu yang berhubungan dengan akun. Hanya terdiri dari satu menu yaitu : Edit Password.
Edit P assword
Aksi : Klik Menu Edit P assword
Reaksi : Muncul Halaman Edit P assword Edit P assword
Gambar 3.94 STD M enu Edit Password Bila menu Edit Password ditekan, maka akan diarahkan ke halaman Edit Password.
97 Edit P assword
Aksi : Klik Button Update
Aksi : Klik Button Update Reaksi : Muncul Halaman Edit P assword dengan P esan Sukses Bila Berhasil
Reaksi : Muncul Halaman Edit P assword dengan P esan Error Bila Gagal Edit P assword Dengan P esan Error
Edit P assword Dengan P esan Sukses
Gambar 3.95 STD Halaman Edit Password Halaman ini memungkinkan administrator untuk mengubah kata sandi yang dimiliki oleh administrator. Bila validasi terisi dengan benar maka akan muncul pesan sukses pada halaman. Sebaliknya, bila validasi data tidak terpenuhi maka akan muncul pesan kesalahan di halaman tersebut. Halaman User Pada halaman ini, user harus mengeklik menu untuk melihat data – data yang dimiliki. Setelah menu diklik maka data akan muncul dalam bentuk peta, chart dan grafik.
Menu
Chart
Aksi : Masuk Home
Aksi : Klik Menu
Reaksi : Mucul Menu Menu Yang Dimiliki
Reaksi : Muncul Chart berdasarkan data dari menu Home
Aksi : Klik Menu Reaksi : Muncul P eta Berdasarkan Data Dari Menu Yang Dimiliki
Aksi : Klik menu Reaksi : Muncul Tabel berdasarkan data dari menu yang dimiliki
Map
Table
Gambar 3.96 STD Halaman User
