BAB IV RANCANGAN SISTEM DIUSULKAN
4.1. Struktur Tabel Basis Data Bagian ini dibuat berdasarkan class diagram yang digambarkan pada bab sebelumnya, struktur tabel basis data merupakan rincian dari setiap class yang ada pada class diagram. Pembuatan program aplikasi ini penulis menggunakan satu database yaitu lasalle.sql yang terdiri dari tabel berikut :
1. Tabel datamahasiswa Nama File
: Data Mahasiswa
Panjang Record
: 76 karakter
Record Key
: user_id
Tabel IV.1 Spesifikasi File datamahasiswa No
Nama Field
Akronim
Tipe
Panjang
Keterangan
1
User ID
User_id
Varchar
11
Primary Key
2
Username
Username
Varchar
30
3
Jenis Kelamin
Jk
Varchar
15
4
Program
Program
Varchar
20
2. Tabel datauser Nama File
: Data User
Panjang Record
: 60 karakter
Record Key
: user_id
68
http://digilib.mercubuana.ac.id/
69
Tabel IV.2 Spesifikasi File datauser No
Nama Field
Akronim
Tipe
Panjang
Keterangan
1
User ID
User_id
Varchar
5
Primary Key
2
Username
Username
Varchar
20
3
Password
Password
Varchar
15
4
Hak Akses
Hakakses
Varchar
20
3. Tabel br_form Nama File
: Budget Request Form
Panjang Record
: 85 karakter
Record Key
: kode_br
Tabel IV.3 Spesifikasi File br_form No
Nama Field
Akronim
Tipe
Panjang
Keterangan
1
Kode BR Form
Kode_br
Varchar
10
Primary Key
2
Requester
requester
Varchar
25
3
Tanggal
Tgl
Date
4
Keterangan
Keterangan
Varchar
50
4. Tabel purchase_order Nama File
: Purchase Order Form
Panjang Record
: 50 karakter
Record Key
: po_number
Tabel IV.4 Spesifikasi File purchase_order No
Nama Field
Akronim
Tipe
Panjang
Keterangan
1
PO Number
Po_number
Varchar
10
Primary Key
2
Tanggal PO
Tgl_po
Date
3
Keterangan
Keterangan
Varchar
30
4
Budget Request Number
Br_number
Varchar
10
http://digilib.mercubuana.ac.id/
70
5. Tabel cashpayment Nama File
: Cash Payment Form
Panjang Record
: 20 karakter
Record Key
: cp_number
Tabel IV.5 Spesifikasi File cashpayment No
Nama Field
Akronim
Tipe
Panjang
Keterangan
1
Cash Payment Number
Cp_number
Varchar
10
Primary key
2
Tgl Transaksi
Tgl_cp
Date
3
Budget Request Number
Br_number
Varchar
10
6. Tabel invoice Nama File
: Invoice
Panjang Record
: 101 karakter
Record Key
: no_inv
Tabel IV.6 Spesifikasi File invoice No
Nama Field
Akronim
Tipe
Panjang
Keterangan
1
Invoice Number
No_inv
Varchar
10
Primary Key
2
Tanggal Transaksi
Tgl_inv
Date
3
Keterangan
keterangan
Varchar
4
Harga
Harga
Integer
5
Total
Total
Integer
6
User ID
User_id
Varchar
11
Foreign Key
7
Username
Username
Varchar
30
Foreign Key
8
Program
Program
Varchar
20
Foreign Key
7. Tabel receiptform Nama File
: Receipt Form
Panjang Record
: 111 karakter
Record Key
: rf_number
http://digilib.mercubuana.ac.id/
30
71
Tabel IV.7 Spesifikasi File receiptform No
Nama Field
Akronim
Tipe
Panjang
Keterangan
1
Receipt Form Number
Rf_number
Varchar
10
Primary Key
2
Tanggal Transaksi
Tgl_rf
Date
3
Keterangan
Keterangan
Varchar
4
Harga
Harga
Integer
5
Total
Total
Integer
6
No. Invoice
No_inv
Varchar
10
Foreign Key
7
User ID
User_id
Varchar
11
Foreign Key
8
Username
Username
Varchar
30
Foreign Key
9
Program
Program
Varchar
20
Foreign Key
30
8. Tabel transaksilaporan Nama File
: Laporan
Panjang Record
: 10 karakter
Record Key
: rf_number
Tabel IV.8 Spesifikasi File laporan No
Nama Field
Akronim
Tipe
Panjang
Keterangan
1
Kode Laporan
Kode_laporan
Varchar
10
Primary Key
3
Tanggal Awal
Tgl_awal
Date
4
Tanggal Akhir
Tgl_akhir
Date
http://digilib.mercubuana.ac.id/
72
4.2. Perancangan Tampilan (MockUp) Perancangan ini menggambarkan bagaimana tampilan web support akan dibuat, seperti diantaranya susunan menu, button, pengisian kolom apakah combo box dll dirincikan pada bagian ini. a.
Menu Login Gambar berikut adalah halaman yang akan muncul ketika user login ke dalam
aplikasi.
Gambar 4.1 Mock Up Login
http://digilib.mercubuana.ac.id/
73
b.
Menu Utama Gambar berikut adalah halaman yang akan muncul ketika admin finance login ke
dalam aplikasi.
Gambar 4.2 Mock Up Menu Utama Keterangan : a. Ketika Admin Finance login ke dalam aplikasi, hanya muncul menu : Data Master (Data User & Data Mahasiswa), Data Form (Budget Request Form). Untuk yang lainnya tidak muncul / di hidden. b. Ketika bagian penerimaan keuangan login ke dalam aplikasi, hanya muncul menu : Data Form (Receipt Form & Invoice) dan Menu Laporan (Laporan Bulanan Penerimaan). Untuk yang lainnya tidak muncul / di hidden.
http://digilib.mercubuana.ac.id/
74
c. Ketika bagian pengeluaran keuangan login ke dalam aplikasi, hanya muncul menu : Data Form (Cash Payment Form) dan Menu Laporan (Laporan Pengeluaran Keuangan). Untuk yang lainnya tidak muncul / di hidden. d. Ketika bagian Manager Finance login ke dalam aplikasi, hanya muncul menu : Menu Form Pending Approval (Budget Request Form, Cash Payment Form, Purchasing Order (PO), dan Menu Laporan (Laporan Bulanan Keseluruhan)). Untuk yang lainnya tidak muncul / di hidden. e. Ketika bagian Manager Divisi login ke dalam aplikasi, hanya muncul menu : Menu Form Pending Approval ( Budget Request Form). Untuk yang lainnya tidak muncul / di hidden. f.
Ketika bagian Head Principal login ke dalam aplikasi, hanya muncul menu : Menu Form Pending Approval (Budget Request Form). Untuk yang lainnya tidak muncul / di hidden.
g. Ketika bagian Purchasing login ke dalam aplikasi, hanya muncul menu : Menu Form Pending Approval (Purchasing Order (PO)). Untuk yang lainnya tidak muncul / di hidden.
Catatan : Untuk Menu Utilitas, di semua user muncul setiap kali user login ke dalam aplikasi.
http://digilib.mercubuana.ac.id/
75
c.
Data Mahasiswa Gambar berikut adalah halaman yang akan muncul ketika di menu utama admin
finance memilih sub menu Data Mahasiswa pada Data Master.
Gambar 4.3 Mock Up Data Mahasiswa
http://digilib.mercubuana.ac.id/
76
d.
Data User Gambar berikut adalah halaman yang akan muncul ketika di menu utama admin
finance memilih sub menu Data Mahasiswa pada Data Master.
Gambar 4.4 Mock Up Data User
http://digilib.mercubuana.ac.id/
77
e.
Budget Request Form Gambar berikut adalah halaman yang akan muncul ketika admin finance memilih
sub menu Budget Request Form pada menu Form.
Gambar 4.5 Mock Up Budget Request Form
Keterangan : a. Ketika Admin Finance selesai menginput Form Budget Request, form Budget Request masuk ke menu pending approval manager divisi. Form Budget Request harus di approval, agar bisa selanjutnya di proses oleh Manager Finance.
http://digilib.mercubuana.ac.id/
78
b. Ketika Manager Divisi sudah approval, form Budget Requst masuk ke menu pending approval Manager Finance untuk di approval. c. Setelah Manager Finance approval, form budget request masuk ke menu pending approval Head Principal untuk di approval.
f.
Invoice Gambar berikut adalah halaman yang akan muncul ketika Staff bagian
penerimaan keuangan
memilih sub menu Invoice pada menu Form.
Gambar 4.6 Mock Up Invoice
http://digilib.mercubuana.ac.id/
79
g.
Receipt Form Gambar berikut adalah halaman yang akan muncul ketika Staff bagian
penerimaan keuangan
memilih sub menu Receipt Form pada menu Form.
Gambar 4.7 Mock Up Receipt Form
http://digilib.mercubuana.ac.id/
80
h.
Laporan Bulanan Penerimaan dan Pengeluaran Keuangan Gambar berikut adalah halaman yang akan muncul ketika Staff bagian
penerimaan keuangan memilih sub menu Laporan Bulanan Penerimaan Keuangan pada Menu Laporan.
Gambar 4.8 Mock Up Laporan Bulanan Penerimaan dan Pengeluaran Keuangan
http://digilib.mercubuana.ac.id/
81
i.
Cash Payment Form Gambar berikut adalah halaman yang akan muncul ketika staff bagian
pengeluaran keuangan memilih sub menu Cash Payment Form pada menu Form.
Gambar 4.9 Mock Up Cash Payment Form
http://digilib.mercubuana.ac.id/
82
j.
Purchase Order Form Gambar berikut adalah halaman yang akan muncul ketika purchasing memilih
sub menu purchase order pada menu Form.
Gambar 4.10 Mock Up Purchase Order
Keterangan : a. Ketika bagian Purchasing approval form purchase order (PO), PO tersebut masuk ke menu form pending approval Manager Finance untuk di approval.
http://digilib.mercubuana.ac.id/