Aplikasi Pembayaran SPP Berbasis Web Part 11 - Laporan Pembayaran

Aplikasi Pembayaran SPP Berbasis Web dengan PHP dan MySQL.

Hai, selamat datang kembali diblog sederhana ini, dikarenakan ada permintaan dari kawan untuk sekalian membuat cetak laporan pembayaran per periode maka dibuatlah artikel ini. Hehe

Pada artikel kali ini kita akan menambahkan fungsi export ke excel, kita tidak langsung melakukan cetak langsung dari browser tapi kita export dulu datanya ke excel.

Artikel terkait: Export HTML ke Excel menggunakan library PhpSpreadSheet

Fitur ini hanya tersedia pada level admin, jadi kita akan membuat dan menambahkan file-file baru ke dalam folder admin.

File-file yang akan kita ubah diantaranya:

• admin (folder)
• header.php
• index.php
• Admin.php

File-file yang dibuat:

• admin (folder)
• laporan-pembayaran.php

Langsung saja markitmul (mari kita mulai). :D

header.php

Pada file ini kita akan menambahkan menu laporan pada bagian header.

<li><a href="?p=laporan">Laporan Pembayaran</a></li>  

Sehingga akan terlihat seperti berikut:

<ul style="display:flex; list-style:none;">
			<li><b>Aplikasi Pembayaran SPP</b></li>
			<li><a href="?p=siswa">Data Siswa</a></li>
			<li><a href="?p=petugas">Data Petugas</a></li>
			<li><a href="?p=spp">Data SPP</a></li>
			<li><a href="?p=laporan">Laporan Pembayaran</a></li>
			<li><a href="?p=logout">Logout</a></li>
		</ul>    

Output:

index.php

Sekarang kita tambahkan beberapa baris kode didalam kondisi untuk menangkap nilai "p" yang dikirimkan.

elseif($_GET['p'] == 'laporan') { // jika nilai p = laporan
		require_once 'laporan-pembayaran.php'; // maka panggil file laporan-pembayaran.php
	}  

Kode lengkapnya akan seperti berikut:

<?php 
require_once 'header.php';

if(isset($_GET['p'])) {
	if($_GET['p'] == 'siswa') {
		require_once 'data-siswa.php';
	} elseif($_GET['p'] == 'tambah-siswa') {
		require_once 'tambah-siswa.php';
	} elseif($_GET['p'] == 'ubah-siswa') {
		require_once 'ubah-siswa.php';
	} elseif($_GET['p'] == 'hapus-siswa') {
		if($admin->hapusDataSiswa($_GET['nisn']))
		{
			$admin->hapusDataPembayaran($_GET['nisn']);
			header('Location: ?p=siswa');
			$_SESSION['pesan'] = "Data Siswa berhasil dihapus";
		}
		else
		{
			header('Location: ?p=siswa');
			$_SESSION['pesan'] = "Data Siswa gagal dihapus";
		}
	// baris kode untuk navigasi petugas
	} elseif($_GET['p'] == 'petugas') {
		require_once 'data-petugas.php';
	} elseif($_GET['p'] == 'tambah-petugas') {
		require_once 'tambah-petugas.php';
	} elseif($_GET['p'] == 'ubah-petugas') {
		require_once 'ubah-petugas.php';
	} elseif($_GET['p'] == 'hapus-petugas') {
		if($admin->hapusDataPetugas($_GET['id'])) // digunakan untuk hapus data petugas
		{
			header('Location: ?p=petugas');
			$_SESSION['pesan'] = "Data Petugas berhasil dihapus";
		}
		else
		{
			header('Location: ?p=petugas');
			$_SESSION['pesan'] = "Data Petugas gagal dihapus";
		}
	} elseif($_GET['p'] == 'spp') {
		require_once 'data-spp.php'; 
	} elseif($_GET['p'] == 'tambah-spp') {
		require_once 'tambah-spp.php'; 
	} elseif($_GET['p'] == 'ubah-spp') {
		require_once 'ubah-spp.php';
	} elseif($_GET['p'] == 'hapus-spp') {
		if($admin->hapusDataSPP($_GET['id']))
		{
			header('Location: ?p=spp');
			$_SESSION['pesan'] = "Data SPP berhasil dihapus";
		}
		else
		{
			header('Location: ?p=spp');
			$_SESSION['pesan'] = "Data SPP gagal dihapus";
		}
	} elseif($_GET['p'] == 'laporan') { // jika nilai p = laporan
		require_once 'laporan-pembayaran.php'; // maka panggil file laporan-pembayaran.php
	} elseif($_GET['p'] == 'logout') {
		header('Location: ../../index.php');
		session_destroy();
	}
}	

require_once 'footer.php'; 
?>    

Jika nilai "p" samadengan "laporan" maka panggil file laporan-pembayaran.php yang berisi kode untuk tampilan halaman laporan.

laporan-pembayaran.php

Sekarang kita buat file ini untuk menampilkan data dan meletakan tombol export didalamnya.

<h2>Laporan Pembayaran</h2>

<div style="display: inline-block;">
  <form method="POST">
    <label>Tampilkan data dari tgl.</label> 
    <input type="date" name="tgl_awal">
    <label>sampai tgl.</label>
    <input type="date" name="tgl_akhir">
    <input type="submit" name="tampil" value="Tampilkan">
  </form>
</div>
<div style="display: inline-block;">
  <form action="export.php" method="POST" id="convert_form">
    <input type="hidden" name="file_content" id="file_content">
    <button type="submit" name="convert" id="convert">Convert</button>
  </form>
</div>


<br/><br/>
<table border="1" id="table_content">
  <tr>
    <th>No.</th>
    <th>NISN</th>
    <th>Tgl. Bayar</th>
    <th>Nominal</th>
  </tr>


  <?php
  if (isset($_POST['tampil'])) {
    $date1 = $_POST['tgl_awal'];
    $date2 = $_POST['tgl_akhir'];

    $data = $admin->getDataPembayaranPerPeriode($date1, $date2); // akan muncul error karena belum dibuat

    $no = 1;
    $total = 0;
    foreach ($data as $r):
      ?>

      <tr>
        <td><?= $no++ ?></td>
        <td><?= $r['nisn'] ?></td>
        <td><?= $r['tgl_bayar'] ?></td>
        <td><?= $r['nominal'] ?></td>
      </tr>

      <?php
      $total += $r['nominal'];
    endforeach;

  } else {
    echo "<tr><td colspan='4'><center>Tidak ada data</center></td></tr>";
  }
  ?>

</table>

<!-- pastikan kamu sedang online -->
  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

<script type="text/javascript">
 $(document).ready(function() {
  $('#convert').click(function() {
   var table_content = '<table>';
   table_content += $('#table_content').html();
   table_content += '</table>';
   $('#file_content').val(table_content);
   $('#convert_form').html();
  });
 });
</script>    

Kita juga menggunakan jQuery, script dibagian bawah akan bertugas untuk mengirimkan data yang masih berupa html ke export.php.

Output:

Admin.php

Tambahkan method untuk menampilkan semua data pembayaran berdasarkan periode yang dipilih. Letakan kode berikut didalam class Admin.

public function getDataPembayaranPerPeriode($date1, $date2) {
		$stmt = mysqli_query($this->konek, "SELECT s.nisn, p.tgl_bayar, spp.tahun, spp.nominal FROM tb_siswa AS s INNER JOIN tb_pembayaran AS p ON s.nisn = p.nisn INNER JOIN tb_spp AS spp ON p.id_spp = spp.id_spp WHERE p.tgl_bayar BETWEEN '$date1' and '$date2'");

		return $stmt;
	}    

Output:

Selanjutnya, download disini untuk library PhpSpreadSheet yang sudah disesuaikan dengan tabel laporan pembayaran. 

Artikel terkait: Export HTML ke Excel menggunakan library PhpSpreadSheet

Setelah didownload, ekstrak lalu copy atau pindahkan semua file dan foldernya kedalam folder admin (jika muncul pesan untuk replace file index.php abaikan saja atau bisa skip).

Jika langkah-langkah diatas sudah semua, silahkan coba untuk export laporan pembayarannya.

Output Excel:

Jika terjadi error bisa ditanyakan lewat kolom komentar dibawah, terimakasih dan sampai jumpa.