BAB III ANALISIS DAN PERANCANGAN SISTEM

BAB III ANALISIS DAN PERANCANGAN SISTEM

3.1 Analisis Sistem

Tahap pertama yang dilakukan agar bisa menghasilkan suatu sistem yang baik adalah dengan mempelajari dan menganalisa sistem yang sedang berjalan di Pesona Rental Mobil, yaitu dengan meneliti hal-hal yang berhubungan dengan proses pemesanan sewa mobil saat ini.

3.1.1

Analisis Masalah

Mengindentifikasi masalah merupakan langkah awal yang dilakukan dalam tahap analisis sistem. Masalah dapat didefinisikan sebagai suatu pertanyaan yang diinginkan untuk dipecahkan. Masalah inilah yang menyebabkan sasaran dari sistem tidak tercapai. Langkah awal yang harus dilakukan pada tahap ini adalah mengidentifikasi terlebih dahulu masalah-masalah yang terjadi. Berdasarkan hasil penelitian yang dilakukan di Pesona Rental Mobil, masih terdapat masalah dalam sistem pemesanan sewa mobil, yang nantinya akan dijadikan acuan atau landasan usulan perancangan sistem yang baru. Permasalan tersebut antara lain : 1. Pada saat proses transaksi pemesanan sewa mobil pada Pesona Rental Mobil belum terkomputerisasi, hal ini menyebabkan kesulitan dalam bertransaksi sewa mobil maupun dalam hal laporan 2. Pada proses pemesanan sewa mobil dalam pengerjaannya belum optimal, karena untuk penyimpanan datanya belun berstruktur dengan baik.

19

20

3.1.2

Analisis Prosedur Sistem Yang Sedang Berjalan

Di dalam analisis ini dijelaskan tentang urutan dari tahapan-tahapan yang menerangkan prosedur tentang pemesanan sewa mobil. Prosedur yang sedang berjalan pada saat ini adalah sebagai berikut: 1. Pelanggan melalui telepon atau datang langsung ke Pesona Rental Mobil menanyakan stok mobil yang tersedia. 2. Pihak rental akan mengecek stok mobil, bila ada maka pelanggan dapat melakukan pemesanan terhadap mobil yang ingin disewa, tetapi bila tidak ada maka pelanggan memilih mobil yang tersedia atau yang diinginkan. 3. Setelah mobil ada maka pelanggan mengisi formulir yang disediakan pihak rental. 4. Kemudian pihak rental akan mengecek kelengkapan dari formulir pelanggan, setelah semua lengkap maka akan dibuatkan kuitansi pembayaran 5. Pelanggan membayar kuitansi sewa mobil Pelanggan

Pihak Rental

Menanyakan stok mobil Mengecek stok mobil Tidak Mobil telah dipesan

Pemilihan ulang mobil

Ya

Mobil yang disewa ada

Mengisi formulir

Mengecek formulir

Membayar sewa

Menulis kuitansi sewa

Gambar 3.1 Activity diagram pemesanan sewa mobil

21

3.1.3

Analisis Kebutuhan Fungsional Pengembangan Sistem

Analisis ini menggambarkan proses kegiatan yang akan diterapkan dalam sistem dan menjelaskan kebutuhan yang diperlukan agar sistem dapat berjalan dengan baik serta sesuai dengan kebutuhan sistem pemesanan sewa mobil. Analisis yang dilakukan dengan menggunakan UML (Unified Modeling language).

Tahapan

pemodelan

dalam

analisis

tersebut

antara

lain

mengidentifikasi aktor, pembuatan Use Case Diagram, Use Case Scenario, Sequence Diagram, Activity Diagram.

3.1.3.1 Identifikasi Aktor

Aktor-aktor yang terlibat pada sistem rental mobil ada 3 aktor yaitu pelanggan (member), pengunjung web (non member) dan admin

Tabel 3.1 Identifikasi Aktor

Aktor Admin

Keterangan Mempunyai hak akses untuk tambah data kendaraan, mengelola status order, mengelola status kendaraan, mengelola status pembayaran, melihat laporan

Pelanggan atau member

Melihat informasi daftar kendaraan yang disewa, melakukan pemesanan sewa mobil

Pengunjung web

Melihat informasi daftar kendaraan yang disewa, tambah daftar member

3.1.3.2 Use Case Diagram

Use Case Diagram adalah diagram yang menunjukan fungsionalitas yang diharapkan dari sebuah sistem. Use case mendeskripsikan hubungan yang terjadi antar aktor dengan aktivitas yang terdapat pada sistem. Dari identifikasi aktor

22

yang terlibat diatas maka Use Case Diagram untuk pemesanan sewa mobil dapat digambarkan pada gambar 3.2 di bawah ini:

Sistem Memesan mobil

Mengelola data kendaraan

Pelanggan <> <>

Login

Melihat status order

<> <>

Melihat informasi mobil

Mendaftar jadi member

Mengelola status pembayaran

Admin

Mengelola Status kendaraan

Melihat laporan

Pengunjung

Gambar 3.2 Use case diagram pemesanan sewa mobil

3.1.3.3 Use case Scenario

Use Case Scenario bertujuan untuk mendeskripsikan urutan langkah-langkah dalam proses bisnis baik yang dilakukan aktor terhadap sistem maupun yang dilakukan oleh sistem terhadap aktor. Berdasarkan Use Case Diagram pada gambar di atas, ilustrasi skenario per use case sebagai berikut: a. Scenario login Use Case scenario proses login pengguna dapat dijelaskan sebagai berikut:

23

Tabel 3.2 Use case scenario login

Use Case

Login

Aktor

Pelanggan, Admin

Deskripsi

Pengguna harus melakukan login terlebih dahulu Skenario Utama

Kondisi awal

Tampilan halaman depan web

Aktor

Sistem 1) Menampilkan halaman depan web

2) Mengisi data login 3) Menekan tombol login

4) Proses autentikasi login 5) Menampilkan halaman depan web

Skenario Alternatif jika data tidak ditemukan 1) Menampilkan pesan data login salah dan menampilkan halaman form login kembali 2) Mengisi data login kembali 3) Menekan tombol login

4) Proses autentikasi login 5) Menampilkan halaman depan web

Kondisi akhir

Halaman utama web ditampilkan

b. Scenario Logout Tabel 3.3 Use case scenario logout Use Case

Logout

Aktor

Pelanggan, Admin

Deskripsi

Pengguna sistem harus melakukan logout terlebih dahulu pada saat keluar dari system Skenario Utama

Kondisi awal

Tampilan halaman depan web

24

Tabel 3.3 Use case scenario logout (lanjutan) Aktor

Sistem 1) Berada pada posisi login

2) Memilih logout Tampilan halaman depan web

Kondisi akhir

c. Scenario Tambah Data Kendaraan Tabel 3.4 Use case scenario tambah data kendaraan Use Case

Mengelola Data Kendaraan

Aktor

Admin

Deskripsi

Admin melakukan proses tambah data kendaraan Skenario Utama Tampilkan halaman form tambah data kendaraan

Kondisi awal

Aktor

Sistem 1) Menampilkan halaman form tambah data kendaraan

2) Melakukan penambahan data kendaraan 3) Pilih tombol simpan 4) Memproses penambahan data kendaraan 5) Menyimpan data kendaraan baru ke database Data di sistem sudah mengalami proses

Kondisi Akhir

penambahan data kendaraan

d. Scenario Tambah Data Member Tabel 3.5 Use case scenario tambah data member Use Case

Mengisi Data Member

Aktor

Pengunjung

25

Tabel 3.5 Use case scenario tambah data member (lanjutan) pengunjung melakukan proses tambah data member

Deskripsi

Skenario Utama Tampilkan halaman form tambah member

Kondisi awal

Aktor

Sistem 1) Menampilkan halaman form tambah data member

2) Melakukan penambahan data member 3) Pilih tombol simpan 4) Memproses penambahan data member 5) Menyimpan data member baru ke database Data di sistem sudah mengalami proses

Kondisi Akhir

penambahan data member

e. Scenario Mengelola Status Order Tabel 3.6 Use case scenario mengelola status order Use Case

Mengelola Status order

Aktor

Admin

Deskripsi

Admin melakukan proses mengubah status order Skenario Utama

Kondisi awal

Tampilan halaman status order

Aktor

Sistem 1) Menampilkan halaman status order

2) Melihat order yang masuk yang belum konfirmasi pembayaran

Kondisi Akhir

26

f. Scenario Mengelola Status Pembayaran Tabel 3.7 Use case scenario mengelola status pembayaran Use Case

Mengelola Status pembayaran

Aktor

Admin

Deskripsi

Admin melakukan proses mengubah status pembayaran Skenario Utama

Kondisi awal

Tampilan halaman status pembayaran

Aktor

Sistem 1) Menampilkan halaman status pembayaran

2) Mengubah status pembayaran pilih bayar 3) Memproses starus pembayaran 4) Status pembayaran sudah berubah Data di sistem sudah mengalami proses

Kondisi Akhir

perubahan status pembayaran

g. Scenario Mengelola Status Kendaraan Tabel 3.8 Use case scenario mengelola status kendaraan Use Case

Mengelola Data Kendaraan

Aktor

Admin

Deskripsi

Admin melakukan proses mengubah status kendaran Skenario Utama

Kondisi awal

Tampilan halaman status kendaraan

Aktor

Sistem 1) Menampilkan halaman status kendaraan

2) Mengubah status kendaraan pilih ubah 3) Memproses ubah status kendaraan

27

Tabel 3.8 Use case scenario mengelola status kendaraan (lanjutan) 4) Status kendaraan sudah berubah Data di sistem sudah mengalami proses

Kondisi Akhir

perubahan status kendaraan

h. Scenario Melihat laporan

Tabel 3.9 Use case scenario melihat laporan Use Case

Melihat Laporan

Aktor

Admin

Deskripsi

Admin melihat laporan order Skenario Utama

Kondisi awal

Tampilkan halaman laporan

Aktor

Sistem 1) Menampilkan laporan order

2) Melihat laporan

Kondisi Akhir

3.1.3.4 Sequence Diagram

Sequence Diagram manggambarkan kelakuan objek pada use case dengan mendeskripsikan waktu hidup objek dan message yang dikirimkan dan diterima antar objek. Sequence Diagram menggambarkan interaski antar objek di dalam dan di sekitar system berupa message yang digambarkan terhadap waktu. Berikut Sequence Diagram yang dapat diambil dari penggambaran skenario use case: 3.1.3.4.1 Sequence Diagram Login Interaski antara aktor dengan use case login dijelaskan dalam Sequence Diagram sebagai berikut:

28

Halaman depan

Proses login

Data Pengguna

Halaman utama

Pengunjung Mengisi data login Submit login Cek data login

Data Data login login benar salah

Validasi data login Data login benar

Tampilan Halaman utama

Gambar 3.3 Sequence diagram login 3.1.3.4.2 Sequence Diagram Mengelola Data Kendaraan Proses mengelola data kendaraan yaitu dengan menambahkan data kendaraan. Adapun sequnce diagram dari menambahkan data kendaraan sebagai berikut:

Form tambah kendaraan

Proses tambah data

Data kendaraan

Admin Mengisi data kendaraan Simpan data kendaraan

Data benar Data login field kosong

Validasi data field Data field terisi

Gambar 3.4 Sequence diagram menambah data kendaraan

29

3.1.3.4.3 Sequence Diagram Mengelola Data Member Proses mengelola data member yaitu dengan menambahkan data member. Adapun sequnce diagram dari menambahkan data member sebagai berikut:

Form tambah member

Proses tambah data

Data member

Pengunjung Mengisi data member Simpan data member

Data benar Data login field kosong

Validasi data field Data field terisi

Gambar 3.5 Sequence diagram menambah data member 3.1.3.4.4 Sequence Diagram Melihat Status Order Proses mengelola status order yaitu dengan mengubah status kendar. Adapun sequnce diagram dari mengubah status kendaraan sebagai berikut:

Halaman status order Admin Melihat status yang belum bayar

Gambar 3.6 Sequence diagram melihat status order

30

3.1.3.4.5 Sequence Diagram Mengelola Status Pembayaran Proses mengelola status pembayaran yaitu dengan mengubah status pembayaran. Adapun sequnce diagram dari mengubah status pembayaran sebagai berikut:

Halaman status pembayaran

Proses status pembayaran

Admin Mengubah status pembayaran Pilih ubah status perubahan status

Gambar 3.7 Sequence diagram mengubah status pembayaran 3.1.3.4.6 Sequence Diagram Mengelola Status Kendaraan Proses mengelola status kendaraan yaitu dengan mengubah status kendaraan. Adapun sequnce diagram dari mengubah status kendaraan sebagai berikut:

Halaman status kendaraan

Proses status kendaraan

Admin Mengubah status kendaraan Pilih ubah status perubahan status

Gambar 3.8 Sequence diagram mengubah status kendaraan

31

3.1.3.4.7 Sequence Diagram Melihat Laporan Adapun sequnce diagram dari melihat laporan sebagai berikut:

Halaman laporan Admin Melihat laporan

Gambar 3.9 Sequence diagram melihat laporan

3.1.3.5 Activity Diagram Activity Diagram menggambarkan workflow (aliran kerja) atau aktifitas dari sebuah sistem atau proses bisnis dari urutan aktifitas dalam suatu proses yang mengacu pada use case diagram yang ada. Berikut ini penjelasan dengan activity diagram untuk penjelasan dari masing-masing use case scenario:

32

3.1.3.5.1 Activity Diagram Login penguna

sistem

Mengisi data login

Menampilkan halaman depan

Submit login

Mengecek data login gagal

sukses

Menampilkan halaman utama

Gambar 3.10 Activity diagram login

3.1.3.5.2 Activity Diagram Tambah Data Kendaraan Admin

Membuka menu admin

Pilih tambah data kendaraan

sistem

Menampilkan halaman depan

Menampilkan form tambah data

Mengisi form data kendaraan

Pilih simpan

Data telah tersimpan

Gambar 3.11 Activity diagram Tambah data kendaraan

33

3.1.3.5.3 Activity Diagram Tambah Data Member Pelanggan

Pilih data member

sistem

Menampilkan halaman depan

Menampilkan form tambah data

Mengisi form data member

Pilih simpan

Data telah tersimpan

Gambar 3.12 Activity diagram Tambah data member

3.1.3.5.4 Activity Diagram Melihat Daftar Kendaraan

Admin

Pilih daftar kendaraan

sistem

Menampilkan menu admin

Menampilkan daftar kendaraan

Gambar 3.13 Activity diagram daftar kendaraan

34

3.1.3.5.5 Activity Diagram Melihat Daftar Member

Admin

Pilih daftar member

sistem

Menampilkan menu admin

Menampilkan daftar member

Gambar 3.14 Activity diagram daftar member

3.1.3.5.6 Activity Diagram Melihat Status Order

Admin

Pilih status order

sistem

Menampilkan menu admin

Menampilkan status order

Gambar 3.15 Activity diagram status order

35

3.1.3.5.7 Activity Diagram Melihat Status Pembayaran Sistem

Admin

Pilih status pembayaran

Menampilkan menu admin

Menampilkan status pembayaran

Mengecek pembayaran Tidak ada

ada

Merubah status pembayaran

Status pembayaran berubah

Gambar 3.16 Activity diagram status pembayaran 3.1.3.5.8 Activity Diagram Melihat Status Kendaraan Admin

Pilih status kendaraan

Sistem

Menampilkan menu admin

Menampilkan status kendaraan

Mengecek kendaraan Tidak ada

ada

Merubah status kendaraan

Status kendaraan berubah

Gambar 3.17 Activity diagram status kendaraan

36

3.1.3.5.9 Activity Diagram Melihat Laporan Admin

sistem

Pilih status laporan

Menampilkan menu admin

Menampilkan laporan

Gambar 3.18 Activity diagram laporan

3.1.3.5.10 Activity Diagram Pemesanan sewa mobil online Pelanggan

Sistem

Melihat mobil sewa

Memesan mobil

Menampilkan form order

Mengisi form order

Menampilkan konfirmasi order

Tidak setuju

Menyetujui konfirmasi order

Mengisi form konfirmasi pembayaran

Menampilkan konfirmasi pembayaran

order mobil di terima

Gambar 3.19 Activity diagram pemesanan sewa mobil online

37

3.2 Perancangan Sistem Perancangan sistem pemesanan sewa mobil online berbasis web di Pesona Rental Mobil bertujuan untuk menerapkan solusi pemecahan masalah yang telah diajukan pada analisis sistem. 3.2.1 Perancangan Basis Data Perancangan basis data terdiri dari tabel relasi dan struktur tabel yang terdapat pada ERD dari sistem pemesanan sewa mobil online berbasis web 3.2.1.1 Skema Relasi Tabel Relasi menggambarkan suatu hubungan antar tabel. Perancangan tabel relasi dalam membangun sebuah perangkat lunak sistem pemesanan sewa mobil online berbasis web adalah sebagai berikut:

tkendaraan PK

torder

1

no_kendaraan

PK

tpembayaran

1

Id_order

PK

Id_pembayaran

1 merk

tgl_order

Id_order

tipe

jam_order

tgl_pembayaran

warna

id_member

Jam_pembayarn

no_kendaraan

Jenis_transaksi

no_rangka

paket_sewa

nominal

no_mesin

lama_sewa

bank

harga

jam_pengambilan

No_tujuan

gambar

tgl_mulaisewa

berita

lokasi_gambar

tgl_kembalisewa

status_order

Jasa_supir

1

tahun_pembuatan

total_biaya status_mobil total_biaya

tmember PK

1

tstaff

Id_member nama

PK

Id_staff

tlogin PK

Id_login

Tempat_lahir

nama

nama

Tanggal_lahir

jabatan

email

Jenis_kelamin

Jenis_kelamin

password

alamat

email

level

Jenis_identitas email No_identitas No_telp

Gambar 3.20 ERD

38

3.2.1.2 Perancangan Struktur Tabel

Tabel merupakan tempat penyimpanan informasi dari sebuah aliran data dalam sebuah sistem. Gambar merupakan struktur dari beberapa tabel sistem yang akan dibangun. 1. Tabel Kendaraan Tabel ini berguna untuk menyimpan data kendaraan Tabel 3.10 Tabel kendaraan Nama Field

Tipe Data

Panjang

Keterangan

no_kendaraan

Varchar

10

Primary key

Merk

Varchar

30

Not null

Tipe

Varchar

20

Not null

Jenis

Varchar

20

Not null

Warna

Varchar

10

Not null

tahun_pembuatan

Varchar

10

Not null

no_mesin

Varchar

30

Not null

no_rangka

Varchar

30

Not null

Harga

Int

10

Not null

Gambar

Varchar

255

Not null

lokasi_gambar

Varchar

255

Not null

status_order

Varchar

20

Not null

2. Tabel member Tabel ini berguna untuk menyimpan data member

Tabel 3.11 Tabel member Nama Field

Tipe Data

Panjang

Keterangan

id_member

Int

10

Primary key

Nama

Varchar

30

Not null

39

Tabel 3.11 Tabel member (lanjutan) tempat_lahir

Varchar

20

Not null

tanggal_lahir

Varchar

20

Not null

jenis_kelamin

Varchar

15

Not null

Alamat

Varchar

50

Not null

jenis_identitas

Varchar

10

Not null

no_identitas

Varchar

20

Not null

no_tlp

Varchar

20

Not null

Email

Varchar

30

Not null

3. Tabel staff Tabel ini berguna untuk menyimpan data staff

Tabel 3.12 Tabel staff Nama Field

Tipe Data

Panjang

Keterangan

id_staff

Int

10

Primary key

Nama

Varchar

30

Not null

Jabatan

Varchar

30

Not null

jenis_kelamin

Varchar

20

Not null

Email

Varchar

30

Not null

4. Tabel login Tabel ini berguna untuk menyimpan data login sebagai hak akses

Tabel 3.13 Tabel login Nama Field

Tipe Data

Panjang

Keterangan

id_login

Int

11

Primary key

Nama

Varchar

30

Not null

Email

Varchar

20

Not null y

password

Varchar

20

Not null

Level

Int

5

Not null

40

5. Tabel order Tabel ini berguna untuk menyimpan data order Tabel 3.14 Tabel order Nama Field

Tipe Data

Panjang

Keterangan

id_order

Varchar

10

Primary key

tgl_order

Date

Not null

jam_order

Time

Not null

id_member

Int

10

Foreign key

no_kendaraan

Varchar

10

Foreign key

paket_sewa

Varchar

10

Not null

lama_sewa

Varchar

10

Not null

jam_pengambilan

Varchar

10

Not null

tgl_mulaisewa

Date

Not null

tgl_kembalisewa

Date

Not null

jasa_supir

Varchar

15

Not null

total_biaya

Varchar

15

Not null

status_mobil

Varchar

20

Not null

status_pembayaran

Varchar

20

Not null

6. Tabel pembayaran Tabel ini berguna untuk menyimpan data pembayaran Tabel 3.15 Tabel pembayaran Nama Field

Tipe Data

Panjang

Keterangan

id_pembayaran

Int

10

Primary key

id_order

Varchar

20

Foreign key

tgl_pembayaran

Date

Not null

jam_pembayaran

Time

Not null

41

Tabel 3.15 Tabel pembayaran (lanjutan) jenis_transaksi

Varchar

20

Not null

nominal

Varchar

20

Not null

Bank

Varchar

20

Not null

nomor_tujuan

Varchar

20

Not null

berita

Varchar

100

Not null

3.2.2 Perancangan antar muka (userinterface)

Perancangan antarmuka merupakan rancangan desain awal dari aplikasi yang dibangun. User interface ini digunakan sebagai media komunikasi atau penghubung antara aplikasi rental mobil dengan pengguna (user) untuk dapat saling berinteraksi. Berikut ini adalah beberapa rancangan yang digunakan dalam aplikasi rental mobil: 3.2.2.1 Perancangan tampilan untuk pengunjung (nonmember)

1. Menu home

LOGO LOGO

Nama Perusahaan Email :

Password :

Login

Passw

L

Home Produk Mobil

Image

Cara Pemesanan Kontak Kami

Gambar 3.21 Tampilan halaman home

Daftar Member

42

2. Menu Produk mobil

LOGO

Nama Perusahaan Email :

Password :

Home

Login

Daftar member

Nomor Kendaraan :

Produk Mobil

Merk Mobil

:

Cara Pemesanan

Jenis

:

Kontak Kami

Harga Perhari

:

Status

:

Image

Order Or

Gambar 3.22 Tampilan halaman poduk mobil

3. Menu cara pemesanan

LOGO LOGO

Nama Perusahaan Email :

Password :

Passw

Login

L

Home Produk Mobil Cara Pemesanan Cara Pemesanan Kontak Kami

Gambar 3.23 Tampilan halaman cara pemesanan

Daftar Member

43

4. Menu kontak kami Nama Perusahaan

LOGO LOGO

Email :

Password :

Login

Passw

Daftar Member

L

Home Produk Mobil Kontak kami Cara Pemesanan Kontak Kami

Gambar 3.24 Tampilan halaman kontak kami

5. Menu tambah member

Nama Perusahaan

LOGO

Email :

Password :

Daftar member

Login

Home Tambah Member Produk Mobil Cara Pemesanan Kontak Kami

Nama

:

Tempat Lahir

:

Tanggal Lahir

:

Jenis Kelamin

:

Alamat

:

Jenis Identitas

:

Nomor Identitas

:

Nomor Telepon

:

Email

:

Password

:

Tgl

Bulan

Tahun

Gambar 3.25 Tampilan halaman tambah member

44

3.2.2.2 Perancangan tampilan untuk pelanggan (member) 1.

Menu Home

Nama Perusahaan

LOGO

Login atas nama :

Logout

Home Produk Mobil Image Cara Pemesanan Kontak Kami Keranjang Order

Gambar 3.26 Tampilan halaman home 2.

Menu Produk mobil

LOGO

Nama Perusahaan Login atas nama :

Home Produk Mobil

Nomor Kendaraan : Merk Mobil

:

Cara Pemesanan

Jenis

:

Kontak Kami

Harga Perhari

:

Keranjang Order

Status

:

Image

Order

Gambar 3.27 Tampilan halaman produk mobil

Logout

45

3.

Menu Cara Pemesanan

Nama Perusahaan

LOGO

Login atas nama :

Logout

Home Produk Mobil Cara Pemesanan Cara Pemesanan Kontak Kami Keranjang Order

Gambar 3.28 Tampilan halaman cara pemesanan

4. Menu Kontak Kami

LOGO

Nama Perusahaan Login atas nama :

Home Produk Mobil Kontak kami Cara Pemesanan Kontak Kami Keranjang Order

Gambar 3.29 Tampilan halaman kontak kami

Logout

46

5. Menu Keranjang Order

Nama Perusahaan

LOGO

Login atas nama :

Logout

Home Produk Mobil Keranjang Order Cara Pemesanan Kontak Kami Keranjang Order

Gambar 3.30 Tampilan halaman keranjang order

3.2.2.3 Perancangan tampilan untuk admin 1. Menu Home sebelum login

Nama Perusahaan

LOGO LOGO

Email :

Password :

Login

Passw

Daftar Member

L

Home Produk Mobil

Image

Cara Pemesanan Kontak Kami

Gambar 3.31 Tampilan halaman home sebelum login

47

2. Menu Admin setelah login Nama

L OGO

Login atas

Logout

Menu Admin Home Tambah Data Kendaraan

raan Tambah Data Staff Image Daftar Kendaraan Daftar Member Status Order Status Kendaraan Status Laporan

Gambar 3.32 Tampilan halaman home setelah login

3. Menu Tambah Data Kendaraan Nama

L OGO

Login atas

Logout

Menu Admin Home Tambah Data Kenndaraan

Kendaraan Tambah Data Staff

Image Daftar Kendaraan Daftar Member Status Order Status Kendaraan Status Laporan

Gambar 3.33 Tampilan halaman tambah data kendaraan

48

4. Tambah Data Staff Nama

L OGO

Login atas

Logout

Menu Admin Home Tambah Data Kendaraan Kendaraan

Tambah Data Staff Tambah data staff Daftar Kendaraan Daftar Member Status Order Status Kendaraan Status Laporan

Gambar 3.34 Tampilan halaman tambah data staff

5. Menu Daftar Kendaraan Nama

L OGO

Login atas

Logout

Menu Admin Home Tambah Data Kendaraan Kendaraan

Tambah Data Staff

Daftar kendaraan

Daftar Kendaraan Daftar Member Status Order Status Kendaraan Status Laporan

Gambar 3.35 Tampilan halaman tambah daftar kendaraan

49

5. Menu Daftar Member Nama

L OGO

Login atas

Logout

Menu Admin Home Tambah Data Kendaraan Kendaraan

Tambah Data Staff Daftar member Daftar Kendaraan Daftar Member Status Order Status Kendaraan Status Laporan

Gambar 3.36 Tampilan halaman tambah data member 6. Menu Status Order Nama Perusahaan

L OGO

Login atas Menu Admin Home Tambah Data Kendaraan Kendaraan

Tambah Data Staff

Status order

Daftar Kendaraan Daftar Member Status Order Status Kendaraan Status Laporan

Gambar 3.37 Tampilan halaman status order

Logout

50

7. Menu Status Kendaraan Nama Perusahaan

L OGO

Login atas

Logout

Menu Admin Home Tambah Data Kendaraan Kendaraan

Tambah Data Staff

Status kendaraan

Daftar Kendaraan Daftar Member Status Order Status Kendaraan Status Laporan

Gambar 3.38 Tampilan halaman status kendaraan

8. Status Pembayaran Nama Perusahaan

L OGO

Login atas

Logout

Menu Admin Home Tambah Data Kendaraan Kendaraan

Tambah Data Staff

Status pembayaran

Daftar Kendaraan Daftar Member Status Order Status Kendaraan Status Laporan

Gambar 3.39 Tampilan halaman status pembayaran

51

9. Laporan L OGO

Nama Perusahaan

Login atas Menu Admin Home Tambah Data Kendaraan Kendaraan

Tambah Data Staff Laporan Daftar Kendaraan Daftar Member Status Order Status Kendaraan Status Laporan

Gambar 3.40 Tampilan halaman laporan

Logout