BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN

(1)

22

BAB IV

RANCANGAN SISTEM DAN PROGRAM USULAN

4.1. Analisa Kebutuhan Software A. Tahapan Analisis

Analisis kebutuhan dalam Website E-commerce pada Apotek Simpenan Kabupaten Sukabumi sebagai berikut:

Halaman User:

A1. User dapat melakukan pendaftaran akun A2. User dapat melakukan login

A3. User dapat melihat produk

A4. User dapat melihat cara berbelanja

A5. User dapat melihat informasi kontak Apotek

Halaman Admin:

B1. Admin dapat melakukan login B2. Admin dapat melihat data pelanggan B3. Admin dapat mengelola data produk B4. Admin dapat mengelola pesanan B5. Admin dapat mencetak laporan

(2)

B. Use Case Diagram

1. Use Case Diagram User

Gambar IV.1. Use Case Diagram Halaman User uc Use Case Model

User

Melakukan login Input username dan

passw ord Melakukan pendaftaran akun Melihat produk Melihat cara belanj a Melihat informasi kontak Pesan produk «include» «extend»

(3)

2. Use Case Diagram Admin

Gambar IV.2. Use Case Diagram Halaman Admin Tabel IV.1. Use Case Diagram Pendaftaran Akun

Use Case Name Daftar Akun

Requirment A2, A1

Goal User dapat melakukan daftar akun

Pre-condition User memilih menu login, klik menu daftar

Post-condition Tampil form pendaftaran

Failed end condition User tidak memilih menu daftar

Primary Actor User/customer

Main Flow/Basic Path 1. User melakukan login

2. User memilih menu login 3. User memlih menu daftar

Invariant -

uc Use Case Model

Admin

Melakukan login Input username dan

passw ord Melihat data pelanggan Mengelola data produk Mengelola pesanan Lihat laporan Tambah produk Edit produk Hapus produk Proses pesanan Cetak laporan «extend» «extend» «include» «extend» «extend» «extend»

(4)

Tabel IV.2. Use Case Diagram Login

Use Case Name Login

Requirment A2

Goal User dapat melakukan login

Pre-condition User memilih menu login

Post-condition Tampil form login

Failed end condition User tidak memilih menu login

2. User memilih menu login

3. User mengisi username dan password 4. Sitem menampilkan halaaman beranda

Invariant User memilih menu batal

Tabel IV.3. Use Case Diagram Produk

Use Case Name Produk

Requirment A2, A3

Goal User dapat melihat produk terbaru dan terlaris

Pre-condition User memilih menu produk

Post-condition Tampil data produk terbaru dan terlaris

Failed end condition User tidak memilih menu produk

2. User memilih menu produk 3. Sistem menampilkan data produk

Invariant -

Tabel IV.4. Use Case Diagram Cara Belanja

Use Case Name Cara Belanja

Requirment A2, A4

Goal User dapat melihat informasi cara belanja

Pre-condition User memilih menu cara belanja

Post-condition Tampil halaman informasi cara belanja

Failed end condition User tidak memilih menu cara belanja

2. User memilih menu cara belanja

3. Sistem menampilkan halaman cara belanja

(5)

Tabel IV.5. Use Case Diagram Kontak

Use Case Name Kontak

Requirment A2, A5

Goal User dapat melihat informasi kontak Apotek

Pre-condition User memilih menu kontak

Post-condition Tampil halaman informasi kontak Apotek

Failed end condition User tidak memilih menu kontak

2. User memilih menu kontak

3. Sistem menampilkan informasi kontak

Invariant -

Tabel IV.6. Use Case Diagram Login (Admin)

Use Case Name Login (Admin)

Requirment B1

Goal Admin dapat melakukan login dengan

menggunakan username dan password

Pre-condition Admin memilih menu login

Post-condition Tampil form login

Failed end condition Admin tidak memilih menu login

Primary Actor Admin

Main Flow/Basic Path 1. Admin memilih menu login

2. Sistem menampilkan halaman login 3. Admin mengisi form login

Invariant -

Tabel IV.7. Use Case Diagram Data Pelanggan

Use Case Name Data Pelanggan

Requirment B1, B2

Goal Admin dapat melihat data pelanggan

Pre-condition Admin memilih menu data pelanggan

Post-condition Tampil halaman data pelanggan

Failed end condition Admin tidak memilih menu data pelanggan

Main Flow/Basic Path 1. Admin melakukan login

2. Admin memilih menu data pelanggan 3. Sistem menampilkan data pelanggan

(6)

Tabel IV.8. Use Case Diagram Data Produk

Use Case Name Produk

Requirment B1, B3

Goal Admin dapat mengelola data produk

Pre-condition Admin memilih menu data produk

Post-condition Tampil halaman data produk

Failed end condition Admin tidak memilih menu data produk

2. Admin memilih menu data produk 3. Sistem menampilkan data produk 4. Admin mengelola data produk 5. Sistem mengupdate data produk

Invariant -

Tabel IV.9. Use Case Diagram Pesanan

Use Case Name Pesanan

Requirment B1, B4

Goal Admin dapat mengelola pesanan

Pre-condition Admin memilih menu pesanan

Post-condition Tampil halaman pesanan

Failed end condition Admin tidak memilih menu pesanan

2. Admin memilih menu pesanan

3. Sistem menampilkan halaman pesanan 4. Admin mengelola pesanan

5. Sistem mengupdate data pesanan

Invariant -

Tabel IV.10. Use Case Diagram Laporan

Use Case Name Laporan

Requirment B1, B5

Goal Admin dapat melihat dan mencetak laporan

Pre-condition Admin memilih menu laporan

Post-condition Tampil halaman laporan

Failed end condition Admin tidak memilih menu laporan

2. Admin memilih menu laporan

3. Sistem menampilkan halaman laporan 4. Admin mencetak laporan

(7)

C. Activity Diagram

1. Activity Diagram Pendaftaran Akun

Gambar IV.3. Activity Diagram Pendaftaran Akun act Use Case Model

Sistem User

Mulai

Memilih menu login

Klik form daftar Menampilkan form

pendaftaran

Mengisi form pendaftaran

punya akun ?

belum

Selesai punya

Klik Daftar Data pendaftaran

tersimpan

(8)

2. Activity Diagram Login

Gambar IV.4. Activity Diagram Diagram Login act Login

Sistem

Mulai

Mengisi username dan

passw ord Memv erifikasi data

Data valid

Menampilkan pesan error

Tampil halaman utama

Selesai T

Y User

(9)

3. Activity Diagram Produk

Gambar IV.5. Activity Diagram Produk act Use Case Model

Sistem User

Mulai

Memilih menu produk

Pilih produk

Menampilkan keranj ang belanj a Klik button beli

ingin belanja ? iya Selesai tidak Memilih metode pembayaran Mengisi alamat pengiriman Selesai

Melakukan login Pengecekan kesesuaian

data

Data sesuai

Klik selesai belanj a Data pemesanan

(10)

4. Activity Diagram Cara Belanja

Gambar IV.6. Activity Diagram Cara Berbelanja 5. Activity Diagram Kontak Perusahaan

Gambar IV.7. Activity Diagram Kontak act info

Mulai

Sistem

Memilih menu cara belanj a

Selesai

Menampilkan halaman informasi cara belanj a

User

act info

Mulai

Sistem

Memilih menu kontak

Selesai

Menampilkan halaman informasi kontak person

Apotek

(11)

6. Activity Diagram Login Admin

Gambar IV.8. Activity Diagram Login (Admin) 7. Activity Diagram Data Pelanggan

Gambar IV.9. Activity Diagram Data Pelanggan act Login

Sistem

Mulai

Mengisi username dan

passw ord Memv erifikasi data

Data valid

Menampilkan pesan error

Tampil halaman utama

Selesai T Y Admin act info Mulai Sistem

Memilih menu data pelanggan

Selesai

Menampilkan halaman data pelanggan

(12)

8. Activity Diagram Data Produk

Gambar IV.10. Activity Diagram Data Produk act Use Case Model

Sistem Admin

Mulai

Memilih menu produk

Input data produk

Data tersimpan Klik button simpan

tambah data produk ? iya Selesai tidak Selesai

data

(13)

9. Activity Diagram Pemesanan

Gambar IV.11. Activity Diagram Pemesanan act Use Case Model

Sistem Admin Mulai Pengecekan status pembayaran Proses order

Data order terupdate Ubah status menj adi

pengiriman

Sudah membayar ?

sudah

Selesai

data

Data sesuai Memilih menu

pemesanan

Proses order belum dapat dilanj utkan

(14)

10. Activity Diagram Laporan

Gambar IV.10. Activity Diagram Laporan act Use Case Model

Sistem Admin

Mulai

Memilih laporan penj ualan

cetak laporan ?

tidak

Selesai

data

Data sesuai Memilih menu laporan

Laporan dicetak

iya

(15)

4.2. Desain 4.2.1. Database

A. Entity Relatinship Diagram

pelanggan melakukan pesanan

Id_pelanggan* Nama_pelangg an Jenis_kelamin Username Alamat No_hp Id_pesanan * Tgl_pesanan Alamat_pe ngiriman Total_bayar Total_berat Total_item memiliki Detail_pesanan produk Kode_produk* Nama_produk Gambar Harga Stok Id_pesanan* 1 1 petugas *Id_petugas Nama_petugas Username Hak_akses Password dikelola N 1 Password Biaya_kirim Id_pengirim an Id_pelangga n Id_petugas Status_pesa nan Kode_produk Jumlah Berat subtotal memiliki Bobot Satuan Deskripsi 1 N 1 N keranjang Id_keranjang* Id_produk Tgl_keranjang Id_pelanggan Qty memiliki 1 1 1 Berat Bayar

Gambar IV.11. Entity Relatinship Diagram B. Logical Record Structure

pelanggan Id_pelanggan* Nama_pelanggan Jenis_kelamin No_hp Alamat Username Password pesanan Id_pesanan* Tgl_pesanan Alamat_pengiriman Total_item Total_berat Total_bayar Status_pesanan Id_petugas Id_pelanggan Id_pengirima Biaya_kirim Total_seluruh detail_pesanan Id_pesanan Kode_produk Jumlah Berat Subtotal petugas Id_petugas* Nama_lengkap Username Password Hak_akses produk Kode_produk* Nama_produk Stok Harga Deskripsi Bobot Satuan Gambar keranjang Id_keranjang* Id_produk Tgl_keranjang Id_pelanggan Qty Berat Bayar 1 1 N 1 1 1 1 N 1 1

(16)

C. Spesifikasi File

1. Spesifikasi File Petugas

Nama File : Petugas

Akronim : petugas

Fungsi : Untuk menyimpan data petugas

Tipe File : File Master

Organisasi File : Indexed Sequensial

Akses File : Random

Media : Hardisk

Panjang Record : 175 karakter

Kunci Field : id_petugas

Software : MySQL

Tabel IV.11. Spesifikasi File Petugas

No Elemen Data Akronim Tipe Panjang Keterangan

1 Id petugas Id_petugas Integer 5 Primary Key

2 Nama_petugas Nama_petugas Varchar 30

3 Username Username Varchar 20

4 Password Password Varchar 100

5 Hak akses Hak_akses Varchar 20

2. Spesifikasi File Pelanggan

Nama File : Pelanggan

Akronim : pelanggan

Fungsi : Untuk menyimpan data pelanggan

(17)

Media : Hardisk

Kunci Field : id_pelanggan

Software : MySQL

Tabel IV.12. Spesifikasi File Pelanggan

1 Id pelanggan Id_pelanggan Integer 5 Primary Key

2 Nama pelanggan Nama_pelanggan Varchar 35

3 Jenis kelamin Jenis_kelamin Varchar 25

4 No hp No_hp Varchar 15

5 Alamat Alamat Varchar 100

6 Username Username Varchar 20

7 Password Password Varchar 100

3. Spesifikasi File Produk

Nama File : Produk

Akronim : Produk

Fungsi : Untuk menyimpan data Produk

Media : Hardisk

Kunci Field : kode_produk

Software : MySQL

Tabel IV.13. Spesifikasi File Produk

1 Kode produk Kode_produk Varchar 10 Primary Key

2 Nama produk Nama_produk Varchar 40

(18)

4 Harga Harga Varchar 20

5 Stok Stok Integer 10

6 Bobot Bobot Integer 3

7 Satuan Satuan varchar 20

8 Deskripsi Deskripsi Text

4. Spesifikasi File Pesanan

Nama File : Pesanan

Akronim : pesanan

Fungsi : Untuk menyimpan data pesanan

Media : Hardisk

Kunci Field : id_pesanan

Software : MySQL

Tabel IV.14. Spesifikasi File Pesanan

1 Id pesanan Id_pesanan Varchar 15 Primary Key

2 Tgl pesanan Tgl_pesanan Date

3 Alamat

pengiriman Alamat_pengiriman Varchar 50

4 Total item Total_item Varchar 10

5 Total berat Total_berat Varchar 10

6 Total bayar Total_bayar Varchar 10

7 Status pesanan Status_pesanan Varchar 10

8 Id petugas Id_petugas Integer 5

9 Id pelanggan Id_pelanggan Integer 5

10 Id pengiriman Id_pengiriman Integer 3

11 Biaya kirim Biaya_kirim Double

(19)

5. Spesifikasi File Detail Pesanan

Nama File : Detail Pesanan

Akronim : Detail Pesanan

Fungsi : Untuk menyimpan data Detail Pesanan

Media : Hardisk

Kunci Field : -

Software : MySQL

Tabel IV.15. Spesifikasi File Detail Pesanan

1 Id pesanan Id_pesanan Varchar 15

2 Kode produk Kode_produk Varchar 10

3 Jumlah Jumlah Integer 5

4 Berat Berat Integer 5

5 Subtotal Subtotal Varchar 10

6. Spesifikasi File Keranjang

Nama File : Keranjang

Akronim : Keranjang

Fungsi : Untuk menyimpan data pembelian sementara

(20)

Kunci Field : id_keranjang

Software : MySQL

Tabel IV.16. Spesifikasi File Keranjang

1 Id keranjang Id keranjang Integer 5 Primary Key

2 Id produk Id produk Integer 5

3 Tgl keranjang Tgl keranjang Date

4 Id pelanggan Id pelanggan Integer 5

5 Qty Qty Integer 10

6 Berat Berat Integer 10

7 Bayar Bayar Integer 10

7. Spesifikasi File Pengiriman

Nama File : Pengiriman

Akronim : Pengiriman

Fungsi : Untuk menyimpan data pengiriman

Media : Hardisk

Kunci Field : id_pengiriman

Software : MySQL

Tabel IV.17. Spesifikasi File Pengiriman

1 Id pengiriman Id_pengiriman Integer 11 Primary Key

2 Nama

pengiriman Nama_pengiriman Varchar 25

(21)

4.2.2. Software Architecture

A. Deployment Diagram

Gambar IV.15. Deployment Diagram deployment Deployment

Main

<<Active Control>> PHP

<<Dev ice database>>

<<DBMS>> MySQL <<database>> db_apotek <<Dev ice>> <<Aplication>> Website E-commerce pada Apotek

(22)

B. Component Diagram

Gambar IV.16. Component Diagram 4.2.3. User Interface

Gambar IV.17. User Interface Beranda deployment Deployment

Database Apotek Website

E-commerce pada Apotek Serv er Website E-commerce pada Apotek use

(23)

Gambar IV.18. User Interface Produk

(24)

Gambar IV.20. User Interface Kontak

(25)

Gambar IV.22. User Interface Keranjang Belanja

(26)

Gambar IV.24. User Interface Data Pelanggan

(27)

Gambar IV.26. User Interface Data Pesanan

(28)

Gambar IV.28. User Interface Laporan Penjualan

4.3. Code Generation

<?php

$sql=mysql_query("select * from pesanan, pengiriman where pesanan.id_pengiriman = pengiriman.id_pengiriman and

pesanan.id_pesanan='$_GET[id_pesanan]'") or die (mysql_error());

$r=mysql_fetch_array($sql); if(isset($_POST['submit'])) { $pengirim = $_POST['pengirim']; $biaya_kirim = $_POST['biaya_kirim'];

(29)

$total_bayar = $_POST['total_bayar'];

$totalseluruh=$total_bayar + $biaya_kirim;

$sql = mysql_query("update pesanan set biaya_kirim='$biaya_kirim', id_petugas='$_SESSION[id_petugas]', totalseluruh='$totalseluruh', status_pesanan='Selesai' where id_pesanan='$_GET[id_pesanan]'") or die(mysql_error()); if ($sql) {

echo "<script>alert('pesanan Berhasil Disimpan');

window.location='admin.php?view=updatestok&id_pesanan=$r[id_pesanan]' ;</script>";

}

else

{

echo "<script>alert('Anda gagal menyimpan, harap periksa kembali data anda');

(30)

window.location='admin.php?view=prosespesanan';</script>"; } } ?> <div class="advanced-form-area mg-b-15"> <div class="container-fluid"> <div class="row">

<h1>Proses Pesanan</h1><br>

(31)

</div>

<label for="inputPassword3" class="col-sm-2 control-label">ID Pesanan</label>

<input type="text" class="form-control" id="inputPassword3" readonly value="<?php echo"$r[id_pesanan]";?>" name="id_pesanan">

</div>

<label for="inputPassword3" class="col-sm-2 control-label">Tujuan Pengiriman</label>

(32)

<input type="text" class="form-control" id="inputPassword3" readonly value="<?php echo"$r[alamat_pengiriman]";?>" name="alamat_pengiriman">

</div>

<label for="inputPassword3" class="col-sm-2 control-label">Nama Pengiriman</label>

<input type="text" class="form-control" id="inputPassword3" readonly value="<?php echo"$r[nama_pengiriman]";?>" name="nama_pengiriman">

</div>

<label for="inputPassword3" class="col-sm-2 control-label">Biaya Kirim</label>

(33)

</div>

<input type="hidden" class="form-control"

id="inputPassword3" value="<?php echo"$r[total_bayar]";?>" name="total_bayar">

</div>

<button style="font-size: 12px; margin-top: -15px;" class="btn btn-sm btn-primary login-submit-cs" name="submit" type="submit"><i class='fa fa-edit'></i> Proses Pesanan

(34)

<button style="margin-left:15px; margin-top: -15px; font-size: 12px;" class="btn btn-white" type="reset"><i class='fa fa-undo'></i> Batal</button> </button> </div> </div> </div> </div> </div><br> </form></div></div></div></div></div> 4.4. Testing

A. Pengujian Terhadap Form Login Admin

Tabel IV.17. Pengujian Terhadap Form Login Admin

No Skenario

Pengujian Test Case

Hasil yang diharapkan Hasil Pengujian Kesimpulan 1 Username dan Password tidak diisi kemudian di klik tombol login Username: (kosong) Password: (Kosong) Sistem akan menolak akses user dan menampilkan “LOGIN GAGAL !, username atau password anda tidak benar” Sesuai Harapan Valid 2 Mengetikkan

salah satu dari

Username: user (Benar) Sistem akan menolak Sesuai Harapan Valid

(35)

username dan password salah kemudian klik tombol login. Password: 1234 (Salah) akses user dan menampilkan “LOGIN GAGAL !, username atau password anda tidak benar”. 3 Mengetikkan username dan password dengan data yang benar kemudian klik tombol login. Username: user (Benar) Password: 12345 (Benar) Sistem menerima akses login dan menampilkan halaman admin Sesuai Harapan Valid 4.5. Support