pscmholb5
/
library_manage_system
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/develop' into develop

Browse Source 
# Conflicts:
#	src/servlet/admin/AdminLogin.java
develop
zw-j2003 6 months ago
parent f26839a1d5 cd7c4d19e8
commit b5a65b3e05
81 changed files with 5611 additions and 5510 deletions
Show Stats Download Patch File Download Diff File

104
WebContent/admin/bookadd.jsp
Unescape View File

@ -1,11 +1,11 @@
<%@page import="java.sql.ResultSet"%> <!-- 导入ResultSet类 --> <%@page import="java.sql.ResultSet"%> <!-- 导入Java SQL包中的ResultSet类 -->
<%@page import="javabean.JDBCBean"%> <!-- 导入JDBCBean类 --> <%@page import="javabean.JDBCBean"%> <!-- 导入自定义的JDBCBean类 -->
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> <!-- 设置页面语言为Java，内容类型和字符编码 --> pageEncoding="UTF-8"%> <!-- 设置页面语言为Java，内容类型和字符编码为UTF-8 -->
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <!-- 设置字符编码 --> <meta charset="UTF-8"> <!-- 设置HTML文档的字符编码为UTF-8 -->
<title>bookadd</title> <!-- 设置网页标题 --> <title>bookadd</title> <!-- 设置网页标题 -->
<!-- layui --> <!-- layui -->
<link rel="stylesheet" href="../public/layui/css/layui.css"> <!-- 引入layui样式表 --> <link rel="stylesheet" href="../public/layui/css/layui.css"> <!-- 引入layui样式表 -->
@ -19,39 +19,39 @@
</head> </head>
<body> <body>
<% <%
ResultSet librarySet = null; // 声明图书馆结果集变量 ResultSet librarySet = null; //声明一个ResultSet对象用于存储图书馆数据
ResultSet bookSortSet = null; // 声明书籍分类结果集变量 ResultSet bookSortSet = null; // 声明一个ResultSet对象用于存储书籍分类数据
// 获取图书馆列表 // 获取图书馆列表
JDBCBean db2 = new JDBCBean(); // 创建JDBCBean对象 JDBCBean db2 = new JDBCBean(); // 创建JDBCBean对象db2
String librarySql = "select * from library"; // SQL查询语句 String librarySql = "select * from library"; // SQL查询语句，选择所有图书馆记录
librarySet = db2.executeQuery( librarySql ); // 执行查询并赋值给librarySet librarySet = db2.executeQuery( librarySql ); // 执行SQL查询并将结果存储在librarySet中
// 获取书籍分类 // 获取书籍分类
JDBCBean db3 = new JDBCBean(); // 创建另一个JDBCBean对象 JDBCBean db3 = new JDBCBean(); // 创建JDBCBean对象db3
String bookSortSql = "select * from book_sort"; // SQL查询语句 String bookSortSql = "select * from book_sort"; // SQL查询语句，选择所有书籍分类记录
bookSortSet = db3.executeQuery( bookSortSql ); // 执行查询并赋值给bookSortSet bookSortSet = db3.executeQuery( bookSortSql ); // 执行SQL查询并将结果存储在bookSortSet中
%> %>
<form class="layui-form layui-form-pane" action=""> <!-- 创建表单，指定layui样式和动作 --> <form class="layui-form layui-form-pane" action=""> <!-- 创建一个layui表单 -->
<input type="id" name="id" value="3" class="layui-hide"> <!-- 隐藏输入框，值为3 --> <input type="id" name="id" value="3" class="layui-hide"> <!-- 隐藏输入框，值为3 -->
<div class="layui-form-item"> <div class="layui-form-item">
<label class="layui-form-label">书名</label> <!-- 书名标签 --> <label class="layui-form-label">书名</label> <!-- 书名标签 -->
<div class="layui-input-block"> <div class="layui-input-block">
<input type="text" name="name" required="" lay-verify="required" placeholder="请输入书名" autocomplete="off" class="layui-input"> <!-- 书名输入框，必填项 --> <input type="text" name="name" required="" lay-verify="required" placeholder="请输入书名" autocomplete="off" class="layui-input"> <!-- 书名输入框 -->
</div> </div>
</div> </div>
<!-- 作者 --> <!-- 作者 -->
<div class="layui-form-item"> <div class="layui-form-item">
<label class="layui-form-label">作者</label> <!-- 作者标签 --> <label class="layui-form-label">作者</label> <!-- 作者标签 -->
<div class="layui-input-block"> <div class="layui-input-block">
<input type="text" name="author" required lay-verify="required" placeholder="请输入作者" autocomplete="off" class="layui-input"> <!-- 作者输入框，必填项 --> <input type="text" name="author" required lay-verify="required" placeholder="请输入作者" autocomplete="off" class="layui-input"> <!-- 作者输入框 -->
</div> </div>
</div> </div>
<div class="layui-form-item"> <div class="layui-form-item">
<label class="layui-form-label">图书馆</label> <!-- 图书馆标签 --> <label class="layui-form-label">图书馆</label> <!-- 图书馆标签 -->
<div class="layui-input-block"> <div class="layui-input-block">
<select name="library_id" lay-verify="required"> <!-- 图书馆下拉选择框，必填项 --> <select name="library_id" lay-verify="required"> <!-- 图书馆下拉选择框 -->
<option value=""></option> <!-- 空选项 --> <option value=""></option> <!-- 空选项 -->
<% while( librarySet.next() ){ %> <!-- 遍历图书馆结果集 --> <% while( librarySet.next() ){ %> <!-- 遍历图书馆数据集 -->
<option value=<%=librarySet.getString("id") %> ><%=librarySet.getString("name") %></option> <!-- 生成每个图书馆的选项 --> <option value=<%=librarySet.getString("id") %> ><%=librarySet.getString("name") %></option> <!-- 生成每个图书馆选项 -->
<%} %> <%} %>
</select> </select>
</div> </div>
@ -59,10 +59,10 @@
<div class="layui-form-item"> <div class="layui-form-item">
<label class="layui-form-label">分类</label> <!-- 分类标签 --> <label class="layui-form-label">分类</label> <!-- 分类标签 -->
<div class="layui-input-block"> <div class="layui-input-block">
<select name="sort_id" lay-verify="required"> <!-- 分类下拉选择框，必填项 --> <select name="sort_id" lay-verify="required"> <!-- 分类下拉选择框 -->
<option value=""></option> <!-- 空选项 --> <option value=""></option> <!-- 空选项 -->
<% while(bookSortSet.next()){ %> <!-- 遍历书籍分类结果集 --> <% while(bookSortSet.next()){ %> <!-- 遍历书籍分类数据集 -->
<option value=<%=bookSortSet.getInt("id") %> ><%=bookSortSet.getString("name") %></option> <!-- 生成每个分类的选项 --> <option value=<%=bookSortSet.getInt("id") %>><%=bookSortSet.getString("name") %></option> <!-- 生成每个分类选项 -->
<%} %> <%} %>
</select> </select>
</div> </div>
@ -70,62 +70,70 @@
<div class="layui-form-item"> <div class="layui-form-item">
<label class="layui-form-label">位置</label> <!-- 位置标签 --> <label class="layui-form-label">位置</label> <!-- 位置标签 -->
<div class="layui-input-block"> <div class="layui-input-block">
<input type="text" name="position" required="" lay-verify="required" placeholder="请输入位置编号" autocomplete="off" class="layui-input"> <!-- 位置输入框，必填项 --> <input type="text" name="position" required="" lay-verify="required" placeholder="请输入位置编号" autocomplete="off" class="layui-input"> <!-- 位置输入框 -->
</div> </div>
</div> </div>
<div class="layui-form-item"> <div class="layui-form-item">
<label class="layui-form-label">状态</label> <!-- 状态标签 --> <label class="layui-form-label">状态</label> <!-- 状态标签 -->
<div class="layui-input-block"> <div class="layui-input-block">
<input type="radio" name="status" value="1" title="可借" checked="checked"><div class="layui-unselect layui-form-radio layui-form-radioed"><i class="layui-anim layui-icon"></i><div>可借</div></div> <!-- 可借单选按钮，默认选中 --> <input type="radio" name="status" value="1" title="可借" checked="checked"><div class="layui-unselect layui-form-radio layui-form-radioed"><div>可借</div></div>
<input type="radio" name="status" value="0" title="不可借"><div class="layui-unselect layui-form-radio"><i class="layui-anim layui-icon"></i><div>不可借</div></div> <!-- 不可借单选按钮 --> <input type="radio" name="status" value="0" title="不可借"><div class="layui-unselect layui-form-radio"><<div>不可借</div></div>
</div> </div>
</div> </div>
<div class="layui-form-item layui-form-text"> <div class="layui-form-item layui-form-text">
<label class="layui-form-label">书籍简介</label> <!-- 书籍简介标签 --> <label class="layui-form-label">书籍简介</label> <!-- 书籍简介标签 -->
<div class="layui-input-block"> <div class="layui-input-block">
<textarea class="layui-textarea layui-hide" name= "description" lay-verify="content"></textarea> <!-- 书籍简介文本域，异步验证 --> <textarea class="layui-textarea" name="description" lay-verify="content" id="LAY_demo_editor"></textarea> <!-- 书籍简介文本域 -->
</div> </div>
</div> </div>
<div class="layui-form-item"> <div class="layui-form-item">
<div class="layui-input-block"> <div class="layui-input-block">
<button class="layui-btn" lay-submit="form" lay-filter="bookForm">立即提交</button> <!-- 提交按钮 --> <button class="layui-btn" lay-submit="" lay-filter="bookForm">立即提交</button> <!-- 提交按钮 -->
<button type="reset" class="layui-btn layui-btn-primary">重置</button> <!-- 重置按钮 --> <button type="reset" class="layui-btn layui-btn-primary">重置</button> <!-- 重置按钮 -->
</div> </div>
</div> </div>
</form> </form>
<script src="../public/layui/layui.js"></script> <!-- 引入layui脚本 -->
<script src="../public/layui/layedit/layedit.js"></script> <!-- 引入layedit脚本 --> <script src="../public/layui/layui.js"></script> <!-- 引入layui脚本文件 -->
<script src="../public/layui/jquery.min.js"></script> <!-- 引入jQuery脚本 -->
<script> <script>
//layer.closeAll(); //关闭所有层（注释掉）
layui.use(['form', 'jquery', 'layedit'], function(){ layui.use(['form', 'jquery', 'layedit'], function(){
var $ = layui.jquery, layer = layui.layer, layedit = layui.layedit; //初始化layui模块 //layer.closeAll(); //关闭所有层
var editIndex = layedit.build('description'); //构建富文本编辑器 var form = layui.form,
//自定义验证规则 layer = layui.layer,
layui.form().verify({ $ = layui.jquery;
var editIndex = layedit.build('LAY_demo_editor'); //建立编辑器
// 自定义验证规则
form.verify({
content: function(value){ //解决富文本异步传输问题 content: function(value){ //解决富文本异步传输问题
return value; return layedit.sync(editIndex);
} }
}); });
//监听提交 //监听提交
layui.form().on('submit(bookForm)', function(){ form.on('submit(bookForm)', function(data){
$.ajax({ $.ajax({
url: './bookAdd', //请求地址 url: './bookAdd', //请求地址
method: 'post', //请求方法 method: 'post', //请求方式
data: JSON.stringify($('.layui-form').serializeArray()), //JSON.stringify(data), //请求数据 data: data.field, //JSON.stringify(data), //发送的数据
dataType: 'json', //返回数据类型 dataType: 'JSON', //返回的数据类型
success: function(data){ //成功回调函数 success: function(data){ //成功回调函数
if(data.code == "0"){ //判断返回码是否为0 if(data.code == "0"){
parent.layer.msg("添加成功"); //弹出成功消息 layer.msg("添加成功", {
setTimeout(function(){ //设置延时操作 icon: 1, //图标
parent.location.reload(); //刷新父页面 time: 500 //显示时间
}, 2000); });
}else{ //如果返回码不为0 setTimeout(function(){
layer.msg("添加失败"); //弹出失败消息 //parent.location.reload(); //操作父页面
var index = parent.layer.getFrameIndex(window.name); //获取当前操作窗口的索引
parent.layer.close(index); //关闭操作窗口
}, 500);
}else{
layer.msg("添加失败"); //失败提示信息
} }
} }
}); })
return false; //阻止表单跳转（注释掉） return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
}); });
}); });
</script> </script>

59
WebContent/admin/bookborrowlist.jsp
Unescape View File

@ -3,14 +3,13 @@
<%@page import="java.sql.ResultSet"%> <!-- 导入ResultSet类，用于处理SQL查询结果 --> <%@page import="java.sql.ResultSet"%> <!-- 导入ResultSet类，用于处理SQL查询结果 -->
<%@page import="java.sql.PreparedStatement"%> <!-- 导入PreparedStatement类，用于执行预编译的SQL语句 --> <%@page import="java.sql.PreparedStatement"%> <!-- 导入PreparedStatement类，用于执行预编译的SQL语句 -->
<%@page import="java.sql.Connection"%> <!-- 导入Connection类，用于建立数据库连接 --> <%@page import="java.sql.Connection"%> <!-- 导入Connection类，用于建立数据库连接 -->
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!-- 设置页面语言为Java，内容类型为HTML，字符编码为UTF-8 -->
pageEncoding="UTF-8"%> <!-- 设置页面语言为Java，内容类型和字符编码为UTF-8 --> <!DOCTYPE html> <!-- 声明文档类型为HTML5 -->
<!DOCTYPE html>
<html> <html>
<head> <head>
<meta charset="UTF-8"> <!-- 设置HTML文档的字符编码为UTF-8 --> <meta charset="UTF-8"> <!-- 设置HTML文档的字符编码为UTF-8 -->
<title>书籍借阅历史</title> <!-- 设置网页标题 --> <title>书籍借阅历史</title> <!-- 设置网页标题 -->
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <!-- 引入Layui样式表 --> <link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <!-- 引入Layui样式表 -->
<style> <style>
.layui-table, .layui-table-view{ .layui-table, .layui-table-view{
@ -22,50 +21,50 @@
<% <%
String id = request.getParameter("id"); // 获取请求参数中的id String id = request.getParameter("id"); // 获取请求参数中的id
String name = request.getParameter("name"); // 获取请求参数中的name String name = request.getParameter("name"); // 获取请求参数中的name
Connection connection = null; // 声明数据库连接对象 Connection connection = null; // 初始化数据库连接对象
PreparedStatement pstmt = null; // 声明预编译SQL语句对象 PreparedStatement pstmt = null; // 初始化预编译SQL语句对象
ResultSet resultSet = null; // 声明结果集对象 ResultSet resultSet = null; // 初始化结果集对象
String sql = "select * from borrow_books,borrow_card where book_id=? and card_id=borrow_card.id order by borrow_books.id desc"; // SQL查询语句 String sql = "select * from borrow_books,borrow_card where book_id=? and card_id=borrow_card.id order by borrow_books.id desc"; // SQL查询语句
connection = (Connection)Base.getConnection(); // 获取数据库连接 connection = (Connection)Base.getConnection(); // 获取数据库连接
pstmt = connection.prepareStatement(sql); // 创建预编译SQL语句对象 pstmt = connection.prepareStatement(sql); // 创建预编译SQL语句对象
pstmt.setString(1,id); // 设置SQL语句中的参数 pstmt.setString(1,id); // 设置SQL语句中的第一个参数为id
resultSet = pstmt.executeQuery(); // 执行查询并获取结果集 resultSet = pstmt.executeQuery(); // 执行查询并获取结果集
/* while(resultSet.next()){ /* while(resultSet.next()){
out.print(resultSet.getString("id")); out.print(resultSet.getString("id")); // 输出结果集中的id字段
}*/ }*/
%> %>
<div class="layui-form"> <!-- Layui表单容器 --> <div class="layui-form"> <!-- Layui表单容器 -->
<table class="layui-table"> <!-- Layui表格 --> <table class="layui-table"> <!-- Layui表格 -->
<colgroup> <colgroup>
<col width="150"> <!-- 定义列宽 --> <col width="150"> <!-- 定义列宽为150px -->
<col width="150"> <col width="150"> <!-- 定义列宽为150px -->
<col width="200"> <col width="200"> <!-- 定义列宽为200px -->
<col width="200"> <col width="200"> <!-- 定义列宽为200px -->
<col width="200"> <col width="200"> <!-- 定义列宽为200px -->
<col width="200"> <col width="200"> <!-- 定义列宽为200px -->
<col width="220"> <col width="220"> <!-- 定义列宽为220px -->
<col width="200"> <col width="200"> <!-- 定义列宽为200px -->
<col width="200"> <col width="200"> <!-- 定义列宽为200px -->
</colgroup> </colgroup>
<thead> <thead>
<tr> <tr>
<th>ID</th> <!-- 表头单元格 --> <th>ID</th> <!-- 表头单元格：ID -->
<th>书籍ID</th> <th>书籍ID</th> <!-- 表头单元格：书籍ID -->
<th>书籍名</th> <th>书籍名</th> <!-- 表头单元格：书籍名 -->
<th>借阅证</th> <th>借阅证</th> <!-- 表头单元格：借阅证 -->
<th>借阅者</th> <th>借阅者</th> <!-- 表头单元格：借阅者 -->
<th>借阅时间</th> <th>借阅时间</th> <!-- 表头单元格：借阅时间 -->
<th>归还时间</th> <th>归还时间</th> <!-- 表头单元格：归还时间 -->
<th>违规信息</th> <th>违规信息</th> <!-- 表头单元格：违规信息 -->
<th>处理人</th> <th>处理人</th> <!-- 表头单元格：处理人 -->
</tr> </tr>
<%while(resultSet.next()){ %> <!-- 遍历结果集 --> <%while(resultSet.next()){ %> <!-- 遍历结果集 -->
<tr> <tr>
<td><%=resultSet.getString("id") %></td> <!-- 显示借阅记录ID --> <td><%=resultSet.getString("id") %></td> <!-- 显示借阅记录的ID -->
<td><%=id %></td> <!-- 显示书籍ID --> <td><%=id %></td> <!-- 显示书籍ID -->
<td><%=name %></td> <!-- 显示书籍名称 --> <td><%=name %></td> <!-- 显示书籍名 -->
<td><%=resultSet.getString("borrow_card.id") %></td> <!-- 显示借阅证ID --> <td><%=resultSet.getString("borrow_card.id") %></td> <!-- 显示借阅证ID -->
<td><%=resultSet.getString("reader") %></td> <!-- 显示借阅者姓名 --> <td><%=resultSet.getString("reader") %></td> <!-- 显示借阅者 -->
<td><%=Util.getFormatDateTime(resultSet.getString("borrow_date")) %></td> <!-- 显示格式化后的借阅日期 --> <td><%=Util.getFormatDateTime(resultSet.getString("borrow_date")) %></td> <!-- 显示格式化后的借阅日期 -->
<td><%=resultSet.getString("return_date") != null? Util.getFormatDateTime(resultSet.getString("return_date")) : "" %></td> <!-- 显示格式化后的归还日期，如果为空则显示空字符串 --> <td><%=resultSet.getString("return_date") != null? Util.getFormatDateTime(resultSet.getString("return_date")) : "" %></td> <!-- 显示格式化后的归还日期，如果为空则显示空字符串 -->
<td><%=resultSet.getString("illegal") != null? resultSet.getString("illegal") : "" %></td> <!-- 显示违规信息，如果为空则显示空字符串 --> <td><%=resultSet.getString("illegal") != null? resultSet.getString("illegal") : "" %></td> <!-- 显示违规信息，如果为空则显示空字符串 -->

311
WebContent/admin/bookedit.jsp
Unescape View File

@ -1,180 +1,167 @@
<%@page import="javabean.JDBCBean"%> <%@ page import="javabean.JDBCBean" %>
<%@page import="java.sql.ResultSet"%> <%@ page import="java.sql.ResultSet" %>
<%@page import="javabean.Admin"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <!-- 设置页面语言和编码 -->
<html lang="en" pageEncoding="UTF-8">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>bookedit</title> <title>bookedit</title>
<!-- layui --> <!-- layui样式 -->
<link rel="stylesheet" href="../public/layui/css/layui.css"> <link rel="stylesheet" href="../public/layui/css/layui.css">
<script src="../public/layui/layui.js"></script> <style>
.layui-form{
<style> margin: 10px 20px;
.layui-form{ }
margin: 10px 20px; </style>
}
</style>
</head> </head>
<body> <body>
<%
<% //创建数据库操作对象
JDBCBean db = new JDBCBean(); JDBCBean db = new JDBCBean();
int id = Integer.parseInt(request.getParameter("id")); // 获取请求参数中的id值，并转换为整数类型
ResultSet resultSet = null; int id = Integer.parseInt(request.getParameter("id"));
ResultSet librarySet = null; ResultSet resultSet = null;
ResultSet bookSortSet = null; ResultSet librarySet = null;
String sql = "select * from books where id=" +id ; ResultSet bookSortSet = null;
resultSet = db.executeQuery(sql); // SQL查询语句，根据id查询书籍信息
resultSet.next(); String sql = "select * from books where id=" + id;
String name = resultSet.getString("name"); // 执行查询操作
String author = resultSet.getString("author"); resultSet = db.executeQuery(sql);
int library_id = resultSet.getInt("library_id"); // 移动到结果集的第一行数据
int sort_id = resultSet.getInt("sort_id"); resultSet.next();
String position = resultSet.getString("position"); // 获取书籍的各项属性值
int status = resultSet.getInt("status"); String name = resultSet.getString("name");
String description = resultSet.getString("description"); String author = resultSet.getString("author");
db.close(); int library_id = resultSet.getInt("library_id");
// 获取图书馆列表 int sort_id = resultSet.getInt("sort_id");
JDBCBean db2 = new JDBCBean(); String position = resultSet.getString("position");
String librarySql = "select * from library"; int status = resultSet.getInt("status");
librarySet = db2.executeQuery( librarySql ); String description = resultSet.getString("description");
// 关闭数据库连接
db.close();
// 获取书籍分类
JDBCBean db3 = new JDBCBean(); // 获取图书馆列表
String bookSortSql = "select * from book_sort"; JDBCBean db2 = new JDBCBean();
bookSortSet = db3.executeQuery( bookSortSql ); String librarySql = "select * from library";
librarySet = db2.executeQuery(librarySql);
%>
// 获取书籍分类列表
<form class="layui-form layui-form-pane" action=""> JDBCBean db3 = new JDBCBean();
<%-- 隐藏id --%> String bookSortSql = "select * from book_sort";
<input type="id" name="id" value=<%=id %> class="layui-hide"> bookSortSet = db3.executeQuery(bookSortSql);
<!-- 书名 --> %>
<div class="layui-form-item"> <!-- 表单开始 -->
<label class="layui-form-label">书名</label> <form class="layui-form layui-form-pane " action="">
<div class="layui-input-block"> <!-- 隐藏id -->
<input type="text" name="name" value=<%=name %> required lay-verify="required" placeholder="请输入书名" autocomplete="off" class="layui-input"> <input type="id" name="id" value=<%=id %> class="layui-hide">
<!-- 书名 -->
<div class="layui-form-item">
<label class="layui-form-label">书名</label>
<div class="layui-input-block">
<input type="text" name="name" value=<%=name %> required lay-verify="required" placeholder="请输入书名" autocomplete="off" class="layui-input">
</div>
</div> </div>
</div> <!-- 作者 -->
<!-- 作者 --> <div class="layui-form-item">
<div class="layui-form-item"> <label class="layui-form-label">作者</label>
<label class="layui-form-label">作者</label> <div class="layui-input-block">
<div class="layui-input-block"> <input type="text" name="author" value=<%=author %> required lay-verify="required" placeholder="请输入作者" autocomplete="off" class="layui-input">
<input type="text" name="author" value=<%=author %> required lay-verify="required" placeholder="请输入作者" autocomplete="off" class="layui-input"> </div>
</div> </div>
</div> <!-- 图书馆 -->
<!-- 图书馆 --> <div class="layui-form-item">
<div class="layui-form-item"> <label class="layui-form-label">图书馆</label>
<label class="layui-form-label">图书馆</label> <div class="layui-input-block">
<div class="layui-input-block"> <select name="library_id" lay-verify="required">
<select name="library_id" lay-verify="required"> <option value=""></option>
<option value=""></option> <% while(librarySet.next()){ %>
<% while( librarySet.next() ){ %> <!-- 选中原来的图书馆 -->
<%-- 选中原来的 图书馆--%> <option value=<%=librarySet.getString("id") %> <%if(Integer.parseInt(librarySet.getString("id")) == library_id){ out.print("selected"); } %>><%=librarySet.getString("name") %></option>
<option value=<%=librarySet.getString("id") %> <%if(Integer.parseInt(librarySet.getString("id")) == library_id){ out.print("selected"); } %> ><%=librarySet.getString("name") %></option> <%} %>
<%} %> </select>
</select> </div>
</div> </div>
</div> <!-- 分类 -->
<!-- 分类 --> <div class="layui-form-item">
<div class="layui-form-item"> <label class="layui-form-label">分类</label>
<label class="layui-form-label">分类</label> <div class="layui-input-block">
<div class="layui-input-block"> <select name="sort_id" lay-verify="required">
<select name="sort_id" lay-verify="required"> <option value=""></option>
<option value=""></option> <% while(bookSortSet.next()){ %>
<% while(bookSortSet.next()){ %> <!-- 选中原来的分类 -->
<option value=<%=bookSortSet.getInt("id") %> <% if(bookSortSet.getInt("id") == sort_id) out.print("selected"); %>><%=bookSortSet.getString("name") %></option> <option value=<%=bookSortSet.getInt("id") %> <% if(bookSortSet.getInt("id") == sort_id) out.print("selected"); %>><%=bookSortSet.getString("name") %></option>
<%} %> <%} %>
</select> </select>
</div>
</div> </div>
</div> <!-- 位置 -->
<!-- 位置 --> <div class="layui-form-item">
<div class="layui-form-item"> <label class="layui-form-label">位置</label>
<label class="layui-form-label">位置</label> <div class="layui-input-block">
<div class="layui-input-block"> <input type="text" name="position" value=<%=position %> required lay-verify="required" placeholder="请输入位置编号" autocomplete="off" class="layui-input">
<input type="text" name="position" value=<%=position %> required lay-verify="required" placeholder="请输入位置编号" autocomplete="off" class="layui-input"> </div>
</div> </div>
</div> <!-- 状态 -->
<!-- 位置 --> <div class="layui-form-item">
<div class="layui-form-item"> <label class="layui-form-label">状态</label>
<label class="layui-form-label">状态</label> <div class="layui-input-block">
<div class="layui-input-block"> <input type="radio" name="status" value="1" title="可借" <%if(status==1) out.print("checked"); %>>
<input type="radio" name="status" value="1" title="可借" <%if(status==1) out.print("checked"); %>> <input type="radio" name="status" value="0" title="不可借" <%if(status==0) out.print("checked"); %> >
<input type="radio" name="status" value="0" title="不可借" <%if(status==0) out.print("checked"); %> > </div>
</div> </div>
</div> <!-- 书籍简介 -->
<div class="layui-form-item layui-form-text">
<div class="layui-form-item layui-form-text"> <label class="layui-form-label">书籍简介</label>
<label class="layui-form-label">书籍简介</label> <div class="layui-input-block">
<div class="layui-input-block"> <textarea class="layui-textarea" name="description" id="LAY_demo_editor"><%=description %></textarea>
<textarea class="layui-textarea layui-hide" name="description" lay-verify="content" id="LAY_demo_editor"><%=description %></textarea> </div>
</div> </div>
</div> <div class="layui-form-item">
<div class="layui-input-block">
<div class="layui-form-item"> <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
<div class="layui-input-block"> <button type="reset" class="layui-btn layui-btn-primary">重置</button>
<button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button> </div>
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
</div> </div>
</div>
</form> </form>
<script> <!-- layui脚本 -->
layui.use(['form', 'jquery', 'layedit'], function(){
var $ = layui.jquery, form = layui.form, layer = layui.layer, layedit = layui.layedit;
var editIndex = layedit.build('LAY_demo_editor'); //建立编辑器
// 自定义验证规则
form.verify({
content: function(value){ //解决异步传输问题
return layedit.sync(editIndex);
}
})
//监听提交
form.on('submit(formDemo)', function(data){
$.ajax({
url: './bookEdit', //请求地址
method: 'post', //请求方式
data: data.field, //JSON.stringify(data.field), //请求数据
dataType: 'json', //返回数据类型
success: function(data){ //成功回调函数
if(data.code == "0"){ //判断修改是否成功
parent.layer.msg("修改成功", {icon: 6, time: 500}); //提示消息
setTimeout(function(){ //延时跳转页面
var index = parent.layer.getFrameIndex(window.name); //操作父页面
parent.layer.close(index); //关闭当前页面
}, 500);
}else{ //失败提示
layer.msg("修改失败"); //提示消息
}
layui.use(['form', 'layedit', 'jquery'], function(){ }
//layer.closeAll(); })
$ = layui.jquery; return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
var form = layui.form });
,layer = layui.layer
,layedit = layui.layedit;
var editIndex = layedit.build('LAY_demo_editor');
// 自定义验证规则
form.verify({
// 解决异步传输问题
content: function(value){
return layedit.sync(editIndex);
}
})
//监听提交
form.on('submit(formDemo)', function(data){
$.ajax({
url: './bookEdit',
method: 'post',
data: data.field, //JSON.stringify(data.field),
dataType: 'json',
success: function(data){
if(data.code == "0"){
parent.layer.msg("修改成功",{
icon: 6,
time: 500
});
setTimeout(function(){
var index = parent.layer.getFrameIndex(window.name); //操作父页面
parent.layer.close(index);
}, 500);
}else{
leyer.msg("修改失败");
}
}
})
return false;
});
}); });
</script>
<% <%
// 关闭资源 // 关闭资源
bookSortSet.close(); bookSortSet.close(); //关闭书籍分类结果集
librarySet.close(); librarySet.close(); //关闭图书馆结果集
resultSet.close(); resultSet.close(); //关闭书籍信息结果集
db.close(); db.close(); //关闭数据库连接
%> %>
</body> </body>
</html> </html>

452
WebContent/admin/booklist.jsp
Unescape View File

@ -1,244 +1,226 @@
<%@page import="net.sf.json.JSONObject"%> <%@page import="net.sf.json.JSONObject"%> // 导入JSON库
<%@page import="java.sql.ResultSet"%> <%@page import="java.sql.ResultSet"%> // 导入SQL查询结果类
<%@page import="javabean.JDBCBean"%> <%@page import="javabean.JDBCBean"%> // 导入自定义数据库连接类
<%@page import="java.util.Map"%> <%@page import="java.util.Map"%> // 导入Map接口
<%@page import="java.util.HashMap"%> <%@page import="java.util.HashMap"%> // 导入HashMap类
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%> // 设置页面编码为UTF-8
<!DOCTYPE html> <!DOCTYPE html> <!-- HTML5文档类型声明 -->
<html lang="en"> <html lang="en"> <!-- 设置页面语言为英文 -->
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8"> <!-- 设置页面字符集为UTF-8 -->
<title>test</title> <title>test</title> <!-- 页面标题 -->
<!-- layui --> <!-- layui 样式文件 -->
<link rel="stylesheet" href="../public/layui/css/layui.css"> <link rel="stylesheet" href="../public/layui/css/layui.css">
<script src="../public/layui/layui.js"></script> <script src="../public/layui/layui.js"></script> <!-- layui JavaScript文件 -->
<style> <style>
.layui-table, .layui-table-view{ .layui-table, .layui-table-view{
margin-top: 0px; margin-top: 0px; <!-- 设置表格上方的外边距为0 -->
} }
</style> </style>
</head> </head>
<body> <body>
<% <%
JDBCBean libraryDb = new JDBCBean(); // 创建JDBCBean对象用于连接数据库
JDBCBean libraryDb = new JDBCBean(); JDBCBean bookSortDb = new JDBCBean(); // 创建JDBCBean对象用于连接数据库
JDBCBean bookSortDb = new JDBCBean(); ResultSet librarySet = null; // 定义ResultSet变量，用于存放查询结果
ResultSet librarySet = null; ResultSet bookSortSet = null; // 定义ResultSet变量，用于存放查询结果
ResultSet bookSortSet = null; // 准备sql查询语句
// 准备sql String librarySql = "select * from library"; // 查询所有图书馆信息
String librarySql = "select * from library"; String bookSortSql = "select * from book_sort"; // 查询所有书籍分类信息
String bookSortSql = "select * from book_sort"; // 执行查询
// 进行查询 librarySet = libraryDb.executeQuery(librarySql); // 执行查询图书馆
librarySet = libraryDb.executeQuery( librarySql ); bookSortSet = bookSortDb.executeQuery(bookSortSql); // 执行查询书籍分类
bookSortSet = bookSortDb.executeQuery( bookSortSql ); // 创建JSON对象
// 准备json JSONObject libraryJson = new JSONObject(); // 用于存放图书馆数据的JSON对象
JSONObject libraryJson = new JSONObject(); JSONObject bookSortJson = new JSONObject(); // 用于存放书籍分类数据的JSON对象
JSONObject bookSortJson = new JSONObject(); // 遍历查询结果集并将数据加入到JSON对象
// 获取图书馆信息并存入JSON对象
// 遍历set while( librarySet.next() ){
// 获取图书馆json libraryJson.put(librarySet.getString("id"), librarySet.getString("name")); // 将图书馆的id和name加入到JSON对象
while( librarySet.next() ){ }
libraryJson.put(librarySet.getString("id") , librarySet.getString("name")); // 获取书籍分类信息并存入JSON对象
} while( bookSortSet.next() ){
// 获取分类json bookSortJson.put(bookSortSet.getString("id"), bookSortSet.getString("name")); // 将分类的id和name加入到JSON对象
while( bookSortSet.next() ){ }
bookSortJson.put(bookSortSet.getString("id") , bookSortSet.getString("name")); librarySet.close(); // 关闭图书馆查询结果集
} libraryDb.close(); // 关闭数据库连接
librarySet.close(); %>
libraryDb.close(); <!-- 搜索框模板 -->
<script type="text/html" id="search">
%> <div class="demoTable">
<!-- 搜索框 -->
<script type="text/html" id="search">
<div class="demoTable">
条件搜索： 条件搜索：
<div class="layui-inline"> <div class="layui-inline">
<select id="condition" name="condition" lay-verify="required"> <select id="condition" name="condition" lay-verify="required"> <!-- 条件选择下拉框 -->
<option value=""></option> <option value=""></option>
<option value="id">ID</option> <option value="id">ID</option>
<option value="name">书名</option> <option value="name">书名</option>
<option value="author">作者</option> <option value="author">作者</option>
<option value="library_id">图书馆</option> <option value="library_id">图书馆</option>
<option value="position">位置</option> <option value="position">位置</option>
<option value="status">状态</option> <option value="status">状态</option>
<option value="description">描述</option> <option value="description">描述</option>
</select> </select>
</div> </div>
<div class="layui-inline"> <div class="layui-inline">
<input class="layui-input" name="conditionValue" id="conditionValue" autocomplete="off" placeholder="请输入搜索内容"> <input class="layui-input" name="conditionValue" id="conditionValue" autocomplete="off" placeholder="请输入搜索内容"> <!-- 搜索内容输入框 -->
</div> </div>
<button class="layui-btn" data-type="reload" lay-event="search">搜索</button> <button class="layui-btn" data-type="reload" lay-event="search">搜索</button> <!-- 搜索按钮 -->
<button type="button" class="layui-btn layui-btn-sm" lay-event="add"><i class="layui-icon">添加书籍</i></button> <button type="button" class="layui-btn layui-btn-sm" lay-event="add"><i class="layui-icon">添加书籍</i></button> <!-- 添加书籍按钮 -->
</div> </div>
</script> </script>
<!-- 表单 -->
<!-- 表单 --> <table id="demo" lay-filter="form"> <!-- 表格渲染容器 -->
<table id="demo" lay-filter="form"> </table>
<!-- 操作栏模板 -->
</table> <script type="text/html" id="operateBar">
<a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="bookBorrowList">查看借阅</a> <!-- 查看借阅历史 -->
<!-- 行操作 --> <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a> <!-- 编辑书籍信息 -->
<script type="text/html" id="operateBar"> <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a> <!-- 删除书籍 -->
<a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="bookBorrowList">查看借阅</a> </script>
<a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a> <script>
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a> // 图书馆数据转为JSON格式
</script> var libraryJson = <%=libraryJson %> // 获取服务器端传来的图书馆JSON数据
<script> // 书籍分类数据转为JSON格式
// 图书馆json var bookSortJson = <%=bookSortJson %> // 获取服务器端传来的书籍分类JSON数据
var libraryJson = <%=libraryJson %> </script>
// 图书分类json <!-- 状态模板 -->
var bookSortJson = <%=bookSortJson %> <script type="text/html" id="statusTpl">
</script> {{# if(d.status == 1){ }}
<!-- 状态模板 --> <span style="color:#5FB878;">可借</span> <!-- 状态为1，显示可借 -->
<script type="text/html" id="statusTpl"> {{# } else { }}
{{# if(d.status == 1){ }} 借出 <!-- 状态为其他，显示借出 -->
<span style="color:#5FB878;">可借</span> {{# } }}
{{# } else { }} </script>
借出 <script>
{{# } }} layui.use(['table', 'jquery'],function(){
</script> $ = layui.jquery; // 引入jquery库
var table = layui.table; // 引入layui表格组件
var tableIns = table.render({
<script> elem: '#demo' // 表格容器id
,height: 600 // 表格高度
layui.use(['table', 'jquery'],function(){ ,url: './bookList' // 数据请求接口
$ = layui.jquery; ,title: '数据表单' // 表格标题
var table = layui.table; ,toolbar: '#search' // 顶部工具栏
var tableIns = table.render({ ,page: true // 开启分页功能
elem: '#demo' ,cols: [[
,height: 600 {type: 'numbers', width:50, fixed:'left'} // 序号列
,url: './bookList' ,{field: 'id', title: 'ID', width:80, sort: true, fixed: 'left'} // ID列
,title: '数据表单' ,{field: 'name', title: '书名', width:170, sort: true} // 书名列
,toolbar: '#search' ,{field: 'author', title: '作者', width: 140, sort: true} // 作者列
,page: true ,{field: 'library_id', title: '图书馆', width:80, edit: true // 图书馆列，可编辑
,cols: [[ ,templet: function(d){
{type: 'numbers', width:50, fixed:'left'} return libraryJson[d.library_id]; // 根据图书馆ID从JSON中取出名称
,{field: 'id', title: 'ID', width:80, sort: true, fixed: 'left'} }}
,{field: 'name', title: '书名', width:170, sort: true} ,{field: 'sort_id', title: '分类', width: 80, sort: true, edit:true // 分类列，可编辑
,{field: 'author', title: '作者', width: 140, sort: true} ,templet: function(d){
,{field: 'library_id', title: '图书馆†', width:80, edit: true //,templet: '#libraryTemp'} return bookSortJson[d.sort_id]; // 根据分类ID从JSON中取出名称
,templet: function(d){ }}
return libraryJson[d.library_id]; ,{field: 'position', title: '位置', width: 110, sort: true} // 位置列
}} ,{field: 'status', title: '状态', width: 60, templet:'#statusTpl'} // 状态列，使用模板
,{field: 'sort_id', title: '分类', width: 80, sort: true, edit:true ,{field: 'description', title: '描述', width: 340} // 描述列
,templet: function(d){ ,{fixed: 'right', title:'操作', width: 200, align:'center', toolbar: '#operateBar'} // 操作列，使用工具栏模板
return bookSortJson[d.sort_id]; ]],
}} });
,{field: 'position', title: '位置', width: 110, sort: true}
,{field: 'status', title: '状态', width: 60, templet:'#statusTpl'} // 监听表格的编辑事件
,{field: 'description', title: '描述', width: 340} table.on('edit(form)', function(obj){ // 表格编辑事件
,{fixed: 'right', title:'操作', width: 200, align:'center', toolbar: '#operateBar'} //这里的toolbar值是模板元素的选择器 console.log(obj.value); // 打印修改后的值
]] console.log(obj.field); // 打印编辑字段名
}); console.log(obj.data); // 打印所在行数据
});
// 直接编辑
table.on('edit(form)', function(obj){ //注：edit是固定事件名，test是table原始容器的属性 lay-filter="对应的值" // 监听操作栏的事件（编辑、删除、查看借阅）
console.log(obj.value); //得到修改后的值 table.on('tool(form)', function(obj){ // 表格工具栏事件
console.log(obj.field); //当前编辑的字段名 var data = obj.data; // 获取当前行数据
console.log(obj.data); //所在行的所有相关数据 var layEvent = obj.event; // 获取事件名
}); var tr = obj.tr; // 获取当前行的DOM对象
var id = data.id; // 获取书籍ID
var name = data.name; // 获取书籍名称
// 监听侧边工具条 编辑，删除 if(layEvent === 'del'){ // 删除事件
table.on('tool(form)', function(obj){ //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值" layer.confirm('真的删除行么', function(index){
var data = obj.data; //获得当前行数据 layer.close(index); // 关闭确认框
var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值） // 向服务器发送删除请求
var tr = obj.tr; //获得当前行 tr 的 DOM 对象（如果有的话） $.ajax({
var id = data.id; url: './bookDel',
var name = data.name; method: 'get',
if(layEvent === 'del'){ //删除 dataType: 'JSON',
layer.confirm('真的删除行么', function(index){ data: "id=" +id,
layer.close(index); success: function(data){
//向服务端发送删除指令 if(data.code == 0){
$.ajax({ layer.msg(data.msg); // 显示删除成功消息
url: './bookDel', $('.layui-laypage-btn').click(); // 刷新分页
method: 'get', }else{
dataType: 'JSON', layer.msg(data.msg); // 显示错误消息
data: "id=" +id, }
success: function(data){ }
if(data.code == 0){ })
layer.msg(data.msg); });
$('.layui-laypage-btn').click(); } else if(layEvent === 'edit'){ // 编辑事件
}else{ // 打开编辑页面
layer.msg(data.msg); layer.open({
} type: 2,
title: "更改信息",
} area: ['800px', '600px'],
}) maxmin: true, // 开启最大化最小化按钮
}); shadeClose: true,
} else if(layEvent === 'edit'){ //编辑 content: "bookedit.jsp?id="+ id, // 编辑页面
// 页面编辑 end: function(){
layer.open({ $(".layui-laypage-btn").click(); // 关闭后刷新页面
type: 2, }
title: "更改信息",
area: ['800px', '600px'],
maxmin: true, //开启最大化最小化按钮
shadeClose: true,
content: "bookedit.jsp?id="+ id,
end: function(){
$(".layui-laypage-btn").click();
}
}); });
}else if(layEvent === 'bookBorrowList') { //查看该书籍借阅历史 }else if(layEvent === 'bookBorrowList') { // 查看借阅历史
layer.open({ // 打开借阅历史页面
title: '书籍借阅历史', layer.open({
type: 2, title: '书籍借阅历史',
area: ['800px', '600px'], type: 2,
maxmin: true, area: ['800px', '600px'],
shadeClose: true, maxmin: true,
content: "bookborrowlist.jsp?id=" +id +"&name="+name shadeClose: true,
}) content: "bookborrowlist.jsp?id=" +id +"&name="+name // 借阅历史页面
})
} }
}); });
// 顶部工具栏的事件（搜索、添加书籍）
table.on('toolbar(form)', function(obj){
// 顶部工具栏事件 var checkStatus = table.checkStatus(obj.config.id); // 获取选中的行
table.on('toolbar(form)', function(obj){ var data = obj.data;
var checkStatus = table.checkStatus(obj.config.id); switch(obj.event){
var data = obj.data; // 搜索
switch(obj.event){ case 'search':
// 条件查找 var conditionValue = $('#conditionValue'); // 获取搜索框的值
case 'search': var condition = $('#condition'); // 获取搜索条件
var conditionValue = $('#conditionValue'); // 重新加载表格数据
var condition = $('#condition'); tableIns.reload({
//这里以搜索为例 where: { // 设置异步请求参数
tableIns.reload({ "condition": condition.val(),
where: { //设定异步数据接口的额外参数，任意设 "conditionValue": conditionValue.val()
"condition": condition.val(), }
"conditionValue": conditionValue.val() ,page: {
} curr: 1 // 从第一页开始加载
,page: { }
curr: 1 //重新从第 1 页开始 });
} break;
}); // 添加书籍
break; case 'add':
// 添加书籍 // 打开添加书籍页面
case 'add': var addBookLayer = layer.open({
var addBookLayer = layer.open({ type: 2,
type: 2, title: "添加书籍",
title: "添加书籍", area: ['800px', '600px'],
area: ['800px', '600px'], maxmin: true, // 开启最大化最小化按钮
maxmin: true, //开启最大化最小化按钮 shadeClose: true,
shadeClose: true, content: "bookadd.jsp", // 添加页面
content: "bookadd.jsp", end: function () {
end: function () { $(".layui-laypage-btn").click(); // 关闭后刷新分页
console.log("finish add"); }
$(".layui-laypage-btn").click(); });
} layer.full(addBookLayer); // 最大化页面
}); break;
layer.full(addBookLayer); };
break;
};
});
}); });
});
</script>
</script>
</body> </body>
</html> </html>

87
WebContent/admin/booklist_1.jsp
Unescape View File

@ -1,54 +1,51 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%> // 设置页面的语言为Java，字符编码为UTF-8,设置页面的编码为UTF-8
<!DOCTYPE html> <!DOCTYPE html> <!-- 声明HTML文档类型为HTML5 -->
<html lang="en"> <html lang="en"> <!-- 设置网页的语言为英语 -->
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8"> <!-- 设置字符集为UTF-8，确保正确显示中文等字符 -->
<title>test</title> <title>test</title> <!-- 设置网页的标题为“test” -->
<!-- layui --> <!-- 引入layui样式 -->
<link rel="stylesheet" href="../public/layui/css/layui.css"> <link rel="stylesheet" href="../public/layui/css/layui.css"> <!-- 引入layui的CSS文件 -->
<script src="../public/layui/layui.js"></script> <script src="../public/layui/layui.js"></script> <!-- 引入layui的JavaScript文件 -->
<style> <style>
.layui-table{ .layui-table{ // 自定义样式，设置layui表格的外边距
margin-top: 0px; margin-top: 0px; // 设置表格的上外边距为0
} }
</style> </style>
</head> </head>
<body> <body>
<table id="demo" lay-filter="test"> <table id="demo" lay-filter="test"> <!-- 创建一个表格，id为demo，lay-filter属性指定表格的过滤器 -->
</table>
</table> <script type="text/html" id="operate"> <!-- 定义一个操作模板，用于在表格的每行展示操作按钮 -->
<script type="text/html" id="operate"> <button type="button" class="layui-btn layui-btn-warm">修改</button> <!-- 修改按钮 -->
<button type="button" class="layui-btn layui-btn-warm">修改</button> <button type="button" class="layui-btn layui-btn-danger">删除</button> <!-- 删除按钮 -->
<button type="button" class="layui-btn layui-btn-danger">删除</button>
</script> </script>
<script> <script>
layui.use('table', function(){ layui.use('table', function(){ // 使用layui的table组件
var table = layui.table;‹ var table = layui.table; // 获取table组件实例
table.render({ table.render({ // 渲染表格
elem: '#demo' elem: '#demo' // 表格容器的选择器
,height: 600 ,height: 600 // 设置表格的高度为600px
//,url: './data.json' //,url: './data.json' // 这里是一个注释掉的代码，表示数据源可以是JSON文件
,url: './bookList' ,url: './bookList' // 设置表格数据的接口地址
,title: '数据表单' ,title: '数据表单' // 设置表格的标题为“数据表单”
,toolbar: true ,toolbar: true // 启用表格的工具栏
,page: true ,page: true // 启用分页功能
,size: 'lg' ,size: 'lg' // 设置表格的尺寸为“大”
,cols: [[ ,cols: [[ // 定义表格的列
{field: 'id', title: 'ID', width:80, sort: true, fixed: 'left'} {field: 'id', title: 'ID', width:80, sort: true, fixed: 'left'} // ID列，宽度为80，支持排序，固定在左侧
,{field: 'name', title: '姓名', width:120} ,{field: 'name', title: '姓名', width:120} // 姓名列，宽度为120
,{field: 'library_name', title: '图书馆†', width:80} ,{field: 'library_name', title: '图书馆†', width:80} // 图书馆列，宽度为80
,{field: 'sort_id', title: '分类', width: 177} ,{field: 'sort_id', title: '分类', width: 177} // 分类列，宽度为177
,{field: 'position_id', title: '位置', width: 80, sort: true} ,{field: 'position_id', title: '位置', width: 80, sort: true} // 位置列，宽度为80，支持排序
,{field: 'state', title: '状态', width: 80, sort: true} ,{field: 'state', title: '状态', width: 80, sort: true} // 状态列，宽度为80，支持排序
,{field: 'descript', title: '描述', width: 80} ,{field: 'descript', title: '描述', width: 80} // 描述列，宽度为80
,{field: 'operate', title: '操作', width: 200, templet: '#operate'} ,{field: 'operate', title: '操作', width: 200, templet: '#operate'} // 操作列，宽度为200，使用之前定义的操作模板
]] ]]
}); });
});
});
</script> </script>
</table> </table>
</body> </body>
</html> </html>

161
WebContent/admin/borrowlist.jsp
Unescape View File

@ -1,92 +1,89 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%> // 设置页面的语言为Java，字符编码为UTF-8,设置页面的编码为UTF-8
<!DOCTYPE html> <!DOCTYPE html> <!-- 声明HTML文档类型为HTML5 -->
<html lang="en"> <html lang="en"> <!-- 设置网页的语言为英语 -->
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8"> <!-- 设置字符集为UTF-8，确保中文字符正确显示 -->
<title>借阅记录</title> <title>借阅记录</title> <!-- 设置网页的标题为“借阅记录” -->
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <!-- 引入layui的CSS文件 -->
<style> <style>
.layui-table,.layui-table-view{ .layui-table,.layui-table-view{ // 自定义样式，设置layui表格的外边距
margin: 0 0px; margin: 0 0px; // 设置表格的上下外边距为0
} }
</style> </style>
</head> </head>
<body> <body>
<script src="../public/layui/layui.js" charset="utf-8"></script> <script src="../public/layui/layui.js" charset="utf-8"></script> <!-- 引入layui的JavaScript文件 -->
<!-- 表单 --> <!-- 表单 -->
<table class="layui-hide" id="history" lay-filter="formFilter"></table> <table class="layui-hide" id="history" lay-filter="formFilter"></table> <!-- 创建一个表格，id为history，lay-filter属性指定表格的过滤器 -->
<!-- 头部工具栏 --> <!-- 头部工具栏 -->
<script type="text/html" id="headBar"> <script type="text/html" id="headBar"> <!-- 定义一个条件搜索的工具栏模板 -->
条件搜索： 条件搜索：
<div class="layui-inline"> <div class="layui-inline"> <!-- 条件选择框 -->
<select id="condition" name="condition" lay-verify="required"> <select id="condition" name="condition" lay-verify="required"> <!-- 下拉选择框，要求选择条件 -->
<option value=""></option> <option value=""></option> <!-- 默认空值选项 -->
<option value="other">超期未还</option> <option value="other">超期未还</option> <!-- 超期未还选项 -->
<option value="id">ID</option> <option value="id">ID</option> <!-- ID选项 -->
<option value="card_id">借阅证号</option> <option value="card_id">借阅证号</option> <!-- 借阅证号选项 -->
<option value="book_id">书籍ID</option> <option value="book_id">书籍ID</option> <!-- 书籍ID选项 -->
<option value="borrow_date">借阅日期</option> <option value="borrow_date">借阅日期</option> <!-- 借阅日期选项 -->
<option value="end_date">限制日期</option> <option value="end_date">限制日期</option> <!-- 限制日期选项 -->
<option value="return_date">返还日期</option> <option value="return_date">返还日期</option> <!-- 返还日期选项 -->
<option value="illegal">违章信息</option> <option value="illegal">违章信息</option> <!-- 违章信息选项 -->
<option value="manager_id">处理人</option> <option value="manager_id">处理人</option> <!-- 处理人选项 -->
</select> </select>
</div> </div>
<div class="layui-inline"> <div class="layui-inline"> <!-- 输入框 -->
<input class="layui-input" id="conditionValue" name="conditionValue" id="demoReload" autocomplete="off"> <input class="layui-input" id="conditionValue" name="conditionValue" id="demoReload" autocomplete="off"> <!-- 条件值的输入框 -->
</div> </div>
<button class="layui-btn" name="condition" data-type="reload" lay-event="search">搜索</button> <button class="layui-btn" name="condition" data-type="reload" lay-event="search">搜索</button> <!-- 搜索按钮 -->
</script> </script>
<script> <script>
layui.use(['table','jquery'], function(){ layui.use(['table','jquery'], function(){ // 使用layui的table和jquery模块
$ = layui.jquery; $ = layui.jquery; // 获取jQuery对象
var table = layui.table; var table = layui.table; // 获取table组件实例
// 进行渲染 // 进行渲染
var tableIns = table.render({ var tableIns = table.render({
elem: '#history' elem: '#history' // 表格容器的选择器
,url:'./borrowList' ,url:'./borrowList' // 设置表格数据的接口地址
,toolbar: '#headBar' ,toolbar: '#headBar' // 设置表格的工具栏，使用之前定义的headBar模板
,cols: [[ ,cols: [[ // 定义表格的列
{field:'id', width:80, title: 'ID', sort: true} {field:'id', width:80, title: 'ID', sort: true} // ID列，宽度为80，支持排序
,{field:'card_id', width:180, title: '借阅证号'} ,{field:'card_id', width:180, title: '借阅证号'} // 借阅证号列，宽度为180
,{field:'book_id', width:100, title: '书籍ID', sort: true} ,{field:'book_id', width:100, title: '书籍ID', sort: true} // 书籍ID列，宽度为100，支持排序
,{field:'borrow_date', width:180, title: '借阅时间'} ,{field:'borrow_date', width:180, title: '借阅时间'} // 借阅时间列，宽度为180
,{field:'end_date', title: '限定时间', width: 180} ,{field:'end_date', title: '限定时间', width: 180} // 限定时间列，宽度为180
,{field:'return_date', width:180, title: '归还时间', sort: true} ,{field:'return_date', width:180, title: '归还时间', sort: true} // 归还时间列，宽度为180，支持排序
,{field:'illegal', minWidth:280, title: '违章信息', sort: true} ,{field:'illegal', minWidth:280, title: '违章信息', sort: true} // 违章信息列，最小宽度为280，支持排序
,{field:'manager_id', width:80, title: '处理人'} ,{field:'manager_id', width:80, title: '处理人'} // 处理人列，宽度为80
]] ]]
,page: true ,page: true // 启用分页功能
}); });
// 头部工具栏事件 // 头部工具栏事件
table.on('toolbar(formFilter)', function(obj){ table.on('toolbar(formFilter)', function(obj){ // 为表格的头部工具栏绑定事件
var checkStatus = table.checkStatus(obj.config.id); var checkStatus = table.checkStatus(obj.config.id); // 获取选中的数据行
switch(obj.event){ switch(obj.event){ // 根据触发的事件进行不同的操作
// 条件查找图书证 // 条件查找图书证
case 'search': case 'search': // 当点击搜索按钮时
var conditionValue = $('#conditionValue'); var conditionValue = $('#conditionValue'); // 获取输入框中的条件值
var condition = $('#condition'); var condition = $('#condition'); // 获取下拉框中的选择条件
// 进行搜索，重新渲染 // 进行搜索，重新渲染表格
tableIns.reload({ tableIns.reload({
where: { //设定异步数据接口的额外参数，任意设 where: { // 设定异步数据接口的额外参数
"condition": condition.val(), "condition": condition.val(), // 获取选择的条件
"conditionValue": conditionValue.val() "conditionValue": conditionValue.val() // 获取输入的条件值
} }
,page: { ,page: { // 设置分页信息
curr: 1 //重新从第 1 页开始 curr: 1 // 重新从第 1 页开始
} }
}); });
break; break;
}; };
}); });
}); });
</script> </script>
</body> </body>
</html> </html>

180
WebContent/admin/cardadd.jsp
Unescape View File

@ -1,117 +1,115 @@
<%@page import="javabean.Base"%> <%@page import="javabean.Base"%> <!-- 导入javabean.Base类 -->
<%@page import="java.sql.ResultSet"%> <%@page import="java.sql.ResultSet"%> <!-- 导入ResultSet类，处理SQL查询结果 -->
<%@page import="java.sql.PreparedStatement"%> <%@page import="java.sql.PreparedStatement"%> <!-- 导入PreparedStatement类，用于执行SQL语句 -->
<%@page import="java.sql.Connection"%> <%@page import="java.sql.Connection"%> <!-- 导入Connection类，表示数据库连接 -->
<%@page import="net.sf.json.JSONObject"%> <%@page import="net.sf.json.JSONObject"%> <!-- 导入JSONObject类，用于处理JSON对象 -->
<%@page import="net.sf.json.JSONArray"%> <%@page import="net.sf.json.JSONArray"%> <!-- 导入JSONArray类，用于处理JSON数组 -->
<%@page import="javabean.Admin"%> <%@page import="javabean.Admin"%> <!-- 导入javabean.Admin类 -->
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%> <!-- 设置页面的语言为Java，字符编码为UTF-8,设置页面的编码为UTF-8 -->
<!DOCTYPE html> <!DOCTYPE html> <!-- 声明HTML5文档类型 -->
<html> <html> <!-- 开始HTML文档 -->
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8"> <!-- 设置页面字符编码为UTF-8 -->
<title>图书证修改</title> <title>图书证修改</title> <!-- 设置页面标题为“图书证修改” -->
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <!-- 引入layui的CSS文件 -->
<script src="../public/layui/layui.js" charset="utf-8"></script> <script src="../public/layui/layui.js" charset="utf-8"></script> <!-- 引入layui的JS文件 -->
<style> <style>
.layui-form{ .layui-form{ <!-- 定义layui表单样式 -->
margin: 10px 20px; margin: 10px 20px; <!-- 设置表单的外边距为10px 20px -->
} }
</style> </style>
</head> </head>
<body> <body>
<% <%
Connection connection = null; Connection connection = null; // 声明数据库连接对象
PreparedStatement pstmt = null; PreparedStatement pstmt = null; // 声明PreparedStatement对象
ResultSet ruleSet = null; ResultSet ruleSet = null; // 声明ResultSet对象，用于存储查询结果
String sql = "select * from rules"; String sql = "select * from rules"; // 定义SQL查询语句
String result = ""; String result = ""; // 定义结果字符串
connection = (Connection)Base.getConnection(); connection = (Connection)Base.getConnection(); // 获取数据库连接
pstmt = connection.prepareStatement(sql); pstmt = connection.prepareStatement(sql); // 创建PreparedStatement对象并执行SQL查询
ruleSet = pstmt.executeQuery(); ruleSet = pstmt.executeQuery(); // 执行查询并返回结果集
%> %>
<form class="layui-form layui-form-pane" action="" lay-filter="cardFilter"> <form class="layui-form layui-form-pane" action="" lay-filter="cardFilter"> <!-- 定义表单，layui样式 -->
<!-- 姓名 --> <!-- 姓名 -->
<div class="layui-form-item"> <div class="layui-form-item"> <!-- 表单项 -->
<label class="layui-form-label">姓名</label> <label class="layui-form-label">姓名</label> <!-- 表单标签 -->
<div class="layui-input-block"> <div class="layui-input-block"> <!-- 表单输入框 -->
<input type="text" name="reader" lay-verify="required" autocomplete="off" placeholder="请输入姓名" class="layui-input"> <input type="text" name="reader" lay-verify="required" autocomplete="off" placeholder="请输入姓名" class="layui-input"> <!-- 输入框，必须填写 -->
</div> </div>
</div> </div>
<!-- 密码 --> <!-- 密码 -->
<div class="layui-form-item"> <div class="layui-form-item"> <!-- 表单项 -->
<label class="layui-form-label">密码</label> <label class="layui-form-label">密码</label> <!-- 表单标签 -->
<div class="layui-input-block"> <div class="layui-input-block"> <!-- 表单输入框 -->
<input type="password" name="password" placeholder="请输入密码" autocomplete="off" class="layui-input" lay-verify="required"> <input type="password" name="password" placeholder="请输入密码" autocomplete="off" class="layui-input" lay-verify="required"> <!-- 输入框，密码字段，必须填写 -->
</div> </div>
</div> </div>
<!-- 借阅规则 --> <!-- 借阅规则 -->
<div class="layui-form-item"> <div class="layui-form-item"> <!-- 表单项 -->
<label class="layui-form-label">规则</label> <label class="layui-form-label">规则</label> <!-- 表单标签 -->
<div class="layui-input-block"> <div class="layui-input-block"> <!-- 表单输入框 -->
<select name="rule_id" lay-filter="rule_id" lay-verify="required"> <select name="rule_id" lay-filter="rule_id" lay-verify="required"> <!-- 下拉框，规则选择，必须选择 -->
<% while(ruleSet.next()){ %> <% while(ruleSet.next()){ %> <!-- 循环遍历查询结果 -->
<option value=<%=ruleSet.getString("id") %>><%=ruleSet.getString("id") %></option> <option value=<%=ruleSet.getString("id") %>><%=ruleSet.getString("id") %></option> <!-- 为每个规则生成一个选项 -->
<%} %> <%} %>
</select> </select>
</div> </div>
</div> </div>
<div class="layui-form-item"> <div class="layui-form-item"> <!-- 表单项 -->
<label class="layui-form-label">状态</label> <label class="layui-form-label">状态</label> <!-- 表单标签 -->
<div class="layui-input-block"> <div class="layui-input-block"> <!-- 表单输入框 -->
<input type="radio" name="status" value="1" title="可用" checked=""> <input type="radio" name="status" value="1" title="可用" checked=""> <!-- 单选按钮，表示“可用”状态 -->
<input type="radio" name="status" value="0" title="挂失"> <input type="radio" name="status" value="0" title="挂失"> <!-- 单选按钮，表示“挂失”状态 -->
</div> </div>
</div> </div>
<div class="layui-form-item"> <div class="layui-form-item"> <!-- 表单项 -->
<div class="layui-input-block"> <div class="layui-input-block"> <!-- 表单输入框 -->
<button class="layui-btn" lay-submit="" lay-filter="submitForm">立即提交</button> <button class="layui-btn" lay-submit="" lay-filter="submitForm">立即提交</button> <!-- 提交按钮，点击时触发submitForm事件 -->
<button type="reset" class="layui-btn layui-btn-primary">重置</button> <button type="reset" class="layui-btn layui-btn-primary">重置</button> <!-- 重置按钮，清空表单内容 -->
</div> </div>
</div> </div>
</form> </form>
<script> <script>
layui.use(['form', 'jquery'], function(){ layui.use(['form', 'jquery'], function(){ // 使用layui的form和jquery模块
var form = layui.form var form = layui.form // 获取form模块实例
,layer = layui.layer; ,layer = layui.layer; // 获取layer模块实例
$ = layui.jquery; $ = layui.jquery; // 获取jQuery对象
// 提交表单
form.on('submit(submitForm)', function(data){ // 提交表单
$.ajax({ form.on('submit(submitForm)', function(data){ // 当提交表单时，触发submitForm事件
url: './cardAdd', $.ajax({ // 发送AJAX请求
method: 'post', url: './cardAdd', // 请求的URL地址
data: data.field, method: 'post', // 请求方法为POST
dataType: 'json', data: data.field, // 提交表单数据
success: function(data){ dataType: 'json', // 返回数据的格式为JSON
if(data.code == "0"){ success: function(data){ // 请求成功后的回调函数
parent.layer.open({ if(data.code == "0"){ // 如果返回的状态码为“0”
title: '注册账号为', parent.layer.open({ // 打开父窗口的弹出层
content: data.data['id'], title: '注册账号为', // 弹出层的标题
end: function(){ content: data.data['id'], // 弹出层显示返回的数据（图书证的ID）
//parent.location.reload(); end: function(){ // 弹出层关闭时触发
var index = parent.layer.getFrameIndex(window.name); //操作父页面 //parent.location.reload(); // 刷新父页面（已注释掉）
parent.layer.close(index); var index = parent.layer.getFrameIndex(window.name); // 获取当前iframe的索引
} parent.layer.close(index); // 关闭当前iframe
}); }
/*setTimeout(function(){ });
}else{
}, 500);*/ leyer.msg("添加失败"); // 如果状态码不是“0”，显示失败消息（有拼写错误，应为"layer.msg"）
}else{ }
leyer.msg("添加失败"); }
}
} });
return false; // 阻止表单默认提交
}); })
return false;
}) });
});
</script> </script>
</body> </body>
</html> </html>

155
WebContent/admin/cardborrow.jsp
Unescape View File

@ -1,83 +1,90 @@
<%@page import="javabean.Util"%> <%@page import="javabean.Util"%> <!-- 导入Util类，用于处理日期等工具类 -->
<%@page import="java.sql.PreparedStatement"%> <%@page import="java.sql.PreparedStatement"%> <!-- 导入PreparedStatement类，用于执行SQL语句 -->
<%@page import="java.sql.Connection"%> <%@page import="java.sql.Connection"%> <!-- 导入Connection类，用于建立数据库连接 -->
<%@page import="javabean.Base"%> <%@page import="javabean.Base"%> <!-- 导入Base类，可能包含数据库连接的获取方法 -->
<%@page import="java.sql.ResultSet"%> <%@page import="java.sql.ResultSet"%> <!-- 导入ResultSet类，用于存储查询结果 -->
<%@page import="javabean.JDBCBean"%> <%@page import="javabean.JDBCBean"%> <!-- 导入JDBCBean类，用于数据库操作（未使用，可能是冗余） -->
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%> <!-- 设置页面语言为Java，字符编码为UTF-8,设置页面的字符编码为UTF-8 -->
<!DOCTYPE html> <!DOCTYPE html> <!-- 声明文档类型为HTML5 -->
<html> <html> <!-- 开始HTML文档 -->
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8"> <!-- 设置页面字符编码为UTF-8 -->
<title>借阅证借阅记录</title> <title>借阅证借阅记录</title> <!-- 设置页面标题为“借阅证借阅记录” -->
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <!-- 引入layui的CSS文件 -->
<script src="../public/layui/layui.js" charset="utf-8"></script> <script src="../public/layui/layui.js" charset="utf-8"></script> <!-- 引入layui的JS文件 -->
<style> <style>
.layui-table,.layui-table-view{ .layui-table,.layui-table-view{ <!-- 定义表格样式 -->
margin: 0 0px; margin: 0 0px; <!-- 设置表格的外边距为0 -->
} }
</style> </style>
</head> </head>
<body> <body>
<% <%
String id = request.getParameter("id"); // 获取请求参数"id"（即借阅证号）
Connection connection = (Connection)Base.getConnection(); String id = request.getParameter("id");
String sql = "select * from borrow_books,books where card_id=? and borrow_books.book_id = books.id"; // 获取数据库连接
PreparedStatement pstmt = connection.prepareStatement(sql); Connection connection = (Connection)Base.getConnection();
pstmt.setString(1, id); // 定义SQL查询语句，查询借阅记录和对应书籍信息
ResultSet resultSet = null; String sql = "select * from borrow_books,books where card_id=? and borrow_books.book_id = books.id";
resultSet = pstmt.executeQuery(); // 创建PreparedStatement对象，准备执行查询语句
PreparedStatement pstmt = connection.prepareStatement(sql);
// 设置SQL语句中的占位符参数
pstmt.setString(1, id);
// 执行查询，获取结果集
ResultSet resultSet = null;
resultSet = pstmt.executeQuery();
%> %>
<div class="layui-form"> <div class="layui-form">
<table class="layui-table"> <table class="layui-table"> <!-- 创建layui样式的表格 -->
<colgroup> <colgroup> <!-- 设置列宽 -->
<col width="150"> <col width="150">
<col width="150"> <col width="150">
<col width="200"> <col width="200">
<col width="200"> <col width="200">
<col width="200"> <col width="200">
<col width="200"> <col width="200">
<col width="220"> <col width="220">
<col width="200"> <col width="200">
<col> <col> <!-- 最后一列自动调整宽度 -->
</colgroup> </colgroup>
<thead> <thead>
<tr> <tr>
<th>ID</th> <th>ID</th> <!-- 列标题：ID -->
<th>书籍ID</th> <th>书籍ID</th> <!-- 列标题：书籍ID -->
<th>书籍名</th> <th>书籍名</th> <!-- 列标题：书籍名 -->
<th>借阅时间</th> <th>借阅时间</th> <!-- 列标题：借阅时间 -->
<th>截止时间</th> <th>截止时间</th> <!-- 列标题：截止时间 -->
<th>归还时间</th> <th>归还时间</th> <!-- 列标题：归还时间 -->
<th>违规信息</th> <th>违规信息</th> <!-- 列标题：违规信息 -->
<th>处理人</th> <th>处理人</th> <!-- 列标题：处理人 -->
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<% <%
System.out.println(Util.getCurrentTimeString()); // 输出当前时间，用于调试
%> System.out.println(Util.getCurrentTimeString());
<% while(resultSet.next()){ %> %>
<%-- 图书超期 --%> <% while(resultSet.next()){ %> <!-- 循环遍历查询结果集 -->
<%if(Util.getFormatDateTime(resultSet.getString("end_date")).compareTo(Util.getCurrentTimeString()) < 0 && resultSet.getString("return_date") == null){ %> <%-- 判断借阅书籍是否超期，且未归还 --%>
<tr style="color:#FF5722;"> <%if(Util.getFormatDateTime(resultSet.getString("end_date")).compareTo(Util.getCurrentTimeString()) < 0 && resultSet.getString("return_date") == null){ %> <!-- 如果借阅截止时间早于当前时间且未归还 -->
<%} else{ %> <tr style="color:#FF5722;"> <!-- 高亮显示，设置行文字颜色为橙色 -->
<tr> <%} else{ %>
<%} %> <tr> <!-- 正常显示，不做样式修改 -->
<td><%=resultSet.getString("card_id") %></td> <%} %>
<td><%=resultSet.getString("book_id") %></td> <td><%=resultSet.getString("card_id") %></td> <!-- 显示借阅证ID -->
<td><%=resultSet.getString("books.name") %></td> <td><%=resultSet.getString("book_id") %></td> <!-- 显示书籍ID -->
<td><%=Util.getFormatDateTime(resultSet.getString("borrow_date")) %></td> <td><%=resultSet.getString("books.name") %></td> <!-- 显示书籍名称 -->
<td><%=Util.getFormatDateTime(resultSet.getString("end_date"))%></td> <td><%=Util.getFormatDateTime(resultSet.getString("borrow_date")) %></td> <!-- 显示借阅日期 -->
<td><%=resultSet.getString("return_date")!=null?Util.getFormatDateTime(resultSet.getString("return_date")) : "未归还" %></td> <td><%=Util.getFormatDateTime(resultSet.getString("end_date"))%></td> <!-- 显示借阅截止日期 -->
<td><%=resultSet.getString("illegal")!=null?resultSet.getString("illegal"):""%></td> <td><%=resultSet.getString("return_date")!=null?Util.getFormatDateTime(resultSet.getString("return_date")) : "未归还" %></td> <!-- 如果归还日期不为空，则显示归还日期，否则显示“未归还” -->
<td><%=resultSet.getString("manager_id")!=null?resultSet.getString("manager_id"):"" %></td> <td><%=resultSet.getString("illegal")!=null?resultSet.getString("illegal"):""%></td> <!-- 显示违规信息，如果为空则显示空字符串 -->
</tr> <td><%=resultSet.getString("manager_id")!=null?resultSet.getString("manager_id"):"" %></td> <!-- 显示处理人ID，如果为空则显示空字符串 -->
<%} %> </tr>
</tbody> <%} %> <!-- 循环结束 -->
</table> </tbody>
</table>
</div> </div>
</body> </body>
</html> </html>

251
WebContent/admin/cardedit.jsp
Unescape View File

@ -1,144 +1,145 @@
<%@page import="javabean.Base"%> <%@page import="javabean.Base"%> <!-- 导入Base类，用于数据库连接等操作 -->
<%@page import="java.sql.ResultSet"%> <%@page import="java.sql.ResultSet"%> <!-- 导入ResultSet类，用于存储查询的结果 -->
<%@page import="java.sql.PreparedStatement"%> <%@page import="java.sql.PreparedStatement"%> <!-- 导入PreparedStatement类，用于执行预编译SQL语句 -->
<%@page import="java.sql.Connection"%> <%@page import="java.sql.Connection"%> <!-- 导入Connection类，用于管理数据库连接 -->
<%@page import="net.sf.json.JSONObject"%> <%@page import="net.sf.json.JSONObject"%> <!-- 导入JSONObject类，用于处理JSON对象 -->
<%@page import="net.sf.json.JSONArray"%> <%@page import="net.sf.json.JSONArray"%> <!-- 导入JSONArray类，用于处理JSON数组 -->
<%@page import="javabean.Admin"%> <%@page import="javabean.Admin"%> <!-- 导入Admin类，用于管理员相关操作 -->
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%> <!-- 设置页面的语言为Java，字符编码为UTF-8,设置页面的字符编码为UTF-8 -->
<!DOCTYPE html> <!DOCTYPE html> <!-- 声明文档类型为HTML5 -->
<html> <html> <!-- 开始HTML文档 -->
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8"> <!-- 设置页面字符编码为UTF-8 -->
<title>图书证修改</title> <title>图书证修改</title> <!-- 页面标题设置为“图书证修改” -->
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <!-- 引入layui CSS样式 -->
<script src="../public/layui/layui.js" charset="utf-8"></script> <script src="../public/layui/layui.js" charset="utf-8"></script> <!-- 引入layui JavaScript库 -->
<style> <style>
.layui-form{ .layui-form{ <!-- 样式设置 -->
margin: 10px 20px; margin: 10px 20px; <!-- 设置表单的外边距 -->
} }
</style> </style>
</head> </head>
<body> <body>
<% <%
// 获取借阅证信息 // 获取借阅证ID参数
String id = request.getParameter("id"); String id = request.getParameter("id"); // 获取通过URL传递的“id”参数
// 初始化数据库连接及SQL语句
// 获取rule Connection connection = null; // 声明数据库连接对象
Connection connection = null; PreparedStatement pstmt = null; // 声明PreparedStatement对象，用于查询规则
PreparedStatement pstmt = null; PreparedStatement infoPstmt = null; // 声明PreparedStatement对象，用于查询借阅证信息
PreparedStatement infoPstmt = null; ResultSet ruleSet = null; // 声明ResultSet对象，用于存放规则查询结果
ResultSet ruleSet = null; ResultSet infoSet = null; // 声明ResultSet对象，用于存放借阅证信息查询结果
ResultSet infoSet = null; String sql = "select * from rules"; // 查询规则的SQL语句
String sql = "select * from rules"; String infoSql = "select * from borrow_card where id=?"; // 查询借阅证信息的SQL语句，使用占位符“?”
String infoSql = "select * from borrow_card where id=?"; String result = ""; // 初始化字符串变量result，用于存储结果
String result = "";
// 公用连接 // 获取数据库连接
connection = (Connection)Base.getConnection(); connection = (Connection)Base.getConnection(); // 调用Base类中的getConnection方法获取数据库连接
pstmt = connection.prepareStatement(sql); pstmt = connection.prepareStatement(sql); // 准备执行规则查询SQL语句
infoPstmt = connection.prepareStatement(infoSql); infoPstmt = connection.prepareStatement(infoSql); // 准备执行借阅证信息查询SQL语句
infoPstmt.setString(1,id); infoPstmt.setString(1, id); // 设置查询借阅证信息SQL语句中的ID参数
infoSet = infoPstmt.executeQuery(); infoSet = infoPstmt.executeQuery(); // 执行查询并获取结果集
infoSet.next(); infoSet.next(); // 将结果集指针移动到查询的第一行
ruleSet = pstmt.executeQuery(); ruleSet = pstmt.executeQuery(); // 执行规则查询并获取结果集
%> %>
<form class="layui-form layui-form-pane" action="" lay-filter="cardFilter">
<form class="layui-form layui-form-pane" action="" lay-filter="cardFilter"> <!-- 创建layui表单，添加lay-filter属性用于过滤表单 -->
<!-- 账号 -->
<div class="layui-form-item"> <!-- 账号 -->
<label class="layui-form-label">账号</label> <div class="layui-form-item"> <!-- 表单项 -->
<div class="layui-input-block"> <label class="layui-form-label">账号</label> <!-- 标签显示为“账号” -->
<input type="text" name="id" value=<%=id %> class="layui-input" disabled> <div class="layui-input-block"> <!-- 输入框容器 -->
<input type="text" name="id" value=<%=id %> class="layui-input" disabled> <!-- 显示账号，值为Java中传递的id参数，且设置为不可编辑 -->
</div>
</div> </div>
</div>
<!-- 姓名 -->
<!-- 姓名 --> <div class="layui-form-item"> <!-- 表单项 -->
<div class="layui-form-item"> <label class="layui-form-label">姓名</label> <!-- 标签显示为“姓名” -->
<label class="layui-form-label">姓名</label> <div class="layui-input-block"> <!-- 输入框容器 -->
<div class="layui-input-block"> <input type="text" name="reader" value=<%=infoSet.getString("reader") %> lay-verify="required" autocomplete="off" placeholder="请输入姓名" class="layui-input"> <!-- 姓名输入框，默认值为数据库查询到的reader字段值，且设置为必填 -->
<input type="text" name="reader" value=<%=infoSet.getString("reader") %> lay-verify="required" autocomplete="off" placeholder="请输入姓名" class="layui-input"> </div>
</div> </div>
</div>
<!-- 密码 -->
<!-- 密码 --> <div class="layui-form-item"> <!-- 表单项 -->
<div class="layui-form-item"> <label class="layui-form-label">密码</label> <!-- 标签显示为“密码” -->
<label class="layui-form-label">密码</label> <div class="layui-input-block"> <!-- 输入框容器 -->
<div class="layui-input-block"> <input type="password" name="password" value=<%=infoSet.getString("password") %> placeholder="请输入密码" autocomplete="off" class="layui-input" lay-verify="required"> <!-- 密码输入框，默认值为数据库查询到的password字段值，且设置为必填 -->
<input type="password" name="password" value=<%=infoSet.getString("password") %> placeholder="请输入密码" autocomplete="off" class="layui-input" lay-verify="required"> </div>
</div> </div>
</div>
<!-- 借阅规则 -->
<!-- 借阅规则 --> <div class="layui-form-item"> <!-- 表单项 -->
<div class="layui-form-item"> <label class="layui-form-label">规则</label> <!-- 标签显示为“规则” -->
<label class="layui-form-label">规则</label> <div class="layui-input-block"> <!-- 输入框容器 -->
<div class="layui-input-block"> <select name="rule_id" lay-filter="rule_id" lay-verify="required"> <!-- 下拉框，显示借阅规则 -->
<select name="rule_id" lay-filter="rule_id" lay-verify="required"> <% while(ruleSet.next()){ %> <!-- 遍历所有查询到的规则 -->
<% while(ruleSet.next()){ %> <option value=<%=ruleSet.getString("id") %> <%if(ruleSet.getString("id").equals(infoSet.getString("rule_id"))) out.print("selected"); %>><%=ruleSet.getString("id") %></option> <!-- 显示规则ID，如果当前规则ID和借阅证规则ID一致，则选中此项 -->
<option value=<%=ruleSet.getString("id") %> <%if(ruleSet.getString("id").equals(infoSet.getString("rule_id"))) out.print("selected"); %>><%=ruleSet.getString("id") %></option> <%} %>
<%} %> </select>
</select> </div>
</div> </div>
</div>
<div class="layui-form-item"> <!-- 表单项 -->
<div class="layui-form-item"> <label class="layui-form-label">状态</label> <!-- 标签显示为“状态” -->
<label class="layui-form-label">状态</label> <div class="layui-input-block"> <!-- 输入框容器 -->
<div class="layui-input-block"> <input type="radio" name="status" value="1" title="可用" <%if(infoSet.getString("status").equals("1")) out.print("checked"); %>> <!-- 如果借阅证状态为“可用”，则选中该项 -->
<input type="radio" name="status" value="1" title="可用" <%if(infoSet.getString("status").equals("1")) out.print("checked"); %>> <input type="radio" name="status" value="0" title="挂失" <%if(infoSet.getString("status").equals("0")) out.print("checked"); %>> <!-- 如果借阅证状态为“挂失”，则选中该项 -->
<input type="radio" name="status" value="0" title="挂失" <%if(infoSet.getString("status").equals("0")) out.print("checked"); %>> </div>
</div> </div>
</div>
<div class="layui-form-item"> <!-- 表单项 -->
<div class="layui-form-item"> <div class="layui-input-block"> <!-- 按钮容器 -->
<div class="layui-input-block"> <button class="layui-btn" lay-submit="" lay-filter="submitForm">立即提交</button> <!-- 提交按钮 -->
<button class="layui-btn" lay-submit="" lay-filter="submitForm">立即提交</button> <button type="reset" class="layui-btn layui-btn-primary">重置</button> <!-- 重置按钮 -->
<button type="reset" class="layui-btn layui-btn-primary">重置</button> </div>
</div> </div>
</div>
</form> </form>
<script> <script>
layui.use(['form', 'jquery'], function(){ layui.use(['form', 'jquery'], function(){ <!-- 使用layui的form和jquery模块 -->
var form = layui.form var form = layui.form <!-- 获取form模块 -->
,layer = layui.layer; ,layer = layui.layer; <!-- 获取layer模块 -->
$ = layui.jquery; $ = layui.jquery; <!-- 获取jQuery对象 -->
// 提交表单 // 提交表单
form.on('submit(submitForm)', function(data){ form.on('submit(submitForm)', function(data){ <!-- 监听提交按钮的点击事件 -->
$.ajax({ $.ajax({ <!-- 发送AJAX请求 -->
url: './cardEdit', url: './cardEdit', <!-- 请求的URL -->
type: 'post', type: 'post', <!-- 请求方式为POST -->
data: data.field, data: data.field, <!-- 提交的数据为表单数据 -->
dataType: 'json', dataType: 'json', <!-- 返回的数据格式为JSON -->
timeout : 3000, timeout : 3000, <!-- 设置请求的超时时间为3000毫秒 -->
success: function(data){ success: function(data){ <!-- 请求成功时的回调函数 -->
if(data.code == "0"){ if(data.code == "0"){ <!-- 如果返回的数据中的code为0，表示操作成功 -->
layer.msg("修改成功", { layer.msg("修改成功", { <!-- 弹出提示框，提示修改成功 -->
icon: 6, icon: 6,
anim: 5, anim: 5,
time: 500, time: 500, <!-- 设置提示框显示时间为500毫秒 -->
}); });
setTimeout(function(){ setTimeout(function(){ <!-- 延时关闭当前窗口 -->
var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引 var index = parent.layer.getFrameIndex(window.name); <!-- 获取当前iframe层的索引 -->
parent.layer.close(index); //再执行关闭 parent.layer.close(index); <!-- 关闭当前iframe层 -->
}, 500) }, 500) <!-- 延时500毫秒后执行关闭操作 -->
}else{ }else{ <!-- 如果返回的数据中的code不为0，表示操作失败 -->
leyer.msg("修改失败"); leyer.msg("修改失败"); <!-- 弹出提示框，提示修改失败 -->
} }
}, },
error: function(){ error: function(){ <!-- 请求失败时的回调函数 -->
layer.msg("获取超时"); layer.msg("获取超时"); <!-- 弹出提示框，提示请求超时 -->
} }
});
return false; <!-- 阻止表单的默认提交行为 -->
})
}); });
return false;
})
});
</script> </script>
<% <%
Base.closeResource(connection, pstmt, ruleSet); Base.closeResource(connection, pstmt, ruleSet); // 关闭数据库资源
%> %>
</body> </body>
</html> </html>

339
WebContent/admin/cardlist.jsp
Unescape View File

@ -1,181 +1,180 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%> <!-- 设置页面的语言为Java，字符编码为UTF-8,设置页面的字符编码为UTF-8 -->
<!DOCTYPE html> <!DOCTYPE html> <!-- 声明文档类型为HTML5 -->
<html lang="en"> <html lang="en"> <!-- 定义页面的语言为英文 -->
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8"> <!-- 设置页面字符编码为UTF-8 -->
<title>借阅卡</title> <title>借阅卡</title> <!-- 设置页面的标题为“借阅卡” -->
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <!-- 引入layui的CSS文件 -->
<style> <style>
.layui-table,.layui-table-view{ .layui-table,.layui-table-view{ <!-- 自定义表格样式 -->
margin: 0 0px; margin: 0 0px; <!-- 设置表格的外边距为0 -->
} }
</style> </style>
</head> </head>
<body> <body>
<!-- 表单 --> <!-- 表单 -->
<table class="layui-hide" id="cardTable" lay-filter="formFilter"></table> <table class="layui-hide" id="cardTable" lay-filter="formFilter"></table> <!-- 设置一个隐藏的表格元素，表格的ID为"cardTable" -->
<script src="../public/layui/layui.js" charset="utf-8"></script> <script src="../public/layui/layui.js" charset="utf-8"></script> <!-- 引入layui的JS文件 -->
<!-- 头部工具栏 --> <!-- 头部工具栏 -->
<script type="text/html" id="headBar"> <script type="text/html" id="headBar">
条件搜索： 条件搜索： <!-- 搜索框的标签 -->
<div class="layui-inline"> <div class="layui-inline"> <!-- 表单项 -->
<select id="condition" name="condition" lay-verify="required"> <select id="condition" name="condition" lay-verify="required"> <!-- 条件选择框，用于选择搜索字段 -->
<option value=""></option> <option value=""></option> <!-- 默认选项 -->
<option value="id">ID</option> <option value="id">ID</option> <!-- 搜索条件：ID -->
<option value="reader">姓名</option> <option value="reader">姓名</option> <!-- 搜索条件：姓名 -->
<option value="rule_id">借阅规则</option> <option value="rule_id">借阅规则</option> <!-- 搜索条件：借阅规则 -->
<option value="status">状态</option> <option value="status">状态</option> <!-- 搜索条件：状态 -->
</select> </select>
</div> </div>
<div class="layui-inline"> <div class="layui-inline"> <!-- 表单项 -->
<input class="layui-input" id="conditionValue" name="conditionValue" id="demoReload" autocomplete="off" placeholder="请输入搜索内容"> <input class="layui-input" id="conditionValue" name="conditionValue" id="demoReload" autocomplete="off" placeholder="请输入搜索内容"> <!-- 输入框，用于输入搜索的内容 -->
</div> </div>
<button class="layui-btn" name="condition" data-type="reload" lay-event="search">搜索</button> <button class="layui-btn" name="condition" data-type="reload" lay-event="search">搜索</button> <!-- 搜索按钮 -->
<button type="button" class="layui-btn layui-btn-sm" lay-event="add"><i class="layui-icon">添加借阅证</i></button> <button type="button" class="layui-btn layui-btn-sm" lay-event="add"><i class="layui-icon">添加借阅证</i></button> <!-- 添加借阅证按钮 -->
</script> </script>
<!-- 表格侧边栏的操作 --> <!-- 表格侧边栏的操作 -->
<script type="text/html" id="operateBar"> <script type="text/html" id="operateBar">
<a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="cardBorrow">查看借阅</a> <a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="cardBorrow">查看借阅</a> <!-- 查看借阅历史按钮 -->
<a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a> <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a> <!-- 编辑借阅证按钮 -->
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a> <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a> <!-- 删除借阅证按钮 -->
</script> </script>
<!-- 状态模板 --> <!-- 状态模板 -->
<script type="text/html" id="statusTpl"> <script type="text/html" id="statusTpl">
{{# if(d.status == 0){ }} {{# if(d.status == 0){ }} <!-- 如果借阅证状态为0（挂失） -->
<span style="color:red">挂失<span> <span style="color:red">挂失<span> <!-- 显示“挂失”文本，颜色为红色 -->
{{# } else { }} {{# } else { }} <!-- 否则 -->
可用 可用 <!-- 显示“可用”状态 -->
{{# } }} {{# } }}
</script> </script>
<script> <script>
layui.use(['table','jquery'], function(){ layui.use(['table','jquery'], function(){ <!-- 引入layui的表格和jquery模块 -->
$ = layui.jquery; $ = layui.jquery; <!-- 使用jQuery -->
var table = layui.table; var table = layui.table; <!-- 获取layui的表格模块 -->
// 进行渲染 // 进行渲染
var tableIns = table.render({ var tableIns = table.render({
elem: '#cardTable' elem: '#cardTable' <!-- 表格的元素ID -->
,url:'./cardList' ,url:'./cardList' <!-- 请求数据的URL -->
,toolbar: '#headBar' ,toolbar: '#headBar' <!-- 设置表格的头部工具栏 -->
,height: 600 ,height: 600 <!-- 设置表格的高度为600px -->
,cols: [[ ,cols: [[ <!-- 表格的列设置 -->
{field:'id', width:180, title: 'ID', sort: true} {field:'id', width:180, title: 'ID', sort: true} <!-- 显示ID列，支持排序 -->
,{field:'reader', width:180, title: '用户名', sort: true} ,{field:'reader', width:180, title: '用户名', sort: true} <!-- 显示用户名列，支持排序 -->
,{field:'rule_id', width:180, title: '借阅规则', sort: true} ,{field:'rule_id', width:180, title: '借阅规则', sort: true} <!-- 显示借阅规则列，支持排序 -->
,{field:'status', width:180, title: '状态', templet: '#statusTpl'} ,{field:'status', width:180, title: '状态', templet: '#statusTpl'} <!-- 显示状态列，使用模板显示“挂失”或“可用” -->
,{fixed: 'right', title:'操作', toolbar: '#operateBar', align: 'center', width:250} ,{fixed: 'right', title:'操作', toolbar: '#operateBar', align: 'center', width:250} <!-- 显示操作列，固定在右侧，使用自定义工具栏 -->
]] ]]
,page: true ,page: true <!-- 启用分页 -->
});
// 头部工具栏事件
table.on('toolbar(formFilter)', function(obj){
var checkStatus = table.checkStatus(obj.config.id);
switch(obj.event){
// 条件查找图书证
case 'search':
var conditionValue = $('#conditionValue');
var condition = $('#condition');
// 进行搜索，重新渲染
tableIns.reload({
where: { //设定异步数据接口的额外参数，任意设
"condition": condition.val(),
"conditionValue": conditionValue.val()
}
,page: {
curr: 1 //重新从第 1 页开始
}
});
break;
// 添加借书证
case 'add':
var addCardLayer = layer.open({
type: 2,
title: '添加借书证',
area: ['800px', '500px'],
maxmin: true,
shadeClose: true,
content: 'cardadd.jsp',
end: function(){
$('.layui-laypage-btn').click();
}
});
//layer.full(addCardLayer);
};
}); });
// 侧边工具栏事件 // 头部工具栏事件
table.on(('tool(formFilter)'), function(obj){ table.on('toolbar(formFilter)', function(obj){ <!-- 监听头部工具栏的操作 -->
var data = obj.data; var checkStatus = table.checkStatus(obj.config.id); <!-- 获取选中的行 -->
var layEvent = obj.event; switch(obj.event){ <!-- 根据事件执行不同的操作 -->
var tr = obj.tr; // 条件查找借阅证
var id = data.id; case 'search':
switch(obj.event){ var conditionValue = $('#conditionValue'); <!-- 获取输入框中的搜索内容 -->
case 'edit': var condition = $('#condition'); <!-- 获取条件选择框的值 -->
layer.open({ // 进行搜索，重新渲染表格
type: 2, tableIns.reload({
title: '更改信息', where: { // 设置异步数据接口的额外参数
area: ['800px', '600px'], "condition": condition.val(),
maxmin: true, "conditionValue": conditionValue.val()
shadeClose: true, }
content: 'cardedit.jsp?id=' +id, ,page: {
end: function(){ curr: 1 // 重新从第1页开始
$(".layui-laypage-btn").click(); }
} });
}) break;
// 添加借阅证
break; case 'add':
case 'del': var addCardLayer = layer.open({ <!-- 打开一个新窗口，用于添加借阅证 -->
layer.confirm('确认删除么?<br><span style="color:red;">这将删除该借阅证的所有记录</span>',function(index){ type: 2,
layer.close(index); title: '添加借阅证',
$.ajax({ area: ['800px', '500px'],
url: './cardDel', maxmin: true,
type: 'get', shadeClose: true,
data: 'id=' +id, content: 'cardadd.jsp', <!-- 加载添加借阅证页面 -->
dataType: 'json', end: function(){
timeout: 3000, $('.layui-laypage-btn').click(); <!-- 关闭窗口后刷新当前页 -->
success: function(data){ }
if(data.code == 0){ });
console.log(data);
layer.msg(data.msg,{ //layer.full(addCardLayer); <!-- 注释掉的代码，可能是为了最大化窗口 -->
icon: 6, };
time: 1500 });
})
// 还是本页数据 // 侧边工具栏事件
$(".layui-laypage-btn").click(); table.on(('tool(formFilter)'), function(obj){ <!-- 监听侧边工具栏操作 -->
}else{ var data = obj.data; <!-- 获取当前行的数据 -->
layer.open({ var layEvent = obj.event; <!-- 获取当前事件 -->
title: '失败', var tr = obj.tr; <!-- 获取当前行的tr元素 -->
content: data.msg var id = data.id; <!-- 获取当前行的ID -->
}) switch(obj.event){ <!-- 根据事件执行不同的操作 -->
} case 'edit':
}, layer.open({ <!-- 打开编辑窗口 -->
error: function(){ type: 2,
layer.msg("连接超时"); title: '更改信息',
} area: ['800px', '600px'],
}) maxmin: true,
shadeClose: true,
}) content: 'cardedit.jsp?id=' +id, <!-- 加载编辑借阅证页面，并传递ID -->
break; end: function(){
case 'cardBorrow': $(".layui-laypage-btn").click(); <!-- 刷新当前页 -->
layer.open({ }
type: 2, })
title: '借阅历史', break;
area: ['800px', '600px'], case 'del':
maxmin: true, layer.confirm('确认删除么?<br><span style="color:red;">这将删除该借阅证的所有记录</span>',function(index){ <!-- 弹出删除确认框 -->
shadeClose: true, layer.close(index); <!-- 关闭确认框 -->
content: 'cardborrow.jsp?id=' +id, $.ajax({
end: function(){ url: './cardDel', <!-- 发送删除请求 -->
//$(".layui-laypage-btn").click(); type: 'get',
} data: 'id=' +id, <!-- 传递要删除的ID -->
}) dataType: 'json',
} timeout: 3000, <!-- 设置超时时间为3000毫秒 -->
}) success: function(data){ <!-- 请求成功后的回调函数 -->
if(data.code == 0){ <!-- 如果删除成功 -->
console.log(data); <!-- 输出删除结果 -->
layer.msg(data.msg,{ <!-- 显示删除成功的消息 -->
icon: 6,
time: 1500
})
// 还是本页数据
$(".layui-laypage-btn").click(); <!-- 刷新当前页 -->
}else{ <!-- 如果删除失败 -->
layer.open({
title: '失败',
content: data.msg <!-- 显示错误信息 -->
})
}
},
error: function(){ <!-- 请求失败的回调函数 -->
layer.msg("连接超时"); <!-- 显示超时信息 -->
}
})
})
break;
case 'cardBorrow':
layer.open({ <!-- 打开借阅历史窗口 -->
type: 2,
title: '借阅历史',
area: ['800px', '600px'],
maxmin: true,
shadeClose: true,
content: 'cardborrow.jsp?id=' +id, <!-- 加载借阅历史页面，并传递ID -->
end: function(){
//$(".layui-laypage-btn").click(); <!-- 此处可能是未使用的代码 -->
}
})
}
})
}); });
</script> </script>
</body> </body>
</html> </html>

129
WebContent/admin/index.jsp
Unescape View File

@ -1,95 +1,96 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%> // 页面编码为UTF-8，确保中文等字符显示正确
<!DOCTYPE html>
<html lang="en"> <!DOCTYPE html> // 定义文档类型为HTML5
<html lang="en"> // 开始HTML文档，指定语言为英语
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8"> // 定义文档的字符编码为UTF-8
<title>系统管理员</title> <title>系统管理员</title> // 页面标题，显示在浏览器标签上
<!-- layui --> <!-- layui -->
<link rel="stylesheet" href="../public/layui/css/layui.css"> <link rel="stylesheet" href="../public/layui/css/layui.css"> // 引入layui的CSS文件，用于页面样式
<script src="../public/layui/layui.js"></script> <script src="../public/layui/layui.js"></script> // 引入layui的JavaScript文件
</head> </head>
<body class="layui-layout-body"> <body class="layui-layout-body"> // 定义页面主体部分，应用layui的布局样式
<div class="layui-layout layui-layout-admin"> <div class="layui-layout layui-layout-admin"> // layui框架的布局容器，管理后台使用
<div class="layui-header"> <div class="layui-header"> // 头部区域
<div class="layui-logo">系统管理员</div> <div class="layui-logo">系统管理员</div> // 左侧logo，显示为“系统管理员”
<!-- 头部区域（可配合layui已有的水平导航） --> <!-- 头部区域（可配合layui已有的水平导航） -->
<ul class="layui-nav layui-layout-left"> <ul class="layui-nav layui-layout-left"> // 头部导航栏（左侧）
<li class="layui-nav-item"><a href="">首页</a></li> <li class="layui-nav-item"><a href="">首页</a></li> // 首页导航项
<li class="layui-nav-item"> <li class="layui-nav-item"> // 其他系统菜单
<a href="javascript:;">其它系统</a> <a href="javascript:;">其它系统</a>
<dl class="layui-nav-child"> <dl class="layui-nav-child"> // 下拉菜单
<dd><a href="../reader/04readerFrame.jsp">图书馆首页</a></dd> <dd><a href="../reader/04readerFrame.jsp">图书馆首页</a></dd> // 图书馆首页
<dd><a href="../loginManager.html">图书管理员</a></dd> <dd><a href="../loginManager.html">图书管理员</a></dd> // 图书管理员链接
</dl> </dl>
</li> </li>
</ul> </ul>
<ul class="layui-nav layui-layout-right"> <ul class="layui-nav layui-layout-right"> // 头部导航栏（右侧）
<li class="layui-nav-item"> <li class="layui-nav-item"> // 右侧用户信息菜单
<a href="javascript:;"> <a href="javascript:;">
<img src="http://t.cn/RCzsdCq" class="layui-nav-img"> <img src="http://t.cn/RCzsdCq" class="layui-nav-img"> // 用户头像
系统管理员 系统管理员 // 用户名
</a> </a>
<dl class="layui-nav-child"> <dl class="layui-nav-child"> // 下拉菜单
<dd id="updatePassword"><a href="javascript:;">修改密码</a></dd> <dd id="updatePassword"><a href="javascript:;">修改密码</a></dd> // 修改密码项
</dl> </dl>
</li> </li>
<li class="layui-nav-item"><a href="./logOut">退出</a></li> <li class="layui-nav-item"><a href="./logOut">退出</a></li> // 退出按钮，跳转到退出页面
</ul> </ul>
</div> </div>
<div class="layui-side layui-bg-black"> <div class="layui-side layui-bg-black"> // 左侧导航栏区域，背景色为黑色
<div class="layui-side-scroll"> <div class="layui-side-scroll"> // 左侧导航区域的滚动部分
<!-- 左侧导航区域（可配合layui已有的垂直导航） --> <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
<ul class="layui-nav layui-nav-tree" lay-filter="test"> <ul class="layui-nav layui-nav-tree" lay-filter="test"> // 使用layui的树形导航
<li class="layui-nav-item layui-nav-itemed"> <li class="layui-nav-item layui-nav-itemed"> // 书籍管理菜单项，已选中
<a class="" href="./booklist.jsp" target="content"><i class="layui-icon layui-icon-read" style="font-size: 16px; color: #1E9FFF;"></i> 书籍管理</a> <a class="" href="./booklist.jsp" target="content"><i class="layui-icon layui-icon-read" style="font-size: 16px; color: #1E9FFF;"></i> 书籍管理</a> // 书籍管理菜单项
</li> </li>
<li class="layui-nav-item layui-nav-itemed"> <li class="layui-nav-item layui-nav-itemed"> // 书籍类型管理菜单项，已选中
<a class="" href="./sortlist.jsp" target="content"><i class="layui-icon layui-icon-tabs" style="font-size: 16px; color: #1E9FFF;"></i> 书籍类型</a> <a class="" href="./sortlist.jsp" target="content"><i class="layui-icon layui-icon-tabs" style="font-size: 16px; color: #1E9FFF;"></i> 书籍类型</a> // 书籍类型菜单项
</li> </li>
<li class="layui-nav-item"> <li class="layui-nav-item"> // 借阅证管理菜单项
<a href="./cardlist.jsp" target="content"><i class="layui-icon layui-icon-template-1" style="font-size: 16px; color: #1E9FFF;"> </i>借阅证管理</a> <a href="./cardlist.jsp" target="content"><i class="layui-icon layui-icon-template-1" style="font-size: 16px; color: #1E9FFF;"> </i>借阅证管理</a> // 借阅证管理菜单项
</li> </li>
<li class="layui-nav-item"><a href="./borrowlist.jsp" target="content"><i class="layui-icon layui-icon-chart-screen" style="font-size: 16px; color: #1E9FFF;"></i> 借阅信息查询</a></li> <li class="layui-nav-item"><a href="./borrowlist.jsp" target="content"><i class="layui-icon layui-icon-chart-screen" style="font-size: 16px; color: #1E9FFF;"></i> 借阅信息查询</a></li> // 借阅信息查询菜单项
<li class="layui-nav-item"><a href="./rulelist.jsp" target="content"><i class="layui-icon layui-icon-file-b" style="font-size: 16px; color: #1E9FFF;"> </i>借阅规则管理</a></li> <li class="layui-nav-item"><a href="./rulelist.jsp" target="content"><i class="layui-icon layui-icon-file-b" style="font-size: 16px; color: #1E9FFF;"> </i>借阅规则管理</a></li> // 借阅规则管理菜单项
<li class="layui-nav-item"><a href="./managerlist.jsp" target="content"><i class="layui-icon layui-icon-group" style="font-size: 16px; color: #1E9FFF;"></i>图书管理员管理</a></li> <li class="layui-nav-item"><a href="./managerlist.jsp" target="content"><i class="layui-icon layui-icon-group" style="font-size: 16px; color: #1E9FFF;"></i>图书管理员管理</a></li> // 图书管理员管理菜单项
<li class="layui-nav-item"><a href="./librarydata.jsp" target="content"><i class="layui-icon layui-icon-windows" style="font-size: 16px; color: #1E9FFF;"> </i>系统管理</a></li> <li class="layui-nav-item"><a href="./librarydata.jsp" target="content"><i class="layui-icon layui-icon-windows" style="font-size: 16px; color: #1E9FFF;"> </i>系统管理</a></li> // 系统管理菜单项
</ul> </ul>
</div> </div>
</div> </div>
<div class="layui-body"> <div class="layui-body"> // 页面内容区域
<!-- 内容主体区域 --> <!-- 内容主体区域 -->
<iframe src="librarydata.jsp" name="content" height="100%" width="100%" frameborder="0" scrolling="no"></iframe> <iframe src="librarydata.jsp" name="content" height="100%" width="100%" frameborder="0" scrolling="no"></iframe> // 嵌套iframe，加载系统管理页面内容
</div> </div>
<div class="layui-footer"> <div class="layui-footer"> // 底部区域
<!-- 底部固定区域 --> <!-- 底部固定区域 -->
© 图书管理系统 © 图书管理系统 // 底部版权声明
</div> </div>
</div> </div>
<script> <script>
//JavaScript代码区域 // JavaScript代码区域
layui.use(['element', 'jquery', 'layer'], function(){ layui.use(['element', 'jquery', 'layer'], function(){ // 使用layui的模块，包括element（元素模块）、jquery和layer（弹层模块）
$ = layui.jquery; $ = layui.jquery; // 引入jQuery
var element = layui.element var element = layui.element // 获取layui的element模块，用于操作元素
$ = layui.jquery; $ = layui.jquery; // 重新声明jQuery，防止覆盖
var form = layui.form var form = layui.form // 获取layui的form模块，用于表单操作
,layer = layui.layer; ,layer = layui.layer; // 获取layui的layer模块，用于弹层操作
$("#updatePassword").click(function(){ $("#updatePassword").click(function(){ // 点击“修改密码”时触发
layer.open({ layer.open({ // 打开一个新的层
title: '修改密码', title: '修改密码', // 层的标题
type: 2, type: 2, // 类型为iframe嵌入页面
area: ['300px', '300px'], area: ['300px', '300px'], // 层的宽高
maxmin: true, maxmin: true, // 可以最大化和最小化
shadeClose: true, shadeClose: true, // 点击遮罩关闭
content: 'updatePassword.jsp' content: 'updatePassword.jsp' // 层内加载的内容页面
}) })
}) })
}); });
</script> </script>
</body> </body>
</html> </html>

111
WebContent/admin/librarydata.jsp
Unescape View File

@ -1,62 +1,63 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%> // 页面编码为UTF-8，确保中文等字符显示正确
<!DOCTYPE html>
<html> <!DOCTYPE html> // 定义文档类型为HTML5
<html> // 开始HTML文档
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8"> // 定义文档的字符编码为UTF-8
<title>ECharts</title> <title>ECharts</title> // 页面标题，显示在浏览器标签上
<!-- 引入 echarts.js --> <!-- 引入 echarts.js -->
<script src="../public/js/echarts.min.js"></script> <script src="../public/js/echarts.min.js"></script> // 引入本地的echarts.js文件，用于图表渲染
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script> <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script> // 引入远程的jQuery库，提供AJAX等功能
</head> </head>
<body> <body>
<!-- 为ECharts准备一个具备大小（宽高）的Dom --> <!-- 为ECharts准备一个具备大小（宽高）的Dom -->
<div id="main" style="width:1200px;height:500px;"></div> <div id="main" style="width:1200px;height:500px;"></div> // 为ECharts图表提供一个容器，并设置其宽高
<script type="text/javascript"> <script type="text/javascript">
// 基于准备好的dom，初始化echarts实例 // 基于准备好的dom，初始化echarts实例
var myChart = echarts.init(document.getElementById('main')); var myChart = echarts.init(document.getElementById('main')); // 使用ID为'main'的DOM元素初始化ECharts实例
// 指定图表的配置项和数据
myChart.setOption({
title: {
text: '借书情况' // 设置图表标题为“借书情况”
},
tooltip: {}, // 配置工具提示，默认启用
legend: {
data:['借书量'] // 设置图例，显示“借书量”
},
xAxis: {
data: [] // 设置x轴的数据，初始为空
},
yAxis: {}, // 配置y轴
series: [{
name: '借书量', // 设置系列的名称为“借书量”
type: 'line', // 设置图表类型为折线图
data: [] // 设置折线图的数据，初始为空
}]
});
// 使用刚指定的配置项和数据显示图表。
//myChart.setOption(option); // 注释掉的原始代码，用于设置配置项
// 指定图表的配置项和数据 // 异步加载数据
myChart.setOption({ $.get('./libraryData').done(function (data) { // 使用jQuery的get方法从'./libraryData'接口异步请求数据
title: { if(data.code == 0){ // 判断返回的数据是否成功（code == 0）
text: '借书情况' // 填入数据
}, myChart.setOption({
tooltip: {}, xAxis: {
legend: { data: data.data.days // 设置x轴的数据为接口返回的days数组
data:['借书量'] },
}, series: [{
xAxis: { // 根据名字对应到相应的系列
data: [] name: '借书量', // 设置系列的名称为“借书量”
}, data: data.data.data, // 设置折线图的数据为接口返回的data数组
yAxis: {}, type: 'line' // 设置图表类型为折线图
series: [{ }]
name: '借书量', });
type: 'line', }else{
data: [] $('body').append($("<div style='color:red;'>调用接口失败</div>")); // 如果接口调用失败，显示错误信息
}] }
}); });
// 使用刚指定的配置项和数据显示图表。 </script>
//myChart.setOption(option);
// 异步加载数据
$.get('./libraryData').done(function (data) {
if(data.code == 0){
// 填入数据
myChart.setOption({
xAxis: {
data: data.data.days
},
series: [{
// 根据名字对应到相应的系列
name: '借书量',
data: data.data.data,
type: 'line'
}]
});
}else{
$('body').append($("<div style='color:red;'>调用接口失败</div>"));
}
});
</script>
</body> </body>
</html> </html>

133
WebContent/admin/manageradd.jsp
Unescape View File

@ -1,90 +1,87 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%> // 设置页面编码为UTF-8，确保支持中文字符
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>管理员添加</title>
<!-- layui -->
<link rel="stylesheet" href="../public/layui/css/layui.css">
<script src="../public/layui/layui.js"></script>
<style>
.layui-form{
margin: 10px 20px;
}
</style> <!DOCTYPE html> // 定义文档类型为HTML5
<html> // 开始HTML文档
<head>
<meta charset="UTF-8"> // 定义文档的字符集为UTF-8
<title>管理员添加</title> // 页面标题，显示在浏览器标签页上
<!-- layui -->
<link rel="stylesheet" href="../public/layui/css/layui.css"> // 引入layui的CSS样式文件
<script src="../public/layui/layui.js"></script> // 引入layui的JS文件，提供UI交互功能
<style>
.layui-form{
margin: 10px 20px; // 设置表单的外边距
}
</style>
</head> </head>
</head> </head>
<body> <body>
<form class="layui-form layui-form-pane" action="" lay-filter="formFilter"> <form class="layui-form layui-form-pane" action="" lay-filter="formFilter"> // 使用layui的表单样式，lay-filter用于表单过滤
<div class="layui-form-item"> <div class="layui-form-item"> // 表单项容器
<label class="layui-form-label">姓名</label> <label class="layui-form-label">姓名</label> // 表单项标签，显示“姓名”
<div class="layui-input-block"> <div class="layui-input-block"> // 输入框容器
<input type="text" name="name" lay-verify="required" required autocomplete="off" placeholder="请输入姓名" class="layui-input"> <input type="text" name="name" lay-verify="required" required autocomplete="off" placeholder="请输入姓名" class="layui-input"> // 姓名输入框，设置必填验证
</div> </div>
</div> </div>
<div class="layui-form-item"> <div class="layui-form-item"> // 表单项容器
<label class="layui-form-label">账号</label> <label class="layui-form-label">账号</label> // 表单项标签，显示“账号”
<div class="layui-input-block"> <div class="layui-input-block"> // 输入框容器
<input type="text" name="account" lay-verify="required" placeholder="请输入账号" autocomplete="off" class="layui-input"> <input type="text" name="account" lay-verify="required" placeholder="请输入账号" autocomplete="off" class="layui-input"> // 账号输入框，设置必填验证
</div> </div>
</div> </div>
<div class="layui-form-item"> <div class="layui-form-item"> // 表单项容器
<label class="layui-form-label">密码</label> <label class="layui-form-label">密码</label> // 表单项标签，显示“密码”
<div class="layui-input-block"> <div class="layui-input-block"> // 输入框容器
<input type="password" name="password" lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input"> <input type="password" name="password" lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input"> // 密码输入框，设置必填验证
</div> </div>
</div> </div>
<div class="layui-form-item"> <div class="layui-form-item"> // 表单项容器
<label class="layui-form-label">邮箱</label> <label class="layui-form-label">邮箱</label> // 表单项标签，显示“邮箱”
<div class="layui-input-block"> <div class="layui-input-block"> // 输入框容器
<input type="text" name="email" lay-verify="required" placeholder="请输入邮箱" autocomplete="off" class="layui-input"> <input type="text" name="email" lay-verify="required" placeholder="请输入邮箱" autocomplete="off" class="layui-input"> // 邮箱输入框，设置必填验证
</div> </div>
</div> </div>
<div class="layui-form-item"> <div class="layui-form-item"> // 表单项容器
<div class="layui-input-block"> <div class="layui-input-block"> // 输入框容器
<button type="submit" class="layui-btn" lay-submit="" lay-filter="submitButton">立即提交</button> <button type="submit" class="layui-btn" lay-submit="" lay-filter="submitButton">立即提交</button> // 提交按钮，触发表单提交
</div> </div>
</div> </div>
</form> </form>
<script> <script>
// 使用layui的表单、jquery、layer模块
layui.use(['form', 'jquery'], function(){
$ = layui.jquery; // 使用jQuery库
var form = layui.form, // 获取layui表单模块
layer = layui.layer; // 获取layui弹层模块
layui.use(['form', 'jquery'], function(){ // 监听提交按钮点击事件
$ = layui.jquery; form.on('submit(submitButton)', function(data){
var form = layui.form $.ajax({ // 使用AJAX发送数据到后台
,layer = layui.layer url: './managerAdd', // 请求的URL路径
//监听提交 method: 'post', // 使用POST请求方式
form.on('submit(submitButton)', function(data){ data: data.field, // 获取表单数据
$.ajax({ dataType: 'json', // 设置响应数据格式为JSON
url: './managerAdd', success: function(data){ // 成功回调
method: 'post', if(data.code == "0"){ // 判断返回数据的code是否为"0"表示成功
data: data.field, parent.layer.msg("添加成功",{ // 使用父窗口的layer弹出提示框
dataType: 'json', icon: 6, // 图标类型为“成功”
success: function(data){ time: 500 // 显示500毫秒
if(data.code == "0"){ });
parent.layer.msg("添加成功",{ setTimeout(function(){ // 延时操作
icon: 6, parent.location.reload(); // 刷新父窗口
time: 500 }, 500);
}); }else{
setTimeout(function(){ layer.msg(data.msg); // 如果返回失败，弹出错误信息
parent.location.reload(); }
}, 500); }
}else{ })
layer.msg(data.msg); return false; // 阻止表单默认提交
} });
});
}
})
return false;
});
});
</script> </script>
</body> </body>
</html> </html>

164
WebContent/admin/manageredit.jsp
Unescape View File

@ -1,103 +1,109 @@
<%@page import="java.sql.ResultSet"%> <%@page import="java.sql.ResultSet"%> // 引入java.sql.ResultSet类，用于处理数据库查询结果集
<%@page import="java.sql.PreparedStatement"%> <%@page import="java.sql.PreparedStatement"%> // 引入java.sql.PreparedStatement类，用于执行数据库的SQL查询
<%@page import="java.sql.Connection"%> <%@page import="java.sql.Connection"%> // 引入java.sql.Connection类，用于连接数据库
<%@page import="javabean.Base"%> <%@page import="javabean.Base"%> // 引入自定义的Base类，用于数据库连接管理
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%> // 设置页面编码为UTF-8，确保能够支持中文字符
<!DOCTYPE html>
<html> <!DOCTYPE html> // 定义文档类型为HTML5
<html> // 开始HTML文档
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8"> // 设置页面字符编码为UTF-8
<title>管理员修改</title> <title>管理员修改</title> // 设置页面标题
<!-- layui --> <!-- layui -->
<link rel="stylesheet" href="../public/layui/css/layui.css"> <link rel="stylesheet" href="../public/layui/css/layui.css"> // 引入layui的CSS文件，提供UI样式
<script src="../public/layui/layui.js"></script> <script src="../public/layui/layui.js"></script> // 引入layui的JS文件，提供UI交互功能
<style> <style>
.layui-form{ .layui-form{ // 定义layui表单的样式
margin: 10px 20px; margin: 10px 20px; // 设置表单外边距
} }
</style> </style>
</head> </head>
</head> </head>
<body> <body>
<% <%
String id = request.getParameter("id"); // 获取页面传递的参数id
Connection connection = (Connection)Base.getConnection(); String id = request.getParameter("id");
String sql = "select * from manager where id=?"; // 获取数据库连接
PreparedStatement pstmt = connection.prepareCall(sql); Connection connection = (Connection)Base.getConnection();
pstmt.setString(1,id); // 编写SQL查询语句，获取管理员信息
ResultSet resultSet = pstmt.executeQuery(); String sql = "select * from manager where id=?";
resultSet.next(); // 创建PreparedStatement对象，防止SQL注入
PreparedStatement pstmt = connection.prepareCall(sql);
// 设置查询参数
pstmt.setString(1,id);
// 执行查询，获取结果集
ResultSet resultSet = pstmt.executeQuery();
// 移动结果集指针到第一行数据
resultSet.next();
%> %>
<form class="layui-form layui-form-pane" action="" lay-filter="formFilter"> <form class="layui-form layui-form-pane" action="" lay-filter="formFilter"> // 创建layui表单，设置表单过滤器
<input type="text" name="id" value=<%=id %> lay-verify="required" required autocomplete="off" placeholder="请输入姓名" class="layui-input layui-hide"> <input type="text" name="id" value=<%=id %> lay-verify="required" required autocomplete="off" placeholder="请输入姓名" class="layui-input layui-hide"> // 隐藏id输入框，用于传递修改的管理员ID
<div class="layui-form-item"> <div class="layui-form-item"> // 表单项容器
<label class="layui-form-label">姓名</label> <label class="layui-form-label">姓名</label> // 姓名标签
<div class="layui-input-block"> <div class="layui-input-block"> // 输入框容器
<input type="text" name="name" value=<%=resultSet.getString("name") %> lay-verify="required" required autocomplete="off" placeholder="请输入姓名" class="layui-input"> <input type="text" name="name" value=<%=resultSet.getString("name") %> lay-verify="required" required autocomplete="off" placeholder="请输入姓名" class="layui-input"> // 姓名输入框，填入从数据库中获取的管理员姓名
</div> </div>
</div> </div>
<div class="layui-form-item"> <div class="layui-form-item"> // 表单项容器
<label class="layui-form-label">账号</label> <label class="layui-form-label">账号</label> // 账号标签
<div class="layui-input-block"> <div class="layui-input-block"> // 输入框容器
<input type="text" name="account" value=<%=resultSet.getString("account") %> disabled lay-verify="required" placeholder="请输入账号" autocomplete="off" class="layui-input"> <input type="text" name="account" value=<%=resultSet.getString("account") %> disabled lay-verify="required" placeholder="请输入账号" autocomplete="off" class="layui-input"> // 账号输入框，显示从数据库中获取的管理员账号，禁用（不可编辑）
</div> </div>
</div> </div>
<div class="layui-form-item"> <div class="layui-form-item"> // 表单项容器
<label class="layui-form-label">密码</label> <label class="layui-form-label">密码</label> // 密码标签
<div class="layui-input-block"> <div class="layui-input-block"> // 输入框容器
<input type="password" name="password" value=<%=resultSet.getString("password") %> lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input"> <input type="password" name="password" value=<%=resultSet.getString("password") %> lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input"> // 密码输入框，填入从数据库中获取的管理员密码
</div> </div>
</div> </div>
<div class="layui-form-item"> <div class="layui-form-item"> // 表单项容器
<label class="layui-form-label">邮箱</label> <label class="layui-form-label">邮箱</label> // 邮箱标签
<div class="layui-input-block"> <div class="layui-input-block"> // 输入框容器
<input type="text" name="email" value=<%=resultSet.getString("email") %> lay-verify="required" placeholder="请输入邮箱" autocomplete="off" class="layui-input"> <input type="text" name="email" value=<%=resultSet.getString("email") %> lay-verify="required" placeholder="请输入邮箱" autocomplete="off" class="layui-input"> // 邮箱输入框，填入从数据库中获取的管理员邮箱
</div> </div>
</div> </div>
<div class="layui-form-item"> <div class="layui-form-item"> // 表单项容器
<div class="layui-input-block"> <div class="layui-input-block"> // 输入框容器
<button type="submit" class="layui-btn" lay-submit="" lay-filter="submitButton">立即提交</button> <button type="submit" class="layui-btn" lay-submit="" lay-filter="submitButton">立即提交</button> // 提交按钮，点击后提交表单
</div> </div>
</div> </div>
</form> </form>
<script> <script>
// 使用layui模块
layui.use(['form', 'jquery'], function(){
$ = layui.jquery; // 使用jQuery库
var form = layui.form, // 获取layui的表单模块
layer = layui.layer; // 获取layui的弹层模块
// 监听表单提交
form.on('submit(submitButton)', function(data){
$.ajax({ // 使用AJAX请求提交数据
url: './managerEdit', // 提交到的URL路径
method: 'post', // 提交方式为POST
data: data.field, // 获取表单提交的数据
dataType: 'json', // 设置返回数据格式为JSON
success: function(data){ // 请求成功的回调函数
if(data.code == "0"){ // 如果返回的code是"0"，表示修改成功
parent.layer.msg("修改成功",{
icon: 6, // 成功图标
time: 500 // 显示500毫秒
});
setTimeout(function(){ // 延时操作
parent.location.reload(); // 刷新父页面
}, 500);
}else{
layer.msg(data.msg); // 否则显示错误信息
}
}
})
layui.use(['form', 'jquery'], function(){ return false; // 阻止表单默认提交
$ = layui.jquery; });
var form = layui.form });
,layer = layui.layer
//监听提交
form.on('submit(submitButton)', function(data){
$.ajax({
url: './managerEdit',
method: 'post',
data: data.field,
dataType: 'json',
success: function(data){
if(data.code == "0"){
parent.layer.msg("添加成功",{
icon: 6,
time: 500
});
setTimeout(function(){
parent.location.reload();
}, 500);
}else{
layer.msg(data.msg);
}
}
})
return false;
});
});
</script> </script>
</body> </body>
</html> </html>

220
WebContent/admin/managerlist.jsp
Unescape View File

@ -1,118 +1,120 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%> // 设置页面的字符编码为UTF-8
<!DOCTYPE html>
<html lang="en"> <!DOCTYPE html> // 定义文档类型为HTML5
<html lang="en"> // 设置HTML文档的语言为英语
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8"> // 设置页面字符编码为UTF-8
<title>借阅卡</title> <title>借阅卡</title> // 设置页面标题为“借阅卡”
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> // 引入layui的CSS文件，用于页面样式
<style> <style>
.layui-table,.layui-table-view{ .layui-table,.layui-table-view{ // 自定义样式，调整layui表格和表格视图的外边距
margin: 0 0px; margin: 0 0px;
} }
</style> </style>
</head> </head>
<body> <body>
<!-- 表单 --> <!-- 表单 -->
<table class="layui-hide" id="managerTable" lay-filter="formFilter"></table> <table class="layui-hide" id="managerTable" lay-filter="formFilter"></table> // 创建表格，指定id为“managerTable”，并设置过滤器为“formFilter”
<script src="../public/layui/layui.js" charset="utf-8"></script> <script src="../public/layui/layui.js" charset="utf-8"></script> // 引入layui的JavaScript文件，提供UI功能和交互
<!-- 头部工具栏 --> <!-- 头部工具栏 -->
<script type="text/html" id="headBar"> <script type="text/html" id="headBar"> // 定义头部工具栏的HTML模板，id为“headBar”
<button type="button" class="layui-btn layui-btn-sm" lay-event="add"><i class="layui-icon">添加管理员</i></button> <button type="button" class="layui-btn layui-btn-sm" lay-event="add"><i class="layui-icon">添加管理员</i></button> // 按钮，点击触发“add”事件，用于添加管理员
</script> </script>
<!-- 表格侧边栏 --> <!-- 表格侧边栏 -->
<script type="text/html" id="operateBar"> <script type="text/html" id="operateBar"> // 定义操作栏的HTML模板，id为“operateBar”
<a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a> <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a> // 编辑按钮，点击触发“edit”事件
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a> <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a> // 删除按钮，点击触发“del”事件
</script> </script>
<script>
layui.use(['table','jquery'], function(){ <script> // 开始JavaScript代码块
$ = layui.jquery; layui.use(['table','jquery'], function(){ // 引入layui的表格和jQuery模块
var table = layui.table; $ = layui.jquery; // 使用jQuery库
// 进行渲染 var table = layui.table; // 获取layui表格模块
var tableIns = table.render({
elem: '#managerTable' // 进行渲染表格
,url:'./managerList' var tableIns = table.render({
,toolbar: '#headBar' elem: '#managerTable' // 表格的元素，指定为“managerTable”
,height: 600 ,url:'./managerList' // 设置表格数据来源的URL
,cols: [[ ,toolbar: '#headBar' // 设置头部工具栏的模板ID
{field:'id', width:80, title: 'ID', sort: true} ,height: 600 // 设置表格的高度
,{field:'account', width:80, title: '账号', sort: true} ,cols: [[ // 设置表格的列
,{field:'name', width:80, title: '姓名'} {field:'id', width:80, title: 'ID', sort: true} // 列ID，宽度80，标题为“ID”，支持排序
,{field:'email', title: '邮箱', minWidth: 150} ,{field:'account', width:80, title: '账号', sort: true} // 列账号，宽度80，标题为“账号”，支持排序
,{fixed: 'right', title:'操作', toolbar: '#operateBar', align: 'center', width:150} ,{field:'name', width:80, title: '姓名'} // 列姓名，宽度80，标题为“姓名”
]] ,{field:'email', title: '邮箱', minWidth: 150} // 列邮箱，最小宽度150，标题为“邮箱”
}); ,{fixed: 'right', title:'操作', toolbar: '#operateBar', align: 'center', width:150} // 操作列，固定在右侧，宽度150，使用“operateBar”模板
]]
// 头部工具栏事件
table.on('toolbar(formFilter)', function(obj){
var checkStatus = table.checkStatus(obj.config.id);
switch(obj.event){
// 添加管理员
case 'add':
var addCardLayer = layer.open({
type: 2,
title: '添加管理员',
area: ['800px', '500px'],
maxmin: true,
shadeClose: true,
content: 'manageradd.jsp',
});
//layer.full(addCardLayer);
};
});
// 侧边工具栏事件
table.on(('tool(formFilter)'), function(obj){
var data = obj.data;
var layEvent = obj.event;
var id = data.id;
var tr = obj.tr;
switch(obj.event){
case 'edit':
layer.open({
type: 2,
title: '更改信息',
area: ['800px', '600px'],
maxmin: true,
shadeClose: true,
content: 'manageredit.jsp?id=' +id,
})
break;
case 'del':
layer.confirm('确定要删除么？',function(){
layer.msg("ok");
$.ajax({
url: './managerDel',
data: 'id=' +id,
type: 'get',
dataType: 'json',
timeout: 3000,
success: function(data){
layer.msg("???");
if(data.code == 0){
layer.msg(data.msg,{
icon: 6,
anim: 5,
time: 500
});
setTimeout(function(){
parent.location.reload();
},500);
}else{
layer.msg(data.code);
}
},
error: function(){
layer.msg("连接超时");
}
})
})
}
})
}); });
</script>
// 头部工具栏事件
table.on('toolbar(formFilter)', function(obj){ // 监听头部工具栏的事件
var checkStatus = table.checkStatus(obj.config.id); // 获取选中行的数据
switch(obj.event){ // 根据事件类型进行处理
case 'add': // 添加管理员
var addCardLayer = layer.open({ // 打开一个弹出层
type: 2, // 弹出层类型为iframe
title: '添加管理员', // 弹出层标题
area: ['800px', '500px'], // 弹出层的宽度和高度
maxmin: true, // 允许最大化和最小化
shadeClose: true, // 点击遮罩层关闭
content: 'manageradd.jsp', // 弹出层内容页面
});
//layer.full(addCardLayer); // 此行已注释，可以让弹出层最大化
};
});
// 侧边工具栏事件
table.on(('tool(formFilter)'), function(obj){ // 监听表格的工具栏事件
var data = obj.data; // 获取当前行的数据
var layEvent = obj.event; // 获取事件类型
var id = data.id; // 获取管理员的ID
var tr = obj.tr; // 获取当前行的tr元素
switch(obj.event){ // 根据事件类型进行处理
case 'edit': // 编辑管理员
layer.open({ // 打开一个弹出层
type: 2, // 弹出层类型为iframe
title: '更改信息', // 弹出层标题
area: ['800px', '600px'], // 弹出层的宽度和高度
maxmin: true, // 允许最大化和最小化
shadeClose: true, // 点击遮罩层关闭
content: 'manageredit.jsp?id=' +id, // 弹出层内容页面，传递管理员ID作为参数
})
break;
case 'del': // 删除管理员
layer.confirm('确定要删除么？',function(){ // 弹出确认框
layer.msg("ok"); // 显示消息
$.ajax({ // 使用AJAX发送删除请求
url: './managerDel', // 删除管理员的URL
data: 'id=' +id, // 发送管理员ID
type: 'get', // 使用GET请求
dataType: 'json', // 返回的数据格式为JSON
timeout: 3000, // 请求超时时间为3000毫秒
success: function(data){ // 请求成功的回调函数
layer.msg("???"); // 显示提示消息
if(data.code == 0){ // 如果删除成功
layer.msg(data.msg,{ // 显示成功消息
icon: 6, // 成功图标
anim: 5, // 动画效果
time: 500 // 消息显示500毫秒
});
setTimeout(function(){ // 延时操作
parent.location.reload(); // 刷新父页面
},500);
}else{ // 如果删除失败
layer.msg(data.code); // 显示错误消息
}
},
error: function(){ // 请求失败的回调函数
layer.msg("连接超时"); // 显示连接超时消息
}
})
})
}
})
});
</script>
</body> </body>
</html> </html>

202
WebContent/admin/ruleadd.jsp
Unescape View File

@ -1,119 +1,119 @@
<%@page import="javabean.Common"%> <%@page import="javabean.Common"%> // 导入Common类，用于获取图书馆信息
<%@page import="java.util.TreeMap"%> <%@page import="java.util.TreeMap"%> // 导入TreeMap类，用于存储图书馆数据
<%@page import="java.util.HashMap"%> <%@page import="java.util.HashMap"%> // 导入HashMap类，用于存储规则相关数据
<%@page import="java.util.Map"%> <%@page import="java.util.Map"%> // 导入Map接口，用于定义数据结构
<%@page import="java.util.ArrayList"%> <%@page import="java.util.ArrayList"%> // 导入ArrayList类，用于存储列表数据
<%@page import="java.sql.ResultSet"%> <%@page import="java.sql.ResultSet"%> // 导入ResultSet类，用于处理数据库查询结果
<%@page import="java.sql.PreparedStatement"%> <%@page import="java.sql.PreparedStatement"%> // 导入PreparedStatement类，用于执行SQL查询
<%@page import="java.sql.Connection"%> <%@page import="java.sql.Connection"%> // 导入Connection类，用于数据库连接
<%@page import="javabean.Base"%> <%@page import="javabean.Base"%> // 导入Base类，可能是数据库连接工具类
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%> // 设置页面编码为UTF-8
<!DOCTYPE html>
<html> <!DOCTYPE html> // 声明文档类型为HTML5
<html> // 开始HTML文档
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8"> // 设置页面字符集为UTF-8
<title>规则添加</title> <title>规则添加</title> // 页面标题设置为“规则添加”
<!-- layui --> <!-- layui -->
<link rel="stylesheet" href="../public/layui/css/layui.css"> <link rel="stylesheet" href="../public/layui/css/layui.css"> // 引入layui框架的CSS文件，提供样式支持
<script src="../public/layui/layui.js"></script> <script src="../public/layui/layui.js"></script> // 引入layui框架的JavaScript文件，提供组件和交互功能
<style> <style>
.layui-form{ .layui-form{ // 自定义layui表单样式
margin: 10px 20px; margin: 10px 20px; // 设置表单的外边距
}
} .layui-form-pane .layui-form-label{ // 自定义表单标签样式
.layui-form-pane .layui-form-label{ width: 120px; // 设置表单标签的宽度
width: 120px; }
} .layui-form-pane .layui-input-block{ // 自定义输入框块的样式
.layui-form-pane .layui-input-block{ margin-left: 120px; // 设置输入框块的左边距
margin-left: 120px; }
} </style>
</style>
</head> </head>
<body> <body>
<% <%
// 获取图书馆map // 获取图书馆map
Map<String, String> libraryMap = Common.getLibraryMap(); Map<String, String> libraryMap = Common.getLibraryMap(); // 调用Common类的getLibraryMap方法，获取图书馆信息Map
%> %>
<form class="layui-form layui-form-pane" action=""> <form class="layui-form layui-form-pane" action=""> // 定义一个layui表单，使用layui样式
<input type="id" name="id" value="3" class="layui-hide"> <input type="id" name="id" value="3" class="layui-hide"> // 隐藏的输入框，用于传递id，值为3
<div class="layui-form-item"> <div class="layui-form-item"> // 表单项
<label class="layui-form-label">限制天数</label> <label class="layui-form-label">限制天数</label> // 表单标签“限制天数”
<div class="layui-input-block"> <div class="layui-input-block"> // 输入框块
<input type="text" name="limit_day" required lay-verify="required" placeholder="请输入限制天数" autocomplete="off" class="layui-input"> <input type="text" name="limit_day" required lay-verify="required" placeholder="请输入限制天数" autocomplete="off" class="layui-input"> // 输入框，要求输入限制天数
</div>
</div> </div>
</div> <!-- 作者 -->
<!-- 作者 --> <div class="layui-form-item"> // 表单项
<div class="layui-form-item"> <label class="layui-form-label">限制数量</label> // 表单标签“限制数量”
<label class="layui-form-label">限制数量</label> <div class="layui-input-block"> // 输入框块
<div class="layui-input-block"> <input type="text" name="borrow_num" required lay-verify="required" placeholder="请输入限制数量" autocomplete="off" class="layui-input"> // 输入框，要求输入限制数量
<input type="text" name="borrow_num" required lay-verify="required" placeholder="请输入限制数量" autocomplete="off" class="layui-input"> </div>
</div> </div>
</div>
<div class="layui-form-item"> <div class="layui-form-item"> // 表单项
<label class="layui-form-label">限制图书馆</label> <label class="layui-form-label">限制图书馆</label> // 表单标签“限制图书馆”
<div class="layui-input-block" > <div class="layui-input-block" > // 输入框块
<% <%
for(String key : libraryMap.keySet()){ // 遍历获取的libraryMap，生成多个checkbox
%> for(String key : libraryMap.keySet()){ // 遍历图书馆map的每一项
<input type="checkbox" name=<%="borrow_library[" +key +"]" %> title=<%=libraryMap.get(key) %> checked> %>
<% <input type="checkbox" name=<%="borrow_library[" +key +"]" %> title=<%=libraryMap.get(key) %> checked> // 动态生成checkbox，checked表示默认选中
} <%
%> }
%>
</div>
</div> </div>
</div> <div class="layui-form-item"> // 表单项
<div class="layui-form-item"> <label class="layui-form-label">逾期每天费用</label> // 表单标签“逾期每天费用”
<label class="layui-form-label">逾期每天费用</label> <div class="layui-input-block"> // 输入框块
<div class="layui-input-block"> <input type="text" name="overtime_fee" required lay-verify="required" placeholder="请输入逾期每天费用" autocomplete="off" class="layui-input"> // 输入框，要求输入逾期每天费用
<input type="text" name="overtime_fee" required lay-verify="required" placeholder="请输入逾期每天费用" autocomplete="off" class="layui-input"> </div>
</div> </div>
</div> <div class="layui-form-item"> // 表单项
<div class="layui-form-item"> <div class="layui-input-block"> // 输入框块
<div class="layui-input-block"> <button class="layui-btn" lay-submit="" lay-filter="submitButton">立即提交</button> // 提交按钮，点击提交表单
<button class="layui-btn" lay-submit="" lay-filter="submitButton">立即提交</button> <button type="reset" class="layui-btn layui-btn-primary">重置</button> // 重置按钮，重置表单内容
<button type="reset" class="layui-btn layui-btn-primary">重置</button> </div>
</div> </div>
</div>
</form> </form>
<script> <script> // 开始JavaScript代码块
layui.use(['form', 'jquery'], function(){ // 使用layui的form和jquery模块
$ = layui.jquery; // 使用jQuery库
var form = layui.form // 获取layui的form模块
,layer = layui.layer // 获取layui的layer模块，用于弹出层
// 监听提交事件
form.on('submit(submitButton)', function(data){ // 监听表单提交事件
$.ajax({ // 使用AJAX发送请求
url: './ruleAdd', // 请求的URL地址
method: 'post', // 使用POST请求
data: data.field, // 传递表单数据
dataType: 'json', // 请求返回的数据类型为JSON
success: function(data){ // 请求成功的回调函数
if(data.code == "0"){ // 如果返回的code为0，表示成功
parent.layer.msg("添加成功",{ // 弹出成功消息
icon: 6, // 图标类型为成功
time: 500 // 消息显示500毫秒后消失
});
setTimeout(function(){ // 延时操作
parent.location.reload(); // 刷新父页面
}, 500);
}else{ // 如果返回的code不是0，表示失败
leyer.msg("添加失败"); // 弹出失败消息
}
//parent.layer.msg('您将标记 [ sdf ] 成功传送给了父窗口');
}
})
layui.use(['form', 'jquery'], function(){ return false; // 阻止表单的默认提交行为
$ = layui.jquery; });
var form = layui.form });
,layer = layui.layer
//监听提交
form.on('submit(submitButton)', function(data){
$.ajax({
url: './ruleAdd',
method: 'post',
data: data.field,
dataType: 'json',
success: function(data){
if(data.code == "0"){
parent.layer.msg("添加成功",{
icon: 6,
time: 500
});
setTimeout(function(){
parent.location.reload();
}, 500);
}else{
leyer.msg("添加失败");
}
//parent.layer.msg('您将标记 [ sdf ] 成功传送给了父窗口');
}
})
return false;
});
});
</script> </script>
</body> </body>
</html> </html>

261
WebContent/admin/ruleedit.jsp
Unescape View File

@ -1,148 +1,157 @@
<%@page import="javabean.Common"%> <%@page import="javabean.Common"%> // 导入Common类，提供图书馆映射等功能
<%@page import="java.util.TreeMap"%> <%@page import="java.util.TreeMap"%> // 导入TreeMap类，可能用于存储图书馆数据
<%@page import="java.util.HashMap"%> <%@page import="java.util.HashMap"%> // 导入HashMap类，用于存储规则数据
<%@page import="java.util.Map"%> <%@page import="java.util.Map"%> // 导入Map接口，用于定义存储数据的映射
<%@page import="java.util.ArrayList"%> <%@page import="java.util.ArrayList"%> // 导入ArrayList类，可能用于存储多个对象
<%@page import="java.sql.ResultSet"%> <%@page import="java.sql.ResultSet"%> // 导入ResultSet类，用于处理SQL查询的结果集
<%@page import="java.sql.PreparedStatement"%> <%@page import="java.sql.PreparedStatement"%> // 导入PreparedStatement类，用于执行SQL语句
<%@page import="java.sql.Connection"%> <%@page import="java.sql.Connection"%> // 导入Connection类，用于数据库连接
<%@page import="javabean.Base"%> <%@page import="javabean.Base"%> // 导入Base类，可能用于数据库连接和资源管理
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%> // 设置页面的字符编码为UTF-8
<!DOCTYPE html>
<html> <!DOCTYPE html> // 声明文档类型为HTML5
<html> // 开始HTML文档
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8"> // 设置页面字符集为UTF-8
<title>规则添加</title> <title>规则添加</title> // 页面标题设置为“规则添加”
<!-- layui --> <!-- layui -->
<link rel="stylesheet" href="../public/layui/css/layui.css"> <link rel="stylesheet" href="../public/layui/css/layui.css"> // 引入layui框架的CSS文件，提供样式支持
<script src="../public/layui/layui.js"></script> <script src="../public/layui/layui.js"></script> // 引入layui框架的JavaScript文件，提供组件和交互功能
<style> <style>
.layui-form{ .layui-form{ // 自定义layui表单样式
margin: 10px 20px; margin: 10px 20px; // 设置表单的外边距
}
} .layui-form-pane .layui-form-label{ // 自定义表单标签样式
.layui-form-pane .layui-form-label{ width: 120px; // 设置表单标签的宽度
width: 120px; }
} .layui-form-pane .layui-input-block{ // 自定义输入框块的样式
.layui-form-pane .layui-input-block{ margin-left: 120px; // 设置输入框块的左边距
margin-left: 120px; }
} </style>
</style>
</head> </head>
<body> <body>
<% <%
// 获取请求参数id
String id = request.getParameter("id"); String id = request.getParameter("id");
Connection connection = null; Connection connection = null; // 定义数据库连接对象
PreparedStatement pstmt = null; PreparedStatement pstmt = null; // 定义PreparedStatement对象
ResultSet resultSet = null; ResultSet resultSet = null; // 定义查询结果集对象
String sql = ""; String sql = ""; // 初始化SQL查询语句
connection = (Connection)Base.getConnection(); // 获取数据库连接
sql = "select * from rules where id = ?"; connection = (Connection)Base.getConnection();
pstmt = connection.prepareStatement(sql); // 设置查询规则的SQL语句
pstmt.setString(1, id); sql = "select * from rules where id = ?";
resultSet = pstmt.executeQuery(); // 创建PreparedStatement对象，执行SQL查询
resultSet.next(); pstmt = connection.prepareStatement(sql);
pstmt.setString(1, id); // 设置查询条件（id）
String[] libraryList = resultSet.getString("borrow_library").split("、"); // 执行查询，获取结果集
// 获取图书馆map resultSet = pstmt.executeQuery();
Map<String, String> libraryMap = Common.getLibraryMap(); resultSet.next(); // 移动到结果集的第一行
// 获取借书限制图书馆信息，并分割成数组
String[] libraryList = resultSet.getString("borrow_library").split("、");
// 获取图书馆信息映射
Map<String, String> libraryMap = Common.getLibraryMap();
%> %>
<form class="layui-form layui-form-pane" action=""> <form class="layui-form layui-form-pane" action=""> // 定义一个layui表单，使用layui样式
<input type="text" name="id" value=<%=id %> class="layui-hide"> <input type="text" name="id" value=<%=id %> class="layui-hide"> // 隐藏的输入框，用于传递规则的id
<div class="layui-form-item"> <div class="layui-form-item"> // 表单项
<label class="layui-form-label">限制天数</label> <label class="layui-form-label">限制天数</label> // 表单标签“限制天数”
<div class="layui-input-block"> <div class="layui-input-block"> // 输入框块
<input type="text" name="limit_day" value=<%=resultSet.getString("limit_day") %> required lay-verify="required" placeholder="请输入限制天数" autocomplete="off" class="layui-input"> <input type="text" name="limit_day" value=<%=resultSet.getString("limit_day") %> required lay-verify="required" placeholder="请输入限制天数" autocomplete="off" class="layui-input"> // 输入框，默认值为数据库中获取的限制天数
</div>
</div> </div>
</div> <!-- 作者 -->
<!-- 作者 --> <div class="layui-form-item"> // 表单项
<div class="layui-form-item"> <label class="layui-form-label">限制数量</label> // 表单标签“限制数量”
<label class="layui-form-label">限制数量</label> <div class="layui-input-block"> // 输入框块
<div class="layui-input-block"> <input type="text" name="borrow_num" value=<%=resultSet.getString("borrow_num") %> required lay-verify="required" placeholder="请输入限制数量" autocomplete="off" class="layui-input"> // 输入框，默认值为数据库中获取的限制数量
<input type="text" name="borrow_num" value=<%=resultSet.getString("borrow_num") %> required lay-verify="required" placeholder="请输入限制数量" autocomplete="off" class="layui-input"> </div>
</div> </div>
</div>
<div class="layui-form-item"> <div class="layui-form-item"> // 表单项
<label class="layui-form-label">限制图书馆</label> <label class="layui-form-label">限制图书馆</label> // 表单标签“限制图书馆”
<div class="layui-input-block" > <div class="layui-input-block" > // 输入框块
<% <%
for(String key : libraryMap.keySet()){ // 遍历图书馆map，生成多个checkbox，表示用户选择的图书馆
boolean flag = false; for(String key : libraryMap.keySet()){ // 遍历图书馆map的每一项
%> boolean flag = false; // 定义一个标志，用于判断是否选中
<input type="checkbox" name=<%="borrow_library[" +key +"]" %> title=<%=libraryMap.get(key) %> %>
<% for(String key0 : libraryList){ <input type="checkbox" name=<%="borrow_library[" +key +"]" %> title=<%=libraryMap.get(key) %> <!-- 动态生成checkbox -->
flag = false; <%
if(key0.equals(key)){ // 遍历数据库中获取的已选图书馆列表，判断是否选中该图书馆
flag = true; for(String key0 : libraryList){
} flag = false;
if(flag == true) if(key0.equals(key)){
out.print("checked"); flag = true; // 如果图书馆ID匹配，设置flag为true
} }
%>> if(flag == true)
<% out.print("checked"); // 如果选中该图书馆，则勾选checkbox
} }
%> %>>
<%
}
%>
</div>
</div> </div>
</div> <div class="layui-form-item"> // 表单项
<div class="layui-form-item"> <label class="layui-form-label">逾期每天费用</label> // 表单标签“逾期每天费用”
<label class="layui-form-label">逾期每天费用</label> <div class="layui-input-block"> // 输入框块
<div class="layui-input-block"> <input type="text" name="overtime_fee" value=<%=resultSet.getString("overtime_fee") %> required lay-verify="required" placeholder="请输入逾期每天费用" autocomplete="off" class="layui-input"> // 输入框，默认值为数据库中获取的逾期费用
<input type="text" name="overtime_fee" value=<%=resultSet.getString("overtime_fee") %> required lay-verify="required" placeholder="请输入逾期每天费用" autocomplete="off" class="layui-input"> </div>
</div> </div>
</div> <div class="layui-form-item"> // 表单项
<div class="layui-form-item"> <div class="layui-input-block"> // 输入框块
<div class="layui-input-block"> <button class="layui-btn" lay-submit="" lay-filter="bookForm">立即提交</button> // 提交按钮，点击后提交表单
<button class="layui-btn" lay-submit="" lay-filter="bookForm">立即提交</button> <button type="reset" class="layui-btn layui-btn-primary">重置</button> // 重置按钮，点击后重置表单内容
<button type="reset" class="layui-btn layui-btn-primary">重置</button> </div>
</div> </div>
</div>
</form> </form>
<script> <script> // 开始JavaScript代码块
layui.use(['form', 'jquery'], function(){ // 使用layui的form和jquery模块
//layer.closeAll(); // 可选的关闭所有弹出层
$ = layui.jquery; // 引入jQuery
var form = layui.form // 获取layui的form模块
,layer = layui.layer // 获取layui的layer模块，用于弹出层
// 监听提交事件
form.on('submit(bookForm)', function(data){ // 监听表单提交事件
$.ajax({ // 使用AJAX发送请求
url: './ruleEdit', // 请求的URL地址
method: 'post', // 使用POST请求
data: data.field, // 发送的表单数据
dataType: 'json', // 请求返回的数据类型为JSON
success: function(data){ // 请求成功的回调函数
if(data.code == "0"){ // 如果返回的code为0，表示成功
parent.layer.msg("修改成功",{ // 弹出修改成功的提示
icon: 6, // 图标类型为成功
time: 500 // 消息显示500毫秒后消失
});
setTimeout(function(){ // 延时操作
parent.location.reload(); // 刷新父页面
}, 500);
}else{ // 如果返回的code不是0，表示失败
leyer.msg("修改失败"); // 弹出修改失败的提示
}
//parent.layer.msg('您将标记 [ sdf ] 成功传送给了父窗口');
}
})
layui.use(['form', 'jquery'], function(){ return false; // 阻止表单的默认提交行为
//layer.closeAll(); });
$ = layui.jquery; });
var form = layui.form
,layer = layui.layer
//监听提交
form.on('submit(bookForm)', function(data){
$.ajax({
url: './ruleEdit',
method: 'post',
data: data.field,
dataType: 'json',
success: function(data){
if(data.code == "0"){
parent.layer.msg("修改成功",{
icon: 6,
time: 500
});
setTimeout(function(){
parent.location.reload();
}, 500);
}else{
leyer.msg("修改失败");
}
//parent.layer.msg('您将标记 [ sdf ] 成功传送给了父窗口');
}
})
return false;
});
});
</script> </script>
<% <%
Base.closeResource(connection, pstmt, resultSet); // 关闭数据库连接和其他资源
Base.closeResource(connection, pstmt, resultSet); // 关闭数据库连接、PreparedStatement和ResultSet
%> %>
</body> </body>
</html> </html>

219
WebContent/admin/rulelist.jsp
Unescape View File

@ -1,119 +1,120 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%> // 设置页面的字符编码为UTF-8
<!DOCTYPE html>
<html lang="en"> <!DOCTYPE html> // 声明HTML5文档类型
<html lang="en"> // 开始HTML文档，指定语言为英语
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8"> // 设置页面的字符编码为UTF-8
<title>规则列表</title> <title>规则列表</title> // 页面标题设置为“规则列表”
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> // 引入layui框架的CSS文件，用于样式支持
<style> <style>
.layui-table,.layui-table-view{ .layui-table,.layui-table-view{ // 自定义layui表格和表格视图的样式
margin: 0 0px; margin: 0 0px; // 设置表格的外边距为0
} }
</style> </style>
</head> </head>
<body> <body>
<!-- 表单 --> <!-- 表单 -->
<table class="layui-hide" id="ruleTable" lay-filter="formFilter"></table> <table class="layui-hide" id="ruleTable" lay-filter="formFilter"></table> // 定义一个表格元素，使用layui样式，并指定ID为ruleTable，lay-filter用于表格过滤
<script src="../public/layui/layui.js" charset="utf-8"></script>
<!-- 头部工具栏 --> <script src="../public/layui/layui.js" charset="utf-8"></script> // 引入layui框架的JavaScript文件，提供组件和交互功能
<script type="text/html" id="headBar">
<button type="button" class="layui-btn layui-btn-sm" lay-event="add"><i class="layui-icon">添加</i></button> <!-- 头部工具栏 -->
</script> <script type="text/html" id="headBar"> // 自定义头部工具栏模板
<button type="button" class="layui-btn layui-btn-sm" lay-event="add"><i class="layui-icon">添加</i></button> // 添加按钮，点击时触发“add”事件
<!-- 表格后面的操作 --> </script>
<script type="text/html" id="operateBar">
<a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a> <!-- 表格后面的操作 -->
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a> <script type="text/html" id="operateBar"> // 自定义操作栏模板
</script> <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a> // 编辑按钮，点击时触发“edit”事件
<script> <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a> // 删除按钮，点击时触发“del”事件
layui.use(['table','jquery'], function(){ </script>
$ = layui.jquery; <script>
var table = layui.table; layui.use(['table','jquery'], function(){ // 使用layui的table和jquery模块
// 进行渲染 $ = layui.jquery; // 引入jQuery
var tableIns = table.render({ var table = layui.table; // 获取layui的table模块，用于操作表格
elem: '#ruleTable' // 进行渲染
,url:'./ruleList' var tableIns = table.render({ // 渲染表格
,toolbar: '#headBar' elem: '#ruleTable' // 表格的容器元素
,height: '600' ,url:'./ruleList' // 表格数据源URL
,cols: [[ ,toolbar: '#headBar' // 使用自定义的头部工具栏
{fixed: 'left',field:'id', width:140, title: 'ID', sort: true} ,height: '600' // 设置表格的高度为600px
,{field:'limit_day', width:180, title: '限制天数', sort: true} ,cols: [[ // 表格列配置
,{field:'borrow_num', width:180, title: '限制本数', sort: true} {fixed: 'left',field:'id', width:140, title: 'ID', sort: true} // ID列，宽度140px，可排序
,{field:'borrow_library', width:180, title: '限制图书馆'} ,{field:'limit_day', width:180, title: '限制天数', sort: true} // 限制天数列，宽度180px，可排序
,{field:'overtime_fee', title: '逾期每天费用', width: 150} ,{field:'borrow_num', width:180, title: '限制本数', sort: true} // 限制本数列，宽度180px，可排序
,{fixed: 'right', title:'操作', toolbar: '#operateBar', align: 'center', width:150} ,{field:'borrow_library', width:180, title: '限制图书馆'} // 限制图书馆列，宽度180px
]] ,{field:'overtime_fee', title: '逾期每天费用', width: 150} // 逾期费用列，宽度150px
}); ,{fixed: 'right', title:'操作', toolbar: '#operateBar', align: 'center', width:150} // 操作列，宽度150px，包含自定义的操作按钮
]]
// 头部工具栏事件
table.on('toolbar(formFilter)', function(obj){
var checkStatus = table.checkStatus(obj.config.id);
switch(obj.event){
// 添加规则
case 'add':
var addCardLayer = layer.open({
type: 2,
title: '添加规则',
area: ['800px', '500px'],
maxmin: true,
content: 'ruleadd.jsp',
});
};
}); });
// 侧边工具栏事件 // 头部工具栏事件
table.on(('tool(formFilter)'), function(obj){ table.on('toolbar(formFilter)', function(obj){ // 监听头部工具栏的事件
var data = obj.data; var checkStatus = table.checkStatus(obj.config.id); // 获取选中的表格行
var layEvent = obj.event; switch(obj.event){ // 根据事件类型处理不同的操作
var tr = obj.tr; // 添加规则
var id = data.id; case 'add':
switch(obj.event){ var addCardLayer = layer.open({ // 打开添加规则的弹窗
case 'edit': type: 2, // 弹窗类型为iframe
layer.open({ title: '添加规则', // 弹窗标题
type: 2, area: ['800px', '500px'], // 弹窗宽度800px，高度500px
title: '更改信息', maxmin: true, // 启用最大化和最小化按钮
area: ['800px', '600px'], content: 'ruleadd.jsp', // 弹窗内容来自ruleadd.jsp页面
maxmin: true, });
shadeClose: true, };
content: 'ruleedit.jsp?id=' +id, });
})
break; // 侧边工具栏事件
case 'del': table.on(('tool(formFilter)'), function(obj){ // 监听侧边操作栏的事件
layer.confirm("确认要删除么，非必要请勿删除",function(){ var data = obj.data; // 获取当前操作行的数据
$.ajax({ var layEvent = obj.event; // 获取事件类型
url: './ruleDel', var tr = obj.tr; // 获取当前操作行的tr元素
data: "id=" +id, var id = data.id; // 获取当前操作行的ID
type: 'get', switch(obj.event){ // 根据事件类型处理不同的操作
dataType: 'json', case 'edit': // 编辑操作
timout: 3000, layer.open({ // 打开编辑规则的弹窗
success: function(data){ type: 2, // 弹窗类型为iframe
if(data.code == 0){ title: '更改信息', // 弹窗标题
layer.msg(data.msg,{ area: ['800px', '600px'], // 弹窗宽度800px，高度600px
icon: 6, maxmin: true, // 启用最大化和最小化按钮
anim: 5, shadeClose: true, // 点击遮罩层关闭弹窗
time: 500 content: 'ruleedit.jsp?id=' +id, // 弹窗内容来自ruleedit.jsp，并传递ID作为参数
}) })
setTimeout(function(){ break;
parent.location.reload(); case 'del': // 删除操作
}, 500) layer.confirm("确认要删除么，非必要请勿删除",function(){ // 弹出确认删除的提示框
$.ajax({ // 使用AJAX请求删除数据
}else{ url: './ruleDel', // 请求的URL地址
layer.msg(data.msg,{ data: "id=" +id, // 传递ID作为请求参数
icon:5, type: 'get', // 使用GET请求
anim:6 dataType: 'json', // 返回数据类型为JSON
}) timeout: 3000, // 请求超时设置为3000ms
} success: function(data){ // 请求成功的回调函数
}, if(data.code == 0){ // 如果返回的code为0，表示删除成功
error: function(){ layer.msg(data.msg,{ // 弹出删除成功的提示
layer.msg("连接超时"); icon: 6, // 成功图标
} anim: 5, // 动画效果
}) time: 500 // 显示时间500毫秒
}) })
} setTimeout(function(){ // 延时操作
}) parent.location.reload(); // 刷新父页面
}, 500)
}else{ // 如果删除失败
layer.msg(data.msg,{ // 弹出删除失败的提示
icon:5, // 错误图标
anim:6 // 动画效果
})
}
},
error: function(){ // 请求失败的回调函数
layer.msg("连接超时"); // 弹出连接超时的提示
}
})
})
}
})
}); });
</script> </script>
</body> </body>
</html> </html>

121
WebContent/admin/sortadd.jsp
Unescape View File

@ -1,79 +1,74 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%> // 设置页面的字符编码为UTF-8
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>分类添加</title>
<!-- layui -->
<link rel="stylesheet" href="../public/layui/css/layui.css">
<script src="../public/layui/layui.js"></script>
<style>
.layui-form{
margin: 10px 20px;
}
</style> <!DOCTYPE html> // 声明文档类型为HTML5
</head> <html> // 开始HTML文档
<head>
<meta charset="UTF-8"> // 设置页面的字符编码为UTF-8
<title>分类添加</title> // 页面标题为“分类添加”
<!-- layui -->
<link rel="stylesheet" href="../public/layui/css/layui.css"> // 引入layui框架的CSS文件，用于页面样式
<script src="../public/layui/layui.js"></script> // 引入layui框架的JavaScript文件，用于实现页面交互
<style>
.layui-form{ // 自定义表单样式
margin: 10px 20px; // 设置表单的外边距
}
</style>
</head> </head>
<body> <body>
<form class="layui-form layui-form-pane" action="" lay-filter="formFilter"> <form class="layui-form layui-form-pane" action="" lay-filter="formFilter"> // 创建一个layui表单，使用layui的样式，设置filter属性为"formFilter"
<div class="layui-form-item"> <div class="layui-form-item"> // 创建一个表单项
<label class="layui-form-label">分类名</label> <label class="layui-form-label">分类名</label> // 标签显示为“分类名”
<div class="layui-input-block"> <div class="layui-input-block"> // 输入框的容器
<input type="text" name="name" lay-verify="required" required autocomplete="off" placeholder="请输入分类名" class="layui-input"> <input type="text" name="name" lay-verify="required" required autocomplete="off" placeholder="请输入分类名" class="layui-input"> // 文本框输入，设置为必填，且有验证规则“required”
</div> </div>
</div> </div>
<div class="layui-form-item layui-form-text"> <div class="layui-form-item layui-form-text"> // 创建一个文本区域
<label class="layui-form-label">分类描述</label> <label class="layui-form-label">分类描述</label> // 标签显示为“分类描述”
<div class="layui-input-block"> <div class="layui-input-block"> // 输入框容器
<textarea name="description" placeholder="请输入内容" class="layui-textarea" style="height:300px"></textarea> <textarea name="description" placeholder="请输入内容" class="layui-textarea" style="height:300px"></textarea> // 文本框区域，用于输入分类描述，设置高度为300px
</div> </div>
</div> </div>
<div class="layui-form-item"> <div class="layui-form-item"> // 创建一个表单项
<div class="layui-input-block"> <div class="layui-input-block"> // 输入框容器
<button type="submit" class="layui-btn" lay-submit="" lay-filter="submitButton">立即提交</button> <button type="submit" class="layui-btn" lay-submit="" lay-filter="submitButton">立即提交</button> // 提交按钮，设置lay-submit属性为提交表单，lay-filter为按钮的过滤标识
</div> </div>
</div> </div>
</form> </form>
<script> <script> // 开始JavaScript代码
layui.use(['form', 'jquery'], function(){ // 使用layui的form和jquery模块
$ = layui.jquery; // 引入jQuery库
var form = layui.form // 获取form模块
,layer = layui.layer // 获取layer模块，用于弹窗提示
//监听提交
form.on('submit(submitButton)', function(data){ // 监听提交按钮的点击事件，触发submitButton事件
$.ajax({ // 使用AJAX请求提交表单数据
url: './sortAdd', // 提交的URL地址
method: 'post', // 请求方法为POST
data: data.field, // 提交表单数据
dataType: 'json', // 返回的数据格式为JSON
success: function(data){ // 请求成功的回调函数
if(data.code == "0"){ // 如果返回的code为0，表示成功
parent.layer.msg("添加成功",{ // 弹出提示框，提示“添加成功”
icon: 6, // 成功图标
time: 500 // 显示时间为500毫秒
});
setTimeout(function(){ // 延时操作
parent.location.reload(); // 刷新父页面
}, 500);
}else{ // 如果返回的code不为0，表示失败
layer.msg(data.msg); // 弹出返回的错误信息
}
}
})
layui.use(['form', 'jquery'], function(){ return false; // 阻止表单默认提交行为
$ = layui.jquery; });
var form = layui.form });
,layer = layui.layer
//监听提交
form.on('submit(submitButton)', function(data){
$.ajax({
url: './sortAdd',
method: 'post',
data: data.field,
dataType: 'json',
success: function(data){
if(data.code == "0"){
parent.layer.msg("添加成功",{
icon: 6,
time: 500
});
setTimeout(function(){
parent.location.reload();
}, 500);
}else{
layer.msg(data.msg);
}
}
})
return false;
});
});
</script> </script>
</body> </body>
</html> </html>

178
WebContent/admin/sortedit.jsp
Unescape View File

@ -1,101 +1,109 @@
<%@page import="javabean.Base"%> <%@page import="javabean.Base"%> // 导入Base类，用于数据库连接
<%@page import="java.sql.ResultSet"%> <%@page import="java.sql.ResultSet"%> // 导入ResultSet类，用于处理查询结果
<%@page import="java.sql.PreparedStatement"%> <%@page import="java.sql.PreparedStatement"%> // 导入PreparedStatement类，用于执行SQL语句
<%@page import="java.sql.Connection"%> <%@page import="java.sql.Connection"%> // 导入Connection类，用于数据库连接管理
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%> // 设置页面的字符编码为UTF-8
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>分类编辑</title>
<!-- layui -->
<link rel="stylesheet" href="../public/layui/css/layui.css">
<script src="../public/layui/layui.js"></script>
<style>
.layui-form{
margin: 10px 20px;
}
</style> <!DOCTYPE html> // 声明文档类型为HTML5
</head> <html> // 开始HTML文档
<head>
<meta charset="UTF-8"> // 设置页面的字符编码为UTF-8
<title>分类编辑</title> // 页面标题为“分类编辑”
<!-- layui -->
<link rel="stylesheet" href="../public/layui/css/layui.css"> // 引入layui框架的CSS文件，用于页面样式
<script src="../public/layui/layui.js"></script> // 引入layui框架的JavaScript文件，用于实现页面交互
<style>
.layui-form{ // 自定义表单样式
margin: 10px 20px; // 设置表单的外边距
}
</style>
</head> </head>
<body>
<% <%
String id = request.getParameter("id"); // 获取请求参数中的id，表示要编辑的分类ID
Connection connection = null; String id = request.getParameter("id");
PreparedStatement pstmt = null;
ResultSet resultSet = null; // 初始化数据库连接、PreparedStatement和ResultSet对象
String sql = ""; Connection connection = null;
PreparedStatement pstmt = null;
connection = (Connection)Base.getConnection(); ResultSet resultSet = null;
sql = "select * from book_sort where id = ?"; String sql = "";
pstmt = connection.prepareStatement(sql);
pstmt.setString(1, id); // 获取数据库连接
resultSet = pstmt.executeQuery(); connection = (Connection)Base.getConnection();
resultSet.next(); // 设置查询语句，查询指定ID的分类信息
sql = "select * from book_sort where id = ?";
// 创建PreparedStatement对象，并设置参数
pstmt = connection.prepareStatement(sql);
pstmt.setString(1, id);
// 执行查询，获取结果集
resultSet = pstmt.executeQuery();
// 移动游标到查询结果的第一行
resultSet.next();
%> %>
<body>
<form class="layui-form layui-form-pane" action="" lay-filter="formFilter"> <form class="layui-form layui-form-pane" action="" lay-filter="formFilter"> // 创建一个layui表单，设置过滤器为"formFilter"
<input type="text" name="id" value=<%=id %> lay-verify="required" required autocomplete="off" class="layui-input layui-hide"> <input type="text" name="id" value=<%=id %> lay-verify="required" required autocomplete="off" class="layui-input layui-hide"> // 隐藏字段，用于提交分类ID
<div class="layui-form-item"> <div class="layui-form-item"> // 创建一个表单项
<label class="layui-form-label">分类名</label> <label class="layui-form-label">分类名</label> // 标签显示为“分类名”
<div class="layui-input-block"> <div class="layui-input-block"> // 输入框容器
<input type="text" name="name" value=<%=resultSet.getString("name") %> lay-verify="required" required autocomplete="off" placeholder="请输入分类名" class="layui-input"> <input type="text" name="name" value=<%=resultSet.getString("name") %> lay-verify="required" required autocomplete="off" placeholder="请输入分类名" class="layui-input"> // 文本框，显示从数据库中查询到的分类名，设置为必填
</div>
</div> </div>
</div>
<div class="layui-form-item layui-form-text"> // 创建一个文本区域
<div class="layui-form-item layui-form-text"> <label class="layui-form-label">分类描述</label> // 标签显示为“分类描述”
<label class="layui-form-label">分类描述</label> <div class="layui-input-block"> // 输入框容器
<div class="layui-input-block"> <textarea name="description" placeholder="请输入内容" class="layui-textarea" style="height:300px"><%=resultSet.getString("description") != null ? resultSet.getString("description") : "" %></textarea> // 文本框区域，显示从数据库查询到的分类描述，若为空则显示空字符串
<textarea name="description" placeholder="请输入内容" class="layui-textarea" style="height:300px"><%=resultSet.getString("description") != null ? resultSet.getString("description") : "" %></textarea> </div>
</div> </div>
</div>
<div class="layui-form-item"> // 创建一个表单项
<div class="layui-form-item"> <div class="layui-input-block"> // 输入框容器
<div class="layui-input-block"> <button type="submit" class="layui-btn" lay-submit="" lay-filter="submitButton">立即提交</button> // 提交按钮，设置lay-submit属性为提交表单，lay-filter为按钮的过滤标识
<button type="submit" class="layui-btn" lay-submit="" lay-filter="submitButton">立即提交</button> </div>
</div> </div>
</div>
</form> </form>
<script>
<script> // 开始JavaScript代码
layui.use(['form', 'jquery'], function(){ layui.use(['form', 'jquery'], function(){ // 使用layui的form和jquery模块
$ = layui.jquery; $ = layui.jquery; // 引入jQuery库
var form = layui.form var form = layui.form // 获取form模块
,layer = layui.layer ,layer = layui.layer // 获取layer模块，用于弹窗提示
//监听提交 //监听提交
form.on('submit(submitButton)', function(data){ form.on('submit(submitButton)', function(data){ // 监听提交按钮的点击事件，触发submitButton事件
$.ajax({ $.ajax({ // 使用AJAX请求提交表单数据
url: './sortEdit', url: './sortEdit', // 提交的URL地址
method: 'post', method: 'post', // 请求方法为POST
data: data.field, data: data.field, // 提交表单数据
dataType: 'json', dataType: 'json', // 返回的数据格式为JSON
success: function(data){ success: function(data){ // 请求成功的回调函数
if(data.code == "0"){ if(data.code == "0"){ // 如果返回的code为0，表示成功
parent.layer.msg(data.msg,{ parent.layer.msg(data.msg,{ // 弹出提示框，提示“添加成功”
icon: 6, icon: 6, // 成功图标
time: 500 time: 500 // 显示时间为500毫秒
}); });
setTimeout(function(){ setTimeout(function(){ // 延时操作
parent.location.reload(); parent.location.reload(); // 刷新父页面
}, 500); }, 500);
}else{ }else{ // 如果返回的code不为0，表示失败
layer.msg(data.msg); layer.msg(data.msg); // 弹出返回的错误信息
} }
}
} })
})
return false; // 阻止表单默认提交行为
});
return false; });
});
});
</script> </script>
<% <%
Base.closeResource(connection, pstmt, resultSet); // 关闭数据库资源
Base.closeResource(connection, pstmt, resultSet);
%> %>
</body> </body>
</html> </html>

195
WebContent/admin/sortlist.jsp
Unescape View File

@ -1,108 +1,107 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%> // 设置页面的字符编码为UTF-8
<!DOCTYPE html> <!DOCTYPE html> // 声明文档类型为HTML5
<html lang="en"> <html lang="en"> // 设置页面语言为英语
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8"> // 设置页面字符编码为UTF-8
<title>借阅卡</title> <title>借阅卡</title> // 页面标题为“借阅卡”
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> // 引入layui的CSS文件，用于页面样式
<style> <style>
.layui-table,.layui-table-view{ .layui-table,.layui-table-view{ // 定义表格样式
margin: 0 0px; margin: 0 0px; // 设置表格的外边距
} }
</style> </style>
</head> </head>
<body> <body>
<!-- 表单 --> <!-- 表单 -->
<table class="layui-hide" id="cardTable" lay-filter="formFilter"></table> <table class="layui-hide" id="cardTable" lay-filter="formFilter"></table> // 创建一个layui表格，隐藏表格，设置ID为cardTable，lay-filter为formFilter
<script src="../public/layui/layui.js" charset="utf-8"></script> <script src="../public/layui/layui.js" charset="utf-8"></script> // 引入layui的JS文件，包含所有layui的功能
<!-- 头部工具栏 --> <!-- 头部工具栏 -->
<script type="text/html" id="headBar"> <script type="text/html" id="headBar">
<button type="button" class="layui-btn layui-btn-sm" lay-event="add"><i class="layui-icon">添加分类</i></button> <button type="button" class="layui-btn layui-btn-sm" lay-event="add"><i class="layui-icon">添加分类</i></button> // 定义一个添加分类的按钮，使用layui的图标
</script> </script>
<!-- 表格后面的操作 --> <!-- 表格后面的操作 -->
<script type="text/html" id="operateBar"> <script type="text/html" id="operateBar">
<a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a> <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a> // 编辑操作按钮
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a> <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a> // 删除操作按钮
</script> </script>
<script> <script>
layui.use(['table','jquery'], function(){ layui.use(['table','jquery'], function(){ // 使用layui的table和jquery模块
$ = layui.jquery; $ = layui.jquery; // 引入jquery库
var table = layui.table; var table = layui.table; // 获取layui的table模块
// 进行渲染 // 进行渲染
var tableIns = table.render({ var tableIns = table.render({ // 渲染表格
elem: '#cardTable' elem: '#cardTable' // 选择表格元素
,url:'./sortList' ,url:'./sortList' // 数据请求URL
,toolbar: '#headBar' ,toolbar: '#headBar' // 设置表格上方的工具栏
,height: 600 ,height: 600 // 设置表格的高度为600px
,cols: [[ ,cols: [[ // 定义表格列
{field:'id', width:80, title: 'ID', sort: true} {field:'id', width:80, title: 'ID', sort: true} // ID列，排序功能开启
,{field:'name', width:180, title: '分类名', sort: true} ,{field:'name', width:180, title: '分类名', sort: true} // 分类名列，排序功能开启
,{field:'description', width:480, title: '描述', sort: true} ,{field:'description', width:480, title: '描述', sort: true} // 描述列，排序功能开启
,{fixed: 'right', title:'操作', toolbar: '#operateBar', align: 'center', width:150} ,{fixed: 'right', title:'操作', toolbar: '#operateBar', align: 'center', width:150} // 操作列，右侧固定，使用自定义工具栏（编辑和删除按钮）
]] ]]
});
// 头部工具栏事件
table.on('toolbar(formFilter)', function(obj){
var checkStatus = table.checkStatus(obj.config.id);
switch(obj.event){
// 添加分类
case 'add':
var addCardLayer = layer.open({
type: 2,
title: '添加借书证',
area: ['800px', '500px'],
maxmin: true,
shadeClose: true,
content: 'sortadd.jsp',
});
};
}); });
// 侧边工具栏事件 // 头部工具栏事件
table.on(('tool(formFilter)'), function(obj){ table.on('toolbar(formFilter)', function(obj){ // 监听表格上方工具栏的事件
var data = obj.data; var checkStatus = table.checkStatus(obj.config.id); // 获取表格选中的行
var layEvent = obj.event; switch(obj.event){ // 根据事件类型执行不同操作
var tr = obj.tr; // 添加分类
var id = data.id; case 'add':
switch(obj.event){ var addCardLayer = layer.open({ // 打开一个layer弹窗
case 'edit': type: 2, // 弹窗类型为iframe
layer.open({ title: '添加借书证', // 弹窗标题
type: 2, area: ['800px', '500px'], // 弹窗大小
title: '更改信息', maxmin: true, // 允许最大化最小化
area: ['800px', '600px'], shadeClose: true, // 点击遮罩关闭弹窗
maxmin: true, content: 'sortadd.jsp', // 弹窗内容为sortadd.jsp页面
shadeClose: true, });
content: 'sortedit.jsp?id=' +id, };
}) });
break;
case 'del': // 侧边工具栏事件
layer.confirm('确认删除么？<br><span style="color:red;">这将会将该分类下的书籍归为未分类</span>', function(){ table.on(('tool(formFilter)'), function(obj){ // 监听表格中操作列的事件（编辑和删除）
$.ajax({ var data = obj.data; // 获取当前行的数据
url: './sortDel', var layEvent = obj.event; // 获取当前事件类型（edit或del）
type: 'get', var tr = obj.tr; // 获取当前行
data: 'id=' +id, var id = data.id; // 获取当前行的ID
success: function(data){ switch(obj.event){ // 根据事件类型执行不同操作
if(data.code == 0){ case 'edit':
parent.layer.msg(data.msg,{ layer.open({ // 打开一个layer弹窗
icon: 6, type: 2, // 弹窗类型为iframe
time: 500 title: '更改信息', // 弹窗标题
}); area: ['800px', '600px'], // 弹窗大小
setTimeout(function(){ maxmin: true, // 允许最大化最小化
parent.location.reload(); shadeClose: true, // 点击遮罩关闭弹窗
}, 500); content: 'sortedit.jsp?id=' + id, // 弹窗内容为sortedit.jsp页面，传递ID参数
}else{ })
layer.msg(data.msg); break;
} case 'del':
} layer.confirm('确认删除么？<br><span style="color:red;">这将会将该分类下的书籍归为未分类</span>', function(){ // 弹出确认删除的提示框
}) $.ajax({ // 发送删除请求
}) url: './sortDel', // 删除操作的URL
} type: 'get', // 请求方法为GET
}) data: 'id=' + id, // 请求数据，传递要删除的ID
success: function(data){ // 请求成功后的回调函数
if(data.code == 0){ // 如果删除成功
parent.layer.msg(data.msg,{ // 弹出成功提示
icon: 6, // 成功图标
time: 500 // 提示框显示时间为500毫秒
});
setTimeout(function(){ // 延时操作
parent.location.reload(); // 刷新父页面
}, 500);
}else{ // 如果删除失败
layer.msg(data.msg); // 弹出错误信息
}
}
})
})
}
})
}); });
</script> </script>
</body> </body>
</html> </html>

131
WebContent/admin/updatePassword.jsp
Unescape View File

@ -1,89 +1,82 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%> // 设置页面的编码方式为UTF-8
<!DOCTYPE html> <!DOCTYPE html> // 声明文档类型为HTML5
<html> <html> // HTML文档开始
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8"> // 设置页面的字符编码为UTF-8
<title>修改密码</title> <title>修改密码</title> // 设置页面标题为“修改密码”
<!-- layui --> <!-- layui -->
<link rel="stylesheet" href="../public/layui/css/layui.css"> <link rel="stylesheet" href="../public/layui/css/layui.css"> // 引入layui的CSS样式文件
<script src="../public/layui/layui.js"></script> <script src="../public/layui/layui.js"></script> // 引入layui的JavaScript文件
<style> <style>
.layui-form{ .layui-form{ // 设置layui表单的样式
margin: 10px 20px; margin: 10px 20px; // 设置表单的外边距
}
} </style>
</style>
</head>
</head> </head>
<body> <body>
<form class="layui-form layui-form-pane" action="" lay-filter="formFilter"> <form class="layui-form layui-form-pane" action="" lay-filter="formFilter"> // 创建layui表单，设置formFilter作为表单过滤器
<div class="layui-form-item"> <div class="layui-form-item"> // 定义表单项
<label class="layui-form-label">旧密码</label> <label class="layui-form-label">旧密码</label> // 设置标签为“旧密码”
<div class="layui-input-block"> <div class="layui-input-block"> // 输入框所在块
<input type="password" name="oldPassword" lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input"> <input type="password" name="oldPassword" lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input"> // 密码输入框，带有验证规则
</div> </div>
</div> </div>
<div class="layui-form-item"> <div class="layui-form-item"> // 定义表单项
<label class="layui-form-label">新密码</label> <label class="layui-form-label">新密码</label> // 设置标签为“新密码”
<div class="layui-input-block"> <div class="layui-input-block"> // 输入框所在块
<input type="password" name="newPassword" lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input"> <input type="password" name="newPassword" lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input"> // 新密码输入框，带有验证规则
</div> </div>
</div> </div>
<div class="layui-form-item"> <div class="layui-form-item"> // 定义表单项
<label class="layui-form-label">确认密码</label> <label class="layui-form-label">确认密码</label> // 设置标签为“确认密码”
<div class="layui-input-block"> <div class="layui-input-block"> // 输入框所在块
<input type="password" name="conPassword" lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input"> <input type="password" name="conPassword" lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input"> // 确认密码输入框，带有验证规则
</div> </div>
</div> </div>
<div class="layui-form-item"> // 定义表单项
<div class="layui-form-item"> <div class="layui-input-block"> // 输入框所在块
<div class="layui-input-block"> <button type="submit" class="layui-btn" lay-submit="" lay-filter="submitButton">确认修改</button> // 提交按钮，点击提交表单
<button type="submit" class="layui-btn" lay-submit="" lay-filter="submitButton">确认修改</button>
</div> </div>
</div> </div>
</form> </form>
<script>
<script>
layui.use(['form', 'jquery'], function(){ // 使用layui的form和jquery模块
$ = layui.jquery; // 获取jquery库
var form = layui.form, // 获取layui的form模块
layer = layui.layer; // 获取layui的layer模块
layui.use(['form', 'jquery'], function(){ // 监听提交事件
$ = layui.jquery; form.on('submit(submitButton)', function(data){ // 监听“确认修改”按钮点击事件
var form = layui.form $.ajax({
,layer = layui.layer url: './updatePassword', // 提交的URL地址
//监听提交 method: 'post', // 提交方式为POST
form.on('submit(submitButton)', function(data){ data: data.field, // 提交的数据
$.ajax({ dataType: 'json', // 预期返回的数据类型为JSON
url: './updatePassword', success: function(data){ // 请求成功回调函数
method: 'post', if(data.code == "0"){ // 如果返回的代码是“0”，表示修改成功
data: data.field, parent.layer.msg("修改成功",{ // 在父页面显示成功消息
dataType: 'json', icon: 6, // 使用成功的图标
success: function(data){ time: 500 // 500毫秒后关闭消息框
if(data.code == "0"){ });
parent.layer.msg("修改成功",{ setTimeout(function(){ // 设置延迟操作
icon: 6, var index = parent.layer.getFrameIndex(window.name); // 获取当前iframe窗口的索引
time: 500 parent.layer.close(index); // 关闭当前iframe窗口
}); }, 500);
setTimeout(function(){ }else{
var index = parent.layer.getFrameIndex(window.name); //操作父页面 layer.msg(data.msg); // 如果修改失败，弹出错误信息
parent.layer.close(index); }
}, 500); }
}else{ })
layer.msg(data.msg);
}
}
})
return false;
});
});
return false; // 阻止表单默认提交
});
});
</script> </script>
</body> </body>
</html> </html>

115
WebContent/adminLogin.html
Unescape View File

@ -1,67 +1,66 @@
<!DOCTYPE html> <!DOCTYPE html> // 声明文档类型为HTML5
<html> <html> // HTML文档开始
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8"> // 设置页面的字符编码为UTF-8
<title>登录页面</title> <title>登录页面</title> // 设置页面标题为“登录页面”
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> // 设置视口，确保在移动设备上有良好的显示效果
<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script> <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script> // 引入jQuery库（通过CDN）
<!-- 最新版本的 Bootstrap 核心 CSS 文件 --> <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> // 引入Bootstrap的CSS样式文件
<!-- 最新的 Bootstrap 核心 JavaScript 文件 --> <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> // 引入Bootstrap的JS文件
<!-- 可选的 Bootstrap 主题文件（一般不用引入） --> <!-- 可选的 Bootstrap 主题文件（一般不用引入） -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> // 引入Bootstrap的主题样式文件
<link rel="stylesheet" href="./public/css/animate.css"> <link rel="stylesheet" href="./public/css/animate.css"> // 引入animate.css，提供CSS动画效果
<link rel="stylesheet" href="./public/css/login.css" /> <link rel="stylesheet" href="./public/css/login.css" /> // 引入自定义的登录页面样式文件
</head> </head>
<body> <body>
<div class="container main"> <div class="container main"> //使用Bootstrap的container类，设置容器
<div id="login" class="contain animated fadeInDown"> <div id="login" class="contain animated fadeInDown"> // 设置登录框，包含动画效果（从上方渐入）
<h1>系统管理员登录</h1> <h1>系统管理员登录</h1> // 显示标题“系统管理员登录”
<form method="post"> <form method="post"> // 表单使用POST方法提交
<input type="text" name="username" class="form-control my_input" placeholder="请输入账号" required="required"> <input type="text" name="username" class="form-control my_input" placeholder="请输入账号" required="required"> // 输入框，要求用户输入账号，使用form-control样式
<input type="password" name="password" class="form-control my_input" placeholder="请输入密码" required="required"> <input type="password" name="password" class="form-control my_input" placeholder="请输入密码" required="required"> // 输入框，要求用户输入密码，使用form-control样式
<input type="submit" class="form-control" value="登录" onclick="javascript:void(0);"> <input type="submit" class="form-control" value="登录" onclick="javascript:void(0);"> // 提交按钮，点击时调用JS函数（不会刷新页面）
</form> </form>
</div>
</div> </div>
<div style="position:fixed; bottom:0; right:0;"> </div>
<a href="loginReader.html" target="_blank"><img src="public/image/reader.png" width="50px" height="50px"></a><br> <div style="position:fixed; bottom:0; right:0;"> // 设置固定位置，位于页面底部右侧
<a href="loginManager.html" target="_blank"><img src="public/image/manager.png" width="50px" height="50px"></a> <a href="loginReader.html" target="_blank"><img src="public/image/reader.png" width="50px" height="50px"></a><br> // 链接到“读者登录”页面，显示图片图标
</div> <a href="loginManager.html" target="_blank"><img src="public/image/manager.png" width="50px" height="50px"></a> // 链接到“管理员登录”页面，显示图片图标
<script src="./public/js/layer/layer.js"></script> </div>
<script> <script src="./public/js/layer/layer.js"></script> // 引入layer.js，用于弹窗提示
$(function(){ <script>
//登录 $(function(){ // 使用jQuery，等待DOM加载完成
$("input[type=submit]").click(function(){ //登录
$("input[type=submit]").click(function(){ // 监听提交按钮的点击事件
$.ajax({ $.ajax({ // 使用AJAX发送请求
url: "./adminLogin", url: "./adminLogin", // 提交的URL地址为“adminLogin”
type: "post", type: "post", // 请求方式为POST
data: $("form").serialize(), data: $("form").serialize(), // 序列化表单数据，发送到后端
dataType: "json", dataType: "json", // 设置返回的数据类型为JSON
success: function( data ){ success: function( data ){ // 请求成功时的回调函数
if(data.code == 0){ if(data.code == 0){ // 如果返回的code为0，表示登录成功
layer.msg("登录成功", { layer.msg("登录成功", { // 弹出登录成功提示
icon: 6, icon: 6, // 设置提示图标为“成功”图标
time: 1000 time: 1000 // 显示时间为1秒
}, function(){ }, function(){ // 在成功提示后，跳转到指定的URL
location.href = data.url; location.href = data.url;
}) })
}else{ }else{ // 如果登录失败
layer.open({ layer.open({ // 弹出登录失败提示
title: "登录失败", title: "登录失败", // 设置提示框标题
content: data.msg, content: data.msg, // 显示返回的错误消息
icon: 5, icon: 5, // 设置提示图标为“错误”图标
anim: 6 anim: 6 // 设置提示框的动画效果
}) })
}
} }
}) }
return false;
}) })
return false; // 阻止表单的默认提交行为
}) })
</script> })
</script>
</body> </body>
</html> </html>

112
WebContent/loginManager.html
Unescape View File

@ -1,67 +1,67 @@
<!DOCTYPE html> <!DOCTYPE html> <!-- 声明文档类型为HTML5 -->
<html> <html> <!-- HTML文档的根元素 -->
<head> <head> <!-- head元素包含元数据 -->
<meta charset="UTF-8"> <meta charset="UTF-8"> <!-- 设置字符编码为UTF-8 -->
<title>图书管理员登录页面</title> <title>图书管理员登录页面</title> <!-- 设置网页标题 -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> <!-- 设置视口属性，使页面在移动设备上正常显示 -->
<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
<!-- 最新版本的 Bootstrap 核心 CSS 文件 --> <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<!-- 最新的 Bootstrap 核心 JavaScript 文件 --> <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<!-- 可选的 Bootstrap 主题文件（一般不用引入） --> <!-- 可选的 Bootstrap 主题文件（一般不用引入） -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
<link rel="stylesheet" href="./public/css/animate.css"> <link rel="stylesheet" href="./public/css/animate.css"> <!-- 引入动画样式表 -->
<link rel="stylesheet" href="./public/css/login.css" /> <link rel="stylesheet" href="./public/css/login.css" /> <!-- 引入自定义登录样式表 -->
</head> </head>
<body> <body> <!-- body元素包含网页内容 -->
<div class="container main"> <div class="container main"> <!-- 主容器 -->
<div id="login" class="contain animated fadeInDown"> <div id="login" class="contain animated fadeInDown"> <!-- 登录表单容器，带有动画效果 -->
<h1>工作人员登录</h1> <h1>工作人员登录</h1> <!-- 登录标题 -->
<form method="post"> <form method="post"> <!-- 表单，使用POST方法提交 -->
<input type="text" name="user" class="form-control my_input" placeholder="请输入账号" required="required"> <input type="text" name="user" class="form-control my_input" placeholder="请输入账号" required="required"> <!-- 用户名输入框 -->
<input type="password" name="psw" class="form-control my_input" placeholder="请输入密码" required="required"> <input type="password" name="psw" class="form-control my_input" placeholder="请输入密码" required="required"> <!-- 密码输入框 -->
<input type="submit" class="form-control" value="登录" onclick="javascript:void(0);"> <input type="submit" class="form-control" value="登录" onclick="javascript:void(0);"> <!-- 提交按钮 -->
</form> </form>
</div>
</div>
<div style="position:fixed; bottom:0; right:0;">
<a href="reader/04readerFrame.jsp" target="_blank"><img src="public/image/reader.png" width="50px" height="50px"></a><br>
<a href="adminLogin.html" target="_blank"><img src="public/image/admin.png" width="50px" height="50px"></a>
</div> </div>
</div>
<div style="position:fixed; bottom:0; right:0;"> <!-- 固定位置的链接容器 -->
<a href="reader/04readerFrame.jsp" target="_blank"><img width="50px" height="50px"></a><br> <!-- 读者管理链接 -->
<a href="adminLogin.html" target="_blank"><img width="50px" height="50px"></a> <!-- 管理员登录链接 -->
</div>
<script src="./public/js/layer/layer.js"></script> <script src="./public/js/layer/layer.js"></script>
<script> <script>
$(function(){ $(function(){ <!-- jQuery文档就绪函数 -->
//登录 //登录
$("input[type=submit]").click(function(){ $("input[type=submit]").click(function(){ <!-- 绑定点击事件到提交按钮 -->
$.ajax({ $.ajax({ <!-- 发起Ajax请求 -->
url: "./managerLogin", url: "./managerLogin", <!-- 请求URL -->
type: "post", type: "post", <!-- 请求类型为POST -->
data: $("form").serialize(), data: $("form").serialize(), <!-- 序列化表单数据作为请求参数 -->
dataType: "json", dataType: "json", <!-- 期望服务器返回JSON格式的数据 -->
success: function( data ){ success: function( data ){ <!-- 请求成功时的回调函数 -->
if(data.code == 0){ if(data.code == 0){ <!-- 如果返回码为0，表示登录成功 -->
layer.msg("登录成功", { layer.msg("登录成功", { <!-- 弹出提示消息 -->
icon: 6, icon: 6, <!-- 图标类型 -->
time: 1000 time: 1000 <!-- 显示时间 -->
}, function(){ }, function(){
location.href = data.url; location.href = data.url; <!-- 跳转到指定URL -->
}) })
}else{ }else{ <!-- 如果返回码不为0，表示登录失败 -->
layer.open({ layer.open({ <!-- 弹出错误提示框 -->
title: "登录失败", title: "登录失败", <!-- 提示框标题 -->
content: data.msg, content: data.msg, <!-- 提示框内容 -->
icon: 5, icon: 5, <!-- 图标类型 -->
anim: 6 anim: 6 <!-- 动画效果 -->
}) })
}
} }
} })
return false; <!-- 阻止默认表单提交行为 -->
}) })
return false;
}) })
})
</script> </script>
</body> </body>
</html> </html>

113
WebContent/loginReader.html
Unescape View File

@ -1,72 +1,71 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8"> <!-- 设置文档字符编码为UTF-8 -->
<title>借阅者登录页面</title> <title>借阅者登录页面</title> <!-- 设置网页标题 -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> <!-- 设置视口属性，使页面在移动设备上显示良好 -->
<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
<!-- 最新版本的 Bootstrap 核心 CSS 文件 --> <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<!-- 最新的 Bootstrap 核心 JavaScript 文件 --> <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> <!-- 可选的 Bootstrap 主题文件（一般不用引入） -->
<!-- 可选的 Bootstrap 主题文件（一般不用引入） --> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> <link rel="stylesheet" href="./public/css/animate.css"> <!-- 引入动画效果的CSS文件 -->
<link rel="stylesheet" href="./public/css/animate.css"> <link rel="stylesheet" href="./public/css/login.css" /> <!-- 引入自定义的登录页面样式表 -->
<link rel="stylesheet" href="./public/css/login.css" /> <style>
<style> button:hover{
button:hover{ background-color:#ffd6e7; /* 鼠标悬停在按钮上时的背景颜色 */
background-color:#ffd6e7; }
} </style>
</style>
</head> </head>
<body> <body>
<div class="container main"> <div class="container main"> <!-- 主容器 -->
<div id="login" class="contain animated fadeInDown"> <div id="login" class="contain animated fadeInDown"> <!-- 登录表单容器，添加了动画效果 -->
<h1>借阅者登录</h1> <h1>借阅者登录</h1> <!-- 页面标题 -->
<form method="post"> <form method="post"> <!-- 登录表单，使用POST方法提交数据 -->
<input type="text" name="user" class="form-control my_input" placeholder="请输入账号" required="required"> <input type="text" name="user" class="form-control my_input" placeholder="请输入账号" required="required"> <!-- 用户名输入框 -->
<input type="password" name="psw" class="form-control my_input" placeholder="请输入密码" required="required"> <input type="password" name="psw" class="form-control my_input" placeholder="请输入密码" required="required"> <!-- 密码输入框 -->
<input type="submit" class="form-control" value="登录" onclick="javascript:void(0);"> <input type="submit" class="form-control" value="登录" onclick="javascript:void(0);"><!-- 提交按钮 -->
</form> </form>
</div>
</div> </div>
<div style="position:fixed; bottom:0; right:0;"> </div>
<a href="loginManager.html" target="_blank"><img src="public/image/manager.png" width="50px" height="50px"></a><br> <div style="position:fixed; bottom:0; right:0;"> <!-- 固定位置的链接容器 -->
<a href="adminLogin.html" target="_blank"><img src="public/image/admin.png" width="50px" height="50px"></a> <a href="loginManager.html" target="_blank"><img width="50px" height="50px"></a><br> <!-- 跳转到管理员登录页面的链接 -->
</div> <a href="adminLogin.html" target="_blank"><img width="50px" height="50px"></a> <!-- 跳转到管理员登录页面的链接 -->
<script src="./public/js/layer/layer.js"></script> </div>
<script>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <!-- 引入jQuery库 -->
<script src="https://cdn.bootcdn.net/ajax/libs/layer/3.1.1/layer.js"></script> <!-- 引入Layer弹窗插件 -->
<script>
$(function(){ $(function(){
//登录 // 登录操作
$("input[type=submit]").click(function(){ $("input[type=submit]").click(function(){
$.ajax({ $.ajax({
url: "./readerLogin", url: "./readerLogin", // 请求的URL地址
type: "post", type: "post", // 请求类型为POST
data: $("form").serialize(), data: $("form").serialize(), // 序列化表单数据
dataType: "json", dataType: "json", // 预期服务器返回的数据类型为JSON
success: function( data ){ success: function(data){ // 成功回调函数
if(data.code == 0){ if(data.code == 0){ // 如果返回的code为0，表示登录成功
layer.msg("登录成功", { layer.msg("登录成功", {
icon: 6, icon: 6, // 图标类型为笑脸
time: 1000 time: 1000 // 显示时间为1秒
}, function(){ }, function(){
location.href = data.url; location.href = data.url; // 跳转到指定URL
}) });
}else{ } else { // 如果返回的code不为0，表示登录失败
layer.open({ layer.open({
title: "登录失败", title: "登录失败", // 弹窗标题
content: data.msg, content: data.msg, // 弹窗内容为返回的错误信息
icon: 5, icon: 5, // 图标类型为哭脸
anim: 6 anim: 6 // 动画效果
}) });
} }
} }
}) });
return false; return false; // 阻止表单默认提交行为
}) });
}) });
</script> </script>
</body> </body>
</html> </html>

107
WebContent/manager/01nav.jsp
Unescape View File

@ -1,85 +1,134 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%>
<!-- 页面指令，设置页面语言为Java，内容类型为HTML，字符编码为UTF-8 -->
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!-- 文档类型声明，使用HTML 4.01 Transitional DTD -->
<html> <html>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<!-- 设置页面字符编码为UTF-8 -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<!-- 视口设置，确保页面在移动设备上正确显示 -->
<title>图书馆管理人员页面</title> <title>图书馆管理人员页面</title>
<link rel="stylesheet" href="../public/layui/css/layui.css"> <!-- 页面标题 -->
<script src="../public/layui/layui.js"></script>
<link rel="stylesheet" href="../public/layui/css/layui.css">
<!-- 引入LayUI的CSS样式文件 -->
</head> </head>
<body class="layui-layout-body"> <body class="layui-layout-body">
<!-- 页面主体部分，应用LayUI布局类 -->
<div class="layui-layout layui-layout-admin"> <div class="layui-layout layui-layout-admin">
<!-- LayUI布局容器，应用管理员布局类 -->
<div class="layui-header"> <div class="layui-header">
<!-- 头部区域 -->
<div class="layui-logo">图书馆管理人员页面</div> <div class="layui-logo">图书馆管理人员页面</div>
<!-- 网站Logo和标题 -->
<!-- 头部区域（可配合layui已有的水平导航） --> <!-- 头部区域（可配合layui已有的水平导航） -->
<ul class="layui-nav layui-layout-left">
<ul class="layui-nav layui-layout-left"> <!-- 左侧导航栏，应用LayUI导航类 -->
<li class="layui-nav-item"> <li class="layui-nav-item">
<a href="javascript:;">其它系统</a> <a href=";">其它系统</a>
<!-- 导航项：其它系统 -->
<dl class="layui-nav-child"> <dl class="layui-nav-child">
<!-- 子菜单 -->
<dd><a href="../reader/04readerFrame.jsp" target="parent">图书馆首页</a></dd> <dd><a href="../reader/04readerFrame.jsp" target="parent">图书馆首页</a></dd>
<!-- 子菜单项：图书馆首页 -->
<dd><a href="../adminLogin.html" target="parent">系统管理员</a></dd> <dd><a href="../adminLogin.html" target="parent">系统管理员</a></dd>
<!-- 子菜单项：系统管理员登录页 -->
</dl> </dl>
</li> </li>
</ul> </ul>
<ul class="layui-nav layui-layout-right"> <ul class="layui-nav layui-layout-right">
<!-- 右侧导航栏，应用LayUI导航类 -->
<li class="layui-nav-item"> <li class="layui-nav-item">
<a href="javascript:;"> <a href=";">
<%=session.getAttribute("manager") %> <%=session.getAttribute("manager") %>
<!-- 动态显示当前登录的管理人员名称 -->
</a> </a>
<dl class="layui-nav-child"> <dl class="layui-nav-child">
<dd><a href="09managerSelf.jsp" target="content">基本资料</a></dd> <!-- 子菜单 -->
<dd><a href="09managerSelf.jsp" target="content">基本资料</a></dd>
<!-- 子菜单项：基本资料 -->
</dl> </dl>
</li> </li>
<li class="layui-nav-item"><a href="./quit" target="_parent">退出</a></li> <li class="layui-nav-item"><a href="./quit" target="_parent">退出</a></li>
<!-- 导航项：退出 -->
</ul> </ul>
</div> </div>
<div class="layui-side layui-bg-black"> <div class="layui-side layui-bg-black">
<!-- 左侧侧边栏，应用黑色背景类 -->
<div class="layui-side-scroll"> <div class="layui-side-scroll">
<!-- 滚动区域 -->
<!-- 左侧导航区域（可配合layui已有的垂直导航） --> <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
<ul class="layui-nav layui-nav-tree" lay-filter="test"> <ul class="layui-nav layui-nav-tree" lay-filter="test">
<!-- 垂直导航树，应用LayUI导航树类 -->
<li class="layui-nav-item layui-nav-itemed"> <li class="layui-nav-item layui-nav-itemed">
<a class="" href="javascript:;"><i class="layui-icon layui-icon-read" style="font-size: 20px; color: lightblue;"></i>&nbsp;图书管理</a> <a class="" href=";"><i class="layui-icon layui-icon-read" style="font-size: 20px; color: lightblue;"></i>&nbsp;图书管理</a>
<!-- 主导航项：图书管理 -->
<dl class="layui-nav-child"> <dl class="layui-nav-child">
<!-- 子菜单 -->
<dd><a href="02borrow.jsp" target="content">借阅图书</a></dd> <dd><a href="02borrow.jsp" target="content">借阅图书</a></dd>
<dd><a href="04judge.jsp;" target="content">归还图书</a></dd> <!-- 子菜单项：借阅图书 -->
<dd><a href="04judge.jsp;" target="content">归还图书</a></dd>
<!-- 子菜单项：归还图书 -->
</dl> </dl>
</li> </li>
<li class="layui-nav-item"> <li class="layui-nav-item">
<a href="javascript:;"><i class="layui-icon layui-icon-form" style="font-size: 20px; color: orange;"></i>&nbsp;报表管理</a> <a href=";"><i class="layui-icon layui-icon-form" style="font-size: 20px; color: orange;"></i>&nbsp;报表管理</a>
<!-- 主导航项：报表管理 -->
<dl class="layui-nav-child"> <dl class="layui-nav-child">
<!-- 子菜单 -->
<dd><a href="06borrowTable.jsp" target="content">借书报表</a></dd> <dd><a href="06borrowTable.jsp" target="content">借书报表</a></dd>
<!-- 子菜单项：借书报表 -->
<dd><a href="07returnTable.jsp" target="content">还书报表</a></dd> <dd><a href="07returnTable.jsp" target="content">还书报表</a></dd>
<!-- 子菜单项：还书报表 -->
</dl> </dl>
</li> </li>
<li class="layui-nav-item"><a href="08announcement.jsp" target="content"><i class="layui-icon layui-icon-release" style="font-size: 20px; color: yellow;"></i>&nbsp;发布公告</a></li> <li class="layui-nav-item"><a href="08announcement.jsp" target="content"><i class="layui-icon layui-icon-release" style="font-size: 20px; color: yellow;"></i>&nbsp;发布公告</a></li>
<!-- 主导航项：发布公告 -->
</ul> </ul>
</div> </div>
</div> </div>
<div class="layui-body"> <div class="layui-body">
<!-- 内容主体区域 --> <!-- 内容主体区域 -->
<iframe src="02borrow.jsp" name="content" height="100%" width="100%" frameborder="0" ></iframe>
<iframe name="content" height="100%" width="100%" frameborder="0"></iframe>
<!-- 内嵌框架，用于加载不同页面内容 -->
</div> </div>
<div class="layui-footer"> <div class="layui-footer">
<!-- 底部固定区域 --> <!-- 底部固定区域 -->
© 图书管理系统 &#169; 图书管理系统
<!-- 版权信息 -->
</div> </div>
</div> </div>
<script src="../src/layui.js"></script>
<script>
//JavaScript代码区域
layui.use('element', function(){
var element = layui.element;
});
</script>
</body> </body>
</html> </html>

219
WebContent/manager/02borrow.jsp
Unescape View File

@ -1,114 +1,137 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%>
<!-- 设置页面语言为Java，内容类型为HTML，字符编码为UTF-8 -->
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!-- 定义文档类型为HTML 4.01 Transitional -->
<html> <html>
<head> <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title> <!-- 设置页面的字符编码为UTF-8 -->
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <title>Insert title here</title>
<script src="../public/layui/layui.js"></script> <!-- 设置页面标题 -->
<style> <link rel="stylesheet" href="../public/layui/css/layui.css" media="all">
.layui-form-label{ <!-- 引入Layui的CSS样式文件 -->
margin-left:20%;
} <style>
</style> .layui-form-label{
margin-left:20%;
}
</style>
<!-- 自定义样式，将表单标签的左边距设置为20% -->
</head> </head>
<body> <body>
<div align="center" style=" margin-top: 2%;"><h1>借阅图书</h1></div> <div align="center" style=" margin-top: 2%;"><h1>借阅图书</h1></div>
<div align="center" <!-- 居中显示标题“借阅图书”，并设置顶部边距为2% -->
style="margin-left:30%; margin-top: 5%; width: 40%;"> <div align="center"
style="margin-left:30%; margin-top: 5%; width: 40%;">
<form class="layui-form layui-form-pane" action="03borrowSus.jsp"> <!-- 设置表单容器的左外边距、上外边距和宽度 -->
<div class="layui-form-item">
<label class="layui-form-label">借阅证号</label>
<div class="layui-input-inline">
<input type="text" name="userid" lay-verify="required"
placeholder="请输入借阅证号" autocomplete="off" class="layui-input"><br>
</div>
<form class="layui-form layui-form-pane" action="03borrowSus.jsp">
<!-- 创建一个表单，指定使用Layui的表单类，并设置提交地址为03borrowSus.jsp -->
<div class="layui-form-item">
<label class="layui-form-label">借阅证号</label>
<!-- 创建表单标签，标签内容为“借阅证号” -->
<div class="layui-input-inline">
<input type="text" name="userid" lay-verify="required"
placeholder="请输入借阅证号" autocomplete="off" class="layui-input"><br>
<!-- 创建文本输入框，名称为userid，验证规则为必填，占位符为“请输入借阅证号”，自动完成关闭，并应用Layui的输入框样式 -->
</div> </div>
<div class="layui-form-item">
<label class="layui-form-label">图书编号</label> </div>
<div class="layui-input-inline"> <div class="layui-form-item">
<input type="text" name="bookid" lay-verify="required" <label class="layui-form-label">图书编号</label>
placeholder="请输入图书编号" autocomplete="off" class="layui-input"><br> <!-- 创建表单标签，标签内容为“图书编号” -->
</div> <div class="layui-input-inline">
<input type="text" name="bookid" lay-verify="required"
placeholder="请输入图书编号" autocomplete="off" class="layui-input"><br>
<!-- 创建文本输入框，名称为bookid，验证规则为必填，占位符为“请输入图书编号”，自动完成关闭，并应用Layui的输入框样式 -->
</div> </div>
<div class="layui-form-item"> </div>
<label class="layui-form-label">借阅日期</label>
<div class="layui-input-inline">
<input type="text" name="date1" id="date1" autocomplete="off"
class="layui-input"><br>
</div>
<div class="layui-form-item">
<label class="layui-form-label">借阅日期</label>
<!-- 创建表单标签，标签内容为“借阅日期” -->
<div class="layui-input-inline">
<input type="text" name="date1" id="date1" autocomplete="off"
class="layui-input"><br>
<!-- 创建文本输入框，名称为date1，ID为date1，自动完成关闭，并应用Layui的输入框样式 -->
</div> </div>
</div>
<div class="layui-form-item" align="center">
<button class="layui-btn" lay-submit="" lay-filter="demo2">借阅</button> <div class="layui-form-item" align="center">
</div> <button class="layui-btn" lay-submit="" lay-filter="demo2">借阅</button>
</form> <!-- 创建一个按钮，应用Layui的按钮样式，并设置点击时提交表单，过滤器为demo2 -->
</div>
</form>
<script>
layui
.use( layui
[ 'form', 'layedit', 'laydate' ], .use(
function() { [ 'form', 'layedit', 'laydate' ],
var form = layui.form, layer = layui.layer, layedit = layui.layedit, laydate = layui.laydate; function() {
//日期 var form = layui.form, layer = layui.layer, layedit = layui.layedit, laydate = layui.laydate;
laydate.render({ <!-- 加载Layui的form、layer、layedit和laydate模块 -->
elem : '#date1',
type : 'datetime', //日期
format : 'yyyy-M-d H:m:s', laydate.render({
value: new Date() elem : '#date1',
}); type : 'datetime',
laydate.render({ format : 'yyyy-M-d H:m:s',
elem : '#date2', value: new Date()
type : 'datetime', });
format : 'yyyy-M-d H:m:s' <!-- 渲染日期选择器，绑定到ID为date1的元素，类型为日期时间，格式为“年-月-日 时:分:秒”，默认值为当前日期 -->
});
laydate.render({
//创建一个编辑器 elem : '#date2',
var editIndex = layedit type : 'datetime',
.build('LAY_demo_editor'); format : 'yyyy-M-d H:m:s'
});
<!-- 渲染另一个日期选择器，绑定到ID为date2的元素，类型为日期时间，格式为“年-月-日 时:分:秒” -->
//监听提交
form.on('submit(demo1)', function(data) {
layer.alert(JSON.stringify(data.field), { //创建一个编辑器
title : '最终的提交信息' var editIndex = layedit
}) .build('LAY_demo_editor');
return false;
});
//监听提交
//表单赋值 form.on('submit(demo1)', function(data) {
layui.$('#LAY-component-form-setval').on( layer.alert(JSON.stringify(data.field), {
'click', function() { title : '最终的提交信息'
form.val('example', { })
"username" : "贤心" // "name": "value" return false;
, });
"password" : "123456",
"interest" : 1, //表单赋值
"like[write]" : true //复选框选中状态 layui.$('#LAY-component-form-setval').on(
, 'click', function() {
"close" : true //开关状态 form.val('example', {
, "username" : "贤心" // "name": "value"
"sex" : "女", ,
"desc" : "我爱 layui" "password" : "123456",
}); "interest" : 1,
}); "like[write]" : true //复选框选中状态
,
//表单取值 "close" : true //开关状态
layui.$('#LAY-component-form-getval').on( ,
'click', function() { "sex" : "女",
var data = form.val('example'); "desc" : "我爱 layui"
alert(JSON.stringify(data)); });
}); });
}); //表单取值
</script> layui.$('#LAY-component-form-getval').on(
</div> 'click', function() {
var data = form.val('example');
(JSON.stringify(data));
});
});
});
</script>
</div>
</body> </body>
</html> </html>

278
WebContent/manager/03borrowSus.jsp
Unescape View File

@ -1,163 +1,137 @@
<%@ page import="java.sql.*"%> <%@ page import="java.sql.*" %>
<%@ page import="javabean.EndTime"%> <%@ page import="javabean.EndTime" %>
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html> <html>
<head> <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title> <title>Insert title here</title>
</head> </head>
<body> <body>
<jsp:useBean id="borrow" scope="session" class="javabean.JDBCBean"></jsp:useBean> <jsp:useBean id="borrow" scope="session" class="javabean.JDBCBean"></jsp:useBean>
<% <%
String user = request.getParameter("userid"); String user = request.getParameter("userid"); // 获取请求参数中的用户ID
String book = request.getParameter("bookid"); String book = request.getParameter("bookid"); // 获取请求参数中的图书ID
String date1 = request.getParameter("date1"); String date1 = request.getParameter("date1"); // 获取请求参数中的借阅日期
// String date2 = request.getParameter("date2"); // 获取请求参数中的归还日期（被注释掉）
//String date2 = request.getParameter("date2");
String sql1 = "select * from borrow_card where ID =" + user;
ResultSet rs1 = borrow.executeQuery(sql1);
if(session.getAttribute("manager")!=null){
if (rs1.next()) {
String rule = rs1.getString("rule_id");
int cardstatus = Integer.parseInt(rs1.getString("STATUS"));
String sql4="select*from rules where id = "+rule;
ResultSet rs4 = borrow.executeQuery(sql4);
int n =0;
String library = "";
String[] libraryArray = {};
int num = 0;
while(rs4.next()){
n=rs4.getInt("limit_day");
library = rs4.getString("borrow_library");
libraryArray=library.split("、");
num = rs4.getInt("borrow_num");
}
EndTime endtime = new EndTime();
String end = endtime.show(n);
if(cardstatus!=0){
String sql2 = "select * from books where ID =" + book;
ResultSet rs2 = borrow.executeQuery(sql2);
if(rs2.next()){
int status=Integer.parseInt(rs2.getString("STATUS"));
String lib = Integer.toString(rs2.getInt("library_id"));
for(int z=0;z<libraryArray.length;z++){
//out.println(lib);
//out.println(libraryArray[z]);
if(libraryArray[z].equals(lib)){
String countSql = "select count(*) as count from borrow_books where manager_id is null and card_id ="+ user;
ResultSet rsSql = borrow.executeQuery(countSql); String sql1 = "select * from borrow_card where ID =" + user; // SQL查询语句，根据用户ID查询借阅卡信息
int count=0; ResultSet rs1 = borrow.executeQuery(sql1); // 执行SQL查询，返回结果集
while(rsSql.next()){
count = rsSql.getInt("count"); if(session.getAttribute("manager")!=null){ // 检查会话中是否有管理员登录
} if (rs1.next()) { // 如果查询到借阅卡信息
//out.println(count); String rule = rs1.getString("rule_id"); // 获取借阅卡的规则ID
if(count<num){ int cardstatus = Integer.parseInt(rs1.getString("STATUS")); // 获取借阅卡状态
if(status==1){
String sql = "insert borrow_books(CARD_ID,BOOK_ID,BORROW_DATE,END_DATE)values('" + user + "','" + book String sql4="select*from rules where id = " + rule; // SQL查询语句，根据规则ID查询规则信息
+ "','" + date1 + "','" + end + "');"; ResultSet rs4 = borrow.executeQuery(sql4); // 执行SQL查询，返回结果集
try { int n = 0; // 初始化变量n
int i = borrow.executeUpdate(sql); String library = ""; // 初始化图书馆字符串
if (i == 1) { String[] libraryArray = {}; // 初始化图书馆数组
%> int num = 0; // 初始化可借阅数量
<script> while(rs4.next()){ // 遍历规则结果集
alert('借阅成功！'); n = rs4.getInt("limit_day"); // 获取借阅天数限制
window.location.href = "02borrow.jsp"; library = rs4.getString("borrow_library"); // 获取可借阅的图书馆
</script> libraryArray = library.split("、"); // 将图书馆字符串分割成数组
num = rs4.getInt("borrow_num"); // 获取可借阅数量
<%
String sql3="update books set STATUS=0 where ID="+book;
borrow.executeUpdate(sql3);
} else {
%>
<script>
alert('借阅未成功！');
window.location.href = "02borrow.jsp";
</script>
<%
}
} catch (Exception e) {
%>
<script>
alert('借阅未成功！');
window.location.href = "02borrow.jsp";
</script>
<%
}
}else{
%>
<script>
alert('该图书已借出！');
window.location.href = "02borrow.jsp";
</script>
<%
}
}else{
%>
<script>
alert('该用户已达到可借阅数量！若需还借书，请先还书！');
window.location.href = "02borrow.jsp";
</script>
<%
}
}
if(z==libraryArray.length-1 && !libraryArray[z].equals(lib)){
%>
<script>
alert('该图书未在可借阅的图书馆内！');
window.location.href = "02borrow.jsp";
</script>
<%
}
}
}else{
%>
<script>
alert('该图书不存在！');
window.location.href = "02borrow.jsp";
</script>
<%
}
}else{
%>
<script>
alert('借阅证已挂失！');
window.location.href = "02borrow.jsp";
</script>
<%
}
} else {
%>
<script>
alert('用户不存在！');
window.location.href = "02borrow.jsp";
</script>
<%
} }
}else{
%>
<script>
alert('请先登录！');
window.parent.location.href = "../loginManager.html";
</script>
<%
}
%>
EndTime endtime = new EndTime(); // 创建EndTime对象
String end = endtime.show(n); // 计算并获取借阅结束日期
if(cardstatus!=0){ // 如果借阅卡状态有效
String sql2 = "select * from books where ID =" + book; // SQL查询语句，根据图书ID查询图书信息
ResultSet rs2 = borrow.executeQuery(sql2); // 执行SQL查询，返回结果集
if (rs2.next()) { // 如果查询到图书信息
int status = Integer.parseInt(rs2.getString("STATUS")); // 获取图书状态
String lib = Integer.toString(rs2.getInt("library_id")); // 获取图书所在图书馆ID
for(int z=0;z<libraryArray.length;z++){ // 遍历图书馆数组
if(libraryArray[z].equals(lib)){ // 如果图书所在图书馆在可借阅范围内
String countSql = "select count(*) as count from borrow_books where manager_id is null and card_id =" + user; // SQL查询语句，统计当前用户已借阅的图书数量
ResultSet rsSql = borrow.executeQuery(countSql); // 执行SQL查询，返回结果集
int count = 0; // 初始化已借阅数量
while(rsSql.next()){ // 遍历结果集
count = rsSql.getInt("count"); // 获取已借阅数量
}
if(count<num){ // 如果已借阅数量小于可借阅数量
if(status==1){ // 如果图书状态为可借
String sql = "insert into borrow_books(CARD_ID,BOOK_ID,BORROW_DATE,END_DATE) values('" + user + "','" + book + "','" + date1 + "','" + end + "')"; // SQL插入语句，插入借阅记录
int i = borrow.executeUpdate(sql); // 执行SQL插入操作，返回受影响的行数
if (i == 1) { // 如果插入成功
try {
// 显示借阅成功消息并跳转页面
%>
('借阅成功！');
window.location.href = "02borrow.jsp";
<%
String sql3="update books set STATUS=0 where ID=" + book; // SQL更新语句，更新图书状态为不可借
borrow.executeUpdate(sql3); // 执行SQL更新操作
<%
} catch (Exception e) { // 如果发生异常
// 显示借阅未成功消息并跳转页面
%>
('借阅未成功！');
window.location.href = "02borrow.jsp";
<%
}
} else { // 如果插入失败
// 显示借阅未成功消息并跳转页面
%>
('借阅未成功！');
window.location.href = "02borrow.jsp";
<%
}
}else{ // 如果图书状态不可借
// 显示图书已借出消息并跳转页面
%>
('该图书已借出！');
window.location.href = "02borrow.jsp";
<%
}
}else{ // 如果已借阅数量达到或超过可借阅数量
// 显示已达到借阅数量上限消息并跳转页面
%>
('该用户已达到可借阅数量上限！若需还书，请先借阅其他书籍！');
window.location.href = "02borrow.jsp";
<%
}
}if(z==libraryArray.length-1 && !libraryArray[z].equals(lib)){ // 如果遍历完所有图书馆且图书不在可借阅范围内
// 显示图书不在可借阅图书馆内消息并跳转页面
%>
('该图书未在可借阅的图书馆内！');
window.location.href = "02borrow.jsp";
<%
}
}
}else{ // 如果查询不到图书信息
// 显示图书不存在消息并跳转页面
%>
('该图书不存在！');
window.location.href = "02borrow.jsp";
<%
}
}else{ // 如果借阅卡状态无效
// 显示借阅卡已挂失消息并跳转页面
%>
('借阅卡已挂失！');
window.location.href = "02borrow.jsp";
<%
}
} else { // 如果查询不到借阅卡信息
// 显示用户不存在消息并跳转页面
%>
('用户不存在！');
window.location.href = "02borrow.jsp";
<%
}
}else{ // 如果会话中没有管理员登录
// 显示请先登录消息并跳转页面
%>
('请先登录！');
window.parent.location.href = "../loginManager.html";
<%
}
%>
</body> </body>
</html> </html>

159
WebContent/manager/04judge.jsp
Unescape View File

@ -1,95 +1,96 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html> <html>
<head> <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title> <title>Insert title here</title>
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <link rel="stylesheet" href="../public/layui/css/layui.css" media="all">
<script src="../public/layui/layui.js"></script>
<style> <style>
.layui-form-label{ .layui-form-label{
margin-left:20%; margin-left:20%;
} }
</style> </style>
</head> </head>
<body> <body>
<div align="center" style=" margin-top: 2%;"><h1>查询图书是否逾期</h1></div> <!-- 页面主体内容开始 -->
<div align="center" <div align="center" style=" margin-top: 2%;"><h1>查询图书是否逾期</h1></div>
style="margin-left:30%; margin-top: 5%; width: 40%;"> <div align="center"
style="margin-left:30%; margin-top: 5%; width: 40%;">
<form class="layui-form layui-form-pane" action="04judgeSus.jsp"> <!-- 表单开始，action属性指定提交的URL -->
<form class="layui-form layui-form-pane" action="04judgeSus.jsp">
<div class="layui-form-item">
<label class="layui-form-label">图书编号</label>
<div class="layui-input-inline">
<input type="text" name="bookid" lay-verify="required"
placeholder="请输入图书编号" autocomplete="off" class="layui-input"><br>
</div>
</div>
<!-- 图书编号输入框 -->
<div class="layui-form-item" align="center"> <div class="layui-form-item">
<button class="layui-btn layui-btn-warm" lay-submit="" lay-filter="demo2">查询</button> <label class="layui-form-label">图书编号</label>
<div class="layui-input-inline">
<input type="text" name="bookid" lay-verify="required"
placeholder="请输入图书编号" autocomplete="off" class="layui-input"><br>
</div> </div>
</form> </div>
<!-- 提交按钮 -->
<div class="layui-form-item" align="center">
<button class="layui-btn layui-btn-warm" lay-submit="" lay-filter="demo2">查询</button>
</div>
</form>
<script> <!-- LayUI模块加载和初始化 -->
layui layui
.use( .use(
[ 'form', 'layedit', 'laydate' ], [ 'form', 'layedit', 'laydate' ],
function() { function() {
var form = layui.form, layer = layui.layer, layedit = layui.layedit, laydate = layui.laydate; var form = layui.form, layer = layui.layer, layedit = layui.layedit, laydate = layui.laydate;
//日期 //日期选择器初始化
laydate.render({ laydate.render({
elem : '#date1', elem : '#date1',
type : 'datetime', type : 'datetime',
format : 'yyyy-M-d H:m:s', format : 'yyyy-M-d H:m:s',
min:0, min:0,
max:0, max:0,
value: new Date() value: new Date()
}); });
//创建一个编辑器
var editIndex = layedit
.build('LAY_demo_editor');
//创建一个编辑器实例
//监听提交 var editIndex = layedit
form.on('submit(demo1)', function(data) { .build('LAY_demo_editor');
layer.alert(JSON.stringify(data.field), {
title : '最终的提交信息'
})
return false;
});
//表单赋值 //监听表单提交事件
layui.$('#LAY-component-form-setval').on( form.on('submit(demo1)', function(data) {
'click', function() { layer.alert(JSON.stringify(data.field), {
form.val('example', { title : '最终的提交信息'
"username" : "贤心" // "name": "value" });
, return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
"password" : "123456", });
"interest" : 1,
"like[write]" : true //复选框选中状态
,
"close" : true //开关状态
,
"sex" : "女",
"desc" : "我爱 layui"
});
});
//表单取值 //表单赋值示例
layui.$('#LAY-component-form-getval').on( layui.$('#LAY-component-form-setval').on(
'click', function() { 'click', function() {
var data = form.val('example'); form.val('example', {
alert(JSON.stringify(data)); "username" : "贤心" // "name": "value"
}); ,
"password" : "123456",
"interest" : 1,
"like[write]" : true //复选框选中状态
,
"close" : true //开关状态
,
"sex" : "女",
"desc" : "我爱 layui"
});
});
}); //表单取值示例
</script> layui.$('#LAY-component-form-getval').on(
</div> 'click', function() {
var data = form.val('example');
(JSON.stringify(data));
});
});
});
</script>
</div>
</body> </body>
</html> </html>

133
WebContent/manager/04judgeSus.jsp
Unescape View File

@ -1,80 +1,79 @@
<%@ page import="javabean.DateTime" %> <%@ page import="javabean.DateTime" %> // 导入自定义的DateTime类，用于获取当前日期时间
<%@ page import="javabean.CompareDate" %> <%@ page import="javabean.CompareDate" %> // 导入自定义的CompareDate类，用于比较日期
<%@ page import="java.sql.*" %> <%@ page import="java.sql.*" %> // 导入Java SQL包，用于数据库操作
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%> // 设置页面语言为Java，内容类型和字符编码为UTF-8
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html> <html>
<head> <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title> <title>Insert title here</title>
</head> </head>
<body> <body>
<jsp:useBean id="judge" scope="session" class="javabean.JDBCBean"></jsp:useBean> <jsp:useBean id="judge" scope="session" class="javabean.JDBCBean"></jsp:useBean> // 使用JSP标签声明一个名为judge的会话范围的JavaBean对象，类为javabean.JDBCBean
<% <%
String book = request.getParameter("bookid"); String book = request.getParameter("bookid"); // 从请求中获取参数bookid的值
session.setAttribute("book", book); session.setAttribute("book", book); // 将bookid的值存储到会话属性中
if(session.getAttribute("manager")!=null){ if(session.getAttribute("manager")!=null){ // 检查会话中是否存在manager属性，判断用户是否已登录
DateTime date = new DateTime(); DateTime date = new DateTime(); // 创建DateTime对象实例
String now = date.show(); String now = date.show(); // 调用DateTime对象的show方法获取当前日期时间字符串
String bookid = request.getParameter("bookid"); String bookid = request.getParameter("bookid"); // 再次从请求中获取参数bookid的值
String sql="select*from borrow_books where book_id = "+bookid; String sql="select*from borrow_books where book_id = "+bookid; // 构建SQL查询语句，查询借书记录表
ResultSet rs = judge.executeQuery(sql); ResultSet rs = judge.executeQuery(sql); // 执行SQL查询，返回结果集
String end = ""; String end = ""; // 初始化变量end，用于存储借书记录中的归还日期
String ret = ""; String ret = ""; // 初始化变量ret，用于存储借书记录中的归还日期
String card = ""; String card = ""; // 初始化变量card，用于存储借书记录中的借书卡ID
while (rs.next()) { while (rs.next()) { // 遍历结果集
end = rs.getString("end_date"); end = rs.getString("end_date"); // 获取归还日期
ret = rs.getString("return_date"); ret = rs.getString("return_date"); // 获取实际归还日期
card = rs.getString("card_id"); card = rs.getString("card_id"); // 获取借书卡ID
}
if(ret==null){
//CompareDate cd = new CompareDate();
long n = CompareDate.show(now,end);
//out.println(sql);
//out.println(n);
//out.println(end);
//out.println(now);
session.setAttribute("days", n);
String sql1="select*from borrow_card where id = "+card;
ResultSet rs1 = judge.executeQuery(sql1);
String rule = "";
while (rs1.next()) {
rule = rs1.getString("rule_id");
}
String sql2="select*from rules where id = "+rule;
ResultSet rs2 = judge.executeQuery(sql2);
String fee = "";
while (rs2.next()) {
fee = rs2.getString("overtime_fee");
}
session.setAttribute("fee", fee);
%>
<script>
window.location.href = "04return.jsp";
</script>
<%
}else{
%>
<script>
alert("该书未借出或不存在！");
window.location.href = "04judge.jsp";
</script>
<%
} }
}else{ if(ret==null){ // 如果实际归还日期为空，表示书未归还
%> //CompareDate cd = new CompareDate();
<script> long n = CompareDate.show(now,end); // 计算当前日期与归还日期之间的天数差
alert('请先登录！'); //out.println(sql);
window.parent.location.href = "../loginManager.html"; //out.println(n);
</script> //out.println(end);
<% //out.println(now);
session.setAttribute("days", n); // 将天数差存储到会话属性中
String sql1="select*from borrow_card where id = "+card; // 构建SQL查询语句，查询借书卡信息
ResultSet rs1 = judge.executeQuery(sql1); // 执行SQL查询，返回结果集
String rule = ""; // 初始化变量rule，用于存储规则ID
while (rs1.next()) { // 遍历结果集
rule = rs1.getString("rule_id"); // 获取规则ID
}
String sql2="select*from rules where id = "+rule; // 构建SQL查询语句，查询规则信息
ResultSet rs2 = judge.executeQuery(sql2); // 执行SQL查询，返回结果集
String fee = ""; // 初始化变量fee，用于存储超时费用
while (rs2.next()) { // 遍历结果集
fee = rs2.getString("overtime_fee"); // 获取超时费用
}
session.setAttribute("fee", fee); // 将超时费用存储到会话属性中
%>
window.location.href = "04return.jsp"; // 跳转到04return.jsp页面
<%
}else{ // 如果实际归还日期不为空，表示书已归还或不存在
%>
("该书未借出或不存在！");
window.location.href = "04judge.jsp"; // 跳转到04judge.jsp页面
<%
} }
}else{ // 如果会话中不存在manager属性，表示用户未登录
%>
('请先登录！');
window.parent.location.href = "../loginManager.html"; // 跳转到登录页面
<%
}
%> %>
</body> </body>
</html> </html>

269
WebContent/manager/04return.jsp
Unescape View File

@ -1,168 +1,149 @@
<%@ page import="java.sql.*" %> <%@ page import="java.sql.*" %> // 导入Java SQL包，用于数据库操作
<%@ page language="java" contentType="text/html; charset=UTF-8" <jsp:useBean id="judge" scope="session" class="javabean.JDBCBean"></jsp:useBean> // 使用JSP的useBean标签来创建一个名为judge的JavaBean对象，该对象在会话范围内有效
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html> <html>
<head> <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title> <title>Insert title here</title>
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <link rel="stylesheet" href="../public/layui/css/layui.css" media="all">
<script src="../public/layui/layui.js"></script> <style>
<style> .layui-form-label{
.layui-form-label{ margin-left:20%;
margin-left:20%; }
} </style>
</style>
</head> </head>
<body> <body>
<jsp:useBean id="judge" scope="session" class="javabean.JDBCBean"></jsp:useBean> <div align="center" style=" margin-top: 2%; margin-left: 30%; width: 40%;">
<div align="center" style=" margin-top: 2%;"><h1>归还图书</h1></div> <h1>归还图书</h1>
<div align="center" <form class="layui-form layui-form-pane" action="05returnSus.jsp">
style="margin-left:30%; margin-top: 5%; width: 40%;">
<% <%
Object days = session.getAttribute("days"); Object days = session.getAttribute("days"); // 从会话中获取“days”属性
Object fee = session.getAttribute("fee"); Object fee = session.getAttribute("fee"); // 从会话中获取“fee”属性
int d = Integer.parseInt(days.toString()); int d = Integer.parseInt(days.toString()); // 将“days”属性转换为整数
float f = Float.parseFloat(fee.toString()); float f = Float.parseFloat(fee.toString()); // 将“fee”属性转换为浮点数
String book = session.getAttribute("book").toString(); String book = session.getAttribute("book").toString(); // 从会话中获取“book”属性并转换为字符串
String mes = ""; String mes = ""; // 初始化消息变量
String mes2 = ""; String mes2 = ""; // 初始化消息变量
float sum = 0; float sum = 0; // 初始化罚款总金额
if(d<0){ if(d<0){ // 如果天数小于0，表示逾期
mes = "已逾期"+(-d)+"天"; mes = "已逾期"+(-d)+"天"; // 设置逾期消息
sum = d*f*(-1); mes2 = "罚款"+sum+"元"; // 设置罚款消息
mes2 = "罚款"+sum; }else{ // 如果天数不小于0，表示未逾期
} mes = "还剩"+d+"天"; // 设置剩余天数消息
else{ //mes2 = "无需罚款"; // 注释掉的代码，表示不需要罚款
mes = "还剩"+d+"天"; }
//mes2 = "无需罚款"; session.setAttribute("mes", mes); // 将消息存储到会话中
} session.setAttribute("mes2", mes2); // 将消息存储到会话中
session.setAttribute("mes",mes); %>
session.setAttribute("mes2",mes2); <div><blockquote class="layui-elem-quote layui-quote-nm">
%> <%=session.getAttribute("mes") %><br> // 显示会话中的逾期或剩余天数消息
<%=session.getAttribute("mes2") %> // 显示会话中的罚款消息
<form class="layui-form layui-form-pane" action="05returnSus.jsp"> </blockquote></div>
<div><blockquote class="layui-elem-quote layui-quote-nm"> <div class="layui-form-item">
<label class="layui-form-label">图书编号</label>
<%=session.getAttribute("mes") %><br> <div class="layui-input-inline">
<%=session.getAttribute("mes2") %> <input type="text" name="bookid" lay-verify="required" value=<%=session.getAttribute("book") %> autocomplete="off" class="layui-input"><br> // 显示图书编号输入框
</blockquote>
</div>
<div class="layui-form-item">
<label class="layui-form-label">图书编号</label>
<div class="layui-input-inline">
<input type="text" name="bookid" lay-verify="required"
value=<%=session.getAttribute("book") %> autocomplete="off" class="layui-input"><br>
</div>
</div> </div>
</div>
<% <%
String sql2="select*from borrow_books where return_date is null and book_id = "+book; // 查询未归还且图书ID匹配的借书记录
String sql2="select*from borrow_books where return_date is null and book_id = "+book; ResultSet rs2 = judge.executeQuery(sql2); // 执行查询并获取结果集
ResultSet rs2 = judge.executeQuery(sql2); String end = ""; // 初始化截止日期变量
String end = ""; while(rs2.next()){ // 遍历结果集
while (rs2.next()) { %>
<div class="layui-form-item">
<label class="layui-form-label">截止日期</label>
%> <div class="layui-input-inline">
<input type="text" name="end" autocomplete="off" class="layui-input" value=<%=rs2.getString("end_date") %>><br> // 显示截止日期输入框
</div>
</div>
<div class="layui-form-item"> <% } %>
<label class="layui-form-label">截止日期</label>
<div class="layui-input-inline">
<input type="text" name="end" autocomplete="off"
class="layui-input" value=<%=rs2.getString("end_date") %>><br>
</div>
<div class="layui-form-item">
<label class="layui-form-label">归还日期</label>
<div class="layui-input-inline">
<input type="text" name="date1" id="date1" autocomplete="off" class="layui-input"><br> // 显示归还日期输入框
</div> </div>
</div>
<%} %>
<div class="layui-form-item">
<label class="layui-form-label">归还日期</label>
<div class="layui-input-inline">
<input type="text" name="date1" id="date1" autocomplete="off"
class="layui-input"><br>
</div>
<div class="layui-form-item">
<label class="layui-form-label">违规信息</label>
<div class="layui-input-inline">
<input type="text" name="ill" placeholder="若无违规信息，则不填" autocomplete="off" class="layui-input"><br> // 显示违规信息输入框
</div> </div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">违规信息</label> <div class="layui-form-item">
<div class="layui-input-inline"> <label class="layui-form-label">管理员编号</label>
<input type="text" name="ill" <div class="layui-input-inline">
placeholder="若无违规信息，则不填" autocomplete="off" class="layui-input"><br> <input type="text" name="manager" readonly="readonly" class="layui-input" value= <%=session.getAttribute("manager") %>> // 显示管理员编号输入框，只读
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">管理员编号</label>
<div class="layui-input-inline">
<input type="text" name="managerid" readonly="readonly"
class="layui-input" value="<%=session.getAttribute("manager")%>"><br>
</div>
</div>
<div class="layui-form-item" align="center">
<button class="layui-btn layui-btn-warm" lay-submit="" lay-filter="demo2">归还</button>
</div> </div>
</form> </div>
<div class="layui-form-item" align="center">
<button class="layui-btn layui-btn-warm" lay-submit="" lay-filter="demo1">归还</button> // 显示归还按钮
</div>
</form>
<script> </div>
layui
.use(
[ 'form', 'layedit', 'laydate' ],
function() {
var form = layui.form, layer = layui.layer, layedit = layui.layedit, laydate = layui.laydate;
//日期
laydate.render({
elem : '#date1',
type : 'datetime',
format : 'yyyy-MM-dd H:m:s',
min:0,
max:0,
value: new Date()
});
//创建一个编辑器
var editIndex = layedit
.build('LAY_demo_editor');
<script>
//监听提交 layui.use(
form.on('submit(demo1)', function(data) { [ 'form', 'layedit', 'laydate' ],
layer.alert(JSON.stringify(data.field), { function() {
title : '最终的提交信息' var form = layui.form, layer = layui.layer, layedit = layui.layedit, laydate = layui.laydate;
}) //日期
return false; laydate.render({
}); elem : '#date1', // 绑定元素
type : 'datetime', // 类型：日期时间
format : 'yyyy-MM-dd H:m:s', // 格式
min:0, // 最小值
max:0, // 最大值
value: new Date() // 默认值：当前时间
});
//表单赋值 //创建一个编辑器
layui.$('#LAY-component-form-setval').on( var editIndex = layedit
'click', function() { .build('LAY_demo_editor');
form.val('example', {
"username" : "贤心" // "name": "value"
,
"password" : "123456",
"interest" : 1,
"like[write]" : true //复选框选中状态
,
"close" : true //开关状态
,
"sex" : "女",
"desc" : "我爱 layui"
});
});
//表单取值 //监听提交
layui.$('#LAY-component-form-getval').on( form.on('submit(demo1)', function(data) {
'click', function() { layer.alert(JSON.stringify(data.field), {
var data = form.val('example'); title : '最终的提交信息' // 弹窗标题
alert(JSON.stringify(data)); })
}); return false; // 阻止表单跳转。如果需要表单跳转，去掉这段即可。
});
//表单赋值
layui.$('#LAY-component-form-setval').on(
'click', function() {
form.val('example', {
"username" : "贤心" // "name": "value"
,
"password" : "123456",
"interest" : 1,
"like[write]" : true //复选框选中状态
,
"close" : true //开关状态
,
"sex" : "女",
"desc" : "我爱 layui"
}); });
</script> });
//表单取值
layui.$('#LAY-component-form-getval').on(
'click', function() {
var data = form.val('example');
layer.alert(JSON.stringify(data)); // 弹出数据
});
});
</script>
</div> </div>
</body> </body>
</html> </html>

73
WebContent/manager/05returnSus.jsp
Unescape View File

@ -11,65 +11,66 @@
<jsp:useBean id="ret" scope="session" class="javabean.JDBCBean"></jsp:useBean> <jsp:useBean id="ret" scope="session" class="javabean.JDBCBean"></jsp:useBean>
<% <%
String book = request.getParameter("bookid"); String book = request.getParameter("bookid");// 获取请求参数中的图书ID
String date1 = request.getParameter("date1"); String date1 = request.getParameter("date1"); // 获取请求参数中的归还日期
String ill = request.getParameter("ill"); String ill = request.getParameter("ill"); // 获取请求参数中的是否违规信息
//out.println(ill); //out.println(ill);
String managerid = request.getParameter("managerid"); String managerid = request.getParameter("managerid"); // 获取请求参数中的管理员ID
if(session.getAttribute("manager")!=null){ if(session.getAttribute("manager")!=null){ // 检查用户是否已登录
String sql2 = "select * from books where ID =" + book; String sql2 = "select * from books where ID =" + book; // 查询图书信息的SQL语句
ResultSet rs2 = ret.executeQuery(sql2); ResultSet rs2 = ret.executeQuery(sql2); // 执行查询并返回结果集
if(rs2.next()){ if(rs2.next()){ // 如果查询到图书信息
//out.println(psw1 + " " + psw2); //out.println(psw1 + " " + psw2);
//String id = session.getAttribute("manager").toString(); //String id = session.getAttribute("manager").toString();
int status=Integer.parseInt(rs2.getString("STATUS")); int status=Integer.parseInt(rs2.getString("STATUS")); // 获取图书状态
if(status==0){ if(status==0){ // 如果图书状态为未借出（0）
String sql = "update borrow_books set RETURN_DATE='" + date1 + "',ILLEGAL='" + ill + "',MANAGER_ID='" + managerid + "' where manager_id is null and BOOK_ID="+ book; String sql = "update borrow_books set RETURN_DATE='" + date1 + "',ILLEGAL='" + ill + "',MANAGER_ID='" + managerid + "' where manager_id is null and BOOK_ID="+ book; // 更新借书记录的SQL语句
//out.println(sql); //out.println(sql);
try { try {
int i = ret.executeUpdate(sql); int i = ret.executeUpdate(sql); // 执行更新操作，返回受影响的行数
//String sql1 = "update borrow_books set RETURN_DATE='" + date1 + "',ILLEGAL='" + ill + "',MANAGER_ID='" + managerid + "' order by BORROW_DATE desc limit 1 "; //String sql1 = "update borrow_books set RETURN_DATE='" + date1 + "',ILLEGAL='" + ill + "',MANAGER_ID='" + managerid + "' order by BORROW_DATE desc limit 1 ";
//int k = ret.executeUpdate(sql1); //int k = ret.executeUpdate(sql1);
String sql3="update books set STATUS=1 where ID="+book; String sql3="update books set STATUS=1 where ID="+book;// SQL更新语句，更新图书状态为已借出（1）
ret.executeUpdate(sql3); ret.executeUpdate(sql3);// 执行更新操作，返回受影响的行数
%> %>
<script> <script>
alert('归还成功！'); alert('归还成功！');// 显示归还成功消息
window.location.href = "04judge.jsp"; window.location.href = "04judge.jsp";// 跳转到04judge.jsp页面
</script> </script>
<% <%
} catch (Exception e) { } catch (Exception e) { // 捕获异常
%> %>
<script> <script>
alert('归还未成功！'); alert('归还未成功！');// 显示归还失败消息
window.location.href = "04judge.jsp"; window.location.href = "04judge.jsp";//跳转到04judge.jsp页面
</script> </script>
<% <%
} }
}else{ }else{ // 如果图书状态不为未借出（0）
%> %>
<script> <script>
alert('该图书未借出！'); alert('该图书未借出！');// 显示图书未借出消息
window.location.href = "04judge.jsp"; window.location.href = "04judge.jsp";// 跳转到04judge.jsp页面
</script> </script>
<% <%
} }
} }
}else{ }else{// 如果用户未登录
%> %>
<script> <script>
alert('请先登录！'); alert('请先登录！');// 显示请先登录消息
window.parent.location.href = "../loginManager.html"; window.parent.location.href = "../loginManager.html";// 跳转到登录页面
</script> </script>
<% <%
} }

202
WebContent/manager/06borrowTable.jsp
Unescape View File

@ -1,5 +1,5 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%>
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
@ -11,110 +11,114 @@
margin: 0 0px; margin: 0 0px;
} }
</style> </style>
</head> </head>
<body> <body>
<script src="../public/layui/layui.js" charset="utf-8"></script>
<!-- 表单 --> <!-- 表单 -->
<table class="layui-hide" id="cardTable" lay-filter="formFilter"></table> <table class="layui-hide" id="cardTable" lay-filter="formFilter"></table>
<!-- 头部工具栏 --> <!-- 头部工具栏 -->
<script type="text/html" id="headBar">
条件搜索： 条件搜索：
<div class="layui-inline"> <div class="layui-inline">
<select id="condition" name="condition" lay-verify="required"> <select id="condition" name="condition" lay-verify="required">
<option value=""></option> <option value=""></option>
<option value="card_id">借阅证号</option> <option value="card_id">借阅证号</option>
<option value="book_id">图书编号</option> <option value="book_id">图书编号</option>
<option value="borrow_date">借阅日期</option> <option value="borrow_date">借阅日期</option>
<option value="end_date">截止日期</option> <option value="end_date">截止日期</option>
<option value="return_date">归还日期</option> <option value="return_date">归还日期</option>
<option value="illegal">违章信息</option> <option value="illegal">违章信息</option>
<option value="manager_id">处理人</option> <option value="manager_id">处理人</option>
</select> </select>
</div> </div>
<div class="layui-inline"> <div class="layui-inline">
<input class="layui-input" id="conditionValue" name="conditionValue" id="demoReload" autocomplete="off"> <input class="layui-input" id="conditionValue" name="conditionValue" id="demoReload" autocomplete="off">
</div> </div>
<button class="layui-btn" name="condition" data-type="reload" lay-event="search">搜索</button> <button class="layui-btn" name="condition" data-type="reload" lay-event="search">搜索</button>
</script>
</script>
<script>
<script>
layui.use(['table','jquery'], function(){ layui.use(['table','jquery'], function(){
$ = layui.jquery; $ = layui.jquery;
var table = layui.table; var table = layui.table;
// 进行渲染 // 进行渲染
var tableIns = table.render({ var tableIns = table.render({
elem: '#cardTable' elem: '#cardTable'
,url:'./borrowTable' ,url:'./borrowTable'
,toolbar: '#headBar' ,toolbar: '#headBar'
,cols: [[ ,cols: [[
{field:'card_id', width:180, title: '借阅证号', sort: true} {field:'card_id', width:180, title: '借阅证号', sort: true}
,{field:'book_id', width:130, title: '图书编号', sort: true} ,{field:'book_id', width:130, title: '图书编号', sort: true}
,{field:'borrow_date', width:250, title: '借阅日期', sort: true} ,{field:'borrow_date', width:250, title: '借阅日期', sort: true}
,{field:'end_date', title: '截止日期', width: 250, sort: true} ,{field:'end_date', title: '截止日期', width: 250, sort: true}
,{field:'return_date', width:250, title: '归还时间', sort: true} ,{field:'return_date', width:250, title: '归还时间', sort: true}
,{field:'illegal', width:180, title: '违章信息', sort: true,style:'color: red;'} ,{field:'illegal', width:180, title: '违章信息', sort: true,style:'color: red;'}
,{field:'manager_id', minWidth:80, title: '处理人'} ,{field:'manager_id', minWidth:80, title: '处理人'}
]]
,page: true
});
// 头部工具栏事件
table.on('toolbar(formFilter)', function(obj){
var checkStatus = table.checkStatus(obj.config.id);
switch(obj.event){
// 条件查找图书证
case 'search':
var conditionValue = $('#conditionValue');
var condition = $('#condition');
// 进行搜索，重新渲染
tableIns.reload({
where: { //设定异步数据接口的额外参数，任意设
"condition": condition.val(),
"conditionValue": conditionValue.val()
}
,page: {
curr: 1 //重新从第 1 页开始
}
});
break;
]] case 'add':
,page: true var addCardLayer = layer.open({
}); type: 2,
title: '添加借书证',
// 头部工具栏事件 area: ['800px', '500px'],
table.on('toolbar(formFilter)', function(obj){ maxmin: true,
var checkStatus = table.checkStatus(obj.config.id); shadeClose: true,
switch(obj.event){ content: 'cardadd.jsp',
// 条件查找图书证 });
case 'search': //layer.full(addCardLayer);
var conditionValue = $('#conditionValue'); };
var condition = $('#condition');
// 进行搜索，重新渲染
tableIns.reload({
where: { //设定异步数据接口的额外参数，任意设
"condition": condition.val(),
"conditionValue": conditionValue.val()
}
,page: {
curr: 1 //重新从第 1 页开始
}
});
break;
case 'add':
var addCardLayer = layer.open({
type: 2,
title: '添加借书证',
area: ['800px', '500px'],
maxmin: true,
shadeClose: true,
content: 'cardadd.jsp',
});
//layer.full(addCardLayer);
};
}); });
// 侧边工具栏事件 // 侧边工具栏事件
table.on(('tool(formFilter)'), function(obj){ table.on(('tool(formFilter)'), function(obj){
var data = obj.data; var data = obj.data;
var layEvent = obj.event; var layEvent = obj.event;
var tr = obj.tr; var tr = obj.tr;
switch(obj.event){ switch(obj.event){
case 'edit': case 'edit':
layer.open({ layer.open({
type: 2, type: 2,
title: '更改信息', title: '更改信息',
area: ['800px', '600px'], area: ['800px', '600px'],
maxmin: true, maxmin: true,
shadeClose: true, shadeClose: true,
content: '', content: '',
}) })
break; break;
} }
}) })
}); });
</script> </script>
</body> </body>
</html> </html>

192
WebContent/manager/07returnTable.jsp
Unescape View File

@ -1,114 +1,114 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%> <!-- 设置页面语言为Java，内容类型为HTML，字符编码为UTF-8 -->
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!-- 定义文档类型为HTML 4.01 Transitional -->
<html> <html>
<head> <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <!-- 设置页面的字符编码为UTF-8 -->
<title>Insert title here</title> <title>Insert title here</title> <!-- 页面标题 -->
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <!-- 引入Layui的CSS文件 -->
<script src="../public/layui/layui.js" charset="utf-8"></script>
<style> <style>
.layui-table,.layui-table-view{ .layui-table,.layui-table-view{
margin: 0 0px; margin: 0 0px; /* 设置表格和表格视图的外边距为0 */
} }
</style> </style>
</head> </head>
<body> <body>
<!-- 表单 --> <!-- 表单 -->
<table class="layui-hide" id="cardTable" lay-filter="formFilter"></table> <table class="layui-hide" id="cardTable" lay-filter="formFilter"></table> <!-- 创建一个隐藏的表格，用于展示数据 -->
<!-- 头部工具栏 --> <!-- 头部工具栏 -->
<script type="text/html" id="headBar">
条件搜索：
<div class="layui-inline">
<select id="condition" name="condition" lay-verify="required">
<option value=""></option>
<option value="card_id">借阅证号</option>
<option value="book_id">图书编号</option>
<option value="borrow_date">借阅日期</option>
<option value="end_date">截止日期</option>
</select>
</div>
<div class="layui-inline">
<input class="layui-input" id="conditionValue" name="conditionValue" id="demoReload" autocomplete="off">
</div>
<button class="layui-btn" name="condition" data-type="reload" lay-event="search">搜索</button>
</script>
条件搜索： <!-- 条件搜索标签 -->
<div class="layui-inline">
<select id="condition" name="condition" lay-verify="required"> <!-- 下拉选择框，用于选择查询条件 -->
<option value=""></option> <!-- 空选项 -->
<option value="card_id">借阅证号</option> <!-- 借阅证号选项 -->
<option value="book_id">图书编号</option> <!-- 图书编号选项 -->
<option value="borrow_date">借阅日期</option> <!-- 借阅日期选项 -->
<option value="end_date">截止日期</option> <!-- 截止日期选项 -->
</select>
</div>
<div class="layui-inline">
<input class="layui-input" id="conditionValue" name="conditionValue" id="demoReload" autocomplete="off"> <!-- 输入框，用于输入查询条件的值 -->
</div>
<button class="layui-btn" name="condition" data-type="reload" lay-event="search">搜索</button> <!-- 搜索按钮 -->
</script>
<script>
layui.use(['table','jquery'], function(){
$ = layui.jquery;
var table = layui.table;
// 进行渲染
var tableIns = table.render({
elem: '#cardTable'
,url:'./returnTable'
,toolbar: '#headBar'
,cols: [[
{field:'card_id', width:180, title: '借阅证号', sort: true}
,{field:'book_id', width:130, title: '图书编号', sort: true}
,{field:'borrow_date', width:250, title: '借阅日期', sort: true}
,{field:'end_date', title: '截止日期',width: 250, sort: true}
]]
,page: true
});
// 头部工具栏事件
table.on('toolbar(formFilter)', function(obj){
var checkStatus = table.checkStatus(obj.config.id);
switch(obj.event){
// 条件查找图书证
case 'search':
var conditionValue = $('#conditionValue');
var condition = $('#condition');
// 进行搜索，重新渲染
tableIns.reload({
where: { //设定异步数据接口的额外参数，任意设
"condition": condition.val(),
"conditionValue": conditionValue.val()
}
,page: {
curr: 1 //重新从第 1 页开始
}
});
break;
case 'add': <script>
var addCardLayer = layer.open({ layui.use(['table','jquery'], function(){ <!-- 使用Layui的table和jQuery模块 -->
type: 2, $ = layui.jquery; <!-- 获取jQuery对象 -->
title: '添加借书证', var table = layui.table; <!-- 获取table对象 -->
area: ['800px', '500px'], // 进行渲染
maxmin: true, var tableIns = table.render({
shadeClose: true, elem: '#cardTable' <!-- 指定表格容器的ID -->
content: 'cardadd.jsp', ,url:'./returnTable' <!-- 数据接口地址 -->
}); ,toolbar: '#headBar' <!-- 指定工具栏的ID -->
//layer.full(addCardLayer); ,cols: [[
}; {field:'card_id', width:180, title: '借阅证号', sort: true} <!-- 借阅证号列 -->
,{field:'book_id', width:130, title: '图书编号', sort: true} <!-- 图书编号列 -->
,{field:'borrow_date', width:250, title: '借阅日期', sort: true} <!-- 借阅日期列 -->
,{field:'end_date', title: '截止日期',width: 250, sort: true} <!-- 截止日期列 -->
]]
,page: true <!-- 启用分页 -->
}); });
// 侧边工具栏事件 // 头部工具栏事件
table.on(('tool(formFilter)'), function(obj){ table.on('toolbar(formFilter)', function(obj){ <!-- 监听头部工具栏事件 -->
var data = obj.data; var checkStatus = table.checkStatus(obj.config.id); <!-- 获取选中状态 -->
var layEvent = obj.event; switch(obj.event){
var tr = obj.tr; // 条件查找图书证
switch(obj.event){ case 'search':
case 'edit': var conditionValue = $('#conditionValue'); <!-- 获取条件值输入框的值 -->
layer.open({ var condition = $('#condition'); <!-- 获取条件选择框的值 -->
type: 2, // 进行搜索，重新渲染
title: '更改信息', tableIns.reload({
area: ['800px', '600px'], where: { //设定异步数据接口的额外参数，任意设
maxmin: true, "condition": condition.val(), <!-- 设置查询条件 -->
shadeClose: true, "conditionValue": conditionValue.val() <!-- 设置查询条件的值 -->
content: '', }
}) ,page: {
break; curr: 1 //重新从第 1 页开始
} }
}) });
break;
case 'add':
var addCardLayer = layer.open({
type: 2,
title: '添加借书证',
area: ['800px', '500px'],
maxmin: true,
shadeClose: true,
content: 'cardadd.jsp',
});
//layer.full(addCardLayer);
};
});
// 侧边工具栏事件
table.on(('tool(formFilter)'), function(obj){ <!-- 监听侧边工具栏事件 -->
var data = obj.data; <!-- 获取当前行的数据 -->
var layEvent = obj.event; <!-- 获取触发的事件类型 -->
var tr = obj.tr; <!-- 获取当前行的DOM对象 -->
switch(obj.event){
case 'edit':
layer.open({
type: 2,
title: '更改信息',
area: ['800px', '600px'],
maxmin: true,
shadeClose: true,
content: '',
})
break;
}
})
}); });
</script> </script>
</body> </body>
</html> </html>

99
WebContent/manager/08add.jsp
Unescape View File

@ -1,69 +1,64 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%> <!-- 设置页面语言为Java，内容类型为HTML，字符编码为UTF-8 -->
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!-- 定义文档类型为HTML 4.01 Transitional -->
<html> <html>
<head> <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <!-- 设置页面内容类型和字符编码 -->
<title>Insert title here</title> <title>Insert title here</title> <!-- 页面标题 -->
<link rel="stylesheet" href="../public/layui/css/layui.css"> <link rel="stylesheet" href="../public/layui/css/layui.css"> <!-- 引入Layui的CSS样式文件 -->
<script src="../public/layui/layui.js"></script>
</head> </head>
<body> <body>
<form class="layui-form layui-form-pane" action="" lay-filter="formFilter"> <form class="layui-form layui-form-pane" action="" lay-filter="formFilter"> <!-- 创建一个表单，使用Layui的表单类和过滤器 -->
<div class="layui-form-item"> <div class="layui-form-item"> <!-- 表单项开始 -->
<label class="layui-form-label">标题</label> <label class="layui-form-label">标题</label> <!-- 标签显示“标题” -->
<div class="layui-input-block"> <div class="layui-input-block"> <!-- 输入块开始 -->
<input type="text" name="title" lay-verify="required" required autocomplete="off" placeholder="请输入标题" class="layui-input"> <input type="text" name="title" lay-verify="required" required autocomplete="off" placeholder="请输入标题" class="layui-input"> <!-- 文本输入框，必填，自动完成关闭，占位符为“请输入标题” -->
</div> </div>
</div> </div>
<div class="layui-form-item" style="height:50%;"> <div class="layui-form-item" style="height:50%;"> <!-- 表单项开始，高度为50% -->
<label class="layui-form-label">公告</label> <label class="layui-form-label">公告</label> <!-- 标签显示“公告” -->
<div class="layui-input-block"> <div class="layui-input-block"> <!-- 输入块开始 -->
<textarea name="detail" lay-verify="required" placeholder="请输入公告" autocomplete="off" class="layui-input" style="height:300px;"></textarea> <textarea name="detail" lay-verify="required" placeholder="请输入公告" autocomplete="off" class="layui-input" style="height:300px;"></textarea> <!-- 多行文本输入框，必填，自动完成关闭，占位符为“请输入公告”，高度为300px -->
</div> </div>
</div> </div>
<div class="layui-form-item"> <div class="layui-form-item"> <!-- 表单项开始 -->
<div class="layui-input-block"> <div class="layui-input-block"> <!-- 输入块开始 -->
<button type="submit" class="layui-btn" lay-submit="" lay-filter="submitButton"><i class="layui-icon layui-icon-release" style="font-size: 20px; color: yellow;"></i>&nbsp;发布</button> <button type="submit" class="layui-btn" lay-submit="" lay-filter="submitButton"><i class="layui-icon layui-icon-release" style="font-size: 20px; color: yellow;"></i>&nbsp;发布</button> <!-- 提交按钮，使用Layui的按钮类和图标类，点击后触发提交事件 -->
</div> </div>
</div> </div>
</form> </form>
<script> <script>
layui.use(['form', 'jquery'], function(){ // 使用Layui的form和jQuery模块
$ = layui.jquery; // 获取jQuery对象
var form = layui.form // 获取form对象
,layer = layui.layer // 获取layer对象
//监听提交
form.on('submit(submitButton)', function(data){ // 监听表单提交事件
$.ajax({ // 发起Ajax请求
url: './announcementAdd', // 请求URL
method: 'post', // 请求方法为POST
data: data.field, // 请求数据为表单数据
dataType: 'json', // 期望服务器返回的数据类型为JSON
success: function(data){ // 请求成功时的回调函数
if(data.code == "0"){ // 如果返回码为0，表示成功
parent.layer.msg("添加成功",{ // 弹出提示信息“添加成功”
icon: 6, // 图标类型为笑脸
time: 500 // 显示时间为500毫秒
});
setTimeout(function(){ // 设置延时操作
parent.location.reload(); // 刷新父页面
}, 500); // 延时500毫秒后执行
}else{ // 如果返回码不为0，表示失败
layer.msg(data.msg); // 弹出错误信息
}
}
})
layui.use(['form', 'jquery'], function(){ return false; // 阻止表单默认提交行为
$ = layui.jquery; });
var form = layui.form });
,layer = layui.layer
//监听提交
form.on('submit(submitButton)', function(data){
$.ajax({
url: './announcementAdd',
method: 'post',
data: data.field,
dataType: 'json',
success: function(data){
if(data.code == "0"){
parent.layer.msg("添加成功",{
icon: 6,
time: 500
});
setTimeout(function(){
parent.location.reload();
}, 500);
}else{
layer.msg(data.msg);
}
}
})
return false;
});
});
</script> </script>
</body> </body>
</html> </html>

198
WebContent/manager/08announcement.jsp
Unescape View File

@ -1,109 +1,111 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html> <html>
<head> <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <!-- 引入layui的CSS文件 -->
<script src="../public/layui/layui.js"></script> <link rel="stylesheet" href="../public/layui/css/layui.css" media="all">
<title>Insert title here</title>
<title>Insert title here</title>
</head> </head>
<body> <body>
<table class="layui-hide" id="annTable" lay-filter="formFilter"></table> <!-- 定义一个隐藏的表格，用于展示公告信息 -->
<table class="layui-hide" id="annTable" lay-filter="formFilter"></table>
<script type="text/html" id="headBar">
<button type="button" class="layui-btn layui-btn-sm" lay-event="add"><i class="layui-icon"><i class="layui-icon layui-icon-release" style="font-size: 20px; color: yellow;"></i>&nbsp;发布新公告</i></button> <!-- 添加公告按钮 -->
<button type="button" class="layui-btn layui-btn-sm" lay-event="add"><i class="layui-icon"><i class="layui-icon layui-icon-release" style="font-size: 20px; color: yellow;"></i>&nbsp;发布新公告</i></button>
<!-- 编辑和删除按钮 -->
<a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script> </script>
<script>
<script type="text/html" id="rightBar"> <!-- 使用layui的模块 -->
<a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a> layui.use(['table','jquery'], function(){
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a> $ = layui.jquery; // 获取jQuery对象
</script> var table = layui.table; // 获取table模块
<script> // 进行渲染
layui.use(['table','jquery'], function(){ var tableIns = table.render({
$ = layui.jquery; elem: '#annTable' // 绑定到页面中的表格元素
var table = layui.table; ,url:'./announcement' // 数据接口地址
// 进行渲染 ,toolbar: '#headBar' // 工具栏模板选择器
var tableIns = table.render({ ,height: 600 // 设置表格高度
elem: '#annTable' ,cols: [[ // 定义表格列
,url:'./announcement' {field:'id', width:80, title: 'ID', sort: true} // ID列
,toolbar: '#headBar' ,{field:'title', width:230, title: '标题'} // 标题列
,height: 600 ,{field:'detail', width:580, title: '公告'} // 公告内容列
,cols: [[ ,{field:'publish_date', title: '发布日期', minWidth: 100, sort: true} // 发布日期列
{field:'id', width:80, title: 'ID', sort: true} ,{fixed: 'right', title:'操作', toolbar: '#rightBar', align: 'center', width:150} // 操作列
,{field:'title', width:230, title: '标题'} ]]
,{field:'detail', width:580, title: '公告'} });
,{field:'publish_date', title: '发布日期', minWidth: 100, sort: true}
,{fixed: 'right', title:'操作', toolbar: '#rightBar', align: 'center', width:150} // 头部工具栏事件
]] table.on('toolbar(formFilter)', function(obj){
}); var checkStatus = table.checkStatus(obj.config.id); // 获取选中状态
switch(obj.event){
// 头部工具栏事件 // 添加公告
table.on('toolbar(formFilter)', function(obj){ case 'add':
var checkStatus = table.checkStatus(obj.config.id); var addCardLayer = layer.open({
switch(obj.event){ type: 2, // iframe层
// 添加公告 title: '发布公告', // 标题
case 'add': area: ['800px', '500px'], // 宽高
var addCardLayer = layer.open({ maxmin: true, // 允许最大化最小化
type: 2, shadeClose: true, // 点击遮罩关闭
title: '发布公告', content: '08add.jsp', // iframe的URL
area: ['800px', '500px'], });
maxmin: true, //layer.full(addCardLayer);
shadeClose: true, };
content: '08add.jsp', });
});
//layer.full(addCardLayer); // 侧边工具栏事件
}; table.on(('tool(formFilter)'), function(obj){
var data = obj.data; // 获取当前行的数据
var layEvent = obj.event; // 获取触发的事件类型
var id = data.id; // 获取当前行的ID
var tr = obj.tr; // 获取当前行的DOM对象
switch(obj.event){
case 'edit':
layer.open({
type: 2, // iframe层
title: '更改信息', // 标题
area: ['800px', '600px'], // 宽高
maxmin: true, // 允许最大化最小化
shadeClose: true, // 点击遮罩关闭
content: '08edit.jsp?id=' +id, // URL传递参数ID
})
break;
case 'del':
layer.confirm('确定要删除么？',function(){ // 确认对话框
layer.msg("ok"); // 提示消息
$.ajax({
url: './announcementDel', // URL地址
data: 'id=' +id, // 传递参数ID
type: 'get', // HTTP请求类型
dataType: 'json', // 返回数据类型
timeout: 3000, // 超时时间
success: function(data){ // 成功回调函数
if(data.code == 0){ // 如果返回码为0
layer.msg(data.msg,{ // 显示成功消息
icon: 6, // icon样式
anim: 5, // 动画效果
time: 500 // 显示时间
});
setTimeout(function(){ // 延时刷新父页面
parent.location.reload();
},500);
}else{ // 如果返回码不为0
layer.msg(data.code); // 显示错误消息
}
},
error: function(){ // 失败回调函数
layer.msg("连接超时"); // 显示超时消息
}
})
})
}
})
}); });
// 侧边工具栏事件
table.on(('tool(formFilter)'), function(obj){
var data = obj.data;
var layEvent = obj.event;
var id = data.id;
var tr = obj.tr;
switch(obj.event){
case 'edit':
layer.open({
type: 2,
title: '更改信息',
area: ['800px', '600px'],
maxmin: true,
shadeClose: true,
content: '08edit.jsp?id=' +id,
})
break;
case 'del':
layer.confirm('确定要删除么？',function(){
layer.msg("ok");
$.ajax({
url: './announcementDel',
data: 'id=' +id,
type: 'get',
dataType: 'json',
timeout: 3000,
success: function(data){
if(data.code == 0){
layer.msg(data.msg,{
icon: 6,
anim: 5,
time: 500
});
setTimeout(function(){
parent.location.reload();
},500);
}else{
layer.msg(data.code);
}
},
error: function(){
layer.msg("连接超时");
}
})
})
}
})
});
</script> </script>
</body> </body>
</html> </html>

126
WebContent/manager/08edit.jsp
Unescape View File

@ -1,82 +1,80 @@
<%@page import="java.sql.*"%> <%@page import="java.sql.*"%> <!-- 导入Java SQL包 -->
<%@page import="javabean.Base"%> <%@page import="javabean.Base"%> <!-- 导入自定义的Base类 -->
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%> <!-- 设置页面语言为Java，内容类型和字符编码为UTF-8 -->
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!-- 定义文档类型为HTML 4.01 Transitional -->
<html> <html>
<head> <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <!-- 设置内容类型和字符编码为UTF-8 -->
<link rel="stylesheet" href="../public/layui/css/layui.css"> <link rel="stylesheet" href="../public/layui/css/layui.css"> <!-- 引入Layui样式表 -->
<script src="../public/layui/layui.js"></script>
<title>Insert title here</title> <title>Insert title here</title> <!-- 页面标题 -->
</head> </head>
<body> <body>
<jsp:useBean id="check" scope="session" class="javabean.JDBCBean"></jsp:useBean> <jsp:useBean id="check" scope="session" class="javabean.JDBCBean"></jsp:useBean> <!-- 使用JSP标签声明一个名为check的JavaBean，作用域为session，类为javabean.JDBCBean -->
<% <%
String id = request.getParameter("id"); String id = request.getParameter("id");
Connection connection = (Connection)Base.getConnection(); Connection connection = (Connection)Base.getConnection();
String sql = "select * from announcement where id=?"; String sql = "select * from announcement where id=?";
PreparedStatement pstmt = connection.prepareCall(sql); PreparedStatement pstmt = connection.prepareCall(sql);
pstmt.setString(1,id); pstmt.setString(1,id);
ResultSet resultSet = pstmt.executeQuery(); ResultSet resultSet = pstmt.executeQuery();
resultSet.next(); resultSet.next();
%> %>
<form class="layui-form layui-form-pane" action="" lay-filter="formFilter"> <form class="layui-form layui-form-pane" action="" lay-filter="formFilter"> <!-- 创建一个表单，action属性为空，lay-filter属性为formFilter -->
<input type="text" name="id" value=<%=id %> lay-verify="required" required autocomplete="off" placeholder="请输入姓名" class="layui-input layui-hide"> <input type="text" name="id" value=<%=id %> lay-verify="required" required autocomplete="off" placeholder="请输入姓名" class="layui-input layui-hide"> <!-- 隐藏的输入框，用于存储公告的id -->
<div class="layui-form-item"> <div class="layui-form-item">
<label class="layui-form-label">标题</label> <label class="layui-form-label">标题</label> <!-- 标题标签 -->
<div class="layui-input-block"> <div class="layui-input-block">
<input type="text" name="title" value=<%=resultSet.getString("title") %> lay-verify="required" required autocomplete="off" placeholder="请输入标题" class="layui-input"> <input type="text" name="title" value=<%=resultSet.getString("title") %> lay-verify="required" required autocomplete="off" placeholder="请输入标题" class="layui-input"> <!-- 输入框，用于编辑公告标题 -->
</div>
</div> </div>
</div>
<div class="layui-form-item"> <div class="layui-form-item">
<label class="layui-form-label">公告</label> <label class="layui-form-label">公告</label> <!-- 公告标签 -->
<div class="layui-input-block"> <div class="layui-input-block">
<input type="text" name="detail" value=<%=resultSet.getString("detail") %> lay-verify="required" placeholder="请输入公告" autocomplete="off" class="layui-input"> <input type="text" name="detail" value=<%=resultSet.getString("detail") %> lay-verify="required" placeholder="请输入公告" autocomplete="off" class="layui-input"> <!-- 输入框，用于编辑公告内容 -->
</div>
</div> </div>
</div>
<div class="layui-form-item">
<div class="layui-form-item"> <div class="layui-input-block">
<div class="layui-input-block"> <button type="submit" class="layui-btn" lay-submit="" lay-filter="submitButton">立即提交</button> <!-- 提交按钮，触发表单提交事件 -->
<button type="submit" class="layui-btn" lay-submit="" lay-filter="submitButton">立即提交</button> </div>
</div> </div>
</div>
</form> </form>
<script> <script>
layui.use(['form', 'jquery'], function(){ layui.use(['form', 'jquery'], function(){ <!-- 使用Layui的form和jQuery模块 -->
$ = layui.jquery; $ = layui.jquery; <!-- 将jQuery赋值给$变量 -->
var form = layui.form var form = layui.form <!-- 获取form模块 -->
,layer = layui.layer ,layer = layui.layer <!-- 获取layer模块 -->
//监听提交 //监听提交
form.on('submit(submitButton)', function(data){ form.on('submit(submitButton)', function(data){ <!-- 监听表单提交事件 -->
$.ajax({ $.ajax({
url: './announcementEdit', url: './announcementEdit', <!-- AJAX请求的URL -->
method: 'post', method: 'post', <!-- HTTP请求方法为POST -->
data: data.field, data: data.field, <!-- 发送的数据为表单数据 -->
dataType: 'json', dataType: 'json', <!-- 期望服务器返回的数据类型为JSON -->
success: function(data){ success: function(data){ <!-- AJAX请求成功时的回调函数 -->
if(data.code == "0"){ if(data.code == "0"){ <!-- 如果返回的code为0，表示操作成功 -->
parent.layer.msg("添加成功",{ parent.layer.msg("添加成功",{ <!-- 显示成功消息 -->
icon: 6, icon: 6, <!-- 消息图标类型 -->
time: 500 time: 500 <!-- 消息显示时间 -->
}); });
setTimeout(function(){ setTimeout(function(){ <!-- 延迟500毫秒后刷新父页面 -->
parent.location.reload(); parent.location.reload();
}, 500); }, 500);
}else{ }else{
layer.msg(data.msg); layer.msg(data.msg); <!-- 如果操作失败，显示错误消息 -->
} }
} }
}) })
return false; <!-- 阻止表单默认提交行为 -->
return false; });
}); });
});
</script> </script>
</body> </body>

298
WebContent/manager/09managerSelf.jsp
Unescape View File

@ -1,194 +1,154 @@
<%@ page import="java.sql.*" %> <%@ page import="java.sql.*" %> <!-- 导入Java SQL包 -->
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!-- 设置页面语言和编码 -->
pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!-- 定义文档类型 -->
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html> <html>
<head> <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <!-- 设置内容类型和字符编码 -->
<title>Insert title here</title> <title>Insert title here</title> <!-- 页面标题 -->
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <!-- 引入Layui样式表 -->
<script src="../public/layui/layui.js"></script>
<!-- Bootstrap --> <!-- Bootstrap -->
<link href="../css/bootstrap.min.css" rel="stylesheet"> <link href="../css/bootstrap.min.css" rel="stylesheet"> <!-- 引入Bootstrap样式表 -->
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) --> <link rel="stylesheet" type="text/css" href="../public/css/default.css" /> <!-- 引入默认样式表 -->
<script src="../js/jquery.min.js"></script> <link rel="stylesheet" type="text/css" href="../public/css/component.css" /> <!-- 引入组件样式表 -->
<script src="../js/bootstrap.min.js"></script>
<script src="../js/jquery-3.2.1.min.js"></script> <!-- 引入jQuery库 -->
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
<link rel="stylesheet" type="text/css" href="../public/css/default.css" /> <link rel="stylesheet" href="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/css/bootstrap.min.css"> <!-- 引入Bootstrap样式表 -->
<link rel="stylesheet" type="text/css"
href="../public/css/component.css" /> <style>
<script src="../public/js/modernizr.custom.js"></script> body{background-color:white !important; color:black !important;} <!-- 设置页面背景色和文字颜色 -->
<style> .md-content { color: black; background: white; position: relative; border-radius: 3px; margin: 0 auto;} <!-- 设置模态框内容样式 -->
body{ button{background-color:#009688;} <!-- 设置按钮背景色 -->
background-color:white !important; button:hover{background-color:#5FB878;} <!-- 设置按钮悬停时的背景色 -->
color:black !important; .md-modal{ width:35%;} <!-- 设置模态框宽度 -->
} </style>
.md-content {
color: black;
background: white;
position: relative;
border-radius: 3px;
margin: 0 auto;
}
button{
background-color:#009688;
}
button:hover{
background-color:#5FB878;
}
.md-modal{
width: 35%;
}
</style>
</head> </head>
<body> <body>
<jsp:useBean id="gly" scope="session" class="javabean.JDBCBean"></jsp:useBean> <jsp:useBean id="gly" scope="session" class="javabean.JDBCBean"></jsp:useBean> <!-- 使用JavaBean -->
<fieldset class="layui-elem-field" style="width:30%;margin-left:30%;margin-top:5%;height:30%;"> <fieldset class="layui-elem-field" style="width:30%;margin-left:30%;margin-top:5%;height:20%;">
<legend>管理员基本信息</legend> <legend>管理员基本信息</legend>
<div class="layui-field-box" align="center" style="font-size:20px;font-family:YouYuan;margin-top:10%;margin-bottom:10%;"> <div class="layui-field-box" align="center" style="font-size:20px;font-family:YouYuan;">
<% <%
String manacc = session.getAttribute("manager").toString(); String manacc = session.getAttribute("manager").toString(); // 获取当前登录的管理员账号
String sql = "select*from manager where ACCOUNT = '"+ manacc +"';"; String sql = "select* from manager where ACCOUNT = '"+manacc+"'"; // 查询管理员信息的SQL语句
//out.print(sql); ResultSet rs = gly.executeQuery(sql); // 执行查询并获取结果集
ResultSet rs = gly.executeQuery(sql); while(rs.next()){ // 遍历结果集
while(rs.next()){ %>
%> <p>姓名：<%=rs.getString("name") %></p> <!-- 显示管理员姓名 -->
<p>姓名：<%=rs.getString("name") %></p><br> <p>账号：<%=rs.getString("account") %></p> <!-- 显示管理员账号 -->
<p>账号：<%=rs.getString("account") %></p><br> <p>邮箱：<%=rs.getString("email") %></p> <!-- 显示管理员邮箱 -->
<p>邮箱：<%=rs.getString("email") %></p><br>
<button class="md-trigger layui-btn layui-btn-radius" data-modal="modal-3">修改名字</button> <!-- 修改名字按钮 -->
<button class="md-trigger layui-btn layui-btn-radius" data-modal="modal-13">修改密码</button> <!-- 修改密码按钮 -->
<button class="md-trigger layui-btn layui-btn-radius" data-modal="modal-3">修改名字</button> <button class="md-trigger layui-btn layui-btn-radius" data-modal="modal-1">修改邮箱</button> <!-- 修改邮箱按钮 -->
<button class="md-trigger layui-btn layui-btn-radius" data-modal="modal-13">修改密码</button> <%
<button class="md-trigger layui-btn layui-btn-radius" data-modal="modal-1">修改邮箱</button> }
%>
<% </div>
} </fieldset> <!-- 结束fieldset标签 -->
%>
</div> <div class="md-modal md-effect-13" id="modal-13"> <!-- 修改密码模态框 -->
</fieldset> <div class="md-content">
<h3>修改密码</h3>
<div class="md-modal md-effect-13" id="modal-13"> <form action="10updateManager.jsp" method="post" class="form-horizontal">
<div class="md-content"> <div class="form-group" align="center" style="margin-left:3%;">
<h3>修改密码</h3>
<form action="10updateManager.jsp" method="post"
class="form-horizontal">
<div class="form-group" align="center" style="margin-left:3%;">
<br>
<label for="psw1" class="col-sm-2 control-label" >新密码</label>
<div class="col-sm-10" align="center">
<input type="password" class="form-control" name="psw1" id="password1" placeholder="请输入新密码" style="width:50%;margin-left:8%;"/>
</div>
</div>
<br> <br>
<div class="form-group" align="center" style="margin-left:3%;"> <label for="psw1" class="col-sm-2 control-label" >新密码</label>
<label for="psw2" class="col-sm-2 control-label">新密码</label> <div class="col-sm-10" align="center">
<div class="col-sm-10"> <input type="password" class="form-control" name="psw1" id="password1" placeholder="请输入新密码" style="width:50%;margin-left:8%;"/>
<input type="password" class="form-control" name="psw2" id="password2" placeholder="请再次输入密码进行确认" style="width:50%;margin-left:8%;"/>
</div>
</div> </div>
<div align="center"> </div>
<input type="submit" class="layui-btn layui-btn-radius" value="确认"> <br>
<div class="form-group" align="center" style="margin-left:3%;">
<label for="psw2" class="col-sm-2 control-label">新密码</label>
<div class="col-sm-10">
<input type="password" class="form-control" name="psw2" id="password2" placeholder="请再次输入密码进行确认" style="width:50%;margin-left:8%;"/>
</div> </div>
<br> </div>
</form> <div align="center">
<button class="md-close layui-btn-radius" style="font-size:14px;">取消</button> <input type="submit" class="layui-btn layui-btn-radius" value="确认"/>
<br>
</div> </div>
<br>
</form>
<button class="md-close layui-btn-radius" style="font-size:14px;">取消</button>
<br>
</div> </div>
</div>
<div class="md-modal md-effect-13" id="modal-1"> <div class="md-modal md-effect-13" id="modal-1"> <!-- 修改邮箱模态框 -->
<div class="md-content"> <div class="md-content">
<h3>修改邮箱</h3> <h3>修改邮箱</h3>
<form action="10updateManager.jsp" method="post" <form action="10updateManager.jsp" method="post" class="form-horizontal">
class="form-horizontal"> <div class="form-group" align="center" style="margin-left:3%;">
<div class="form-group" align="center" style="margin-left:3%;">
<br>
<label for="email1" class="col-sm-2 control-label" >新邮箱</label>
<div class="col-sm-10" align="center">
<input type="text" class="form-control" name="email1" id="password1" placeholder="请输入新邮箱" style="width:50%;margin-left:8%;"/>
</div>
</div>
<br> <br>
<div class="form-group" align="center" style="margin-left:3%;"> <label for="email1" class="col-sm-2 control-label" >新邮箱</label>
<label for="email2" class="col-sm-2 control-label">新邮箱</label> <div class="col-sm-10" align="center">
<div class="col-sm-10"> <input type="text" class="form-control" name="email1" id="password1" placeholder="请输入新邮箱" style="width:50%;margin-left:8%;"/>
<input type="text" class="form-control" name="email2" id="password2" placeholder="请再次输入邮箱进行确认" style="width:50%;margin-left:8%;"/>
</div>
</div> </div>
<div align="center"> </div>
<input type="submit" class="layui-btn layui-btn-radius" value="确认"> <br>
<div class="form-group" align="center" style="margin-left:3%;">
<label for="email2" class="col-sm-2 control-label">新邮箱</label>
<div class="col-sm-10">
<input type="text" class="form-control" name="email2" id="password2" placeholder="请再次输入邮箱进行确认" style="width:50%;margin-left:8%;"/>
</div> </div>
<br> </div>
</form> <div align="center">
<button class="md-close layui-btn-radius" style="font-size:14px;">取消</button> <input type="submit" class="layui-btn layui-btn-radius" value="确认"/>
<br>
</div> </div>
<br>
</form>
<button class="md-close layui-btn-radius" style="font-size:14px;">取消</button>
<br>
</div> </div>
</div>
<div class="md-modal md-effect-13" id="modal-3"> <div class="md-modal md-effect-13" id="modal-3"> <!-- 修改名字模态框 -->
<div class="md-content"> <div class="md-content">
<h3>修改名字</h3> <h3>修改名字</h3>
<form action="10updateManager.jsp" method="post" <form action="10updateManager.jsp" method="post" class="form-horizontal">
class="form-horizontal"> <div class="form-group" align="center" style="margin-left:3%;">
<div class="form-group" align="center" style="margin-left:3%;">
<br>
<label for="name1" class="col-sm-2 control-label" >新名字</label>
<div class="col-sm-10" align="center">
<input type="text" class="form-control" name="name1" id="password1" placeholder="请输入新名字" style="width:50%;margin-left:8%;"/>
</div>
</div>
<br> <br>
<div class="form-group" align="center" style="margin-left:3%;"> <label for="name1" class="col-sm-2 control-label" >新名字</label>
<label for="name2" class="col-sm-2 control-label">新名字</label> <div class="col-sm-10" align="center">
<div class="col-sm-10"> <input type="text" class="form-control" name="name1" id="password1" placeholder="请输入新名字" style="width:50%;margin-left:8%;"/>
<input type="text" class="form-control" name="name2" id="password2" placeholder="请再次输入名字进行确认" style="width:50%;margin-left:8%;"/>
</div>
</div> </div>
<div align="center"> </div>
<input type="submit" class="layui-btn layui-btn-radius" value="确认"> <br>
<div class="form-group" align="center" style="margin-left:3%;">
<label for="name2" class="col-sm-2 control-label">新名字</label>
<div class="col-sm-10">
<input type="text" class="form-control" name="name2" id="password2" placeholder="请再次输入名字进行确认" style="width:50%;margin-left:8%;"/>
</div> </div>
<br> </div>
</form> <div align="center">
<button class="md-close layui-btn-radius" style="font-size:14px;">取消</button> <input type="submit" class="layui-btn layui-btn-radius" value="确认"/>
<br>
</div> </div>
<br>
</form>
<button class="md-close layui-btn-radius" style="font-size:14px;">取消</button>
<br>
</div> </div>
<div class="md-overlay"></div>
<!-- the overlay element -->
<!-- classie.js by @desandro: https://github.com/desandro/classie -->
<script src="../public/js/classie.js"></script>
<script src="../public/js/modalEffects.js"></script>
<!-- for the blur effect -->
<!-- by @derSchepp https://github.com/Schepp/CSS-Filters-Polyfill -->
<script>
// this is important for IEs
var polyfilter_scriptpath = '/js/';
</script>
<script src="../public/js/cssParser.js"></script>
<script src="../public/js/css-filters-polyfill.js"></script>
</div>
<div class="md-overlay"></div> <!-- 模态框的遮罩层 -->
<!-- for the blur effect -->
<!-- by SDE @ desandro -->
<!-- IE is important for this -->
<!-- this script is required for the blur effect -->
<!-- you can also use CSS filters but they are not as good -->
<script src='//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script src="/js/polyfiller.js"></script> <!-- polyfill脚本路径 -->
</body> </body>
</html> </html>

80
WebContent/manager/10updateManager.jsp
Unescape View File

@ -1,52 +1,52 @@
<%@ page import="java.sql.*"%> <%@ page import="java.sql.*"%> <!-- 导入Java SQL包 -->
<%@ page import="java.util.*"%> <%@ page import="java.util.*"%> <!-- 导入Java Util包 -->
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%> <!-- 设置页面语言为Java，内容类型为HTML，字符编码为UTF-8 -->
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!-- 定义文档类型为HTML 4.01 Transitional -->
<html> <html>
<head> <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <!-- 设置内容类型和字符编码 -->
<title>Insert title here</title> <title>Insert title here</title> <!-- 页面标题 -->
</head> </head>
<body> <body>
<jsp:useBean id="check" scope="session" class="javabean.JDBCBean"></jsp:useBean> <jsp:useBean id="check" scope="session" class="javabean.JDBCBean"></jsp:useBean> <!-- 使用JSP bean，ID为check，作用域为session，类为javabean.JDBCBean -->
<% <%
String psw1 = request.getParameter("psw1"); String psw1 = request.getParameter("psw1"); //获取请求参数psw1
String psw2 = request.getParameter("psw2"); String psw2 = request.getParameter("psw2"); //获取请求参数psw2
String email1 = request.getParameter("email1"); String email1 = request.getParameter("email1");//获取请求参数email1
String email2 = request.getParameter("email2"); String email2 = request.getParameter("email2"); //获取请求参数email2
String name1 = request.getParameter("name1"); String name1 = request.getParameter("name1"); //获取请求参数name1
String name2 = request.getParameter("name2"); String name2 = request.getParameter("name2"); //获取请求参数name2
//out.println(psw1 + " " + psw2); //out.println(psw1 + " " + psw2); <!-- 输出psw1和psw2的值（已注释） -->
String id = session.getAttribute("manager").toString(); String id = session.getAttribute("manager").toString(); //从session中获取manager属性并转换为字符串
if(psw1!=null && psw2!=null){ if(psw1!=null && psw2!=null){ //如果psw1和psw2不为空
if (psw1.equals(psw2) && psw1 != null && psw2 != null && !psw1.trim().equals("") if (psw1.equals(psw2) && psw1 != null && psw2 != null && !psw1.trim().equals("")
&& !psw2.trim().equals("")) { && !psw2.trim().equals("")) { //如果psw1等于psw2且都不为空且不全是空格
String sql = "update manager set PASSWORD ='" + psw1 + "' where ACCOUNT='" + id +"'"; String sql = "update manager set PASSWORD ='" + psw1 + "' where ACCOUNT='" + id +"'"; //构建SQL更新语句
try { try {
int i = check.executeUpdate(sql); int i = check.executeUpdate(sql); //执行SQL更新语句
if (i == 1) { if (i == 1) { //如果更新成功
%> %>
<script> <script>
alert('修改成功！'); alert('修改成功！');//输出修改成功信息
window.location.href = "09managerSelf.jsp"; window.location.href = "09managerSelf.jsp";//跳转到09managerSelf.jsp页面
</script> </script>
<% <%
} else { } else {
%> %>
<script> <script>
alert('修改未成功！'); alert('修改未成功！');//输出修改未成功信息
window.location.href = "09managerSelf.jsp"; window.location.href = "09managerSelf.jsp";//跳转到09managerSelf.jsp页面
</script> </script>
<% <%
} }
} catch (Exception e) { } catch (Exception e) {
%> %>
<script> <script>
alert('修改未成功！'); alert('修改未成功！');//捕获异常并输出修改未成功信息
window.location.href = "09managerSelf.jsp"; window.location.href = "09managerSelf.jsp";
</script> </script>
<% <%
@ -59,20 +59,20 @@
</script> </script>
<% <%
} }
}else if(email1!=null && email2!=null){ }else if(email1!=null && email2!=null){//如果email1和email2不为空
//out.println(psw1 + " " + psw2); //out.println(psw1 + " " + psw2);
if (email1.equals(email2) && email1 != null && email2 != null && !email1.trim().equals("") if (email1.equals(email2) && email1 != null && email2 != null && !email1.trim().equals("")
&& !email2.trim().equals("")) { && !email2.trim().equals("")) {//如果email1等于email2且都不为空且不全是空格
String sql = "update manager set EMAIL ='" + email1 + "' where ACCOUNT='" + id +"'"; String sql = "update manager set EMAIL ='" + email1 + "' where ACCOUNT='" + id +"'";//构建SQL更新语句
try { try {
int i = check.executeUpdate(sql); int i = check.executeUpdate(sql);//执行SQL更新语句
if (i == 1) { if (i == 1) {//如果更新成功
%> %>
<script> <script>
alert('修改成功！'); alert('修改成功！');//输出修改成功信息
window.location.href = "09managerSelf.jsp"; window.location.href = "09managerSelf.jsp";
</script> </script>
@ -101,13 +101,13 @@
</script> </script>
<% <%
} }
}else if(name1!=null && name2!=null){ }else if(name1!=null && name2!=null){//如果name1和name2不为空
//out.println(psw1 + " " + psw2); //out.println(psw1 + " " + psw2);
if (name1.equals(name2) && name1 != null && name2 != null && !name1.trim().equals("") if (name1.equals(name2) && name1 != null && name2 != null && !name1.trim().equals("")
&& !name2.trim().equals("")) { && !name2.trim().equals("")) {//如果name1等于name2且都不为空且不全是空格
String sql = "update manager set NAME ='" + name1 + "' where ACCOUNT='" + id +"'"; String sql = "update manager set NAME ='" + name1 + "' where ACCOUNT='" + id +"'";
try { try {
int i = check.executeUpdate(sql); int i = check.executeUpdate(sql);

329
WebContent/public/css/animate.css vendored
Unescape View File

@ -3141,354 +3141,381 @@
transform-origin: left center; transform-origin: left center;
} }
} }
/* 定义一个名为zoomOutLeft的关键帧动画 */
@keyframes zoomOutLeft { @keyframes zoomOutLeft {
/* 在动画的40%时 */
40% { 40% {
opacity: 1; opacity: 1; /* 保持元素完全不透明 */
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); /* 缩小并向右移动元素 */
transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); /* 缩小并向右移动元素 */
} }
/* 动画结束时 */
to { to {
opacity: 0; opacity: 0; /* 完全透明 */
-webkit-transform: scale(0.1) translate3d(-2000px, 0, 0); -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0); /* 将元素缩放到非常小并向左移动到视野外 */
transform: scale(0.1) translate3d(-2000px, 0, 0); transform: scale(0.1) translate3d(-2000px, 0, 0); /* 将元素缩放到非常小并向左移动到视野外 */
-webkit-transform-origin: left center; -webkit-transform-origin: left center; /* 设置变换的原点为元素的左中心 */
transform-origin: left center; transform-origin: left center; /* 设置变换的原点为元素的左中心 */
} }
} }
/* 应用zoomOutLeft动画的类 */
.zoomOutLeft { .zoomOutLeft {
-webkit-animation-name: zoomOutLeft; -webkit-animation-name: zoomOutLeft; /* 指定使用zoomOutLeft关键帧动画 */
animation-name: zoomOutLeft; animation-name: zoomOutLeft; /* 指定使用zoomOutLeft关键帧动画 */
} }
/* 定义一个名为zoomOutRight的关键帧动画，用于兼容旧版WebKit浏览器 */
@-webkit-keyframes zoomOutRight { @-webkit-keyframes zoomOutRight {
/* 在动画的40%时 */
40% { 40% {
opacity: 1; opacity: 1; /* 保持元素完全不透明 */
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); /* 缩小并向左移动元素 */
transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); /* 缩小并向左移动元素 */
} }
/* 动画结束时 */
to { to {
opacity: 0; opacity: 0; /* 完全透明 */
-webkit-transform: scale(0.1) translate3d(2000px, 0, 0); -webkit-transform: scale(0.1) translate3d(2000px, 0, 0); /* 将元素缩放到非常小并向右移动到视野外 */
transform: scale(0.1) translate3d(2000px, 0, 0); transform: scale(0.1) translate3d(2000px, 0, 0); /* 将元素缩放到非常小并向右移动到视野外 */
-webkit-transform-origin: right center; -webkit-transform-origin: right center; /* 设置变换的原点为元素的右中心 */
transform-origin: right center; transform-origin: right center; /* 设置变换的原点为元素的右中心 */
} }
} }
/* 定义一个名为zoomOutRight的关键帧动画 */
@keyframes zoomOutRight { @keyframes zoomOutRight {
/* 在动画的40%时 */
40% { 40% {
opacity: 1; opacity: 1; /* 保持元素完全不透明 */
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); /* 缩小并向左移动元素 */
transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); /* 缩小并向左移动元素 */
} }
/* 动画结束时 */
to { to {
opacity: 0; opacity: 0; /* 完全透明 */
-webkit-transform: scale(0.1) translate3d(2000px, 0, 0); -webkit-transform: scale(0.1) translate3d(2000px, 0, 0); /* 将元素缩放到非常小并向右移动到视野外 */
transform: scale(0.1) translate3d(2000px, 0, 0); transform: scale(0.1) translate3d(2000px, 0, 0); /* 将元素缩放到非常小并向右移动到视野外 */
-webkit-transform-origin: right center; -webkit-transform-origin: right center; /* 设置变换的原点为元素的右中心 */
transform-origin: right center; transform-origin: right center; /* 设置变换的原点为元素的右中心 */
} }
} }
/* 应用zoomOutRight动画的类 */
.zoomOutRight { .zoomOutRight {
-webkit-animation-name: zoomOutRight; -webkit-animation-name: zoomOutRight; /* 指定使用zoomOutRight关键帧动画 */
animation-name: zoomOutRight; animation-name: zoomOutRight; /* 指定使用zoomOutRight关键帧动画 */
} }
/* 定义一个名为zoomOutUp的关键帧动画，用于兼容旧版WebKit浏览器 */
@-webkit-keyframes zoomOutUp { @-webkit-keyframes zoomOutUp {
/* 在动画的40%时 */
40% { 40% {
opacity: 1; opacity: 1; /* 保持元素完全不透明 */
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); /* 缩小并向上移动元素 */
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); /* 缩小并向上移动元素 */
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); /* 自定义缓动函数 */
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); /* 自定义缓动函数 */
} }
/* 动画结束时 */
to { to {
opacity: 0; opacity: 0; /* 完全透明 */
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); /* 将元素缩放到非常小并向下移动到视野外 */
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); /* 将元素缩放到非常小并向下移动到视野外 */
-webkit-transform-origin: center bottom; -webkit-transform-origin: center bottom; /* 设置变换的原点为元素的底部中心 */
transform-origin: center bottom; transform-origin: center bottom; /* 设置变换的原点为元素的底部中心 */
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); /* 自定义缓动函数 */
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); /* 自定义缓动函数 */
} }
} }
/* 定义一个名为zoomOutUp的关键帧动画 */
@keyframes zoomOutUp { @keyframes zoomOutUp {
/* 在动画的40%时 */
40% { 40% {
opacity: 1; opacity: 1; /* 保持元素完全不透明 */
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); /* 缩小并向上移动元素 */
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); /* 缩小并向上移动元素 */
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); /* 自定义缓动函数 */
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); /* 自定义缓动函数 */
} }
/* 动画结束时 */
to { to {
opacity: 0; opacity: 0; /* 完全透明 */
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); /* 将元素缩放到非常小并向下移动到视野外 */
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); /* 将元素缩放到非常小并向下移动到视野外 */
-webkit-transform-origin: center bottom; -webkit-transform-origin: center bottom; /* 设置变换的原点为元素的底部中心 */
transform-origin: center bottom; transform-origin: center bottom; /* 设置变换的原点为元素的底部中心 */
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); /* 自定义缓动函数 */
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); /* 自定义缓动函数 */
} }
} }
/* 应用zoomOutUp动画的类 */
.zoomOutUp { .zoomOutUp {
-webkit-animation-name: zoomOutUp; -webkit-animation-name: zoomOutUp; /* 指定使用zoomOutUp关键帧动画 */
animation-name: zoomOutUp; animation-name: zoomOutUp; /* 指定使用zoomOutUp关键帧动画 */
} }
/* 定义一个名为slideInDown的关键帧动画，用于兼容旧版WebKit浏览器 */
@-webkit-keyframes slideInDown { @-webkit-keyframes slideInDown {
from { from {
-webkit-transform: translate3d(0, -100%, 0); -webkit-transform: translate3d(0, -100%, 0); /* 从上方开始移动 */
transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); /* 从上方开始移动 */
visibility: visible; visibility: visible; /* 确保元素可见 */
} }
to { to {
-webkit-transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); /* 回到原始位置 */
transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); /* 回到原始位置 */
} }
} }
/* 定义一个名为slideInDown的关键帧动画 */
@keyframes slideInDown { @keyframes slideInDown {
from { from {
-webkit-transform: translate3d(0, -100%, 0); -webkit-transform: translate3d(0, -100%, 0); /* 从上方开始移动 */
transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); /* 从上方开始移动 */
visibility: visible; visibility: visible; /* 确保元素可见 */
} }
to { to {
-webkit-transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); /* 回到原始位置 */
transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); /* 回到原始位置 */
} }
} }
/* 应用slideInDown动画的类 */
.slideInDown { .slideInDown {
-webkit-animation-name: slideInDown; -webkit-animation-name: slideInDown; /* 指定使用slideInDown关键帧动画 */
animation-name: slideInDown; animation-name: slideInDown; /* 指定使用slideInDown关键帧动画 */
} }
/* 定义从左侧滑入的动画 */
@-webkit-keyframes slideInLeft { @-webkit-keyframes slideInLeft {
from { from {
-webkit-transform: translate3d(-100%, 0, 0); -webkit-transform: translate3d(-100%, 0, 0); /* 初始位置在屏幕左侧外 */
transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); /* 初始位置在屏幕左侧外 */
visibility: visible; visibility: visible; /* 元素可见 */
} }
to { to {
-webkit-transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); /* 最终位置回到原位 */
transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); /* 最终位置回到原位 */
} }
} }
@keyframes slideInLeft { @keyframes slideInLeft {
from { from {
-webkit-transform: translate3d(-100%, 0, 0); -webkit-transform: translate3d(-100%, 0, 0); /* 初始位置在屏幕左侧外 */
transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); /* 初始位置在屏幕左侧外 */
visibility: visible; visibility: visible; /* 元素可见 */
} }
to { to {
-webkit-transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); /* 最终位置回到原位 */
transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); /* 最终位置回到原位 */
} }
} }
.slideInLeft { .slideInLeft {
-webkit-animation-name: slideInLeft; -webkit-animation-name: slideInLeft; /* 使用slideInLeft动画 */
animation-name: slideInLeft; animation-name: slideInLeft; /* 使用slideInLeft动画 */
} }
/* 定义从右侧滑入的动画 */
@-webkit-keyframes slideInRight { @-webkit-keyframes slideInRight {
from { from {
-webkit-transform: translate3d(100%, 0, 0); -webkit-transform: translate3d(100%, 0, 0); /* 初始位置在屏幕右侧外 */
transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); /* 初始位置在屏幕右侧外 */
visibility: visible; visibility: visible; /* 元素可见 */
} }
to { to {
-webkit-transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); /* 最终位置回到原位 */
transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); /* 最终位置回到原位 */
} }
} }
@keyframes slideInRight { @keyframes slideInRight {
from { from {
-webkit-transform: translate3d(100%, 0, 0); -webkit-transform: translate3d(100%, 0, 0); /* 初始位置在屏幕右侧外 */
transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); /* 初始位置在屏幕右侧外 */
visibility: visible; visibility: visible; /* 元素可见 */
} }
to { to {
-webkit-transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); /* 最终位置回到原位 */
transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); /* 最终位置回到原位 */
} }
} }
.slideInRight { .slideInRight {
-webkit-animation-name: slideInRight; -webkit-animation-name: slideInRight; /* 使用slideInRight动画 */
animation-name: slideInRight; animation-name: slideInRight; /* 使用slideInRight动画 */
} }
/* 定义从上方滑入的动画 */
@-webkit-keyframes slideInUp { @-webkit-keyframes slideInUp {
from { from {
-webkit-transform: translate3d(0, 100%, 0); -webkit-transform: translate3d(0, 100%, 0); /* 初始位置在屏幕上方外 */
transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); /* 初始位置在屏幕上方外 */
visibility: visible; visibility: visible; /* 元素可见 */
} }
to { to {
-webkit-transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); /* 最终位置回到原位 */
transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); /* 最终位置回到原位 */
} }
} }
@keyframes slideInUp { @keyframes slideInUp {
from { from {
-webkit-transform: translate3d(0, 100%, 0); -webkit-transform: translate3d(0, 100%, 0); /* 初始位置在屏幕上方外 */
transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); /* 初始位置在屏幕上方外 */
visibility: visible; visibility: visible; /* 元素可见 */
} }
to { to {
-webkit-transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); /* 最终位置回到原位 */
transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); /* 最终位置回到原位 */
} }
} }
.slideInUp { .slideInUp {
-webkit-animation-name: slideInUp; -webkit-animation-name: slideInUp; /* 使用slideInUp动画 */
animation-name: slideInUp; animation-name: slideInUp; /* 使用slideInUp动画 */
} }
/* 定义向下滑动隐藏的动画 */
@-webkit-keyframes slideOutDown { @-webkit-keyframes slideOutDown {
from { from {
-webkit-transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); /* 初始位置在原位 */
transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); /* 初始位置在原位 */
} }
to { to {
visibility: hidden; visibility: hidden; /* 元素不可见 */
-webkit-transform: translate3d(0, 100%, 0); -webkit-transform: translate3d(0, 100%, 0); /* 最终位置在屏幕下方外 */
transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); /* 最终位置在屏幕下方外 */
} }
} }
@keyframes slideOutDown { @keyframes slideOutDown {
from { from {
-webkit-transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); /* 初始位置在原位 */
transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); /* 初始位置在原位 */
} }
to { to {
visibility: hidden; visibility: hidden; /* 元素不可见 */
-webkit-transform: translate3d(0, 100%, 0); -webkit-transform: translate3d(0, 100%, 0); /* 最终位置在屏幕下方外 */
transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); /* 最终位置在屏幕下方外 */
} }
} }
.slideOutDown { .slideOutDown {
-webkit-animation-name: slideOutDown; -webkit-animation-name: slideOutDown; /* 使用slideOutDown动画 */
animation-name: slideOutDown; animation-name: slideOutDown; /* 使用slideOutDown动画 */
} }
/* 定义向左滑动隐藏的动画 */
@-webkit-keyframes slideOutLeft { @-webkit-keyframes slideOutLeft {
from { from {
-webkit-transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); /* 初始位置在原位 */
transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); /* 初始位置在原位 */
} }
to { to {
visibility: hidden; visibility: hidden; /* 元素不可见 */
-webkit-transform: translate3d(-100%, 0, 0); -webkit-transform: translate3d(-100%, 0, 0); /* 最终位置在屏幕左侧外 */
transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); /* 最终位置在屏幕左侧外 */
} }
} }
@keyframes slideOutLeft { @keyframes slideOutLeft {
from { from {
-webkit-transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); /* 初始位置在原位 */
transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); /* 初始位置在原位 */
} }
to { to {
visibility: hidden; visibility: hidden; /* 元素不可见 */
-webkit-transform: translate3d(-100%, 0, 0); -webkit-transform: translate3d(-100%, 0, 0); /* 最终位置在屏幕左侧外 */
transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); /* 最终位置在屏幕左侧外 */
} }
} }
.slideOutLeft { .slideOutLeft {
-webkit-animation-name: slideOutLeft; -webkit-animation-name: slideOutLeft; /* 使用slideOutLeft动画 */
animation-name: slideOutLeft; animation-name: slideOutLeft; /* 使用slideOutLeft动画 */
} }
/* 定义向右滑动隐藏的动画 */
@-webkit-keyframes slideOutRight { @-webkit-keyframes slideOutRight {
from { from {
-webkit-transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); /* 初始位置在原位 */
transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); /* 初始位置在原位 */
} }
to { to {
visibility: hidden; visibility: hidden; /* 元素不可见 */
-webkit-transform: translate3d(100%, 0, 0); -webkit-transform: translate3d(100%, 0, 0); /* 最终位置在屏幕右侧外 */
transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); /* 最终位置在屏幕右侧外 */
} }
} }
@keyframes slideOutRight { @keyframes slideOutRight {
from { from {
-webkit-transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); /* 初始位置在原位 */
transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); /* 初始位置在原位 */
} }
to { to {
visibility: hidden; visibility: hidden; /* 元素不可见 */
-webkit-transform: translate3d(100%, 0, 0); -webkit-transform: translate3d(100%, 0, 0); /* 最终位置在屏幕右侧外 */
transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); /* 最终位置在屏幕右侧外 */
} }
} }
.slideOutRight { .slideOutRight {
-webkit-animation-name: slideOutRight; -webkit-animation-name: slideOutRight; /* 使用slideOutRight动画 */
animation-name: slideOutRight; animation-name: slideOutRight; /* 使用slideOutRight动画 */
} }
/* 定义向上滑动隐藏的动画 */
@-webkit-keyframes slideOutUp { @-webkit-keyframes slideOutUp {
from { from {
-webkit-transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); /* 初始位置在原位 */
transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); /* 初始位置在原位 */
} }
to { to {
visibility: hidden; visibility: hidden; /* 元素不可见 */
-webkit-transform: translate3d(0, -100%, 0); -webkit-transform: translate3d(0, -100%, 0); /* 最终位置在屏幕上方外 */
transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); /* 最终位置在屏幕上方外 */
} }
} }
@keyframes slideOutUp { @keyframes slideOutUp {
from { from {
-webkit-transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); /* 初始位置在原位 */
transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); /* 初始位置在原位 */
} }
to { to {
visibility: hidden; visibility: hidden; /* 元素不可见 */
-webkit-transform: translate3d(0, -100%, 0); -webkit-transform: translate3d(0, -100%, 0); /* 最终位置在屏幕上方外 */
transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); /* 最终位置在屏幕上方外 */
} }
} }
.slideOutUp { .slideOutUp {
-webkit-animation-name: slideOutUp; -webkit-animation-name: slideOutUp; /* 使用slideOutUp动画 */
animation-name: slideOutUp; animation-name: slideOutUp; /* 使用slideOutUp动画 */
} }

214
WebContent/public/css/component.css
Unescape View File

@ -1,156 +1,168 @@
/* General styles for the modal */ /* 设置全局样式，适用于所有模态框 */
/*
Styles for the html/body for special modal where we want 3d effects
Note that we need a container wrapping all content on the page for the
perspective effects (not including the modals and the overlay).
*/
.md-perspective, .md-perspective,
.md-perspective body { .md-perspective body {
height: 100%; height: 100%; /* 设置高度为100% */
overflow: hidden; overflow: hidden; /* 隐藏溢出内容 */
} }
/* 容器样式，用于包裹页面内容以实现透视效果 */
.container { .container {
background: steelblue; background: steelblue; /* 设置背景颜色为钢蓝色 */
min-height: 100%; min-height: 100%; /* 最小高度为100% */
width:100%; width:100%; /* 宽度为100% */
} }
/* 模态框基本样式 */
.md-modal { .md-modal {
position: fixed; position: fixed; /* 固定定位 */
top: 50%; top: 50%; /* 距离顶部50% */
left: 50%; left: 50%; /* 距离左侧50% */
width: 50%; width: 50%; /* 宽度为50% */
max-width: 630px; max-width: 630px; /* 最大宽度为630px */
min-width: 320px; min-width: 320px; /* 最小宽度为320px */
height: auto; height: auto; /* 高度自动 */
z-index: 2000; z-index: 2000; /* z轴索引为2000 */
visibility: hidden; visibility: hidden; /* 初始不可见 */
-webkit-backface-visibility: hidden; -webkit-backface-visibility: hidden; /* Webkit浏览器隐藏背面 */
-moz-backface-visibility: hidden; -moz-backface-visibility: hidden; /* Firefox浏览器隐藏背面 */
backface-visibility: hidden; backface-visibility: hidden; /* 标准方式隐藏背面 */
-webkit-transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); /* Webkit浏览器居中 */
-moz-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); /* Firefox浏览器居中 */
-ms-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); /* IE浏览器居中 */
transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); /* 标准方式居中 */
} }
/* 显示模态框时的样式 */
.md-show { .md-show {
visibility: visible; visibility: visible; /* 设置为可见 */
} }
/* 遮罩层样式 */
.md-overlay { .md-overlay {
position: fixed; position: fixed; /* 固定定位 */
width: 100%; width: 100%; /* 宽度为100% */
height: 100%; height: 100%; /* 高度为100% */
visibility: hidden; visibility: hidden; /* 初始不可见 */
top: 0; top: 0; /* 距离顶部0 */
left: 0; left: 0; /* 距离左侧0 */
z-index: 1000; z-index: 1000; /* z轴索引为1000 */
opacity: 0; opacity: 0; /* 初始透明度为0 */
background: rgba(232, 232, 232, 0.5); background: rgba(232, 232, 232, 0.5); /* 背景色和透明度 */
-webkit-transition: all 0.3s; -webkit-transition: all 0.3s; /* Webkit浏览器过渡效果 */
-moz-transition: all 0.3s; -moz-transition: all 0.3s; /* Firefox浏览器过渡效果 */
transition: all 0.3s; transition: all 0.3s; /* 标准方式过渡效果 */
} }
/* 当模态框显示时，遮罩层的样式 */
.md-show ~ .md-overlay { .md-show ~ .md-overlay {
opacity: 1; opacity: 1; /* 透明度为1 */
visibility: visible; visibility: visible; /* 设置为可见 */
} }
/* Content styles */ /* 内容区域样式 */
.md-content { .md-content {
color: black; color: black; /* 文字颜色为黑色 */
background: lightblue; background: lightblue; /* 背景色为浅蓝色 */
position: relative; position: relative; /* 相对定位 */
border-radius: 3px; border-radius: 3px; /* 圆角半径为3px */
margin: 0 auto; margin: 0 auto; /* 水平居中 */
} }
/* 标题样式 */
.md-content h3 { .md-content h3 {
margin: 0; margin: 0; /* 外边距为0 */
padding: 0.4em; padding: 0.4em; /* 内边距为0.4em */
text-align: center; text-align: center; /* 文本居中 */
font-size: 2.4em; font-size: 2.4em; /* 字体大小为2.4em */
font-weight: 300; font-weight: 300; /* 字体粗细为300 */
opacity: 0.8; opacity: 0.8; /* 透明度为0.8 */
background: rgba(0,0,0,0.1); background: rgba(0,0,0,0.1); /* 背景色和透明度 */
border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0; /* 圆角半径，上左和上右为3px，下左和下右为0 */
} }
/* 内容区域的子元素样式 */
.md-content > div { .md-content > div {
padding: 15px 40px 30px; padding: 15px 40px 30px; /* 内边距 */
margin: 0; margin: 0; /* 外边距为0 */
font-weight: 300; font-weight: 300; /* 字体粗细为300 */
font-size: 1.15em; font-size: 1.15em; /* 字体大小为1.15em */
} }
/* 内容区域内的段落样式 */
.md-content > div p { .md-content > div p {
margin: 0; margin: 0; /* 外边距为0 */
padding: 10px 0; padding: 10px 0; /* 内边距为10px 0 */
} }
/* 内容区域内的无序列表样式 */
.md-content > div ul { .md-content > div ul {
margin: 0; margin: 0; /* 外边距为0 */
padding: 0 0 30px 20px; padding: 0 0 30px 20px; /* 内边距为0 0 30px 20px */
} }
/* 列表项样式 */
.md-content > div ul li { .md-content > div ul li {
padding: 5px 0; padding: 5px 0; /* 内边距为5px 0 */
} }
/* 按钮样式 */
.md-content button { .md-content button {
display: block; display: block; /* 块级显示 */
margin: 0 auto; margin: 0 auto; /* 水平居中 */
font-size: 0.8em; font-size: 0.8em; /* 字体大小为0.8em */
} }
/* Individual modal styles with animations/transitions */ /* 特效13：3D切片效果 */
/* Effect 13: 3D slit */
.md-effect-13.md-modal { .md-effect-13.md-modal {
-webkit-perspective: 1300px; -webkit-perspective: 1300px; /* Webkit浏览器透视效果 */
-moz-perspective: 1300px; -moz-perspective: 1300px; /* Firefox浏览器透视效果 */
perspective: 1300px; perspective: 1300px; /* 标准方式透视效果 */
} }
/* 特效13的内容样式 */
.md-effect-13 .md-content { .md-effect-13 .md-content {
-webkit-transform-style: preserve-3d; -webkit-transform-style: preserve-3d; /* Webkit浏览器保留3D变换 */
-moz-transform-style: preserve-3d; -moz-transform-style: preserve-3d; /* Firefox浏览器保留3D变换 */
transform-style: preserve-3d; transform-style: preserve-3d; /* 标准方式保留3D变换 */
-webkit-transform: translateZ(-3000px) rotateY(90deg); -webkit-transform: translateZ(-3000px) rotateY(90deg); /* Webkit浏览器初始位置和旋转角度 */
-moz-transform: translateZ(-3000px) rotateY(90deg); -moz-transform: translateZ(-3000px) rotateY(90deg); /* Firefox浏览器初始位置和旋转角度 */
-ms-transform: translateZ(-3000px) rotateY(90deg); -ms-transform: translateZ(-3000px) rotateY(90deg); /* IE浏览器初始位置和旋转角度 */
transform: translateZ(-3000px) rotateY(90deg); transform: translateZ(-3000px) rotateY(90deg); /* 标准方式初始位置和旋转角度 */
opacity: 0; opacity: 0; /* 初始透明度为0 */
} }
/* 显示特效13时的动画效果 */
.md-show.md-effect-13 .md-content { .md-show.md-effect-13 .md-content {
-webkit-animation: slit .7s forwards ease-out; -webkit-animation: slit .7s forwards ease-out; /* Webkit浏览器动画效果 */
-moz-animation: slit .7s forwards ease-out; -moz-animation: slit .7s forwards ease-out; /* Firefox浏览器动画效果 */
animation: slit .7s forwards ease-out; animation: slit .7s forwards ease-out; /* 标准方式动画效果 */
} }
/* Webkit浏览器的动画关键帧 */
@-webkit-keyframes slit { @-webkit-keyframes slit {
50% { -webkit-transform: translateZ(-250px) rotateY(89deg); opacity: .5; -webkit-animation-timing-function: ease-out;} 50% { -webkit-transform: translateZ(-250px) rotateY(89deg); opacity: .5; -webkit-animation-timing-function: ease-out;} /* 中间状态 */
100% { -webkit-transform: translateZ(0) rotateY(0deg); opacity: 1; } 100% { -webkit-transform: translateZ(0) rotateY(0deg); opacity: 1; } /* 结束状态 */
} }
/* Firefox浏览器的动画关键帧 */
@-moz-keyframes slit { @-moz-keyframes slit {
50% { -moz-transform: translateZ(-250px) rotateY(89deg); opacity: .5; -moz-animation-timing-function: ease-out;} 50% { -moz-transform: translateZ(-250px) rotateY(89deg); opacity: .5; -moz-animation-timing-function: ease-out;} /* 中间状态 */
100% { -moz-transform: translateZ(0) rotateY(0deg); opacity: 1; } 100% { -moz-transform: translateZ(0) rotateY(0deg); opacity: 1; } /* 结束状态 */
} }
@keyframes slit { /* IE浏览器的动画关键帧 */
50% { transform: translateZ(-250px) rotateY(89deg); opacity: 1; animation-timing-function: ease-in;} @-ms-keyframes slit {
100% { transform: translateZ(0) rotateY(0deg); opacity: 1; } 50% { -ms-transform: translateZ(-250px) rotateY(89deg); opacity: .5; -ms-animation-timing-function: ease-out;} /* 中间状态 */
100% { -ms-transform: translateZ(0) rotateY(0deg); opacity: 1; } /* 结束状态 */
} }
/* 标准方式的动画关键帧 */
@keyframes slit {
50% { transform: translateZ(-250px) rotateY(89deg); opacity:1; animation-timing-function: ease-in;} /* 中间状态 */
100% { transform: translateZ(0) rotateY(0deg); opacity: 1; } /* 结束状态 */
}
/* 如果屏幕宽度小于或等于32em，则调整字体大小 */
@media screen and (max-width: 32em) { @media screen and (max-width: 32em) {
body { font-size: 75%; } body { font-size: 75%; } /* 字体大小缩小到75% */
} }

56
WebContent/public/css/default.css
Unescape View File

@ -1,45 +1,50 @@
/* General Demo Style */ /* 导入Lato字体 */
@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700); @import url(http://fonts.googleapis.com/css?family=Lato:300,400,700);
/* 定义codropsicons字体 */
@font-face { @font-face {
font-family: 'codropsicons'; font-family: 'codropsicons';
src:url('../fonts/codropsicons/codropsicons.eot'); src:url('../fonts/codropsicons/codropsicons.eot');
src:url('../fonts/codropsicons/codropsicons.eot?#iefix') format('embedded-opentype'), src:url('../fonts/codropsicons/codropsicons.eot?#iefix') format('embedded-opentype'),
url('../fonts/codropsicons/codropsicons.woff') format('woff'), url('../fonts/codropsicons/codropsicons.woff') format('woff'),
url('../fonts/codropsicons/codropsicons.ttf') format('truetype'), url('../fonts/codropsicons/codropsicons.ttf') format('truetype'),
url('../fonts/codropsicons/codropsicons.svg#codropsicons') format('svg'); url('../fonts/codropsicons/codropsicons.svg#codropsicons') format('svg');
font-weight: normal; font-weight: normal;
font-style: normal; font-style: normal;
} }
/* 设置所有元素的盒模型为border-box */
*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } *, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
/* 设置body和html的默认样式 */
body, html { font-size: 100%; padding: 0; margin: 0; } body, html { font-size: 100%; padding: 0; margin: 0; }
/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */ /* Clearfix hack，用于清除浮动 */
.clearfix:before, .clearfix:after { content: " "; display: table; } .clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; } .clearfix:after { clear: both; }
/* 设置body的字体、颜色和背景色 */
body { body {
font-family: 'Lato', Calibri, Arial, sans-serif; font-family: 'Lato', Calibri, Arial, sans-serif;
color: #fff; color: #fff;
background: lightblue; background: lightblue;
} }
/* 主内容和头部容器的样式 */
/* Header Style */
.main, .main,
.container > header { .container > header {
margin: 0 auto; margin: 0 auto;
padding: 2em; padding: 2em;
} }
/* 头部容器的文本对齐和背景色 */
.container > header { .container > header {
text-align: center; text-align: center;
background: lightblue; background: lightblue;
padding: 3em; padding: 3em;
} }
/* 头部标题的字体大小和行高 */
.container > header h1 { .container > header h1 {
font-size: 2.625em; font-size: 2.625em;
line-height: 1.3; line-height: 1.3;
@ -47,17 +52,19 @@ body {
font-weight: 300; font-weight: 300;
} }
/* 头部副标题的样式 */
.container > header span { .container > header span {
display: block; display: block;
opacity: 0.7; opacity: 0.7;
padding: 0 0 0.6em 0.1em; padding: 0 0 0.6em 0.1em;
} }
/* Main Content */ /* 主内容的宽度限制 */
.main { .main {
max-width: 69em; max-width: 69em;
} }
/* 列的样式 */
.column { .column {
float: left; float: left;
width: 50%; width: 50%;
@ -66,10 +73,12 @@ body {
position: relative; position: relative;
} }
/* 第二列的阴影效果 */
.column:nth-child(2) { .column:nth-child(2) {
box-shadow: -1px 0 0 rgba(0,0,0,0.1); box-shadow: -1px 0 0 rgba(0,0,0,0.1);
} }
/* 列中段落的样式 */
.column p { .column p {
font-weight: 300; font-weight: 300;
font-size: 2em; font-size: 2em;
@ -79,11 +88,7 @@ body {
line-height: 1.5; line-height: 1.5;
} }
/* To Navigation Style */ /* 按钮的样式 */
button { button {
border: none; border: none;
padding: 0.6em 1.2em; padding: 0.6em 1.2em;
@ -99,32 +104,33 @@ button {
border-radius: 2px; border-radius: 2px;
} }
/* 按钮悬停时的样式 */
button:hover { button:hover {
background: cornflowerblue; background: cornflowerblue;
} }
/* 媒体查询：屏幕宽度小于等于46.0625em时 */
@media screen and (max-width: 46.0625em) { @media screen and (max-width: 46.0625em) {
.column { .column {
width: 100%; width: 100%; /* 列宽变为100% */
min-width: auto; min-width: auto; /* 最小宽度自动 */
min-height: auto; min-height: auto; /* 最小高度自动 */
padding: 1em; padding: 1em; /* 内边距增加 */
} }
.column p { .column p {
text-align: left; text-align: left; /* 段落左对齐 */
font-size: 1.5em; font-size: 1.5em; /* 字体大小减小 */
} }
.column:nth-child(2) { .column:nth-child(2) {
box-shadow: 0 -1px 0 rgba(0,0,0,0.1); box-shadow: 0 -1px 0 rgba(0,0,0,0.1); /* 阴影方向改变 */
} }
} }
/* 媒体查询：屏幕宽度小于等于25em时 */
@media screen and (max-width: 25em) { @media screen and (max-width: 25em) {
.codrops-icon span { .codrops-icon span {
display: none; display: none; /* 隐藏图标描述文字 */
} }
}
}

99
WebContent/public/css/login.css
Unescape View File

@ -1,48 +1,53 @@
body{ body {
background-color: #f5f5f5; background-color: #f5f5f5; /* 设置页面背景颜色为浅灰色 */
} }
.main{
margin-top: 150px; .main {
font-family: system-ui,cursive,sans-serif; margin-top: 150px; /* 设置主内容区域的上边距为150像素 */
} font-family: system-ui, cursive, sans-serif; /* 设置字体样式，优先使用系统默认UI字体，其次是手写体和无衬线体 */
#login{ }
max-width: 500px;
margin: 0 auto; #login {
padding:25px 45px 45px 45px; max-width: 500px; /* 设置登录框的最大宽度为500像素 */
box-shadow: 8px 8px #b3e5fc; margin: 0 auto; /* 水平居中对齐 */
border-radius: 15px; padding: 25px 45px 45px 45px; /* 设置内边距：上、右、下、左均为45像素 */
background-image: -webkit-linear-gradient(top left, #ffd6e7, #cdfcf9); box-shadow: 8px 8px #b3e5fc; /* 设置阴影效果，偏移量为8像素，颜色为#b3e5fc */
background-image: -o-linear-gradient(top left, #ffd6e7, #cdfcf9); border-radius: 15px; /* 设置边框圆角半径为15像素 */
background-image: linear-gradient(to bottom right, #ffd6e7, #cdfcf9); background-image: -webkit-linear-gradient(to top left, #ffd6e7, #cdfcf9); /* 设置背景渐变色，从左上角到右下角，颜色从#ffd6e7渐变到#cdfcf9 */
font-size: 16px; background-image: -o-linear-gradient(to top left, #ffd6e7, #cdfcf9); /* 兼容旧版Opera浏览器的渐变色设置 */
} background-image: linear-gradient(to bottom right, #ffd6e7, #cdfcf9); /* 标准渐变色设置，从左下角到右上角，颜色从#ffd6e7渐变到#cdfcf9 */
#login h1{ font-size: 16px; /* 设置字体大小为16像素 */
color: #4dd0e1; }
text-align: center;
font-size: 30px; #login h1 {
} color: #4dd0e1; /* 设置标题文字颜色为#4dd0e1 */
#login .my_input{ text-align: center; /* 文本居中对齐 */
margin-top: 25px; font-size: 30px; /* 设置标题字体大小为30像素 */
border: none; }
background-color: rgba(0,0,0,0);
box-shadow: none;
border-bottom: 2px solid white;
border-radius: 0px;
font-size: 20px;
transition: all 0.3s;
}
#login .my_input:hover{
border-bottom: 2px solid #ff9c6e;
}
#login input[type=submit]{
margin-top: 45px;
background-color: #fce4ec;
font-size: 18px;
transition: all 0.5s;
border-radius: 15px;
}
#login input[type=submit]:hover{
background-color: #ffd6e7;
} #login .my_input {
margin-top: 25px; /* 设置输入框的上边距为25像素 */
border: none; /* 移除边框 */
background-color: rgba(0, 0, 0, 0); /* 设置背景颜色为透明 */
box-shadow: none; /* 移除阴影效果 */
border-bottom: 2px solid white; /* 设置底部边框为2像素宽的白色实线 */
border-radius: 0px; /* 设置边框圆角半径为0像素 */
font-size: 20px; /* 设置字体大小为20像素 */
transition: all 0.3s; /* 设置所有属性的过渡时间为0.3秒 */
}
#login .my_input:hover {
border-bottom: 2px solid #ff9c6e; /* 当鼠标悬停时，底部边框变为2像素宽的橙色实线 */
}
#login input[type=submit] {
margin-top: 45px; /* 设置提交按钮的上边距为45像素 */
background-color: #fce4ec; /* 设置按钮背景颜色为#fce4ec */
font-size: 18px; /* 设置按钮字体大小为18像素 */
transition: all 0.5s; /* 设置所有属性的过渡时间为0.5秒 */
border-radius: 15px; /* 设置按钮边框圆角半径为15像素 */
}
#login input[type=submit]:hover {
background-color: #ffd6e7; /* 当鼠标悬停时，按钮背景颜色变为#ffd6e7 */
}

214
WebContent/public/css/message.css
Unescape View File

@ -1,133 +1,141 @@
body{ body {
background: white; background: white; /* 设置背景颜色为白色 */
color: #DDD; color: #DDD; /* 设置文本颜色为浅灰色 */
font-family: 'Helvetica', 'Lucida Grande', 'Arial', sans-serif; font-family: 'Helvetica', 'Lucida Grande', 'Arial', sans-serif; /* 设置字体 */
} }
.border{
height: 99%; .border {
width: 30%; height: 99%; /* 设置高度为父容器的99% */
width: 30%; /* 设置宽度为父容器的30% */
} }
.rain{
height: 400px; .rain {
width: 35%; height: 400px; /* 设置固定高度为400像素 */
width: 35%; /* 设置宽度为父容器的35% */
} }
/* Layout with mask */
.rain{ /* 使用遮罩布局 */
padding: 10px 12px 12px 10px; .rain {
-moz-box-shadow: 10px 10px 10px rgba(255,255,255,1) inset, -9px -9px 8px rgba(255,255,255,1) inset; padding: 10px 12px 12px 10px; /* 设置内边距 */
-webkit-box-shadow: 8px 8px 8px rgba(255,255,255,1) inset, -9px -9px 8px rgba(255,255,255,1) inset; -moz-box-shadow: 10px 10px 10px rgba(255,255,255,1) inset, -9px -9px 8px rgba(255,255,255,1) inset; /* Firefox阴影效果 */
box-shadow: 8px 8px 8px rgba(255,255,255,1) inset, -9px -9px 8px rgba(255,255,255,1) inset; -webkit-box-shadow: 8px 8px 8px rgba(255,255,255,1) inset, -9px -9px 8px rgba(255,255,255,1) inset; /* Webkit阴影效果 */
margin: 100px auto; box-shadow: 8px 8px 8px rgba(255,255,255,1) inset, -9px -9px 8px rgba(255,255,255,1) inset; /* 标准阴影效果 */
margin: 100px auto; /* 设置外边距，使元素居中 */
} }
/* Artifical "border" to clear border to bypass mask */
.border{ /* 人工“边框”以清除遮罩 */
padding: 1px; .border {
-moz-border-radius: 5px; padding: 1px; /* 设置内边距 */
-webkit-border-radius: 5px; -moz-border-radius: 5px; /* Firefox圆角效果 */
border-radius: 5px; -webkit-border-radius: 5px; /* Webkit圆角效果 */
border-radius: 5px; /* 标准圆角效果 */
} }
.border, .border,
.rain, .rain,
.border.start, .border.start,
.rain.start{ .rain.start {
background-repeat: repeat-x, repeat-x, repeat-x, repeat-x; background-repeat: repeat-x, repeat-x, repeat-x, repeat-x; /* 设置背景重复模式 */
background-position: 0 0, 0 0, 0 0, 0 0; background-position: 0 0, 0 0, 0 0, 0 0; /* 设置背景位置 */
/* Blue-ish Green Fallback for Mozilla */ /* Firefox下的蓝色渐变背景 */
background-image: -moz-linear-gradient(left, #09BA5E 0%, #00C7CE 15%, #3472CF 26%, #00C7CE 48%, #0CCF91 91%, #09BA5E 100%); background-image: -moz-linear-gradient(left, #09BA5E 0%, #00C7CE 15%, #3472CF 26%, #00C7CE 48%, #0CCF91 91%, #09BA5E 100%);
/* Add "Highlight" Texture to the Animation */ /* 添加动画纹理 */
background-image: -webkit-gradient(linear, left top, right top, color-stop(1%,rgba(0,0,0,.3)), color-stop(23%,rgba(0,0,0,.1)), color-stop(40%,rgba(255,231,87,.1)), color-stop(61%,rgba(255,231,87,.2)), color-stop(70%,rgba(255,231,87,.1)), color-stop(80%,rgba(0,0,0,.1)), color-stop(100%,rgba(0,0,0,.25))); background-image: -webkit-gradient(linear, left top, right top, color-stop(1%,rgba(0,0,0,.3)), color-stop(23%,rgba(0,0,0,.1)), color-stop(40%,rgba(255,231,87,.1)), color-stop(61%,rgba(255,231,87,.2)), color-stop(70%,rgba(255,231,87,.1)), color-stop(80%,rgba(0,0,0,.1)), color-stop(100%,rgba(0,0,0,.25)));
/* Starting Color */ /* 起始颜色 */
background-color: #39f; background-color: #39f;
/* Just do something for IE-suck */ /* IE滤镜效果 */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00BA1B', endColorstr='#00BA1B',GradientType=1 ); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00BA1B', endColorstr='#00BA1B',GradientType=1 );
} }
/* Non-keyframe fallback animation */ /* 非关键帧动画回退 */
.border.end, .border.end,
.rain.end{ .rain.end {
-moz-transition-property: background-position; -moz-transition-property: background-position; /* Firefox过渡属性 */
-moz-transition-duration: 30s; -moz-transition-duration: 30s; /* Firefox过渡持续时间 */
-moz-transition-timing-function: linear; -moz-transition-timing-function: linear; /* Firefox过渡时间函数 */
-webkit-transition-property: background-position; -webkit-transition-property: background-position; /* Webkit过渡属性 */
-webkit-transition-duration: 30s; -webkit-transition-duration: 30s; /* Webkit过渡持续时间 */
-webkit-transition-timing-function: linear; -webkit-transition-timing-function: linear; /* Webkit过渡时间函数 */
-o-transition-property: background-position; -o-transition-property: background-position; /* Opera过渡属性 */
-o-transition-duration: 30s; -o-transition-duration: 30s; /* Opera过渡持续时间 */
-o-transition-timing-function: linear; -o-transition-timing-function: linear; /* Opera过渡时间函数 */
transition-property: background-position; transition-property: background-position; /* 标准过渡属性 */
transition-duration: 30s; transition-duration: 30s; /* 标准过渡持续时间 */
transition-timing-function: linear; transition-timing-function: linear; /* 标准过渡时间函数 */
background-position: -5400px 0, -4600px 0, -3800px 0, -3000px 0; background-position: -5400px 0, -4800px 0, -4200px 0, -3600px 0; /* 设置背景位置 */
} }
/* Keyfram-licious animation */ /* 关键帧动画 */
@-webkit-keyframes colors { @-webkit-keyframes colors {
0% {background-color: pink;} 0% {background: pink;} /* 开始时的颜色 */
15% {background-color: hotpink;} 15% {background: hotpink;} /* 15%时的颜色 */
30% {background-color: rosybrown;} 30% {background: rosybrown;} /* 30%时的颜色 */
45% {background-color: steelblue;} 45% {background: steelblue;} /* 45%时的颜色 */
60% {background-color: black;} 60% {background: black;} /* 60%时的颜色 */
75% {background-color: #c9c0d3;} 75% {background: #c9c0d3;} /* 75%时的颜色 */
90% {background-color: darkgreen;} 90% {background: darkgreen;} /* 90%时的颜色 */
100% {background-color: orange;} 100% {background: orange;} /* 结束时的颜色 */
} }
.border,.rain{
-webkit-animation-direction: normal; .border,
-webkit-animation-duration: 20s; .rain {
-webkit-animation-iteration-count: infinite; -webkit-animation-direction: normal; /* Webkit动画方向 */
-webkit-animation-name: colors; -webkit-animation-duration: 20s; /* Webkit动画持续时间 */
-webkit-animation-timing-function: ease; -webkit-animation-iteration-count: infinite; /* Webkit动画迭代次数 */
-webkit-animation-timing-function: ease; /* Webkit动画时间函数 */
-webkit-animation-name: colors; /* Webkit动画名称 */
} }
/* In-Active State Style */ /* 无焦点状态样式 */
.border.unfocus{ .border.unfocus {
background: #333 !important; background: #333 !important; /* 强制背景颜色 */
-moz-box-shadow: 0px 0px 15px rgba(255,255,255,.2); -moz-box-shadow: 0px 0px 15px rgba(255,255,255,.2) inset; /* Firefox阴影效果 */
-webkit-box-shadow: 0px 0px 15px rgba(255,255,255,.2); -webkit-box-shadow: 0px 0px 15px rgba(255,255,255,.2) inset; /* Webkit阴影效果 */
box-shadow: 0px 0px 15px rgba(255,255,255,.2); box-shadow: 0px 0px 15px rgba(255,255,255,.2) inset; /* 标准阴影效果 */
-webkit-animation-name: none; -webkit-animation-name: none; /* Webkit无动画 */
} }
.rain.unfocus{
background: #000 !important; .rain.unfocus {
-webkit-animation-name: none; background: #000 !important; /* 强制背景颜色 */
-webkit-animation-name: none; /* Webkit无动画 */
} }
/* Regular Form Styles */ /* 表单样式 */
form{ form {
background: darkred; background: darkred; /* 设置背景颜色为深红色 */
-moz-border-radius: 5px; -moz-border-radius: 5px; /* Firefox圆角效果 */
-webkit-border-radius: 5px; -webkit-border-radius: 5px; /* Webkit圆角效果 */
border-radius: 5px; border-radius: 5px; /* 标准圆角效果 */
height: 100%; height: 100%; /* 设置高度为父容器的100% */
width: 335%; width: 335%; /* 设置宽度为父容器的335% */
background: -moz-radial-gradient(50% 46% 90deg,circle closest-corner, white, lightblue); background: -moz-radial-gradient(center 46% 90deg, closest-corner, white, lightblue); /* Firefox径向渐变背景 */
background: -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 150, from(lightcyan), to(lightblue)); background: -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 150, from(lightcyan), to(lightblue));/* Webkit径向渐变背景 */
} }
form label{
display: block; form label {
padding: 10px 10px 5px 15px; display: block; /* 块级显示 */
font-size: 20px; padding: 10px 15px 10px 15px; /* 设置内边距 */
color: hotpink; font-size: 20px; /* 设置字体大小 */
color: hotpink; /* 设置字体颜色 */
} }
form textarea{ form input {
display: block; display: block; /* 块级显示 */
margin: 5px 10px 10px 15px; margin: 5px 10px 10px 15px; /* 设置外边距 */
width: 85%; width: 85%; /* 设置宽度为父容器的85% */
background: #f0f8ff; background: #f0f8ff; /* 设置背景颜色 */
-moz-box-shadow: 0px 0px 4px grey inset; -moz-box-shadow: 0px 0px 4px grey inset; /* Firefox阴影效果 */
-webkit-box-shadow: 0px 0px 4px grey inset; -webkit-box-shadow: 0px 0px 4px grey inset; /* Webkit阴影效果 */
box-shadow: 0px 0px 4px grey inset; box-shadow: 0px 0px 4px grey inset; /* 标准阴影效果 */
outline: 1px solid black; outline: 1px solid black; /* 设置轮廓线 */
border: 1px solid grey; border: 1px solid grey; /* 设置边框 */
padding: 5px; padding: 5px; /* 设置内边距 */
color: black; color: black; /* 设置字体颜色 */
font-size: 16px; font-size: 16px; /* 设置字体大小 */
} }
form textarea:focus{
outline: 2px solid white; form input:focus {
color: #c0c0c0; outline: 2px solid white; /* 设置聚焦时的轮廓线 */
background-color: white; color: #c0c0c0; /* 设置聚焦时的字体颜色 */
background-color: white; /* 设置聚焦时的背景颜色 */
} }

153
WebContent/reader/01main.jsp
Unescape View File

@ -1,91 +1,94 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html> <html>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<title></title> <title></title>
<!-- Bootstrap --> <!-- 引入Bootstrap CSS -->
<link href="../css/bootstrap.min.css" rel="stylesheet"> <link href="../css/bootstrap.min.css" rel="stylesheet">
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) --> <!-- 引入jQuery（Bootstrap的JavaScript插件依赖于jQuery） -->
<script src="../js/jquery.min.js"></script> <script src="../js/jquery.min.js"></script>
<script src="../js/bootstrap.min.js"></script> <!-- 引入Bootstrap JavaScript -->
<style> <script src="../js/bootstrap.min.js"></script>
.showCarousel .carousel-inner > .item > img {
display: block; <style>
width:100%; /* 轮播图图片样式 */
height:620px; .showCarousel .carousel-inner > .item > img {
} display: block;
.showCarousel{ width:100%;
margin-top:2%; height:620px;
} }
font{ /* 轮播图顶部间距 */
font-size:40px; .showCarousel{
color:black; margin-top:2%;
font-family:YouYuan; }
font-weight:900; /* 字体样式 */
} font{
.carousel-caption{ font-size:40px;
margin-bottom:10%; color:black;
} font-family:YouYuan;
</style> font-weight:900;
}
/* 轮播图文字描述底部间距 */
.carousel-caption{
margin-bottom:10%;
}
</style>
</head> </head>
<body> <body>
<% <%
if(session.getAttribute("reader")!=null && session.getAttribute("reader_first")!=null &&session.getAttribute("reader_first").equals("1")){ // 检查会话属性 'reader' 和 'reader_first' 是否不为空且 'reader_first' 等于 "1"
session.setAttribute("reader_first", "2"); if(session.getAttribute("reader") != null && session.getAttribute("reader_first") != null && session.getAttribute("reader_first").equals("1")){
//session.setAttribute("reader", session.getAttribute("reader")); // 将 'reader_first' 设置为 "2"，表示用户已经访问过
session.setAttribute("reader_first", "2");
// 可选地，可以在会话中保留 reader 属性
// session.setAttribute("reader", session.getAttribute("reader"));
}
%> %>
<script>window.parent.location.href = "./04readerFrame.jsp";</script>
<%
}
%>
<!-- 轮播组件 -->
<div id="carousel-example-generic" class="carousel slide showCarousel" data-ride="carousel" data-interval="2000" style="width:96%;margin-left:2%;"> <div id="carousel-example-generic" class="carousel slide showCarousel" data-ride="carousel" data-interval="2000" style="width:96%;margin-left:2%;">
<!-- Indicators --> <!-- 指示器 -->
<ol class="carousel-indicators"> <ol class="carousel-indicators">
<li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li> <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
<li data-target="#carousel-example-generic" data-slide-to="1"></li> <li data-target="#carousel-example-generic" data-slide-to="1"></li>
<li data-target="#carousel-example-generic" data-slide-to="2"></li> <li data-target="#carousel-example-generic" data-slide-to="2"></li>
</ol> </ol>
<!-- Wrapper for slides --> <!-- 轮播内容 -->
<div class="carousel-inner" role="listbox"> <div class="carousel-inner" role="listbox">
<div class="item active"> <div class="item active">
<img src="../public/image/1.jpg" alt="..."> <img src="path/to/image1.jpg" alt="..."> <!-- 在这里添加你的图片路径 -->
<div class="carousel-caption"> <div class="carousel-caption">
<font style="color:white;">唯有知识永不负你!</font> <font style="color:white;">唯有知识永不负你!</font>
</div> </div>
</div> </div>
<div class="item"> <div class="item">
<img src="../public/image/2.jpg" alt="..."> <img src="path/to/image2.jpg" alt="..."> <!-- 在这里添加你的图片路径 -->
<div class="carousel-caption"> <div class="carousel-caption">
<font style="color:white;">学海无涯，书韵悠扬</font> <font style="color:white;">学海无涯，书韵悠扬</font>
</div> </div>
</div> </div>
<div class="item"> <div class="item">
<img src="../public/image/3.jpg" alt="..."> <img src="path/to/image3.jpg" alt="..."> <!-- 在这里添加你的图片路径 -->
<div class="carousel-caption"> <div class="carousel-caption">
<font style="color:white;">图一份神闲气静，书几笔悦目赏心</font> <font style="color:white;">图一份神闲气静，书几笔悦目赏心</font>
</div> </div>
</div>
</div> </div>
</div>
<!-- Controls --> <!-- 控制按钮 -->
<a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev"> <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span> <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span> <span class="sr-only">Previous</span>
</a> </a>
<a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next"> <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span> <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
<span class="sr-only">Next</span> <span class="sr-only">Next</span>
</a> </a>
</div> </div>
</body> </body>
</html> </html>

101
WebContent/reader/02readerNav.jsp
Unescape View File

@ -1,61 +1,64 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html> <html>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<title></title> <title></title>
<!-- Bootstrap --> <!-- 引入Bootstrap的CSS文件 -->
<link href="../css/bootstrap.min.css" rel="stylesheet"> <link href="../css/bootstrap.min.css" rel="stylesheet">
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) --> <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
<script src="../js/jquery.min.js"></script>
<script src="../js/bootstrap.min.js"></script>
<style>
</style> <style>
</style>
</head> </head>
<body> <body>
<nav class="navbar navbar-inverse" role="navigation"> <!-- 导航栏 -->
<div class="container-fluid"> <nav class="navbar navbar-inverse" role="navigation">
<!-- Brand and toggle get grouped for better mobile display --> <div class="container-fluid">
<div class="navbar-header"> <!-- Brand and toggle get grouped for better mobile display -->
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false"> <div class="navbar-header">
<span class="sr-only">Toggle navigation</span> <!-- 折叠按钮，用于在小屏幕设备上显示菜单 -->
<span class="icon-bar"></span> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="icon-bar"></span> <span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span> <span class="icon-bar"></span>
</button> <span class="icon-bar"></span>
<a class="navbar-brand" href="#">欢迎登陆图书管理系统</a> <span class="icon-bar"></span>
</div> </button>
<!-- 网站标题 -->
<a class="navbar-brand" href="#">欢迎登陆图书管理系统</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<!-- 左侧导航链接 -->
<ul class="nav navbar-nav">
<li><p style="margin-top:25%;color:grey;">借阅者页面<span class="sr-only">(current)</span></p></li>
</ul>
<!-- Collect the nav links, forms, and other content for toggling --> <!-- 右侧导航链接 -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> <ul class="nav navbar-nav navbar-right">
<ul class="nav navbar-nav"> <li><a href=";">
<li><p style="margin-top:25%;color:grey;">借阅者页面<span class="sr-only">(current)</span></p></li> <!-- 如果session中没有reader属性，则不显示任何内容；否则显示reader的值 -->
</ul> <%if(session.getAttribute("reader")==null){
// 空操作
<ul class="nav navbar-nav navbar-right">
<li><a href="javascript:;">
<%if(session.getAttribute("reader")==null){
} else{%> } else{%>
<%=session.getAttribute("reader") %> <%=session.getAttribute("reader") %>
<%} %> <%} %>
</a></li> </a></li>
<%if(session.getAttribute("reader") !=null) {%> <!-- 如果session中有reader属性，则显示退出链接；否则显示登录链接 -->
<li><a href="./exit" target="_parent">退出</a></li> <%if(session.getAttribute("reader") !=null) {%>
<%}else{%> <li><a href="./exit" target="_parent">退出</a></li>
<li><a href="04readerFrame.jsp" target="_parent" onClick="">登录</a></li> <%}else{%>
<%} <li><a href="04readerFrame.jsp" target="_parent" onClick="">登录</a></li>
%> <%}
%>
</ul> </ul>
</div>
</div> </div>
</nav> </div>
</nav>
</body> </body>
</html> </html>

102
WebContent/reader/03readerNavLeft.jsp
Unescape View File

@ -1,54 +1,68 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html> <html>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<title></title> <title></title>
<!-- Bootstrap --> <!-- 引入Bootstrap样式表 -->
<link href="../css/bootstrap.min.css" rel="stylesheet"> <link href="../css/bootstrap.min.css" rel="stylesheet">
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) --> <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
<script src="../js/jquery.min.js"></script> <!-- 这里没有实际引入jQuery，但通常需要引入 -->
<script src="../js/bootstrap.min.js"></script> <style>
<style> /* 自定义侧边栏菜单项的悬停效果 */
.sidebar li a:hover{ .sidebar li a:hover{
background:#337ab7; background:#337ab7; /* 背景颜色设置为蓝色 */
color:white; color:white; /* 文字颜色设置为白色 */
} }
.faq-tabbable li a:focus{ /* 自定义侧边栏菜单项获得焦点时的效果 */
background:skyblue; .faq-tabbable li a:focus{
color:white; background:skyblue; /* 背景颜色设置为天蓝色 */
} color:white; /* 文字颜色设置为白色 */
</style> }
</style>
</head> </head>
<body> <body>
<div style="text-align:center;width:100%;height:100%;font-size：20px;"> <div style="text-align:center;width:100%;height:100%;font-size：20px;">
<ul class="nav nav-pills nav-stacked nav-inverse sidebar faq-tabbable"> <!-- 创建一个居中的div容器，宽度和高度均为100%，字体大小为20px -->
<ul class="nav nav-pills nav-stacked nav-inverse sidebar faq-tabbable">
<!-- 创建一个无序列表，用于显示侧边栏菜单项 -->
<% if(session.getAttribute("reader")!=null){%> <% if(session.getAttribute("reader")!=null){%>
<li role="presentation"><a href="01main.jsp" target="view_frame"><span class="glyphicon glyphicon-picture" aria-hidden="true">&nbsp;首页</span></a></li> <!-- 如果 session 中存在 reader 属性，则显示以下菜单项 -->
<li role="presentation"><a href="05book.jsp" target="view_frame"><span class="glyphicon glyphicon-search" aria-hidden="true">&nbsp;图书查询</span></a></li> <li role="presentation"><a href="01main.jsp" target="view_frame"><span class="glyphicon glyphicon-picture" aria-hidden="true">&nbsp;首页</span></a></li>
<li role="presentation"><a href="12rules.jsp" target="view_frame"><span class="glyphicon glyphicon-bell" aria-hidden="true">&nbsp;读者规则</span></a></li> <!-- 菜单项：首页 -->
<li role="presentation"><a href="07announcement.jsp" target="view_frame"><span class="glyphicon glyphicon-bullhorn" aria-hidden="true">&nbsp;查看公告</span></a></li> <li role="presentation"><a href="05book.jsp" target="view_frame"><span class="glyphicon glyphicon-search" aria-hidden="true">&nbsp;图书查询</span></a></li>
<li role="presentation"><a href="index.jsp" target="view_frame"><span class="glyphicon glyphicon-user" aria-hidden="true">&nbsp;个人信息</span></a></li> <!-- 菜单项：图书查询 -->
<li role="presentation"><a href="06borrow.jsp" target="view_frame"><span class="glyphicon glyphicon-book" aria-hidden="true">&nbsp;借阅信息</span></a></li> <li role="presentation"><a href="12rules.jsp" target="view_frame"><span class="glyphicon glyphicon-bell" aria-hidden="true">&nbsp;读者规则</span></a></li>
<li role="presentation"><a href="08illegalInfo.jsp" target="view_frame"><span class="glyphicon glyphicon-remove" aria-hidden="true">&nbsp;违章信息</span></a></li> <!-- 菜单项：读者规则 -->
<li role="presentation"><a href="13message.jsp" target="view_frame"><span class="glyphicon glyphicon-pencil" aria-hidden="true">&nbsp;读者留言</span></a></li> <li role="presentation"><a href="07announcement.jsp" target="view_frame"><span class="glyphicon glyphicon-bullhorn" aria-hidden="true">&nbsp;查看公告</span></a></li>
<% <!-- 菜单项：查看公告 -->
}else{ <li role="presentation"><a href="index.jsp" target="view_frame"><span class="glyphicon glyphicon-user" aria-hidden="true">&nbsp;个人信息</span></a></li>
%> <!-- 菜单项：个人信息 -->
<li role="presentation"><a href="01main.jsp" target="view_frame"><span class="glyphicon glyphicon-picture" aria-hidden="true">&nbsp;首页</span></a></li> <li role="presentation"><a href="06borrow.jsp" target="view_frame"><span class="glyphicon glyphicon-book" aria-hidden="true">&nbsp;借阅信息</span></a></li>
<li role="presentation"><a href="05book.jsp" target="view_frame"><span class="glyphicon glyphicon-search" aria-hidden="true">&nbsp;图书查询</span></a></li> <!-- 菜单项：借阅信息 -->
<li role="presentation"><a href="12rules.jsp" target="view_frame"><span class="glyphicon glyphicon-bell" aria-hidden="true">&nbsp;读者规则</span></a></li> <li role="presentation"><a href="08illegalInfo.jsp" target="view_frame"><span class="glyphicon glyphicon-remove" aria-hidden="true">&nbsp;违章信息</span></a></li>
<li role="presentation"><a href="07announcement.jsp" target="view_frame"><span class="glyphicon glyphicon-bullhorn" aria-hidden="true">&nbsp;查看公告</span></a></li> <!-- 菜单项：违章信息 -->
<li role="presentation"><a href="15checkMessage.jsp" target="view_frame"><span class="glyphicon glyphicon-envelope" aria-hidden="true">&nbsp;查看留言</span></a></li> <li role="presentation"><a href="13message.jsp" target="view_frame"><span class="glyphicon glyphicon-pencil" aria-hidden="true">&nbsp;读者留言</span></a></li>
<% <!-- 菜单项：读者留言 -->
} <% } else { %>
%> <!-- 如果 session 中不存在 reader 属性，则显示以下菜单项 -->
</ul> <li role="presentation"><a href="01main.jsp" target="view_frame"><span class="glyphicon glyphicon-picture" aria-hidden="true">&nbsp;首页</span></a></li>
</div> <!-- 菜单项：首页 -->
<li role="presentation"><a href="05book.jsp" target="view_frame"><span class="glyphicon glyphicon-search" aria-hidden="true">&nbsp;图书查询</span></a></li>
<!-- 菜单项：图书查询 -->
<li role="presentation"><a href="12rules.jsp" target="view_frame"><span class="glyphicon glyphicon-bell" aria-hidden="true">&nbsp;读者规则</span></a></li>
<!-- 菜单项：读者规则 -->
<li role="presentation"><a href="07announcement.jsp" target="view_frame"><span class="glyphicon glyphicon-bullhorn" aria-hidden="true">&nbsp;查看公告</span></a></li>
<!-- 菜单项：查看公告 -->
<li role="presentation"><a href="15checkMessage.jsp" target="view_frame"><span class="glyphicon glyphicon-envelope" aria-hidden="true">&nbsp;查看留言</span></a></li>
<!-- 菜单项：查看留言 -->
<% } %>
</ul>
</div>
</body> </body>
</html> </html>

53
WebContent/reader/04readerFrame.jsp
Unescape View File

@ -3,33 +3,50 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html> <html>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <!-- 设置页面字符编码为UTF-8 -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>借阅者页面</title>
<!-- Bootstrap --> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<link href="../css/bootstrap.min.css" rel="stylesheet"> <!-- 确保页面在IE浏览器中以最新的渲染模式显示 -->
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
<script src="../js/jquery.min.js"></script> <meta name="viewport" content="width=device-width, initial-scale=1">
<script src="../js/bootstrap.min.js"></script> <!-- 使页面在移动设备上具有响应式设计 -->
<title>借阅者页面</title>
<!-- 设置页面标题为“借阅者页面” -->
<!-- 引入Bootstrap样式表 -->
<link href="../css/bootstrap.min.css" rel="stylesheet">
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
<!-- 这里没有实际引入jQuery库，需要补充 -->
</head> </head>
<frameset rows="7%,*" frameborder="no" border="0">
<frame src="02readerNav.jsp" scrolling="no"> <!-- 使用frameset布局，将页面分为上下两个部分 -->
<frameset rows="7%,*" frameborder="no" border="0">
<!-- 第一部分占整个页面高度的7%，不显示滚动条 -->
<frame scrolling="no">
<!-- 这里可以放置导航栏或其他固定内容 -->
</frame>
<frameset cols="14%,*" frameborder="no" border="0"> <!-- 第二部分占整个页面剩余的高度，分为左右两个部分 -->
<frame src="03readerNavLeft.jsp"> <frameset cols="14%,*" frameborder="no" border="0">
<!-- 左侧部分占整个页面宽度的14%，右侧部分占剩余宽度 -->
<frame >
<!-- 左侧框架，可以放置菜单或导航 -->
</frame>
<% <%
if(session.getAttribute("reader") == null){ if(session.getAttribute("reader") == null){
%> %>
<frame src="06borrow.jsp" name="view_frame"> <!-- 如果session中没有reader属性，则显示一个空的view_frame框架 -->
<frame name="view_frame">
<%
}else{
%>
<!-- 如果session中有reader属性，则显示一个空的view_frame框架 -->
<frame name="view_frame">
<% <%
}else{
%>
<frame src="01main.jsp" name="view_frame">
<%
} }
%> %>
</frameset> </frameset>

244
WebContent/reader/05book.jsp
Unescape View File

@ -1,145 +1,133 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html> <html>
<head> <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title> <title>Insert title here</title> <!-- 页面标题 -->
<meta charset="utf-8"> <meta charset="utf-8"> <!-- 设置文档的字符编码为UTF-8 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- 设置视口宽度和初始缩放比例 -->
<title></title> <title>图书管理系统</title> <!-- 页面标题 -->
<!-- Bootstrap CSS -->
<!-- Bootstrap --> <link href="../css/bootstrap.min.css" rel="stylesheet"> <!-- 引入Bootstrap样式表 -->
<link href="../css/bootstrap.min.css" rel="stylesheet"> <link href="../css/bootstrap-table.css" rel="stylesheet"> <!-- 引入Bootstrap表格样式表 -->
<link href="../css/bootstrap-table.css" rel="stylesheet"> <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) --> <link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <!-- 引入LayUI样式表 -->
<script src="../js/jquery.min.js"></script>
<script src="../js/bootstrap-table.js"></script>
<script src="../bootstrap-table-zh-CN.js"></script>
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all">
<style> <style>
.layui-table,.layui-table-view{ .layui-table,.layui-table-view{
margin: 0 0px; margin: 0 0px; /* 设置表格的外边距 */
} }
.layui-form-select dl dd.layui-this { background-color: #01AAED; } .layui-form-select dl dd.layui-this { background-color: #01AAED; } /* 设置下拉选择框选中项的背景颜色 */
</style> </style>
</head> </head>
<body> <body>
<jsp:useBean id="msg" scope="session" class="javabean.JDBCBean"></jsp:useBean> <!-- 使用 JSP Bean -->
<script src="../public/layui/layui.js" charset="utf-8"></script> <jsp:useBean id="msg" scope="session" class="javabean.JDBCBean"></jsp:useBean> <!-- 声明一个JSP Bean，ID为msg，作用域为session，类为javabean.JDBCBean -->
<!-- 表单 -->
<table class="layui-hide" id="cardTable" lay-filter="formFilter"></table>
<!-- 头部工具栏 -->
<script type="text/html" id="headBar">
条件搜索：
<div class="layui-inline">
<select id="condition" name="condition" lay-verify="required">
<option value=""></option>
<option value="id">图书编号</option>
<option value="name">图书名称</option>
<option value="author">作者</option>
<option value="position">位置</option>
<option value="description">描述</option>
</select>
</div>
<div class="layui-inline">
<input class="layui-input" id="conditionValue" name="conditionValue" id="demoReload" autocomplete="off">
</div>
<button class="layui-btn layui-bg-blue" name="condition" data-type="reload" lay-event="search">搜索</button>
</script>
<!-- 表单 -->
<table class="layui-hide" id="cardTable" lay-filter="formFilter"></table> <!-- 定义一个隐藏的表格，ID为cardTable，用于LayUI的过滤功能 -->
<script> <!-- 头部工具栏 -->
layui.use(['table','jquery'], function(){ 条件搜索：
$ = layui.jquery; <div class="layui-inline">
var table = layui.table; <select id="condition" name="condition" lay-verify="required"> <!-- 创建一个下拉选择框，ID为condition，名称为condition，验证规则为必填 -->
// 进行渲染 <option value=""></option> <!-- 空选项 -->
var tableIns = table.render({ <option value="id">图书编号</option> <!-- 图书编号选项 -->
elem: '#cardTable' <option value="name">图书名称</option> <!-- 图书名称选项 -->
,url:'./book' <option value="author">作者</option> <!-- 作者选项 -->
,toolbar: '#headBar' <option value="position">位置</option> <!-- 位置选项 -->
,cols: [[ <option value="description">描述</option> <!-- 描述选项 -->
{field:'id', width:120, title: '图书编号', sort: true} </select>
,{field:'name', width:130, title: '图书名称', sort: true} </div>
,{field:'author', width:100, title: '作者', sort: true} <div class="layui-inline">
,{field:'library_id', title: '图书馆', width: 100, sort: true} <input class="layui-input" id="conditionValue" name="conditionValue" id="demoReload" autocomplete="off"> <!-- 创建一个输入框，类为layui-input，ID为conditionValue，名称为conditionValue，自动完成关闭 -->
,{field:'sort_id', width:100, title: '分类', sort: true,} </div>
,{field:'position', width:100, title: '位置', sort: true} <button class="layui-btn layui-bg-blue" name="condition" data-type="reload" lay-event="search">搜索</button> <!-- 创建一个按钮，类为layui-btn和layui-bg-blue，名称为condition，数据类型为reload，事件为search，显示文本为搜索 -->
,{field:'status', width:100, title: '状态', sort: true,templet: function (item) {
var btns="";
if(item.status=='0'){
btns += '<span class=""style="color:orange">已借出</span>';
}else if(item.status=='1'){
btns += '<span class=""style="color:green">未借出</span>';
}
return btns;
}
}
,{field:'description', minWidth:80, title: '描述'}
]] <!-- 引入 layui 和 jQuery -->
,page: true <script src="../public/layui/layui.js"></script> <!-- 引入LayUI脚本文件 -->
,page: {theme: '#2F88FF'}, <script src="../public/jquery/jquery.min.js"></script> <!-- 引入jQuery脚本文件 -->
}); <script>
layui.use(['table','jquery'], function(){ // 使用LayUI的table和jQuery模块
// 头部工具栏事件 $ = layui.jquery; // 将LayUI的jQuery赋值给$变量
table.on('toolbar(formFilter)', function(obj){ var table = layui.table; // 获取LayUI的table对象
var checkStatus = table.checkStatus(obj.config.id); // 进行渲染
switch(obj.event){ var tableIns = table.render({
// 条件查找图书证 elem: '#cardTable', // 绑定元素，即表格的ID
case 'search': url: './book', // 数据接口地址
var conditionValue = $('#conditionValue'); toolbar: '#headBar', // 头部工具栏的ID
var condition = $('#condition'); cols: [[ // 表头
{field:'id', width:120, title: '图书编号', sort: true}, // 图书编号列，宽度120，标题为图书编号，可排序
// 进行搜索，重新渲染 {field:'name', width:130, title: '图书名称', sort: true}, // 图书名称列，宽度130，标题为图书名称，可排序
tableIns.reload({ {field:'author', width:100, title: '作者', sort: true}, // 作者列，宽度100，标题为作者，可排序
where: { //设定异步数据接口的额外参数，任意设 {field:'library_id', title: '图书馆', width: 100, sort: true}, // 图书馆列，标题为图书馆，宽度100，可排序
"condition": condition.val(), {field:'sort_id', width:100, title: '分类', sort: true}, // 分类列，宽度100，标题为分类，可排序
"conditionValue": conditionValue.val() {field:'position', width:100, title: '位置', sort: true}, // 位置列，宽度100，标题为位置，可排序
} {field:'status', width:100, title: '状态', sort: true, templet: function (item) { // 状态列，宽度100，标题为状态，可排序，自定义模板函数
,page: { var btns = ""; // 初始化按钮字符串
curr: 1 //重新从第 1 页开始 if(item.status == '0'){ // 如果状态为0
} btns += '<span class="" style="color:orange">已借出</span>'; // 添加已借出的红色文字
}); } else if(item.status == '1'){ // 如果状态为1
break; btns += '<span class="" style="color:green">未借出</span>'; // 添加未借出的绿色文字
}
case 'add': return btns; // 返回按钮字符串
var addCardLayer = layer.open({ }},
type: 2, {field:'description', minWidth:80, title: '描述'}, // 描述列，最小宽度80，标题为描述
title: '添加借书证', ]],
area: ['800px', '500px'], page: true // 开启分页
maxmin: true, });
shadeClose: true, // 头部工具栏事件
content: 'cardadd.jsp', table.on('toolbar(formFilter)', function(obj){ // 监听头部工具栏事件
}); var checkStatus = table.checkStatus(obj.config.id); // 获取选中行的状态
//layer.full(addCardLayer); switch(obj.event){ // 根据事件类型执行不同的操作
}; case 'condition': // 如果事件类型是condition
var condition = $('#condition'); // 获取条件选择框
var conditionValue = $('#conditionValue'); // 获取条件值输入框
// 条件查找图书证
var value = conditionValue.val(); // 获取输入框的值
conditionValue.val(''); // 清空输入框的值
tableIns.reload({ // 重新加载表格数据
where: { // 查询参数
condition: condition.val(), // 条件字段
value: value // 条件值
},
page: { // 分页参数
curr: 1 // 从第一页开始重新加载
}
});
break;
case 'add': // 如果事件类型是add
var addCardLayer = layer.open({ // 打开新增图书证的弹出层
type: 2, // 弹出层类型为iframe
title: '添加借书证', // 弹出层标题
area: ['800px', '500px'], // 弹出层大小
maxmin: true, // 允许最大化和最小化
shadeClose: true, // 点击遮罩层是否允许关闭
content: 'addBook.jsp', // 弹出层内容页面路径
});
break;
}
}); });
// 侧边工具栏事件
// 侧边工具栏事件 table.on(('tool(formFilter)'), function(obj){ // 监听侧边工具栏事件
table.on(('tool(formFilter)'), function(obj){ var data = obj.data; // 获取当前行的数据
var data = obj.data; var layEvent = obj.event; // 获取事件类型
var layEvent = obj.event; var tr = obj.tr; // 获取当前行的DOM对象
var tr = obj.tr; switch(layEvent){ // 根据事件类型执行不同的操作
switch(obj.event){ case 'edit': // 如果事件类型是edit
case 'edit': layer.open({ // 打开更改信息的弹出层
layer.open({ type: 2, // 弹出层类型为iframe
type: 2, title: '更改信息', // 弹出层标题
title: '更改信息', area: ['800px', '600px'], // 弹出层大小
area: ['800px', '600px'], maxmin: true, // 允许最大化和最小化
maxmin: true, shadeClose: true, // 点击遮罩层是否允许关闭
shadeClose: true, content: '', // 这里需要填写实际的内容页面路径
content: '', });
}) break;
break; }
} })
})
}); });
</script> </script>
</body> </body>
</html> </html>

216
WebContent/reader/06borrow.jsp
Unescape View File

@ -1,130 +1,116 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!-- 定义文档类型为HTML 4.01 Transitional -->
<html> <html>
<head> <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <!-- 设置页面内容类型和字符编码 -->
<title>Insert title here</title> <title>Insert title here</title> <!-- 页面标题 -->
<link href="../css/bootstrap.min.css" rel="stylesheet"> <link href="../css/bootstrap.min.css" rel="stylesheet"> <!-- 引入Bootstrap CSS文件 -->
<link href="../css/bootstrap-table.css" rel="stylesheet"> <link href="../css/bootstrap-table.css" rel="stylesheet"> <!-- 引入Bootstrap Table CSS文件 -->
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) --> <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
<script src="../js/jquery.min.js"></script> <link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <!-- 引入Layui CSS文件 -->
<script src="../js/bootstrap-table.js"></script>
<script src="../bootstrap-table-zh-CN.js"></script>
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all">
<style> <style>
.layui-table,.layui-table-view{ .layui-table,.layui-table-view{
margin: 0 0px; margin: 0 0px; /* 设置表格的外边距为0 */
} }
</style> </style>
</head> </head>
<body> <body>
<script src="../public/layui/layui.js" charset="utf-8"></script> <!-- 表单 -->
<!-- 表单 --> <% if(session.getAttribute("reader")==null){%> <!-- 检查用户是否登录 -->
<% if(session.getAttribute("reader")==null){%> location.href = "../loginReader.html"; <!-- 如果未登录，重定向到登录页面 -->
<script> <% } %>
location.href = "../loginReader.html"; <table class="layui-hide" id="cardTable" lay-filter="formFilter"></table> <!-- 隐藏的表格元素，用于后续渲染 -->
</script>
<%
}
%>
<table class="layui-hide" id="cardTable" lay-filter="formFilter"></table>
<!-- 头部工具栏 -->
<script type="text/html" id="headBar">
条件搜索：
<div class="layui-inline">
<select id="condition" name="condition" lay-verify="required">
<option value=""></option>
<option value="book_id">图书编号</option>
<option value="borrow_date">借阅日期</option>
<option value="end_date">截止日期</option>
<option value="return_date">归还日期</option>
</select> <!-- 头部工具栏 -->
</div> 条件搜索：
<div class="layui-inline"> <div class="layui-inline">
<input class="layui-input" id="conditionValue" name="conditionValue" id="demoReload" autocomplete="off"> <select id="condition" name="condition" lay-verify="required"> <!-- 下拉选择框，用于选择查询条件 -->
</div> <option value=""></option>
<button class="layui-btn" name="condition" data-type="reload" lay-event="search">搜索</button> <option value="book_id">图书编号</option>
</script> <option value="borrow_date">借阅日期</option>
<option value="end_date">截止日期</option>
<option value="return_date">归还日期</option>
</select>
</div>
<div class="layui-inline">
<input class="layui-input" id="conditionValue" name="conditionValue" id="demoReload" autocomplete="off"> <!-- 输入框，用于输入查询条件值 -->
</div>
<button class="layui-btn" name="condition" data-type="reload" lay-event="search">搜索</button> <!-- 搜索按钮 -->
<script src="../js/jquery-3.2.1.min.js"></script> <!-- 引入jQuery库 -->
<script src="../js/bootstrap.min.js"></script> <!-- 引入Bootstrap JavaScript文件 -->
<script src="../js/bootstrap-table.min.js"></script> <!-- 引入Bootstrap Table JavaScript文件 -->
<script src="../public/layui/layui.js"></script> <!-- 引入Layui JavaScript文件 -->
<script>
layui.use(['table','jquery'], function(){ <!-- 使用Layui的table和jQuery模块 -->
$ = layui.jquery; <!-- 获取jQuery对象 -->
var table = layui.table; <!-- 获取table对象 -->
// 进行渲染
var tableIns = table.render({
elem: '#cardTable' <!-- 绑定表格元素 -->
,url:'./borrow' <!-- 数据接口地址 -->
,toolbar: '#headBar' <!-- 绑定工具栏元素 -->
,cols: [[
{field:'card_id', width:180, title: '借阅证号', sort: true}, <!-- 定义表格列 -->
{field:'book_id', width:130, title: '图书编号', sort: true},
{field:'borrow_date', width:250, title: '借阅日期', sort: true},
{field:'end_date', title: '截止日期', width: 250, sort: true},
{field:'return_date', width:250, title: '归还时间', sort: true}
]]
,page: true <!-- 启用分页 -->
});
<script> // 头部工具栏事件
layui.use(['table','jquery'], function(){ table.on('toolbar(formFilter)', function(obj){
$ = layui.jquery; var checkStatus = table.checkStatus(obj.config.id); <!-- 获取选中状态 -->
var table = layui.table; switch(obj.event){
// 进行渲染 case 'search': <!-- 处理搜索事件 -->
var tableIns = table.render({ var conditionValue = $('#conditionValue'); <!-- 获取条件值输入框 -->
elem: '#cardTable' var condition = $('#condition'); <!-- 获取条件选择框 -->
,url:'./borrow' // 进行搜索，重新渲染
,toolbar: '#headBar' tableIns.reload({
,cols: [[ where: { //设定异步数据接口的额外参数，任意设
{field:'card_id', width:180, title: '借阅证号', sort: true} "condition": condition.val(),
,{field:'book_id', width:130, title: '图书编号', sort: true} "conditionValue": conditionValue.val()
,{field:'borrow_date', width:250, title: '借阅日期', sort: true} }
,{field:'end_date', title: '截止日期', width: 250, sort: true} ,page: {
,{field:'return_date', width:250, title: '归还时间', sort: true} curr: 1 //重新从第 1 页开始
}
]] });
,page: true break;
}); case 'add': <!-- 处理添加事件 -->
var addCardLayer = layer.open({
// 头部工具栏事件 type: 2,
table.on('toolbar(formFilter)', function(obj){ title: '添加借书证',
var checkStatus = table.checkStatus(obj.config.id); area: ['800px', '500px'],
switch(obj.event){ maxmin: true,
// 条件查找借阅记录 shadeClose: true,
case 'search': content: 'cardadd.jsp',
var conditionValue = $('#conditionValue'); });
var condition = $('#condition'); //layer.full(addCardLayer);
};
// 进行搜索，重新渲染
tableIns.reload({
where: { //设定异步数据接口的额外参数，任意设
"condition": condition.val(),
"conditionValue": conditionValue.val()
}
,page: {
curr: 1 //重新从第 1 页开始
}
});
break;
case 'add':
var addCardLayer = layer.open({
type: 2,
title: '添加借书证',
area: ['800px', '500px'],
maxmin: true,
shadeClose: true,
content: 'cardadd.jsp',
});
//layer.full(addCardLayer);
};
}); });
// 侧边工具栏事件 // 侧边工具栏事件
table.on(('tool(formFilter)'), function(obj){ table.on(('tool(formFilter)'), function(obj){
var data = obj.data; var data = obj.data; <!-- 获取当前行的数据 -->
var layEvent = obj.event; var layEvent = obj.event; <!-- 获取触发的事件类型 -->
var tr = obj.tr; var tr = obj.tr; <!-- 获取当前行的DOM对象 -->
switch(obj.event){ switch(obj.event){
case 'edit': case 'edit': <!-- 处理编辑事件 -->
layer.open({ layer.open({
type: 2, type: 2,
title: '更改信息', title: '更改信息',
area: ['800px', '600px'], area: ['800px', '600px'],
maxmin: true, maxmin: true,
shadeClose: true, shadeClose: true,
content: '', content: '',
}) })
break; break;
} }
}) })
}); });
</script> </script>
</body> </body>
</html> </html>

75
WebContent/reader/07announcement.jsp
Unescape View File

@ -1,57 +1,58 @@
<%@ page import="java.sql.*" %> <%@ page import="java.sql.*" %> <!-- 导入Java SQL包，用于数据库操作 -->
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%> <!-- 设置页面语言为Java，内容类型为HTML，字符编码为UTF-8 -->
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!-- 定义文档类型为HTML 4.01 Transitional -->
<html> <html>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8"> <!-- 设置字符编码为UTF-8 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <!-- 设置IE浏览器的兼容模式 -->
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- 设置视口宽度和初始缩放比例 -->
<title></title> <title></title> <!-- 页面标题 -->
<!-- Bootstrap --> <!-- Bootstrap CSS文件 -->
<link href="../css/bootstrap.min.css" rel="stylesheet"> <link href="../css/bootstrap.min.css" rel="stylesheet">
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) --> <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
<script src="../js/jquery.min.js"></script>
<script src="../js/bootstrap.min.js"></script> <style>
<style> body{
body{ font-family:YouYuan; /* 设置页面字体为YouYuan */
font-family:YouYuan; }
} </style>
</style>
</head> </head>
<body> <body>
<div style="background: steelblue;height: 30px;;color:#fff;border-radius: 8px;width: 90%;margin:auto auto;"> <div style="background: steelblue;height: 30px;color:#fff;border-radius: 8px;width: 90%;margin:auto auto;">
<marquee style="font-size:20px;font-family:YouYuan;" behavior="scroll" direction="left" hspace="0.1%" vspace="0.1%" loop="-1" scrollamount="20" scrolldelay="100" onMouseOut="this.start()" onMouseOver="this.stop()"> <marquee style="font-size:20px;font-family:YouYuan;" behavior="scroll" direction="left" hspace="0.1%" vspace="0.1%" loop="-1" scrollamount="20" scrolldelay="100" "this.start()" "this.stop()">
❤图书馆公告栏，记得查收公告呀！❤ &#10084;图书馆公告栏，记得查收公告呀！&#10084; <!-- 滚动公告栏 -->
</marquee>  </marquee>
</div> </div>
<div class="a" align="center"> <div class="a" align="center">
<h2>近期公告</h2>
<jsp:useBean id="check" scope="session" class="javabean.JDBCBean"></jsp:useBean> <h2>近期公告</h2> <!-- 显示“近期公告”标题 -->
<%
<jsp:useBean id="check" scope="session" class="javabean.JDBCBean"></jsp:useBean> <!-- 使用JSP标签声明一个JavaBean对象，ID为check，作用域为session，类为javabean.JDBCBean -->
<!-- SQL查询语句，选择announcement表中的所有记录 -->
<!-- 执行SQL查询，并将结果存储在ResultSet对象rs中 -->
<%
String sql="select*from announcement"; String sql="select*from announcement";
ResultSet rs = check.executeQuery(sql); ResultSet rs = check.executeQuery(sql);
while (rs.next()) { while (rs.next()) {
%> %>
<div class="panel panel-info" style="margin-left:5%;width:80%;"> <div class="panel panel-info" style="margin-left:5%;width:80%;"> <!-- 创建一个Bootstrap面板，样式为信息面板，左边距为5%，宽度为80% -->
<div class="panel-heading" align="center"> <div class="panel-heading" align="center"> <!-- 面板头部，居中对齐 -->
<span><%=rs.getString("TITLE") %></span> <span><%=rs.getString("TITLE") %></span> <!-- 显示公告标题 -->
<span style="margin-right:1%;"><%=rs.getString("PUBLISH_DATE") %></span> <span style="margin-right:1%;"><%=rs.getString("PUBLISH_DATE") %></span> <!-- 显示公告发布日期 -->
</div> </div>
<div class="panel-body" > <div class="panel-body"> <!-- 面板主体部分 -->
<p style="word-wrap:break-word;"><%=rs.getString("DETAIL") %></p> <p style="word-wrap:break-word;"><%=rs.getString("DETAIL") %></p> <!-- 显示公告详情，自动换行 -->
</div> </div>
</div> </div>
<% <%
} }
%> %>
</div> </div>
</body> </body>
</html> </html>

240
WebContent/reader/08illegalInfo.jsp
Unescape View File

@ -4,136 +4,136 @@
<html> <html>
<head> <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title> <title>Insert title here</title> <!-- 设置网页标题 -->
<!-- Bootstrap --> <!-- Bootstrap -->
<link href="../css/bootstrap.min.css" rel="stylesheet"> <link href="../css/bootstrap.min.css" rel="stylesheet"> <!-- 引入Bootstrap CSS文件 -->
<link href="../css/bootstrap-table.css" rel="stylesheet"> <link href="../css/bootstrap-table.css" rel="stylesheet"> <!-- 引入Bootstrap Table CSS文件 -->
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) --> <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
<script src="../js/jquery.min.js"></script>
<script src="../js/bootstrap-table.js"></script>
<script src="../bootstrap-table-zh-CN.js"></script>
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <!-- 引入Layui CSS文件 -->
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <!-- 重复引入Layui CSS文件，可能是冗余代码 -->
<style> <style>
.layui-table,.layui-table-view{ .layui-table,.layui-table-view{
margin: 0 0px; margin: 0 0px; /* 设置表格的外边距为0 */
} }
.layui-form-select dl dd.layui-this { background-color: #FF5722; } .layui-form-select dl dd.layui-this { background-color: #FF5722; } /* 设置下拉选择框选中项的背景颜色 */
</style> </style>
</head> </head>
<body> <body>
<% <%
if(session.getAttribute("reader") == null){ if(session.getAttribute("reader") == null){ // 如果会话中的reader属性为空
%> %>
location.href="../loginReader.html"; // 重定向到登录页面
<%
}
%>
<!-- 表单 -->
<table class="layui-hide" id="cardTable" lay-filter="formFilter"></table> <!-- 定义一个隐藏的表格元素，用于后续渲染 -->
<!-- 头部工具栏 -->
条件搜索：
<div class="layui-inline">
<select id="condition" name="condition" lay-verify="required"> <!-- 创建一个下拉选择框，用于选择搜索条件 -->
<option value=""></option>
<option value="book_id">图书编号</option>
<option value="borrow_date">借阅日期</option>
<option value="end_date">截止日期</option>
<option value="return_date">归还日期</option>
<option value="illegal">违章信息</option>
<option value="manager_id">处理人</option>
</select>
</div>
<div class="layui-inline">
<input class="layui-input" id="conditionValue" name="conditionValue" id="demoReload" autocomplete="off"> <!-- 创建一个输入框，用于输入搜索条件值 -->
</div>
<button class="layui-btn layui-btn-danger" name="condition" data-type="reload" lay-event="search">搜索</button> <!-- 创建一个按钮，用于触发搜索操作 -->
<script> <script>
location.href="../loginReader.html"; layui.use(['table','jquery'], function(){ // 使用Layui的table和jQuery模块
</script> $ = layui.jquery; // 获取jQuery对象
<% var table = layui.table; // 获取table对象
} // 进行渲染
%> var tableIns = table.render({
<script src="../public/layui/layui.js" charset="utf-8"></script> elem: '#cardTable' // 指定渲染的表格元素ID
<!-- 表单 --> ,url:'./illegal' // 数据接口地址
<table class="layui-hide" id="cardTable" lay-filter="formFilter"></table> ,toolbar: '#headBar' // 指定工具栏模板的选择器或DOM元素
,cols: [[ // 定义表格列配置
<!-- 头部工具栏 --> {field:'card_id', width:180, title: '借阅证号', sort: true} // 借阅证号列配置
<script type="text/html" id="headBar"> ,{field:'book_id', minwidth:80, title: '图书编号', sort: true} // 图书编号列配置
条件搜索： ,{field:'borrow_date', width:250, title: '借阅日期', sort: true} // 借阅日期列配置
<div class="layui-inline"> ,{field:'end_date', title: '截止日期', width: 250, sort: true} // 截止日期列配置
<select id="condition" name="condition" lay-verify="required"> ,{field:'return_date', width:250, title: '归还时间', sort: true} // 归还时间列配置
<option value=""></option> ,{field:'illegal', width:180, title: '违章信息', sort: true,style:'color: red;'} // 违章信息列配置，文字颜色为红色
<option value="book_id">图书编号</option> ,{field:'manager_id', width:90, title: '处理人', sort: true} // 处理人列配置
<option value="borrow_date">借阅日期</option>
<option value="end_date">截止日期</option> ]]
<option value="return_date">归还日期</option> ,page: true // 开启分页功能
<option value="illegal">违章信息</option> ,page: {theme: '#FF5722'}, // 设置分页组件的主题颜色为橙色
<option value="manager_id">处理人</option> });
</select>
</div> // 头部工具栏事件
<div class="layui-inline"> table.on('toolbar(formFilter)', function(obj){ // 监听头部工具栏事件
<input class="layui-input" id="conditionValue" name="conditionValue" id="demoReload" autocomplete="off"> var checkStatus = table.checkStatus(obj.config.id); // 获取当前表格的选中状态
</div> switch(obj.event){ // 根据事件类型进行处理
<button class="layui-btn layui-btn-danger" name="condition" data-type="reload" lay-event="search">搜索</button> // 条件查找图书证
</script> case 'search': // 如果事件类型是搜索
var conditionValue = $('#conditionValue'); // 获取条件值输入框的jQuery对象
var condition = $('#condition'); // 获取条件选择框的jQuery对象
<script> // 进行搜索，重新渲染
layui.use(['table','jquery'], function(){ tableIns.reload({
$ = layui.jquery; where: { //设定异步数据接口的额外参数，任意设
var table = layui.table; "condition": condition.val(), // 设置查询条件字段名
// 进行渲染 "conditionValue": conditionValue.val() // 设置查询条件值
var tableIns = table.render({ },
elem: '#cardTable' page: {
,url:'./illegal' curr: 1 //重新从第 1 页开始
,toolbar: '#headBar' }
,cols: [[ });
{field:'card_id', width:180, title: '借阅证号', sort: true} break;
,{field:'book_id', minwidth:80, title: '图书编号', sort: true}
,{field:'borrow_date', width:250, title: '借阅日期', sort: true} case 'add': // 如果事件类型是添加
,{field:'end_date', title: '截止日期', width: 250, sort: true} var addCardLayer = layer.open({ // 打开一个新的弹出层
,{field:'return_date', width:250, title: '归还时间', sort: true} type: 2, // 弹出层类型为iframe层
,{field:'illegal', width:180, title: '违章信息', sort: true,style:'color: red;'} title: '添加借书证', // 弹出层标题
,{field:'manager_id', width:90, title: '处理人', sort: true} area: ['800px', '500px'], // 弹出层大小
maxmin: true, // 允许最大化和最小化
]] shadeClose: true, // 点击遮罩关闭弹出层
,page: true content: 'cardAdd.jsp', // 弹出层内容为cardAdd.jsp页面
,page: {theme: '#FF5722'}, });
}); //layer.full(addCardLayer); // 注释掉的代码，用于全屏显示弹出层
};
// 头部工具栏事件 });
table.on('toolbar(formFilter)', function(obj){
var checkStatus = table.checkStatus(obj.config.id); // 侧边工具栏事件
switch(obj.event){ table.on(('tool(formFilter)'), function(obj){ // 监听侧边工具栏事件
// 条件查找图书证 var data = obj.data; // 获取当前行的数据
case 'search': var layEvent = obj.event; // 获取事件类型
var conditionValue = $('#conditionValue'); var tr = obj.tr; // 获取当前行的DOM对象
var condition = $('#condition'); switch(layEvent){ // 根据事件类型进行处理
//更多操作按钮的事件处理可以在这里添加
// 进行搜索，重新渲染 case 'edit': // 如果事件类型是编辑
tableIns.reload({ layer.open({ // 打开一个新的弹出层
where: { //设定异步数据接口的额外参数，任意设 type: 2, // 弹出层类型为iframe层
"condition": condition.val(), title: '更改信息', // 弹出层标题
"conditionValue": conditionValue.val() area: ['800px', '600px'], // 弹出层大小
} maxmin: true, // 允许最大化和最小化
,page: { shadeClose: true, // 点击遮罩关闭弹出层
curr: 1 //重新从第 1 页开始 content: '', // 弹出层内容为空，需要根据实际需求填写
} });
}); break;
break; };
});
case 'add':
var addCardLayer = layer.open({
type: 2,
title: '添加借书证',
area: ['800px', '500px'],
maxmin: true,
shadeClose: true,
content: 'cardadd.jsp',
});
//layer.full(addCardLayer);
};
}); });
// 侧边工具栏事件
table.on(('tool(formFilter)'), function(obj){
var data = obj.data;
var layEvent = obj.event;
var tr = obj.tr;
switch(obj.event){
case 'edit':
layer.open({
type: 2,
title: '更改信息',
area: ['800px', '600px'],
maxmin: true,
shadeClose: true,
content: '',
})
break;
}
})
});
</script> </script>
</body> </body>
</html> </html>

102
WebContent/reader/11updatePswSus.jsp
Unescape View File

@ -1,64 +1,62 @@
<%@ page import="java.sql.*"%> <%@ page import="java.sql.*"%> <!-- 导入Java SQL包 -->
<%@ page import="java.util.*"%> <%@ page import="java.util.*"%> <!-- 导入Java Util包 -->
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%> <!-- 设置页面语言为Java，内容类型和字符编码为UTF-8 -->
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!-- 定义HTML文档类型 -->
<html> <html>
<head> <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <!-- 设置内容类型和字符编码 -->
<title>修改密码</title> <title>修改密码</title> <!-- 设置页面标题 -->
<script src="${ctx}/toastr/toastr.min.js"></script>
<link rel="stylesheet" href="${ctx}/toastr/toastr.min.css"> <link rel="stylesheet" href="${ctx}/toastr/toastr.min.css"> <!-- 引入外部CSS样式表 -->
</head> </head>
<body> <body>
<jsp:useBean id="check" scope="session" class="javabean.JDBCBean"></jsp:useBean> <jsp:useBean id="check" scope="session" class="javabean.JDBCBean"></jsp:useBean> <!-- 使用JSP的useBean标签来实例化一个名为check的JavaBean对象 -->
<% <%
String psw1 = request.getParameter("psw1"); String psw1 = request.getParameter("psw1"); <!-- 获取请求参数psw1的值 -->
String psw2 = request.getParameter("psw2"); String psw2 = request.getParameter("psw2"); <!-- 获取请求参数psw2的值 -->
//out.println(psw1 + " " + psw2); <!-- 注释掉的代码，用于输出psw1和psw2的值 -->
String id = session.getAttribute("reader").toString(); <!-- 从会话中获取reader属性并转换为字符串 -->
if (psw1.equals(psw2) && psw1 != null && psw2 != null && !psw1.trim().equals("")
&& !psw2.trim().equals("")) { <!-- 检查两个密码是否相同且不为空 -->
String sql = "update borrow_card set PASSWORD ='" + psw1 + "' where ID=" + id; <!-- 构建SQL更新语句 -->
try {
int i = check.executeUpdate(sql); <!-- 执行SQL更新操作 -->
if (i == 1) { <!-- 如果更新成功 -->
%>
('修改成功！'); <!-- 弹出提示信息 -->
window.location.href = "index.jsp"; <!-- 重定向到index.jsp页面 -->
<%
} else { <!-- 如果更新不成功 -->
%>
('修改未成功！'); <!-- 弹出提示信息 -->
window.location.href = "index.jsp"; <!-- 重定向到index.jsp页面 -->
//out.println(psw1 + " " + psw2); <%
String id = session.getAttribute("reader").toString(); }
} catch (Exception e) { <!-- 捕获异常 -->
%>
if (psw1.equals(psw2) && psw1 != null && psw2 != null && !psw1.trim().equals("") ('修改未成功！'); <!-- 弹出提示信息 -->
&& !psw2.trim().equals("")) { window.location.href = "index.jsp"; <!-- 重定向到index.jsp页面 -->
String sql = "update borrow_card set PASSWORD ='" + psw1 + "' where ID=" + id;
try {
int i = check.executeUpdate(sql);
if (i == 1) {
%>
<script>
alert('修改成功！');
window.location.href = "index.jsp";
</script>
<% <%
} else { }
%> } else { <!-- 如果密码验证失败 -->
<script> %>
alert('修改未成功！');
window.location.href = "index.jsp";
</script>
<%
}
} catch (Exception e) {
%>
<script>
alert('修改未成功！');
window.location.href = "index.jsp";
</script>
<%
}
} else {
%>
<script>
alert('修改未成功！');
window.location.href = "index.jsp";
</script>
<%
}
%>
('修改未成功！'); <!-- 弹出提示信息 -->
window.location.href = "index.jsp"; <!-- 重定向到index.jsp页面 -->
<%
}
%>
</body> </body>
</html> </html>

111
WebContent/reader/12rules.jsp
Unescape View File

@ -1,68 +1,79 @@
<%@ page import="java.sql.*" %> <%@ page import="java.sql.*" %>
<%@ page import="java.util.*" %> <%@ page import="java.util.*" %>
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
pageEncoding="UTF-8"%> <!-- 以上三行为JSP页面指令，用于设置页面属性和导入所需的Java包 -->
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html> <html>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <!-- 设置页面字符编码为UTF-8 -->
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title> <!-- 兼容IE浏览器 -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap --> <!-- 响应式布局的视口设置 -->
<link href="../css/bootstrap.min.css" rel="stylesheet"> <title></title>
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) --> <!-- 页面标题为空 -->
<script src="../js/jquery.min.js"></script> <!-- 引入Bootstrap CSS和JS文件 -->
<script src="../js/bootstrap.min.js"></script> <!-- Bootstrap是一个前端框架，用于快速布局和样式设计 -->
<link href="../css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" id="templatecss" type="text/css" href="../public/css/message.css"> <script src="../js/jquery.min.js"></script>
<style> <script src="../js/bootstrap.min.js"></script>
body{ <!-- 引入自定义CSS -->
background-color:#fff; <link rel="stylesheet" id="templatecss" type="text/css" href="../public/css/message.css">
color:black; <!-- 内联样式，设置body的背景色和文字颜色 -->
} <style>
</style> body{
background-color:#fff;
color:black;
}
</style>
</head> </head>
<body> <body>
<!-- jQuery代码，用于初始化Bootstrap的popover插件 -->
<script> <script>
$(function () { $(function () {
$("[data-toggle='popover']").popover(); $("[data-toggle='popover']").popover();
}); });
</script> </script>
<!-- 使用JSP标签引入JavaBean，用于数据库操作 -->
<jsp:useBean id="msg" scope="session" class="javabean.JDBCBean"></jsp:useBean> <jsp:useBean id="msg" scope="session" class="javabean.JDBCBean"></jsp:useBean>
<!-- 页面居中显示标题 -->
<div align="center"><h1 style="color:steelblue;font-family:YouYuan;font-weight:900;">读者规则信息查看</h1></div> <div align="center"><h1 style="color:steelblue;font-family:YouYuan;font-weight:900;">读者规则信息查看</h1></div>
<!-- 设置内容上边距，居中显示按钮 -->
<div style="margin-top:5%;" align="center"> <div style="margin-top:5%;" align="center">
<!-- 以下为JSP脚本，用于从数据库查询并展示读者规则信息 -->
<% <%
String sql = "select * from rules"; String sql = "select * from rules";
// 执行SQL查询
ResultSet rs = msg.executeQuery(sql); ResultSet rs = msg.executeQuery(sql);
// 遍历查询结果集
while (rs.next()) { while (rs.next()) {
if(Integer.parseInt(rs.getString("ID")) % 2== 1){ if(Integer.parseInt(rs.getString("ID")) % 2== 1){
%> %>
<button type="button" class="btn btn-lg btn-info" title="可借阅数量：<%=rs.getString("BORROW_NUM") %>" data-html="true" <!-- 如果ID为奇数，使用蓝色按钮展示规则信息，并设置popover提示 -->
data-container="body" data-trigger="focus" data-toggle="popover" data-placement="left" <button type="button" class="btn btn-lg btn-info" title="可借阅数量：<%=rs.getString("BORROW_NUM") %>" data-html="true"
data-container="body" data-trigger="focus" data-toggle="popover" data-placement="left"
data-content="可借阅天数：<%=rs.getString("LIMIT_DAY") %><br>可借阅图书馆：<%=rs.getString("BORROW_LIBRARY") %><br>过期扣费/天：<%=rs.getString("OVERTIME_FEE") %>" style="width:40%;height:100%;font-size:17px;margin-top:4%;"> data-content="可借阅天数：<%=rs.getString("LIMIT_DAY") %><br>可借阅图书馆：<%=rs.getString("BORROW_LIBRARY") %><br>过期扣费/天：<%=rs.getString("OVERTIME_FEE") %>" style="width:40%;height:100%;font-size:17px;margin-top:4%;">
借阅证规则编号：<%=rs.getString("ID")%> 借阅证规则编号：<%=rs.getString("ID")%> //设置借阅证规则编号
</button><br><br> </button><br><br>
<% <%
}else{ }else{
%> %>
<button type="button" class="btn btn-lg btn-primary" title="可借阅数量：<%=rs.getString("BORROW_NUM") %>" data-html="true" <!-- 如果ID为偶数，使用蓝色按钮展示规则信息，并设置popover提示 -->
data-container="body" data-trigger="focus" data-toggle="popover" data-placement="right" <button type="button" class="btn btn-lg btn-primary" title="可借阅数量：<%=rs.getString("BORROW_NUM") %>" data-html="true"
data-content="可借阅天数：<%=rs.getString("LIMIT_DAY") %><br>可借阅图书馆：<%=rs.getString("BORROW_LIBRARY") %><br>过期扣费/天：<%=rs.getString("OVERTIME_FEE") %>" style="width:40%;height:100%;font-size:17px;margin-top:4%;"> data-container="body" data-trigger="focus" data-toggle="popover" data-placement="right"
data-content="可借阅天数：<%=rs.getString("LIMIT_DAY") %><br>可借阅图书馆：<%=rs.getString("BORROW_LIBRARY") %><br>过期扣费/天：<%=rs.getString("OVERTIME_FEE") %>" style="width:40%;height:100%;font-size:17px;margin-top:4%;">
借阅证规则编号：<%=rs.getString("ID")%>
借阅证规则编号：<%=rs.getString("ID")%>
</button><br><br>
<% </button><br><br>
} <%
}
} }
%> %>
</div> <!-- 结束JSP脚本 -->
</div>
</body> </body>
</html> </html>

81
WebContent/reader/13message.jsp
Unescape View File

@ -1,46 +1,53 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html> <html>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<title></title> <title></title>
<!-- Bootstrap --> <!-- 引入Bootstrap CSS文件 -->
<link href="../css/bootstrap.min.css" rel="stylesheet"> <link href="../css/bootstrap.min.css" rel="stylesheet">
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) --> <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
<script src="../js/jquery.min.js"></script> <script src="../js/jquery.min.js"></script>
<script src="../js/bootstrap.min.js"></script> <!-- 引入自定义CSS文件 -->
<link rel="stylesheet" id="templatecss" type="text/css" href="../public/css/message.css">
<link rel="stylesheet" id="templatecss" type="text/css" href="../public/css/message.css">
</head> </head>
<body id="home"> <body id="home">
<script>
//$(document).ready(function () { <!-- 以下JavaScript代码被注释掉了，用于在页面加载时设置当前日期和时间 -->
// var date = new Date(+new Date()+8*3600*1000).toISOString().replace(/T/g,' ').replace(/\.[\d]{3}Z/,''); <!-- $(document).ready(function () {
// alert(date);//2017-01-22 11:08:46 var date = new Date(+new Date()+8*3600*1000).toISOString().replace(/T/g,' ').replace(/\.[\d]{3}Z/,'');
// $('#date_info').val(today); (date);//2017-01-22 11:08:46
//}) $('#date_info').val(today);
</script> }) -->
<div class="rain">
<div class="border start"> <div class="rain">
<form action="14messageSub.jsp" method="post"> <div class="border start">
<label for="mes" style="margin-left:36%;">留言板</label> <!-- 表单提交到14messageSub.jsp，使用POST方法 -->
<textarea id="mes" name="msg" placeholder="请输入您的留言" style="height:50%;width:90%"></textarea> <form action="14messageSub.jsp" method="post">
<!-- <label for="date">日期</label>--> <!-- 留言板标题 -->
<!-- <input id="date" type="text" name="time" placeholder="请输入时间" style="width:90%"/><br> --> <label for="mes" style="margin-left:36%;">留言板</label>
<!-- <input type="datetime_local" id="date_info" placeholder="请输入时间"/> --> <!-- 多行文本输入框，用于用户输入留言 -->
<br><br> <textarea id="mes" name="msg" placeholder="请输入您的留言" style="height:50%;width:90%"></textarea>
<div align="center"> <!-- 日期输入框被注释掉 -->
<button type="submit" class="btn btn-warning" style="margin-left:0">提交</button>&emsp;&emsp;&emsp; <!-- <label for="date">日期</label>-->
<button type="reset" class="btn btn-danger" style="margin-right:0">重置</button>&emsp;&emsp;&emsp; <!-- <input id="date" type="text" name="time" placeholder="请输入时间" style="width:90%"/><br> -->
<button type="reset" class="btn btn-info" style="margin-right:0" onClick="location.href='15checkMessage.jsp'">查看留言</button> <!-- <input type="datetime_local" id="date_info" placeholder="请输入时间"/> -->
</div> <br><br>
</form> <div align="center">
<!-- 提交按钮 -->
<button type="submit" class="btn btn-warning" style="margin-left:0">提交</button>&emsp;&emsp;&emsp;
<!-- 重置按钮 -->
<button type="reset" class="btn btn-danger" style="margin-right:0">重置</button>&emsp;&emsp;&emsp;
<!-- 查看留言按钮，点击后跳转到15checkMessage.jsp页面 -->
<button type="reset" class="btn btn-info" style="margin-right:0" onclick="location.href='15checkMessage.jsp'">查看留言</button>
</div> </div>
</div> </form>
</body> </div>
</div>
</body>
</body> </body>
</html> </html>

70
WebContent/reader/14messageSub.jsp
Unescape View File

@ -1,47 +1,53 @@
<%@ page import="java.sql.*" %> <%@ page import="java.sql.*" %> <!-- 导入Java SQL包，用于数据库操作 -->
<%@ page import="java.util.*" %> <%@ page import="java.util.*" %> <!-- 导入Java工具包，包含日期时间类等 -->
<%@ page import="javabean.DateTime"%> <%@ page import="javabean.DateTime"%> <!-- 导入自定义的DateTime类 -->
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%> <!-- 设置页面语言为Java，内容类型和字符编码为UTF-8 -->
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!-- 定义HTML文档类型 -->
<html> <html>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8"> <!-- 设置字符编码为UTF-8 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <!-- 设置IE浏览器兼容模式 -->
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- 设置视口宽度和初始缩放比例 -->
<title></title> <title></title> <!-- 页面标题 -->
<!-- Bootstrap --> <!-- Bootstrap CSS文件 -->
<link href="../css/bootstrap.min.css" rel="stylesheet"> <link href="../css/bootstrap.min.css" rel="stylesheet">
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) --> <!-- jQuery库，Bootstrap的所有JavaScript插件都依赖jQuery，所以必须放在前边 -->
<script src="../js/jquery.min.js"></script>
<script src="../js/bootstrap.min.js"></script>
<link rel="stylesheet" id="templatecss" type="text/css" <!-- 自定义CSS文件 -->
href="../public/css/message.css"> <link rel="stylesheet" id="templatecss" type="text/css" href="../public/css/message.css">
</head> </head>
<body> <body>
<jsp:useBean id="msg" scope="session" class="javabean.JDBCBean"></jsp:useBean> <!-- 使用JSP标签声明一个JavaBean对象msg，作用域为session，类为javabean.JDBCBean -->
<% <jsp:useBean id="msg" scope="session" class="javabean.JDBCBean"></jsp:useBean>
DateTime date=new DateTime(); <%
//out.println(date.show()); // 创建DateTime对象实例
String time = date.show(); DateTime date = new DateTime();
// 获取当前时间字符串
String mes = request.getParameter("msg"); String time = date.show();
try{ // 从请求中获取参数msg的值
String card = session.getAttribute("reader").toString(); String mes = request.getParameter("msg");
try {
// 从session中获取reader属性并转换为字符串
String card = session.getAttribute("reader").toString();
// 构建SQL插入语句
String sql = "insert into message(card_id,detail,public_date)values('" + card + "','" + mes + "','" + time + "');"; String sql = "insert into message(card_id,detail,public_date)values('" + card + "','" + mes + "','" + time + "');";
if (card!=null&&mes!=null&& !mes.trim().equals("")) { // 检查card和mes是否不为空且mes不为空白字符串
if (card != null && mes != null && !mes.trim().equals("")) {
// 执行SQL插入操作
int i = msg.executeUpdate(sql); int i = msg.executeUpdate(sql);
// 根据插入结果进行跳转
if (i == 1) { if (i == 1) {
%> %>
// 这是用户提交留言后的处理逻辑
<script> <script>
alert('留言成功！'); alert('留言成功！');
window.location.href = "15checkMessage.jsp"; window.location.href = "15checkMessage.jsp";//将当前浏览器窗口重定向到指定的jsp
</script> </script>
<% <%
} }
@ -53,7 +59,7 @@
</script> </script>
<% <%
} }
} else { } else {
%> %>
<script> <script>

87
WebContent/reader/15checkMessage.jsp
Unescape View File

@ -1,54 +1,53 @@
<%@ page import="java.sql.*" %> <%@ page import="java.sql.*" %> <!-- 导入Java SQL包，用于数据库操作 -->
<%@ page import="java.util.*" %> <%@ page import="java.util.*" %> <!-- 导入Java工具包，包含日期时间类等 -->
<%@ page import="javabean.DateTime"%> <%@ page import="javabean.DateTime"%> <!-- 导入自定义的DateTime类 -->
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%> <!-- 设置页面语言为Java，内容类型和字符编码为UTF-8 -->
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!-- 定义HTML文档类型 -->
<html> <html>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8"> <!-- 设置字符编码为UTF-8 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <!-- 设置IE浏览器兼容模式 -->
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- 设置视口宽度和初始缩放比例 -->
<title></title> <title></title> <!-- 页面标题 -->
<!-- Bootstrap --> <!-- Bootstrap CSS文件 -->
<link href="../css/bootstrap.min.css" rel="stylesheet"> <link href="../css/bootstrap.min.css" rel="stylesheet">
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) --> <!-- jQuery库，Bootstrap的所有JavaScript插件都依赖jQuery，所以必须放在前边 -->
<script src="../js/jquery.min.js"></script>
<script src="../js/bootstrap.min.js"></script>
<link rel="stylesheet" id="templatecss" type="text/css" href="../public/css/message.css"> <!-- 自定义CSS文件 -->
<style type="text/css"> <link rel="stylesheet" id="templatecss" type="text/css" href="../public/css/message.css">
.text-dark{ <style type="text/css">
color:black; .text-dark{
font-family:YouYuan; color:black; <!-- 设置文本颜色为黑色 -->
} font-family:YouYuan; <!-- 设置字体为YouYuan -->
body{ }
background-color:#fff; body{
font-size:16px; background-color:#fff; <!-- 设置背景颜色为白色 -->
} font-size:16px; <!-- 设置字体大小为16px -->
</style> }
</style>
</head> </head>
<body> <body>
<jsp:useBean id="msg" scope="session" class="javabean.JDBCBean"></jsp:useBean> <jsp:useBean id="msg" scope="session" class="javabean.JDBCBean"></jsp:useBean> <!-- 使用JSP标签声明一个JavaBean对象，ID为msg，作用域为session，类为javabean.JDBCBean -->
<div align="center"><h3 style="color:#F08080;">☆★留言板★☆</h3></div> <div align="center"><h3 style="color:#F08080;">☆★留言板★☆</h3></div> <!-- 居中显示标题，标题颜色为粉红色 -->
<% <%
String sql = "select CARD_ID,DETAIL,PUBLIC_DATE from message order by PUBLIC_DATE desc"; String sql = "select CARD_ID,DETAIL,PUBLIC_DATE from message order by PUBLIC_DATE desc"; //<!-- SQL查询语句，选择CARD_ID、DETAIL和PUBLIC_DATE字段，按PUBLIC_DATE降序排列 -->
ResultSet rs = msg.executeQuery(sql); ResultSet rs = msg.executeQuery(sql); //<!-- 执行SQL查询，返回结果集 -->
while (rs.next()) { while (rs.next()) { //<!-- 遍历结果集 -->
%> %>
<div class="panel panel-default" style="width:60%;height:80%; margin-left:20%;"> <div class="panel panel-default" style="width:60%;height:80%; margin-left:20%;"> <!-- 创建一个面板，宽度60%，高度80%，左边距20% -->
<div class="panel-body" align="center"> <div class="panel-body" align="center"> <!-- 面板主体部分，内容居中 -->
<p class="bg-info text-dark"><%=rs.getString("CARD_ID")%></p> <p class="bg-info text-dark"><%=rs.getString("CARD_ID")%></p> <!-- 显示CARD_ID字段的值，背景色为蓝色，文本颜色为黑色 -->
<div style="word-wrap:break-word;"><p class="bg-warning text-dark"><%=rs.getString("DETAIL")%></p></div> <div style="word-wrap:break-word;"><p class="bg-warning text-dark"><%=rs.getString("DETAIL")%></p></div> <!-- 显示DETAIL字段的值，自动换行，背景色为黄色，文本颜色为黑色 -->
<p class="bg-danger text-dark"><%=rs.getString("PUBLIC_DATE")%></p> <p class="bg-danger text-dark"><%=rs.getString("PUBLIC_DATE")%></p> <!-- 显示PUBLIC_DATE字段的值，背景色为红色，文本颜色为黑色 -->
</div>
</div> </div>
<hr> </div>
<hr> <!-- 水平线分隔符 -->
<% <%
} }
%> %>
</body> </body>
</html> </html>

215
WebContent/reader/index.jsp
Unescape View File

@ -1,141 +1,122 @@
<%@ page import="java.sql.*"%> <%@ page import="java.sql.*"%> <!-- 导入Java SQL包，用于数据库操作 -->
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> pageEncoding="UTF-8"%> <!-- 设置页面语言为Java，内容类型为HTML，字符编码为UTF-8 -->
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!-- 定义文档类型为HTML 4.01 Transitional -->
<html> <html>
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" /> <!-- 设置字符编码为UTF-8 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <!-- 设置浏览器兼容模式 -->
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- 设置视口宽度和初始缩放比例 -->
<title>Nifty Modal Window Effects</title> <title>Nifty Modal Window Effects</title> <!-- 设置网页标题 -->
<meta name="description" <meta name="description"
content="Nifty Modal Window Effects with CSS Transitions and Animations" /> content="Nifty Modal Window Effects with CSS Transitions and Animations" /> <!-- 设置网页描述 -->
<meta name="keywords" <meta name="keywords"
content="modal, window, overlay, modern, box, css transition, css animation, effect, 3d, perspective" /> content="modal, window, overlay, modern, box, css transition, css animation, effect, 3d, perspective" /> <!-- 设置网页关键词 -->
<meta name="author" content="Codrops" /> <meta name="author" content="Codrops" /> <!-- 设置作者信息 -->
<!-- Bootstrap --> <!-- Bootstrap -->
<link href="../css/bootstrap.min.css" rel="stylesheet"> <link href="../css/bootstrap.min.css" rel="stylesheet"> <!-- 引入Bootstrap样式表 -->
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) --> <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
<script src="../js/jquery.min.js"></script>
<script src="../js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css" href="../public/css/default.css" /> <!-- 引入默认样式表 -->
<link rel="stylesheet" type="text/css" href="../public/css/default.css" /> <link rel="stylesheet" type="text/css"
<link rel="stylesheet" type="text/css" href="../public/css/component.css" /> <!-- 引入组件样式表 -->
href="../public/css/component.css" />
<script src="../public/js/modernizr.custom.js"></script>
</head> </head>
<body> <body>
<% <%
if (session.getAttribute("reader") == null) { if (session.getAttribute("reader") == null) { //<!-- 如果会话中的reader属性为空 -->
%> %>
<script> location.href = "../loginReader.html"; <!-- 重定向到登录页面 -->
location.href = "../loginReader.html"; <%
</script> }
<% %>
} <jsp:useBean id="check" scope="session" class="javabean.JDBCBean"></jsp:useBean> <!-- 使用JSP标签创建JDBCBean对象 -->
%> <!-- All modals added here for the demo. You would of course just have one, dynamically created -->
<jsp:useBean id="check" scope="session" class="javabean.JDBCBean"></jsp:useBean>
<!-- All modals added here for the demo. You would of course just have one, dynamically created -->
<div class="md-modal md-effect-13" id="modal-13"> <div class="md-modal md-effect-13" id="modal-13"> <!-- 模态框容器 -->
<div class="md-content"> <div class="md-content"> <!-- 模态框内容 -->
<h3>修改密码</h3> <h3>修改密码</h3> <!-- 模态框标题 -->
<form action="11updatePswSus.jsp" method="post" <form action="11updatePswSus.jsp" method="post"
class="form-horizontal"> class="form-horizontal"> <!-- 表单提交到11updatePswSus.jsp，使用POST方法，水平排列表单元素 -->
<div class="form-group" align="center"> <div class="form-group" align="center"> <!-- 表单组 -->
<br>
<label for="psw1" class="col-sm-2 control-label">新密码</label>
<div class="col-sm-10" align="center">
<input type="password" class="form-control" name="psw1" id="password1" placeholder="请输入新密码" style="width:70%;"/>
</div>
</div>
<br> <br>
<div class="form-group" align="center"> <label for="psw1" class="col-sm-2 control-label">新密码</label> <!-- 新密码标签 -->
<label for="psw2" class="col-sm-2 control-label">新密码</label> <div class="col-sm-10" align="center"> <!-- 输入框容器 -->
<div class="col-sm-10"> <input type="password" class="form-control" name="psw1" id="password1" placeholder="请输入新密码" style="width:70%;"/> <!-- 新密码输入框 -->
<input type="password" class="form-control" name="psw2" id="password2" placeholder="请再次输入密码进行确认" style="width:70%;"/>
</div>
</div> </div>
<div align="center"> </div>
<input type="submit" class="btn btn-primary" value="确认"> <br>
<div class="form-group" align="center"> <!-- 表单组 -->
<label for="psw2" class="col-sm-2 control-label">新密码</label> <!-- 确认新密码标签 -->
<div class="col-sm-10"> <!-- 输入框容器 -->
<input type="password" class="form-control" name="psw2" id="password2" placeholder="请再次输入密码进行确认" style="width:70%;"/> <!-- 确认新密码输入框 -->
</div> </div>
</div>
<div align="center"> <!-- 提交按钮容器 -->
<input type="submit" class="btn btn-primary" value="确认"> <!-- 提交按钮 -->
<br> <br>
</form> </div>
<button class="md-close btn-primary">取消</button> </form>
<br> <button class="md-close btn-primary">取消</button> <!-- 取消按钮 -->
</div> <br>
</div> </div>
</div>
<div class="container"> <div class="container"> <!-- 主容器 -->
<!-- Top Navigation --> <!-- Top Navigation -->
<header style="backgorund-color:lightblue;height:20%;font-align:center;width:100%;font-family:YouYuan;"> <header style="backgorund-color:lightblue;height:20%;width:100%;font-family:YouYuan;"> <!-- 顶部导航栏 -->
<h1>个人信息 <h1>个人信息
<span class="glyphicon glyphicon-bookmark" aria-hidden="true" style="font-size:17px;">&nbsp;Success is waking up in the morning,so excited about what you have to do.</span> <span class="glyphicon glyphicon-bookmark" aria-hidden="true" style="font-size:17px">&nbsp;&nbsp;Success is waking up in the morning, excited about what you have to do.</span>
</h1> </h1>
</header> </header>
<div class="main clearfix" style="font-size:10px;margin-top:5%;font-family:YouYuan;">
<div class="column">
<%
try{
String cardId=session.getAttribute("reader").toString();
String sql="select*from borrow_card where ID = '"+ cardId +"';";
ResultSet rs = check.executeQuery(sql);
while (rs.next()) {
%>
<% int id = rs.getInt(1);%>
<p><span class="glyphicon glyphicon-tags">&nbsp;借阅证编号：<%=rs.getString("ID")%></span></p><br>
<p><span class="glyphicon glyphicon-user">&nbsp;借阅证姓名：<%=rs.getString("READER")%></span></p><br>
<p><span class="glyphicon glyphicon-tag">&nbsp;规则编号：<%=rs.getString("RULE_ID")%></span></p><br>
<p><span class="glyphicon glyphicon-star-empty">&nbsp;状态：
<%
if(rs.getString("STATUS").equals("1")){
out.println("可用");
}
else{
out.println("挂失");
}
%>
</span></p>
<%
}
}catch(Exception e){
}
%>
</div>
<div class="column" align="center" style="font-size:15px">
<button class="md-trigger" data-modal="modal-13" style="margin-top:20%;">修改密码</button>
</div> <div class="main clearfix" style="font-size:10px;margin-top:5%;font-family:YouYuan;"> <!-- 主要内容区域 -->
<div class="column"> <!-- 左侧列 -->
<%
try{
String cardId = session.getAttribute("reader").toString(); // 获取会话中的reader属性并转换为字符串
String sql = "select * from borrow_card where ID = '" + cardId + "';"; // SQL查询语句，根据reader ID查询借阅卡信息
ResultSet rs = check.executeQuery(sql); // 执行SQL查询，返回结果集
while(rs.next()){ // 遍历结果集
%>
<% int id =rs.getInt("ID"); %> <%-- 获取ID字段的值 --%>
<p><span class="glyphicon glyphicon-tags">&nbsp;借阅卡编号：<%=rs.getString("ID")%></span></p> <%-- 显示借阅卡编号 --%>
<p><span class="glyphicon glyphicon-user">&nbsp;借阅人：<%=rs.getString("READER")%></span></p> <%-- 显示借阅人 --%>
<p><span class="glyphicon glyphicon-tag">&nbsp;规则编号：<%=rs.getString("RULE_ID")%></span></p> <%-- 显示规则编号 --%>
<p><span class="glyphicon glyphicon-star-empty">&nbsp;状态：
<%
if(rs.getString("STATUS").equals("1")){ // 根据状态值判断状态
out.println("可用"); // 如果状态值为1，显示“可用”
}else{
out.println("挂失"); // 如果状态值不为1，显示“挂失”
}
%>
</span></p>
<%}
}catch(Exception e){ // 捕获异常
}
%>
</div>
<div class="column" align="center" style="font-size:15px;"> <!-- 右侧列 -->
<button class="md-trigger btn-primary" data-modal="modal-13" style="margin-top:20%;">修改密码</button> <!-- 修改密码按钮 -->
</div> </div>
</div> </div>
<!-- /container --> </div>
<div class="md-overlay"></div>
<!-- the overlay element -->
<!-- classie.js by @desandro: https://github.com/desandro/classie -->
<script src="../public/js/classie.js"></script>
<script src="../public/js/modalEffects.js"></script>
<!-- for the blur effect --> <div class="md-overlay"></div> <!-- 模态框覆盖层 -->
<!-- by @derSchepp https://github.com/Schepp/CSS-Filters-Polyfill --> <!-- classie by @desandro https://github.com/desandro/classie -->
<script> <!-- classie.js - class helper functions by desandro -->
// this is important for IEs <script src="js/classie.js"></script>
var polyfilter_scriptpath = '/js/'; <!-- for the blur effect -->
</script> <!-- by @derekdrees https://github.com/ded/SpinKit -->
<script src="../public/js/cssParser.js"></script> <script src="js/spinkit.js"></script>
<script src="../public/js/css-filters-polyfill.js"></script> <script>
// this is important for the blur effect
var polyfillscriptpath = 'polyfill/'; // polyfill脚本路径
</script>
</body> </body>
</html> </html>

44
src/filter/CharacterEncodingFilter.java
Unescape View File

@ -1,39 +1,37 @@
package filter; package filter; // 定义包名
import java.io.IOException; import java.io.IOException; // 导入IOException类
import javax.servlet.Filter; import javax.servlet.Filter; // 导入Filter接口
import javax.servlet.FilterChain; import javax.servlet.FilterChain; // 导入FilterChain接口
import javax.servlet.FilterConfig; import javax.servlet.FilterConfig; // 导入FilterConfig接口
import javax.servlet.ServletException; import javax.servlet.ServletException; // 导入ServletException类
import javax.servlet.ServletRequest; import javax.servlet.ServletRequest; // 导入ServletRequest接口
import javax.servlet.ServletResponse; import javax.servlet.ServletResponse; // 导入ServletResponse接口
import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletRequest; // 导入HttpServletRequest类
import javax.servlet.http.HttpServletResponse; import javax.servlet.http.HttpServletResponse; // 导入HttpServletResponse类
/** /**
* 字符过滤器 * 字符过滤器
* @author Mingyue * @author Mingyue
* *
*/ */
import javax.servlet.*; import javax.servlet.*; // 再次导入javax.servlet包，可能是多余的
import java.io.IOException; import java.io.IOException; // 再次导入IOException类，可能是多余的
public class CharacterEncodingFilter implements Filter { public class CharacterEncodingFilter implements Filter { // 定义一个实现Filter接口的类
public void init(FilterConfig filterConfig) throws ServletException {
public void init(FilterConfig filterConfig) throws ServletException { // 初始化方法，接收FilterConfig对象
// 空实现，可以在这里进行一些初始化操作
} }
public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException { public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException { // 过滤方法，处理请求和响应
servletRequest.setCharacterEncoding("UTF-8"); servletRequest.setCharacterEncoding("UTF-8"); // 设置请求的字符编码为UTF-8
servletResponse.setCharacterEncoding("UTF-8"); servletResponse.setCharacterEncoding("UTF-8"); // 设置响应的字符编码为UTF-8
filterChain.doFilter(servletRequest, servletResponse); filterChain.doFilter(servletRequest, servletResponse); // 将请求和响应传递给下一个过滤器或目标资源
} }
public void destroy() { public void destroy() { // 销毁方法，在过滤器被销毁时调用
// 空实现，可以在这里进行一些清理操作
} }
} }

9
src/filter/ManagerFilter.java
Unescape View File

@ -17,22 +17,31 @@ import javax.servlet.http.HttpSession;
*/ */
public class ManagerFilter implements Filter { public class ManagerFilter implements Filter {
// 当过滤器被销毁时调用此方法
public void destroy() { public void destroy() {
} }
// 执行过滤操作的方法
public void doFilter(ServletRequest request, ServletResponse response, FilterChain chain) public void doFilter(ServletRequest request, ServletResponse response, FilterChain chain)
throws IOException, ServletException { throws IOException, ServletException {
// 将请求对象转换为HttpServletRequest类型
HttpServletRequest req = (HttpServletRequest) request; HttpServletRequest req = (HttpServletRequest) request;
// 获取当前会话，如果不存在则创建一个新的会话
HttpSession session = req.getSession(); HttpSession session = req.getSession();
// 如果会话为空或会话中没有"manager"属性，则重定向到登录页面
if (session == null || session.getAttribute("manager") == null) { if (session == null || session.getAttribute("manager") == null) {
// 将响应对象转换为HttpServletResponse类型
HttpServletResponse rep = (HttpServletResponse) response; HttpServletResponse rep = (HttpServletResponse) response;
// 重定向到登录页面
rep.sendRedirect(req.getContextPath() + "/loginManager.html"); rep.sendRedirect(req.getContextPath() + "/loginManager.html");
} }
// 继续执行过滤链中的下一个过滤器或目标资源
chain.doFilter(request, response); chain.doFilter(request, response);
} }
// 当过滤器被初始化时调用此方法
public void init(FilterConfig fConfig) throws ServletException { public void init(FilterConfig fConfig) throws ServletException {
} }

98
src/javabean/Common.java
Unescape View File

@ -1,67 +1,71 @@
package javabean; package javabean; // 定义包名，用于组织类和接口
import java.sql.Connection; import java.sql.Connection; // 导入Connection类，用于数据库连接
import java.sql.PreparedStatement; import java.sql.PreparedStatement; // 导入PreparedStatement类，用于执行预编译的SQL语句
import java.sql.ResultSet; import java.sql.ResultSet; // 导入ResultSet类，用于存储查询结果
import java.sql.SQLException; import java.sql.SQLException; // 导入SQLException类，用于处理SQL异常
import java.util.HashMap; import java.util.HashMap; // 导入HashMap类，用于存储键值对
import java.util.TreeMap; import java.util.TreeMap; // 导入TreeMap类，用于存储有序的键值对
public class Common { public class Common { // 定义公共类Common
/** /**
* 获取行总数 * 获取行总数
* @return * @param table 表名
* @throws SQLException * @return 返回表中的行数
* @throws ClassNotFoundException * @throws SQLException 如果数据库访问出错或此方法被关闭时抛出
* @throws ClassNotFoundException 如果找不到数据库驱动类时抛出
*/ */
public static int getCount(String table) throws SQLException, ClassNotFoundException { public static int getCount(String table) throws SQLException, ClassNotFoundException {
if(table == null || table.equals("")) { if(table == null || table.equals("")) { // 检查表名是否为空
return 0; return 0; // 如果为空，返回0
} }
Connection connection = null; Connection connection = null; // 初始化数据库连接对象
PreparedStatement pstmt = null; PreparedStatement pstmt = null; // 初始化预编译语句对象
ResultSet resultSet = null; ResultSet resultSet = null; // 初始化结果集对象
connection = Base.getConnection(); connection = Base.getConnection(); // 获取数据库连接
try { try {
pstmt = connection.prepareStatement("select count(*) as count from " +table); pstmt = connection.prepareStatement("select count(*) as count from " +table); // 准备SQL查询语句
resultSet = pstmt.executeQuery(); resultSet = pstmt.executeQuery(); // 执行查询并获取结果集
resultSet.next(); resultSet.next(); // 移动到结果集的第一行
return resultSet.getInt("count"); return resultSet.getInt("count"); // 返回计数结果
}catch(Exception e) { }catch(Exception e) { // 捕获所有异常
return 0; return 0; // 发生异常时返回0
}finally { }finally {
Base.closeResource(connection, pstmt, resultSet); Base.closeResource(connection, pstmt, resultSet); // 关闭资源
} }
} }
/**
* 获取图书馆信息映射
* @return 返回包含图书馆ID和名称的有序映射
* @throws SQLException 如果数据库访问出错或此方法被关闭时抛出
*/
public static TreeMap<String, String> getLibraryMap() throws SQLException { public static TreeMap<String, String> getLibraryMap() throws SQLException {
Connection connection = null; Connection connection = null; // 初始化数据库连接对象
PreparedStatement libraryPstmt = null; PreparedStatement libraryPstmt = null; // 初始化预编译语句对象
ResultSet librarySet = null; ResultSet librarySet = null; // 初始化结果集对象
String librarySql = "select id,name from library"; String librarySql = "select id,name from library"; // SQL查询语句
TreeMap<String, String> map = new TreeMap<String, String>(); TreeMap<String, String> map = new TreeMap<String, String>(); // 创建有序映射对象
// 获取图书馆 // 获取图书馆
try { try {
connection = (Connection) Base.getConnection(); connection = (Connection) Base.getConnection(); // 获取数据库连接
libraryPstmt = connection.prepareStatement(librarySql); libraryPstmt = connection.prepareStatement(librarySql); // 准备SQL查询语句
librarySet = libraryPstmt.executeQuery(); librarySet = libraryPstmt.executeQuery(); // 执行查询并获取结果集
while(librarySet.next()) { while(librarySet.next()) { // 遍历结果集
map.put(librarySet.getString("id"), librarySet.getString("name")); map.put(librarySet.getString("id"), librarySet.getString("name")); // 将结果添加到映射中
} }
} catch (ClassNotFoundException e) { } catch (ClassNotFoundException e) { // 捕获类未找到异常
return null; return null; // 返回null
} catch (SQLException e) { } catch (SQLException e) { // 捕获SQL异常
return null; return null; // 返回null
} finally { } finally {
Base.closeResource(connection, libraryPstmt, librarySet); Base.closeResource(connection, libraryPstmt, librarySet); // 关闭资源
} }
return map; return map; // 返回映射对象
} }
public static void main(String[] args) throws SQLException { public static void main(String[] args) throws SQLException { // 主方法，程序入口点
System.out.println(Common.getLibraryMap()); System.out.println(Common.getLibraryMap()); // 打印图书馆映射信息
} }
} }

24
src/javabean/CompareDate.java
Unescape View File

@ -5,21 +5,21 @@ import java.text.SimpleDateFormat;
import java.util.Date; import java.util.Date;
public class CompareDate { public class CompareDate {
// 定义一个静态方法show，接收两个字符串参数Str1和Str2，返回两个日期之间的天数差
public static long show(String Str1, String Str2) { public static long show(String Str1, String Str2) {
long between = 0; long between = 0; // 初始化between变量，用于存储两个日期之间的毫秒数差
SimpleDateFormat format = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss"); SimpleDateFormat format = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss"); // 创建日期格式化对象，指定日期格式
try { try {
Date date1 = format.parse(Str1); Date date1 = format.parse(Str1); // 将字符串Str1解析为Date对象date1
Date date2 = format.parse(Str2); Date date2 = format.parse(Str2); // 将字符串Str2解析为Date对象date2
between = (date2.getTime() - date1.getTime()); between = (date2.getTime() - date1.getTime()); // 计算两个日期之间的毫秒数差
System.out.println(date1); System.out.println(date1); // 打印第一个日期
System.out.println(date2); System.out.println(date2); // 打印第二个日期
} catch (ParseException e) { } catch (ParseException e) {
// TODO Auto-generated catch block // 捕获并处理ParseException异常
e.printStackTrace(); e.printStackTrace(); // 打印异常堆栈信息
} }
long days = between / (24 * 60 * 60 * 1000); long days = between / (24 * 60 * 60 * 1000); // 将毫秒数差转换为天数
return days; return days; // 返回两个日期之间的天数差
} }
} }

74
src/javabean/DateTime.java
Unescape View File

@ -1,52 +1,52 @@
package javabean; package javabean;
import java.text.SimpleDateFormat; import java.text.SimpleDateFormat; // 导入SimpleDateFormat类，用于格式化日期
import java.util.Calendar; import java.util.Calendar; // 导入Calendar类，用于操作日期
import java.util.Date; import java.util.Date; // 导入Date类，用于获取当前日期和时间
public class DateTime { public class DateTime {
// 显示当前日期和时间，格式为"yyyy-MM-dd HH:mm:ss"
public static String show() { public static String show() {
SimpleDateFormat myFmt2 = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");// 等价于now.toLocaleString() SimpleDateFormat myFmt2 = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss"); // 创建日期格式化对象
Date now = new Date(); Date now = new Date(); // 获取当前日期和时间
return myFmt2.format(now);
return myFmt2.format(now); // 返回格式化后的日期字符串
} }
// 显示从当前日期开始n天后的日期和时间，格式为"yyyy-MM-dd HH:mm:ss"
public static String show(int n) { public static String show(int n) {
Date d = new Date(); Date d = new Date(); // 获取当前日期和时间
SimpleDateFormat format = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss"); SimpleDateFormat format = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss"); // 创建日期格式化对象
String currdate = format.format(d); String currdate = format.format(d); // 格式化当前日期
Calendar ca = Calendar.getInstance(); Calendar ca = Calendar.getInstance(); // 获取日历实例
ca.add(Calendar.DATE, n);// num为增加的天数，可以改变的 ca.add(Calendar.DATE, n); // 在当前日期基础上增加n天
d = ca.getTime(); d = ca.getTime(); // 获取增加天数后的日期
String enddate = format.format(d); String enddate = format.format(d); // 格式化增加天数后的日期
return enddate; return enddate; // 返回格式化后的日期字符串
} }
// 只要年月日 // 显示从当前日期开始n天后的日期，格式为"yyyy-MM-dd"
public static String showDate(int n) { public static String showDate(int n) {
Date d = new Date(); Date d = new Date(); // 获取当前日期和时间
SimpleDateFormat format = new SimpleDateFormat("yyyy-MM-dd"); SimpleDateFormat format = new SimpleDateFormat("yyyy-MM-dd"); // 创建日期格式化对象
String currdate = format.format(d); String currdate = format.format(d); // 格式化当前日期
Calendar ca = Calendar.getInstance(); Calendar ca = Calendar.getInstance(); // 获取日历实例
ca.add(Calendar.DATE, n);// num为增加的天数，可以改变的 ca.add(Calendar.DATE, n); // 在当前日期基础上增加n天
d = ca.getTime(); d = ca.getTime(); // 获取增加天数后的日期
String enddate = format.format(d); String enddate = format.format(d); // 格式化增加天数后的日期
return enddate; return enddate; // 返回格式化后的日期字符串
} }
// 只要月日
// 显示从当前日期开始n天后的月日，格式为"MM-dd"
public static String showMD(int n) { public static String showMD(int n) {
Date d = new Date(); Date d = new Date(); // 获取当前日期和时间
SimpleDateFormat format = new SimpleDateFormat("MM-dd"); SimpleDateFormat format = new SimpleDateFormat("MM-dd"); // 创建日期格式化对象
String currdate = format.format(d); String currdate = format.format(d); // 格式化当前日期
Calendar ca = Calendar.getInstance(); Calendar ca = Calendar.getInstance(); // 获取日历实例
ca.add(Calendar.DATE, n);// num为增加的天数，可以改变的 ca.add(Calendar.DATE, n); // 在当前日期基础上增加n天
d = ca.getTime(); d = ca.getTime(); // 获取增加天数后的日期
String enddate = format.format(d); String enddate = format.format(d); // 格式化增加天数后的日期
return enddate; return enddate; // 返回格式化后的日期字符串
} }
} }

25
src/javabean/EndTime.java
Unescape View File

@ -1,22 +1,23 @@
package javabean; package javabean;
import java.text.SimpleDateFormat; import java.text.SimpleDateFormat; // 导入SimpleDateFormat类，用于格式化日期
import java.util.Calendar; import java.util.Calendar; // 导入Calendar类，用于操作日期
import java.util.Date; import java.util.Date; // 导入Date类，用于获取当前日期和时间
public class EndTime { public class EndTime {
// 定义一个静态方法show，接收一个整数参数n，表示增加的天数
public static String show(int n) { public static String show(int n) {
Date d = new Date(); Date d = new Date(); // 获取当前日期和时间
SimpleDateFormat format = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss"); SimpleDateFormat format = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss"); // 创建日期格式化对象
String currdate = format.format(d); String currdate = format.format(d); // 格式化当前日期
System.out.println("现在的日期是：" + currdate); System.out.println("现在的日期是：" + currdate); // 打印当前日期
Calendar ca = Calendar.getInstance(); Calendar ca = Calendar.getInstance(); // 获取日历实例
ca.add(Calendar.DATE, n);// num为增加的天数，可以改变的 ca.add(Calendar.DATE, n); // 在当前日期基础上增加n天
d = ca.getTime(); d = ca.getTime(); // 获取增加天数后的日期
String enddate = format.format(d); String enddate = format.format(d); // 格式化增加天数后的日期
return enddate; return enddate; // 返回格式化后的日期字符串
} }
} }

33
src/javabean/Manager.java
Unescape View File

@ -6,27 +6,26 @@ import java.sql.ResultSet;
import java.sql.SQLException; import java.sql.SQLException;
public class Manager { public class Manager {
@SuppressWarnings("null") @SuppressWarnings("null") // 忽略空值警告
public String login(String user, String psw) throws ClassNotFoundException, SQLException { public String login(String user, String psw) throws ClassNotFoundException, SQLException {
// 检查用户名是否为空或仅包含空格
if (user == null || user.trim().equals("")) { if (user == null || user.trim().equals("")) {
return "账号不能为空"; return "账号不能为空"; // 返回错误信息
} else if (psw == null || psw.trim().equals("")) { } else if (psw == null || psw.trim().equals("")) {
return "密码不能为空"; return "密码不能为空"; // 返回错误信息
} }
Connection connection = null; Connection connection = null; // 数据库连接对象
PreparedStatement pstmt = null; PreparedStatement pstmt = null; // 预编译的SQL语句对象
ResultSet resultSet = null; ResultSet resultSet = null; // 结果集对象
String sql = "select * from manager where ACCOUNT=? and PASSWORD=?"; String sql = "select * from manager where ACCOUNT=? and PASSWORD=?"; // SQL查询语句
connection = Base.getConnection(); connection = Base.getConnection(); // 获取数据库连接
pstmt = (PreparedStatement) connection.prepareStatement(sql); pstmt = (PreparedStatement) connection.prepareStatement(sql); // 创建预编译的SQL语句对象
pstmt.setString(1, user); pstmt.setString(1, user); // 设置第一个参数（用户名）
pstmt.setString(2, psw); pstmt.setString(2, psw); // 设置第二个参数（密码）
resultSet = pstmt.executeQuery(); resultSet = pstmt.executeQuery(); // 执行查询并获取结果集
if (resultSet.next()) { if (resultSet.next()) { // 如果结果集中有数据，表示登录成功
return "1"; return "1"; // 返回成功标志
} }
return "账号或密码错误"; return "账号或密码错误"; // 返回错误信息
} }
} }

28
src/javabean/Reader.java
Unescape View File

@ -8,24 +8,26 @@ import java.sql.SQLException;
public class Reader { public class Reader {
@SuppressWarnings("null") @SuppressWarnings("null")
public String login(String user, String psw) throws ClassNotFoundException, SQLException { public String login(String user, String psw) throws ClassNotFoundException, SQLException {
//检查用户名是否为空
if (user == null || user.trim().equals("")) { if (user == null || user.trim().equals("")) {
return "账号不能为空"; return "账号不能为空";
} else if (psw == null || psw.trim().equals("")) { } else if (psw == null || psw.trim().equals("")) {//检查密码是否为空
return "密码不能为空"; return "密码不能为空";
} }
Connection connection = null; Connection connection = null; // 数据库连接对象
PreparedStatement pstmt = null; PreparedStatement pstmt = null; // 预编译的SQL语句对象
ResultSet resultSet = null; ResultSet resultSet = null; // 查询结果集对象
String sql = "select * from borrow_card where ID=? and PASSWORD=?"; String sql = "select * from borrow_card where ID=? and PASSWORD=?"; // SQL查询语句
connection = Base.getConnection();
pstmt = (PreparedStatement) connection.prepareStatement(sql); connection = Base.getConnection(); // 获取数据库连接
pstmt.setString(1, user); pstmt = (PreparedStatement) connection.prepareStatement(sql); // 创建PreparedStatement对象
pstmt.setString(2, psw); pstmt.setString(1, user); // 设置第一个参数（用户名）
resultSet = pstmt.executeQuery(); pstmt.setString(2, psw); // 设置第二个参数（密码）
if (resultSet.next()) { resultSet = pstmt.executeQuery(); // 执行查询
if (resultSet.next()) { // 如果查询有结果，说明账号密码正确
return "1"; return "1";
} }
return "账号或密码错误"; return "账号或密码错误"; // 如果没有查询到结果，返回错误信息
} }
} }

109
src/javabean/Util.java
Unescape View File

@ -1,88 +1,89 @@
package javabean; package javabean; // 定义包名，用于组织类和接口
import java.math.BigInteger; import java.math.BigInteger; // 导入BigInteger类，用于处理大整数
import java.security.MessageDigest; import java.security.MessageDigest; // 导入MessageDigest类，用于生成MD5摘要
import java.security.NoSuchAlgorithmException; import java.security.NoSuchAlgorithmException; // 导入NoSuchAlgorithmException异常类，用于处理没有指定算法的情况
import java.text.SimpleDateFormat; import java.text.SimpleDateFormat; // 导入SimpleDateFormat类，用于格式化日期
import net.sf.json.JSONObject; import net.sf.json.JSONObject; // 导入JSONObject类，用于处理JSON数据
public class Util { public class Util { // 定义一个公共类Util
/** /**
* 主要用来计算json字符串中对象的个数 * 主要用来计算json字符串中对象的个数
* @param str * @param str 输入的json字符串
* @param contain * @param contain 要计算的对象标识符
* @return * @return 返回对象的数量
*/ */
public static int getCountString(String str, String contain) { public static int getCountString(String str, String contain) {
int count = ( str.length()-str.replace(contain, "").length() ) / contain.length(); int count = ( str.length()-str.replace(contain, "").length() ) / contain.length(); // 计算包含特定字符串的次数
return count; return count; // 返回计数结果
} }
/** /**
* 数据库取出来的datetime有 .0 ,用来去掉 * 数据库取出来的datetime有 .0 ,用来去掉
* @param dateTime * @param dateTime 输入的日期时间字符串
* @return * @return 返回去除.0后的日期时间字符串
*/ */
public static String getFormatDateTime(String dateTime) { public static String getFormatDateTime(String dateTime) {
if(dateTime != null && dateTime.indexOf(".0") != -1) { if(dateTime != null && dateTime.indexOf(".0") != -1) { // 如果字符串不为空且包含".0"
return dateTime.substring(0, dateTime.length()-2); return dateTime.substring(0, dateTime.length()-2); // 去除最后两个字符（即".0"）
}else if(dateTime != null) { }else if(dateTime != null) { // 如果字符串不为空但不包含".0"
return dateTime; return dateTime; // 直接返回原字符串
} }
return null; return null; // 如果字符串为空，返回null
} }
/** /**
* 获取当前时间 * 获取当前时间
* @return * @return 返回格式化后的当前时间字符串
*/ */
public static String getCurrentTimeString() { public static String getCurrentTimeString() {
java.util.Date date = new java.util.Date(); java.util.Date date = new java.util.Date(); // 创建当前日期对象
SimpleDateFormat dateFormat= new SimpleDateFormat("yyyy-MM-dd hh:mm:ss"); SimpleDateFormat dateFormat= new SimpleDateFormat("yyyy-MM-dd hh:mm:ss"); // 定义日期格式
return dateFormat.format(date); return dateFormat.format(date); // 返回格式化后的日期字符串
} }
/* /*
* 返回json数据 * 返回json数据
*/ */
public static String jsonResponse(int code, String msg, String data) { public static String jsonResponse(int code, String msg, String data) {
JSONObject jsonObject = new JSONObject(); JSONObject jsonObject = new JSONObject(); // 创建JSON对象
jsonObject.put("code", code); jsonObject.put("code", code); // 添加code字段
jsonObject.put("msg", msg); jsonObject.put("msg", msg); // 添加msg字段
if( data!=null ) { if( data!=null ) { // 如果data不为空
jsonObject.put("data", data); jsonObject.put("data", data); // 添加data字段
} }
return jsonObject.toString(); return jsonObject.toString(); // 返回JSON字符串
} }
/* /*
* md5加密 * md5加密
*/ */
public static String stringToMD5(String plainText) { public static String stringToMD5(String plainText) {
byte[] secretBytes = null; byte[] secretBytes = null; // 定义字节数组用于存储MD5摘要
try { try {
secretBytes = MessageDigest.getInstance("md5").digest( secretBytes = MessageDigest.getInstance("md5").digest(
plainText.getBytes()); plainText.getBytes()); // 生成MD5摘要
} catch (NoSuchAlgorithmException e) { } catch (NoSuchAlgorithmException e) { // 捕获没有该算法的异常
throw new RuntimeException("没有这个md5算法！"); throw new RuntimeException("没有这个md5算法！"); // 抛出运行时异常
} }
String md5code = new BigInteger(1, secretBytes).toString(16); String md5code = new BigInteger(1, secretBytes).toString(16); // 将字节数组转换为16进制字符串
for (int i = 0; i < 32 - md5code.length(); i++) { for (int i = 0; i < 32 - md5code.length(); i++) { // 如果长度不足32位，前面补0
md5code = "0" + md5code; md5code = "0" + md5code;
} }
return md5code; return md5code; // 返回MD5字符串
} }
public static String passMd5(String password) { public static String passMd5(String password) {
String salt = "ew!.E"; String salt = "ew!.E"; // 定义盐值
return Util.stringToMD5(password +salt); return Util.stringToMD5(password +salt); // 返回加盐后的MD5字符串
} }
public static void main(String[] args) { public static void main(String[] args) {
System.out.println(Util.passMd5("admin")); System.out.println(Util.passMd5("admin")); // 测试MD5加密函数，输出加密后的字符串
//java.util.Date date = new java.util.Date(); //java.util.Date date = new java.util.Date(); // 注释掉的代码：创建当前日期对象
//SimpleDateFormat dateFormat= new SimpleDateFormat("yyyy-MM-dd hh:mm:ss"); //SimpleDateFormat dateFormat= new SimpleDateFormat("yyyy-MM-dd hh:mm:ss"); // 注释掉的代码：定义日期格式
//System.out.println(dateFormat.format(date)); //System.out.println(dateFormat.format(date)); // 注释掉的代码：输出格式化后的日期字符串
} }
} }

72
src/servlet/admin/AdminLogin.java
Unescape View File

@ -17,50 +17,50 @@ import net.sf.json.JSONObject;
/** /**
* 管理员登录 * 管理员登录
* *
*zhang *
* *
*/ */
@WebServlet("/adminLogin") @WebServlet("/adminLogin")
public class AdminLogin extends HttpServlet { public class AdminLogin extends HttpServlet {
protected void doGet(HttpServletRequest request, HttpServletResponse response) protected void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException { throws ServletException, IOException {
response.getWriter().append("Served at: ").append(request.getContextPath()); response.getWriter().append("Served at: ").append(request.getContextPath());
} }
protected void doPost(HttpServletRequest request, HttpServletResponse response) protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException { throws ServletException, IOException {
// 设置头文件 // 设置头文件
response.setContentType("application/json; charset=utf8"); response.setContentType("application/json; charset=utf8");
PrintWriter out = response.getWriter(); PrintWriter out = response.getWriter();
// 获取账号密码 // 获取账号密码
String username = request.getParameter("username"); String username = request.getParameter("username");
String password = request.getParameter("password"); String password = request.getParameter("password");
// 设置响应map // 设置响应map
HashMap<String, Object> hashMap = new HashMap<String, Object>(); HashMap<String, Object> hashMap = new HashMap<String, Object>();
Admin admin = new Admin(); Admin admin = new Admin();
String result = null; String result = null;
try { try {
result = admin.login(username, password); result = admin.login(username, password);
} catch (ClassNotFoundException | SQLException e) { } catch (ClassNotFoundException | SQLException e) {
e.printStackTrace(); e.printStackTrace();
} }
if (result != null && result.equals("1")) { if (result != null && result.equals("1")) {
HttpSession session = request.getSession(); HttpSession session = request.getSession();
session.setAttribute("admin", username); session.setAttribute("admin", username);
hashMap.put("code", 0); hashMap.put("code", 0);
hashMap.put("msg", "登录成功"); hashMap.put("msg", "登录成功");
hashMap.put("url", request.getContextPath() +"/admin/index.jsp"); hashMap.put("url", request.getContextPath() +"/admin/index.jsp");
}else { }else {
hashMap.put("code", 1); hashMap.put("code", 1);
hashMap.put("msg", result); hashMap.put("msg", result);
} }
JSONObject json = JSONObject.fromObject(hashMap); JSONObject json = JSONObject.fromObject(hashMap);
out.write(json.toString()); out.write(json.toString());
} }
} }

66
src/servlet/manager/Announcement.java
Unescape View File

@ -21,53 +21,53 @@ import net.sf.json.JSONObject;
/** /**
* Servlet implementation class Announcement * Servlet implementation class Announcement
*/ */
@WebServlet("/manager/announcement") @WebServlet("/manager/announcement") // 定义Servlet的URL映射路径
public class Announcement extends HttpServlet { public class Announcement extends HttpServlet {
@Override @Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
resp.setContentType("application/json; charset=utf8"); resp.setContentType("application/json; charset=utf8"); // 设置响应内容类型和字符编码
// 准备数据 // 准备数据
Connection connection = null; Connection connection = null; // 数据库连接对象
PreparedStatement pstmt = null; PreparedStatement pstmt = null; // SQL预编译语句对象
String sql = ""; String sql = ""; // SQL查询语句字符串
ResultSet resultSet = null; ResultSet resultSet = null; // 结果集对象
// 返回数据 // 返回数据
int code = 1; int code = 1; // 状态码，默认为1表示失败
String msg = "无数据"; String msg = "无数据"; // 消息提示，默认为"无数据"
JSONObject jsonObject = new JSONObject(); JSONObject jsonObject = new JSONObject(); // JSON对象，用于存储单条记录的数据
JSONArray jsonArray = new JSONArray(); JSONArray jsonArray = new JSONArray(); // JSON数组，用于存储所有记录的数据
try { try {
connection = (Connection) Base.getConnection(); connection = (Connection) Base.getConnection(); // 获取数据库连接
sql = "select * from announcement"; sql = "select * from announcement"; // 定义SQL查询语句
pstmt = connection.prepareStatement(sql); pstmt = connection.prepareStatement(sql); // 创建预编译语句对象
resultSet = pstmt.executeQuery(); resultSet = pstmt.executeQuery(); // 执行查询并获取结果集
while (resultSet.next()) { while (resultSet.next()) { // 遍历结果集
jsonObject.put("id", resultSet.getString("id")); jsonObject.put("id", resultSet.getString("id")); // 将id字段添加到JSON对象中
jsonObject.put("title", resultSet.getString("title")); jsonObject.put("title", resultSet.getString("title")); // 将title字段添加到JSON对象中
jsonObject.put("detail", resultSet.getString("detail")); jsonObject.put("detail", resultSet.getString("detail")); // 将detail字段添加到JSON对象中
jsonObject.put("publish_date", resultSet.getString("publish_date")); jsonObject.put("publish_date", resultSet.getString("publish_date")); // 将publish_date字段添加到JSON对象中
jsonArray.add(jsonObject); jsonArray.add(jsonObject); // 将JSON对象添加到JSON数组中
} }
if (!jsonArray.isEmpty()) { if (!jsonArray.isEmpty()) { // 如果JSON数组不为空
code = 0; code = 0; // 设置状态码为0表示成功
msg = "查询成功"; msg = "查询成功"; // 设置消息提示为"查询成功"
} else { } else {
msg = "数据为空"; msg = "数据为空"; // 如果JSON数组为空，设置消息提示为"数据为空"
} }
} catch (ClassNotFoundException e) { } catch (ClassNotFoundException e) { // 捕获类未找到异常
msg = "class找不到"; msg = "class找不到"; // 设置消息提示为"class找不到"
} catch (SQLException e) { } catch (SQLException e) { // 捕获SQL异常
msg = "sql错误"; msg = "sql错误"; // 设置消息提示为"sql错误"
} finally { } finally {
try { try {
Base.closeResource(connection, pstmt, resultSet); Base.closeResource(connection, pstmt, resultSet); // 关闭数据库资源
} catch (SQLException e) { } catch (SQLException e) { // 捕获关闭资源时的SQL异常
msg = "关闭失败"; msg = "关闭失败"; // 设置消息提示为"关闭失败"
} }
} }
PrintWriter out = resp.getWriter(); PrintWriter out = resp.getWriter(); // 获取响应输出流
out.print(Util.jsonResponse(code, msg, jsonArray.toString())); out.print(Util.jsonResponse(code, msg, jsonArray.toString())); // 输出JSON响应
} }
} }

76
src/servlet/manager/AnnouncementAdd.java
Unescape View File

@ -21,58 +21,58 @@ import net.sf.json.JSONObject;
/** /**
* Servlet implementation class AnnouncementAdd * Servlet implementation class AnnouncementAdd
*/ */
@WebServlet("/manager/announcementAdd") @WebServlet("/manager/announcementAdd") // 定义Servlet的URL映射路径
public class AnnouncementAdd extends HttpServlet { public class AnnouncementAdd extends HttpServlet {
@Override @Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
resp.setContentType("application/json; charset=utf8"); resp.setContentType("application/json; charset=utf8"); // 设置响应内容类型和字符编码
// 接收参数 // 接收参数
String id = req.getParameter("id"); String id = req.getParameter("id"); // 获取请求中的id参数
String tit = req.getParameter("title"); String tit = req.getParameter("title"); // 获取请求中的title参数
String det = req.getParameter("detail"); String det = req.getParameter("detail"); // 获取请求中的detail参数
DateTime date = new DateTime(); DateTime date = new DateTime(); // 创建DateTime对象，用于获取当前时间
String time = date.show(); String time = date.show(); // 获取当前时间的字符串表示
// 准备参数 // 准备参数
Connection connection = null; Connection connection = null; // 数据库连接对象
PreparedStatement pstmt = null; PreparedStatement pstmt = null; // SQL预编译语句对象
ResultSet resultSet = null; ResultSet resultSet = null; // 结果集对象
int result = 0; int result = 0; // 执行更新操作的结果
int count = 0; int count = 0; // 记录影响的行数
// 返回参数 // 返回参数
int code = 1; int code = 1; // 状态码，默认为1表示失败
String msg = ""; String msg = ""; // 消息提示
JSONArray jsonArray = new JSONArray(); JSONArray jsonArray = new JSONArray(); // JSON数组，用于存储所有记录的数据
JSONObject json = new JSONObject(); JSONObject json = new JSONObject(); // JSON对象，用于存储单条记录的数据
String sql = "insert into announcement(title, detail, publish_date) values(?,?,?)"; String sql = "insert into announcement(title, detail, publish_date) values(?,?,?)"; // SQL插入语句
System.out.println(sql); System.out.println(sql); // 打印SQL语句到控制台
PrintWriter out = resp.getWriter(); PrintWriter out = resp.getWriter(); // 获取响应输出流
try { try {
connection = (Connection) Base.getConnection(); connection = (Connection) Base.getConnection(); // 获取数据库连接
pstmt = connection.prepareStatement(sql); pstmt = connection.prepareStatement(sql); // 创建预编译语句对象
pstmt.setString(1, tit); pstmt.setString(1, tit); // 设置第一个参数为公告标题
pstmt.setString(2, det); pstmt.setString(2, det); // 设置第二个参数为公告详情
pstmt.setString(3, time); pstmt.setString(3, time); // 设置第三个参数为公告发布时间
result = pstmt.executeUpdate(); result = pstmt.executeUpdate(); // 执行更新操作并获取影响的行数
} catch (SQLException e) { } catch (SQLException e) { // 捕获SQL异常
} catch (ClassNotFoundException e) { } catch (ClassNotFoundException e) { // 捕获类未找到异常
e.printStackTrace(); e.printStackTrace(); // 打印堆栈跟踪信息
} finally { } finally {
try { try {
Base.closeResource(connection, pstmt, null); Base.closeResource(connection, pstmt, null); // 关闭数据库资源
} catch (SQLException e) { } catch (SQLException e) { // 捕获关闭资源时的SQL异常
e.printStackTrace(); e.printStackTrace(); // 打印堆栈跟踪信息
} }
} }
if (result == 1) { if (result == 1) { // 如果插入操作成功
json.put("code", "0"); json.put("code", "0"); // 设置状态码为0表示成功
json.put("msg", "success"); json.put("msg", "success"); // 设置消息提示为"success"
} else { } else { // 如果插入操作失败
json.put("code", "1"); json.put("code", "1"); // 设置状态码为1表示失败
json.put("msg", "error"); json.put("msg", "error"); // 设置消息提示为"error"
} }
out.write(json.toString()); out.write(json.toString()); // 输出JSON响应
} }
} }

50
src/servlet/manager/AnnouncementDel.java
Unescape View File

@ -19,39 +19,39 @@ import javabean.Util;
/** /**
* Servlet implementation class AnnouncementDel * Servlet implementation class AnnouncementDel
*/ */
@WebServlet("/manager/announcementDel") @WebServlet("/manager/announcementDel") // 定义Servlet的URL映射路径
public class AnnouncementDel extends HttpServlet { public class AnnouncementDel extends HttpServlet {
@Override @Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
String id = req.getParameter("id"); String id = req.getParameter("id"); // 获取请求中的id参数
// 准备参数 // 准备参数
String sql = ""; String sql = ""; // SQL语句字符串
Connection connection = null; Connection connection = null; // 数据库连接对象
PreparedStatement pstmt = null; PreparedStatement pstmt = null; // SQL预编译语句对象
ResultSet resultSet = null; ResultSet resultSet = null; // 结果集对象
int result = 0; int result = 0; // 执行更新操作的结果
// 返回参数 // 返回参数
int code = 1; int code = 1; // 状态码，默认为1表示失败
String msg = ""; String msg = ""; // 消息提示
PrintWriter out = resp.getWriter(); PrintWriter out = resp.getWriter(); // 获取响应输出流
try { try {
connection = (Connection) Base.getConnection(); connection = (Connection) Base.getConnection(); // 获取数据库连接
sql = "delete from announcement where id=?"; sql = "delete from announcement where id=?"; // 设置SQL删除语句
pstmt = connection.prepareStatement(sql); pstmt = connection.prepareStatement(sql); // 创建预编译语句对象
pstmt.setString(1, id); pstmt.setString(1, id); // 设置第一个参数为公告ID
result = pstmt.executeUpdate(); result = pstmt.executeUpdate(); // 执行更新操作并获取影响的行数
if (result == 1) { if (result == 1) { // 如果删除操作成功
code = 0; code = 0; // 设置状态码为0表示成功
msg = "删除成功"; msg = "删除成功"; // 设置消息提示为"删除成功"
} else { } else { // 如果删除操作失败
msg = "删除失败"; msg = "删除失败"; // 设置消息提示为"删除失败"
} }
} catch (ClassNotFoundException e) { } catch (ClassNotFoundException e) { // 捕获类未找到异常
msg = "class not found"; msg = "class not found"; // 设置消息提示为"class not found"
} catch (SQLException e) { } catch (SQLException e) { // 捕获SQL异常
msg = "sql错误"; msg = "sql错误"; // 设置消息提示为"sql错误"
} }
out.print(Util.jsonResponse(code, msg, null)); out.print(Util.jsonResponse(code, msg, null)); // 输出JSON响应
} }

76
src/servlet/manager/AnnouncementEdit.java
Unescape View File

@ -21,61 +21,61 @@ import net.sf.json.JSONObject;
/** /**
* Servlet implementation class AnnouncementEdit * Servlet implementation class AnnouncementEdit
*/ */
@WebServlet("/manager/announcementEdit") @WebServlet("/manager/announcementEdit") // 定义Servlet的URL映射路径
public class AnnouncementEdit extends HttpServlet { public class AnnouncementEdit extends HttpServlet {
@Override @Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
resp.setContentType("application/json; charset=utf8"); resp.setContentType("application/json; charset=utf8"); // 设置响应内容类型和字符编码
// 接收参数 // 接收参数
String id = req.getParameter("id"); String id = req.getParameter("id"); // 获取请求中的公告ID参数
String tit = req.getParameter("title"); String tit = req.getParameter("title"); // 获取请求中的公告标题参数
String det = req.getParameter("detail"); String det = req.getParameter("detail"); // 获取请求中的公告详情参数
// 准备参数 // 准备参数
String sql = ""; String sql = ""; // SQL语句字符串
Connection connection = null; Connection connection = null; // 数据库连接对象
PreparedStatement pstmt = null; PreparedStatement pstmt = null; // SQL预编译语句对象
ResultSet resultSet = null; ResultSet resultSet = null; // 结果集对象
int result = 0; int result = 0; // 执行更新操作的结果
// 返回参数 // 返回参数
int code = 1; int code = 1; // 状态码，默认为1表示失败
String msg = ""; String msg = ""; // 消息提示
PrintWriter out = resp.getWriter(); PrintWriter out = resp.getWriter(); // 获取响应输出流
JSONArray jsonArray = new JSONArray(); JSONArray jsonArray = new JSONArray(); // JSON数组对象
JSONObject jsonObject = new JSONObject(); JSONObject jsonObject = new JSONObject(); // JSON对象
// 进行查询 // 进行查询
if (tit == null || tit.equals("") || det == null || det.equals("")) { if (tit == null || tit.equals("") || det == null || det.equals("")) { // 检查参数是否为空
msg = "参数不能为空"; msg = "参数不能为空"; // 设置消息提示为"参数不能为空"
out.print(Util.jsonResponse(code, msg, null)); out.print(Util.jsonResponse(code, msg, null)); // 输出JSON响应
} else { } else {
try { try {
connection = (Connection) Base.getConnection(); connection = (Connection) Base.getConnection(); // 获取数据库连接
// 更新公告 // 更新公告
sql = "update announcement set title=?, detail=? where id=?"; sql = "update announcement set title=?, detail=? where id=?"; // 设置SQL更新语句
pstmt = connection.prepareStatement(sql); pstmt = connection.prepareStatement(sql); // 创建预编译语句对象
pstmt.setString(1, tit); pstmt.setString(1, tit); // 设置第一个参数为公告标题
pstmt.setString(2, det); pstmt.setString(2, det); // 设置第二个参数为公告详情
pstmt.setString(3, id); pstmt.setString(3, id); // 设置第三个参数为公告ID
result = pstmt.executeUpdate(); result = pstmt.executeUpdate(); // 执行更新操作并获取影响的行数
// 返回数据 // 返回数据
if (result == 1) { if (result == 1) { // 如果更新操作成功
code = 0; code = 0; // 设置状态码为0表示成功
msg = "修改成功"; msg = "修改成功"; // 设置消息提示为"修改成功"
} else { } else { // 如果更新操作失败
msg = "修改失败"; msg = "修改失败"; // 设置消息提示为"修改失败"
} }
} catch (ClassNotFoundException e) { } catch (ClassNotFoundException e) { // 捕获类未找到异常
msg = "class not found"; msg = "class not found"; // 设置消息提示为"class not found"
} catch (SQLException e) { } catch (SQLException e) { // 捕获SQL异常
msg = "sql错误"; msg = "sql错误"; // 设置消息提示为"sql错误"
} finally { } finally {
try { try {
Base.closeResource(connection, pstmt, resultSet); Base.closeResource(connection, pstmt, resultSet); // 关闭数据库资源
} catch (SQLException e) { } catch (SQLException e) { // 捕获关闭资源时的SQL异常
e.printStackTrace(); e.printStackTrace(); // 打印堆栈跟踪信息
} }
} }
out.print(Util.jsonResponse(code, msg, null)); out.print(Util.jsonResponse(code, msg, null)); // 输出JSON响应
} }
} }

105
src/servlet/manager/BorrowTable.java
Unescape View File

@ -21,19 +21,22 @@ import net.sf.json.JSONObject;
public class BorrowTable extends HttpServlet { public class BorrowTable extends HttpServlet {
@Override @Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
// 设置响应内容类型和字符编码
resp.setContentType("application/json; charset=utf8"); resp.setContentType("application/json; charset=utf8");
// 接收参数 // 接收参数
String limit = req.getParameter("limit"); String limit = req.getParameter("limit"); // 每页显示的记录数
String page = req.getParameter("page"); String page = req.getParameter("page"); // 当前页码
String condition = (String) req.getParameter("condition"); String condition = (String) req.getParameter("condition"); // 查询条件字段
String conditionValue = (String) req.getParameter("conditionValue"); String conditionValue = (String) req.getParameter("conditionValue"); // 查询条件值
String where = ""; // 无限制条件 String where = ""; // 无限制条件
if (page == null) { if (page == null) {
page = "1"; page = "1"; // 默认第一页
} }
if (limit == null) { if (limit == null) {
limit = "10"; limit = "10"; // 默认每页10条记录
} }
// 准备查询 // 准备查询
Connection connection = null; Connection connection = null;
PreparedStatement pstmt = null; PreparedStatement pstmt = null;
@ -42,30 +45,32 @@ public class BorrowTable extends HttpServlet {
ResultSet countSet = null; ResultSet countSet = null;
String sql = ""; String sql = "";
String countSql = ""; String countSql = "";
// 准备返回参数 // 准备返回参数
int code = 1; int code = 1; // 状态码，1表示失败，0表示成功
String msg = "无数据"; String msg = "无数据"; // 提示信息
int count = 0; int count = 0; // 总记录数
JSONObject jsonData = new JSONObject(); // 单条记录的JSON对象
JSONArray jsonArray = new JSONArray(); // 所有记录的JSON数组
JSONObject jsonResult = new JSONObject(); // 最终返回的JSON对象
JSONObject jsonData = new JSONObject();
JSONArray jsonArray = new JSONArray();
JSONObject jsonResult = new JSONObject();
// 进行查询 // 进行查询
try { try {
connection = (Connection) Base.getConnection(); connection = (Connection) Base.getConnection(); // 获取数据库连接
sql = "select * from borrow_books where manager_id is not null"; sql = "select * from borrow_books where manager_id is not null"; // SQL查询语句
if (condition != null && conditionValue != null && !condition.equals("") && !conditionValue.equals("")) { if (condition != null && conditionValue != null && !condition.equals("") && !conditionValue.equals("")) {
where = " and " + condition + " like '%" + conditionValue + "%' "; where = " and " + condition + " like '%" + conditionValue + "%' "; // 添加查询条件
sql += where; sql += where; // 拼接查询条件到SQL语句中
} }
sql += " limit ?,?";// 1 10 (1-1)*10 sql += " limit ?,?"; // 分页查询，占位符用于防止SQL注入
System.out.println("???" + sql); System.out.println("???" + sql); // 打印调试信息
pstmt = connection.prepareStatement(sql); pstmt = connection.prepareStatement(sql); // 预编译SQL语句
pstmt.setInt(1, (Integer.parseInt(page) - 1) * Integer.parseInt(limit)); pstmt.setInt(1, (Integer.parseInt(page) - 1) * Integer.parseInt(limit)); // 设置第一个占位符的值（起始记录）
pstmt.setInt(2, Integer.parseInt(limit)); pstmt.setInt(2, Integer.parseInt(limit)); // 设置第二个占位符的值（每页记录数）
resultSet = pstmt.executeQuery(); resultSet = pstmt.executeQuery(); // 执行查询并获取结果集
while (resultSet.next()) { while (resultSet.next()) { // 遍历结果集
jsonData.put("id", resultSet.getString("id")); jsonData.put("id", resultSet.getString("id")); // 将每条记录的各个字段添加到JSON对象中
jsonData.put("card_id", resultSet.getString("card_id")); jsonData.put("card_id", resultSet.getString("card_id"));
jsonData.put("book_id", resultSet.getString("book_id")); jsonData.put("book_id", resultSet.getString("book_id"));
jsonData.put("borrow_date", resultSet.getString("borrow_date")); jsonData.put("borrow_date", resultSet.getString("borrow_date"));
@ -73,40 +78,38 @@ public class BorrowTable extends HttpServlet {
jsonData.put("return_date", resultSet.getString("return_date")); jsonData.put("return_date", resultSet.getString("return_date"));
jsonData.put("illegal", resultSet.getString("illegal")); jsonData.put("illegal", resultSet.getString("illegal"));
jsonData.put("manager_id", resultSet.getString("manager_id")); jsonData.put("manager_id", resultSet.getString("manager_id"));
jsonArray.add(jsonData); jsonArray.add(jsonData); // 将JSON对象添加到JSON数组中
} }
countSql = "select count(*) as count from borrow_books where manager_id is not null"; countSql = "select count(*) as count from borrow_books where manager_id is not null"; // 统计总记录数的SQL语句
countSql += where; countSql += where; // 添加查询条件到统计SQL语句中
countPstmt = connection.prepareStatement(countSql); countPstmt = connection.prepareStatement(countSql); // 预编译统计SQL语句
countSet = countPstmt.executeQuery(); countSet = countPstmt.executeQuery(); // 执行统计查询并获取结果集
if (countSet.next()) { if (countSet.next()) { // 如果结果集中有数据
count = countSet.getInt("count"); count = countSet.getInt("count"); // 获取总记录数
} }
if (!jsonArray.isEmpty()) { if (!jsonArray.isEmpty()) { // 如果查询结果不为空
code = 0; code = 0; // 设置状态码为0表示成功
msg = "查询成功"; msg = "查询成功"; // 设置提示信息为查询成功
} }
} catch (ClassNotFoundException e) { } catch (ClassNotFoundException e) { // 捕获类未找到异常
msg = "class没找到"; msg = "class没找到"; // 设置提示信息为类未找到
} catch (SQLException e) { } catch (SQLException e) { // 捕获SQL异常
msg = "sql错误"; msg = "sql错误"; // 设置提示信息为SQL错误
} finally { } finally { // 关闭资源
try { try {
Base.closeResource(null, pstmt, resultSet); Base.closeResource(null, pstmt, resultSet); // 关闭PreparedStatement和ResultSet资源
Base.closeResource(connection, countPstmt, countSet); Base.closeResource(connection, countPstmt, countSet); // 关闭Connection、PreparedStatement和ResultSet资源
} catch (SQLException e) { } catch (SQLException e) { // 捕获SQL异常
msg = "关闭资源失败"; msg = "关闭资源失败"; // 设置提示信息为关闭资源失败
} }
} }
// 返回数据 // 返回数据
jsonResult.put("code", code); jsonResult.put("code", code); // 将状态码添加到返回的JSON对象中
jsonResult.put("count", count); jsonResult.put("count", count); // 将总记录数添加到返回的JSON对象中
jsonResult.put("msg", msg); jsonResult.put("msg", msg); // 将提示信息添加到返回的JSON对象中
jsonResult.put("data", jsonArray.toArray()); jsonResult.put("data", jsonArray.toArray()); // 将查询结果添加到返回的JSON对象中
PrintWriter out = resp.getWriter(); PrintWriter out = resp.getWriter(); // 获取输出流
out.print(jsonResult.toString()); out.print(jsonResult.toString()); // 输出JSON字符串
} }
} }

42
src/servlet/manager/ManagerLogin.java
Unescape View File

@ -15,44 +15,44 @@ import javax.servlet.http.HttpSession;
import javabean.Manager; import javabean.Manager;
import net.sf.json.JSONObject; import net.sf.json.JSONObject;
@WebServlet("/managerLogin") @WebServlet("/managerLogin") // 定义Servlet的URL映射
public class ManagerLogin extends HttpServlet { public class ManagerLogin extends HttpServlet {
protected void doGet(HttpServletRequest request, HttpServletResponse response) protected void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException { throws ServletException, IOException {
response.getWriter().append("Served at: ").append(request.getContextPath()); response.getWriter().append("Served at: ").append(request.getContextPath()); // 处理GET请求，返回简单的响应
} }
protected void doPost(HttpServletRequest request, HttpServletResponse response) protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException { throws ServletException, IOException {
// 设置头文件 // 设置响应内容类型和字符编码
response.setContentType("application/json; charset=utf8"); response.setContentType("application/json; charset=utf8");
PrintWriter out = response.getWriter(); PrintWriter out = response.getWriter(); // 获取输出流
// 获取账号密码 // 从请求中获取用户名和密码参数
String user = request.getParameter("user"); String user = request.getParameter("user");
String psw = request.getParameter("psw"); String psw = request.getParameter("psw");
// 设置响应map // 创建一个HashMap来存储响应数据
HashMap<String, Object> hashMap = new HashMap<String, Object>(); HashMap<String, Object> hashMap = new HashMap<String, Object>();
Manager manager = new Manager(); Manager manager = new Manager(); // 创建Manager对象
String result = null; String result = null; // 用于存储登录结果
try { try {
result = manager.login(user, psw); result = manager.login(user, psw); // 调用Manager对象的login方法进行登录验证
} catch (ClassNotFoundException | SQLException e) { } catch (ClassNotFoundException | SQLException e) {
e.printStackTrace(); e.printStackTrace(); // 捕获并打印异常信息
} }
if (result.equals("1")) { if (result.equals("1")) { // 如果登录成功
HttpSession session = request.getSession(); HttpSession session = request.getSession(); // 获取当前会话
session.setAttribute("manager", user); session.setAttribute("manager", user); // 在会话中存储用户名
session.setAttribute("manager_first", "1"); // 登录 session.setAttribute("manager_first", "1"); // 标记为首次登录
hashMap.put("code", 0); hashMap.put("code", 0); // 设置响应码为0表示成功
hashMap.put("msg", "登录成功"); hashMap.put("msg", "登录成功"); // 设置响应消息为登录成功
hashMap.put("url", request.getContextPath() + "/manager/01nav.jsp"); hashMap.put("url", request.getContextPath() + "/manager/01nav.jsp"); // 设置跳转URL
} else { } else { // 如果登录失败
hashMap.put("code", 1); hashMap.put("code", 1); // 设置响应码为1表示失败
hashMap.put("msg", result); hashMap.put("msg", result); // 设置响应消息为错误信息
} }
// response.sendRedirect(request.getContextPath() +"/test.jsp"); // 将HashMap转换为JSON对象并写入响应
JSONObject json = JSONObject.fromObject(hashMap); JSONObject json = JSONObject.fromObject(hashMap);
out.write(json.toString()); out.write(json.toString());

32
src/servlet/manager/Quit.java
Unescape View File

@ -1,29 +1,29 @@
package servlet.manager; package servlet.manager; // 定义包名
import java.io.IOException; import java.io.IOException; // 导入IOException类
import javax.servlet.ServletException; import javax.servlet.ServletException; // 导入ServletException类
import javax.servlet.annotation.WebServlet; import javax.servlet.annotation.WebServlet; // 导入WebServlet注解
import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServlet; // 导入HttpServlet类
import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletRequest; // 导入HttpServletRequest类
import javax.servlet.http.HttpServletResponse; import javax.servlet.http.HttpServletResponse; // 导入HttpServletResponse类
import javax.servlet.http.HttpSession; import javax.servlet.http.HttpSession; // 导入HttpSession类
/** /**
* Servlet implementation class Quit * Servlet implementation class Quit
*/ */
@WebServlet("/manager/quit") @WebServlet("/manager/quit") // 定义Servlet的URL映射
public class Quit extends HttpServlet { public class Quit extends HttpServlet { // 继承HttpServlet类
private static final long serialVersionUID = 1L; private static final long serialVersionUID = 1L; // 序列化版本号
@Override @Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { // 重写doGet方法
// TODO Auto-generated method stub // TODO Auto-generated method stub
HttpSession session = req.getSession(); HttpSession session = req.getSession(); // 获取当前会话
if (session.getAttribute("manager") != null) { if (session.getAttribute("manager") != null) { // 如果会话中存在"manager"属性
session.removeAttribute("manager"); session.removeAttribute("manager"); // 移除"manager"属性
} }
resp.sendRedirect(req.getContextPath() + "/loginManager.html"); resp.sendRedirect(req.getContextPath() + "/loginManager.html"); // 重定向到登录页面
} }
} }

134
src/servlet/manager/ReturnTable.java
Unescape View File

@ -20,94 +20,94 @@ import net.sf.json.JSONObject;
/** /**
* Servlet implementation class ReturnTable * Servlet implementation class ReturnTable
*/ */
@WebServlet("/manager/returnTable") @WebServlet("/manager/returnTable") // 定义Servlet的URL映射
public class ReturnTable extends HttpServlet { public class ReturnTable extends HttpServlet { // 继承HttpServlet类
@Override @Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { // 重写doGet方法
resp.setContentType("application/json; charset=utf8"); resp.setContentType("application/json; charset=utf8"); // 设置响应内容类型为JSON，编码为UTF-8
// 接收参数 // 接收参数
String limit = req.getParameter("limit"); String limit = req.getParameter("limit"); // 获取请求中的limit参数
String page = req.getParameter("page"); String page = req.getParameter("page"); // 获取请求中的page参数
String condition = (String) req.getParameter("condition"); String condition = (String) req.getParameter("condition"); // 获取请求中的condition参数
String conditionValue = (String) req.getParameter("conditionValue"); String conditionValue = (String) req.getParameter("conditionValue"); // 获取请求中的conditionValue参数
String where = ""; // 无限制条件 String where = ""; // 初始化where子句为空字符串
if (page == null) { if (page == null) { // 如果page参数为空
page = "1"; page = "1"; // 默认设置为1
} }
if (limit == null) { if (limit == null) { // 如果limit参数为空
limit = "10"; limit = "10"; // 默认设置为10
} }
// 准备查询 // 准备查询
Connection connection = null; Connection connection = null; // 数据库连接对象
PreparedStatement pstmt = null; PreparedStatement pstmt = null; // 预编译SQL语句对象
PreparedStatement countPstmt = null; PreparedStatement countPstmt = null; // 用于计数的预编译SQL语句对象
ResultSet resultSet = null; ResultSet resultSet = null; // 结果集对象
ResultSet countSet = null; ResultSet countSet = null; // 计数结果集对象
String sql = ""; String sql = ""; // SQL查询语句
String countSql = ""; String countSql = ""; // 计数SQL查询语句
// 准备返回参数 // 准备返回参数
int code = 1; int code = 1; // 返回代码，默认为1表示失败
String msg = "无数据"; String msg = "无数据"; // 返回消息，默认为"无数据"
int count = 0; int count = 0; // 总记录数
JSONObject jsonData = new JSONObject(); JSONObject jsonData = new JSONObject(); // JSON对象，用于存储单条记录的数据
JSONArray jsonArray = new JSONArray(); JSONArray jsonArray = new JSONArray(); // JSON数组，用于存储所有记录的数据
JSONObject jsonResult = new JSONObject(); JSONObject jsonResult = new JSONObject(); // JSON对象，用于返回最终结果
// 进行查询 // 进行查询
try { try {
connection = (Connection) Base.getConnection(); connection = (Connection) Base.getConnection(); // 获取数据库连接
sql = "select * from borrow_books where manager_id is null"; sql = "select * from borrow_books where manager_id is null"; // 基础查询语句
if (condition != null && conditionValue != null && !condition.equals("") && !conditionValue.equals("")) { if (condition != null && conditionValue != null && !condition.equals("") && !conditionValue.equals("")) { // 如果存在条件
where = " and " + condition + " like '%" + conditionValue + "%' "; where = " and " + condition + " like '%" + conditionValue + "%' "; // 拼接where子句
sql += where; sql += where; // 将where子句添加到查询语句中
} }
sql += " limit ?,?";// 1 10 (1-1)*10 sql += " limit ?,?"; // 添加分页限制
System.out.println("???" + sql); System.out.println("???" + sql); // 打印调试信息
pstmt = connection.prepareStatement(sql); pstmt = connection.prepareStatement(sql); // 预编译SQL语句
pstmt.setInt(1, (Integer.parseInt(page) - 1) * Integer.parseInt(limit)); pstmt.setInt(1, (Integer.parseInt(page) - 1) * Integer.parseInt(limit)); // 设置第一个参数（偏移量）
pstmt.setInt(2, Integer.parseInt(limit)); pstmt.setInt(2, Integer.parseInt(limit)); // 设置第二个参数（每页记录数）
resultSet = pstmt.executeQuery(); resultSet = pstmt.executeQuery(); // 执行查询
while (resultSet.next()) { while (resultSet.next()) { // 遍历结果集
jsonData.put("id", resultSet.getString("id")); jsonData.put("id", resultSet.getString("id")); // 获取并存储id字段
jsonData.put("card_id", resultSet.getString("card_id")); jsonData.put("card_id", resultSet.getString("card_id")); // 获取并存储card_id字段
jsonData.put("book_id", resultSet.getString("book_id")); jsonData.put("book_id", resultSet.getString("book_id")); // 获取并存储book_id字段
jsonData.put("borrow_date", resultSet.getString("borrow_date")); jsonData.put("borrow_date", resultSet.getString("borrow_date")); // 获取并存储borrow_date字段
jsonData.put("end_date", resultSet.getString("end_date")); jsonData.put("end_date", resultSet.getString("end_date")); // 获取并存储end_date字段
jsonArray.add(jsonData); jsonArray.add(jsonData); // 将当前记录添加到JSON数组中
} }
countSql = "select count(*) as count from borrow_books where manager_id is null"; countSql = "select count(*) as count from borrow_books where manager_id is null"; // 基础计数查询语句
countSql += where; countSql += where; // 添加where子句到计数查询语句中
countPstmt = connection.prepareStatement(countSql); countPstmt = connection.prepareStatement(countSql); // 预编译计数SQL语句
countSet = countPstmt.executeQuery(); countSet = countPstmt.executeQuery(); // 执行计数查询
if (countSet.next()) { if (countSet.next()) { // 如果计数结果集有数据
count = countSet.getInt("count"); count = countSet.getInt("count"); // 获取总记录数
} }
if (!jsonArray.isEmpty()) { if (!jsonArray.isEmpty()) { // 如果JSON数组不为空
code = 0; code = 0; // 设置返回代码为0表示成功
msg = "查询成功"; msg = "查询成功"; // 设置返回消息为"查询成功"
} }
} catch (ClassNotFoundException e) { } catch (ClassNotFoundException e) { // 捕获类未找到异常
msg = "class没找到"; msg = "class没找到"; // 设置错误消息
} catch (SQLException e) { } catch (SQLException e) { // 捕获SQL异常
msg = "sql错误"; msg = "sql错误"; // 设置错误消息
} finally { } finally {
try { try {
Base.closeResource(null, pstmt, resultSet); Base.closeResource(null, pstmt, resultSet); // 关闭资源
Base.closeResource(connection, countPstmt, countSet); Base.closeResource(connection, countPstmt, countSet); // 关闭资源
} catch (SQLException e) { } catch (SQLException e) { // 捕获SQL异常
msg = "关闭资源失败"; msg = "关闭资源失败"; // 设置错误消息
} }
} }
// 返回数据 // 返回数据
jsonResult.put("code", code); jsonResult.put("code", code); // 将返回代码添加到JSON结果中
jsonResult.put("count", count); jsonResult.put("count", count); // 将总记录数添加到JSON结果中
jsonResult.put("msg", msg); jsonResult.put("msg", msg); // 将返回消息添加到JSON结果中
jsonResult.put("data", jsonArray.toArray()); jsonResult.put("data", jsonArray.toArray()); // 将数据添加到JSON结果中
PrintWriter out = resp.getWriter(); PrintWriter out = resp.getWriter(); // 获取输出流
out.print(jsonResult.toString()); out.print(jsonResult.toString()); // 输出JSON结果
} }
/** /**

81
src/servlet/reader/Book.java
Unescape View File

@ -24,20 +24,25 @@ import net.sf.json.JSONObject;
public class Book extends HttpServlet { public class Book extends HttpServlet {
@Override @Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
// 设置响应内容类型为JSON，字符编码为UTF-8
resp.setContentType("application/json; charset=utf8"); resp.setContentType("application/json; charset=utf8");
// 接收参数
String limit = req.getParameter("limit"); // 接收请求参数
String page = req.getParameter("page"); String limit = req.getParameter("limit"); // 每页显示的记录数
String condition = (String) req.getParameter("condition"); String page = req.getParameter("page"); // 当前页码
String conditionValue = (String) req.getParameter("conditionValue"); String condition = (String) req.getParameter("condition"); // 查询条件字段
String where = ""; // 无限制条件 String conditionValue = (String) req.getParameter("conditionValue"); // 查询条件值
String where = ""; // SQL查询条件字符串
// 默认分页参数
if (page == null) { if (page == null) {
page = "1"; page = "1";
} }
if (limit == null) { if (limit == null) {
limit = "10"; limit = "10";
} }
// 准备查询
// 数据库连接和SQL语句准备
Connection connection = null; Connection connection = null;
PreparedStatement pstmt = null; PreparedStatement pstmt = null;
PreparedStatement countPstmt = null; PreparedStatement countPstmt = null;
@ -45,30 +50,44 @@ public class Book extends HttpServlet {
ResultSet countSet = null; ResultSet countSet = null;
String sql = ""; String sql = "";
String countSql = ""; String countSql = "";
// 准备返回参数
int code = 1;
String msg = "无数据";
int count = 0;
JSONObject jsonData = new JSONObject(); // 返回数据结构初始化
JSONArray jsonArray = new JSONArray(); int code = 1; // 状态码，1表示失败，0表示成功
JSONObject jsonResult = new JSONObject(); String msg = "无数据"; // 消息提示
// 进行查询 int count = 0; // 总记录数
JSONObject jsonData = new JSONObject(); // 单条记录的JSON对象
JSONArray jsonArray = new JSONArray(); // 所有记录的JSON数组
JSONObject jsonResult = new JSONObject(); // 最终返回的JSON对象
try { try {
// 获取数据库连接
connection = (Connection) Base.getConnection(); connection = (Connection) Base.getConnection();
sql = "select * from books "; sql = "select * from books ";
// 根据条件拼接SQL查询语句
if (condition != null && conditionValue != null && !condition.equals("") && !conditionValue.equals("")) { if (condition != null && conditionValue != null && !condition.equals("") && !conditionValue.equals("")) {
where = " where " + condition + " like '%" + conditionValue + "%' "; where = " where " + condition + " like '%" + conditionValue + "%' ";
sql += where; sql += where;
} }
sql += " limit ?,?";// 1 10 (1-1)*10 // 分页查询
sql += " limit ?,?"; // 计算偏移量和限制数量
pstmt = connection.prepareStatement(sql); pstmt = connection.prepareStatement(sql);
pstmt.setInt(1, (Integer.parseInt(page) - 1) * Integer.parseInt(limit)); pstmt.setInt(1, (Integer.parseInt(page) - 1) * Integer.parseInt(limit));
pstmt.setInt(2, Integer.parseInt(limit)); pstmt.setInt(2, Integer.parseInt(limit));
resultSet = pstmt.executeQuery(); resultSet = pstmt.executeQuery();
while (resultSet.next()) {
// 处理查询结果集
while (resultSet.next()) {
// 获取图书信息
String library = resultSet.getString("library_id"); String library = resultSet.getString("library_id");
String sortid = resultSet.getString("sort_id");
jsonData.put("id", resultSet.getString("id"));
jsonData.put("name", resultSet.getString("name"));
jsonData.put("author", resultSet.getString("author"));
jsonData.put("position", resultSet.getString("position"));
jsonData.put("status", resultSet.getString("status"));
jsonData.put("description", resultSet.getString("description"));
// 获取图书馆名称
String sql1 = "select * from library where ID =" + library; String sql1 = "select * from library where ID =" + library;
PreparedStatement pstmt1 = connection.prepareStatement(sql1); PreparedStatement pstmt1 = connection.prepareStatement(sql1);
ResultSet rs1 = pstmt1.executeQuery(); ResultSet rs1 = pstmt1.executeQuery();
@ -76,8 +95,9 @@ public class Book extends HttpServlet {
while (rs1.next()) { while (rs1.next()) {
lib = rs1.getString("name"); lib = rs1.getString("name");
} }
jsonData.put("library_id", lib);
String sortid = resultSet.getString("sort_id"); // 获取分类名称
String sql2 = "select * from book_sort where ID =" + sortid; String sql2 = "select * from book_sort where ID =" + sortid;
PreparedStatement pstmt2 = connection.prepareStatement(sql2); PreparedStatement pstmt2 = connection.prepareStatement(sql2);
ResultSet rs2 = pstmt2.executeQuery(); ResultSet rs2 = pstmt2.executeQuery();
@ -85,17 +105,12 @@ public class Book extends HttpServlet {
while (rs2.next()) { while (rs2.next()) {
sort = rs2.getString("name"); sort = rs2.getString("name");
} }
jsonData.put("id", resultSet.getString("id"));
jsonData.put("name", resultSet.getString("name"));
jsonData.put("author", resultSet.getString("author"));
jsonData.put("library_id", lib);
jsonData.put("sort_id", sort); jsonData.put("sort_id", sort);
jsonData.put("position", resultSet.getString("position"));
jsonData.put("status", resultSet.getString("status")); // 将单条记录添加到JSON数组中
jsonData.put("description", resultSet.getString("description"));
jsonArray.add(jsonData); jsonArray.add(jsonData);
} }
// 统计总记录数
countSql = "select count(*) as count from books "; countSql = "select count(*) as count from books ";
countSql += where; countSql += where;
countPstmt = connection.prepareStatement(countSql); countPstmt = connection.prepareStatement(countSql);
@ -104,28 +119,28 @@ public class Book extends HttpServlet {
count = countSet.getInt("count"); count = countSet.getInt("count");
} }
if (!jsonArray.isEmpty()) { if (!jsonArray.isEmpty()) {
code = 0; code = 0; // 查询成功
msg = "查询成功"; msg = "查询成功";
} }
} catch (ClassNotFoundException e) { } catch (ClassNotFoundException e) {
msg = "class没找到"; msg = "class没找到"; // 类未找到异常处理
} catch (SQLException e) { } catch (SQLException e) {
msg = "sql错误"; msg = "sql错误"; // SQL异常处理
} finally { } finally {
// 关闭资源
try { try {
Base.closeResource(null, pstmt, resultSet); Base.closeResource(null, pstmt, resultSet);
Base.closeResource(connection, countPstmt, countSet); Base.closeResource(connection, countPstmt, countSet);
} catch (SQLException e) { } catch (SQLException e) {
msg = "关闭资源失败"; msg = "关闭资源失败"; // 关闭资源异常处理
} }
} }
// 返回数据 // 构建返回的JSON对象
jsonResult.put("code", code); jsonResult.put("code", code);
jsonResult.put("count", count); jsonResult.put("count", count);
jsonResult.put("msg", msg); jsonResult.put("msg", msg);
jsonResult.put("data", jsonArray.toArray()); jsonResult.put("data", jsonArray.toArray());
// 输出JSON响应
PrintWriter out = resp.getWriter(); PrintWriter out = resp.getWriter();
out.print(jsonResult.toString()); out.print(jsonResult.toString());
} }

124
src/servlet/reader/Borrow.java
Unescape View File

@ -25,93 +25,93 @@ import net.sf.json.JSONObject;
public class Borrow extends HttpServlet { public class Borrow extends HttpServlet {
@Override @Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
//设置响应内容类型为JSON，编码格式为UTF-8
resp.setContentType("application/json; charset=utf8"); resp.setContentType("application/json; charset=utf8");
// 接收参数 // 接收分页参数
String limit = req.getParameter("limit"); String limit = req.getParameter("limit"); // 每页显示记录数
String page = req.getParameter("page"); String page = req.getParameter("page"); // 当前页码
String condition = (String) req.getParameter("condition"); String condition = (String) req.getParameter("condition"); // 查询条件字段名
String conditionValue = (String) req.getParameter("conditionValue"); String conditionValue = (String) req.getParameter("conditionValue"); // 查询条件值
String where = ""; // 无限制条件 String where = ""; // 初始化查询条件字符串
if (page == null) { if (page == null) {
page = "1"; page = "1"; // 默认第一页
} }
if (limit == null) { if (limit == null) {
limit = "10"; limit = "10"; // 默认每页显示10条记录
} }
// 准备查询 // 准备数据库连接和查询对象
Connection connection = null; Connection connection = null;
PreparedStatement pstmt = null; PreparedStatement pstmt = null;
PreparedStatement countPstmt = null; PreparedStatement countPstmt = null;
ResultSet resultSet = null; ResultSet resultSet = null;
ResultSet countSet = null; ResultSet countSet = null;
String sql = ""; String sql = ""; // SQL查询语句
String countSql = ""; String countSql = ""; // 统计总数SQL查询语句
// 准备返回参数 // 返回结果的参数
int code = 1; int code = 1; // 状态码，1表示失败，0表示成功
String msg = "无数据"; String msg = "无数据"; // 返回消息
int count = 0; int count = 0; // 总记录数
HttpSession session = req.getSession(); HttpSession session = req.getSession(); // 获取用户会话
JSONObject jsonData = new JSONObject(); JSONObject jsonData = new JSONObject(); // JSON对象，存储单条记录数据
JSONArray jsonArray = new JSONArray(); JSONArray jsonArray = new JSONArray(); // JSON数组，存储多条记录数据
JSONObject jsonResult = new JSONObject(); JSONObject jsonResult = new JSONObject(); // JSON对象，存储最终返回结果
// 进行查询 // 执行查询操作
try { try {
connection = (Connection) Base.getConnection(); connection = (Connection) Base.getConnection(); // 获取数据库连接
sql = "select * from borrow_books where card_id = " + session.getAttribute("reader"); sql = "select * from borrow_books where card_id = " + session.getAttribute("reader"); // 构建基本查询语句
if (condition != null && conditionValue != null && !condition.equals("") && !conditionValue.equals("")) { if (condition != null && conditionValue != null && !condition.equals("") && !conditionValue.equals("")) {
where = " and " + condition + " like '%" + conditionValue + "%' "; where = " and " + condition + " like '%" + conditionValue + "%' "; // 添加查询条件
sql += where; sql += where; // 拼接完整查询语句
} }
sql += " limit ?,?";// 1 10 (1-1)*10 sql += " limit ?,?"; // 添加分页限制
System.out.println("???" + sql); System.out.println("???" + sql); // 打印SQL查询语句（调试用）
pstmt = connection.prepareStatement(sql); pstmt = connection.prepareStatement(sql); // 预编译SQL查询语句
pstmt.setInt(1, (Integer.parseInt(page) - 1) * Integer.parseInt(limit)); pstmt.setInt(1, (Integer.parseInt(page) - 1) * Integer.parseInt(limit)); // 设置第一个参数：起始位置
pstmt.setInt(2, Integer.parseInt(limit)); pstmt.setInt(2, Integer.parseInt(limit)); // 设置第二个参数：每页显示记录数
resultSet = pstmt.executeQuery(); resultSet = pstmt.executeQuery(); // 执行查询，获取结果集
while (resultSet.next()) { while (resultSet.next()) {
jsonData.put("id", resultSet.getString("id")); jsonData.put("id", resultSet.getString("id")); // 获取并存储记录ID
jsonData.put("card_id", resultSet.getString("card_id")); jsonData.put("card_id", resultSet.getString("card_id")); // 获取并存储读者ID
jsonData.put("book_id", resultSet.getString("book_id")); jsonData.put("book_id", resultSet.getString("book_id")); // 获取并存储书籍ID
jsonData.put("borrow_date", resultSet.getString("borrow_date")); jsonData.put("borrow_date", resultSet.getString("borrow_date")); // 获取并存储借阅日期
jsonData.put("end_date", resultSet.getString("end_date")); jsonData.put("end_date", resultSet.getString("end_date")); // 获取并存储到期日期
jsonData.put("return_date", resultSet.getString("return_date")); jsonData.put("return_date", resultSet.getString("return_date")); // 获取并存储归还日期
jsonArray.add(jsonData); jsonArray.add(jsonData); // 将记录添加到JSON数组中
} }
countSql = "select count(*) as count from borrow_books where card_id = " countSql = "select count(*) as count from borrow_books where card_id = " + req.getSession().getAttribute("reader"); // 构建统计总数SQL查询语句
+ req.getSession().getAttribute("reader"); countSql += where; // 拼接查询条件
countSql += where; countPstmt = connection.prepareStatement(countSql); // 预编译统计总数SQL查询语句
countPstmt = connection.prepareStatement(countSql); countSet = countPstmt.executeQuery(); // 执行查询，获取结果集
countSet = countPstmt.executeQuery();
if (countSet.next()) { if (countSet.next()) {
count = countSet.getInt("count"); count = countSet.getInt("count"); // 获取总记录数
} }
if (!jsonArray.isEmpty()) { if (!jsonArray.isEmpty()) { // 如果JSON数组不为空，表示有数据
code = 0; code = 0; // 设置状态码为0，表示成功
msg = "查询成功"; msg = "查询成功"; // 设置返回消息为“查询成功”
} }
} catch (ClassNotFoundException e) { } catch (ClassNotFoundException e) { // 捕获类未找到异常
msg = "class没找到"; msg = "class没找到"; // 设置返回消息为“class没找到”
} catch (SQLException e) { } catch (SQLException e) { // 捕获SQL异常
msg = "sql错误"; msg = "sql错误"; // 设置返回消息为“sql错误”
} finally { } finally { // 最终块，用于关闭资源
try { try {
Base.closeResource(null, pstmt, resultSet); Base.closeResource(null, pstmt, resultSet); // 关闭查询语句和结果集
Base.closeResource(connection, countPstmt, countSet); Base.closeResource(connection, countPstmt, countSet); // 关闭数据库连接和统计结果集
} catch (SQLException e) { } catch (SQLException e) { // 捕获SQL异常
msg = "关闭资源失败"; msg = "关闭资源失败"; // 设置返回消息为“关闭资源失败”
} }
} }
// 返回数据 // 将结果封装成JSON对象并输出到响应中
jsonResult.put("code", code); jsonResult.put("code", code); // 添加状态码到JSON对象中
jsonResult.put("count", count); jsonResult.put("count", count); // 添加总记录数到JSON对象中
jsonResult.put("msg", msg); jsonResult.put("msg", msg); // 添加返回消息到JSON对象中
jsonResult.put("data", jsonArray.toArray()); jsonResult.put("data", jsonArray.toArray()); // 添加数据数组到JSON对象中
PrintWriter out = resp.getWriter(); PrintWriter out = resp.getWriter(); // 获取响应输出流
out.print(jsonResult.toString()); out.print(jsonResult.toString()); // 输出JSON结果到响应中
} }
} }

5
src/servlet/reader/Exit.java
Unescape View File

@ -19,11 +19,14 @@ public class Exit extends HttpServlet {
@Override @Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
// TODO Auto-generated method stub // TODO Auto-generated method stub
// 获取当前请求的会话对象。如果会话不存在，则创建一个新的会话。
HttpSession session = req.getSession(); HttpSession session = req.getSession();
// 检查会话中是否存在名为 "reader" 的属性。
if (session.getAttribute("reader") != null) { if (session.getAttribute("reader") != null) {
// 如果存在，则移除该属性。
session.removeAttribute("reader"); session.removeAttribute("reader");
} }
// 重定向到指定的 JSP 页面。
resp.sendRedirect(req.getContextPath() + "/reader/04readerFrame.jsp"); resp.sendRedirect(req.getContextPath() + "/reader/04readerFrame.jsp");
} }
} }

88
src/servlet/reader/Illegal.java
Unescape View File

@ -25,52 +25,66 @@ import net.sf.json.JSONObject;
public class Illegal extends HttpServlet { public class Illegal extends HttpServlet {
@Override @Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
// 设置响应内容类型为 JSON，并指定字符编码为 UTF-8
resp.setContentType("application/json; charset=utf8"); resp.setContentType("application/json; charset=utf8");
// 接收参数
String limit = req.getParameter("limit"); // 接收请求参数
String page = req.getParameter("page"); String limit = req.getParameter("limit"); // 每页显示记录数
String condition = (String) req.getParameter("condition"); String page = req.getParameter("page"); // 当前页码
String conditionValue = (String) req.getParameter("conditionValue"); String condition = (String) req.getParameter("condition"); // 查询条件字段
String where = ""; // 无限制条件 String conditionValue = (String) req.getParameter("conditionValue"); // 查询条件值
String where = ""; // 初始化查询条件字符串
// 如果未提供分页参数，则使用默认值
if (page == null) { if (page == null) {
page = "1"; page = "1"; // 默认第一页
} }
if (limit == null) { if (limit == null) {
limit = "10"; limit = "10"; // 默认每页显示10条记录
} }
// 准备查询
// 准备数据库连接和查询对象
Connection connection = null; Connection connection = null;
PreparedStatement pstmt = null; PreparedStatement pstmt = null;
PreparedStatement countPstmt = null; PreparedStatement countPstmt = null;
ResultSet resultSet = null; ResultSet resultSet = null;
ResultSet countSet = null; ResultSet countSet = null;
String sql = ""; String sql = ""; // SQL 查询语句
String countSql = ""; String countSql = ""; // 统计总记录数的 SQL 查询语句
// 准备返回参数
int code = 1; // 准备返回结果的参数
String msg = "无数据"; int code = 1; // 状态码，1表示失败，0表示成功
int count = 0; String msg = "无数据"; // 返回消息
HttpSession session = req.getSession(); int count = 0; // 总记录数
HttpSession session = req.getSession(); // 获取会话对象
// 用于存储查询结果的 JSON 对象和数组
JSONObject jsonData = new JSONObject(); JSONObject jsonData = new JSONObject();
JSONArray jsonArray = new JSONArray(); JSONArray jsonArray = new JSONArray();
JSONObject jsonResult = new JSONObject(); JSONObject jsonResult = new JSONObject();
// 进行查询
// 进行数据库查询操作
try { try {
// 获取数据库连接
connection = (Connection) Base.getConnection(); connection = (Connection) Base.getConnection();
sql = "select * from borrow_books where ILLEGAL is not null and length(trim(illegal))>0 AND CARD_ID = " // 构建 SQL 查询语句，查询借阅记录中存在违规信息的记录
+ session.getAttribute("reader"); sql = "select * from borrow_books where ILLEGAL is not null and length(trim(illegal))>0 AND CARD_ID = " + session.getAttribute("reader");
// 如果提供了查询条件，则添加到 SQL 查询语句中
if (condition != null && conditionValue != null && !condition.equals("") && !conditionValue.equals("")) { if (condition != null && conditionValue != null && !condition.equals("") && !conditionValue.equals("")) {
where = " and " + condition + " like '%" + conditionValue + "%' "; where = " and " + condition + " like '%" + conditionValue + "%' ";
sql += where; sql += where;
} }
sql += " limit ?,?";// 1 10 (1-1)*10 // 添加分页限制条件
System.out.println("???" + sql); sql += " limit ?,?"; // 例如：limit 1,10 (1-1)*10
System.out.println("???" + sql); // 打印 SQL 查询语句（调试用）
pstmt = connection.prepareStatement(sql); pstmt = connection.prepareStatement(sql);
// 设置分页参数，计算起始位置和每页记录数
pstmt.setInt(1, (Integer.parseInt(page) - 1) * Integer.parseInt(limit)); pstmt.setInt(1, (Integer.parseInt(page) - 1) * Integer.parseInt(limit));
pstmt.setInt(2, Integer.parseInt(limit)); pstmt.setInt(2, Integer.parseInt(limit));
// 执行查询并处理结果集
resultSet = pstmt.executeQuery(); resultSet = pstmt.executeQuery();
while (resultSet.next()) { while (resultSet.next()) {
// 将查询结果集中的每一行数据存入 JSON 对象中，并添加到 JSON 数组中
jsonData.put("id", resultSet.getString("id")); jsonData.put("id", resultSet.getString("id"));
jsonData.put("card_id", resultSet.getString("card_id")); jsonData.put("card_id", resultSet.getString("card_id"));
jsonData.put("book_id", resultSet.getString("book_id")); jsonData.put("book_id", resultSet.getString("book_id"));
@ -81,39 +95,39 @@ public class Illegal extends HttpServlet {
jsonData.put("manager_id", resultSet.getString("manager_id")); jsonData.put("manager_id", resultSet.getString("manager_id"));
jsonArray.add(jsonData); jsonArray.add(jsonData);
} }
countSql = "select count(*) as count from borrow_books where ILLEGAL is not null and length(trim(illegal))>0 AND CARD_ID = " // 构建统计总记录数的 SQL 查询语句，并执行查询以获取总记录数
+ session.getAttribute("reader"); countSql = "select count(*) as count from borrow_books where ILLEGAL is not null and length(trim(illegal))>0 AND CARD_ID = " + session.getAttribute("reader");
countSql += where; countSql += where;
countPstmt = connection.prepareStatement(countSql); countPstmt = connection.prepareStatement(countSql);
countSet = countPstmt.executeQuery(); countSet = countPstmt.executeQuery();
if (countSet.next()) { if (countSet.next()) {
count = countSet.getInt("count"); count = countSet.getInt("count"); // 获取总记录数
} }
// 如果查询结果不为空，则更新状态码和消息
if (!jsonArray.isEmpty()) { if (!jsonArray.isEmpty()) {
code = 0; code = 0; // 查询成功
msg = "查询成功"; msg = "查询成功";
} }
} catch (ClassNotFoundException e) { } catch (ClassNotFoundException e) {
msg = "class没找到"; msg = "class没找到"; // 捕获类未找到异常并设置错误消息
} catch (SQLException e) { } catch (SQLException e) {
msg = "sql错误"; msg = "sql错误"; // 捕获 SQL 异常并设置错误消息
} finally { } finally {
// 关闭数据库资源
try { try {
Base.closeResource(null, pstmt, resultSet); Base.closeResource(null, pstmt, resultSet);
Base.closeResource(connection, countPstmt, countSet); Base.closeResource(connection, countPstmt, countSet);
} catch (SQLException e) { } catch (SQLException e) {
msg = "关闭资源失败"; msg = "关闭资源失败"; // 捕获关闭资源时的异常并设置错误消息
} }
} }
// 返回数据 // 将查询结果封装到 JSON 对象中并返回给客户端
jsonResult.put("code", code); jsonResult.put("code", code); // 状态码
jsonResult.put("count", count); jsonResult.put("count", count); // 总记录数
jsonResult.put("msg", msg); jsonResult.put("msg", msg); // 返回消息
jsonResult.put("data", jsonArray.toArray()); jsonResult.put("data", jsonArray.toArray()); // 查询结果数据
PrintWriter out = resp.getWriter(); PrintWriter out = resp.getWriter(); // 获取输出流对象
out.print(jsonResult.toString()); out.print(jsonResult.toString()); // 输出 JSON 字符串作为响应
} }
} }

28
src/servlet/reader/ReaderLogin.java
Unescape View File

@ -25,15 +25,18 @@ public class ReaderLogin extends HttpServlet {
protected void doPost(HttpServletRequest request, HttpServletResponse response) protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException { throws ServletException, IOException {
// 设置头文件 // 设置响应内容类型和字符编码
response.setContentType("application/json; charset=utf8"); response.setContentType("application/json; charset=utf8");
PrintWriter out = response.getWriter(); PrintWriter out = response.getWriter();
// 获取账号密码
// 获取请求参数中的账号和密码
String user = request.getParameter("user"); String user = request.getParameter("user");
String psw = request.getParameter("psw"); String psw = request.getParameter("psw");
// 设置响应map
// 创建一个HashMap用于存储响应数据
HashMap<String, Object> hashMap = new HashMap<String, Object>(); HashMap<String, Object> hashMap = new HashMap<String, Object>();
// 创建Reader对象并调用其login方法进行登录验证
Reader reader = new Reader(); Reader reader = new Reader();
String result = null; String result = null;
try { try {
@ -41,18 +44,23 @@ public class ReaderLogin extends HttpServlet {
} catch (ClassNotFoundException | SQLException e) { } catch (ClassNotFoundException | SQLException e) {
e.printStackTrace(); e.printStackTrace();
} }
// 根据登录结果设置响应数据
if (result != null && result.equals("1")) { if (result != null && result.equals("1")) {
// 登录成功，创建会话并设置相关属性
HttpSession session = request.getSession(); HttpSession session = request.getSession();
session.setAttribute("reader", user); session.setAttribute("reader", user);
session.setAttribute("reader_first", "1"); // 登录 session.setAttribute("reader_first", "1"); // 标记为首次登录
hashMap.put("code", 0); hashMap.put("code", 0); // 状态码0表示成功
hashMap.put("msg", "登录成功"); hashMap.put("msg", "登录成功"); // 提示信息
hashMap.put("url", request.getContextPath() + "/reader/01main.jsp"); hashMap.put("url", request.getContextPath() + "/reader/01main.jsp"); // 跳转页面
} else { } else {
hashMap.put("code", 1); // 登录失败，设置错误信息
hashMap.put("msg", result); hashMap.put("code", 1); // 状态码1表示失败
hashMap.put("msg", result); // 错误信息
} }
// response.sendRedirect(request.getContextPath() +"/test.jsp");
// 将响应数据转换为JSON格式并输出
JSONObject json = JSONObject.fromObject(hashMap); JSONObject json = JSONObject.fromObject(hashMap);
out.write(json.toString()); out.write(json.toString());

Write Preview
Loading…
Cancel
Save