vi
ABSTRAK
Perkembangan teknologi dibidang informasi sudah semakin maju sekarang. Penggunaan web untuk menyalurkan suatu informasi sudah semakin banyak digunaan. Penggunaan web tidak hanya membantu dalam menyalurkan informasi, tetapi juga membantu dalam hal perkerjaan. Pada laporan ini web digunaan tidak hanya sebagai media untuk menyalurkan informasi tetapi juga sebagai media untuk membantu dalam pekerjaan. Hal itu yang membuat Tamansari Tera ingin untuk menggunakan media web untuk membantu para pelanggannya dalam membeli, membooking, dan memanage kamar apartemen yang dimiliki. Penggunaan web untuk membantu pekerjaan pihak Tamansari Tera bertujuan untuk mempermudah pelanggan. Tidak perlu nya interaksi dalam proses pembelian. Kemudahan dalam melakukan pembelian kamar. Ketepatan informasi tentang kamar-kamar yang ditawarkan. Serta kemudahan dalam memanage kamar yang telah dimiliki. Sistem ini menggunakan bahasa pemrograman PHP dengan database MySQL. Tampilan yang interaktif yang membantu pelanggan dalam menggunakan web ini.
ABSTRACT
The developments in the field of information technology is more advanced now. Using web to deliver a lot of information is getting more and more useable. The use web is not only helps in distributing information, but also helps people on their jobs. In this report, web is not only use as a medium to channel information but also as a medium to assist in the work. That's what makes Tamasari Tera want to use the web media to assist customers in purchasing, to book and manage the apartment room that they owned. The use of the web to help work the Tamansari
Tera aims to simplify the customer. No need for direct interaction in the buying
process. The ease of purchase rooms. The accuracy of the information about the offered rooms. And ease in managing the rooms that have been owned. This system uses the programming language PHP with MySQL database. An interactive display that help customers in using this web.
viii
DAFTAR ISI
LEMBAR PENGESAHAN ... i
PERNYATAAN ORISINALITAS LAPORAN PENELITIAN... ii
PERNYATAAN PUBLIKASI LAPORAN PENELITIAN ... iii
PRAKATA ... iv
ABSTRAK ... vi
ABSTRACT ... vii
DAFTAR ISI ... viii
DAFTAR GAMBAR ... xii
DAFTAR TABEL ... xvii
BAB 1. PENDAHULUAN ... 1
1.1 Latar Belakang Masalah ... 1
1.2 Rumusan Masalah ... 2
1.3 Tujuan Pembahasan ... 3
1.4 Ruang Lingkup Kajian... 3
1.5 Sumber Data ... 5
1.6 Sistematika Penyajian ... 5
BAB 2. KAJIAN TEORI ... 7
2.1 Sistem Informasi ... 7 2.2 E-mail Gateway ... 8 2.3 Bootstrap ... 8 2.4 PHP Hypertext Preprocessor ... 9 2.5 MVC (Model-View-Controller) ... 10 2.6 MVC dan PHP ... 12 2.6 MySQL ... 14 2.7 ERD ... 15 2.7.1 Entitas ... 16 2.7.2 Atribut ... 16 2.7.3 Relasi ... 16 2.8 JavaScript ... 16 2.9 CSS ... 17
2.10 Building Management ... 17
2.11 Flow Chart ... 18
2.12 Use Case ... 18
2.13 Activity Diagram ... 19
2.14 AJAX ... 19
BAB 3. ANALISIS DAN RANCANGAN SISTEM ... 22
3.1 Proses Bisnis ... 22
3.1.1 Proses Reservasi dan Booking Apartemen ... 22
3.1.2 Proses Menyelesaikan Booking... 24
3.1.3 Proses Switch Room ... 25
3.1.4 Proses Menggunakan Fasilitas... 26
3.2 Use Case ... 28
3.2.1 System Web Tamansari Tera ... 28
3.2.2 Sub System Mengelola Data Profilie ... 29
3.2.3 Sub System Mengelola Data Reservasi ... 30
3.2.4 Sub System Mengelola Data Billing ... 30
3.2.5 Sub System Mengelola Data Construction ... 31
3.2.6 Sub System Mengelola Data Room ... 32
3.2.7 Sub System Mengelola Data Facility ... 32
3.2.8 Sub System Mengelola Data User ... 33
3.2.9 Sub System Mengelola Data Payment Type ... 34
3.3 Acitivity Diagram ... 35 3.3.1 Signup ... 35 3.3.2 Login ... 37 3.3.3 Logout ... 38 3.3.4 Edit Profile ... 39 3.3.5 Reservation ... 41 3.3.6 Payment ... 43 3.3.7 Facility ... 44 3.3.8 Admin Status ... 47 3.3.9 User Status ... 48 3.3.10 Booking Room ... 50
x
3.3.11 Switch Room ... 51
3.4 ERD ... 52
3.5 Transformasi ERD ke Tabel... 53
3.5.1 Tabel User... 54 3.5.2 Tabel Billing... 55 3.5.3 Tabel Repayment ... 55 3.5.4 Tabel Payment ... 56 3.5.5 Tabel Room... 56 3.5.6 Tabel Type ... 56 3.5.7 Tabel Room_has_facility ... 57 3.5.8 Tabel Facility ... 57 3.5.9 Tabel Log ... 57 3.5.10 Tabel Type ... 58 3.5.11 Tabel Construction ... 58 3.5.12 Tabel Gallery... 59 3.5.13 Tabel Administrator ... 59
3.6 Rancangan Desain Antarmuka ... 59
3.6.1 Halaman Awal ... 60
3.6.2 Halaman Admin ... 60
3.6.3 Room Reservation... 67
3.6.4 User Profile ... 69
3.6.5 User Room ... 70
BAB 4. Hasil Penelitian ... 73
4.1 Halaman Awal ... 73 4.2 Halaman Admin ... 76 4.2.1 View Construction ... 83 4.2.2 Add Construction ... 83 4.2.3 View Rooms ... 84 4.2.4 Booked Rooms ... 84 4.2.5 Add Type ... 87 4.2.6 View Type ... 87 4.2.7 View Facility ... 89
4.2.8 Add Facility... 91
4.2.9 View User ... 91
4.2.10 View Admin ... 95
4.2.11 Add Admin ... 96
4.2.12 View All Billing ... 96
4.2.13 View All Paymentss... 98
4.2.14 Report ... 100
4.2.15 View Payment Type ... 100
4.2.16 Add Payment Type... 102
4.2.17 Log ... 102
4.3 Room Reservation ... 103
4.4 User Profile ... 110
4.5 User Room ... 111
4.5.1 Repayment Room ... 112
4.5.2 User Detailed Room ... 112
BAB 5. PEMBAHASAN DAN UJI COBA HASIL PENELITIAN ... 116
5.1 Pengujian Halaman Login User ... 116
5.2 Pengujian Halaman Login Admin ... 117
5.3 Pengujian Halaman Signup ... 117
5.4 Pengujian Halaman Edit Profile ... 118
5.5 Pengujian Halaman User Room ... 118
5.6 Pengujian Halaman Add Construction ... 119
5.7 Pengujian Halaman Add Facility ... 119
5.8 Pengujian Halaman Edit Facility ... 119
5.9 Pengujian Halaman Add Type ... 120
5.10 Pengujian Halaman Edit Type ... 120
5.11 Pengujian Halaman Add Admin ... 121
5.12 Pengujian Halaman Add Admin ... 122
BAB 6. SIMPULAN DAN SARAN ... 123
6.1 Simpulan ... 123
6.2 Saran ... 123
xii
DAFTAR GAMBAR
Gambar 2.1 Tampilan Halaman Bootstrap ... 9
Gambar 2.2 Movel View Controller ... 11
Gambar 2.3 Syntax View ... 13
Gambar 2.4 Syntax Model ... 13
Gambar 2.5 Syntax Controller ... 14
Gambar 2.6 Syntax Function AJAX ... 20
Gambar 2.7 Syntax Action AJAX ... 20
Gambar 2.8 Syntax Toggle AJAX ... 21
Gambar 3.1 Flowchart Proses Resevasi dan Pembelian Apartemen ... 24
Gambar 3.2 Proses Menyelesaikan Booking ... 25
Gambar 3.3 Proses Switch Room ... 26
Gambar 3.4 Proses Menggunakan Fasilitas ... 28
Gambar 3.5 Use Case System Web Tamansari Tera ... 29
Gambar 3.6 Sub System Mengelola Data Profile ... 30
Gambar 3.7 Use Case Sub System Mengelola Data Reservasi ... 30
Gambar 3.8 Use Case Sub System Mengelola Data Billing ... 31
Gambar 3.9 Use Case Sub System Mengelola Data Construction... 31
Gambar 3.10 Use Case Sub System Mengelola Data Room ... 32
Gambar 3.11 Use Case Sub System Mengelola Data Facility ... 33
Gambar 3.12 Use Case Sub System Mengelola Data User ... 34
Gambar 3.13 Use Case Sub System Mengelola Data Payment Type ... 34
Gambar 3.14 Activity Diagram Signup ... 36
Gambar 3.15 Activity Diagram Login ... 38
Gambar 3.16 Activity Diagram Logout ... 39
Gambar 3.17 Activity Diagram Edit Profile ... 41
Gambar 3.18 Activity Diagram Reservation ... 42
Gambar 3.19 Activity Diagram Payment ... 44
Gambar 3.20 Activity Diagram Facility ... 46
Gambar 3.21 Activity Diagram Admin Status ... 48
Gambar 3.23 Activity Diagram Booking Room ... 50
Gambar 3.24 Activity Diagram Switch Room ... 52
Gambar 3.25 ERD Web Apartemen ... 53
Gambar 3.26 Rancangan Tampilan Halaman Awal Web ... 60
Gambar 3.27 Rancangan Tampilan Halaman Login Admin ... 61
Gambar 3.28 Rancangan Tampilan Halaman Home Admin ... 62
Gambar 3.29 Rancangan Tampilan Halaman Untuk View ... 62
Gambar 3.30 Rancangan Tampilan Halaman Add Construction ... 63
Gambar 3.31 Rancangan Tampilan Halaman Reservation ... 63
Gambar 3.32 Rancangan Tampilan Form Email ... 64
Gambar 3.33 Rancangan Tampilan Halaman Add Facility ... 64
Gambar 3.34 Rancangan Tampilan Halaman Profile User... 65
Gambar 3.35 Rancangan Tampilan Halaman Rincian Pembelian Kamar .... 65
Gambar 3.36 Rancangan Tampilan Halaman Switch Room ... 66
Gambar 3.37 Rancangan Tampilan Halaman Add Admin ... 66
Gambar 3.38 Rancangan Tampilan Halaman Reservation Room ... 67
Gambar 3.39 Rancangan Tampilan Halaman Room Details ... 68
Gambar 3.40 Rancangan Tampilan Halaman Room Information ... 68
Gambar 3.41 Rancangan Tampilan Halaman Profile User... 69
Gambar 3.42 Rancangan Tampilan Halaman Edit Profile ... 70
Gambar 3.43 Rancangan Tampilan Halaman User Room ... 71
Gambar 3.44 Rancangan Tampilan Halaman Repayment Room... 71
Gambar 3.45 Rancangan Tampilan Halaman User Detailed Room ... 72
Gambar 4.1 Tampilan Halaman Awal Web ... 73
Gambar 4.2 Tampilan Halaman About ... 74
Gambar 4.3 Tampilan Halaman Room... 75
Gambar 4.4 Tampilan Halaman Construction ... 75
Gambar 4.5 Tampilan Halaman Contact ... 76
Gambar 4.6 Tampilan Halaman Login Admin ... 76
Gambar 4.7 Tampilan Halaman Home Admin... 77
Gambar 4.8 Notifikasi Pending Payment ... 77
xiv
Gambar 4.10 Notifikasi Reminder ... 79
Gambar 4.11 Tampilan Halaman Reminder ... 79
Gambar 4.12 Tombol Send Reminder ... 80
Gambar 4.13 Form Send Reminder ... 80
Gambar 4.14 Notifikasi Late Payments ... 80
Gambar 4.15 Tampilan Halaman Late Payments ... 81
Gambar 4.16 Tombol Send Warning ... 81
Gambar 4.17Gambar 4.17 Form Send Warning ... 82
Gambar 4.18 Notifikasi Booked Rooms ... 82
Gambar 4.19 Tampilan Halaman View Construction ... 83
Gambar 4.20 Tampilan Halaman Add Construction ... 83
Gambar 4.21 Tampilan Halaman View Rooms ... 84
Gambar 4.22 Tombol Next ... 84
Gambar 4.23 Tampilan Halaman Booked Rooms ... 85
Gambar 4.24 Halaman Reservation ... 85
Gambar 4.25 Form Email... 86
Gambar 4.26 Email Sent Notification ... 86
Gambar 4.27 Tombol Cancel ... 86
Gambar 4.28 Tampilan Halaman Add Type ... 87
Gambar 4.29 Tampilan Halaman Room Type ... 88
Gambar 4.30 Tampilan Denah Room ... 88
Gambar 4.31 Tombol Edit ... 89
Gambar 4.32 Tampilan Halaman Edit Type ... 89
Gambar 4.33 Tampilan Halaman View Facility ... 90
Gambar 4.34 Tampilan Halaman Edit Facility ... 90
Gambar 4.35 Tampilan Halaman Add Facility ... 91
Gambar 4.36 Tampilan Halaman View User ... 92
Gambar 4.37 Tombol View ... 92
Gambar 4.38 Tampilan Halaman Profile User ... 92
Gambar 4.39 Tampilan Halaman Rincian Pembelian Kamar ... 93
Gambar 4.40 Tombol Print ... 93
Gambar 4.42 Tombol Switch ... 94
Gambar 4.43 Halaman Switch Room ... 94
Gambar 4.44 Notification Switch Room ... 95
Gambar 4.45 Tampilan Halaman View Admin ... 95
Gambar 4.46 Tampilan Halaman Add Admin ... 96
Gambar 4.47 Notification New Employee ... 96
Gambar 4.48 Tampilan Halaman View All Billing ... 97
Gambar 4.49 Halaman Detail Billing ... 97
Gambar 4.50 Tampilan Halaman View All Payments ... 98
Gambar 4.51 Tombol View Attachment ... 98
Gambar 4.52 Tampilan Attachment ... 99
Gambar 4.53 Tombol Send Email ... 99
Gambar 4.54 Form Email... 100
Gambar 4.55 Tampilan Halaman Report ... 100
Gambar 4.56 Tampilan Halaman View Payment Type ... 101
Gambar 4.57 Tampilan Halaman Edit Payment Type ... 101
Gambar 4.58 Tampilan Halaman Add Payment Type ... 102
Gambar 4.59 Notifikasi Add Payment Type ... 102
Gambar 4.60 Tampilan Halaman Log ... 103
Gambar 4.61 Tombol View Rooms ... 103
Gambar 4.62 Tampilan Halaman Select Floor ... 103
Gambar 4.63 Tampilan Halaman Floor Selected ... 104
Gambar 4.64 Pop-up Room Status ... 104
Gambar 4.65 Tampilan Halaman Room Details ... 105
Gambar 4.66 Tombol Buy/Book ... 105
Gambar 4.67 Tampilan Halaman Room Information ... 106
Gambar 4.68 Tab Credit ... 107
Gambar 4.69 Payment Notification ... 107
Gambar 4.70 Tab Cash ... 108
Gambar 4.71 Tab Booked ... 108
Gambar 4.72 Tab KPA ... 109
xvi
Gambar 4.74 Tampilan Halaman Profile ... 110
Gambar 4.75 Tampilan Halaman Edit Profile ... 111
Gambar 4.76 Tampilan Halaman User Room ... 111
Gambar 4.77 Tampilan Halaman Repayment Room ... 112
Gambar 4.78 Tampilan Halaman User Detailed Room ... 113
Gambar 4.79 Tombol Register ... 113
Gambar 4.80 Tombol Unregistered ... 113
Gambar 4.81 Form Add-On ... 113
Gambar 4.82 Tampilan Tab Facilities ... 114
Gambar 4.83 Tombol Pay ... 114
Gambar 4.84 Form Upload ... 115
Gambar 4.85 Tampilan Tab Monthly Bill ... 115
DAFTAR TABEL
Tabel 3.1 Table User ... 54
Tabel 3.2 Table Billing ... 55
Tabel 3.3 Tabel Repayment ... 55
Tabel 3.4 Tabel Payment ... 56
Tabel 3.5 Tabel Room ... 56
Tabel 3.6 Tabel Type ... 56
Tabel 3.7 Tabel Room_has_facility ... 57
Tabel 3.8 Tabel Facility ... 57
Tabel 3.9 Tabel Log ... 58
Tabel 3.10 Tabel Type ... 58
Tabel 3.11 Tabel Construction ... 58
Tabel 3.12 Tabel Gallery... 59
Tabel 3.13 Tabel Administrator ... 59
Tabel 5.1 Tabel Pengujian Halaman Login User ... 116
Tabel 5.2 Tabel Pengujian Halaman Login Admin ... 117
Tabel 5.3 Tabel Pengujian Halaman Signup ... 117
Tabel 5.4 Tabel Pengujian Halaman Edit Profile ... 118
Tabel 5.5 Tabel Pengujian Halaman User Room ... 118
Tabel 5.6 Tabel Pengujian Halaman Add Construction ... 119
Tabel 5.7 Tabel Pengujian Halaman Add Facility ... 119
Tabel 5.8 Tabel Pengujian Halaman Edit Facility ... 120
Tabel 5.9 Tabel Pengujian Halaman Add Type ... 120
Tabel 5.10 Tabel Pengujian Halaman Edit Type ... 120
Tabel 5.11 Tabel Pengujian Halaman Add Admin ... 121