penggunaan sistem donasi online yang terdapat pada yayasan ... · donatur dapat melihat riwayat...

29

HANDBOOK PENGGUNA

Penggunaan Sistem Donasi Online yang terdapat pada Yayasan Budaya Mandiri

dalam melakukan serangkaian aktivitas pada yang dapat dilakukan oleh pengguna

dengan melakukan pendaftaran Donatur melalui Tampilan Form Register Donatur

Selanjutnya Donatur melakukan Login Donatur

Setelah melakukan Login maka Donatur

1. Donatur dapat melakukan ubah profil setelah melakukan login

2. Donatur dapat melakukan donasi setelah melakukan login

3. Donatur dapat melakukan konfirmasi donasi setelah melakukan login

4. Donatur dapat melihat riwayat donasi setelah melakukan login

5. Donatur dapat mengunduh laporan dana setelah login

6. Donatur dapat melihat halaman utama

7. Donatur dapat melihat cara donasi

8. Donatur dapat melihat daftar campaign donasi yang ada

9. Donatur dapat melihat foto galeri dan data kontak yayasan

10. Donatur dapat melakukan logout

Form Edit Profil Donatur

Tampilan Halaman Cara Donasi

Tampilan Halaman Daftar Campaign

Tampilan Halaman Detail Campaign

Tampilan Form Donasi

Tampilan Halaman Resume Donasi

Tampilan Halaman Riwayat Donasi

Tampilan Form Konfirmasi Donasi

Tampilan Halaman Galeri

Tampilan Halaman Tentang Kami

Halaman Interface Admin Pengelola Sistem

1. Admin dapat melakukan login setelah sebelumnya terdaftar.

2. Admin dapat mengelola data donatur.

3. Admin dapat mengelola data donasi.

4. Admin dapat mengelola data galeri Yayasan Budaya Mandiri.

5. Admin dapat mengelola data campaign.

6. Admin dapat mengelola dana keluar.

7. Admin dapat mencetak laporan donasi, donatur, campaign, dan dana keluar.

8. Admin dapat merubah profil.

9. Admin dapat melakukan logout.

Tampilan Halaman Login Admin

Tampilan Halaman Ubah Profil

Tampilan Halaman Data Donatur

Tampilan Laporan Data Donatur

Tampilan Halaman Data Donasi

Tampilan Halaman Edit Donasi

Tampilan Halaman Laporan Donasi

Tampilan Halaman Data Galeri

Tampilan Halaman Tambah Galeri

Tampilan Halaman Edit Galeri

Tampilan Halaman Laporan Galeri

Tampilan Halaman Data Campaign

Tampilan Halaman Tambah Data Campaign

Tampilan Halaman Edit Data Campaign

Tampilan Halaman Laporan Data Campaign

Tampilan Halaman Dana Keluar

Tampilan Halaman Tambah Dana Keluar

Tampilan Halaman Edit Dana Keluar

Tampilan Halaman Laporan Dana Keluar

SOURCE CODE PROGRAM

Halaman Donatur

1. Form Donasi

<?php

include "kon/koneksi.php";

require("rupiah.php");

session_start();

?>

<!DOCTYPE html>

<html lang="en">

<head>

<title>Yayasan Budaya Mandiri</title>

<meta name="viewport" content="width=device-width, initial-scale=1">

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<script type="application/x-javascript"> addEventListener("load", function()

{ setTimeout(hideURLbar, 0); }, false); function hideURLbar(){

window.scrollTo(0,1); } </script>



<link href="css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />

<link href="css/popup-box.css" rel="stylesheet" type="text/css" media="all"

/>

<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />





<link

href='//fonts.googleapis.com/css?family=Josefin+Sans:400,100,100italic,

00,300italic,400italic,600,600italic,700,700italic' rel='stylesheet'

type='text/css'>

<link

href='//fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400ita

lic,600,600italic,700,700italic,800,800italic' rel='stylesheet' type='text/css'>



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

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

</head>

<body>

<div class="sub-banner">



<nav class="navbar navbar-default">

<div class="container">

<div class="navbar-header">

<a href="index.php"><img src="images/logo.png" alt=" " /> </a>

</div>

<div id="navbar" class="navbar-collapse collapse">

<ul class="nav navbar-nav navbar-right">

<li class="hover-effect"><a href="index.php">Home</a></li>

<li class="hover-effect"><a href="donasi.php">Donasi</a></li>

<li class="hover-effect"><a href="galeri.php">Galeri</a></li>

<li class="hover-effect"><a href="contact.php">Tentang Kami</a></li>

<?php

if(@$_SESSION['idlogin']==""){

?>

<li class="hover-effect"><a href="login.php">Login</a></li>

<li class="hover-effect"><a href="registerdonatur.php">Register</a></li>

<?php } else {

$idlogin=@$_SESSION['idlogin'];

$sql = mysql_query("select*from donatur where id_donatur = '$idlogin' ") or

die (mysql_error());

$data = mysql_fetch_array($sql);

$username=$data['username'];

$id_campaign=$_GET['id'];

$o = mysql_query("select*from campaign where id_campaign =

'$id_campaign' ") or die (mysql_error());

$da= mysql_fetch_array($o);

$nama = $da['nama_campaign'];

?>

<li class="hover-effect"><a href="editdonatur.php"><?php echo

"$username"; ?></a></li>

<li class="hover-effect"><a href="logout.php">Logout</a></li>

<?php } ?>

</ul>

</div>

</div>

</nav>

</div>



<div class="gallery-wlayouts" id="gallery">

<div class="main-agileits">

<div class="form-wagile">

<form action="simpandonasi.php" method="post">

<div class="key">

<p><i class="fa fa-envelope" aria-hidden="true"></i></p>

<h2>Form Donasi</h2>

<td> Anda akan melakukan donasi untuk campaign <br> <b><?php echo

$nama ; ?></b></td>

<br> <br>

<td align="left"><b>Jumlah Donasi</b></td>

<td>:</td>

<input type="hidden" name="id_campaign" value="<?php echo

$id_campaign;?>" />

<input type="text" name="nominal" align="middle" cols="45" placeholder="

Masukkan jumlah donasi"/>

<div class="clearfix"></div>

</div>

<div class="key">

<i class="fa fa-lock" aria-hidden="true"></i>

<td align="left"><b>Keterangan</b></td>

<td>:</td>

<input type="textarea" name="ket" cols="45" placeholder="Masukkan pesan

untuk campaign ini" />


</div>


<input type="submit" name="submit" value="DONASI">

</form>

</div>


</div>

</div>

<?php

include "footer.php";

?>

</body>

</html>

2. Form Konfirmasi Donasi

<?php

include "kon/koneksi.php";

session_start();

?>

<?php


echo "<script>alert('Maaf, Anda harus login terlebih dahulu

!');window.location.href=('login.php')</script>";

}

else {

?>

<!DOCTYPE html>

<html lang="en">

<head>


<meta name="viewport" content="width=device-width, initial-scale=1"


<link href="erudisi/metro.css" rel="stylesheet">

<script src="erudisi/jquery-2.1.3.min.js"></script>

<script src="erudisi/metro.js"></script>

$id_donasi=$_GET['id'];

$cari = mysql_query("select*from donasi where id_donasi = '$id_donasi'") or


$data1=mysql_fetch_array($cari);

$id_campaign=$data1['id_campaign'];

$nama=$data1['nama_campaign'];

?>

<li class="hover-effect"><a href="editdonatur.php"><?php echo

"$username"; ?></a></li>

<li class="hover-effect"><a href="logout.php">Logout</a></li>

<?php } ?>

</ul>

</div>

</div>

</nav>

</div>



<div class="gallery-wlayouts" id="gallery">

<div id="menu">

<a class="left" href="caradonasi.php">Cara Donasi</a>

<a class="center" href="donasi.php">Daftar Campaign</a>

<a class="center selected" href="konfirmasi.php">Konfirmasi Donasi</a>

<a class="right" href="riwayat.php">Riwayat Donasi</a>

</div>

<div class="main-agileits">

<div class="form-wagile">

<form action="simpankonfirmasi.php" method="post">

<div class="key">

<p><i class="fa fa-envelope" aria-hidden="true"></i></p>

<h2>Konfirmasi Donasi</h2>

<td align="left"><b>Tanggal Transfer</b></td>

<td>:</td>

<br>

<div class="input-control text" data-role="datepicker">

<input type="text" name="tgl_transaksi" id="tgl_transaksi" ></div>

<input type="hidden" name="id_donasi" value="<?php echo $id_donasi;?>"

/>

<input type="hidden" name="id_campaign" value="<?php echo

$id_campaign;?>" />

<input type="hidden" name="nama_campaign" value="<?php echo

$nama;?>" />


</div>

<div class="key">

<i class="fa fa-lock" aria-hidden="true"></i>

<td align="left"><b>Metode Pembayaran</b></td>

<td>:</td>

<p >

<select name="metode" id="metode" >

<option value=0 selected>-Metode Pembayaran-</option>

<option>Transfer Mandiri </option>

<option>Transfer BCA</option>

<option>Transfer BRI</option>

<option>Transfer BNI</option>

<option>Transfer Bank Lainnya</option>

<option>Kartu Kredit</option>

</select>

</td>

</p>


</div>

<p>

<p>

<td align="center"><input align="middle" type="image"

src="images/konfirmasi.png" alt="submit" /></td></p>

<br>

<p> </p>

<p> </p>

<br>

</form>

</td>

</div>


</div>

</div>

<?php

include "footer.php";

?>

</body>

</html>

<?php } ?>

Code Generation Halaman Admin

1. Form Edit Donasi

Form ini digunakan oleh admin untuk merubah status donasi setelah donatur

melakukan konfirmasi donasi.

<?php

include "../kon/koneksi.php";

session_start();

?>

<!DOCTYPE html PUBLIC>

<html >

<head>

<title>Edit Donasi</title>

<link href="css/style.css" rel="stylesheet" type="text/css" />

</head>



<!DOCTYPE html>

<html>

<head>


<link href="css/style.css" rel="stylesheet" type="text/css" />

</head>

<body>

<div id="container">

<div id="header">

<div id="logo">

<img src="../images/logo.png">

</div>

<div id="info">

<?php

$id = @$_SESSION['idlogin'];

$cari = mysql_query("select*from admin where id_admin = '$id'")or die

(mysql_error());

$data = mysql_fetch_array ($cari);

$nama = $data ['username'];

?>

Selamat Datang <?php echo "$nama";?><br>

<a href="profil.php">Akun Setting</a> • <a

href="logout.php">Keluar</a>

</div>

<div class="clear"></div>

</div>

<br> </br>

<div id="shortcut">

<a href="datadonatur.php"><img

src="images/donatur.png"><br>Donatur</a>

<a href="datadonasi.php"><img src="images/donasi.png"><br>Donasi</a>

<a href="datagaleri.php"><img src="images/short4.png"><br>Galeri</a>

<a href="datacampaign.php"><img

src="images/kegiatan.png"><br>Campaign</a>

</div>

<br> </br>

</div>



<?php

require("../kon/koneksi.php");

$a = $_GET['id'];

$cek="Select * from donasi where id_donasi = '".$a."'";

$hasil = mysql_query($cek);

$result = mysql_num_rows($hasil);

$data=mysql_fetch_array($hasil);

$b=$data['id_donatur'];

$c=$data['id_campaign'];

$d=$data['nama_campaign'];

$e=$data['tgl_transaksi'];

$f=$data['nominal'];

$g=$data['ket'];

$h=$data['no_telp'];

$i=$data['status'];

$cek1="Select * from donatur where id_donatur = '".$b."'";

$hasil1 = mysql_query($cek1);

$result1 = mysql_num_rows($hasil1);

$data1=mysql_fetch_array($hasil1);

$nm=$data1['nama_donatur'];

?>

<form id="form1" name="form1" method="post"

action="updatedonasi.php?id=<?=$a;?>">

<div id ="tulisan">

<table width="962" height="339" align="center" >

<tr valign="baseline">

<td height="89" colspan="6" align="center" valign="middle"

nowrap="nowrap"><h1>DONASI</h1><hr color="#072AFB" /></td>

</tr>


<td align="center" valign="middle" nowrap="nowrap"> </td>

<td height="29" colspan="4" align="right" valign="middle"

nowrap="nowrap">

<strong>ID Donasi : <input type="text" name="no_trans" value="<?php

echo " $a";?>" size="2" readonly > </strong><br />

<strong><?php echo $e;?></strong><br />

</td>

<td height="29" align="right" valign="middle"

nowrap="nowrap"> </td>

</tr>


<td width="26" align="center" valign="middle"


<td width="380" height="29" align="center" valign="middle"


<td width="203" align="center" valign="middle"








</tr>


<td align="left" valign="middle" nowrap="nowrap"> </td>

<td height="89" align="left" valign="middle" nowrap="nowrap">

<table width="350" cellspacing="0" cellpadding="0">

<tr>

<td width="350" height="90" valign="top"><table width="355" border="0"

cellspacing="2" cellpadding="2">

<tr>

<td width="109" align="left"><b>ID Donatur</b></td>

<td width="18" align="center"><strong>:</strong></td>

<td width="208"><?php echo $b;?></td>

</tr>

<tr>

<td align="left"><b>Nama Donatur </b></td>

<td align="center"><strong>:</strong></td>

<td><?php echo $nm;?>

</td>

</tr>

</table>

</table>

<td height="89" align="left" valign="middle"








</tr>


<td align="left" valign="middle" nowrap="nowrap"> </td>

<td height="89" colspan="4" align="center" valign="middle"

nowrap="nowrap">

<table width="726" border="1" cellspacing="0" cellpadding="0">

<tr>

<td width="117" align="center" bgcolor="#072AFB"><strong>ID

Campaign</strong></td>

<td width="145" align="center" bgcolor="#072AFB"><strong>Nama

Campaign</strong></td>

<td width="70"align="center"

bgcolor="#072AFB"><strong>Tanggal</strong></td>

<td width="68" align="center"

bgcolor="#072AFB"><strong>Jumlah</strong></td>

<td width="99"align="center"

bgcolor="#072AFB"><strong>Keterangan</strong></td>

<td width="107" align="center" bgcolor="#072AFB"><strong>No.

Telp</strong></td>

</tr>

<tr>

<td align="center"><?php echo $c;?></td>

<td align="center"><?php echo $d;?></td>

<td align="right"><?php echo $e;?></td>

<td align="right"><?php echo "Rp " .number_format($f, 0, ',', '.').",-" ?></td>

<td align="center"><?php echo $g;?></td>

<td align="center"><?php echo $h;?></td>

</tr>

</table>

</td>



</tr>

<tr>

<td align="center"><strong>Status</strong></td>

<td align="left">

<?php if ($i=="Cancel")

{?>

<select name="status" id="status" disabled="disabled" >

<option value><?php echo $i;?></option>

<option>Cancel</option>

<option>Pending</option>

<option>Confirmed</option>

</select>

<?php } else { ?>

<select name="status" id="status" >

<option value><?php echo $i;?></option>

<option>Cancel</option>

<option>Pending</option>

<option>Confirmed</option>

</select>

<?php } ?>

</td>

<td align="center"> </td>

</tr>

<tr>

<td colspan="6" align="center">

<?php if ($i=="Cancel")

{?>

<a href ="datadonasi.php"> <img src="images/close.png" /></a>

<?php } else { ?>

<input type="image" src="images/update.png" alt="submit" />

<a href ="datadonasi.php"> <img src="images/cancel.png" /></a>

<?php } ?>

</td>

</tr>

</table>

</div>

</form>

<div id="footer">2018 Yayasan Budaya Mandiri. All rights reserved | Design

by <a href="http://instagram.com/astipitriani">Asti Pitriani</a>

</div>

<div align="center"></div>

</div>

</body>

</html>

penggunaan sistem donasi online yang terdapat pada yayasan ... · donatur dapat melihat riwayat...

Documents