MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2...

70
MODUL PRAKTIKUM Pemrograman Visual Akuntansi III Disusun Oleh : Windi Irmayani, SE. M.Kom. JURUSAN KOMPUTERISASI AKUNTANSI AMIK BSI PONTIANAK 2017

Transcript of MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2...

Page 1: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

MODUL PRAKTIKUM

Pemrograman Visual Akuntansi III

Disusun Oleh :

Windi Irmayani, SE. M.Kom.

JURUSAN KOMPUTERISASI AKUNTANSI

AMIK BSI PONTIANAK

2017

Page 2: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

KATA PENGANTAR

Alhamdullillah saya panjatkan kehadirat Allah SWT, yang telah melimpahkan

rahmat dan karunia-Nya, karena akhirnya saya dapat menyelesaikan Modul

Pemrograman Visual Akuntansi III ini dengan baik. Oleh karena itu pada kesempatan

ini, saya ingin menyampaikan ucapan terima kasih kepada:

1. Direktur AMIK BSI Pontianak

2. Wakil Direktur Bidang Akademik

3. Ketua Jurusan Komputerisasi Akuntansi AMIK BSI Pontianak

4. Staff / Karyawan / Dosen di lingkungan AMIK BSI Pontianak.

Saya menyadari akan kekurangan yang masih ada, untuk itu saya bersikap

terbuka pada masukan yang membangun demi penyempurnaan modul ini. Terima

kasih.

Pontianak, September 2017

Penyusun

Page 3: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Daftar Isi

Kata Pengantar

Daftar Isi

BAB I SQL – JOIN TABLE ........................................................................................ 1

1. SQL INNER JOIN .............................................................................................. 1

2. SQL LEFT OUTER JOIN .................................................................................. 1

3. SQL RIGHT OUTER JOIN ................................................................................ 3

4. Latihan Join Table .............................................................................................. 5

5. Fungsi Aggregate ................................................................................................ 6

6. Fungsi GROUP BY dan HAVING ..................................................................... 7

7. Latihan Grouping dan Having ............................................................................. 8

BAB II Report dengan JasperReport ............................................................................. 10

1 Menambahkan Plugin iReport pada Netbeans .................................................. 10

2 Membuat Laporan Sederhana dengan iReport .................................................. 10

3 Menampilkan Laporan JasperReport (.pdf) pada Web JSP .............................. 21

4 Membuat Laporan dengan Parameter ............................................................... 24

BAB III Membuat Laporan – Laporan ........................................................................... 33

1 Rekap Jurnal Umum ......................................................................................... 33

2 Buku Besar ....................................................................................................... 41

3 Neraca Saldo .................................................................................................... 42

4 Menampilkan Rekap Jurnal Umum Perbulan ................................................... 46

5 Menampilkan Rekap Jurnal Umum Perperiode ................................................ 56

DAFTAR PUSTAKA ...................................................................................................... 67

Page 4: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

1

BAB I

SQL – JOIN TABLE

SQL JOIN adalah perintah untuk menggabungkan dari dua atau lebih tabel

untuk menghasilkan informasi yang lebih detail dalam sebuah database. Terdapat tipe

yang berbeda dalam perintah JOIN, yaitu: 1. SQL INNER JOIN

2. SQL LEFT OUTER JOIN (LEFT JOIN)

3. SQL RIGHT OUTER JOIN (RIGHT JOIN)

1. SQL INNER JOIN

SQL INNER JOIN adalah jenis perintah yang paling umum dari SQL JOIN.

SQL INNER JOIN menampilkan semua baris dari beberapa tabel yang mana kondisi

join terpenuhi. Syntax:

SELECT columns

FROM table1

INNER JOIN table2

ON table1.column = table2.column;

Perhatikan diagram venn dibawah ini, SQL INNER JOIN akan menampilkan

pada area yang diarsir.

Dari diagram venn di atas, INNER JOIN hanya akan menampilkan baris/record

dimana table1 dan table2 berpotongan.

Page 5: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

1

Sebagai contoh, perhatikan bagaimana menggunakan INNER JOIN di

dalam query. Dalam contoh ini kita akan menggunakan database “sia” yang di

dalamnya terdapat tabel “master_akun”:

dan tabel “saldo_awal”:

Ketikan perintah SQL berikut ini: SELECT A.kode_akun, A.nama_akun, B.saldo_debet,

B.saldo_kredit

FROM master_akun A INNER JOIN saldo_awal B

ON A.kode_akun = B.kode_akun

Hasil perintah tersebut:

Dari contoh di atas menampilkan baris dari tabel master_akun dan saldo_awal

yang mana ada kesamaan nilai kode_akun pada kedua tabel master_akun dan

saldo_awal.

2. SQL LEFT OUTER JOIN

SQL LEFT JOIN akan menampilkan semua baris dari sisi kiri tabel dalam

ON kondisi dan baris dari tabel lain dimana field yang bergabung sama (kondisi

join terpenuhi).

Syntax:

SELECT columns

FROM table1

Page 6: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

3

LEFT [OUTER] JOIN table2

ON table1.column = table2.column;

Perhatikan diagram venn dibawah ini, SQL LEFT JOIN akan

menampilkan pada area yang diarsir.

Dari diagram di atas menunjukan SQL LEFT JOIN akan menampilkan seluruh

baris pada table1 dan sebagian dari table2.

Sebagai contoh perhatikan bagaimana penggunaan dari perintah SQL

LEFT JOIN di dalam query:

Tabel: master_akun

Tabel: saldo_awal

Ketikan perintah SQL berikut ini:

SELECT A.kode_akun, A.nama_akun, B.saldo_debet,

B.saldo_kredit

FROM master_akun A LEFT JOIN saldo_awal B

ON A.kode_akun = B.kode_akun

Hasil perintah tersebut:

Page 7: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

4

Dari contoh di atas pernyataan SQL LEFT JOIN menampilkan seluruh

baris pada tabel master_akun dan sebagian saldo_awal yang mana ada kesamaan

nilai kode_akun pada kedua tabel master_akun dan saldo_awal.

Jika ditemukan ketidaksesuaian nilai kode_akun antara tabel master_akun

dan saldo_awal maka akan ditampilkan nilai NULL.

3. SQL RIGHT OUTER JOIN

SQL RIGHT JOIN akan menampilkan semua baris dari sisi kanan tabel

dalam ON kondisi dan baris dari tabel lain dimana field yang bergabung sama

(kondisi join terpenuhi).

Syntax:

SELECT columns

FROM table1

RIGHT [OUTER] JOIN table2

ON table1.column = table2.column;

Perhatikan diagram venn dibawah ini, SQL RIGHT JOIN akan

menampilkan pada area yang diarsir.

Dari diagram di atas menunjukan SQL RIGHT JOIN akan menampilkan seluruh

baris pada table2 dan sebagian dari table1.

Sebagai contoh perhatikan bagaimana penggunaan dari perintah SQL

RIGHT JOIN di dalam query:

Page 8: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

5

Tabel: master_akun

Tabel: saldo_awal

Ketikan perintah SQL berikut ini: SELECT A.kode_akun, A.nama_akun, B.saldo_debet,

B.saldo_kredit

FROM master_akun A RIGHT JOIN saldo_awal B

ON A.kode_akun = B.kode_akun

Hasil perintah tersebut:

Dari contoh di atas pernyataan SQL RIGHT JOIN menampilkan seluruh

baris pada tabel saldo_awal dan sebagian master_akun yang mana ada kesamaan

nilai kode_akun pada kedua tabel master_akun dan saldo_awal.

Jika ditemukan ketidaksesuaian nilai kode_akun antara tabel master_akun

dan saldo_awal maka akan ditampilkan nilai NULL.

4. Latihan Join Table

Perhatikan ketiga tabel-tabel berikut ini:

Tabel 1: master_akun

Page 9: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

6

Tabel 2: jurnal

Tabel 3: jurnal_detil

Buatlah join tabel dari ketiga tabel: INNER JOIN, LEFT JOIN, dan RIGHT JOIN

5. Fungsi Aggregate

Perintah SQL fungsi aggregate adalah fungsi yang terdapat dalam MySQL

untuk melakukan kalkulasi data.

Fungsi-fungsi aggreagate, diantaranya: Fungsi AVG

Fungsi COUNT()

Fungsi MAX()

Fungsi MIN()

Fungsi SUM()

Page 10: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

7

Fungsi AVG()

Fungsi AVG() adalah fungsi untuk menampilkan nilai rata-rata dari kolom

numerik;

SQL AVG() syntax:

SELECT AVG(column_name)

FROM table_name

Fungsi COUNT()

Fungsi COUNT() adalah fungsi untuk menampilkan jumlah baris yang sesuai

dengan kriteria tertentu.

SQL COUNT() syntax:

SELECT COUNT(column_name)

FROM table_name;

Fungsi MAX()

Fungsi MAX() adalah fungsi untuk menampilkan nilai terbesar dari suatu kolom

tertentu.

SQL MAX() syntax:

SELECT MAX(column_name)

FROM table_name;

Fungsi MIN()

Fungsi MIN() adalah fungsi untuk menampilkan nilai terkecil dari suatu kolom

tertentu.

SQL MIN() syntax:

SELECT MAX(column_name)

FROM table_name;

Fungsi SUM()

Fungsi SUM() adalah fungsi untuk menampilkan total dari kolom numerik.

SQL SUM() syntax:

SELECT SUM(column_name)

FROM table_name;

6. Fungsi GROUP BY dan HAVING

Fungsi Agregat sering membutuhkan penambahan pernyataan GROUP

BY. Pernyataan GROUP BY digunakan dalam hubungan dengan fungsi agregat

untuk pengelompokan data.

SQL GROUP BY syntax: SELECT column_name, aggregate_function(column_name)

FROM table_name

WHERE [conditions]

GROUP BY column_name;

Kondisi dalam WHERE tidak dapat diterapkan pada fungsi agregrasi seperti

COUNT, SUM, AVG, dan lain-lain. Untuk menyeleksi suatu fungsi agregasi, kita tidak

dapat menggunakan WHERE, namun kita dapat menggunakan HAVING.

SQL HAVING syntax: SELECT column_name, aggregate_function(column_name)

FROM table_name

WHERE [conditions]

GROUP BY column_name

HAVING [conditions];

Page 11: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

8

7. Latihan Grouping dan Having

Buatlah database penjualan dengan phpMyAdmin.

Buatlah tabel-tabel berikut ini:

Tabel: Pemesanan

Tabel: Pelanggan

Isi tabel-tabel seperti dibawah ini:

Page 12: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

9

Tuliskan perintah SQL berikut ini:

SELECT B.namaPelanggan, COUNT(A.orderID) AS jumlahPesanan

FROM pemesanan AS A INNER JOIN Pelanggan AS B

ON A.pelangganID = B.pelangganID

GROUP BY B.namaPelanggan

Dari hasil query di atas akan menampilkan jumlah pesanan setiap pelanggan,

sekarang buatlah perintah SQL untuk menampilkan total keseluruhan

pembayaran setiap pelanggan seperti dibawah ini:

Page 13: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

10

BAB II

Report dengan JasperReport

Pada bab ini akan membahas pembuatan laporan dengan menggunakan

JasperReport, sebelum memulai kita harus mendownload plugin iReport

(http://plugins.netbeans.org/plugin/4425/ireport) dan library-library dari

jasperReport.

1. Menambahkan Plugin iReport pada Netbeans Setelah plugin dan library-librari sudah di dapat langkah selanjutnya

adalah menginstall plugin dan menambahkan librari-librari pada project yang kita

buat, langkah-langkahnya sebagai berikut: 1. Masuk ke Netbeans, kemudian klik Tools pada menu bar, kemudian akan muncul

kotak dialog seperti pada gambar:

2. Dan Pilih file iReport semua file (*.nbm) yang ada disana, dan Klik Open.

3. Klik Install, dan ikuti petunjuk selanjutnya yang tampil.

2. Membuat Laporan Sederhana dengan iReport Sebelum membuat laporan, persiapkan terlebih dahulu database yang akan

digunakan untuk pembuatan laporan. 1. Buatlah database dengan nama: laporan dan buatlah tabel dengan nama: barang

(isilah tabel dengan beberapa record yang berbeda).

Page 14: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

11

2. Buatlah Project baru pada netbeans dengan nama: laporan

Next

Page 15: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

12

Next

3. Setelah selesai pembuatan project, langkah selanjutnya menambahkan libraries pada

project. Klik kanan pada project: laporan >> properties

Page 16: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

13

Librari-librari yang ditambahkan:

Page 17: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

14

Page 18: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

15

4. Project yang telah ditambahkan libraries seperti dibawah ini:

5. Pembuatan laporan data barang dengan iReport Wizard. Klik New File pada toolbar

Page 19: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

16

Memilih Layout/tampilan laporan, Next >.

Menentukan Nama dan lokasi penyimpanan (laporan_barang.jrxml), Next >.

Page 20: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

17

Membuat Query (koneksi database dan query), New.

Membuat DataSource (Database JDBC connection).

Page 21: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

18

Membuat koneksi database, Save.

Page 22: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

19

Menuliskan perintah query (SELECT), Next >.

Menentukan Fields yang akan ditampilkan, >> dan Next >.

Page 23: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

20

Untuk grouping di Next, selanjutnya Finish. Akan tampak (Design) seperti

dibawah ini:

Page 24: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

21

Hasil diatas merupakan laporan saat di preview, lakukan perubahan pada title

report designer sebagai berikut:

3. Menampilkan Laporan JasperReport (.pdf) pada Web JSP

Langkah selanjutnya adalah menampilkan laporan yang telah dibuat,

laporan yang akan ditampilkan pada web jsp dengan format pdf. Berikut langkah-

langkahnya: 1. Membuat File: index.jsp

Page 25: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

22

Nama File: index.jsp

<%@page contentType="text/html" pageEncoding="UTF-8"%>

<!DOCTYPE html>

<html>

<head>

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

<title>Cetak Laporan</title>

</head>

<body>

<h1>Menampilkan Laporan Barang!</h1>

Cetak laporan <a href="cetakLaporanBarang.jsp">Klik</a>

</body>

</html>

Note: hapus file index.html

2. Buatlah File: cetakLaporanBarang.jsp

Page 26: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

23

Nama File: cetakLaporanBarang.jsp

<%@page import="java.io.*, java.util.*, java.sql.*"%>

<%@page import="net.sf.jasperreports.engine.*"%>

<%@page import="net.sf.jasperreports.view.JasperViewer.*"%>

<%@page import="javax.servlet.ServletResponse"%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>

<!DOCTYPE html>

<html>

<head>

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

<title>Laporan Barang</title>

</head>

<body>

<%

Connection conn = null;

//--koneksi ke MySQL database: laporan

String url="jdbc:mysql://localhost:3306/laporan";

String username="root";

String password="";

Class.forName("com.mysql.jdbc.Driver");

conn = DriverManager.getConnection(url, username, password);

File reportFile = new File(application.getRealPath("/laporan_barang.jasper"));

Map<String, Object> param=new HashMap<String, Object>();

byte[] bytes = JasperRunManager.runReportToPdf(reportFile.getPath(), param,

conn);

response.setContentType("application/pdf");

response.setContentLength(bytes.length);

ServletOutputStream outStream = response.getOutputStream();

outStream.write(bytes, 0, bytes.length);

outStream.flush();

outStream.close();

%>

</body>

</html>

Hasil laporan yang ditampilkan:

Page 27: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

24

4. Membuat Laporan dengan Parameter

Selanjutnya membuat laporan dengan menggunakan parameter, pada

contoh kali ini adalah menampilkan laporan data barang menggunakan kriteria

stok kurang dari dan report yang didesain secara manual. Berikut langkah-langkah

pembuatannya: 1. Membuat File: inputParam.jsp

Page 28: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

25

Nama File: inputParam.jsp

<%@page contentType="text/html" pageEncoding="UTF-8"%>

<!DOCTYPE html>

<html>

<head>

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

<title>Laporan dengan Parameter</title>

</head>

<body>

<h1>Cetak Laporan berdasarkan Stok</h1>

<form action="cetakLapBarangDgParameter.jsp" method="get">

Stok <= <input type="number" name="nilai" value="0">

<input type="submit" name="submit" value="Cetak Laporan"/>

</form>

</body>

</html>

2. Mendesain Laporan Data Barang secara Manual: LapBarangDgParameter.jrxml

Buatlah File baru: New > Report Wizard

Page 29: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

26

Menentukan Nama (LapBarangDgParameter.jrxml) dan Lokasi penyimpanan

report.

Menuliskan perintah query: SELECT * FROM barang.

Page 30: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

27

Menentukan Field yang akan ditampilkan kedalam laporan.

Page 31: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

28

Finish, untuk grouping bisa di next (dilewatkan).

Desain report seperti dibawah ini:

Pallete:

o Report Elements: Static Label (), double klik pada element atau atur

pada properties: text (Laporan Data Barang),dan size (30).

o Tools: Page X of Y, dan Current date.

Report Inspector:

o Fields: drag dan drop pada bagian Detail1 untuk setiap field.

Page 32: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

29

Lakukan pengaturan pada tiap elemen melalui properties.

Static Text (Title): ubahlah pada Text, Font, FontSize, dan Bold

Static Text (Column Header): Ubahlah pada Text sesuai dengan judul kolom

pada tabel yang akan ditampilkan.

Menambahkan Parameter pada Report Query, perhatikan gambar berikut:

Page 33: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

30

Preview Report

Page 34: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

31

3. Membuat File: cetakLapBarangParameter.jsp

Nama File: cetakLapBarangParameter.jsp

<%@page import="java.io.*, java.util.*, java.sql.*"%>

<%@page import="net.sf.jasperreports.engine.*"%>

<%@page import="net.sf.jasperreports.view.JasperViewer.*" %>

<%@page import="javax.servlet.ServletResponse" %>

<%@page contentType="text/html" pageEncoding="UTF-8"%>

<!DOCTYPE html>

<html>

<head>

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

<title>JSP Page</title>

</head>

<body>

<%

Connection conn = null;

//--koneksi ke MySQL database: laporan

String url="jdbc:mysql://localhost:3306/laporan";

String username="root";

String password="";

int jumlah = Integer.parseInt(request.getParameter("jumlah"));

Page 35: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

32

Class.forName("com.mysql.jdbc.Driver");

conn = DriverManager.getConnection(url, username, password);

File reportFile = new File(application

.getRealPath("/reportDenganParameter"

+ "/LapBarangDgParameter.jasper"));

Map param = new HashMap();

param.put("pstok", jumlah);

byte[] bytes = JasperRunManager

.runReportToPdf(reportFile.getPath(), param, conn);

response.setContentType("application/pdf");

response.setContentLength(bytes.length);

ServletOutputStream outStream = response.getOutputStream();

outStream.write(bytes, 0, bytes.length);

outStream.flush();

outStream.close();

%>

</body>

</html>

Page 36: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

33

BAB III

Membuat Laporan – Laporan

Bab ini membahas tentang pembuatan laporan yang berkaitan dengan

keuangan dari database SIA diantaranya: Rekap jurnal umum, buku besar, neraca

saldo, dan neraca mutasi saldo.

1. Rekap Jurnal Umum

Gambar diatas hasil dari rekap jurnal umum yang ditampilkan, untuk

membuat laporan tersebut ikutilah langkah-langkah berikut: 1. Buka project: SIA dan buat folder baru dengan nama Report dalam folder Web

Pages untuk menyimpan file-file laporan yang akan dibuat.

2. Buatlah report file dengan Report Wizard

Page 37: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

34

Nama File: rekapJurnalUmum.jrxml

Membuat koneksi database

Page 38: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

35

Page 39: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

36

Menuliskan query (SQL), kita dapat menuliskan query atau melalu Design query.

Dengan Design query, pilih tabel terlebih dahulu (double klik) kemudian buat relasi

dengan cara drag & drop pada field primary key dan foreign key.

Page 40: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

37

Hail query (SQL) dari design query, sbb:

SELECT

jurnal.no_referensi AS jurnal_no_referensi,

jurnal.tgl_trans AS jurnal_tgl_trans,

jurnal.keterangan AS jurnal_keterangan,

jurnal_detail.debet AS jurnal_detail_debet,

jurnal_detail.kredit AS jurnal_detail_kredit,

master_akun.nama_akun AS master_akun_nama_akun,

master_akun.kode_akun AS master_akun_kode_akun

FROM

jurnal_detail INNER JOIN master_akun

ON jurnal_detail.kode_akun = master_akun.kode_akun

INNER JOIN jurnal

ON jurnal_detail.no_referensi = jurnal.no_referensi

Page 41: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

38

Pindahkan semua Fields >> yang akan ditampilkan pada laporan.

Menentukan Group by (Pengelompokan) berdasarkan no referensi jurnal.

Page 42: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

39

Finish.

3. Desain report sebagai berikut:

Perhatikan pada Report Inspector:

Page 43: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

40

Klik kanan pada jurnal_detail… Group Header – Add Band.

Pada bagian Group Header: jurnal_no_referensi, jurnal_tgl_trans, dan

jurnal_keterangan.

Pada bagian Detail: jurnal_detail_kode_akun, master_akun_nama_akun,

jurnal_detail_debet, dan jurnal_detail_kredit.

Pada bagian Summary masukkan jurnal_detail_debet, dan jurnal_detail_kredit.

Pada saat muncul pertanyaan pilih The result of an aggregation function: sum.

Page 44: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

41

2. Buku Besar

1. Buka project: SIA dan buat folder baru dengan nama Report dalam folder Web

Pages untuk menyimpan file-file laporan yang akan dibuat.

2. Buatlah report file dengan Report Wizard.

3. Nama File: bukuBesar.jrxml

4. Masukkan query (SQL), berikut:

Page 45: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

42

SELECT

master_akun.`kode_akun` AS master_akun_kode_akun,

master_akun.`nama_akun` AS master_akun_nama_akun,

jurnal.`no_referensi` AS jurnal_no_referensi,

jurnal.`tgl_trans` AS jurnal_tgl_trans,

jurnal.`keterangan` AS jurnal_keterangan,

jurnal_detail.`no_referensi` AS jurnal_detail_no_referensi,

jurnal_detail.`kode_akun` AS jurnal_detail_kode_akun,

jurnal_detail.`debet` AS jurnal_detail_debet,

jurnal_detail.`kredit` AS jurnal_detail_kredit,

jurnal.`no_bukti_trans` AS jurnal_no_bukti_trans

FROM

`master_akun` master_akun INNER JOIN `jurnal_detail` jurnal_detail ON

master_akun.`kode_akun` = jurnal_detail.`kode_akun`

INNER JOIN `jurnal` jurnal ON jurnal_detail.`no_referensi` =

jurnal.`no_referensi`

ORDER BY master_akun.kode_akun, jurnal_detail.no_referensi

5. Next, pilih semua fields untuk ditampilkan.

6. Pilih Group 1: jurnal_detail_kode_akun pada proses Group By (pengelompokan).

7. Finish.

8. Design dari buku besar, sbb:

Page 46: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

43

9. Pada Report Inspector:

Klik kanan pada master_akun_kode_akun Group Header 1 dan

master_akun_kode_akun Group Footer 1 – Add Band.

10. Di Group Header 1 pilih: jurnal_detail_kode_akun dan master_akun_nama_akun

dari Fields (Report Inspector).

11. Di Detail1 pilih: tanggal, no_referensi, keterangan, debet, dan kredit.

12. Di Group Footer 1: pilih debet, dan kredit akan ditampilkan pertanyaan pilih The

result of an aggregation function: sum.

Page 47: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

44

3. Neraca Saldo

1. Buka project: SIA dan buat folder baru dengan nama Report dalam folder Web

Pages untuk menyimpan file-file laporan yang akan dibuat.

2. Buatlah report file dengan Report Wizard.

3. Nama File: neracaSaldo.jrxml

4. Masukkan perintah query (SQL):

Page 48: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

45

SELECT A.nama_akun, SUM(B.debet) AS mutasi_debet, SUM(B.kredit) as

mutasi_kredit,

IF(SUM(B.debet-B.kredit) >= 0, SUM(B.debet-B.kredit), 0) AS saldo_debet,

IF(SUM(B.debet-B.kredit) <= 0, SUM(B.kredit-B.debet), 0) AS saldo_kredit

FROM master_akun AS A INNER JOIN jurnal_detail AS B

ON A.kode_akun = B.kode_akun

GROUP BY A.nama_akun

ORDER BY A.kode_akun

5. Next, pilih semua fields untuk ditampilkan.

6. Pilih Group 1: Next.

7. Finish.

8. Design dari Neraca saldo sbb:

Page 49: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

46

4. Menampilkan Rekap Jurnal Umum Perbulan

Tampilan pada browser untuk mencetak rekap jurnal umum dalam bentuk pdf.

Tampilan pada browser saat mencetak rekap jurnal umum dalam bentuk pdf

1. Bukalah project pembuatan Rekap jurnal umum yang sudah dbuat sebelumnya.

Maka akan tampil seperti gambar dibawah ini :

Page 50: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

47

2. Pastikan koneksi datasource sudah sama dengan database yang digunakan pada saat

membuat rekap jurnal umum (1). Kemudian pilih icon untuk menampilkan query

rekap jurnal umum (2).

3. Tambahkan Parameter dengan cara klik New Parameter (1).

(1) (2)

(1)

Page 51: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

48

4. Buatlah 2 parameter dengan isi :

a. Parameter name : bln

Value expression : Integer

b. Parameter name : thn

Value epression : Integer

5. Ubahlah script pada query rekap jurnal umum dengan script di bawah ini, kemudian

pilih OK.

SELECT

jurnal.`no_referensi` AS jurnal_no_referensi,

jurnal.`tgl_trans` AS jurnal_tgl_trans,

jurnal.`keterangan` AS jurnal_keterangan,

jurnal_detail.`debet` AS jurnal_detail_debet,

jurnal_detail.`kredit` AS jurnal_detail_kredit,

master_akun.`nama_akun` AS master_akun_nama_akun,

master_akun.`kode_akun` AS master_akun_kode_akun,

date_format(jurnal.`tgl_trans`,'%M') AS bulan

FROM

`jurnal_detail` jurnal_detail INNER JOIN `master_akun` master_akun ON

jurnal_detail.`kode_akun` = master_akun.`kode_akun`

INNER JOIN `jurnal` jurnal ON jurnal_detail.`no_referensi` =

jurnal.`no_referensi`

WHERE

month(tgl_trans)=$P{bln} and year(tgl_trans)=$P{thn}

Page 52: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

49

6. Tampilkanlah Pallete dengan cara seperti gambar 1, kemudian desainlah tulisan

bulan dan tahun seperti gambar 2 dengan menggunakan static text pada Pallete :

(1)

(2) (3)

Page 53: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

50

7. Bukalah report inspector, kemudian tambahkan bulan pada kelompok Fields (1) dan

thn pada kelompok Parameters (2) ke dalam desain rekap jurnal umum (gambar1).

Pada saat menmbahkan bulan, jika muncul kotak dialog, maka pilihlah The Field

value (gambar 2).

Gambar 1 (1)

(2)

Page 54: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

51

8. Sebelum kita buat untuk tampilan pemanggilannya, kita cek dulu apakah datanya

sudah bisa muncul dengan memilih Preview (gambar 1), kemudian isilah bulan

dengan angka sesuai dengan record yang berada di database (gambar 2), dan tahun

juga diisi sesuai dengan database (gambar 3). Jika benar maka akan muncul data rekap

jurnal umum (gambar 4).

Page 55: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

52

Page 56: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

53

9. Buatlah file jsp baru dengan nama rekap_ju_perbulan. Isi dengan script dibawah

ini :

Nama File: rekap_ju_perbulan.jsp

<%@page import="java.io.*, java.util.*, java.sql.*"%>

<%@page import="net.sf.jasperreports.engine.*"%>

<%@page import="net.sf.jasperreports.view.JasperViewer.*" %>

<%@page import="javax.servlet.ServletResponse" %>

<%@page contentType="text/html" pageEncoding="UTF-8"%>

<!DOCTYPE html>

<html>

<head>

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

<title>JSP Page</title>

</head>

<body>

<%

Connection conn = null;

//--koneksi ke MySQL database: sia1 (sesuaikan dengan database masing-masing)

String url="jdbc:mysql://localhost:3306/sia1";

String username="root";

String password="";

int bulan=Integer.parseInt(request.getParameter("bulan")) ;

int tahun=Integer.parseInt(request.getParameter("tahun")) ;

Class.forName("com.mysql.jdbc.Driver");

conn = DriverManager.getConnection(url, username, password);

File reportFile = new File(application

.getRealPath("/ReportJurnalUmumParameter"

+ "/rekapJurnalUmumPerbulan.jasper"));

Page 57: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

54

Map parameter = new HashMap();

parameter.put("bln", bulan);

parameter.put("thn", tahun);

byte[] bytes = JasperRunManager

.runReportToPdf(reportFile.getPath(), parameter, conn);

response.setContentType("application/pdf");

response.setContentLength(bytes.length);

ServletOutputStream outStream = response.getOutputStream();

outStream.write(bytes, 0, bytes.length);

outStream.flush();

outStream.close();

%>

</body>

</html>

10. Buatlah file jsp baru dengan nama tampil_rekap_ju_perbulan. Isi dengan script

dibawah ini :

Nama File: tampil_rekap_ju_perbulan.jsp

<%--

Document : tampil_rekap_ju

Created on : Aug 18, 2016, 3:11:36 PM

Author : yudhistira

--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>

<!DOCTYPE html>

<html>

<head>

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

<title>JSP Page</title>

</head>

<body>

<h1>Tampilkan Rekap Jurnal Umum Berdasarkan Bulan dan Tahun</h1>

<form action="rekap_ju_perbulan.jsp">

Masukkan Bulan :

<select name="bulan" id="bulan">

<option value="1">Januari</option>

<option value="2">Februari</option>

<option value="3">Maret</option>

<option value="4">April</option>

<option value="5">Mei</option>

<option value="6">Juni</option>

<option value="7">Juli</option>

<option value="8">Agustus</option>

<option value="9">September</option>

Page 58: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

55

<option value="10">Oktober</option>

<option value="11">November</option>

<option value="12">Desember</option>

</select><br>

Masukkan Tahun :

<select name="tahun" id="tahun">

<option value="2010">2010</option>

<option value="2011">2011</option>

<option value="2012">2012</option>

<option value="2013">2013</option>

<option value="2014">2014</option>

<option value="2015">2015</option>

<option value="2016">2016</option>

<option value="2017">2017</option>

<option value="2018">2018</option>

<option value="2019">2019</option>

<option value="2020">2020</option>

</select>

<br>

<input type="submit" value="TAMPIL">

</form>

</body>

</html>

11. Jalankan file tampil_rekap_ju_perbulan.jsp dengan klik kanan kemudian pilih

Run File. Maka akan tampil di browser. Kemudian pilih bulan dan tahun untuk

menampilkan rekap jurnal umum.

Page 59: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

56

Tampilan pada browser untuk mencetak rekap jurnal umum dalam bentuk pdf.

Tampilan pada browser saat mencetak rekap jurnal umum dalam bentuk pdf

5. Menampilkan Rekap Jurnal Umum Perperiode

Tampilan pada browser untuk mencetak rekap jurnal umum perperiode.

Page 60: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

57

Tampilan pada browser saat mencetak rekap jurnal umum perperiode

1. Buatlah project yang sama seperti pembuatan Rekap jurnal umum yang sudah dbuat

sebelumnya. Maka akan tampil seperti gambar dibawah ini :

2. Pastikan koneksi datasource sudah sama dengan database yang digunakan pada saat

membuat rekap jurnal umum (1). Kemudian pilih icon untuk menampilkan query

rekap jurnal umum (2).

Page 61: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

58

3. Tambahkan Parameter dengan cara klik New Parameter (1).

4. Buatlah 2 parameter dengan isi :

a. Parameter name : tgldari

(1) (2)

(1)

Page 62: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

59

Value expression : Text

b. Parameter name : tglsampai

Value epression : Text

5. Ubahlah script pada query rekap jurnal umum dengan script di bawah ini, kemudian

pilih OK.

SELECT

jurnal.`no_referensi` AS jurnal_no_referensi,

jurnal.`tgl_trans` AS jurnal_tgl_trans,

jurnal.`keterangan` AS jurnal_keterangan,

jurnal_detail.`debet` AS jurnal_detail_debet,

jurnal_detail.`kredit` AS jurnal_detail_kredit,

master_akun.`nama_akun` AS master_akun_nama_akun,

master_akun.`kode_akun` AS master_akun_kode_akun

FROM

`jurnal_detail` jurnal_detail INNER JOIN `master_akun` master_akun ON

jurnal_detail.`kode_akun` = master_akun.`kode_akun`

INNER JOIN `jurnal` jurnal ON jurnal_detail.`no_referensi` =

jurnal.`no_referensi`

WHERE

tgl_trans between $P{tgldari} and $P{tglsampai}

Page 63: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

60

6. Tampilkanlah Pallete dengan cara seperti gambar 1, kemudian desainlah tulisan Dari

Tanggal dan Sampai Tanggal seperti gambar 2 dengan menggunakan static text

pada Pallete :

(1)

(2) (3)

Page 64: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

61

Gambar 2

7. Bukalah report inspector, kemudian tambahkan tgldari dan tglsampai pada

kelompok Parameters ke dalam desain rekap jurnal umum (gambar1).

8. Sebelum kita buat untuk tampilan pemanggilannya, kita cek dulu apakah datanya

sudah bisa muncul dengan memilih Preview (gambar 1), kemudian isilah tgldari

sesuai dengan record yang berada di database (gambar 2), dan tglsampai juga diisi

sesuai dengan database (gambar 3). Jika benar maka akan muncul data rekap jurnal

umum (gambar 4).

Page 65: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

62

Page 66: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

63

9. Buatlah file jsp baru dengan nama rekap_ju_perperiode. Isi dengan script dibawah

ini :

Nama File: rekap_ju_perperiode.jsp

<%@page import="java.io.*, java.util.*, java.sql.*"%>

<%@page import="net.sf.jasperreports.engine.*"%>

<%@page import="net.sf.jasperreports.view.JasperViewer.*" %>

<%@page import="javax.servlet.ServletResponse" %>

<%@page contentType="text/html" pageEncoding="UTF-8"%>

<!DOCTYPE html>

<html>

<head>

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

<title>JSP Page</title>

Page 67: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

64

</head>

<body>

<%

Connection conn = null;

//--koneksi ke MySQL database: sia1 (sesuaikan dengan database masing-masing)

String url="jdbc:mysql://localhost:3306/sia1";

String username="root";

String password="";

String tglawal=request.getParameter("tglawal");

String tglakhir=request.getParameter("tglakhir");

Class.forName("com.mysql.jdbc.Driver");

conn = DriverManager.getConnection(url, username, password);

File reportFile = new File(application

.getRealPath("/ReportJUPerperiode"

+ "/rekapJurnalUmum.jasper"));

Map parameter = new HashMap();

parameter.put("tgldari", tglawal);

parameter.put("tglsampai", tglakhir);

byte[] bytes = JasperRunManager

.runReportToPdf(reportFile.getPath(), parameter, conn);

response.setContentType("application/pdf");

response.setContentLength(bytes.length);

ServletOutputStream outStream = response.getOutputStream();

outStream.write(bytes, 0, bytes.length);

outStream.flush();

outStream.close();

%>

</body>

</html>

10. Buatlah file jsp baru dengan nama tampil_rekap_ju_perperiode. Isi dengan

script dibawah ini :

Nama File: tampil_rekap_ju_ perperiode.jsp

<%--

Document : tampil_rekap_ju

Created on : Aug 18, 2016, 3:11:36 PM

Author : yudhistira

--%>

Page 68: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

65

<%@page contentType="text/html" pageEncoding="UTF-8"%>

<!DOCTYPE html>

<html>

<head>

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

<title>JSP Page</title>

</head>

<body>

<h1>Tampilkan Rekap Jurnal Umum Berdasarkan Periode</h1>

<form action="rekap_ju_perperiode.jsp">

Masukkan Tanggal Awal :

<input type="date" name="tglawal" id="tglawal" value=""><br>

Masukkan Tanggal Akhir :

<input type="date" name="tglakhir" id="tglakhir" value=""><br>

<br>

<input type="submit" value="TAMPIL">

</form>

</body>

</html>

11. Jalankan file tampil_rekap_ju_perperiode.jsp dengan klik kanan kemudian

pilih Run File. Maka akan tampil di browser. Kemudian pilih tanggal awal dan

tanggal akhir untuk menampilkan rekap jurnal umum perperiode.

Tampilan pada browser untuk mencetak rekap jurnal umum perperiode.

Page 69: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

66

Tampilan pada browser saat mencetak rekap jurnal umum perperiode

Page 70: MODUL PRAKTIKUM Pemrograman Visual …...Pemrograman Visual Akuntansi III 3 LEFT [OUTER] JOIN table2 ON table1.column = table2.column; Perhatikan diagram venn dibawah ini, SQL LEFT

Pemrograman Visual Akuntansi III

67

Daftar Pustaka

A.S, Rosa dan M. Shalahuddin. 2011. Modul Pembelajaran Rekayasa Perangkat

Lunak (Terstruktur Dan Berorientasi Objek). Bandung: Modula.

Gata, Windu dan Grace Gata. 2013. Sukses Membangun Aplikasi Penjualan

dengan Java. Jakarta: PT. Elex Media Komputindo