Implementasi Program

BAB IV IMPLEMENTASI SISTEM

4.1. Implementasi Program

Bab ini akan menjelaskan tentang pembuatan program sistem pelayanan surat, dengan memberikan contoh tampilan menu, Implementasi merupakan tahap dimana sistem siap dioperasikan pada tahap sebenarnya, sehingga akan diketahui apakah sistem yang akan dibuat benar-benar dapat menghasilakan tujuan yang diinginkan. Dalam pembuatan program ini menggunakan yaitu :

1. Menginstal aplikasi Xampp, MySQL, Dreamweaver / Sublime Text 2. Membuat database di MySQL

Berdasarkan tahapan diatas maka dapat dilihat dibawah ini adalah tampilan database sistem yaitu:

Gambar 4. 1 Database Sistem

Berdasarkan tahapan diatas maka dapat dilihat dibawah ini adalah tampilan sistem yaitu:

4.1.1. Menu Login

Menu login adalah menu yang digunakan untuk masuk kedalam sistem dengan memasukan username dan password, adapun gambar sistem dapat dilihat pada gambar dibawah ini :

Gambar 4. 2 Menu Login

Gambar 4. 3 Coding Login form action="" method="post"><div class="input-group mb-3">

<input type="text" class="form- control" name="username" placeholder="Username" required>

<div class="input-group-append">

<div class="input-group-text">

<span class="fas fa- user"></span>

</div></div></div><div class="input-group mb-3"><input type="password" class="form-control"

name="password" placeholder="Password" required>

<div class="input-group-append">

<div class="input-group-text">

<span class="fas fa- lock"></span>

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

<div class="row"><div class="col-12">

4.1.2. Daftar Akun

Menu daftar akun adalah menu yang digunakan untuk mendaftarkan akun masyarakat yang ingin melakukan login sistem, adapun gambar sistem dapat dilihat pada gambar dibawah ini :

Gambar 4. 4 Menu Daftar Akun

Gambar 4. 5 Menu Coding Daftar Akun

<table id="example1" class="table table-bordered table-striped"><thead>

<tr><th>No</th><th>NIK</th>th>Nama</th><th>JK</th><th>Alamat</th>

<th>No KK</th><th>Aksi</th></tr></thead><tbody>

<?ph$no = 1; ($_GET['tipe']=='l'){

$sql = $koneksi->query("SELECT p.id_pend, p.nik, p.nama, p.jekel, p.desa, p.rt, p.rw, a.id_kk, k.no_kk, k.kepala from tb_pdd p left join tb_anggota a on p.id_pend=a.id_pend left join tb_kk k on a.id_kk=k.id_kk where status='Ada' and p.jekel='LK'");}

else if($_GET['tipe']=='p'){$sql = $koneksi->query("SELECT p.id_pend, p.nik, p.nama, p.jekel, p.desa, p.rt, p.rw, a.id_kk, k.no_kk, k.kepala from tb_pdd p left join tb_anggota a on p.id_pend=a.id_pend left join tb_kk k on a.id_kk=k.id_kk where status='Ada' and p.jekel='PR'");}else{

$sql = $koneksi->query("SELECT p.id_pend, p.nik, p.nama, p.jekel, p.desa, p.rt, p.rw, a.id_kk, k.no_kk, k.kepala from tb_pdd p left join tb_anggota a on p.id_pend=a.id_pend left join tb_kk k on a.id_kk=k.id_kk where status='Ada'"); while ($data= $sql->fetch_assoc()) {?>

<tr><td><?php echo $no++; ?></td><td><?php echo $data['nik'];

?></td><td>

<?php echo $data['nama']; ?></td>

<td><?php echo $data['jekel']; ?></td><td>

<?php echo $data['desa']; ?>RT

<?php echo $data['rt']; ?>/ RW

<?php echo $data['rw']; ?>.</td><td><?php echo $data['no_kk']; ?>-

<?php echo $data['kepala']; ?></td>

<td>

4.1.3. Hak Akses Masyarakat A. Menu Utama

Menu utama adalah menu yang diakses oleh masing-masing pengguna sistem untuk mengelola data, adapun gambar dapat dilihat pada gambar dibawah ini :

Gambar 4. 6 Menu Utama

Gambar 4. 7 Coding Menu Utama

<?php

$sql = $koneksi->query("SELECT COUNT(id_pend) as pend from tb_pdd where status='Ada'");

while ($data= $sql->fetch_assoc()) { $pend=$data['pend'];

}

$sql = $koneksi->query("SELECT COUNT(id_kk) as kartu from tb_kk");

while ($data= $sql->fetch_assoc()) { $kartu=$data['kartu'];

}

$sql = $koneksi->query("SELECT COUNT(id_pend) as laki from tb_pdd where jekel='LK'");

while ($data= $sql->fetch_assoc()) { $laki=$data['laki'];

}

$sql = $koneksi->query("SELECT COUNT(id_pend) as prem from tb_pdd where jekel='PR'");

while ($data= $sql->fetch_assoc()) { $prem=$data['prem'];

}

$sql = $koneksi->query("SELECT COUNT(id_lahir) as lahir from tb_lahir");

while ($data= $sql->fetch_assoc()) { $lahir=$data['lahir'];

}

B. Menu Profile Desa

Menu profile desa adalah menu untuk menampilkan informasi profile desa, dapat dilihat pada gambar dibawah ini :

Gambar 4. 8 Menu Profile Desa

Gambar 4. 9 Coding Profile Desa

<a href="?page=view-pend&kode=<?php echo $data['id_pend']; ?>"

title="Detail"

class="btn btn-info btn- sm">

<i class="fa fa- user"></i></a>

<a href="?page=edit- pend&kode=<?php echo $data['id_pend']; ?>" title="Ubah"

class="btn btn-success btn-sm">

<i class="fa fa- edit"></i>

</a>

<a href="?page=del- pend&kode=<?php echo $data['id_pend']; ?>" onclick="return confirm('Apakah anda yakin hapus data ini ?')"

title="Hapus"

class="btn btn-danger btn-sm">

<i class="fa fa- trash"></i>

</>

</td>

</tr>

C. Menu Syarat Pengajuan

Menu syarat pengajuan adalah menu untuk menampilkan informasi syarat pengajuan, dapat dilihat pada gambar dibawah ini :

Gambar 4. 10 Menu Syarat Pengajuan

Gambar 4. 11 Coding Menu Syarat Pengajuan

<a href="?page=view-pend&kode=<?php echo $data['id_pend']; ?>"

title="Detail"

class="btn btn-info btn- sm">

<i class="fa fa- user"></i></a>

<a href="?page=edit- pend&kode=<?php echo $data['id_pend']; ?>" title="Ubah"

class="btn btn-success btn-sm">

<i class="fa fa- edit"></i>

</a>

<a href="?page=del- pend&kode=<?php echo $data['id_pend']; ?>" onclick="return confirm('Apakah anda yakin hapus data ini ?')"

title="Hapus"

class="btn btn-danger btn-sm">

<i class="fa fa- trash"></i>

</>

</td>

</tr>

D. Menu Hubungi Kami

Menu hubungi kami adalah menu untuk menampilkan informasi hubungi kami, dapat dilihat pada gambar dibawah ini :

Gambar 4. 12 Menu Hubungi Kami

Gambar 4. 13 Coding Menu Hubungi Kami $sql = $koneksi->query("select * from tb_pengguna");

while ($data= $sql->fetch_assoc()) { ?><tr><td>

<?php echo $no++;

?></td>

<td>

<?php echo

$data['nama_pengguna']; ?>

</td>

<td>

<?php echo

$data['username']; ?>

</td>

<td>

<?php echo

$data['level']; ?>

</td>

<td>

<a href="?page=edit- pengguna&kode=<?php echo $data['id_pengguna']; ?>" title="Ubah"

class="btn btn-success btn-sm">

<i class="fa fa- edit"></i>

</a>

<a href="?page=del- pengguna&kode=<?php echo $data['id_pengguna']; ?>" onclick="return confirm('Apakah anda yakin hapus data ini ?')"

title="Hapus" class="btn btn-danger btn-sm">

<i class="fa fa-

E. Menu Pengajuan Surat

Menu pengajuan pengajuan adalah menu untuk melakukan pengajuan surat yang akan dibuat, dapat dilihat pada gambar dibawah ini :

Gambar 4. 14 Menu Pengajuan Surat

Gambar 4. 15 Cetak Surat

Gambar 4. 16 Coding Pengajuan Surat dan Cetak Surat 4.1.4. Hak Akses Staff

A. Menu Utama

Menu utama adalah menu yang diakses oleh masing-masing pengguna sistem untuk mengelola data, adapun gambar dapat dilihat pada gambar dibawah ini :

Gambar 4. 17 Menu Utama

<title>CETAK SURAT</title>

</head>

<body><center><?php

$sql_tampil = "select * from tb_pdd,tb_domisili

where tb_pdd.id_pend=tb_domisili.id_pdd and tb_domisili.id_pdd ='$id'";

$query_tampil = mysqli_query($koneksi, $sql_tampil);

$data =

mysqli_fetch_array($query_tampil);?></center>

<center><h4>

<u>SURAT KETARANGAN DOMISILI</u>

</h4><h4>No Surat :<?php echo $data['no_surat']

?></h4</center>

<p>Yang bertanda tangan di bawah ini Peratin Pekon Penyandingan Kecamatan Bangkunat Kabupaten Pesisir Barat dengan ini menerangkan dengan sesungguhnya bahwa :</P>

<table><tbody><tr><td>Nama</td><td>:</td><td>

<?php echo $data['nama']; ?>

</td></tr><tr><td>Tempat, Tanggal lahir</td>

<td>:</td><td>

<?php echo $data

Gambar 4. 18 Coding Menu Utama B. Menu Data Menu

Menu data menu adalah menu untuk mengakses pengelolaan data menu pada sistem atau menu utama, dapat dilihat pada gambar dibawah ini :

Gambar 4. 19Menu Data Menu

<?php

$sql = $koneksi->query("SELECT COUNT(id_pend) as pend from tb_pdd where status='Ada'");

while ($data= $sql->fetch_assoc()) { $pend=$data['pend'];

}

$sql = $koneksi->query("SELECT COUNT(id_kk) as kartu from tb_kk");

while ($data= $sql->fetch_assoc()) { $kartu=$data['kartu'];

}

$sql = $koneksi->query("SELECT COUNT(id_pend) as laki from tb_pdd where jekel='LK'");

while ($data= $sql->fetch_assoc()) { $laki=$data['laki'];

}

$sql = $koneksi->query("SELECT COUNT(id_pend) as prem from tb_pdd where jekel='PR'");

while ($data= $sql->fetch_assoc()) { $prem=$data['prem'];

}

$sql = $koneksi->query("SELECT COUNT(id_lahir) as lahir from tb_lahir");

while ($data= $sql->fetch_assoc()) { $lahir=$data['lahir'];

}

Gambar 4. 20 Coding Menu Data Menu

C. Menu Kabar Berita

Menu kabar berita adalah menu untuk mengakses pengelolaan data publikasi, dapat dilihat pada gambar dibawah ini :

Gambar 4. 21 Menu Kabar Berita }

$sql = $koneksi->query("SELECT COUNT(id_mendu) as mendu from tb_mendu");

while ($data= $sql->fetch_assoc()) { $mendu=$data['mendu'];

}

$sql = $koneksi->query("SELECT COUNT(id_datang) as datang from tb_datang");

while ($data= $sql->fetch_assoc()) { $datang=$data['datang'];

}

$sql = $koneksi->query("SELECT COUNT(id_pindah) as pindah from tb_pindah");

while ($data= $sql->fetch_assoc()) { $pindah=$data['pindah'];

}

?>

Gambar 4. 22 Coding Menu Kabar Berita D. Menu Kelola Data Penduduk

Menu kelola data penduduk adalah menu untuk mengakses pengelolaan data penduudk, dapat dilihat pada gambar dibawah ini :

Gambar 4. 23Menu Data Penduduk

<input type="hidden" name="id_pdd" value="<?php echo $id_pend ?>">

<div class="form-group row">

<label class="col-sm-2 col-form-label">Tgl Pindah</label>

<div class="col-sm-3">

<input type="date" class="form-control"

id="tgl_pindah" name="tgl_pindah" required>

</div>

</div>

<div class="form-group row">

<label class="col-sm-2 col-form- label">Alasan</label>

<div class="col-sm-6">

<input type="text" class="form-control"

id="alasan" name="alasan" placeholder="Alasan Pindah" required>

</div>

</div>

<div class="card-footer">

<input type="submit" name="simpan"

value="Kirim Pengajuan" class="btn btn-info">

Gambar 4. 24 Coding Menu Data Penduduk

Gambar 4. 25 Menu Data Kartu Keluarga <form action="" method="post" enctype="multipart/form-data">

<input type="hidden" name="id_pdd" value="<?php echo $id_pend ?>">

<div class="form-group row">

<label class="col-sm-2 col-form-label">Tgl Pindah</label>

<div class="col-sm-3">

<input type="date" class="form- control" id="tgl_pindah" name="tgl_pindah" required>

</div>

</div>

<div class="form-group row">

<label class="col-sm-2 col-form- label">Alasan</label>

<div class="col-sm-6">

<input type="text" class="form-

control" id="alasan" name="alasan" placeholder="Alasan Pindah" required>

</div>

</div>

<div class="card-footer">

<input type="submit" name="simpan"

value="Kirim Pengajuan" class="btn btn-info">

Gambar 4. 26 Coding Menu Data Kartu Keluarga

E. Menu Kelola Surat

Menu kelola surat adalah menu untuk mengakses pengelolaan data surat menyurat, dapat dilihat pada gambar dibawah ini :

Gambar 4. 27 Menu Kelola Surat

<table id="example1" class="table table-bordered table-striped">

<thead>

<tr>

<th>No</th>

<th>NO KK</th>

<th>Kepala Keluarga</th>

<th>Alamat</th>

<th>Anggota KK</th>

<th>Aksi</th>

</tr>

</thead><tbody><?php$no = 1;

$sql = $koneksi->query("select * from tb_kk");while ($data=

$sql->fetch_assoc()) { ?><tr><td>

<?php echo $no++; ?>

</td>

<td>

<?php echo

$data['no_kk']; ?>

</td>

<td>

<?php echo

$data['kepala']; ?>

</td>

<td>

<?php echo

$data['desa']; ?>

RT

<?php echo $data['rt'];

?>/ RW

<?php echo

$data['rw']; ?>.

</td><td>

<a

href="?page=anggota&kode=<?php ech$data['id_kk']; ?>" title="Anggota KK"

class="btn btn-info btn-sm">

<i class="fa fa-users"></i></a>

</td>

<td>

<a href="?page=edit- kartu&kode=<?php echo $data['id_kk']; ?>" title="Ubah" class="btn btn-

success btn-sm"> </td>

</tr>

<?php

}?></tbody>

</tfoot>

</table>

Gambar 4. 28 Coding Menu Kelola Surat F. Menu Kelola Laporan

Menu kelola laporan adalah menu untuk mengakses pendetakan data surat, dapat dilihat pada gambar dibawah ini :

Gambar 4. 29 Menu Laporan

<form action="" method="post" enctype="multipart/form-data">

<input type="hidden" name="id_pdd" value="<?php echo $id_pend ?>">

<div class="form-group row">

<label class="col-sm-2 col-form-label">Tgl Pindah</label>

<div class="col-sm-3">

<input type="date" class="form-control"

id="tgl_pindah" name="tgl_pindah" required>

</div>

</div>

<div class="form-group row">

<label class="col-sm-2 col-form- label">Alasan</label>

<div class="col-sm-6">

<input type="text" class="form-control"

id="alasan" name="alasan" placeholder="Alasan Pindah" required>

</div>

</div>

<div class="card-footer">

<input type="submit" name="simpan"

value="Kirim Pengajuan" class="btn btn-info">

Gambar 4. 30 Coding Menu Laporan 4.1.5. Hak Akses Kepala Desa

A. Menu Utama

Menu utama adalah menu yang diakses oleh masing-masing pengguna sistem untuk mengelola data, adapun gambar dapat dilihat pada gambar dibawah ini :

Gambar 4. 31 Menu Utama

<title>CETAK SURAT</title>

</head>

<body><center><?php

$sql_tampil = "select * from tb_pdd,tb_domisili

where tb_pdd.id_pend=tb_domisili.id_pdd and tb_domisili.id_pdd ='$id'";

$query_tampil = mysqli_query($koneksi,

$sql_tampil);

$data =

mysqli_fetch_array($query_tampil);?></center>

<center><h4>

<u>SURAT KETARANGAN DOMISILI</u>

</h4><h4>No Surat :<?php echo $data['no_surat']

?></h4</center>

<p>Yang bertanda tangan di bawah ini Peratin Pekon Penyandingan Kecamatan Bangkunat Kabupaten Pesisir Barat dengan ini menerangkan dengan sesungguhnya bahwa :</P>

<table><tbody><tr><td>Nama</td><td>:</td><td>

<?php echo $data['nama']; ?>

</td></tr><tr><td>Tempat, Tanggal lahir</td>

<td>:</td><td>

<?php echo $data['tempat_lh']; ?>,

<?php echo $data['tgl_lh'];?></td><tr><td>Jenis Kelamin</td>

<td>:</td>

<td>

<?php

if($data['jekel']=='LK'){echo"Laki-laki";}else{echo"Perempuan";} ?>

Gambar 4. 32 Coding Menu Utama B. Menu Kelola Laporan

Menu kelola laporan adalah menu untuk mengakses pendetakan data surat, dapat dilihat pada gambar dibawah ini :

Gambar 4. 33 Menu Laporan

$sql = $koneksi->query("SELECT COUNT(id_pend) as pend from tb_pdd where status='Ada'");

while ($data= $sql->fetch_assoc()) { $pend=$data['pend'];

}

$sql = $koneksi->query("SELECT COUNT(id_kk) as kartu from tb_kk");

while ($data= $sql->fetch_assoc()) { $kartu=$data['kartu'];

}

$sql = $koneksi->query("SELECT COUNT(id_pend) as laki from tb_pdd where jekel='LK'");

while ($data= $sql->fetch_assoc()) { $laki=$data['laki'];

}

$sql = $koneksi->query("SELECT COUNT(id_pend) as prem from tb_pdd where jekel='PR'");

while ($data= $sql->fetch_assoc()) { $prem=$data['prem'];

}

$sql = $koneksi->query("SELECT COUNT(id_lahir) as lahir from tb_lahir");

while ($data= $sql->fetch_assoc()) { $lahir=$data['lahir'];

}

Gambar 4. 34 Coding Menu Laporan

<head>

<title>CETAK SURAT</title>

</head>

<body><center><?php

$sql_tampil = "select * from tb_pdd,tb_domisili

where tb_pdd.id_pend=tb_domisili.id_pdd and tb_domisili.id_pdd ='$id'";

$query_tampil = mysqli_query($koneksi,

$sql_tampil);

$data =

mysqli_fetch_array($query_tampil);?></center>

<center><h4>

<u>SURAT KETARANGAN DOMISILI</u>

</h4><h4>No Surat :<?php echo $data['no_surat']

?></h4</center>

<p>Yang bertanda tangan di bawah ini Peratin Pekon Penyandingan Kecamatan Bangkunat Kabupaten Pesisir Barat dengan ini menerangkan dengan sesungguhnya bahwa :</P>

<table><tbody><tr><td>Nama</td><td>:</td><td>

<?php echo $data['nama']; ?>

</td></tr><tr><td>Tempat, Tanggal lahir</td>

<td>:</td><td>

<?php echo $data['tempat_lh']; ?>,

<?php echo $data['tgl_lh'];?></td><tr><td>Jenis Kelamin</td>

<td>:</td>

<td>

<?php

if($data['jekel']=='LK'){echo"Laki-laki";}else{echo"Perempuan";} ?>