Untitled

<%--
    Document   : sanphamdanhmuc
    Created on : Jan 15, 2019, 7:29:02 AM
    Author     : JunBu
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@page language="java"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
    <jsp:include page="../header.jsp"/>
    <body>
        <h1>Report</h1>
        <c:if test="${listReportItem.size() > 0}">
            <table border="1">
                <thead>
                    <th>Danh Mục</th>
                    <th>Số Lượng</th>
                    <th>Tổng Giá Trị</th>
                    <th>Giá Cao Nhất</th>
                    <th>Giá Thấp Nhất</th>
                    <th>Trung Bình</th>
                </thead>
                <tbody>
                    <c:forEach var="row" items="${listReportItem}">
                        <tr>
                            <td><c:out value="${row.group}"/></td>
                            <td><c:out value="${row.count}"/></td>
                            <td><c:out value="${row.sum}"/></td>
                            <td><c:out value="${row.min}"/></td>
                            <td><c:out value="${row.max}"/></td>
                            <td><c:out value="${row.avg}"/></td>
                        </tr>
                    </c:forEach>
                </tbody>
            </table>
            <hr/>
            <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
            <script type="text/javascript">
                google.charts.load('current', {'packages':['corechart']});
                google.charts.setOnLoadCallback(drawChart);
                function drawChart() {
                    var  data = google.visualization.arrayToDataTable([
                        ['Danh mục', 'Số lượng'],
                        <c:forEach var="row" items="${listReportItem}">
                                    ['${row.group}',${row.count}],
                        </c:forEach>
                    ]);

                    var options = {
                        'title':'Thống Kê Thông Tin Hàng Hóa',
                        'width':550,
                        'height':400
                    }

                    var chart = new google.visualization.PieChart(document.getElementById('piechart_3d'));
                    chart.draw(data, options);
                }
            </script>
            <div id="piechart_3d" style="width: 700px; height: 500px"></div>
        </c:if>

    </body>
</html>