Xử lý mẫu in báo cáo với Jasper report trong Laravel

Mẫu biểu in ấn trong hệ thống website là không thể thiếu ví dụ như bạn cần in hóa đơn, phiếu bán hàng, thông tin khách hàng… Jasper report là một công cụ báo cáo mã nguồn mở viết trên ngôn ngữ Java, các báo cáo có thể sử dụng cho mục đích hiển thị, in ấn hoặc tạo ra các định dạng để truyền tải trên mạng như PDF, Microsoft Excel, HTML… Có thể bạn đã từng làm việc với hệ thống báo cáo như Crystal reports của SAP, nó cho phép tích hợp dễ dàng với .NET và cung cấp cực nhiều các tính năng tạo ra các báo cáo phức tạp, Jasper report tuy không thể sánh bằng Crystal report nhưng cũng đủ cho bạn sử dụng các mục đích báo cáo.

1. Hướng dẫn cơ bản về Jasper report

Hoạt động cơ bản của một hệ thống báo cáo như sau:

  1. Thực hiện truy vấn nguồn dữ liệu từ một database.
  2. Đưa dữ liệu vào mẫu báo cáo, trong quá trình này dữ liệu có thể được sàng lọc, tính toán và hiển thị trong các định dạng khác nhau.
  3. Bản báo cáo hiển thị cho người dùng có thể được in ấn hoặc trích xuất thành các định dạng mong muốn.

1.1 Cài đặt Jaspersoft Studio

Jasper report được viết trên nền tảng Java, do vậy trước hết bạn cần cài đặt môi trường Java. Để kiểm tra xem hệ điều hành của bạn đã được cài đặt java chưa, mở màn hình dòng lệnh và thực hiện lệnh java -version:

D:\Laragon\www\allaravel
λ java -version
java version "1.8.0_151"
Java(TM) SE Runtime Environment (build 1.8.0_151-b12)
Java HotSpot(TM) 64-Bit Server VM (build 25.151-b12, mixed mode)

Nếu thấy thông báo command not found: java tức là máy bạn chưa cài đặt Java. Bạn tải về Java tương ứng với HĐH đang sử dụng, việc cài đặt tương đối đơn giản và nhanh chóng.

Tiếp theo thực hiện cài đặt Jaspersoft Studio, nếu bạn đã làm quen với Jasper report thì có thể biết là từ phiên bản 5.5 về trước chúng ta sử dụng iReport Designer để thiết kế các báo cáo. Từ phiên bản 5.5 trở đi công cụ thiết kế báo cáo có nhiều cải tiến mới và được đặt tên là Jaspersoft Studio. Bạn có thể vào đây để tải Jaspersoft Studio. Sau khi cài đặt xong, chúng ta có một giao diện của Jaspersoft Studio như hình sau:

Màn hình chính Jaspersoft Studio

1.2 Tạo báo cáo đầu tiên

Bước 1: Chọn File -> New -> Jasper Report.

Jaspersoft Studio đã được thiết kế với một số các mẫu báo cáo có sẵn, nhưng chúng ta ít khi sử dụng chúng do các mẫu báo cáo thường bắt đầu từ khách hàng.

Tạo báo cáo từ mẫu cho trước

Click next để sang bước tiếp theo.

Tạo file Jasper report mới

Trong màn hình này chúng ta sẽ đặt tên cho file report và nơi lưu trữ file này. Bài viết này hướng dẫn bạn thực hiện trong môi trường Windows, do đó thư mục mặc định mà file báo cáo sẽ lưu trữ là C:\Users\User_Name\JaspersoftWorkspace\MyReports. Nhấn Next để chuyển sang bước tiếp theo.

Chọn nguồn dữ liệu cho báo cáo

Trong bước này chúng ta sẽ thiết lập nguồn dữ liệu cho báo cáo, chính là đưa các cấu hình vào giúp Jasper report biết được sẽ lấy dữ liệu từ database nào, bảng nào, cột nào… Khi mới cài đặt Jaspersoft Studio sẽ chưa có một data adapter nào được tạo ra. Chúng ta nhấn vào nút New để tạo mới một Data Adapter.

Tạo data adapter để kết nối đến database

Trong cửa sổ này chúng ta sẽ thấy có thể tạo ra các Data Adapter cho các loại nguồn dữ liệu khác nhau như kết nối được đến các dạng file CSV, định dạng JSON, XML hoặc các hệ cơ sở dữ liệu khác nhau thông qua JDBC (Java Database Connectivity). JDBC là một thư viện của Java cho phép kết nối đến nhiều các hệ cơ sở dữ liệu khác nhau như SQL server, MySQL, Oracle, DB2… Chúng ta sẽ sử dụng JDBC để kết nối đến hệ cơ sở dữ liệu MySQL.

Cài đặt thông số kết nối đến MySQL

Các thông số cần chú ý:

  • JDBC Driver: mỗi hệ CSDL sẽ có nhiều driver của các hãng thứ ba khác nhau, driver này có thể do các hãng khác nhau viết hoặc có thể khác nhau với các phiên bản CSDL. Với MySQL có hai driver và thường chọn com.mysql.jdbc.Driver là driver gốc do chính MySQL cung cấp.
    JDBC URL: là đường dẫn đến database theo cú pháp của giao thức jdbc. Ở đây jdbc:mysql://localhost/allaravel có ý nghĩa là kết nối đến CSDL trên máy cục bộ và kết nối cụ thể đến database là allaravel. Nếu máy chủ CSDL (database server) của bạn là máy khác thì thay localhost bằng địa chỉ IP hoặc tên miền trỏ đến máy chủ CSDL.
  • Username và password: là tài khoản để truy cập máy chủ CSDL.

Trong bước tiếp theo chúng ta sẽ chọn đến file chứa driver bằng cách nhấn vào tab Driver Classpath.

Thiết lập driver classpath

Driver Classpath chính là các gói Java được lập trình để kết nối đến database. Với MySQL bạn có thể tải về driver tại đây, sau đó giải nén và trỏ đến file mysql-connector-java-x.y.zz-bin.jar là file thực thi được của Java. Ok như vậy chúng ta đã thiết lập xong Data Adapter, để kiểm tra xem kết nối đến CSDL thông qua data adapter này đã ổn chưa nhấn vào nút Test nếu có thông báo Successful nghĩa là kết nối thành công.

Thông báo kết nối thành công đến CSDL

Nhấn vào Finish để kết thúc việc thiết lập Data Adapter, khi đó nó sẽ ra cửa sổ mới hiển thị nguồn dữ liệu cho báo cáo. Ví dụ chúng ta làm một báo cáo hiển thị danh sách người dùng trong hệ thống, chúng ta sẽ tạo câu truy vấn “SELECT * FROM users”.

Thiết lập nguồn dữ liệu

Tiếp theo chúng ta nhấn Next để đưa các trường trong bảng users vào báo cáo. Ở đây chúng ta sẽ hiển thị một danh sách người dùng với thông tin về ID, tên, địa chỉ email và ngày tạo ra người dùng này.

Thông tin hiển thị trong report

Nhấn Next chúng ta sẽ chuyển sang bước thao tác với dữ liệu, ví dụ bạn muốn sàng lọc, tính toán, group, tính tổng… Trong ví dụ này chúng ta chỉ hiển thị danh sách mà không thao tác gì với dữ liệu nên nhấn Next tiếp theo. Thông báo tạo xong nguồn dữ liệu thành công và nhấn Finish để thực hiện tạo ra file báo cáo.

Hoàn thành thiết lập nguồn dữ liệu

1.3 Hiển thị thông tin trên report

Trong phần 1.2 chúng ta đã thực hiện xong việc thiết lập nguồn dữ liệu, trong phần này chúng ta sẽ hiển thị nguồn dữ liệu lên báo cáo. Giao diện Jaspersoft Studio chia làm 5 vùng chính như hình dưới.

Màn hình thiết kế report

Vùng 1 là nơi chúng ta thiết kế báo cáo, nó giống như vùng chính của tài liệu Microsoft Word để chúng ta có thể đưa text, hình ảnh, bảng biểu vào báo cáo. Vùng 1 được chia thành các khu vực khác nhau:

  • Title: Phần mở đầu của báo cáo.
  • Page Header: là phần header của mỗi trang
  • Column Header: là nơi chúng ta để phần tiêu đề của bảng biểu.
  • Detail: chỗ chứa các dòng dữ liệu của bảng biểu
  • Column Footer: là phần cuối của bảng biểu.
  • Page Footer: phần Footer của trang
  • Summary: Phần kết thúc của báo cáo.

Vùng số 2 là nơi thiết lập các data adapter để kết nối đến các nguồn dữ liệu, một báo cáo có thể lấy dữ liệu từ nhiều nguồn khác nhau.

Vùng số 3 chứa dữ liệu đầu vào bao gồm các field lấy từ từ nguồn dữ liệu, các tham số parameter đầu vào cho báo cáo, các hàm chức năng để thao tác với dữ liệu và còn có thể chứa các đoạn mã java để thao tác dữ liệu.

Vùng số 4 chính là các thành phần của báo cáo như các đoạn text, các hình ảnh… nơi chứa dữ liệu đã được thao tác ở vùng 3.

Vùng số 5 là một số các thành phần tĩnh chứa thông tin môi trường như ngày tháng, số trang của báo cáo…

Kéo thả các thành phần hiển thị vào report

Như vậy chúng ta đã nắm được các thành phần của giao diện Jaspersoft Studio, tiếp theo chúng ta sẽ đưa thông tin vào hiển thị trong báo cáo. Trong vùng số 3 phần Fields chính là danh sách các trường chúng ta muốn hiển thị trong Danh sách người dùng, thực hiện kéo và thả từng trường này vào khu vực detail trong vùng 1, khi đó nó sẽ tự động sinh ra các tiêu đề trong khu vực Column Header. Tiếp theo kéo Static Text từ vùng 4 vào khu vực Title trong vùng 1 và thay đổi text thành Danh sách người dùng. Chú ý text trong báo cáo có thể chọn loại font, kích thước, căn lề… như trong Microsoft Word. Bạn cũng có thể thay đổi các tiêu đề của field mặc định thành tiếng Việt nhìn cho thân thiện. Ok, như vậy là tạm ổn chúng ta xem report này hoạt động thế nào.

Vùng 1 có 3 chế độ hoạt động là Design, Source và Preview

  • Chế độ Design dùng để thiết kế, thêm các thành phần, style chúng…
  • Chế độ Source: bản chất file Jasper report này là một file định dạng xml chứa các thông tin từ thiết lập nguồn dữ liệu, sắp xếp các thành phần hiển thị…
  • Chế độ Preview: xem dữ liệu trong báo cáo được hiển thị.

Như vậy, sau khi thiết kế xong muốn xem báo cáo hiển thị bạn bấm vào mục Preview ngay dưới vùng 1.

Kết quả hiển thị báo cáo

Trông không được đẹp lắm nhưng không sao, chúng ta sẽ dần dần biết cách chỉnh sửa chúng ra những mẫu in đẹp. Chúng ta quay lại chế độ Design để làm cho báo cáo đẹp hơn (trước khi quay lại bạn cũng nên xem qua chế độ Source để hiểu hơn về cách thức hoạt động của Jasper report).

Sở dĩ các dòng thông tin người dùng trong danh sách cách nhau khá xa do chiều cao vùng Detail 1 là khá cao, chiều cao này chính là chiều cao của từng dòng dữ liệu, đưa con chuột vào dòng kẻ đáy khu vực Detail 1 và kéo cho chiều cao ngắn lại. Tiếp theo chúng ta thực hiện đưa vào các đoạn thẳng từ vùng 4 vào để bảng danh sách trông đẹp hơn.

Chỉnh sửa report

Cập nhật 21/11/2017: Bạn có thể sử dụng chế độ border như trong excel để kẻ bảng.

Sử dụng border trong thiết kế bảng

Xem thành quả xem thế nào.

Kết quả report

Ok, như vậy đã tạm ổn, danh sách người dùng đã được liệt kê trong bảng khá đẹp. Việc trình bày một báo cáo là rất tỉ mẩn đòi hỏi sự kiên trì và khéo léo nhưng cũng may mỗi báo cáo chúng ta chỉ cần thực hiện một lần duy nhất và cứ thế là dùng. Tôi chắc hẳn bạn đã hiểu được cơ bản về Jasper report, tuy nhiên trên đây mới chỉ là những phần rất nhỏ, Jasper report còn làm được nhiều hơn nữa, các bạn có thể tham khảo các tài liệu hoặc video trên trang jaspersoft nhé.

File source jasper report sẽ có phần đuôi mở rộng là jrxml, đây chính là file có nội dung XML chứa các thiết lập cho báo cáo. Các báo cáo jasper report muốn chạy được phải trải qua bước Build, để thực hiên chọn menu Project -> Build All (hoặc phím tắt Ctrl + B) khi đó sẽ xuất hiện thêm file có phần mở rộng là .jasper là file có thể chạy được báo cáo.

Về cơ bản báo cáo như vậy là xong, tuy nhiên với các hệ thống website thì cần thiết phải tích hợp được báo cáo này vào web. Ví dụ, sau khi thực hiện nhập một đơn hàng, chúng ta sẽ đến bước in phiếu xuất hàng. Phần tiếp theo sẽ tích hợp jasper report vào website thông qua gói JasperPHP.

2. Tích hợp Jasper report vào ứng dụng Laravel thông qua gói thư viện JasperPHP

2.1 Cài đặt môi trường Laravel và gói JasperPHP

Đầu tiên, thực hiện cài đặt môi trường Laravel bằng Laragon (Tham khảo bài viết, cài đặt nhanh Laravel với Laragon).

Sau đó cài đặt gói JasperPHP bằng composer. Thực hiện lệnh:

composer require cossou/jasperphp

Đăng ký JasperPHP service vào service provider trong file config\app.php:

'providers' => [
    ...
    JasperPHP\JasperPHPServiceProvider::class,
    ...
],

Tiếp đến tạo thư mục public\report để chứa các file Jasper report đã được thiết kế trong phần 1, có thể copy file .jrxml hoặc file .jasper. Tuy nhiên nên chọn file đã được Build thì tốc độ xuất báo cáo sẽ nhanh hơn do chọn file jrxml thì vẫn phải trải qua bước Build báo cáo.

2.2 Tạo route, controller, view trong ứng dụng Laravel

Thêm route vào routes\web.php:

Route::get('/reporting', function(){
    $database = \Config::get('database.connections.mysql');
    $file_name = time();
    $output = public_path() . '/report/output/' . $file_name;
    $ext = "pdf";

    \JasperPHP::process(
        public_path() . '/report/Danh_sach_nguoi_dung.jasper', 
        $output, 
        array($ext),
        array(),
        $database,
        false,
        false
    )->execute();
    return Redirect::to(Asset('report/output/' . $file_name . '.' . $ext));
});

Chúng ta cùng tìm hiểu về JasperPHP, class này có 3 phương thức cần quan tâm:

  • Phương thức compile: sử dụng để biên dịch từ file source .jrxml sang .jasper.
  • Phương thức process: xử lý báo cáo và xuất ra định dạng yêu cầu, có thể là pdf, doc, xls, rtf…
  • Phương thức list_parameters lấy các tham số trong file jasper report để kiểm tra.
$output = JasperPHP::list_parameters(
		base_path() . '/vendor/cossou/jasperphp/examples/hello_world.jasper'
	)->execute();

foreach($output as $parameter_description)
	echo $parameter_description;

Trong route ở trên chúng ta sử dụng process() để xử lý báo cáo và xuất ra báo cáo dạng file PDF. OK, kiểm tra xem thế nào, chạy thử link http://allaravel.dev/reporting.

Xuất file report sang định dạng PDF

Như vậy chúng ta đã hoàn thành việc trích xuất file pdf và từ đây hoàn toàn có thể in ấn cũng như lưu trữ, truyền tải qua mạng.

2.3 Kiểm tra lỗi khi sử dụng JasperPHP

Nếu bạn đọc qua mã nguồn JasperPHP sẽ thấy bản chất là thư viện này sẽ tạo ra một câu lệnh và được thực hiện thông qua lệnh exec() trong PHP. Chính vì lý do đó, chức năng exec() trên PHP cần được bật khi sử dụng gói JasperPHP. Trong quá trình sử dụng gói này, có thể phát sinh các exception, tuy nhiên thông báo sẽ không cụ thể mà khi thực hiện debug chúng ta nên in ra thành câu lệnh và thực hiện trực tiếp trong môi trường dòng lệnh.

Route::get('/reporting', function(){
    $database = \Config::get('database.connections.mysql');
    $file_name = time();
    $output = public_path() . '/report/output/' . $file_name;
    $ext = "pdf";

    $command = \JasperPHP::process(
        public_path() . '/report/Danh_sach_nguoi_dung.jasper', 
        $output, 
        array($ext),
        array(),
        $database,
        false,
        false
    )->output();
    dd($command);
    return Redirect::to(Asset('report/output/' . $file_name . '.' . $ext));
});

Khi thực hiện chạy chúng ta sẽ thấy được câu lệnh thực tế được chạy ở môi trường dòng lệnh:

Câu lệnh jasperstart

Thay ^^^\ thành \ chúng ta có câu lệnh như sau:

D:\Laragon\www\allaravel\vendor\cossou\jasperphp\src\JasperPHP/../JasperStarter/bin/jasperstarter process D:\Laragon\www\allaravel\public/report/Danh_sach_nguoi_dung.jasper -o D:\Laragon\www\allaravel\public/report/output/1510901725 -f pdf -r D:\Laragon\www\allaravel\vendor\cossou\jasperphp\src\JasperPHP/../../../../../ -t mysql -u root -H 127.0.0.1 -n allaravel --db-port 3306
  1. cd (change directory) chuyển đến thư mục vendor\cossou\jasperphp\src\JasperPHP là thư mục chứa mã nguồn gói JasperPHP
  2. Thực hiện chạy file ../JasperStarter/bin/jasperstarter với các tham số như sau:
    1. Tùy chọn thực hiện báo cáo compile hoặc process
    2. Đường dẫn file report: D:\Laragon\www\allaravel\public/report/Danh_sach_nguoi_dung.jasper
    3. Thư mục output với định dạng file
    4. Thông số kết nối database

Sau khi thực hiện câu lệnh này, kết quả là file pdf được xuất ra trong thư mục public\report\output.

3. Lời kết

Jasper report là giải pháp tốt cho xây dựng các báo cáo, các mẫu biểu in ấn như hóa đơn, phiếu thu chi… khi được tích hợp vào các website trên nền tảng Laravel giúp cho ứng dụng web trở nên linh hoạt và hữu dụng. Việc thực hiện in thông qua file PDF có độ chính xác cao và kiểm soát hoàn toàn nội dung cũng như kích thước các biểu mẫu. Ngoài jasper report còn rất nhiều các giải pháp khác như Crystal report, Microsoft Report… hoặc các giải pháp dựa trên HTML chạy cũng rất linh hoạt và nhẹ nhàng. Một nhược điểm của sử dụng các giải pháp báo cáo như Jasper Report là việc tạo các file mẫu báo cáo phụ thuộc vào các công cụ như iReport Designer hay Jaspersoft Studio, nếu bạn muốn người dùng có thể tạo chúng trực tuyến trên web là rất khó khăn. Chúng ta sẽ còn quay lại vấn đề này trong thời gian tới, hẹn gặp lại.

4 thoughts on “Xử lý mẫu in báo cáo với Jasper report trong Laravel

  1. Trương Chí Nhân

    - Edit

    Reply

    Chào bạn. Đọc qua. chưa làm thử. nhưng với phần hỗ trợ này. Rất hữu ích cho người lập trình ko chuyên về in trên web.
    Cám ơn bạn rất nhiều. Bài viết thật sự hữu ích. Mình sẽ bookmark trang bạn lại để từ từ tham khảo.

  2. Sử dụng report bằng giải pháp Jasper Report rất ok, trước đây mình đã triển khai hệ thống in ấn chứng từ cho một ngân hàng đáp ứng được mẫu in động, phức tạp. Bài viết này áp dụng cho các hệ thống in ấn như bank, các doanh nghiệp cần giấy tờ vào ra nhiều, áp dụng cho các giải pháp quản lý chứng từ… Mong ad có thời gian giới thiệu thêm giải pháp BI (business intelligent) nữa thì quá tuyệt. Cám ơn nhiều.

  3. Bạn phải cung cấp thêm thông tin chứ lỗi thế này chung chung quá. Theo mình phỏng đoán khả năng cao là máy chủ bạn triển khai phần in ấn này có thể thiếu font. Khi đó lúc render PDF nó không tìm thấy font và đưa ra bản hiển thị bị lỗi.

Trả lời Trương Chí Nhân Hủy