Tampilan Desain Admin - Implementasi Interface

4.2 Implementasi Interface

4.2.2 Tampilan Desain Admin

Tampilan desain admin adalah tampilan dari aplikasi pemasangan iklan dengan hak akses penuh untuk memanagement aplikasi berbasis web ini, seperti Setting website, Edit pemasangan iklan baris, Edit pemasangan iklan gambar, Edit status iklan terbayar, Membalas Kontak Kami dan Mengedit User pemasang iklan. Untuk mengakses aplikasi tersebut Administrator wajib melakukan Login dengan Username dan Password yang sudah terdaftar sebelumnya. Berikut detail tampilan halaman untuk Admin.

1. Halaman Utama Admin

Halaman utama admin pada Gambar 4.35 terdapat kata sapaan, ketentuan iklan baris, ketentuan iklan gambar dan rekening pembayaran. Didalam halaman ini terlihat bagian menu yang tidak di tampilkan kepada user. Sehingga perbedaan level user terlihat antara User pemasang iklan dengan Admin yang mengelola website aplikasi ini.

1. Halaman Semua Iklan Baris

Pada Gambar 4.36 adalah tampilan semua iklan baris dimana semua iklan yang di pasang oleh user akan tampil. Pada bagian halaman semua iklan baris terdapat 3 menu untuk membedakan status iklan yang sudah terbayar, belum terbayar dan semua iklan. Pada halaman ini admin dapat melakukan edit pada iklan yang terpasang dan dapat menghapus iklan yang terpasang oleh user.

Gambar 4.36 Halaman Iklan Baris Admin

2. Halaman Set Kategori Iklan

Halaman Set kategori iklan berfungsi untuk menambah, mengedit, dan menghapus kategori iklan yang akan terorganisi untuk pemasangan iklan baris. Terlihat pada Gambar 4.37 bagian-bagian kategori iklan baris yang terpadat pada

form pemasangan iklan baris. Kategori iklan baris ini peneliti membuat kategori utama dan sub kategori, dimana untuk mempermudah tata letak iklan di media cetak surya. Pada penggolongan kategori utama terdapat beberapa kategori yaitu Properti, Otomotif, Jasa dan Lowongan kerja sedangkan untuk Sub kategori terdiri dari Rumah, Tanah, Mobil, Mototr, Elektronik, Handphone, Service dan lain-lain. Admin dapat mengeloloa kategori baik menambah, menghapus maupun mengedit kategori dengan menggunakan form kategori iklan seperti pada Gambar 4.38.

Gambar 4.38 Halaman Form Kategori Iklan Baris

Skr ip ka tegor ibar is.php

<?php

session_start();

if (empty($_SESSION['username']) AND empty($_SESSION['passuser'])){ echo "<link href='style.css' rel='stylesheet' type='text/css'> <center>Untuk mengakses modul, Anda harus login <br>";

echo "<a href=../../index.php><b>LOGIN</b></a></center>"; } else{

$aksi="system/sys_kategoribaris/aksi_kategoribaris.php"; switch($_GET[act]){

// Tampil Kategori

default: echo "<div class='main_container container_16 clearfix'>

<h2>Kategori Iklan Baris</h2>";

echo "<a href='?mod=kategoribaris&act=tambahkategoribaris'> <button class='skin_colour round_all'><img width='24' height='24' src='images/icons/small/white/Create Write.png'><span>Tambah

Kategori Iklan</span></button></a><br/><br/><br/>"; echo"<table class='display

table'><thead><tr><th>No</th><th>Kategori</th><th>Sub Kategori</th><th>Aksi</th></tr> </thead> <tbody>";

$tampil=mysql_query("SELECT * FROM kategori_baris ORDER BY id_baris"); $no=1; while ($r=mysql_fetch_array($tampil)){ echo "<tr><td align=center>$no</td> <td>$r[nama_kategori_baris]</td>"; if ($r[id_patren]==0){

echo "<td align=center>Ketegori Utama</td>"; } else{

echo "<td align=center>Sub Kategori </td>"; } echo "</td>

<td><a href=?mod=kategoribaris&act=editkategoribaris&id=$r[id_baris]>Edit</ a> | <a href=$aksi?mod=kategoribaris&act=hapus&id=$r[id_baris]>Hapus</a> </td></tr>"; $no++; } echo "</tbody></table><br><br></div></div>"; break;

// Form Tambah Kategori case "tambahkategoribaris":

{ echo "<div class='main_container container_16 clearfix'> <div class='flat_area grid_16'>

<h2>Tambah Ukuran Gambar</h2><div class='box grid_16 round_all'><br>";

echo "<h2>Tambah kategori Iklan Baris</h2><form method=POST action='$aksi?mod=kategoribaris&act=input' style='padding-left:

15px;'> <b>Kategori Utama: </b><br/>

<select name='kategori_utama'><option value=0 selected>- Pilih Menu Utama -</option>";

$tampil=mysql_query("SELECT * FROM kategori_baris where id_patren='0'"); while($r=mysql_fetch_array($tampil)){

echo "<option

value=$r[id_baris]>$r[nama_kategori_baris]</option>";

} echo "</select><br/> <b>Kategori

Iklan:</b><br/>

<input type='text' name='nama_kategori_baris'

style='width: 250px;'><br/><br/> <button type='submit'

id='submitstyle' name='save' class='button_colour round_all'><img height='24' width='24' alt='Bended Arrow Right'

src='images/icons/small/white/Bended Arrow

Right.png'><span>Simpan</span></button><br/><br/><br/> </form></div></div></div>"; }

break;

// Form Edit Kategori case "editkategoribaris":

$edit=mysql_query("SELECT * FROM kategori_baris WHERE id_baris='$_GET[id]'");

$r=mysql_fetch_array($edit);

echo "<div class='main_container container_16 clearfix'> <div class='flat_area grid_16'>

<h2>Edit Kategori Ukuran Gambar</h2> <div class='box grid_16 round_all'><br>";

echo "<h2>Edit Kategori Ukuran Gambar</h2>

<input type=hidden name=id value='$r[id_baris]'> <b>Kategori

Utama: </b><br/>

<select name='kategori_utama'>";

$tampil=mysql_query("SELECT * FROM kategori_baris where id_patren=0 "); if ($r[id_patren]==0 ){

echo "<option value=0 selected>- Kategori Utama -</option>"; } while($w=mysql_fetch_array($tampil)){ if ($r[id_patren]==$w[id_baris] ){

echo "<option value=$w[id_baris]

selected>$w[nama_kategori_baris]</option>";

} else{ echo "<option

value=$w[id_baris]>$w[nama_kategori_baris]</option>"; } } echo "</select><br/>";

echo "<b>Kategori Iklan:</b><br/><input type='text'

name='nama_kategori_baris' value='$r[nama_kategori_baris]' style='width: 250px;'>

<br/><button type='submit' id='submitstyle' name='save' class='button_colour round_all'><img height='24' width='24'

alt='Bended Arrow Right' src='images/icons/small/white/Bended Arrow Right.png'><span>Simpan</span></button><br/><br/><br/>

</form></div></div></div>"; break;

} } ?>

Pada Form kategori iklan Gambar 4.38 terdapat 2 form pengisian kategori yaitu kategori utama dan Kategori Iklan. Jika ingin menambah kategori utama pada iklan baris, pilihan kategori utama tetapkan pada Pilih Menu Utama, sedangkan untuk membuat sub kategori pilihan pada menu utama pilih kategori utama yang ingin memiliki sub kategori.

3. Halaman Kategori Type iklan

Kategori type iklan berfungsi untuk mengorganisir iklan berdasarkan type iklan yang ingin di jual, di cari, disewakan, dan Jasa. Pada kategori type iklan ini admin, dapat merubah, menambah dan menghapus type iklan pada pemasangan iklan baris seperti pada Gambar 4.39. Admin dapat menambah kategori type iklan pada form tambah kategori type iklan yang telah tersedia seperti Gambar 4.40.

Gambar 4.40 Halaman Form type iklan

Skr ip typeiklan.php

<?php

session_start();

if (empty($_SESSION['username']) AND empty($_SESSION['passuser'])){ echo "<link href='style.css' rel='stylesheet' type='text/css'> <center>Untuk mengakses modul, Anda harus login <br>";

echo "<a href=../../index.php><b>LOGIN</b></a></center>";

$aksi="system/sys_typeiklan/aksi_typeiklan.php"; switch($_GET[act]){

// Tampil Kategori Type Iklan default:

echo "<div class='main_container container_16 clearfix'> <div class='flat_area grid_16'><h2>Kategori Type Iklan</h2>";

echo "<a href='?mod=typeiklan&act=tambahtypeiklan'><button class='skin_colour round_all'><img width='24' height='24'

src='images/icons/small/white/Create Write.png'><span>Tambah Type Iklan</span></button></a><br/><br/><br/>";

echo"<table class='display table'>

<thead> <tr> <th>No</th> <th>Type Iklan</th><th>Aksi</th></tr> </thead> <tbody>";

$tampil=mysql_query("SELECT * FROM typeiklan ORDER BY id_typeiklan DESC"); $no=1; while ($r=mysql_fetch_array($tampil)){ echo "<tr><td>$no</td> <td>$r[bentuk_typeiklan]</td> <td><a href=?mod=typeiklan&act=edittypeiklan&id=$r[id_typeiklan]>Edit</a> |

<a href=$aksi?mod=typeiklan&act=hapus&id=$r[id_typeiklan]>Hapus</a> </td></tr>";

$no++; }

echo "</tbody></table><br><br></div></div>"; break;

// Form Tambah Kategori

case "tambahtypeiklan": {

echo "<div class='main_container container_16 clearfix'> <div class='flat_area grid_16'><h2>Tambah Type Iklan</h2>

<div class='box grid_16 round_all'><br>";

echo "<h2>Tambah Type Iklan</h2> <form method=POST

action='$aksi?mod=typeiklan&act=input' style='padding-left: 15px;'> <b>Type Iklan:</b><br/> <input type='text'

name='typeiklan' style='width: 250px;'> <br /><br /> <button type='submit' id='submitstyle' name='save' class='button_colour round_all'><img height='24' width='24' alt='Bended Arrow Right' src='images/icons/small/white/Bended Arrow

Right.png'><span>Simpan</span></button><br/><br/><br/>

</form></div></div></div>"; } break; // Form Edit Kategori

$edit=mysql_query("SELECT * FROM typeiklan WHERE id_typeiklan='$_GET[id]'");

$r=mysql_fetch_array($edit);

echo "<div class='main_container container_16 clearfix'> <div class='flat_area grid_16'><h2>Edit Type Iklan</h2> <div class='box grid_16 round_all'><br>"; echo "<h2>Edit Type Iklan</h2> <form method='POST'

action='$aksi?mod=typeiklan&act=update' style='padding-left: 15px;'> <input type=hidden name=id value='$r[id_typeiklan]'> <b>Type

Iklan:</b><br/> <input type='text' name='typeiklan'

value='$r[typeiklan]' style='width: 250px;'><br /><br />

<button type='submit' id='submitstyle' name='save'

class='button_colour round_all'><img height='24' width='24'

alt='Bended Arrow Right' src='images/icons/small/white/Bended Arrow Right.png'><span>Simpan</span></button><br/><br/><br/>

</form></div></div></div>";

break; } } ?>

4. Halaman Set Lama Tayang

Pada dasarnya pada pemasangan iklan di media cetak terdapat 3 jenis lama penayangan yaitu 1 hari, 3 hari dan 15 hari. Penayangan pada aplikasi ini dapat di tambah, edit ataupu dihapus oleh admin sehingga mempermudah penayangan iklan baris. Penyangan iklan baris ini sebagai dasar perhitungan harga untuk setiap user pemasang iklan, karena setiap lama penayangan admin dapat mengatur harga per-

baris pada iklan baris di media cetak Surya. Seperti Gambar 4.41, pada gambar tersebut terlihat lama penayangan dan harga iklan perbaris. Jika admin ingin menambahkan lama tayang dapat menggunakan form tambah lama tayang seperti Gambar 4.42. Pada form lama tayang, terdapat 2 inputan data yaitu input lama tayang dan input harga perbaris. Harga perbaris ini setiap penayngan berbeda berdasarkan ketentuan yang berlaku pada Media Cetak Surya. Sebagai contoh pada Gambar 4.41 peneliti inputkan 3 macam berdasarkan Suber dari Media Cetak Surya.

Gambar 4.41 Halaman Set Lama Tayang

Skr ip lamatayang.php

<?php

session_start();

if (empty($_SESSION['username']) AND empty($_SESSION['passuser'])){ echo "<link href='style.css' rel='stylesheet' type='text/css'> <center>Untuk mengakses modul, Anda harus login <br>";

echo "<a href=../../index.php><b>LOGIN</b></a></center>"; }else{

$aksi="system/sys_lamatayang/aksi_lamatayang.php"; switch($_GET[act]){

// Tampil Kategori Type Iklan default:

echo "<div class='main_container container_16 clearfix'> <div class='flat_area grid_16'><h2>Set Lama Tayang</h2>";

echo "<a href='?mod=lamatayang&act=tambahlamatayang'><button class='skin_colour round_all'><img width='24' height='24'

src='images/icons/small/white/Create Write.png'><span>Tambah Lama Tayang</span></button></a><br/><br/><br/>";

<thead> <tr> <th>No</th> <th>Lama Tayang</th><th>Harga Per- Baris</th><th>Aksi</th> </tr> </thead> <tbody>";

$tampil=mysql_query("SELECT * FROM lamatayang ORDER BY id_lamatayang DESC");

$no=1;

while ($r=mysql_fetch_array($tampil)){

echo "<tr><td>$no</td><td align=center>$r[harilamatayang] Hari</td> <td align=center>Rp. $r[harga_perbaris]</td> <td><a href=?mod=lamatayang&act=editlamatayang&id=$r[id_lamatayang]>Edit</a > | <a href=$aksi?mod=lamatayang&act=hapus&id=$r[id_lamatayang]>Hapus</a> </td></tr>"; $no++; } echo "</tbody></table><br><br></div></div>"; break;

// Form Tambah Kategori Lama tayang case "tambahlamatayang": {

echo "<div class='main_container container_16 clearfix'><div class='flat_area grid_16'><h2>Tambah Lama Tayang</h2><div class='box grid_16 round_all'><br>";

echo "<h2>Tambah Lama Tayang</h2><form method=POST

<b>Lama Tayang:</b><br/><input type='text' name='lamatayang' style='width: 250px;'> Hari<br /> <b>Harga Perbaris:</b><br/> <input type='text' name='harga_perbaris' style='width: 250px;'> <br /><br /><button type='submit' id='submitstyle' name='save'

class='button_colour round_all'><img height='24' width='24'

alt='Bended Arrow Right' src='images/icons/small/white/Bended Arrow Right.png'><span>Simpan</span></button><br/><br/><br/></form></div>< /div></div>"; } break;

// Form Edit Kategori case "editlamatayang":

$edit=mysql_query("SELECT * FROM lamatayang WHERE id_lamatayang='$_GET[id]'");

$r=mysql_fetch_array($edit);

echo "<div class='main_container container_16 clearfix'> <div class='flat_area grid_16'><h2>Edit Lama Tayang</h2><div class='box grid_16 round_all'><br>";

echo "<h2>Edit Lama Tayang</h2> <form method='POST'

action='$aksi?mod=lamatayang&act=update' style='padding-left: 15px;'> <input type=hidden name=id value='$r[id_lamatayang]'> <b>Lama Tayang:</b><br/> <input type='text' name='harilamatayang'

value='$r[harilamatayang]' style='width: 250px;'> Hari<br />

<button type='submit' id='submitstyle' name='save' class='button_colour round_all'><img height='24' width='24'

alt='Bended Arrow Right' src='images/icons/small/white/Bended Arrow Right.png'><span>Simpan</span></button><br/><br/><br/>

</form></div></div></div>";

break; } }

5. Halaman Laporan Transaksi iklan baris

Halaman Laporan transaksi iklan baris adalah sebuah halaman yang menampilkan iklan baris berdasarkan iklan yang sudah terbayar dan tanggal trasaksi yang telah di tentukan dalam bentuk PDF. Pada Gambar 4.43, terdapat pembuatan proses laporan berdasarkan order sekarang maupun order berdasarkan tanggal yang di tentukan. Bentuk laporan seperti Gambar 4.44 adalah bentuk PDF dimana jika proses telah dilakukan berdasar keinginan admin meurut tanggal yang ditentukan. Pada Gambar 4.44 terdapat beberapa tabel yang berisi tentang Faktur yang di ambil berdasarkan Id Iklan, Tanggal yang di ambil berdasarkan tanggal pasang, baris, lama tayang, Harga perbaris, dan total biaya berdasar faktur. Pada file PDF pada Gambar 4.44 Juga terdapat total biaya keselurhan dan juga jumlah iklan terpasang pada aplikasi pemasangan iklan baris.

Gambar 4.43 Halaman Laporan transaksi iklan baris

Skr ip Laporan.php (skr ip opsi tanggal laporan)

<?php

session_start();

if (empty($_SESSION['username']) AND empty($_SESSION['passuser'])){ echo "<link href='style.css' rel='stylesheet' type='text/css'> <center>Untuk mengakses modul, Anda harus login <br>";

echo "<a href=../../index.php><b>LOGIN</b></a></center>";

} else{

echo "<div class='main_container container_16 clearfix'><div class='flat_area grid_16'><h2>Laporan iklan baris</h2><div class='box grid_16 round_all'><br />

<span>Laporan Sekarang</span></button></a><br/><br/><br/> <form method=POST action='system/sys_laporanbaris/pdf_baris.php'> <table> <tr><td colspan=2><b>Laporan Per Periode</b></td></tr> <tr><td>Dari Tanggal</td><td> : "; combotgl(1,31,'tgl_mulai',$tgl_skrg); combonamabln(1,12,'bln_mulai',$bln_sekarang); combothn(2000,$thn_sekarang,'thn_mulai',$thn_sekarang); echo "</td></tr> <tr><td>s/d Tanggal</td><td> : "; combotgl(1,31,'tgl_selesai',$tgl_skrg); combonamabln(1,12,'bln_selesai',$bln_sekarang); combothn(2000,$thn_sekarang,'thn_selesai',$thn_sekarang); echo "</td></tr> <tr><td colspan=2> <button type='submit'><span> Proses </span></button> </table>

</form></div></div></div>"; }

Gambar 4.44 PDF Laporan Transaksi Iklan Baris

Skr ip pdf_sekarang.php

<?php

error_reporting(0); session_start();

if (empty($_SESSION['username']) AND empty($_SESSION['passuser'])){ echo "<link href='style.css' rel='stylesheet' type='text/css'> <center>Untuk mengakses modul, Anda harus login <br>";

Dalam dokumen APLIKASI PEMASANGAN IKLAN DI MEDIA CETAK BERBASIS WEB DENGAN MENGGUNAKAN PHP DAN MYSQL. (Halaman 123-160)