Ada satu tambahan kerjaan para operator/teknisi TUKG baik yang bekerja hanya di tahap 1, maupun yang ikut berpartisipasi di UKG tahap 2 ini, yaitu permintaan dari pihak LPMP Provinsi yang meminta rekap nilai (baca: jumlah benar) dari seluruh peserta yang ikut UKG di TUKG tersebut. Di dalam aplikasi UKG Pelaksana (UKG Server) yang telah dibagikan oleh Pusat (baca: panitia pusat UKG), memang terdapat menu untuk melihat nilai peserta yang telah mengikuti UKG, tapi data tersebut perorangan, jadi kalau mau membuat rekapnya, maka harus satu persatu dibuka dan dicatat ulang (bayangkan kalau pesertanya lebih dari 100 orang, cape kan).
Ada satu orang operator/teknisi TUKG dari SMK Negeri 1 Paringin yang mencoba membuat aplikasi sederhana yang bisa menampilkan rekap yang diinginkan tersebut, yaitu bapak Bambang Abdi Setiawan (terima kasih banyak pak aplikasinya). Sampai sekarang, aplikasi tersebut sudah sampai versi 0.4, bisa diunduh di sini. Aplikasi tersebut masih akan dikembangkan oleh bapak Bambang Abdi Setiawan supaya bisa langsung melakukan ekspor ke format spreadsheet. Nah, disini penulis akan mencoba belajar cara membuat aplikasi tersebut.
Langkah pertama yang kita lakukan adalah menelaah isi dari database ukg_tuk yang ada di dalam UKG Pelaksana. Di dalam database tersebut ada 7 buah tabel, yaitu tabel admin, bank, hasil, kdata, mpel, peserta, dan tiket. Dimana tahunya ada 7 tabel? Bisa dilihat melalui aplikasi webmin (yang pakai port 10000).
Setelah diperiksa isinya (gimana cara periksanya, mudahan pada kesempatan lain bisa dijelaskan), kita hanya akan memakai 4 tabel, yaitu tabel peserta, mpel, tiket, dan kdata. (untuk nilai tidak dijelaskan disini, karena ada pesan sponsor, agar field nilai tidak ditampilkan).
Langkah selanjutnya adalah bikin dulu folder untuk menyimpan file pekerjaan kita. Dalam praktik kita kali ini, nama folder yang digunakan adalah laporan. Jadi nantinya semua file yang kita buat dan perlukan, diletakkan dalam folder laporan ini. Letakkan dalam folder laporan ini file gambar Tut Wuri Handayani yang telah diberikan nama logo.jpg, juga tambahkan file js.jquery-1.7.2.min.js dan file jquery.tablesorter.min.js yang sudah diletakkan dalam folder js, jadi folder js yang dimasukkan ke dalam folder laporan. Bingung dengan penjelasannya? Sekarang di dalam folder laporan sudah ada struktur seperti berikut ini.
laporan/ > > logo.jpg > js/ > js.jquery-1.7.2.min.js > jquery.tablesorter.min.js
Langkah selanjutnya adalah membuat file index.php dan letakkan pada folder laporan. Silahkan buat dengan menggunakan text editor kesayangan Anda seperti notepad atau yang lainnya skrip di bawah ini.
<?php
/**
* Laporan UKG
* Copyleft Okt 2012
*/
// Untuk mendeskripsikan TUKG kita, ubah sesuai dengan kondisi masing-masing
$data['logo'] = 'logo.jpg';
$data['judul1'] = 'Kementerian Pendidikan dan Kebudayaan';
$data['judul2'] = 'Uji Kompetensi Guru (UKG) Online';
$data['provinsi'] = 'Kalimantan Selatan';
$data['tukg'] = 'SMKN 1 Barabai';
$data['kabkot'] = 'Kabupaten Hulu Sungai Tengah';
$data['operator'] = 'ipulborneo';
$data['version'] = '0.1';
// Mengatur koneksi ke database, jangan dirubah
$koneksi = mysql_connect("localhost", "root", "");
// Memeriksa koneksi database, apakah berjalan lancar atau tidak
if (!$koneksi) {
die("Tidak dapat terhubung: " . mysql_error());
}
// Membuka database ukg_tuk
mysql_select_db("ukg_tuk", $koneksi);
?>
<!-- Memulai penulisan htmlnya -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<!-- Bagian ini akan muncul pada title bar browser -->
<title>Laporan UKG versi <?php echo $data['version'] ?> - oleh <?php echo $data['operator'];?> </title>
<!-- menambahkan tautan untuk css dan jquery -->
<link rel="stylesheet" href="./css/theme.css" type="text/css" id="" media="print, projection, screen" />
<script type="text/javascript" src="./js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="./js/jquery.tablesorter.min.js"></script>
<!-- skrip untuk mengatur supaya tabel
bisa diurutkan secara otomotis
waktu judul tabel diklik -->
<script type="text/javascript">
$(document).ready(function() {
$("#tabelnya").tablesorter();
});
</script>
</head>
<body>
<!-- Bagian ini akan menjadi kop (bagian atas dari tabel) -->
<h2>
<img src="<?php echo $data['logo'] ?>" alt="Logo" width="92" height="93" align="left" style="margin-right: 25px;" />
<?php echo $data['judul1'] ?><br />
<?php echo $data['judul2'] ?><br />
Propinsi <?php echo $data['provinsi'] ?>
</h2>
<!-- Keterangan di bawah logo -->
<div>
Lokasi UKG: <?php echo $data['tukg'] ?><br />
Kabupaten/Kota: <?php echo $data['kabkot'] ?>
</div>
<!-- mulai membuat tabel, ini bagian judul tabel -->
<table id="tabelnya" cellspacing="0">
<thead>
<tr>
<th>No. Urut</th>
<th>No. Peserta</th>
<th>Nama Peserta</th>
<th>Mata Pelajaran</th>
<th>Tempat Tugas</th>
<th>Waktu Mulai</th>
<th>Waktu Selesai</th>
</tr>
</thead>
<tbody>
<?php
// Bagian ini untuk mengambil data yang kita perlukan untuk ditampilkan
// pada tabel
$hasil = mysql_query("SELECT DISTINCT peserta.no_peserta AS No_Peserta,
peserta.nama AS Nama_Peserta,
mpel.nama AS Mata_Pelajaran,
kdata.tgs_tempat AS Tempat_Tugas,
tiket.tgl_mulai AS Waktu_Ujian_Mulai,
tiket.tgl_selesai AS Waktu_Ujian_Berakhir
FROM peserta
INNER JOIN tiket ON peserta.id_peserta = tiket.id_peserta
INNER JOIN kdata ON peserta.id_peserta = kdata.id_peserta
INNER JOIN mpel ON kdata.mpel = mpel.id_mpel
WHERE tiket.sync <> ''
ORDER BY peserta.nama ASC");
// $i ini untuk no urut pada tabel
$i = 1;
// menampilkan seluruh data yang ada pada database
while($baris = mysql_fetch_assoc($hasil)) {
echo " <tr>n";
echo " <td>" . $i . "</td>n";
echo " <td>" . $baris['No_Peserta'] . "</td>n";
echo " <td>" . $baris['Nama_Peserta'] . "</td>n";
echo " <td>" . $baris['Mata_Pelajaran']. "</td>n";
echo " <td>" . $baris['Tempat_Tugas']. "</td>n";
echo " <td>" . $baris['Waktu_Ujian_Mulai'] . "</td>n";
echo " <td>" . $baris['Waktu_Ujian_Berakhir'] . "</td>n";
echo " </tr>n";
// menambahkan nilai $i dengan 1
$i++;
}
// menutup koneksi database
mysql_close($hasil);
?>
</tbody>
</table>
<!-- menampilkan nama operator di bagian bawah setelah tabel -->
<div>
Operator: <?php echo $data['operator'] ?>
</div>
</body>
</html>
Setelah itu kita membuat file css untuk mengatur tampilannya, silahkan unduh lima file berikut dan letakkan dalam folder css (buat folder css dalam folder laporan). Isi folder laporan sekarang menjadi
laporan/ > > index.php > logo.jpg > css > style.css > theme.css > js/ > js.jquery-1.7.2.min.js > jquery.tablesorter.min.js
Langkah selanjutnya adalah memadatkan (kompres) folder ke dalam format zip dan upload ke dalam server melalui webmin pada folder /mnt/hda1/ukg-data/www (ingatkan untuk memilih ‘Yes’ pada pilihan ‘Uncompress ZIP or TAR file?’).
Silahkan diakses melalui browser anda alamatnya di http://ipaddress:port/laporan
Selamat mencoba.
Terima kasih kepada bapak Bambang Abdi Setiawan yang telah membuat skrip dan mengijinkan penulis mempublikasikan (dengan beberapa perubahan tentunya).
wakakakak, pesan sponsor… :))