Perancangan Aplikasi Wedding Organizer Berbasis Web

(1)

SURAT KETERANGAN

Hasil Uji Program Tugas Akhir

Yang bertanda tangan dibawah ini, menerangkan bahwa Mahasiswa Tugas Akhir

Program Diploma 3 Teknik Informatika :

Nama

:

EKA LUSYANTI MARPAUNG

NIM

:

132406185

Prog.Studi

:

D3 Teknik Informatika

Judul TA

:

PERANCANGAN APLIKASI WEDDING ORGANIZER

BERBASIS WEB

Telah melaksanakan test program Tugas Akhir Mahasiswa tersebut di atas pada

tanggal...

Dengan Hasil : SUKSES / GAGAL

Demikian diterangkan untuk digunakan melengkapi syarat pendaftaran Ujian Meja

Hijau Tugas Akhir Mahasiswa bersangkutan di Departemen Matematika FMIPA

USU Medan.

Medan, Juni 2016

Dosen Pembimbing

(Dr. Syahriol Sitorus, S.Si.M.IT)

(2)

KARTU BIMBINGAN TUGAS AKHIR MAHASISWA

Nama Mahasiswa

: EKA LUSYANTI MARPAUNG

Nomor Stambuk

: 132406185

Judul Tugas Akhir

: PERANCANGAN APLIKASI WEDDING

ORGANIZER BERBASIS WEB

Dosen Pembimbing

: Dr. Syahriol Sitorus, S.Si.M.IT

Tanggal Mulai Bimbingan

: 03 Maret 2016

Tanggal Selesai Bimbingan

:

No.

Tanggal Asisten

Bimbingan

Pembahasan pada Asistensi

Mengenai, pada Bab :

Paraf Dosen

Pembimbing

Keterangan

1. 03-03-2016

ACC judul Proposal

2. 30-03-2016

ACC Proposal

3. ACC UJI PROGRAM

4. ACC TA

5.

6.

 Kartu ini harap dikembalikan ke Departemen Matematika bila bimbingan telah selesai.

Diketahui,

Disetujui,

Ketua Prog.Studi D3Teknik Informatika,

Dosen Pembimbing,

Dr. Elly Rosmaini, M.Si.

Dr. Syahriol Sitorus, S.Si.M.IT

NIP. 196 005 201 985 032 002

NIP. 197103101997031004

(3)

LAMPIRAN PROGRAM

1. index.php

<?php session_start(); ?> <?php

include 'koneksi.php'; ?>

<!DOCTYPE html> <html lang="en">

<head>

<title>Aplikasi Wedding Organizer (WO) Berbasis

Web</title>

initial-scale=1.0">

href="http://fonts.googleapis.com/css?family=Open+Sans:400italic, 400">

(4)

href="http://fonts.googleapis.com/css?family=Lobster">

href="assets/bootstrap/css/bootstrap.min.css">

href="assets/prettyPhoto/css/prettyPhoto.css">

href="assets/css/font-awesome.css">

<!--[if lt IE 9]>

<script

src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script >

<![endif]-->

(5)

href="assets/ico/apple-touch-icon-57-precomposed.png">

</head>

<body>

<a class="btn btn-navbar"

data-toggle="collapse" data-target=".nav-collapse">

<h1>

<a class="brand"

href="index.php">Wedding Organizer</a> </h1>

(6)

<a href="index.php"><i

class="icon-home"></i><br />Home</a> </li> <li> <a

href="index.php?page=paket"><i class="icon-camera"></i><br

/>Paket</a>

</li> <li> <a

href="index.php?page=kontak"><i class="icon-envelope-alt"></i><br />Contact</a>

</li> </ul> </div> </div> </div> </div> </div> </div>

<?php

if ($_GET[page]==''){ include 'slider.php'; }

(7)

<h2>We are <span class="violet">Wedding

Organizer</span>, a super cool design wedding.</h2>

<p>We design beautiful moment for your wedding party.</p>

</div>

<?php

<div class="portfolio container"> <div class="portfolio-title"> <h3>Our Latest Work</h3> </div>

<img src="assets/img/portfolio/work1.jpg"

alt="">

<h4>Lorem Website</h4>

<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor...</p>

(8)

<a href="assets/img/portfolio/work1.jpg"

rel="prettyPhoto"><i class="icon-search"></i></a>

</div> </div>

<img src="assets/img/portfolio/work2.jpg"

alt="">

<h4>Ipsum Logo</h4>

<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor...</p>

<a href="assets/img/portfolio/work2.jpg"

rel="prettyPhoto"><i class="icon-search"></i></a>

</div> </div>

<img src="assets/img/portfolio/work3.jpg"

alt="">

<h4>Dolor Prints</h4>

<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor...</p>

(9)

</div> </div>

<img src="assets/img/portfolio/work4.jpg"

alt="">

<h4>Sit Amet Website</h4>

<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor...</p>

<a href="assets/img/portfolio/work4.jpg"

rel="prettyPhoto"><i class="icon-search"></i></a>

</div> </div> </div> </div>

<footer>

(10)

<div class="widget span3"> <h4>About Us</h4>

<p>Lorem ipsum dolor sit amet,

consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et.</p>

<div class="widget span3"> <h4>Latest Tweets</h4>

<div class="widget span3"> <h4>Flickr Photos</h4>

<div class="widget span3"> <h4>Contact Us</h4>

Address: Via Principe Amedeo 9, 10100, Torino, TO, Italy</p>

<p><i class="icon-phone"></i> Phone: 0039 333 12 68 347</p>

<p><i class="icon-user"></i> Skype:

(11)

<p><i class="icon-envelope-alt"></i> Email: <a href="">contact@andia.co.uk</a></p>

</div> </div>

</div>

</div> </div> </footer>

src="assets/bootstrap/js/bootstrap.min.js"></script>

(12)

<script

src="http://maps.google.com/maps/api/js?sensor=true"></script> <script src="assets/js/jquery.ui.map.min.js"></script> <script src="assets/js/jquery.quicksand.js"></script> <script

src="assets/prettyPhoto/js/jquery.prettyPhoto.js"></script> <script src="assets/js/scripts.js"></script>

</body>

</html>

2. menu.php

<div class="input-group

custom-search-form">

</span> </div>

</li>

(13)

<li>

<a href="index.php"><i class="fa fa-dashboard fa-fw"></i> Dashboard</a>

</li> <li>

<a href="#"><i class="fa

fa-bar-chart-o fa-fw"></i> Charts<span class="fa arrow"></span></a> <ul class="nav nav-second-level"> <li>

<a href="flot.html">Flot

Charts</a>

</li> <li> <a href="morris.html">Morris.js Charts</a> </li> </ul>

</li>

<li>

<a href="tables.html"><i class="fa

fa-table fa-fw"></i> Tables</a> </li> <li>

<a href="forms.html"><i class="fa fa-edit fa-fw"></i> Forms</a>

(14)

<li>

<a href="#"><i class="fa fa-wrench fa-fw"></i> UI Elements<span class="fa arrow"></span></a>

href="panels-wells.html">Panels and Wells</a> </li> <li> <a href="buttons.html">Buttons</a>

</li> <li> <a href="notifications.html">Notifications</a> </li>

<li> <a href="typography.html">Typography</a> </li> <li>

Icons</a>

</li> <li>

(15)

</ul>

</li>

<li>

<a href="#"><i class="fa fa-sitemap

fa-fw"></i> Multi-Level Dropdown<span class="fa

arrow"></span></a>

<a href="#">Second Level

Item</a>

</li> <li>

<a href="#">Second Level

Item</a>

</li> <li>

<a href="#">Third Level <span class="fa arrow"></span></a>

<ul class="nav

nav-third-level">

<li>

<a href="#">Third

Level Item</a>

</li> <li>

(16)

<a href="#">Third Level Item</a>

</li> <li>

<a href="#">Third

Level Item</a>

</li> <li>

<a href="#">Third

Level Item</a>

</li> </ul>

</li>

</ul>

</li>

<li>

<a href="#"><i class="fa fa-files-o fa-fw"></i> Sample Pages<span class="fa arrow"></span></a>

<a href="blank.html">Blank

Page</a>

</li> <li>

(17)

<a href="login.html">Login Page</a>

</li> </ul>

</li>

</ul>

3. login.php

<div class="panel-heading">Login</div> <div class="panel-body">

<td width="12%">Email</td>

<td width="88%"><input type="text" name="txtuser"

id="txtuser" class="form-control"></td> </tr>

<tr>

<td>Password</td>

<td><input type="password" name="txtpwd" id="txtpwd"

class="form-control"></td> </tr>

(18)

<td><input type="button" name="cmdlogin" id="cmdlogin"

value="Login" class="btn btn-primary btn-sm"></td> </tr>

</tbody> </table>

</div> </div> </div>

$(document).ready(function(e) {

$('#cmdlogin').click(function(e) { var user=$('#txtuser').val();

if (user==''){

$.alert({content:'Email belum diisi!'}); return false;

}

var pwd=$('#txtpwd').val(); if (pwd==''){

$.alert({content:'Password belum diisi!'}); return false;

}

$.post('logincek.php', {

(19)

pwd:$('#txtpwd').val() }, function (data, status){

if (data==''){

document.location.href='index.php'; }

else{

$.alert({content:data}); }

});

}); });

</script>

4. koneksi.php

<?php

if (file_exists('config.php')){ include 'config.php';

}

elseif (file_exists('../config.php')){ include '../config.php';

}

elseif (file_exists('../../config.php')){ include '../../config.php';

}

elseif (file_exists('../../../config.php')){ include '../../../config.php';

(20)

}

$db=new database('localhost', 'root', '', 'dbwo'); $db->konekdb();

5. order.php

<?php

$kodeorder=$db->tampilrecord("tblpesan", "st='0' and

idmember='$idmember'", "kodeorder"); $e=$_GET['e'];

if ($e<>''){

echo '<div class="alert alert-danger alert-dismissible"

role="alert">

<button type="button" class="close" data-dismiss="alert"

aria-label="Close"><span aria-hidden="true">×</span> </button>

<strong>Oh snap!</strong> Terjadi kesalahan, periksa kembali data anda

</div>'; }

#echo $kodeorder.' '.$idmember; ?>

<div class="panel-heading">Data Order</div> <div class="panel-body">

(21)

<p>

<a href="#" class="btn btn-info btn-sm" id="cmdselesai">Akhiri Transaksi</a>

<a href="index.php?page=riwayatorder" class="btn default btn-sm">Transaksi</a>

<input type="hidden" name="txtkodeorder" id="txtkodeorder"

value="<?php echo $kodeorder; ?>"> </p>

<td width="11%"><strong>Kode Paket</strong></td> <td width="23%"><strong>Paket</strong></td> <td width="44%"><strong>Keterangan</strong></td>

<td width="14%" align="right"><strong>Harga</strong></td> <td width="8%" align="right"> </td>

</tr> <?php $tot=0;

$qry=mysql_query("select * from tblpesan where

kodeorder='$kodeorder' and idmember='$idmember'"); while ($data=mysql_fetch_array($qry)){

$tot=$tot+$data['harga'];

$produk=$db->tampilrecord("tblpaketjenis", "kodeproduk='$data[kodeproduk]'", "produk");

(22)

<tr>

<td align="right"><?php echo

number_format($data['harga'],0); ?></td>

<td align="right"><a href="#" class="btn btn-danger btn-sm cmdhapus" id="<?php echo $data['idpesan']; ?>">Hapus</a></td> </tr>

<?php } ?> <tr>

<td colspan="3"><strong>TOTAL</strong></td>

<td align="right"><?php echo number_format($tot, 0);

?></td>

</tbody> </table>

</div> </div> </div>

$(document).ready(function(e) {

$('.cmdhapus').click(function(e) { var nilai=$(this).attr('id');

(23)

$.confirm({

title:'Konfirmasi',

content:'Apakah anda yakin ingin menghapus data ini?',

confirm:function(){

$.post('orderhapus.php', { id:nilai

}, function (data, status){ if (data==''){

document.location.href='index.php?page=order'; }

else{

$.alert({content:data}); }

}); }

}); });

$('#cmdselesai').click(function(e) { var nilai=$('#txtkodeorder').val();

/*$.confirm({

title:'Konfirmasi',

content:'Apakah anda yakin ingin mengakhiri

order?',

(24)

$.post('selesai.php', { id:nilai

}, function (data, status){ if (data==''){

document.location.href='index.php?page=order'; }

else{

$.alert({content:data}); }

}); }

}); */

$.post('selesai.php', { id:nilai

}, function (data, status){ if (data==''){

document.location.href='index.php?page=order'; }

else{

$.alert({content:data}); }

}); });

(25)

</script>

6. orderhapus.php

<?php

include 'koneksi.php';

$id=$_POST['id'];

$qry=mysql_query("delete from tblpesan where idpesan='$id'"); if ($qry){

echo ''; }

else{

echo 'Terjadi kesalahan, silahkan hubungi sistem administrator anda!';

} ?>

7. pilih.php

<?php

$tuser=$_SESSION['sesiuser'];

$idmember=$db->tampilrecord("tblmember", "email='$tuser'",

"idmember"); if ($tuser==''){

echo "<script> document.location.href='index.php'; </script>"; exit;

(26)

$kodeorder=$db->tampilrecord("tblpesan", "idmember='$idmember' and st='0'", "kodeorder");

if ($kodeorder==''){

$kodeorder=date('YmdHis'); }

$kodeproduk=$_GET['kode'];

#echo $idmember.' '.$kodeorder.' '.$kodeproduk;

$harga=$db->tampilrecord("tblpaketjenis", "kodeproduk='$kodeproduk'", "harga"); $tgl=date('Y-m-d');

if ($db->cekrecord("select * from tblpesan where

kodeproduk='$kodeproduk' and idmember='$idmember' and

kodeorder='$kodeorder'")==true){

echo "<script> document.location.href='index.php?page=order'; </script>";

} else{

$qry=mysql_query("insert into tblpesan (tgl, idmember,

kodeproduk, harga, st, kodeorder) values ('$tgl', '$idmember', '$kodeproduk', '$harga', '0', '$kodeorder')");

(27)

echo "<script> document.location.href='index.php?page=order'; </script>";

} else{

echo "<script>

document.location.href='index.php?page=order&e=error'; </script>";

} } ?>

8. produk.php

<div class="panel-heading">Daftar Paket</div> <div class="panel-body">

<td width="23%"><strong>Kode Produk</strong></td> <td width="52%"><strong>Keterangan</strong></td>

<td width="11%" align="right"><strong>Harga</strong></td> <td width="11%"> </td>

(28)

<?php $no=0;

$qry=mysql_query("select tblpaket.paket, tblpaket.jenis,

tblpaketjenis.kodeproduk, tblpaketjenis.produk,

tblpaketjenis.harga, tblpaketjenis.keterangan from tblpaket INNER JOIN tblpaketjenis ON tblpaket.kodepaket=tblpaketjenis.kodepaket

where tblpaket.jenis='Wedding Organizer' order by

tblpaketjenis.kodeproduk asc");

while ($data=mysql_fetch_array($qry)){ $no++;

?> <tr>

<td><a href="index.php?page=detail&kode=<?php echo

$data[2]; ?>"><?php echo $data[2].' '.$data[3]; ?></a></td> <td><?php echo $data[5]; ?></td>

<td align="right"><a href="index.php?page=pilih&kode=<?php echo $data[2]; ?>" class="btn btn-info">Order</a></td>

</tr> <?php } ?> </tbody> </table>

</div> </div>

(29)

</div>

9. carabayar.php

<?php

$norek=$db->tampilrecord("tblpengaturan", "kriteria='norek'",

"nilai"); ?>

</div>

10. contactus.php

<?php

$alamat=$db->tampilrecord("tblpengaturan", "kriteria='alamat'",

"nilai"); echo $alamat; ?>

11. detail.php

<?php

$kode=$_GET['kode'];

$produk=$db->tampilrecord("tblpaketjenis", "kodeproduk='$kode'",

"produk");

$harga=$db->tampilrecord("tblpaketjenis", "kodeproduk='$kode'",

(30)

$keterangan=$db->tampilrecord("tblpaketjenis", "kodeproduk='$kode'", "keterangan");

<?php echo $keterangan; ?> </div>

<div class="alert alert-warning">Harga : <?php echo

number_format($harga, 0); ?></div>

12. eo.php

<div class="panel-heading">Daftar Paket Event Organizer</div> <div class="panel-body">

<td width="23%"><strong>Kode Produk</strong></td> <td width="52%"><strong>Keterangan</strong></td>

<td width="11%" align="right"><strong>Harga</strong></td> <td width="11%"> </td>

</tr> <?php $no=0;

(31)

$qry=mysql_query("select tblpaket.paket, tblpaket.jenis,

tblpaketjenis.kodeproduk, tblpaketjenis.produk,

tblpaketjenis.harga, tblpaketjenis.keterangan from tblpaket INNER JOIN tblpaketjenis ON tblpaket.kodepaket=tblpaketjenis.kodepaket

where tblpaket.jenis='Event Organizer' order by

tblpaketjenis.kodeproduk asc");

while ($data=mysql_fetch_array($qry)){ $no++;

?> <tr>

<td><a href="index.php?page=detail&kode=<?php echo

$data[2]; ?>"><?php echo $data[2].' '.$data[3]; ?></a></td> <td><?php echo $data[5]; ?></td>

<td align="right"><a href="index.php?page=pilih&kode=<?php echo $data[2]; ?>" class="btn btn-info">Order</a></td>

</tr> <?php } ?> </tbody> </table>

</div> </div> </div>

(32)

13. galeri.php

.uli{

list-style:none; }

</style>

$('#gallery a').lightBox(); });

</script>

<div style="width:650px; background-color:#FFF; float:left;

height:auto; margin-top:20px;"> <div class="demo-container">

<h3>Galery <?php echo $p; ?> <span></span></h3>

(33)

<ul> <?php

$qry=mysql_query("select * from tblgaleri order by idgaleri desc");

while ($data=mysql_fetch_array($qry)){ ?>

<li style="float:left;

list-style:none;">

<a href="galeri/<?php echo

$data[gambar]; ?>" title="<?php echo $data[keterangan]; ?>">

<img src="galeri/<?php

echo $data[gambar]; ?>" alt="" width="200px" height="140px" style="border:solid 3px #B7B7B7;"/>

</a> </li> <?php } ?>

</ul> </div>

</section>

</div> </div>

(34)

14. home.php

<div> <?php

$a[1]="kuning"; $a[2]="biru"; $a[3]="hijau"; $a[4]="kuning"; $a[5]="biru"; $a[6]="hijau";

$no=0;

$qry=mysql_query("select * from tblpaketjenis order by RAND() limit 6");

while ($data=mysql_fetch_array($qry)){ $no++;

<h2 align="center"><a href="index.php?page=detail&kode=<?php echo

$data['kodeproduk']; ?>" class="linkdepan"><?php echo

$data[kodeproduk]; ?></a></h2>

(35)

<tr>

<td align="center"><?php echo

number_format($data[harga],0); ?></td> </tr>

<tr>

<td><a href="index.php?page=pilih&kode=<?php echo

$data[kodeproduk]; ?>" class="btn btn-danger

btn-block">ORDER</a></td> </tr>

</tbody> </table>

</div> <?php } ?>

</div>

15. isi.php

<?php

$page=$_GET[page];

if ($page==''){

include 'home.php'; }

(36)

include 'produk.php'; }

elseif ($page=='reg'){ include 'reg.php'; }

elseif ($page=='regsukses'){ include 'regsukses.php'; }

elseif ($page=='testimonial'){ include 'testimonial.php'; }

elseif ($page=='testimonialtambah'){ include 'testimonailtambah.php'; }

elseif ($page=='login'){ include 'login.php'; }

elseif ($page=='order'){ include 'order.php'; }

elseif ($page=='pilih'){ include 'pilih.php'; }

elseif ($page=='riwayatorder'){ include 'riwayatorder.php'; }

(37)

include 'eo.php'; }

elseif ($page=='galeri'){ include 'galeri.php'; }

elseif ($page=='contactus'){ include 'contactus.php'; }

elseif ($page=='detail'){ include 'detail.php'; }

elseif ($page=='carabayar'){ include 'carabayar.php'; }

16. reg.php

<div class="panel-heading">Registrasi</div> <div class="panel-body">

(38)

</tr> <tr>

<td><input type="text" name="txtnama" id="txtnama"

class="form-control"></td> </tr>

<tr>

<td>J. Kelamin</td>

<option value="Wanita">Wanita</option> </select></td>

</tr> <tr>

<td>Alamat</td>

<td><input type="text" name="txtalamat" id="txtalamat"

class="form-control"></td> </tr>

<tr>

<td>Password</td>

<td><input type="password" name="txtpwd" id="txtpwd"

class="form-control"></td> </tr>

<tr>

(39)

<td><input type="button" name="cmdreg" id="cmdreg" value="Registrasi" class="btn btn-primary"> <input type="button"

name="cmdbatal" id="cmdbatal" value="Batal" class="btn

btn-default"></td> </tr> </tbody> </table>

</div> </div> </div>

$(document).ready(function(e) { $('#cmdreg').click(function(e) { var email=$('#txtemail').val();

if (email==''){

$.alert({content:'Email pengguna tidak boleh

kosong!'});

return false; }

var nama=$('#txtnama').val(); if (nama==''){

$.alert({content:'Nama tidak boleh kosong!'}); return false;

}

(40)

if (alamat==''){

$.alert({content:'Alamat tidak boleh kosong!'}); return false;

}

var pwd=$('#txtpwd').val(); if (pwd==''){

$.alert({content:'Password tidak boleh kosong!'}); return false;

}

$.post('regsimpan.php', {

email:$('#txtemail').val(), nama:$('#txtnama').val(), jk:$('#txtjk').val(),

alamat:$('#txtalamat').val(), pwd:$('#txtpwd').val()

}, function (data, status){ if (data==''){

document.location.href='index.php?page=regsukses'; }

else{

$.alert({content:data}); }

}); }); });

(41)

</script>

17. regsimpan.php

<?php

include 'koneksi.php';

$email=$_POST['email']; $nama=$_POST['nama']; $jk=$_POST['jk'];

$alamat=$_POST['alamat']; $pwd=$_POST['pwd'];

if ($db->cekrecord("select * from tblmember where

email='$email'")==true){

echo 'Email sudah terdaftar!'; }

else{

$qry=mysql_query("insert into tblmember (email, nama, jk, alamat, pwd) values ('$email', '$nama', '$jk', '$alamat', '$pwd')");

if ($qry){ echo ''; }

else{

echo 'Terjadi kesalahan, silahkan hubungi sistem

administrator anda!'; }

(42)

} ?>

18. regsukses.php

Well done! Registrasi Sukses, silahkan login untuk melakukan transaksi.

</div> </div>

19. riwayatorder.php

<?php

$ketnorek=$db->tampilrecord("tblpengaturan", "kriteria='norek'",

"nilai"); ?>

<div class="panel-heading">Data Pesanan</div> <div class="panel-body">

<div class="alert alert-danger" role="alert"><?php echo

$ketnorek; ?></div>

(43)

<td width="21%"><strong>Paket</strong></td>

<td width="40%"><strong>Tangal Order</strong></td> <td width="8%" align="right">Status</td>

<td width="21%" align="right"><strong>Harga</strong></td> </tr>

<?php $tot=0;

$qry=mysql_query("select * from tblpesan where

idmember='$idmember' and st='1' order by idpesan desc limit 0, 30");

while ($data=mysql_fetch_array($qry)){ $tot=$tot+$data[harga];

$k=$data['konfirmasi'];

$k>=1 ? $ket="<div class='label

label-success'>Valid</div>" : $ket="<div class='alert

alert-danger'>Belum di konfirmasi</div>";

$produk=$db->tampilrecord("tblpaketjenis", "kodeproduk='$data[kodeproduk]'", "produk");

?> <tr>

(44)

<?php } ?> <tr>

<td colspan="3"><strong>TOTAL</strong></td> <td align="right"> </td>

<td align="right"><?php echo number_format($tot, 0);

?></td> </tr> </tbody> </table>

</div> </div> </div>

20. testimonial.php

<div class="panel-heading">Testimonial</div> <div class="panel-body">

<p>

<a href="index.php?page=testimonialtambah" class="btn btn-info btn-sm">Tambah Testimonial</a>

</p>

(45)

<td width="12%">Tanggal</td> <td width="31%">Nama</td> <td width="57%">Pesan</td> </tr>

<?php

$qry=mysql_query("select * from tbltestimonial order by

idtestimonial desc");

while ($data=mysql_fetch_array($qry)){ $idmember=$data[idmember];

$nama=$db->tampilrecord("tblmember", "idmember='$idmember'", "nama");

?> <tr>

<?php } ?> </tbody> </table>

</div> </div> </div>

(46)

<button type="button" class="close"

data-dismiss="modal">×</button>

<h4 class="modal-title">Tambah Testimonial</h4> </div>

<td width="87%"><input type="text" name="txtnama"

id="txtnama" class="form-control"></td> </tr>

<tr>

<td valign="top">Pesan</td>

<td><textarea name="txtpesan" id="txtpesan" cols="45"

rows="5" class="form-control"></textarea></td> </tr>

<tr>

<td><input type="button" name="cmdsimpan" id="cmdsimpan"

(47)

type="button" class="btn btn-default" data-dismiss="modal">Close</button></td>

</tr> </tbody> </table>

</div> </div>

$(document).ready(function(e) {

$('#cmdsimpan').click(function(e) { var nama=$('#txtnama').val();

if (nama==''){

$.alert({content:'Silahkan login terlebih

dahulu'});

return false; }

var pesan=$('#txtpesan').val(); if (pesan==''){

$.alert({content:'Pesan testimonial belum anda

isi!'});

return false; }

(48)

$.post('testimonialsimpan.php', { nama:$('#txtnama').val(), pesan:$('#txtpesan').val() }, function (data, status){

if (data==''){

document.location.href='index.php?page=testimonial'; }

else{

document.location.href='index.php?page=testimonial'; }

}); }); });

</script>

21. testimonialsimpan.php

<?php

include 'koneksi.php'; $email=$_POST['nama'];

$idmember=$db->tampilrecord("tblmember", "email='$email'",

"idmember");

$pesan=$_POST['pesan']; $tgl=date('Y-m-d');

(49)

$qry=mysql_query("insert into tbltestimonial (idmember, tgl, pesan) values ('$idmember', '$tgl', '$pesan')");

if ($qry){ echo ''; }

else{

echo 'Terjadi kesalahan, silahkan hubungi sistem administrator anda!';

} ?>

22. testimonialtambah.php

<div class="panel-heading">Tambah Testimonial</div> <div class="panel-body">

<td width="87%"><input name="txtnama" type="text"

class="form-control" id="txtnama" value="<?php echo $temail;?>" readonly></td>

</tr> <tr>

(50)

<td valign="top">Pesan</td>

<td><textarea name="txtpesan" id="txtpesan" cols="45"

rows="5" class="form-control"></textarea></td> </tr>

<tr>

<td><input type="button" name="cmdsimpan" id="cmdsimpan"

value="Simpan" class="btn btn-primary btn-sm"> <button

type="button" class="btn btn-default"

data-dismiss="modal">Close</button></td> </tr>

</tbody> </table>

</div> </div> </div>

$(document).ready(function(e) {

$('#cmdsimpan').click(function(e) { var nama=$('#txtnama').val();

if (nama==''){

$.alert({content:'Silahkan login terlebih

dahulu'});

return false; }

(51)

var pesan=$('#txtpesan').val(); if (pesan==''){

$.alert({content:'Pesan testimonial belum anda

isi!'});

return false; }

$.post('testimonialsimpan.php', { nama:$('#txtnama').val(), pesan:$('#txtpesan').val() }, function (data, status){

if (data==''){

document.location.href='index.php?page=testimonial'; }

else{

document.location.href='index.php?page=testimonial'; }

}); }); });

(52)

23. selesai.php

<?php

include 'koneksi.php';

$kodeorder=$_POST['id'];

$qry=mysql_query("update tblpesan set st='1' where

kodeorder='$kodeorder'"); if ($qry){

echo ''; }

else{

echo 'Terjadi kesalahan, silahkan hubungi sistem administrator anda!';

} ?>

24. logout.php

<?php session_start(); ?> <?php

unset($_SESSION['sesiuser']); unset($_SESSION['sesipwd']);

echo "<script> document.location.href='index.php'; </script>"; ?>

(53)

25. administrator/index.php

<?php error_reporting("E_ALL ^ E_NOTICE"); ?> <?php include 'cek.php'; ?>

<?php

include '../koneksi.php'; ?>

<!DOCTYPE html> <html lang="en">

<head>

<title>Halaman Administrator</title>

<link

href="bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">

(54)

<link

href="bower_components/metisMenu/dist/metisMenu.min.css" rel="stylesheet">

rel="stylesheet">

<link

href="bower_components/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">

href="../alert/css/jquery-confirm.css">

(55)

<script

src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></ script>

<script

src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js" ></script>

<![endif]--> <style>

body{

font-size:12px;

}

</style> <script

src="bower_components/jquery/dist/jquery.min.js"></script>

<script

src="bower_components/bootstrap/dist/js/bootstrap.min.js"></scrip t>

(56)

<body>

<nav class="navbar navbar-default navbar-static-top"

role="navigation" style="margin-bottom: 0"> <div class="navbar-header">

<span class="sr-only">Toggle

navigation</span>

<a class="navbar-brand"

href="index.php">Administrator</a> </div>

<a class="dropdown-toggle"

(57)

</a>

<li><a href="logout.php"><i class="fa fa-sign-out fa-fw"></i> Logout</a>

</li> </ul>

</li>

</ul>

<div class="navbar-default sidebar"

role="navigation">

</div>

</div>

</nav>

(58)

<h3 class="page-header">Dashboard</h3> </div>

</div>

</div> </div>

</div>

<script

src="bower_components/metisMenu/dist/metisMenu.min.js"></script>

<!--

(59)

<script

src="bower_components/morrisjs/morris.min.js"></script> <script src="js/morris-data.js"></script>

-->

</body>

</html>

<?php

include 'footer.php'; ?>

26. administrator/cek.php

<?php session_start(); ?> <?php

if (!isset($_SESSION[sesiadminuser]) or

!isset($_SESSION[sesiadminpwd])){

echo "<script> document.location.href='login.php'; </script>";

} ?>

(60)

27. administrator/logincek.php

<?php session_start(); ?> <?php

include '../koneksi.php';

$tusername=$_POST['txtusername']; $tpassword=$_POST['txtpassword'];

if ($db->cekrecord("select * from tbladmin where

userku='$tusername' and passku='$tpassword'")==true){ $_SESSION['sesiadminuser']=$tusername;

$_SESSION['sesiadminpwd']=$tpassword;

echo "<script> document.location.href='index.php'; </script>";

} else{

echo "<script> document.location.href='login.php?e=error';

</script>"; }

28. administrator/menu.php

<li><a href="index.php"><i class="fa fa-dashboard fa-fw"></i> Dashboard</a></li>

<li><a href="index.php?page=paket"><i

(61)

<li><a

href="index.php?page=jenispaket"><i class="fa fa-table

fa-fw"></i> Jenis Paket</a></li>

<li><a href="index.php?page=pesan"><i

class="fa fa-edit fa-fw"></i> Pemesanan</a></li>

<li><a href="index.php?page=slider"><i

class="fa fa-edit fa-fw"></i> Slider</a></li> <li><a

href="index.php?page=testimonial"><i class="fa fa-edit

fa-fw"></i> Testimonial</a></li>

<li><a href="index.php?page=galeri"><i

class="fa fa-edit fa-fw"></i> Galeri</a></li>

<li><a href="index.php?page=member"><i

class="fa fa-edit fa-fw"></i> Member</a></li> <li><a

href="index.php?page=pengaturan"><i class="fa fa-edit fa-fw"></i> Pengaturan</a></li>

</ul>

29. administrator/isi.php

<?php

$page=$_GET[page]; $sfile=$_GET[sfile]; if ($page==''){

include 'page/index.php'; }

(62)

else{

if ($sfile==''){

if (file_exists('page/'.$page.'/index.php')){ include 'page/'.$page.'/index.php'; }

else{

include 'error404.php'; }

} else{

if (file_exists('page/'.$page.'/'.$sfile.'.php')){ include 'page/'.$page.'/'.$sfile.'.php'; }

else{

include 'error404.php'; }

} }

30. administrator/logout.php

<?php session_start(); ?> <?php

unset ($_SESSION['sesiadminuser']); unset ($_SESSION['sesiadminpwd']);

(63)

Daftar Pustaka

Betha, Sidik, Ir. 2007. Pemrograman Web dengan HTML.Bandung:

Informatika

Kadir,Abdul.2003.Dasar Pemrograman Web Dinamis Menggunakan

PHP.Yogyakarta:

Ikauli

Manual

MySQL,http://www.mysql.com

.Diakses

6 Maret

2016,10.00wib

Dimas,Manual Dreamweaver,http://www.macromedia.com.Diakses6Maret

2016,10.20 wib

Sunarfrihantono, Bima. 2003. PHP dan MySQL untuk WEB. Yogyakarta:

Dyah Ayu. Studi Mengenai Keputusan Pembelian Jasa Event& Wedding

Organizer. Universitas Diponegoro: Semarang.

Trace,2007.Documentary tools in everyday life: the wedding planner.Diakses

12 Maret 2016,08.00 wib

(64)

Irkantini. 2011. Sistem informasi Perancangan E-commerce di Wulan

Wedding Organizer.Diakses 12 Maret 2016,09.00 wib

Michael. 2011. Perancangan Website Wedding Organizer Sausalito.Diakses

12 Juni 2016,10.15 wib

Yoanda,2006.Sistem keputusan pemilihan paket pernikahan hotel pada

I.S.event&Wedding Organizer.Diakses 12 Mey 2016,11.00 wib

Sucianti dan Sari.2010.Aplikasi pengolahan data internal berbasis web pada

Nadysa Wedding Organizer Palembang.Diakses 12 Mey 2016,12.00 wib

Lupiyoadi. 2011. Aplikasi Wedding organizer dan Event Organizer

berbasis web.Diakses 12 juni 2016,12.30 wib

(65)

BAB 3

ANALISA PERANCANGAN SISTEM

3.1 Analisa Sistem

Aplikasi umum yang biasa berjalan pada internet adalah sebuah halaman web yang

terletak pada sebuah situs, dimana halaman atau dokumen web tersebut dibuat dengan

menggunakan tag-tag html. Sebuah halaman web yang hanya menggunakan tag-tag

html standar yang ada akan merupakan halaman web yang statis. Untuk menjadikan

halaman web tersebut menjadi halaman web yang dinamis, interaktif, atau untuk

menjadi sebuah aplikasi diperlukan adanya tambahan pada halaman web tersebut

disamping tag yang digunakan. Pada perancangan aplikasi akan dibuat aplikasi

berbasiskan PHP. Saat ini teknologi PHP dapat dikatakan telah mendominasi

teknologi enterprise karena teknologi ini terbukti tangguh dan stabil dalam aplikasi

enterprise. Teknologi enterprise seringkali memanfaatkan interface web sehingga

teknologi PHP menjadi sangat penting.

3.2 Perancangan Sistem

Perancangan Sistem adalah upaya suatu organisasi atau lembaga untuk memulai

memiliki suatu sistem yang lebih baik lagi dari sistem yang sebelumnya. Perancangan

sistem dilakukan setelah mendapat gambaran dengan jelas apa yang harus dikerjakan.

Tujuan dari perancangan sistem adalah untuk memenuhi kebutuhan pemakai (user)

(66)

mengenai gambaran yang jelas tentang perancangan sistem yang akan dibuat serta

diimplementasikan.

3.2.1 Diagram Konteks

Agar suatu sistem terstruktur, dapat dibuat suatu proses modeling dimana hasil dari

proses modeling tersebut berupa diagram konteks.Dari website tersebut akhirnya

dirancang sebuah antar muka profil dan formulir pendaftaran untuk dapat dilihat dan

diisi oleh pihak pendaftar. Untuk lebih jelasnya dapat dilihat pada gambar 3.1

diagram konteks berikut ini :

0.0

Sistem Perancangan Wedding

Organizer

Pengunjung

Administrator

Registrasi Pilih Paket

Data Pemesnanan Data Pengunjung

Data Paket Informasi Paket

(67)

3.2.2 Data Flow Diagram Level 0 Wedding Organizer

Data Flow Diagram level 0 adalah merupakan penjabaran dari diagram

konteks.Untuk lebih jelasnya dapat dilihat pada gambar 3.2 data flow diagram level

0 berikut ini. :

(68)

Administrator

2.0 Input Data Paket

3.0 Input Jenis Paket 1.0

Username & Pasword

True / False Login

Administrator Page Data Paket Data Jenis Data Paket Data Jenis Pengunjung 5.0 Pemesanan tblpesan 4.0 Login Pengunjung

Emai & Password Member

True / False Login

Input Email & Password Halaman Pengunjung Data Paket Data Paket Data Pemesanan 6.0 Testimonial tbltestimonial 7.0 Slider 8.0 Galeri

Data Testimonial Pengunjung

Galeri Data Slider Data Galeri Data Slider Data Galeri Tabel admin

D2 Tabel paket

Tabel jenis paket

D6 Tabel member D4 Tabel Testimonia D8 Tabel Galeri D7 Tabel Slider

D5 Tabel Pesan

Gambar 3.2.2 Data Flow Diagram Level 0

(69)

Data Flow Diagram level 1 adalah merupakan dekomposisi dari diagram level

zero.Untuk lebih jelasnya dapat dilihat pada gambar 3.2.3 data flow diagram level 1

berikut ini:

2.1

Input Data Paket D2

2.2

Daftar Paket

Data Paket _{Data Paket}

Data Paket

Pengunjung

Data Paket Data Paket

Administrator

Tabel Paket

(70)

3.3 Entity Relationship Diagram(ERD)

Berikut ini adalah gambaran dari Entity Relationship Diagram (ERD) dari

perancangan Wedding Organizer Berbasis Web.Dimulai dari entitas Paket,entitas

paket memiliki tiga atribut yaitu kode paket,paket dan jenis.Paket menyajikan tabel

member

didalam

tabel

member

memiliki

enam

atribut

yaitu

id_member,email,nama,jenis kelamin,alamat dan password.Member memesan ke

tabel pemesanan,didalam tabel pemesanan memiliki sembilan atribut yaitu

kodepesan,id_pesan,tgl,id_member,kodeproduk,hrg,diskon,kodeorder,konfirmasi.Tab

el admin memiliki dua atribut yaitu user dan pass,tabel admin mengkonfirmasi ke

tabel pesan.

(71)

Admin Kode paket pemesanan mengkonfirmasi Member Memesan paket jenis Idpesan tgl Paket menyajikan email nama jk alamat pass Idmember Idmember user pass hrg konfirmasi kodepesan diskon Kode order kodeproduk 1 n n n n 1

Gambar 3.2.4 Entity Relationship Diagram Wedding Organizer

(72)

Perancangan database adalah perancangan yang dilakukan untuk menentukan file

database seperti field dan tipe data. Dalam hal merancang sebuah sistem yang

berbasis database, perancangan database merupakan hal yang perlu mendapat

perhatian khusus. Karena database berperan penting untuk memanipulasi data user

dari aplikasi yang dibuat. Kesulitan utama dalam perancangan database adalah

mengelompokkan field-field secara terstruktur ke dalam beberapa tabel sesuai dengan

informasi yang terkandung di dalamnya. Berikut adalah rancangan tabel yang

digunakan dalam membangun database :

Tabel 3.3 Tabel Admin

No

Field Nama

Data Tipe

Size

Keterangan

1

2 Username

Pass

Varchar

50 Username

Password

Tabel 3.4 Tabel Galeri

No

Field Nama

Data Tipe

Size

Keterangan

1

2

3

4 Id

Gbr

Ket

Kodprdk

Int

Varchar

Text

varchar

11

255

30

50 Id

Gambar

Keterangan

Kode Produk

(73)

Tabel 3.5 Tabel Gambar

No

Field Nama

Data Tipe

Size

Keterangan

1

2 Id

Gbr

Int

varchar

11

255 Id

Gambar

Tabel 3.6 Tabel Member

No

Field Nama

Data Tipe

Size

Keterangan

1

2

3

4

5

6 Idmember

Email

Nama

Jk

Almt

Pwd

Int

Varchar

Int

10

255

20 Id member

Email

Nama

Jenis kelamin

Alamat

Password

Tabel 3.7 Tabel Paket

No

Field Nama

Data Tipe

Size

Keterangan

1

2

3 Kodepkt

Pkt

Jns

Varchar

varchar

50

255 Kode paket

Paket

Jenis

(74)

Tabel 3.8 Tabel Paket Jenis

No

Field Nama

Data Tipe

Size

Keterangan

1

2

3

4

5

6 Idpktjns

Kodpkt

Kodprdk

Prdk

Hrg

Ket

Int

Varchar

Double

Text

11

50

255 -

255 Id paket jenis

Kode paket

Kode produk

Produk

Harga

Keterangan

Tabel 3.9 Tabel Pengaturan

No

Field Nama

Data Tipe

Size

Keterangan

1

2 Krtria

Nil

Varchar

Text

100 -

Kriteria

Nilai

Tabel 3.10 Tabel Pesan

No

Field Nama

Data Tipe

Size

Keterangan

1

2

3

4 Idpsn

Tgl

Idmembr

Kodpesn

Int

Date

Int

11 -

11 Id pesan

Tanggal

Id member

Kode pesan

(75)

5

6

7

8

9 Kodprdk

Hrg

Dskn

Kodorder

Knfrmsi

Varchar

Double

Int

Bigint

Int

50

11

1

11

1 Kode produk

Harga

Diskon

Kode order

Konfirmasi

Tabel 3.11 Tabel Slider

No

Field Nama

Data Tipe

Size

Keterangan

1

2

3 Idslider

Gbr

Ket

Int

Varchar

11

255 Id slider

Gambar

Keterangan

Tabel 3.12 Tabel Testimonial

No

Field Nama

Data Tipe

Size

Keterangan

1

2

3

4 Idtesti

Idmember

Tgl

Pesn

Int

Date

Text

11 -

Id testimonial

Id member

Tanggal

Pesan

3.4 Flowchart

Flowchart

adalah

sekumpulan

simbol-simbol

yang

menunjukkan

atau

(76)

flowchart juga digunakan untuk menggambarkan urutan langkah-langkah pekerjaan

di suatu algoritma. Di dalam web ada beberapa flowchart, yaitu flowchart menu

utama, flowchart administrator, dan lain-lain. Berikut ini merupakan penjelasan

logika program Perancangan Wedding Organizer berbasis web berikut ini.

3.4.1 Flowchart Menu Utama

Flowchart menu utama menjelaskan bagan dari halaman menu utama website. Di

dalam tampilan halaman utama tersebut ada beberapa halaman yang telah disajikan

oleh admin agar dapat dilihat oleh user tanpa harus melakukan proses login terlebih

dahulu. Dimulai dari start masuk ke halaman pertama yaitu home.

Jika user memilih halaman home maka yang akan muncul adalah menu

dalam home yaitu paket,jenis paket,slider. Jika registrasi dibuka maka akan muncul

menu dalam halaman registrasi.Jika memilih Wedding Organizer maka akan keluar

produk dan kode beserta keterangan yang lainnya dan begitu juga jika memilih Event

organizer.Jika memilih Testimonial makan akan muncul testimoni dari beberapa

pelanggan.Jika memilih Data Order maka akan mucul jumlah harga dan apa saja yang

telah kita order lalu dilanjutkan ke menu pembayaran.Jika memilih Galeri makan

akan ditampilkan foto atau album tentang yang menyangkut dengan wedding dan

event organizer.Jika memilih halaman kontak kami maka akan muncul halaman

kontak kami. Jika tidak maka akan keluar dari aplikasi tersebut dan selesai. Untuk

lebih jelasnya dapat dilihat pada gambar 3.4.1 flowchart menu utama berikut ini.

(77)

Mulai

Paket

Jenis Paket

Pemesanan

Slider

Testimonial Galeri Member Pengaturan

Form Paket

Form jenis Paket

Form Pemesaan

Form Slider Form Geleri Form Member

Form Testimonial Form Pengaturan N N N N N

N N Logout

Selesai N Y Y Y Y Y

Y Y Y

Y A1

Gambar 3.4.1 Flowchart Menu Utama

3.4.2 Flowchart Menu Administrator

Flowchart ini menjelaskan bagan dari halaman web administrator. Untuk masuk ke

halaman ini admin maka akan muncul tampilan halaman admin. Selanjutnya home

page halaman admin, maka akan muncul input link. Jika input link admin benar maka

admin dapat menginput tambah admin.jika salah maka akan mucul pesan error dan

selanjutnya jika benar maka akan dilanjutkan dan login selesai. Untuk lebih jelasnya

dapat dilihat pada gambar 3.4.2 flowchart menu administrator.

(78)

Mulai

Masukkan Username

dan Password

Msg Login Error

Selesai Y

Gambar 3.4.2 Flowchart Menu Administrator

3.4.3 Flowchart Tambah Paket

Flowchart ini menjelaskan bagan dari halaman web tambah paket. Dimulai dari

tambah jenis paket,kode paket,simpan data,rercord duplikat,pesan data duplikat.untuk

menghapus paket dimulai dari tampilan halaman utama,hapus,selanjutnya hapus

record,selanjutnya ke database tabel jenis paket.untuk mengedit muncul halaman

utama edit selanjutnya tampil record,update record lalu kembali ke halaman

utama.Untuk lebih jelasnya dapat dilihat pada gambar 3.4.3 flowchart menu Tambah

Paket.

(79)

Kode Paket Paket Jenis Paket Tambah Paket

Simpan Data Record Duplikat

tblpaket Y

Msg Data Duplikat

Hapus Edit

Hapus Record

Tampil Record Update Record N

N Y

Update Record Y N

Gambar 3.4.3 Flowchart Tambah Paket

3.4.4 Flowchart Pemesanan

Flowchart ini menjelaskan bagan dari halaman web pemesanan.Dimulai dari untuk

menyimpan data yaitu Pemesanan kode order simpan data,record duplikat,pesan

data duplikat. Untuk menghapus atau mengedit daftar pemesanan dimulai dari

pemesanan,hapur record,tabel pesan.update record.untuk mengedit dari pemesanan

tampil record,update record dan selanjutnya kembali ke halaman utama.Untuk lebih

jelasnya dapat dilihat pada gambar 3.4.4 flowchart menu Pemesanan.

(80)

Kode Order Pemesanan

Simpan Data Record Duplikat

tblpesan Y

Msg Data Duplikat

Hapus Edit

Hapus Record

Tampil Record Update Record N

N Y

Update Record Y N

Gambar 3.4.4 Flowchart Pemesanan

3.5 Rancangan Desain Interface Aplikasi

Merancang Interface (antar muka) aplikasi merupakan bagian yang menentukan

apakah aplikasi yang dibuat benar-benar user friendly atau tidak. Sebab itu, maka

penulis membuat desain interface aplikasi sesederhana mungkin. Berikut adalah

sketsa interface aplikasi yang dibuat : Alur program ini menggambarkan bagaimana

sistem pendaftaran online bekerja secara tahap demi tahap proses. Antarmuka dengan

user yang digunakan adalah halaman web berupa form-form pada web browser. Alur

Sistem Informasi ini dibuat agar tidak terjadinya „salah jalur‟ data yang akan diolah.

(81)

Aplikasi Wedding Organizer digambarkan pertahap berikut ini :

1. Pertama, user akan dihadapkan pada sebuah halaman web utama pendaftaran

online .

2. Pada home terdapat wedding organizer,cara bayar,hubungi kami,

event organizer,testimoni,galeri,registrasi dan menu login admin.

3. Pada Registrasi terdapat form formulir pendaftaran

4. Pada Wedding organizer terdapat paket dan jenis paket

5. Pada Galeri terdapat foto

6. Pada kontak terdapat form untuk hubungi kami

Untuk lebih jelasnya dapat dilihat pada gambar 3.5.1 struktur program Perancangan

Aplikasi Wedding Organizer berbasis web berikut ini.

(82)

Gambar 3.5.1 Struktur Program Perancangan Wedding Organizer

1. Tampilan Menu Beranda

Pada form ini user membuka web sekolah maka tampilan utama sebagai berikut.

Untuk lebih jelasnya dapat dilihat pada gambar 3.5.2 tampilan menu beranda berikut

ini.

Wedding

organizer

Event

Organizer

Testimonia

Registrasi

Galeri

Login

Home

Contac

login

Admin

Home

Input paket

Input jenis

paket

pemesanan

Input slider

Input galeri

testimonial

Data

Member

Pengaturan

Input File

Input

Pendaftaran

Input Hubungi

Kami

(83)

Gambar 3.5.2 Tampilan Menu Beranda

2. Tampilan Wedding Organizer

Di dalam menu profil ada jenis paket dan harga paket. Untuk lebih jelasnya dapat

dilihat pada gambar 3.5.2 tampilan menu profil berikut ini.

(84)

Gambar 3.5.3 Tampilan Wedding Organizer

3. Tampilan Event Organizer

Di dalam Event Organizer ada paket event nya. Untuk lebih jelasnya dapat dilihat

pada gambar 3.5.3 Tampilan menu pendaftaran berikut ini.

(85)

Gambar 3.5.3 Event Organizer

4.Tampilan Testimonial

Didalam Menu Tetsimonial terdapat keterangan komentar dari user yang telah

melakukan order. Untuk lebih jelasnya dapat dilihat pada gambar 3.5.4 berikut ini.

(86)

Gambar 3.5.4 Tampilan Testimonial

4. Tampilan Registrasi

Pada menu Registrasi, berisi user yang ingin mendaftar melakukan registrasi dahulu

lalu login. Untuk lebih jelasnya dapat dilihat pada gambar 3.5.5 berikut ini.

(87)

Gambar 3.5.5 Tampilan Registrasi

5. Tampilan Menu Galeri

Pada menu Galeri berisi foto foto yang telah dimuat.hal ini melibatkan user lebih

nyaman memilih apa saja yang dibutuhkan. Untuk lebih jelasnya dapat dilihat pada

gambar 3.5.6 tampilan Galeri berikut ini.

(88)

Gambar 3.5.6 Tampilan Menu Galeri

6. Tampilan Menu Login

Pada menu login terdapat username dan password yang akan membantu user untuk

masuk ke web dan mulai mengorder. Untuk lebih jelasnya dapat dilihat pada gambar

3.5.7 tampilan Login berikut ini.

(89)

Gambar 3.5.7 Tampilan Menu Login

6.Tampilan Menu Cara Bayar

Pada Menu Cara Bayar ini terdapat cara cara untuk melakukan pembayarn.Setelah

selesai pembelian produk,maka konfirmasi pembayaran sesuai dengan jumlah

pembelian. . Untuk lebih jelasnya dapat dilihat pada gambar 3.5.8 tampilan Cara

Bayar berikut ini.

(1)

3. Bapak Prof. Tulus, M.Si selaku Ketua Departemen Fakultas Matematika dan Ibu Dra. Mardiningsih selaku Departemen Fakultas Matematika

4. Bapak Dr. Krista Sebayang, M.Si selaku Dekan Fakultas MIPA Universitas Sumatera Utara

5. Seluruh teman D-3 Teknik Informatika yang memberi dukungan dan bantuan kepada penulis dalam pengerjaan Tugas Akhir ini

6. Teristimewa kepada kedua orang tua penulis, Bapak Halmer Marpaung dan Ibu Yuliatin atas segala kasih sayang, doa, dukungan dan bantuan yang senantiasa diberikan.

Akhir kata, penulis berharap semoga Tugas Akhir ini bermanfaat bagi siapa pun yang membacanya. Semoga Tuhan Yang Maha Esa senantiasa memberikan rahmat kepada kita semua. Amin

Medan, Juni 2016 Penulis,

Eka Lusyanti Marpaung

(2)

ABSTRAK

Perancangan Aplikasi Wedding Organizer Berbasis Web bertujuan untuk membangun suatu aplikasi web dinamis secara online yang bermanfaat untuk menyediakan informasi mengenai Wedding Organizer. Pada Proses pembuatan aplikasi ini perangkat lunak yang digunakan adalah XAMPP yang merupakan gabungan dari Apache Web Server, PHP, dan MySQL, dan browser Google Chrome.

(3)

DAFTAR ISI

Halaman

Persetujuan ... i

Pernyataan ii Penghargaan ... iii

Abstrak v Daftar Isi... vi

Daftar Tabel ... viii

Daftar Gambar ... ix

Bab 1. Pendahuluan 1.1 Latar Belakang ... 1

1.2 Perumusan Masalah ... 3

1.3 Pembatasan Masalah ... 3

1.4 Tujuan Dan Manfaat ... 4

1.5 Tinjauan Pustaka ... 4

1.6 Metodologi Penelitian 13

1.7 Sistematika Penulisan... 14

Bab 2. Landasan Teori 2.1 Pengertian Komputer 16

2.1.1 Sistem Komputer 17

2.1.2 Konsep Dasar Perancangan 18

2.1.3 Konsep Aplikasi 18

2.1.4 Konsep Dasar Perancangan Aplikasi 18

2.2 Bagan Alir (Flowchart) 20

2.3 Pengertian Basis Data (Database) 21

2.4 Sejarah dan Perkembangan Internet 21

2.4.1 Jaringan Internet 23

2.4.2 Sekilas Mengenai Web 25

2.4.3 Web Browser 25

2.4.4 Web Server 26

2.5 PHP 26

2.6 MySQL 27

2.7 Java Script 28

... 2222222222423324

(4)

Bab 3. Analisa Perancangan Sistem

3.1 Analisa Sistem ... 29

3.2 Perancangan Sistem ... 29

3.2.1 Diagram Konteks ... 30

3.2.2 Data Flow Diagram Level 0 Wedding Organizer ... 31

3.3 Perancangan Database ... 32

3.4 Flowchart ... 35

3.4.1 Flowchart Menu Utama ... 37

3.4.2 Flowchart Menu Administrator ... 38

3.4.3 Flowchart Menu Tambah Paket ... 38

3.4.4 Flowchart Pemesanan 39 3.5 Rancangan Desain Interface Aplikasi ... 39

Bab 4. Implementasi Sistem 4.1 Definisi Implementasi Sistem ... 51

4.2 Tujuan Implementasi Sistem ... 51

4.3 Komponen Sistem ... 52

4.4 Tampilan Menu Utama ... 54

Bab 5. Kesimpulan dan Saran 5.1 Kesimpulan ... 62

5.2 Saran ... 62

(5)

DAFTAR TABEL

Nomor Judul Halaman Gambar

2.1 Tabel Simbol-Simbol flowchart 20

3.3 Tabel Admin 32 3.4 Tabel Galeri 32

3.5 Tabel Gambar 33

3.6 Tabel Member 33

3.7 Tabel Paket 33

3.8 Tabel Jenis Paket 34

3.9 Tabel Pengaturan 34

3.10 Tabel Pesan 34

3.11 Tabel Slider 35

3.12 Tabel Testimonial 35

(6)

DAFTAR GAMBAR

Nomor Judul Halaman Gambar 3.2.1 Diagram Konteks 30

3.2.2 Data Flow Diagram Level 0 31

3.2.3 Data Flow Diagram Level 1 32

3.3.1 Entity Relationship Diagram (ERD) 3.4.1 Flowchart Menu Utama 37

3.4.2 Flowchart Menu Administrator 38

3.4.3 Flowchart Tambah Paket 39

3.4.4 Flowchart Pemesanan 40

3.5.1 Struktur Program Perancangan Wedding Organizer 42 3.5.2 Tampilan Menu Beranda 43

3.5.3 Tampilan Wedding Organizer 44

3.5.4 Tampilan Event Organizer 45

3.5.5 Tampilan Testimonial 46

3.5.6 Tampilan Registrasi 47

3.5.7 Tampilan Galeri 48

3.5.8 Tampilan Menu Login 49

3.5.9 Tampilan Menu Cara Bayar 50

3.5.10 Tampilan Menu Hubungi Kami 51

5.4.1 Tampilan Menu Beranda Registrasi 54

5.4.2 Tampilan Menu Login 55

5.4.3 Tampilan Menu Testimonial 56

5.4.4 Tampilan Menu Wedding Organizer 57

5.4.5 Tampilan Menu Event Organizer 56

5.4.6 Tampilan Menu Galeri 57

5.4.7 Tampilan Menu Cara Bayar 60

5.4.8 Tampilan Menu Hubungi Kontak 61