BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4.1. … · Admin dapat mengelola data penjualan barang....

29

BAB IV

RANCANGAN SISTEM DAN PROGRAM USULAN

4.1. Analisis Kebutuhan Software

A. Tahapan Analisis

Sistem penjualan secara online berbasis web dimana penjual dan pembeli dapat

melakukan transaksi tanpa harus bertatap muka. Konsumen melakukan transaksi

pembelian melalui media browser. Berikut adalah spesifikasi kebutuhan (system

requirement) dari sistem e-commerce :

Halaman User

A1. Pembeli dapat melakukan pemesanan.

A2. Pembeli dapat melakukan konfirmasi pembayaran.

A3. Pembeli dapat melakukan konfirmasi penerimaan barang

A4. Pembeli dapat melakukan retur barang

Halaman Administrasi

B1. Admin dapat mengelola cara pembelian dan cara pembayaran

B2. Admin dapat mengelola biaya pengiriman.

B3. Admin dapat mengelola data produk.

B4. Admin dapat mengelola data penjualan barang.

B5. Admin dapat mengelola konfirmasi pembayaran.

B6. Admin dapat mengelola data member.

B7. Admin dapat mengelola konfirmasi retur barang.

B8. Admin dapat mengelola laporan stok barang.

B9. Admin dapat mengelola laporan penjualan barang.

30

B. Use Case Diagram

Use case bekerja dengan cara mendekripsikan tripkal interaksi antara pengguna

sebuah sistem dengan sistemnya sendiri melalui sebuah c erita bagaimana sebuah

sistem di pakai,

1. Use Case Diagram Belanja Online Halaman User

Pembeli

Melakukan Pemesanan

Konfirmasi Pembayaran

Konfirmasi PenerimaanBarang

Konfirmasi Retur Barang

Login

<<include>>

<<include>>

<<include>>

<<include>>

Gambar IV.1

Package Use Case Diagram Belanja Online Halaman User

Deskripsi Use Case Belanja Online Halaman User :

Tabel IV.1

Deskripsi Use Case Belanja Online Halaman User

Use Case Name Belanja Online

Requirements A1-A4

Goal User dapat melakukan Pemesanan,melakukan

konfirmasi pembayaran, melakukan konfirmasi

penerimaan barang dan Konfirmasi pengembalian

barang

Pre-conditions Login

Post-conditions Barang dapat ditampilkan sesuai

kategori,transaksi dapat dilakukan

Failed end condition Gagal menampilkan barang,gagal melakukan

transaksi

Primary Actors User

Main Flow / Basic Path 1. Pembeli Login terlebih dahulu

31

2. Pembeli melakukan Pemesanan

3. Pembeli melakukan konfirmasi pembayaran

4. Pembeli melakukan penerimaan barang

5. Pembeli melakukan konfirmasi pengembalian

barang

Alternate Flow / Invarian 1 2a User melakukan transaksi

Invarian 2 2b. Admin menghapus data barang

2. Use Case Diagram Mengelola Cara Pembelian dan Pembayaran

Gambar IV.2

Use Case Diagram Mengelola Cara Pembelian dan Pembayaran

Deskripsi Use Case Mengelola Cara Pembelian dan Pembayaran :

Tabel IV.2

Deskripsi Use Case Mengelola Cara Pembelian dan Pembayaran

Use Case Name Mengelola Cara Pembelian dan Pembayaran

Requirements B1

Goal Admin dapat mengedit Cara Pembelian dan Cara

Pembayaran

Pre-conditions Admin telah login

Post-conditions Cara Pembelian dan Pembayaran terupdate

Failed end condition Gagal menyimpan,mengupdate cara pembelian

dan pembayaran

Primary Actors Admin

Main Flow / Basic Path 1. Admin melihat cara pembelian dan pembyaran

2. Admin dapat mengupdate cara pembelina dan

pembayaran

Alternate Flow / Invarian 1 2a. Admin mengedit cara pembelian dan

Admin

Cara Pembelian

Tampilkan Cara

Pembayaran

Tammpilkan Cara

Pembelian

Edit

Cara Pembayaran

«extends»

«extends»

<< include >>

<< include >>

32

pembayaran

Invarian 2 2b. Admin mengedit cara pembelian dan

pembayaran

3. Use Case Diagram Mengelola Biaya Pengiriman

Gambar IV.3

Use Case Diagram Mengelola Biaya Pengiriman

Deskripsi Use Case Mengelola Ongkos Kirim :

Tabel IV.3

Deskripsi Use Case Mengelola Biaya Pengiriman

Use Case Name Mengelola Ongkos Kirim

Requirements B2

Goal Admin dapat menambah, mengupdate, dan

menghapus biaya pengiriman


Post-conditions Biaya Pengiriman tersimpan, terupdate, atau

terhapus

Failed end condition Gagal menyimpan,mengupdate dan menghapus

biaya pengiriman


Main Flow / Basic Path 1. Admin dapat melihat biaya pengiriman

2. Admin dapat menambah biaya pengiriman

3. Admin dapat mengupdate biaya pengiriman

4. Admin dapat menghapus biaya pengiriman

Alternate Flow / Invarian 1 2a. Admin menambah biaya pengiriman

2b. Admin mengupdate biaya pengiriman

2c. Admin menghapus biaya pengiriman

Invarian 2 2d. Admin menambah biaya pengiriman

2e. Admin mengupdaten biaya pengiriman

2f. Admin menghapus biaya pengiriman

Browse Data Ongkos

Kirim

Tampilkan Ongkos

Kirim

Delete

Edit

Tambah

Admin

«extends»

<<include>>

<<include>>

<<include>>

33

4. Use Case Diagram Mengelola Data Produk

Gambar IV.4

Use Case Diagram Mengelola Data Produk

Deskripsi Use Case Mengelola Data Produk :

Tabel IV.4

Deskripsi Use Case Mengelola Data Produk

Use Case Name Mengelola Data Produk

Requirements B3

Goal Admin dapat menambah,mengedit dan

menghapus data Produk,data kategori dan data

jenis


Post-conditions Kategori dan data Produk

tersimpan,terupdate,atau terhapus

Admin

Pilih Produk

Tampilkan Ongkos

Kirim

Edit«extends»

«extends»

Edit

Reset

<< include >>

<< include >>

Pilih Kategori

Produk

Browse Data Produk

«extends»

Tambah

Batalkan

Hapus«extends»

«extends»Tampilkan Produk

<< include >>

<< include >>

<< include >>

Tambahkan

Input Tambah

Kategori

«extends»

«extends»

«extends»

Tampilkan Ongkos

Kirim

«extends»

Edit

Reset

<< include >>

<< include >>

Pilih Jenis Produk

Input Tambah

Kategori

«extends»

«extends»

«extends»

Tambahkan

«extends»

34

Failed end condition Gagal menyimpan,mengupdate atau menghapus

data kategori dan data Produk


Main Flow / Basic Path 1. Admin melihat daftar produk

2. Admin menambah data produk

3. Admin mengubah data produk

4. Admin menghapus data produk

5. Admin melihat daftar kategori

6. Admin menambah data kategori

7. Admin mengubah data kategori

8. Admin menghapus data kategori

9. Admin melihat data jenis

10. Admin menambah data jenis

11. Admin mengubah data jenis

12. Admin menghapus data jenis

Alternate Flow / Invarian 1 -

Invarian 2 -

5. Use Case Diagram Mengelola Data Penjualan Barang

Gambar IV.5

Use Case Diagram Mengelola Data Transaksi Penjualan Barang

Deskripsi Use Case Mengelola Data Transaksi Penjualan Barang :

Tabel IV.5

Deskripsi Use Case Mengelola Data Transaksi Penjualan Barang

Use Case Name Mengelola Data Transaksi Penjualan Barang

Requirements B4

Goal Admin dapat mengupdate status transaksi

Penjualan barang


Admin

Tampilkan Form

Order

Updates

Detail

«extends»

Ubah Status

«extends»

Tampilkan Form

Detail Order

«extends»

<<include>>

<<include>>

35

Post-conditions Data transaksi tersimpan

Failed end condition Gagal menyimpan dan mengupdate transaksi


Main Flow / Basic Path 1. Admin melihat data transaksi penjualan

2. Admin mengupdate status transaksi penjualan

3. Admin menyimpan data transaksi penjualan


Invarian 2 -

6. Use Case Diagram Mengelola Konfirmasi Pembayaran

Gambar IV.6

Use Case Diagram Mengelola Konfirmasi Pembayaran

Deskripsi Use Case Mengelola Konfirmasi Pembayaran :

Tabel IV.6

Deskripsi Use Case Mengelola Konfirmasi Pembayaran

Use Case Name Mengelola Konfirmasi Pembayaran

Requirements B5

Goal Admin dapat mengupdate status konfirmasi si

pembayaran


Post-conditions Data konfirmasi tersimpan

Failed end condition Gagal meengupdate status konfirmasi pembayaran


Main Flow / Basic Path 1. Admin melihat konfirmasi pembayaran

2. Admin mengupdate status konfirmasi

pembayaran


Invarian 2 -

Admin

Browse Data

KonfirmasiTampilkan Data

KonfirmasiEdit

«extends»<< include >>

36

7. Use Case Diagram Mengelola Data Member

Gambar IV.7

Use Case Diagram Mengelola Data Member

Deskripsi Use Case Mengelola Data Member :

Tabel IV.7

Deskripsi Use Case Mengelola Data Member

Use Case Name Mengelola Data Member

Requirements B6

Goal Admin dapat mengupdate data member


Post-conditions Status data member bisa diupdate

Failed end condition Gagal mengupdate member


Main Flow / Basic Path 1. Admin mengupdate status data member


Invarian 2 -

8. Use Case Diagram Mengelola Konfirmasi Retur Barang

Gambar IV.8

Use Case Diagram Mengelola Konfirmasi Penerimaan Barang

Admin

Browse Data

Konfirmasi Penerimaan BarangTampilkan Data

MemberEdit


Admin

Browse Data

CustomerTampilkan Data

CustomerEdit


37

Deskripsi Use Case Mengelola Konfirmasi Penerimaan Barang :

Tabel IV.8

Deskripsi Use Case Mengelola konfirmasi Peneriamaan Barang

Use Case Name Mengelola Konfirmasi Penerimaan Barang

Requirements B7

Goal Admin dapat mengupdate konfirmasi peneriamaan

barang


Post-conditions Status konfirmasi penerimaan barang sudah

diupdate

Failed end condition Gagal mengupdate konfirmasi


Main Flow / Basic Path Admin mengupdate status konfirmasi penerimaan

barang


Invarian 2 -

9. Use Case Diagram Mengelola Data Laporan Stok Barang

Gambar IV.9

Use Case Diagram Mengelola Data Laporan Stok Barang

Admin

Tampilkan form

Laporan Stok Barang

Proses

Pilih Jenis Barang

«extends»

<< include >>Pilih Kategori

Barang

Cetak Laporan

«extends» << include >>

«extends»

<< include >>

38

Deskripsi Use Case Mengelola Data Laporan Stok Barang :

Tabel IV.9

Deskripsi Use Case Mengelola Stok Barang

Use Case Name Mengelola Data Laporan Stok Barang

Requirements B8

Goal Admin dapat memproses dan mencetak laporan

stok barang


Post-conditions Laporan stok barang dapat diproses dan di cetak

Failed end condition Gagal memproses dan mencetak laporan stok

barang


Main Flow / Basic Path 1. Admin memproses laporan stok barang

2. Admin mencetak laporan stok barang


Invarian 2 -

10. Use Case Diagram Mengelola Data Laporan Penjualan Barang

Gambar IV.10

Use Case Diagram Mengelola Data Laporan Penjualan Barang

Admin

Tampilkan form

Laporan Transaksi

Proses

Pilih Jenis Barang

«extends»

<< include >>

Pilih Kategori

Barang

Cetak Laporan

«extends»

<< include >>

«extends»

<< include >>

Pilih Tanggal

«extends»

Close

Tampilkan Form

Detail Transaksi

«extends»

«extends»

«extends»

<< include >>

39

Deskripsi Use Case Mengelola Data Laporan Penjualan Barang :

Tabel IV.10

Deskripsi Use Case Mengelola Data Laporan Penjualan Barang

Use Case Name Mengelola Data Laporan Penjualan

Requirements B9

Goal Admin dapat memproses dan mencetak laporan

Penjualan Barang


Post-conditions Laporan penjualan dapat diproses dan di cetak

Failed end condition Gagal memproses dan mencetak laporan penjualan

barang


Main Flow / Basic Path 1. Admin memproses laporan penjualan barang

2. Admin mencetak laporan penjualan barang

Alternate Flow / Invarian 1 2a. Admin memproses data laporan penjualan

barang

Invarian 2 -

C. Activity Diagram

Activity diagram menggambarkan berbagai alir aktivitas dalam sistem yang

sedang dirancang, bagaimana masing-masing alir berawal, decision yang mungkin

terjadi dan bagaimana mereka berakhir. Activity diagram juga dapat menggambarkan

proses paralel yang mungkin terjadi pada beberapa eksekusi.

40

1. Activity Diagram Belanja Online Halaman User

LoginCheck Username

dan Password

Halaman Utama

n

y

Pilih Kategori

Pilih Produk

Simpan Keranjang Belanja

Tampil Unit dipilih dan Total Bayar

Update Jumlah Unit

Selesai Belanja

Simpan Transaksi

Cetak Invoice + Kirim Email

Konfirmasi Pembayaran

n y

n

y

yn

Gambar IV.11

Activity Diagram Belanja Online Halaman User

2. Activity Diagram Mengelola Cara Pembelian dan Pembayaran

LoginCheck Username

Dan Password

Halaman Utama

Admin

Cara Pembelian/

Pembayaran

Edit

y

n

Gambar IV.12

Activity Diagram Mengelola Cara Pembelian dan Pembayaran

41

3. Activity Diagram Mengelola Biaya Pengiriman

LoginCheck Username

Dan Password

Halaman Utama

Admin

Mengelola Biaya

Pengiriman

Tambah Biaya

Pengiriman

y

n

Tambah

y

n

Gambar IV.13

Activity Diagram Mengelola Biaya Pengiriman

42

4. Activity Diagram Mengelola Data Produk

LoginCheck Username

Dan Password

Halaman UtamaKontrol Toko

y

n

Produk

Tambah

Kategori

Tambah

Jenis

Tambah

Produk

Logout

Tampil Kategori

Tampil Jenis

Tampil Detail

Produk

n

n

n

y

y

y

Gambar IV.14

Activity Diagram Mengelola Data Produk

5. Activity Diagram Mengelola Transaksi Penjualan Barang

LoginCheck Username

Dan Password


y

n

Penjualan BarangMenampilkan

Penjualan Barang

LihatPenjualan Barang Detail

Logout

y

n

Gambar IV.15

Activity Diagram Mengelola Transaksi Penjualan Barang

43

6. Activity Diagram Mengelola Konfirmasi Pembayaran

LoginCheck Username

Dan Password


y

n

Konfirmasi

Pembayaran

Menampilkan Konfirmasi Penjualan

LihatDetail Konfirmasi Pembayaran

y

Logout

Update Status

Update Status Pembayaran

y

n

n

Gambar IV.16

Activity Diagram Mengelola Konfirmasi Pembayaran

7. Activity Diagram Mengelola Data Member

LoginCheck Username

Dan Password


y

n

Daftar MemberMenampilkan

Daftar Member

Gambar IV.17

Activity Diagram Mengelola Data Member

44

8. Activity Diagram Konfirmasi Retur Order

LoginCheck Username

Dan Password


y

n

Retur OrderMenampilkan Data

Retur Order

UpdateUpdate Retur Order

Logout

y

n

Gambar IV.18

Activity Diagram Konfirmasi Retur Order

9. Activity Diagram Mengelola Data Laporan Stok Barang

LoginCheck Username

Dan Password

Halaman UtamaLaporan

y

n

Stok BarangLaporan Stok

Barang

Gambar IV.19

Activity Diagram Mengelola Data Laporan Stok Barang

45

10. Activity Diagram Mengelola Data Laporan Penjualan

LoginCheck Username

Dan Password

Halaman UtamaLaporan

y

n

Laporan Penjualan

Pilih

Tanggal

Pilih

Kategori

Logout

Tampil Detail Per

Tanggal

n

y

y

n

Tampil Detail Per

Kategori

Gambar IV.20

Activity Diagram Mengelola Data Laporan Penjualan

46

11. Package Diagram Halaman Admin

Gambar IV.21

Package Diagram Halaman Admin

Mengelola Cara Pembelian dan Pembayaran

Mengelola Laporan Stok Barang

Mengelola Data Member

Mengelola Laporan Penjualan

Mengelola Konfirmasi Pembayaran

Mengelola Data Penjualan

Mengelola Data Barang

Mengelola ongkos Kirim

Package Diagram Halaman Admin

Mengelola Konfirmasi Pengembalian Barang

47

4.2. Desain

4.2.1. Database

1. Entity Relationship Diagram

Gambar IV.22

Entity Relationship Diagram Sistem Berjalan

48

2. Logical Record Structure

Pembeli

Id_customer

Password

Nama_lengkap

Alamat

Kode_pos

Email

Telpon

Id_kota

Aktif

tanggal

Order

Id_order

Status_order

Tgl_order

Jam_order

Id_customer

Total

Status_barang

Status_retur

Detail Order

Id_order

Id_produk

jumlah

Produk

Id_produk

Nama_produk

Id_jenis

Berat

Harga_jual

stok

Deskripsi

status

Konfirmasi

Id_order

Dari_bank

Ke_bank

Total

Tgl_transfer

Pesan

Status

Tanggal

jam

Jenis

Id_jenis

Id_kategori

jenis

Id_customer Id_order Id_produk

Id_orderId_jenis

Gambar IV.23

Logical Record Structure Penjualan Online

3. Spesifikasi File

a. Spesifikasi Tabel Cara Pembayaran

Nama Database : db_kamusik

Nama File : Tabel Cara Pembayaran

Akronim : cara_pembayaran.myd

Tipe File : File Master

Akses File : Random

Panjang Record : 10 Byte

Kunci Field : id_cara_pembayaran

49

Tabel IV.11

Spesifikasi Tabel Cara Pembayaran

No. Elemen Data Nama Field Type Size Keterangan

1 Id Cara Pembayaran id_cara_pembayaran Int 10 Primary Key

2 Cara Pembayaran cara_pembayaran Text

b. Spesifikasi Tabel Cara Pembelian


Nama File : Tabel Cara Pembelian

Akronim : cara_pembelian.myd


Akses File : Random


Kunci Field : id_cara_pembelian

Tabel IV.12

Spesifikasi Tabel Cara Pembelian


1 Id Cara Pembelian id_pembelian Int 10 Primary Key

2 Cara Pembelian cara_pembelian Text

c. Spesifikasi Tabel Customer


Nama File : Tabel Customer

Akronim : customer.myd


50

Akses File : Random


Kunci Field : id_customer

Tabel IV.13

Spesifikasi Tabel Customer


1 Id Customer id_kustomer Int 5 Primary Key

2 Password password Varchar 50

3 Nama Lengkap nama_lengkap Varchar 100

4 Alamat alamaat Text

5 Email email Varchar 100

6 Telpon telpon Varchar 20

7 Id Kota id_kota Int 5

8 Aktif aktif Enum

d. Spesifikasi Tabel Jenis


Nama File : Tabel Jenis

Akronim : jenis.myd


Akses File : Random


Kunci Field : id_jenis

51

Tabel IV.14

Spesifikasi Tabel Jenis


1 Id Jenis id_jenis Int 10 Primary Key

2 Id Kategori id_kategori Int 10

3 Jenis jenis Text

e. Spesifikasi Tabel Kategori


Nama File : Tabel Kategori

Akronim : kategori.myd


Akses File : Random


Kunci Field : id_kategori

Tabel IV.15

Spesifikasi Tabel Kategori


1 Id Kategori id_kategori Int 10 Primary Key

2 Kategori kategori Text

f. Spesifikasi Tabel Kota


Nama File : Tabel Kota

Akronim : kota.myd

52


Akses File : Random


Kunci Field : id_kota

Tabel IV.16

Spesifikasi Tabel Kota


1 Id Kota id_kota Int 5 Primary Key

2 Nama kota nama_kota Varchar 100

3 Ongkos Kirim ongkos_kirim Int 10

g. Spesifikasi Tabel Kotak Masuk


Nama File : Tabel Kotak Masuk

Akronim : kotak_masuk.myd


Akses File : Random


Kunci Field : id_kotak

Tabel IV.17

Spesifikasi Tabel Kotak Masuk


1 Id Kotak Masuk id_kotak Int 10 Primary Key

2 Nama nama Varchar 50


53

4 HP hp Varchar 20

5 Pesan pesan Text

6 Jam jam Varchar 10

7 Tanggal tanggal Varchar 30

8 Status status Varchar 30

h. Spesifikasi Tabel Order


Nama File : Tabel Order

Akronim : order.myd

Tipe File : File Transaksi

Akses File : Random


Kunci Field : id_order

Tabel IV.18

Spesifikasi Tabel Order


1 Id Order id_order Int 10 Primary Key

2 Status Order status_order Varchar 50

3 Tanggal Order tgl_order Date

4 Jam Order jam_order Time

5 ID Customer id_kustomer Int 5 Foreign Key

i. Spesifikasi Tabel Detail Order


Nama File : Tabel Detail Order

54

Akronim : detail_order.myd

Tipe File : File Transaksi

Akses File : Random


Kunci Field : -

Tabel IV.19

Spesifikasi Tabel Order Detail


1 Id Order id_order Int 10 Foreign Key

2 Id Produk id_produk Int 10 Foreign Key

3 Jumlah jumlah Int 10

j. Spesifikasi Tabel Order Temp


Nama File : Tabel Order Temp

Akronim : order_temp.myd


Akses File : Random


Kunci Field : id_order_temp

Tabel IV.20

Spesifikasi Tabel Order Temp


1 Id Order Temp id_order_temp Int 10 Primary Key

2 Id Produk id_produk Int 10 Foreign Key

55

3 Id Session id_session Varchar 50

4 Jumlah jumlah Int 10

5 Tanggal Order tgl_order_temp Date

6 Jam Order jam_order_temp Time

7 Stok stok_temp Int 5

k. Spesifikasi Tabel Password


Nama File : Tabel Password

Akronim : password.myd


Akses File : Random


Kunci Field : username

Tabel IV.21

Spesifikasi Tabel Password


1 Username username Varchar 50 Primary Key

2 Password password Varchar 50

3 Nama Lengkap nama_lengkap Varchar 50


5 No. Telpon no_telp Varchar 20

6 Level level Varchar 20

7 Blokir blokir Enum ‘Y’,’N’

56

l. Spesifikasi Tabel Produk


Nama File : Tabel Produk

Akronim : produk.myd


Akses File : Random


Kunci Field : id_produk

Tabel IV.22

Spesifikasi Tabel Produk


1 Id Produk id_produk Int 10 Primary Key

2 Nama Produk nama_produk Text

3 Id Jenis id_jenis Int 10 Foreign Key

4 Berat berat Varchar 100

5 Harga Modal harga_modal Varchar 100

6 Harga Jual harga_jual Int 10

7 Stok stok Varchar 100

8 Deskripsi deskripsi Text

9 Status status Varchar 20

m. Spesifikasi Tabel Produk Galeri


Nama File : Tabel Produk Galeri

Akronim : produk_galeri.myd

57


Akses File : Random


Kunci Field : id_produk_galeri

Tabel IV.23

Spesifikasi Tabel Produk Galeri


1 Id Produk Galeri id_produk_galeri Int 10 Primary Key

2 Id Produk id_produk Int 10

3 Gambar gambar Varchar 200

58

4.2.2. Software Architecture

A. Component Diagram

Firewall

+ AcceptRequest():HTML Request+ ForwardRequest():HTML Request+ ReturnResponse():HTML Response

- Web Server - XAMPP

+ DoRequest():HTML Response

PHPMySQL

COM + Component Environtment

Bussines Logic

VPHONE Database Web

Web SQL Server

+ Configure(): void+ ProcessSQLRequest(): Recordset+ Restart() : void

Cmp Server Components

Gambar IV.24

Component Diagram Sistem Penjualan Online

db_kamusik

Database

59

B. Deployment Diagram

Deployment diagram menunjukan tata letak sebuah sistem secara fisik,

menampakkan bagian-bagian software yang berjalan pada bagian-bagian hardware.

Berikut gambar Deployment Diagram :

Web Server

XAMPP

OS

Windows XP

Browser Client

(Brower)

Server Aplikasi

PHP

Database

MySQL

Http/LAN

Http/Internet

LAN

Deployment Diagram

Gambar IV.25

Deployment Diagram Sistem Penjualan Online

60

4.2.3. User Interface

Gambar IV.26

Tampilan Produk

Gambar IV.27

Tampilan Halaman Login Customer

61

Gambar IV.28

Tampilan Halaman Keranjang Belanja

Gambar IV.29

Tampilan Halaman Selesai Belanja

62

4.3. Code Generation

A. Halaman Login Customer

<?php

error_reporting(0);

session_start();

if (empty($_SESSION['namauser']) AND empty($_SESSION['passuser'])){

?>

<div class="login_sec">

<div class="container">

<ol class="breadcrumb">

<li><a href="index">Home</a></li>

<li class="active">Login</li>

</ol>



<h2>Login</h2>

<div class="col-md-6 log">

<form action="cek_login" method="post" id="form-2">

<h5>User Name:</h5>

<input type="text" placeholder="Email anda"

name="email" value="">

<h5>Password:</h5>

<input type="password" placeholder="Password

anda" name="password" value="">

<input type="submit" value="Login">



</form>

</div>

<div class="col-md-6 login-right">

<h3>NEW REGISTRATION</h3>

<p>Buatlah Account Member store anda dengan mengklik

tombol "CREATE ACCOUT" dibawah ini. permudah proses Checkout anda

dengan menjadi member store kami dan dapatkan informasi discount dan informasi

63

terbaru seputar KamusikStore.com</p>

<a class="acount-btn" href="account">Create an

Account</a>

</div>

</div>

</div>

<?php

}

else

{

echo "<script>window.alert('anda sudah melakukan login')</script>";

echo "<meta http-equiv='refresh' content='0; url=home'>";

}

?>

B. Halaman Cek Login

<?php

include "backend/config/koneksi.php";

function anti_injection($data){

$filter =

mysql_real_escape_string(stripslashes(strip_tags(htmlspecialchars($data,ENT_QU

OTES))));

return $filter;

}

$username = $_POST['email'];

$pass = md5($_POST['password']);

// pastikan username dan password adalah berupa huruf atau angka.

//if (!ctype_alnum($username) OR !ctype_alnum($pass)){

// echo "Sekarang loginnya tidak bisa di injeksi lho.";

//}

//else{

$login=mysql_query("SELECT * FROM tcustomer WHERE email='$username'

64

AND password='$pass'");

$ketemu=mysql_num_rows($login);

$r=mysql_fetch_array($login);

// Apabila username dan password ditemukan

if ($ketemu > 0){

session_start();

//$_SESSION['namauser'] = $r['email'];

$_SESSION[namauser] = $r[email];

$_SESSION[namalengkap] = $r[nama_lengkap];

$_SESSION[passuser] = $r[password];

$sid_lama = session_id();

session_regenerate_id();

$sid_baru = session_id();

//mysql_query("UPDATE tcustomer SET id_session='$sid_baru' WHERE

username='$username'");

echo "<script>alert('Selamat Datang $_SESSION[namalengkap]');

window.location = 'produk'</script>";

header('location:produk');

}

else{

echo "<script>alert('Login Gagal, username atau password anda salah');

window.location = 'login'</script>";

}

//}

?>

65

C. Halaman Produk

<?php

if ($_GET['aksi']==NULL) {

?>

<div class="product-model">

<div class="container">

<ol class="breadcrumb">

<li><a href="index">Home</a></li>

<li class="active">Produk</li>

</ol>

<h2>Produk Kami</h2>

<?php include "component/menu-produk.php" ?>



<div class="col-md-9 product-model-sec">

<?php

$produk=mysql_query("select * from tproduk

where status='TAMPIL' order by rand() ");

while ($p=mysql_fetch_array($produk)) {

?>

<?php

$bil=number_format("$p[harga_jual]");

$gambar=mysql_query("select * from

tproduk_galeri where id_produk='$p[id_produk]'");

$g=mysql_fetch_array($gambar);

?>

<a href="?p=produk&aksi=detail&id=<?php echo

"$p[id_produk]"; ?>"><div class="product-grid love-grid">

<div class="more-product"><span>

</span></div>

<div class="product-img b-link-stripe b-

animate-go thickbox">

<img

66

src="backend/galeri/produk/<?php echo "$g[gambar]"; ?>" width="850px"

height="553px" class="img-responsive" alt=""/>

<div class="b-wrapper">

<h4 class="b-animate b-from-left

b-delay03">

<button class="btns"><span

class="glyphicon glyphicon-eye-open" aria-hidden="true"></span>Quick

View</button>

</h4>

</div>

</div>

</a>

<div class="product-info

simpleCart_shelfItem">

<div class="product-info-cust

prt_name">

<h4><?php echo

"$p[nama_produk]"; ?></h4>

<!-- <p>ID: SR4598</p> --

>

<span

class="item_price">Rp <?php echo "$bil"; ?></span>

<br/>

<br/>

<a

href="?p=produk&aksi=beli&id=<?php echo "$p[id_produk]"; ?>"

class="item_add items">BELI</a>

</div>

<div class="clearfix"> </div>

</div>

</div>

<?php

67

}

?>

</div>

</div>



<?php } elseif ($_GET['aksi']=='kategori'){

$jenis=mysql_query("select * from tjenis where id_jenis='$_GET[id]'");

$j=mysql_fetch_array($jenis);

?>

<?php

$ktg=mysql_query("select * from tkategori where id_kategori='$j[id_kategori]'");

$k=mysql_fetch_array($ktg);

?>

<?php include "produk-kategori.php"; ?>



<?php } elseif ($_GET['aksi']=='detail'){

?>

<?php include "produk-detail.php"; ?>

</div>

</div>

<?php } elseif ($_GET['aksi']=='beli'){

session_start();

error_reporting(0);

include "backend/config/koneksi.php";

include "backend/config/library.php";

//include "backend/config/library.php";

$sid = session_id();

$sql2 = mysql_query("SELECT stok FROM tproduk WHERE

id_produk='$_GET[id]'");

$r=mysql_fetch_array($sql2);

$stok=$r[stok];

68

if ($stok == 0){

echo "<script>alert('Stok barang yang anda beli sedang kosong');

window.location = 'produk'</script>";

}

if (empty($_SESSION['namauser']) AND empty($_SESSION['passuser'])){

echo "<script>alert('Anda harus login dahulu untuk membeli');

window.location = 'login'</script>";

}

else{

// check if the product is already

// in cart table for this session

$sql = mysql_query("SELECT id_produk FROM torder_temp

WHERE id_produk='$_GET[id]' AND id_session='$sid'");

$ketemu=mysql_num_rows($sql);

if ($ketemu==0){

// put the product in cart table

mysql_query("INSERT INTO torder_temp (id_produk, jumlah,

id_session, tgl_order_temp, jam_order_temp)

VALUES ('$_GET[id]', 1, '$sid', '$tgl_sekarang',

'$jam_sekarang')");

} else {

// update product quantity in cart table

mysql_query("UPDATE torder_temp

SET jumlah = jumlah + 1

WHERE id_session ='$sid' AND

id_produk='$_GET[id]'");

}

//deleteAbandonedCart();

//header('Location:cart');

echo "<script>window.location='cart'</script>";

}

?>

69

<?php } elseif ($_GET['aksi']=='hapus') {

$hapus=mysql_query("delete from torder_temp where id_session='$_GET[id]'");

echo "<script>

alert('Keranjang belanja telah kosong');

window.location='produk'</script>";

}

?>

<?php

function deleteAbandonedCart(){

$kemarin = date('Y-m-d', mktime(0,0,0, date('m'), date('d') - 1, date('Y')));

mysql_query("DELETE FROM orders_temp

WHERE tgl_order_temp < '$kemarin'"); }?>

4.4. Testing

A. Form Login Admin

Tabel IV.24

Hasil Pengujian Black Box Testing Form Login Admin

No. Skenario Pengujian Test Case Hasil yang diharapkan Hasil Pengujian Kesimpulan

1

Mengosongkan semua isian

data login pada login

customer, lalu mengklik

tombol ’ Login’

Username:

(kosong)

Password:

(kosong)

Sistem akan menolak akses dan

menampilkan pesan

”Username dan password tidak

dikenal”

Sesuai harapan Valid

2

Hanya mengisi data

username dan

mengosongkan data

password,lalu langsung

mengklik tombol ”Login”

Username:

admin

Password:

(kosong)

Sistem akan menolak akses

login dan akan menampilkan

pesan ”Username dan

password t idak sesuai”


3

Hanya mengisi data passwo

rd dan mengosongkan data

username, lalu langsung

mengklik tombol ” Login”

Username:

(kosong)

Password:

(admin123)




password tidak sesuai”


4

Menginputkan dengan

kond

isi salah satu benardan satu

lagi salah, lalu langsung


Username:

admin

Password:

galau(salah)




password tidak sesuai”


5

Menginputkan dengen

kondisi benar , lalu

langsung meng

klik tombol ” Login”

Username:

admin

Password:

admin123

(benar)

Sistem menerima akses login

Dan kemudian langsung men

ampilkan form Admin


70

B. Form Login Customer

Tabel IV.25

Hasil Pengujian Black Box Testing Form Login Customer

No. Skenario Pengujian Test Case Hasil yang diharapkan Hasil Pengujian Kesimpulan

1

Mengosongkan semua isian

data login pada login

customer, lalu mengklik

tombol ’ Login’

Username:

(kosong)

Password:

(kosong)

Sistem akan menolak akses dan

menampilkan pesan

“Login Gagal, username atau

password anda salah”


2

Hanya mengisi data

username dan

mengosongkan data

password,lalu langsung

mengklik tombol ”Login”

Username:

kiki@cctvst

udio.com

Password:

(kosong)



pesan “Login Gagal, username

atau password anda salah”


3

Hanya mengisi data passwo

rd dan mengosongkan data

username, lalu langsung


Username:

(kosong)

Password:

(11080801a

tan)






4

Menginputkan dengan

kond

isi salah satu benardan satu

lagi salah, lalu langsung


Username:

kiki@cctvst

udio.com

Password:

galau(salah)






5

Menginputkan dengen

kondisi benar , lalu

langsung meng

klik tombol ” Login”

Username:

kiki@cctvst

udio.com

Password:

11080801at

an (benar)

Sistem menerima akses login

Dan kemudian langsung men

ampilkan form Customer


4.5. Support

4.5.1. Publikasi Web

Penulis melakukan pembelian hosting dan domain untuk situs

www.kamusik.com pada web penyedia hosting yaitu www.idwebhost.com. Dengan

perincian biaya dan fitur – fitur yang di dapat, yaitu sebagai berikut :

1 Membeli Promo Domain + Hosting + SSL, aktif selama 12 bulan

2 Mendapat space 1 GB dengan bandwidth Unlimited

3 Mendapat account email unlimited

4 Mendapat SQL database Unlimited

5 Mendapat Subdomain unlimited

http://www.kamusik.com/

http://www.masterweb.net./

71

6 Dan memiliki beberapa bonus lainnya

Penulis memilih Idwebhost.com , karena mempunyai server yang stabil dan

maintenance yang sangat cepat merespon client baik melalui chat atau melalui email ,

ditambah pula online 24 jam.

Langkah – langkah mengupload ke web server www.kamusik.com, sebagai

berikut :

1. Penulis menggunakan software coreftp untuk mengupload pada web server

tujuan.

2. Setelah selesai upload penulis juga membuat database pada phpmyadmin di

cpanel domain dari villaphonee.

3. Database sudah dibuat, lalu penulis melakukan upload file sql, yaitu file hasil

convert dari webserver offline.

4. Penulis menggunakan Mozzila Firefox untuk membuka web www.kamusik.com,

Secara keseluruhan web dapat berjalan dengan cepat tanpa ada loading yang

terlalu lama.

4.5.2 Spesifikasi Hardware dan Software

Perangkat keras yang dimaksud disini adalah seperangkat alat atau elemen

elektronik yang dapat membantu sistem yang diusulkan sehingga program yang

diusulkan oleh penulis dapat bekerja dengan baik

Tabel IV.26

Spesifikasi Hardware dan Software

Kebutuhan Keterangan

Sistem Operasi : Windows XP dan sesudahnya

Processor : Pentium Core 2 Duo, 2.4 GHz

http://www.kamusik.com/

http://www.villaphonee.com/

72

RAM : 2 GB

Harddisk : 160 GB

CD-ROM : 52x

Monitor : SVGA 17“

Keyboard : 108 Key

Printer : HP 1010

Mouse : Standard

Browser : Mozilla Firefox, Google Chrome

Software : Dreamweaver, Adobe Photoshop, Php My Admin

4.6 Spesifikasi Dokumen Sistem Usulan

Adapun yang dimaksud dengan bentuk dokumen sistem usulan adalah

rancangan terinci dari bentuk dokumen – dokumen yang masuk atau dokumen

masukandan dokumen keluaran untuk kemudian diproses sebagai data,

dokumen tersebut adalah :

a. Nama dokumen :Invoice Penjualan

Fungsi : Sebagai bukti transaksi penjualan barang

Sumber :Admin

Tujuan : Customer

Media : Tampilan

Frekuensi : Setiap ada penjualan

Format : Lampiran B -1

b. Nama dokumen :Surat Pesanan

Fungsi : Sebagai bukti pemesanan barang

Sumber :Admin

Tujuan : Customer

73

Media : Tampilan

Frekuensi : Setiap ada penjualan


c. Nama dokumen :Laporan Stock Barang

Fungsi : Sebagai laporan stock kepada pemilik

Sumber :Admin

Tujuan : Pemilik

Media : Tampilan

Frekuensi : Setiap diminta / Per Bulan


d. Nama dokumen :Laporan Penjualan

Fungsi : Sebagai laporan penjualan kepada pemilik

Sumber :Admin

Tujuan : Pemilik

Media : Tampilan

Frekuensi : Setiap diminta / Per Bulan

Format : Lampiran B - 4

BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4.1. … · Admin dapat mengelola data penjualan barang....

Documents

Transcript of BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4.1. … · Admin dapat mengelola data penjualan barang....