仅供科普该篇
<%@ page import="pojo.User" %>
<%@ page import="dao.UserDao" %>
<%@ page import="dao.JDBCUtils.Page" %>
<%@ page import="dao.JDBCUtils" %>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" isELIgnored="false" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1"><title>User List</title><style>* {margin: 0;padding: 0;box-sizing: border-box;}body {font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;line-height: 1.5;color: #333;background-color: #f5f5f5;}.container {max-width: 1200px;margin: 20px auto;padding: 0 15px;}.card {background: white;border-radius: 8px;box-shadow: 0 2px 4px rgba(0,0,0,0.1);margin-bottom: 20px;}.card-header {padding: 15px 20px;background: #1a73e8;color: white;border-radius: 8px 8px 0 0;display: flex;justify-content: space-between;align-items: center;}.card-title {font-size: 1.25rem;font-weight: 500;margin: 0;}.badge {background: white;color: #1a73e8;padding: 4px 8px;border-radius: 4px;font-size: 0.875rem;}.card-body {padding: 20px;}.search-form {background: #f8f9fa;padding: 20px;border-radius: 8px;margin-bottom: 20px;}.form-group {display: flex;flex-wrap: wrap;gap: 15px;margin-bottom: 15px;}.input-group {flex: 1;min-width: 200px;}input[type="text"],input[type="number"] {width: 100%;padding: 8px 12px;border: 1px solid #ddd;border-radius: 4px;outline: none;transition: border-color 0.2s;}input[type="text"]:focus,input[type="number"]:focus {border-color: #1a73e8;}.btn {background: #1a73e8;color: white;padding: 8px 16px;border: none;border-radius: 4px;cursor: pointer;transition: background-color 0.2s;}.btn:hover {background: #1557b0;}.table-container {overflow-x: auto;}table {width: 100%;border-collapse: collapse;margin-bottom: 1rem;background: white;}th, td {padding: 12px 15px;text-align: left;border-bottom: 1px solid #ddd;}th {background: #f8f9fa;font-weight: 500;}tr:hover {background: #f8f9fa;}.action-btn {padding: 4px 8px;margin: 0 4px;background: none;border: 1px solid;border-radius: 4px;cursor: pointer;font-size: 14px;}.edit-btn {color: #1a73e8;border-color: #1a73e8;}.delete-btn {color: #dc3545;border-color: #dc3545;}.pagination {display: flex;justify-content: center;align-items: center;gap: 5px;margin-top: 20px;}.page-link {padding: 8px 12px;border: 1px solid #ddd;color: #1a73e8;text-decoration: none;border-radius: 4px;}.page-link:hover {background: #f8f9fa;}.page-item.active .page-link {background: #1a73e8;color: white;border-color: #1a73e8;}.page-item.disabled .page-link {color: #6c757d;pointer-events: none;background: #f8f9fa;}.page-info {text-align: center;color: #666;margin-top: 10px;}</style>
</head>
<body>
<%// 获取搜索参数String username = request.getParameter("username");String email = request.getParameter("email");// 获取年龄范围参数String startAgeStr = request.getParameter("startAge");String endAgeStr = request.getParameter("endAge");Integer startAge = null;Integer endAge = null;if(startAgeStr != null && !startAgeStr.trim().isEmpty()) {try {startAge = Integer.parseInt(startAgeStr);} catch(NumberFormatException e) {}}if(endAgeStr != null && !endAgeStr.trim().isEmpty()) {try {endAge = Integer.parseInt(endAgeStr);} catch(NumberFormatException e) {}}// 获取分页参数String pageNumStr = request.getParameter("pageNum");String pageSizeStr = request.getParameter("pageSize");int pageNum = 1;int pageSize = 10;if(pageNumStr != null && !pageNumStr.trim().isEmpty()) {try {pageNum = Integer.parseInt(pageNumStr);if(pageNum < 1) pageNum = 1;} catch(NumberFormatException e) {pageNum = 1;}}if(pageSizeStr != null && !pageSizeStr.trim().isEmpty()) {try {pageSize = Integer.parseInt(pageSizeStr);if(pageSize < 1) pageSize = 10;} catch(NumberFormatException e) {pageSize = 10;}}JDBCUtils.Page<User> page6 = UserDao.instance.pageQuery(pageNum, pageSize, username, email, startAge, endAge);request.setAttribute("page", page6);request.setAttribute("username", username);request.setAttribute("email", email);request.setAttribute("startAge", startAge);request.setAttribute("endAge", endAge);
%><div class="container"><div class="card"><div class="card-header"><h2 class="card-title">User Management</h2><span class="badge">Total: ${page.total} records</span></div><div class="card-body"><div class="search-form"><form action="" method="GET"><div class="form-group"><div class="input-group"><input type="text" name="username" value="${username}" placeholder="Username"></div><div class="input-group"><input type="text" name="email" value="${email}" placeholder="Email"></div><div class="input-group"><input type="number" name="startAge" value="${startAge}" placeholder="Min Age"></div><div class="input-group"><input type="number" name="endAge" value="${endAge}" placeholder="Max Age"></div><input type="hidden" name="pageNum" value="1"><input type="hidden" name="pageSize" value="${page.pageSize}"><button type="submit" class="btn">Search</button></div></form></div><div class="table-container"><table><thead><tr><th>ID</th><th>Username</th><th>Email</th><th>Age</th><th>Actions</th></tr></thead><tbody><c:forEach items="${page.list}" var="user"><tr><td>${user.id}</td><td>${user.username}</td><td>${user.email}</td><td>${user.age}</td><td><button class="action-btn edit-btn">Edit</button><button class="action-btn delete-btn">Delete</button></td></tr></c:forEach></tbody></table></div><div class="pagination"><c:if test="${page.pageNum > 1}"><a class="page-link" href="?pageNum=${page.pageNum - 1}&pageSize=${page.pageSize}&username=${username}&email=${email}&startAge=${startAge}&endAge=${endAge}">Previous</a></c:if><c:if test="${page.pageNum <= 1}"><span class="page-link disabled">Previous</span></c:if><c:forEach begin="1" end="${page.pages}" var="i"><c:choose><c:when test="${i == page.pageNum}"><span class="page-link active">${i}</span></c:when><c:otherwise><a class="page-link" href="?pageNum=${i}&pageSize=${page.pageSize}&username=${username}&email=${email}&startAge=${startAge}&endAge=${endAge}">${i}</a></c:otherwise></c:choose></c:forEach><c:if test="${page.pageNum < page.pages}"><a class="page-link" href="?pageNum=${page.pageNum + 1}&pageSize=${page.pageSize}&username=${username}&email=${email}&startAge=${startAge}&endAge=${endAge}">Next</a></c:if><c:if test="${page.pageNum >= page.pages}"><span class="page-link disabled">Next</span></c:if></div><div class="page-info">Showing page ${page.pageNum} of ${page.pages}</div></div></div>
</div></body>
</html>
