Skip to content
This repository has been archived by the owner on May 31, 2024. It is now read-only.

Commit

Permalink
Merge pull request #136 from hardingadonis/chuong-paging-product-page
Browse files Browse the repository at this point in the history
Chuong paging for product page (Completed)
  • Loading branch information
hardingadonis authored Mar 3, 2024
2 parents f2b4207 + a7eadb6 commit b4f2104
Show file tree
Hide file tree
Showing 2 changed files with 84 additions and 49 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -10,17 +10,34 @@

@WebServlet(name = "ProductServlet", urlPatterns = {"/product"})
public class ProductServlet extends HttpServlet {
final static int LIMIT = 10;

@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
request.setCharacterEncoding("UTF-8");
response.setContentType("text/html; charset=UTF-8");

List<Product> products = Singleton.productDAO.getAll();
Integer productCount = Singleton.productDAO.count();
request.setAttribute("productCount", productCount);
request.setAttribute("products", products);
int page = 1;
if (request.getParameter("page") != null) {
try {
page = Integer.parseInt(request.getParameter("page"));
} catch (Exception e) {
response.sendRedirect("./error-404");
return;
}
}

List<Product> list = Singleton.productDAO.pagination((page - 1) * LIMIT, LIMIT);
Integer count = Singleton.productDAO.count();
int totalPage = Singleton.productDAO.totalPages(LIMIT);

request.setAttribute("productList", list);
request.setAttribute("currentPage", page);
request.setAttribute("totalPage", totalPage);
request.setAttribute("numOfPro", count);
request.setAttribute("limit", LIMIT);

request.setAttribute("page", "product");

request.getRequestDispatcher("/view/jsp/management/product/product.jsp").forward(request, response);
Expand Down
108 changes: 63 additions & 45 deletions src/main/webapp/view/jsp/management/product/product.jsp
Original file line number Diff line number Diff line change
Expand Up @@ -28,66 +28,84 @@
<p class="text-primary m-0 fw-bold">Quản lý sản phẩm</p>
<a href="<%=request.getContextPath()%>/add-product" class="btn btn-primary btn-sm">Thêm sản phẩm</a>
</div>
<div class="card-body">
<div class="table-responsive table mt-2" id="dataTable" role="grid" aria-describedby="dataTable_info">
<table class="table my-0" id="dataTable">
<thead>
<tr>
<th>Mã sản phẩm</th>
<th>Tên sản phẩm</th>
<th>Phân loại</th>
<th>Thao tác</th>
</tr>
</thead>
<c:forEach items="${requestScope.products}" var="product">
<tbody>
<c:if test="${!requestScope.productList.isEmpty()}">
<div class="card-body">
<div class="table-responsive table mt-2" id="dataTable" role="grid" aria-describedby="dataTable_info">
<table class="table my-0" id="dataTable">
<thead>
<tr>
<td>${product.code}</td>
<td>${product.name}</td>
<td>${product.category.name}</td>
<td class="text-start">
<a class="btn btn-primary btn-sm" role="button" data-bs-toggle="tooltip" data-bss-tooltip="" style="margin: 2px;" title="Thông tin chi tiết" href="<%=request.getContextPath()%>/product-detail?id=${product.ID}">
<i class="la la-info-circle"></i>
</a>
<a class="btn btn-warning btn-sm" data-bs-toggle="tooltip" data-bss-tooltip="" style="margin: 2px;" title="Chỉnh sửa" href="<%=request.getContextPath()%>/update-product?id=${product.ID}" >
<i class="la la-edit"></i>
</a>
</td>
<th width="20%">Mã sản phẩm</th>
<th width="40%">Tên sản phẩm</th>
<th width="30%">Phân loại</th>
<th width="10%">Thao tác</th>
</tr>
</tbody>
</c:forEach>
</table>
</div>
<div class="row">
<div class="col-md-6 align-self-center">
<p id="dataTable_info" class="dataTables_info" role="status" aria-live="polite">Hiển thị ${requestScope.productCount} trên ${requestScope.productCount} sản phẩm</p>
</thead>
<c:forEach items="${requestScope.productList}" var="product">
<tbody>
<tr>
<td>${product.code}</td>
<td>${product.name}</td>
<td>${product.category.name}</td>
<td class="text-start">
<a class="btn btn-primary btn-sm" role="button" data-bs-toggle="tooltip" data-bss-tooltip="" style="margin: 2px;" title="Thông tin chi tiết" href="<%=request.getContextPath()%>/product-detail?id=${product.ID}">
<i class="la la-info-circle"></i>
</a>
<a class="btn btn-warning btn-sm" data-bs-toggle="tooltip" data-bss-tooltip="" style="margin: 2px;" title="Chỉnh sửa" href="<%=request.getContextPath()%>/update-product?id=${product.ID}" >
<i class="la la-edit"></i>
</a>
</td>
</tr>
</tbody>
</c:forEach>
</table>
</div>
<div class="col-md-6">
<nav class="d-lg-flex justify-content-lg-end dataTables_paginate paging_simple_numbers">
<ul class="pagination">
<li class="page-item disabled"><a class="page-link" aria-label="Previous" href="#"><span aria-hidden="true">«</span></a></li>
<li class="page-item active"><a class="page-link" href="#">1</a></li>
<li class="page-item"><a class="page-link" href="#">2</a></li>
<li class="page-item"><a class="page-link" href="#">3</a></li>
<li class="page-item"><a class="page-link" aria-label="Next" href="#"><span aria-hidden="true">»</span></a></li>
</ul>
</nav>
<div class="row">
<div class="col-md-6 align-self-center">
<p id="dataTable_info" class="dataTables_info" role="status" aria-live="polite">
Hiển thị ${requestScope.currentPage * requestScope.limit < requestScope.numOfPro ? requestScope.currentPage * requestScope.limit : requestScope.numOfPro}
trên ${requestScope.numOfPro} sản phẩm
</p>
</div>
<div class="col-md-6">
<nav class="d-lg-flex justify-content-lg-end dataTables_paginate paging_simple_numbers">
<ul class="pagination">
<li class="page-item ${requestScope.currentPage == 1 ? 'disabled' : ''}">
<a class="page-link" aria-label="Previous" href="<%=request.getContextPath()%>/product?page=${requestScope.currentPage - 1}"><span aria-hidden="true">«</span></a>
</li>
<c:forEach var="i" begin="1" end="${requestScope.totalPage}">
<li class="page-item ${i == requestScope.currentPage ? 'active' : ''}">
<a class="page-link" href="<%=request.getContextPath()%>/product?page=${i}">${i}</a>
</li>
</c:forEach>
<li class="page-item ${requestScope.currentPage == requestScope.totalPage ? 'disabled' : ''}">
<a class="page-link" aria-label="Next" href="<%=request.getContextPath()%>/product?page=${requestScope.currentPage + 1}"><span aria-hidden="true">»</span></a>
</li>
</ul>
</nav>
</div>
</div>
</div>
</div>
</c:if>
<c:if test="${requestScope.productList.isEmpty()}">
<div class="card-body">
<div class="row">
<h3 style="text-align: center;">Không có sản phẩm nào để quản lí.</h3>
</div>
</div>
</c:if>
</div>
</div>
</div>

<%@include file="../../../common/_footer.jsp" %>
</div>

<%@include file="../../../common/_goback.jsp" %>
</div>

<script src="<%=request.getContextPath()%>/view/assets/js/bootstrap.min.js"></script>
<script src="<%=request.getContextPath()%>/view/assets/js/bs-init.js"></script>
<script src="<%=request.getContextPath()%>/view/assets/js/theme.js"></script>
</body>

</html>

0 comments on commit b4f2104

Please sign in to comment.