BAB IV DESKRIPSI KERJA PRAKTEK
4.1
Metodologi Penelitian Dalam pelaksanaan kerja praktek dilakukan pendekatan dengan cara
peninjauan untuk masalah apa yang terdapat di dalam field office Joint Operating Body Pertamina-Petrochina East Java. Peninjauan ini dilakukan untuk mendapatkan data dan informasi yang berhubungan dengan penyelesaian masalah. Adapun metode yang dilakukan selama menyelesaikan kerja praktek di Joint Operating Body Pertamina-Petrochina East Java adalah sebagai berikut: 1. Analisis Sistem, yaitu mengidentifikasi hubungan dari seluruh masalah untuk menyelidiki kesistematisan tujuan dari sistem yang tidak efektif kemudian menguraikannya secara sistematis sistem yang ada sehingga nantinya didapatkan suatu sistem yang baru yang menunjang kinerja dari perusahaan tersebut. 2. Perancangan
sistem,
yaitu
pembuatan
alur
proses
sistem
yang
berhubungan dengan dokumen field office Joint Operating Body Pertamina-Petrochina
East Java
yang nantinya diharapkan dapat
membantu pihak perusahaan untuk menyelesaikan masalah yang ada pada perusahaan tersebut. 3. Testing dan implementasi, yaitu menerapkan aplikasi yang telah dibuat agar dapat digunakan secara maksimal dan benar untuk mengatasi masalah yang ada selama ini pada field office Joint Operating Body PertaminaPetrochina East Java.
23
24
4. Dokumentasi, yaitu mengadakan pembuatan suatu dokumen yang akan menunjang aplikasi yang telah dibuat agar nantinya sistem dapat dikembangkan lebih lanjut.
4.2
Analisa Sistem Dalam pembuatan aplikasi ini dibutuhkan analisa dan perancangan sistem.
Aplikasi yang diperlukan oleh field office Joint Operating Body PertaminaPetrochina East Java adalah sebuah aplikasi yang dapat menangani proses Routing Document secara terkomputerisasi sehingga setiap kebutuhan Request Voucher dapat dilakukan secara cepat, tepat dan akurat. Aplikasi yang dibuat merupakan sebuah aplikasi berbasis Web. Prototype Aplikasi Routing Document yang dibuat diharapkan dapat membantu pihak karyawan perusahaan dalam proses: •
Cash Advance Request Voucher yang akan dibuat.
•
Memonitoring status atau keberadaan Cash Advance Request Voucher.
•
Approval atau persetujuan dari bagian FAS/FOS/HSE, Cost Control, Cashier, Admin & Finance Manager dan Field Manager. Berikut adalah alur dari proses bisnis yang menjadi acuan dalam
pembuatan Prototype Aplikasi Routing Document Pada Joint Operating Body Pertamina-Petrochina East Java: Ketika karyawan membutuhkan dana untuk membeli, membuat, memperbaiki, atau membayar jasa yang terkait dengan infrastruktur perusahaan, karyawan tersebut diwajibkan membuat sebuah Request Voucher yang disebut Cash Advance Request Voucher yang berisi banyak parameter isian seperti nomor referensi voucher, tanggal, nama pembuat, jumlah dana yang diperlukan, tujuan penggunaan dana dan lain-lain sesuai dengan standard yang telah ditentukan pihak
25
perusahaan. Setelah itu karyawan membawa dokumen voucher tersebut ke supervisor mereka sesuai dengan departemen masing-masing untuk disetujui dan divalidasi. Jika dokumen voucher telah disetujui dan ditanda tangani pihak supervisor, maka sekretaris dari supervisor tersebut akan meneruskan ke pihak Cost Control untuk dilakukan pendataan. Dari Cost Control, Request Voucher diteruskan ke pihak Cashier untuk dilakukan pengecekan, apakah permintaan dana melebihi US$ 200 atau tidak. Jika ya maka nantinya ada prosedur tambahan diluar sistem yang akan diteruskan ke pihak General Manager untuk divalidasi. Dan jika kurang dari US$ 200 maka proses langsung dilanjutkan ke pihak Field Manager untuk divalidasi. Lalu dikembalikan ke Cashier, setelah dana cair pihak Cashier akan melakukan validasi dan menghubungi karyawan terkait untuk selanjutnya karyawan terkait bisa mengambil dana dan dokumen voucher tersebut.
4.3
Perancangan Sistem Perancangan sistem dimaksudkan untuk membantu menyelesaikan
masalah pada sistem yang sedang berjalan saat ini sehingga dapat menjadi lebih baik dengan adanya sistem terkomputerisasi. Dalam merancang sistem yang baik, kita harus melalui tahap-tahap perancangan sistem. Tahap-tahap perancangan sistem adalah meliputi: pembuatan IPO, Document Flow, System Flow, DFD, ERD, dan rancangan desain I/O (Input/Output).
26
4.3.1
Bagan IPO Prototype Aplikasi Routing Document
Gambar 4.1 Bagan IPO Prototype Aplikasi Routing Document J.O.B. Pertamina-Petrochina East Java
Pada gambar 4.1 bagan IPO prototype aplikasi routing document di atas dijelaskan mengenai inputan dari Aplikasi Routing Document adalah User sebagai pengguna sistem untuk menginputkan data-data. Request Voucher, yaitu dokumen yang berisi data-data permintaan dana. Approval, yaitu persetujuan dari beberapa manajer bagian terkait. Selanjutnya di dalam proses terjadi Routing Voucher atau dokumen berjalan dari satu tempat ke tempat lain. Dari proses tentunya diperoleh output yang berupa Complete Voucher, yaitu dokumen yang sudah divalidasi dan Cash Money.
4.3.2
Document Flow Berdasarkan hasil analisis yang telah dilakukan, aliran dokumen yang
terjadi dalam proses bisnis perusahaan tersebut dapat digambarkan dengan Document Flow. Adapun gambar Document Flow Cash Advance dapat dilihat pada gambar 4.2 dan 4.3 berikut:
27
Gambar 4.2 Document Flow Cash Advance & Expense Report Approval Process
Gambar 4.3 Lanjutan Document Flow Cash Advance & Expense Report Approval Process
28
4.3.3
System Flow Dari hasil analisis Document Flow yang terjadi di perusahaan tersebut,
maka penulis mengembangkan menjadi System Flow yang digunakan pada aplikasi yang dibangun oleh penulis yang dapat dilihat pada gambar 4.4 dan 4.5 berikut ini:
Gambar 4.4 System Flow Cash Advance & Expense Report Approval Process
Gambar 4.5 Lanjutan System Flow Cash Advance & Expense Report Approval Process
29
Dari gambar System Flow 4.4 dan 4.5 di atas, terdapat 7 hak akses di dalam aplikasi ini berdasarkan kegunaannya, yaitu: 1. Database Administrator, berwenang untuk melakukan setting manajemen user (menambah, mengedit, menghapus) akun user yang terdaftar di database. 2. Karyawan, berwenang melakukan Request Voucher, mengedit sebelum divalidasi, dan melihat status seluruh Request Voucher yang sudah dibuat. 3. FAS/FOS/HSE, memiliki wewenang hak akses untuk melihat status seluruh Request Voucher yang telah dibuat karyawan dan melakukan validasi tiap Request Voucher yang masuk. 4. Cost Control, berwenang mengecek kesiapan kas untuk dana yang akan diminta karyawan melalui Request Voucher tersebut dan melakukan validasi. 5. Cashier, berwenang mengecek batasan permintaan dana, mengeprint Complete Request Voucher dan menyiapkan dana yang akan diambil oleh karyawan. 6. Admin & Finance Manager, berwenang mengisi Request Queue apabila dana yang diminta di Requet Voucher melebihi batasan permintaan dana yaitu >$200 dan melakukan validasi tiap Request Voucher. 7. Field Manager, memiliki wewenang hak akses untuk melihat status seluruh Request Voucher yang telah dibuat karyawan dan melakukan validasi tiap Request Voucher yang masuk.
30
4.3.4
Data Flow Diagram (DFD) Data Flow Diagram dari Prototype Aplikasi Routing Document Pada Joint
Operating Body Pertamina-Petrochina East Java adalah sebagai berikut: a. Context Diagram Dalam Context Diagram dari Prototype Aplikasi Routing Document Pada Joint Operating Body Pertamina-Petrochina East Java terdapat tujuh entity yang berhubungan langsung dengan proses. Masing-masing entity mempunyai peranan penting dalam siklus hidup sistem. Untuk lebih detailnya dapat dilihat pada Gambar 4.6 :
User
FAS_FOS_ HSE
data user
Admin
data login data voucher user identified request voucher
0
approval
username password baru
request approved
complete voucher Cashier request queue
Aplikasi Routing Document JOB Pertamina Petrochina East Java Tuban
+
approval
request approved
Cost Control
approval request approved
request approved Field Manager
approval
A&F Manager
Gambar 4.6 Context Diagram Aplikasi Routing Document J.O.B. PertaminaPetrochina East Java.
31
Dari gamber 4.6 Context Diagram Aplikasi Routing Document J.O.B. Pertamina-Petrochina East Java di atas secara global dapat dijelaskan sebagai berikut: 1. Admin dapat memasukkan data user baru dan kemudian akan memberikan username dan password baru kepada user yang bersangkutan. 2. User dapat mengakses request voucher dengan cara memasukkan data login terlebih dahulu dan mengisi data voucher yang akan dibuat. 3. FAS/FOS/HSE memberikan approval sehingga status request voucher menjadi approved by FAS/FOS/HSE. 4. Cost Control memberikan approval sehingga status request voucher menjadi approved. 5. Admin&Finance Manager memberikan approval sehingga status request voucher menjadi approved by Admin & Finance Manager. 6. Field Manager memberikan approval sehingga status request voucher menjadi approved by Field Manager. 7. Cashier mengisi data request queue sehingga request voucher menjadi complete voucher yang selanjutnya bisa dicetak.
32
b. DFD Level 0 Sub Proses Aplikasi Routing Document J.O.B. Pertamina-Petrochina East Java data user Admin
username password baru
1 Proses Manajemen User
update data user
+ 1
data login
User
2 user identified
Proses Verifikasi Login
verifikasi data
User data voucher 3 Proses Request Voucher
request voucher 2
3
Level
request approved
Voucher
update data voucher
verifikasi data approval FAS_FOS_ HSE
update data voucher
request queue
4
complete voucher
Proses Routing Voucher
+
Cashier
request approved
approval request approved
request approved approval
approval
Cost Control
Field Manager A&F Manager
Gambar 4.7 DFD Level 0 Sub Proses Aplikasi Routing Document J.O.B. Pertamina-Petrochina East Java
Dari gambar 4.7 DFD Level 0 Sub Proses Aplikasi Routing Document J.O.B. Pertamina-Petrochina East Java di atas, dapat dijelaskan sebagai berikut: 1. Proses Manajemen User Admin dapat memasukkan data user baru dan kemudian akan memberikan username dan password yang akan disimpan di tabel user. 2. Proses Verifikasi Login User menginputkan data login yang berupa username dan password berdasarkan pada tabel user.
33
3. Proses Request Voucher User menginputkan data voucher untuk membuat request voucher yang akan disimpan di tabel voucher. 4. Proses Routing Voucher FAS/FOS/HSE, Cost Control, Admin&Finance Manager, Field Manager, dan Cashier memberikan approval berdasarkan level urutan departemen.
c. DFD Level 1 Sub Proses 1 Aplikasi Routing Document J.O.B. Pertamina-Petrochina East Java
Gambar 4.8 DFD Level 1 Sub Proses 1 Aplikasi Routing Document J.O.B. Pertamina-Petrochina East Java
Dari gambar 4.8 DFD Level 1 Sub Proses 1 Aplikasi Routing Document J.O.B. Pertamina-Petrochina East Java dapat dijelaskan sebagai berikut: 1. Proses Create User Admin memasukkan data user dan kemudian akan memberikan username dan password yang akan disimpan di tabel user. 2. Proses Edit User Admin mengedit data user dan kemudian akan memberikan data user terupdate yang disimpan kembali di tabel user.
34
3. Delete User Admin menghapus data user yang sudah tidak dibutuhkan dan kemudian akan memberikan sisa data user yang disimpan kembali di tabel user.
d. DFD Level 1 Sub Proses 4 Aplikasi Routing Document J.O.B. Pertamina-Petrochina East Java
Gambar 4.9 DFD Level 1 Sub Proses 4 Aplikasi Routing Document J.O.B. Pertamina-Petrochina East Java
Dari gambar 4.9 DFD DFD Level 1 Sub Proses 4 Aplikasi Routing Document J.O.B. Pertamina-Petrochina East Java dapat dijelaskan sebagai berikut: 1. Proses Approval FAS/FOS/HSE Pihak FAS/FOS/HSE memberikan approval sesuai urutan level pada tabel level sehingga request voucher approved dan disimpan di tabel voucher.
35
2. Proses Approval Cost Control Pihak Cost Control memberikan approval sesuai urutan level pada tabel level sehingga request voucher approved dan disimpan di tabel voucher. 3. Proses Approval Admin & Finance Manager Pihak Admin & Finance Manager memberikan approval sesuai urutan level pada tabel level sehingga request voucher approved dan disimpan di tabel voucher. 4. Proses Approval Field Manager Pihak Field Manager memberikan approval sesuai urutan level pada tabel level sehingga request voucher approved dan disimpan di tabel voucher. 5. Proses Approval Cashier Pihak Cashier memberikan approval request queue sesuai urutan level pada tabel level sehingga request voucher menjadi complete voucher siap cetak yang disimpan kembali di tabel voucher.
36
4.3.5 Entity Relationship Diagram (ERD) a. Conceptual Data Model (CDM) Dalam Conceptual Data Model (CDM) ini menggambarkan relasi atau hubungan antar tabel yang satu dengan yang lainnya. Tabel yang dimaksud adalah tabel userdata, level, dan voucher. Adapun CDM dapat dilihat pada gambar dibawah ini :
userdata username password name dept
have
level levelid levelname
have
v oucher v id v date v amountrp v amountus v amounttext v chargeto v chargetoid v for v requestby v requestbyid v approv eid1dept v approv ed1name v approv ed1status v approv ed1out v approv ed2name v approv ed2status v approv ed2out v approv ed3name v approv ed3status v approv ed3out v approv ed4name v approv ed4status v approv ed4out v or_curmonthus v or_curmonthrp v or_3160us v or_3160rp v or_6190us v or_6190rp v or_90us v or_90rp v or_totalus v or_totalrp v fundreceiver v fundreceiverdate v inf ormation v image
Gambar 4.10 Conceptual Data Model (CDM) Prototype Aplikasi Routing Document
b. Physical Data Model (PDM) Physical Data Model (PDM) ini adalah hasil generalisasi dari CDM pada gambar diatas. CDM apabila di-generate akan menghasilkan nama foreign key antara satu tabel dengan tabel yang lain. Adapun gambar dari PDM dapat dilihat pada gambar di bawah ini :
37
VOUCHER
USERDATA USERNAME v archar(200) LEVELID integer PASSWORD v archar(200) NAME v archar(200) DEPT v archar(200)
USERNAME = USERNAME
LEVELID= LEVELID
LEVEL LEVELID LEVELNAME
integer v archar(100)
VID USERNAME VDATE VAMOUNTRP VAMOUNTUS VAMOUNTTEXT VCHARGETO VCHARGETOID VFOR VREQUESTBY VREQUESTBYID VAPPROVEID1DEPT VAPPROVED1NAME VAPPROVED1STATUS VAPPROVED1OUT VAPPROVED2NAME VAPPROVED2STATUS VAPPROVED2OUT VAPPROVED3NAME VAPPROVED3STATUS VAPPROVED3OUT VAPPROVED4NAME VAPPROVED4STATUS VAPPROVED4OUT VOR_CURMONTHUS VOR_CURMONTHRP VOR_3160US VOR_3160RP VOR_6190US VOR_6190RP VOR_90US VOR_90RP VOR_TOTALUS VOR_TOTALRP VFUNDRECEIVER VFUNDRECEIVERDATE VINFORMATION VIMAGE
v archar(200) v archar(200) timestamp v archar(200) v archar(200) v archar(200) v archar(200) v archar(200) long v archar v archar(200) v archar(200) v archar(200) v archar(200) v archar(50) timestamp v archar(200) v archar(50) timestamp v archar(200) v archar(50) timestamp v archar(200) v archar(50) timestamp v archar(200) v archar(200) v archar(200) v archar(200) v archar(200) v archar(200) v archar(200) v archar(200) v archar(200) v archar(200) v archar(200) timestamp long v archar v archar(200)
Gambar 4.11 Physical Data Model (PDM) Prototype Aplikasi Routing Document
4.3.6
Struktur Tabel
1. Nama Tabel
: USER
Primary Key
: PERSONAL ID
Foreign Key
:-
Fungsi
: Menyimpan data user
Tabel 4.1 Tabel USERDATA Foreign Key No.
Nama Kolom
Tipe Data
Lebar
Constraint Tabel
1
PERSONALID
varchar
200
Primary Key
2
USERNAME
varchar
200
Not Null
3
LEVELID
Integer
Not Null
Kolom
38
4
PASSWORD
varchar
200
Not Null
5
NAME
varchar
200
Not Null
6
DATE
varchar
100
Not Null
2. Nama Tabel
: LEVEL
Primary Key
: LEVELID
Foreign Key
:-
Fungsi
: Menyimpan data level
Tabel 4.2 Tabel LEVEL Foreign Key No.
Nama Kolom
Tipe Data
Lebar
Constraint Tabel
1
LEVELID
Integer
2
LEVELNAME
varchar
3. Nama Tabel
Primary Key 100
: VOUCHER
Primary Key
: VID
Foreign Key
:-
Fungsi
: Menyimpan data voucher
Not Null
Kolom
39
Tabel 4.3 Tabel VOUCHER Foreign Key No
Nama Kolom
Tipe Data
Lebar
Constraint Tabel Primary
1
VID
Varchar
200 Key
2
PERSONALID
Varchar
200
Not Null
3
VDATE
Timestamp
4
VAMOUNTRP
Varchar
200
Not Null
5
VAMOUNTUS
Varchar
200
Not Null
6
VCHARGETO
Varchar
200
Not Null
7
VCHARGETOID
Varchar
200
Not Null
8
VCODENO
Varchar
200
Not Null
9
VPAYTO
Varchar
200
Not Null
10
VPAYTOID
Varchar
200
Not Null
11
VFOR
Mediumtext
12
VAPPROVEID1DEPT
Varchar
200
Not Null
13
VAPPROVED1NAME
Varchar
200
Not Null
14
VAPPROVED1STATUS
Varchar
50
Not Null
15
VAPPROVED1OUT
Timestamp
16
VAPPROVED2NAME
Varchar
200
Not Null
17
VAPPROVED2STATUS
Varchar
50
Not Null
18
VAPPROVED2OUT
Timestamp
19
VAPPROVED3NAME
Varchar
200
Not Null
20
VAPPROVED3STATUS
Varchar
50
Not Null
21
VAPPROVED3OUT
Timestamp
22
VAPPROVED4NAME
Varchar
200
Not Null
23
VAPPROVED4STATUS
Varchar
50
Not Null
24
VAPPROVED4OUT
Timestamp
Not Null
Not Null
Not Null
Not Null
Not Null
Not Null
Kolom
40
25
VOR_CURMONTHUS
Varchar
200
Not Null
26
VOR_CURMONTHRP
Varchar
200
Not Null
27
VOR_3160US
Varchar
200
Not Null
28
VOR_3160RP
Varchar
200
Not Null
29
VOR_6190US
Varchar
200
Not Null
30
VOR_6190RP
Varchar
200
Not Null
31
VOR_90US
Varchar
200
Not Null
32
VOR_90RP
Varchar
200
Not Null
33
VOR_TOTALUS
Varchar
200
Not Null
34
VOR_TOTALRP
Varchar
200
Not Null
35
VFUNDRECEIVER
Varchar
200
Not Null
36
VFUNDRECEIVERDATE
Timestamp
Not Null
37
VINFORMATION
Mediumtext
Not Null
38
VIMAGE
Varchar
200
Not Null
39
VCCA
Varchar
100
Not Null
40
VCA
Varchar
100
Not Null
41
4.3.7
Desain Input dan Output Tahap ini merupakan desain awal tampilan form input dari Prototype
Aplikasi Routing Document: 1. Desain Form Login
Gambar 4.12 Desain Form Login
Gambar 4.12 di atas merupakan rancangan desain input form login, dimana pada form tersebut user akan melakukan aktivitas menginputkan username dan password untuk dapat masuk ke dalam aplikasi.
2. Desain Form Menu Utama
Gambar 4.13 Desain Form Menu Utama
Gambar 4.13 di atas merupakan rancangan desain form menu utama, dimana pada form tersebut user dapat memilih form yang diinginkan dengan meng-klik pada link-link yang ada.
42
3. Desain Form Manajemen User
Gambar 4.14 Desain Form Manajemen User
Gambar 4.14 di atas merupakan rancangan desain form manajemen user, dimana user atau admin bisa melihat data profil semua user, membuat data profil untuk user baru dan disediakan action untuk admin agar dapat mengedit ataupun menghapus data profil masing-masing user.
4. Desain Form Edit User
Gambar 4.15 Desain Form Edit User
Gambar 4.15 di atas merupakan rancangan desain input form edit user, dimana user atau admin bisa membuat data profil untuk user baru dan mengupdate data profil untuk user mulai dari username, password, nama user, personal ID, departemen, dan level jabatan di perusahaan.
43
5. Desain Form Request Voucher
Gambar 4.16 Desain Form Request Voucher
Gambar 4.16 di atas merupakan rancangan desain input form request voucher, dimana user bisa melakukan Request Voucher dengan mengisi data-data ke dalam form yang sudah disediakan. Setelah data diisi semua maka data Request Voucher harus disimpan dengan mengklik simpan atau jika tidak jadi membuat Request Voucher bisa mengklik batal.
6. Desain Form Routing Voucher
Gambar 4.17 Desain Form Routing Voucher
Gambar 4.17 di atas merupakan rancangan desain form routing voucher, dimana user bisa melihat seluruh Request Voucher yang sudah dibuat. Disini user bisa melihat detail voucher, melakukan edit data Request Voucher atau menghapus Request Voucher.
44
7. Desain Form Detail Routing Voucher
Gambar 4.18 Desain Form Detail Routing Voucher
Gambar 4.18 di atas merupakan rancangan desain form detail routing voucher, dimana user bisa melihat salah satu detail data voucher yang sudah dibuat untuk mengetahui sudah sampai mana Request Voucher apakah sudah divalidasi manager atau masih dalam status pending.
8. Desain Form Approval Voucher
Gambar 4.19 Desain Form Approval Voucher
Gambar 4.19 di atas merupakan rancangan desain form approval voucher, dimana user dalam arti manager masing-masing departemen bisa melihat seluruh Request Voucher yang masuk. Disini user bisa melihat detail salah satu voucher dengan mengklik view pada kolom action. Pada kolom attachment akan ada link untuk mendownload dokumen tambahan yang telah disertakan.
45
9. Desain Form Detail Approval Voucher FAS/FOS/HSE
Gambar 4.20 Desain Form Detail Approval Voucher FAS/FOS/HSE
Gambar 4.20 di atas merupakan rancangan desain form detail approval voucher FAS/FOS/HSE, dimana manager bisa melihat salah satu detail data voucher yang sudah dibuat user untuk dilakukan validasi dengan mencentang salah satu button approved, pending, atau rejected. Pada form ini juga dilengkapi kolom attachment untuk memasukkan dokumen tambahan yang diperlukan.
10. Desain Form Detail Approval Voucher Cost Control
Gambar 4.21 Desain Form Detail Approval Voucher Cost Control
Gambar 4.21 di atas merupakan rancangan desain form detail approval voucher cost control, dimana manager bisa melihat salah satu detail data voucher yang sudah dibuat user untuk dilakukan validasi dengan mencentang salah satu button approved, pending, atau rejected.
46
11. Desain Form Approval Cashier
Gambar 4.22 Desain Form Approval Cashier
Gambar 4.22 di atas merupakan rancangan desain input form approval cashier, dimana cashier bisa melihat detail data Request Voucher masuk yang sudah dibuat user sebelumnya. Untuk dilakukan pengisian data tambahan untuk Voucher Queue jika dana yang diminta melebihi US$ 200.
12. Desain Form Approval Admin & Finance Manager
Gambar 4.23 Desain Form Approval Admin & Finance Manager
Gambar 4.23 di atas merupakan rancangan desain form detail approval voucher A&F Manager, dimana manager bisa melihat salah satu detail data voucher yang sudah dibuat karyawan untuk dilakukan validasi dengan mencentang salah satu button approved, pending, atau rejected.
47
13. Desain Form Approval Field Manager
Gambar 4.24 Desain Form Approval Field Manager
Gambar 4.24 di atas merupakan rancangan desain form detail approval voucher Field Manager, dimana manager bisa melihat salah satu detail data voucher yang sudah dibuat karyawan untuk dilakukan validasi dengan mencentang salah satu button approved, pending, atau rejected.
14. Desain Form Complete Voucher
Gamber 4.25 Desain Form Complete Voucher
Gambar 4.25 di atas merupakan rancangan desain form complete voucher, dimana user dalam arti bagian cashier bisa melihat seluruh Routing Voucher yang masuk dan melakukan print out salah satu Request Voucher dengan mengklik link print untuk mencetak Complete Voucher.
48
15. Desain Form Detail Complete Voucher
Gambar 4.26 Desain Form Detail Complete Voucher
Gambar 4.26 di atas merupakan desain form detail complete voucher. Dimana cashier bisa melihat salah satu detail data voucher yang sudah dibuat user sebelumnya untuk dilakukan Complete Voucher. Tetapi sebelumnya sudah divalidasi FAS/FOS/HSE, cost control, admin & finance manager. Nama pengambil dana dan Complete Voucher tersebut harus diisikan di kolom received. Setelah itu Complete Voucher bisa diprint oleh bagian cashier.
49
4.4
Testing dan Implementasi Sistem
4.4.1
Testing atau Pengujian Sistem Testing atau pengujian sistem yang dibuat sedemikian rupa untuk
mengidentifikasi adanya ketidaksesuaian hasil sebuah sistem dari Prototype Aplikasi Routing Document Pada J.O.B. Pertamina-Petrochina East Java, apakah sudah memenuhi kebutuhan user dan layak digunakan sesuai dengan apa yang diharapkan. Berikut beberapa penjelasan dari pengujian terhadap sistem:
1. Proses Login Awal
Gambar 4.27 Proses Login Awal
Gambar 4.27 di atas menunjukkan tampilan form login awal, user harus memasukkan username dan password setelah itu mengklik login jika username dan password benar maka user akan langsung masuk ke dalam menu home.
2. Proses Menu Home
Gambar 4.28 Proses Menu Home
50
Gambar 4.28 di atas menunjukkan tampilan form menu home, user bisa memilih salah satu menu yang sudah tersedia dengan mengklik link untuk melakukan langkah selanjutnya yang diinginkan user.
3. Proses Login Gagal
Gambar 4.29 Proses Login Gagal
Gambar 4.29 di atas menunjukkan tampilan peringatan akan muncul apabila user salah memasukkan username atau password, maka dengan mengklik link ulangi lagi tampilan akan otomatis kembali ke form login awal.
4. Proses Insert User
Gambar 4.30 Proses Insert User
Gambar 4.30 di atas menunjukkan tampilan form ketika admin akan melakukan insert data user baru, dengan mengklik tambah user maka selanjutnya akan muncul tampilan form add user.
51
5. Proses Add User
Gambar 4.31 Proses Add User
Gambar 4.31 di atas menunjukkan tampilan form add user, admin mengisi data user setelah itu admin mengklik simpan maka selanjutnya data user baru akan langsung tersimpan.
6. Proses Update User
Gambar 4.32 Proses Update User
Gambar 4.32 di atas menunjukkan tampilan form ketika admin akan melakukan edit atau update user, dengan mengklik icon pensil pada kolom action maka selanjutnya akan muncul tampilan form update profil user.
52
7. Proses Update Profil
Gambar 4.33 Proses Update Profil
Gambar 4.33 di atas menunjukkan tampilan form ketika admin akan melakukan update profil user, setelah merubah data user selanjutnya dengan mengklik update maka data user akan tersimpan kembali.
8. Proses Delete User
Gambar 4.34 Proses Delete User
Gambar 4.34 di atas menunjukkan tampilan peringatan akan muncul apabila admin akan melakukan hapus atau delete user, dengan mengklik icon delete (tanda silang merah) pada kolom action untuk menghapus salah satu user yang tidak digunakan lagi. Selanjutnya jika admin mengklik OK maka data terhapus dan jumlah data user pada tabel akan berkurang satu.
53
9. Proses Request Voucher
Gambar 4.35 Proses Request Voucher
Gambar 4.35 di atas menunjukkan tampilan form request voucher, user mengisi data request voucher selanjutnya jika sudah lalu user mengklik simpan maka data voucher baru akan tersimpan dan muncul pada tabel routing voucher.
10. Proses Routing Voucher
Gambar 4.36 Proses Routing Voucher
Gambar 4.36 di atas menunjukkan tampilan form routing voucher, user bisa melihat seluruh data request voucher yang sudah dibuat. Disini disediakan icon pada kolom action untuk menghapus request voucher yang akan dibatalkan.
54
11. Delete Request Voucher
Gambar 4.37 Proses Delete Request Voucher
Gambar 4.37 di atas menunjukkan tampilan peringatan akan muncul apabila user akan melakukan hapus atau delete voucher, dengan mengklik icon delete (tanda silang merah) pada kolom action untuk menghapus salah satu request voucher yang dibatalkan. Selanjutnya jika user mengklik OK maka data akan terhapus dan jumlah data voucher pada tabel akan berkurang satu.
12. Proses Search Gagal
Gambar 4.38 Proses Search Gagal
Gambar 4.38 di atas menunjukkan tampilan form routing voucher akan muncul dengan tabel kosong apabila pencarian kata atau angka yang dimaksud user tidak sesuai atau tidak ada dalam tabel routing voucher.
55
13. Proses Search Sukses
Gambar 4.39 Proses Search Sukses
Gambar 4.39 di atas menunjukkan tampilan form routing voucher akan muncul dengan tabel berisi data apabila pencarian kata atau angka yang dimaksud user sesuai atau ada dalam tabel routing voucher.
14. Proses Browse File
Gambar 4.40 Proses Browse File
Gambar 4.40 di atas menunjukkan tampilan form yang akan muncul ketika user mengklik browse untuk memasukkan suatu file guna lampiran request voucher. Setelah file dipilih lalu user mengklik Open maka file akan tersimpan bersama request voucher.
56
15. Proses Approval FAS/FOS/HSE
Gambar 4.41 Proses Approval FAS/FOS/HSE
Gambar 4.41 di atas menunjukkan tampilan form approval atau validasi dari bagian FAS/FOS/HSE, dengan mengklik approval lalu klik Save maka request voucher tersebut tersimpan kembali dan tetunya sudah divalidasi oleh bagian FAS/FOS/HSE.
16. Proses Approval Admin & Finance Manager
Gambar 4.42 Proses Approval Admin & Finance Manager
Gambar 4.42 di atas menunjukkan tampilan form approval atau validasi dari bagian Admin & Finance Manager, dengan mengklik approval lalu klik Save maka request voucher tersebut tersimpan kembali dan tentunya sudah divalidasi oleh bagian Admin & Finance Manager.
57
17. Proses Approval Field Manager
Gambar 4.43 Proses Approval Field Manager
Gambar 4.43 di atas menunjukkan tampilan form approval atau validasi dari bagian Field Manager, dengan mengklik approval lalu klik Save maka request voucher tersebut tersimpan kembali dan tetunya sudah divalidasi oleh bagian Field Manager.
18. Proses Complete Voucher
Gambar 4.44 Proses Complete Voucher
58
Gambar kedua 4.44 di atas adalah tampilan form siap cetak yang akan muncul ketika user mengklik icon pensil pada kolom detail (gambar pertama) untuk mencetak complete voucher.
4.4.2
Implementasi Sistem Implementasi sistem ini akan menjelaskan mengenai detail dari Prototype
Aplikasi Routing Document, mulai dari spesifikasi hardware/software pendukung dan fitur-fitur yang terdapat pada aplikasi:
4.4.3
Kebutuhan Sistem Sistem yang digunakan untuk menjalankan Prototype Aplikasi Routing
Document ini terdiri dari hardware dan software pendukung. Adapun hardware dan software pendukung yang digunakan adalah sebagai berikut: Spesifikasi hardware pendukung terdiri dari: 1. Microprocessor Pentium IV 2.0 Ghz atau lebih tinggi 2. Memory 512 MB atau lebih tinggi 3. Harddisk minimal 10GB Spesifikasi software pendukung terdiri dari: 1. Sistem Operasi Microsoft Windows XP Professional 2. XAMPP 1.7.2 3. Browser Mozilla Firefox
4.4.4
Interface Aplikasi Setelah merancang desain input dan output, maka dalam tahap ini penulis
merancang interface dari Prototype Aplikasi Routing Document. Adapun hasil rancangan interface Prototype Aplikasi Routing Document adalah sebagai berikut:
59
1. Interface Form Login
Gambar 4.45 Interface Form Login
Dalam form yang ditunjukkan oleh gambar 4.45 di atas, user menginputkan username dan password, dan sistem akan secara otomatis melakukan verifikasi terhadap username tersebut apakah username tersebut Admin, Karyawan, atau Manager. Jika user salah menginputkan username atau password maka akan muncul warning untuk melakukan input ulang username dan password yang benar.
2. Interface Form Utama
Gambar 4.46 Interface Form Utama
Dalam form yang ditunjukkan oleh gambar 4.46 di atas, user dapat memilih menu yang ada dengan meng-klik link yang terdapat pada form utama. Setelah link yang diinginkan di klik, maka akan tampil form sesuai link yang di klik tadi. Terdapat juga link Log out yang digunakan untuk keluar dari aplikasi.
60
3. Interface Form Request Voucher
Gambar 4.47 Interface Form Request Voucher
Dalam form yang ditunjukkan oleh gambar 4.47 di atas, user bisa melakukan Request Voucher dengan mengisi data-data ke dalam form yang sudah disediakan. Setelah data diisi semua maka data Request Voucher harus disimpan dengan mengklik simpan atau jika dibatalkan bisa mengklik batal.
4. Interface Form Routing Voucher
Gambar 4.48 Interface Form Routing Voucher
Dalam form yang ditunjukkan oleh gambar 4.48 di atas, user bisa melihat seluruh Request Voucher yang sudah dibuat. Disini user bisa melihat detail voucher, melakukan edit data Request Voucher atau menghapus Request Voucher. Terdapat juga kotak search digunakan untuk mencari berdasarkan keyword yang dimasukkan oleh user.
61
5. Interface Form Detail Routing Voucher
Gambar 4.49Interface Form Detail Routing Voucher
Dalam form yang ditunjukkan oleh gambar 4.49 di atas, user hanya bisa melihat salah satu detail data voucher yang sudah dibuat untuk mengetahui sudah sampai mana Request Voucher apakah sudah divalidasi manager atau masih dalam status pending.
6. Interface Form Approval
Gambar 4.50 Interface Form Approval
62
Dalam yang ditunjukkan oleh gambar 4.50 di atas form ini manager masing-masing departemen bisa melihat seluruh Request Voucher yang masuk. Disini user bisa melihat detail salah satu voucher dengan mengklik aksi. Pada kolom attachment bisa didownload dokumen tambahan yang telah disertakan. Terdapat juga kotak search digunakan untuk mencari berdasarkan keyword yang dimasukkan oleh user.
7. Interface Form Detail Approval FAS/FOS/HSE
Gambar 4.51 Interface Form Detail Approval FAS/FOS/HSE
Dalam form yang ditunjukkan oleh gambar 4.51 di atas, user dalam arti manager FAS/FOS/HSE bisa melihat salah satu detail data voucher yang sudah dibuat karyawan untuk dilakukan validasi dengan mencentang salah satu button approved, pending, atau rejected. Pada form ini juga dilengkapi kolom attachment untuk memasukkan dokumen tambahan yang diperlukan.
63
8. Interface Form Voucher Queue Cost Control
Gambar 4.52 Interface Form Voucher Queue Cost Control
Dalam form yang ditunjukkan oleh gambar 4.52 di atas, user dalam arti sekretaris cost control bisa melihat seluruh Request Voucher masuk yang sudah dibuat karyawan sebelumnya. Untuk dilakukan pengecekan kas atau ketersediaan dana apakah masih mencukupi untuk dana yang akan diminta. Terdapat juga kotak search digunakan untuk mencari berdasarkan keyword yang dimasukkan oleh user.
9. Interface Form Approval Cost Control
Gambar 4.53 Interface Form Approval Cost Control
Dalam form yang ditunjukkan oleh gambar 4.53 di atas, user dalam arti manager cost control bisa melihat salah satu detail data voucher yang sudah dibuat
64
karyawan sebelumnya untuk dilakukan validasi dengan mencentang salah satu button approved, pending, atau rejected. Tetapi sebelumnya sudah divalidasi FAS/FOS/HSE dan juga sudah dilakukan pengecekan kas atau ketersediaan dana oleh sekretaris cost control.
10. Interface Form Approval Cashier
Gambar 4.54 Interface Form Approval Cashier
Dalam form yang ditunjukkan oleh gambar 4.54 di atas, user dalam arti bagian cashier bisa melihat detail data Request Voucher masuk yang sudah dibuat karyawan sebelumnya. Untuk dilakukan pengisian data tambahan untuk Voucher Queue jika dana yang diminta melebihi US$ 200.
65
11. Interface Form Approval Admin & Finance Manager
Gambar 4.55 Interface Form Approval Admin & Finance Manager
Dalam form yang ditunjukkan oleh gambar 4.55 di atas, user dalam arti admin & finance manager bisa melihat salah satu detail data voucher yang sudah dibuat karyawan sebelumnya dengan permintaan dana yang melebihi US$ 200. Untuk melakukan validasi harus mencentang salah satu button approved, pending, atau rejected. Tetapi sebelumnya sudah divalidasi FAS/FOS/HSE dan cost control.
12. Interface Form Detail Approval Field Manager
Gambar 4.56 Interface Form Detail Approval Field Manager
66
Dalam form yang ditunjukkan oleh gambar 4.56 di atas, user dalam arti field manager bisa melihat salah satu detail data voucher yang sudah dibuat karyawan sebelumnya untuk dilakukan validasi dengan mencentang salah satu button approved, pending, atau rejected. Tetapi sebelumnya sudah divalidasi FAS/FOS/HSE, cost control, admin & finance manager.
13. Interface Form Complete Voucher
Gamber 4.57 Interface Form Complete Voucher
Dalam form yang ditunjukkan oleh gambar 4.57 di atas, user dalam arti bagian cashier bisa melihat seluruh Request Voucher yang masuk. Disini user bisa melihat detail salah satu voucher yang belum received dengan mengklik detail gambar pensil untuk dilakukan Complete Voucher. Terdapat juga kotak search digunakan untuk mencari berdasarkan keyword yang dimasukkan oleh user.
67
14. Interface Form Detail Complete Voucher
Gamber 4.58 Interface Form Detail Complete Voucher
Dalam form yang ditunjukkan oleh gambar 4.58 di atas user dalam arti bagian cashier bisa melihat salah satu detail data voucher yang sudah dibuat karyawan sebelumnya untuk dilakukan Complete Voucher. Tetapi sebelumnya sudah divalidasi FAS/FOS/HSE, cost control, admin & finance manager. Nama pengambil dana dan Complete Voucher tersebut harus diisikan di kolom received. Setelah itu Complete Voucher bisa diprint oleh bagian cashier.
15. Interface Form Edit Admin
Gamber 4.59 Interface Form Edit Admin
68
Dalam form yang ditunjukkan oleh gambar 4.59 di atas, admin bisa melihat data profil semua user, membuat data profil untuk user baru dan disediakan action untuk admin agar dapat mengedit ataupun menghapus data profil masing-masing user. Terdapat juga kotak search digunakan untuk mencari berdasarkan keyword yang dimasukkan oleh user.
16. Interface Detail Form Edit Admin
Gamber 4.60 Interface Detail Form Edit Admin
Dalam form yang ditunjukkan oleh gambar 4.60 di atas, admin bisa membuat data profil baru untuk user dan mengupdate data profil untuk user mulai dari username, password, nama user, personal ID, departemen, dan level jabatan di perusahaan.