Compare commits

..

No commits in common. 'develop' and 'main' have entirely different histories.

8
.idea/.gitignore vendored

@ -1,8 +0,0 @@
# 默认忽略的文件
/shelf/
/workspace.xml
# 基于编辑器的 HTTP 客户端请求
/httpRequests/
# Datasource local storage ignored files
/dataSources/
/dataSources.local.xml

@ -1,18 +0,0 @@
<component name="libraryTable">
<library name="lib">
<CLASSES>
<root url="jar://$PROJECT_DIR$/WebContent/WEB-INF/lib/mysql-connector-java-5.1.31-bin.jar!/" />
<root url="jar://$PROJECT_DIR$/WebContent/WEB-INF/lib/xom-1.2.6.jar!/" />
<root url="jar://$PROJECT_DIR$/WebContent/WEB-INF/lib/commons-lang-2.6.jar!/" />
<root url="jar://$PROJECT_DIR$/WebContent/WEB-INF/lib/json-lib-2.4-jdk15.jar!/" />
<root url="jar://$PROJECT_DIR$/WebContent/WEB-INF/lib/ezmorph-1.0.6.jar!/" />
<root url="jar://$PROJECT_DIR$/WebContent/WEB-INF/lib/javax.servlet-api-4.0.1.jar!/" />
<root url="jar://$PROJECT_DIR$/WebContent/WEB-INF/lib/commons-beanutils-1.8.0.jar!/" />
<root url="jar://$PROJECT_DIR$/WebContent/WEB-INF/lib/commons-logging-1.1.1.jar!/" />
<root url="jar://$PROJECT_DIR$/WebContent/WEB-INF/lib/commons-collections-3.2.1.jar!/" />
<root url="jar://$PROJECT_DIR$/WebContent/WEB-INF/lib/mysql-connector-java-8.0.18.jar!/" />
</CLASSES>
<JAVADOC />
<SOURCES />
</library>
</component>

@ -1,6 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ProjectRootManager" version="2" languageLevel="JDK_13" default="true" project-jdk-name="13" project-jdk-type="JavaSDK">
<output url="file://$PROJECT_DIR$/out" />
</component>
</project>

@ -1,8 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ProjectModuleManager">
<modules>
<module fileurl="file://$PROJECT_DIR$/library_manage_system.iml" filepath="$PROJECT_DIR$/library_manage_system.iml" />
</modules>
</component>
</project>

@ -1,4 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="VcsDirectoryMappings" defaultProject="true" />
</project>

@ -1,141 +1,149 @@
<%@page import="java.sql.ResultSet"%> <!-- 导入Java SQL包中的ResultSet类 --> <%@page import="java.sql.ResultSet"%>
<%@page import="javabean.JDBCBean"%> <!-- 导入自定义的JDBCBean类 --> <%@page import="javabean.JDBCBean"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> <!-- 设置页面语言为Java内容类型和字符编码为UTF-8 --> pageEncoding="UTF-8"%>
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <!-- 设置HTML文档的字符编码为UTF-8 --> <meta charset="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">
<script src="../public/layui/layui.js"></script>
<style> <style>
.layui-form{ .layui-form{
margin: 10px 20px; /* 设置表单的外边距 */ margin: 10px 20px;
} }
</style> </style>
</style> </style>
</head> </head>
<body> <body>
<% <%
ResultSet librarySet = null; //声明一个ResultSet对象用于存储图书馆数据 ResultSet librarySet = null;
ResultSet bookSortSet = null; // 声明一个ResultSet对象用于存储书籍分类数据 ResultSet bookSortSet = null;
// 获取图书馆列表 // 获取图书馆列表
JDBCBean db2 = new JDBCBean(); // 创建JDBCBean对象db2 JDBCBean db2 = new JDBCBean();
String librarySql = "select * from library"; // SQL查询语句选择所有图书馆记录 String librarySql = "select * from library";
librarySet = db2.executeQuery( librarySql ); // 执行SQL查询并将结果存储在librarySet中 librarySet = db2.executeQuery( librarySql );
// 获取书籍分类 // 获取书籍分类
JDBCBean db3 = new JDBCBean(); // 创建JDBCBean对象db3 JDBCBean db3 = new JDBCBean();
String bookSortSql = "select * from book_sort"; // SQL查询语句选择所有书籍分类记录 String bookSortSql = "select * from book_sort";
bookSortSet = db3.executeQuery( bookSortSql ); // 执行SQL查询并将结果存储在bookSortSet中 bookSortSet = db3.executeQuery( bookSortSql );
%> %>
<form class="layui-form layui-form-pane" action=""> <!-- 创建一个layui表单 --> <form class="layui-form layui-form-pane" action="">
<input type="id" name="id" value="3" class="layui-hide"> <!-- 隐藏输入框值为3 --> <input type="id" name="id" value="3" class="layui-hide">
<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>
</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") %>><%=bookSortSet.getString("name") %></option> <!-- 生成每个分类选项 --> <option value=<%=bookSortSet.getInt("id") %> ><%=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" 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"><div>可借</div></div> <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="0" title="不可借"><div class="layui-unselect layui-form-radio"><<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>
</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" lay-verify="content" id="LAY_demo_editor"></textarea> <!-- 书籍简介文本域 --> <textarea class="layui-textarea layui-hide" 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="" 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> <script>
layui.use(['form', 'jquery', 'layedit'], function(){
//layer.closeAll(); //关闭所有层
var form = layui.form, layui.use(['form', 'layedit', 'jquery'], function(){
layer = layui.layer, //layer.closeAll();
$ = layui.jquery; $ = layui.jquery;
var editIndex = layedit.build('LAY_demo_editor'); //建立编辑器 var form = layui.form
// 自定义验证规则 ,layer = layui.layer
form.verify({ ,layedit = layui.layedit;
content: function(value){ //解决富文本异步传输问题 var editIndex = layedit.build('LAY_demo_editor');
return layedit.sync(editIndex); // 自定义验证规则
} form.verify({
}); // 解决富文本异步传输问题
//监听提交 content: function(value){
form.on('submit(bookForm)', function(data){ return layedit.sync(editIndex);
$.ajax({ }
url: './bookAdd', //请求地址 })
method: 'post', //请求方式 //监听提交
data: data.field, //JSON.stringify(data), //发送的数据 form.on('submit(bookForm)', function(data){
dataType: 'JSON', //返回的数据类型 $.ajax({
success: function(data){ //成功回调函数 url: './bookAdd',
if(data.code == "0"){ method: 'post',
layer.msg("添加成功", { data: data.field, //JSON.stringify(data.field),
icon: 1, //图标 dataType: 'JSON',
time: 500 //显示时间 success: function(data){
}); if(data.code == "0"){
setTimeout(function(){ parent.layer.msg("添加成功",{
//parent.location.reload(); //操作父页面 icon: 6,
var index = parent.layer.getFrameIndex(window.name); //获取当前操作窗口的索引 time: 500
parent.layer.close(index); //关闭操作窗口 });
}, 500); setTimeout(function(){
}else{ //parent.location.reload();
layer.msg("添加失败"); //失败提示信息 var index = parent.layer.getFrameIndex(window.name); //操作父页面
} parent.layer.close(index);
} }, 500);
}) }else{
return false; //阻止表单跳转。如果需要表单跳转,去掉这段即可。 leyer.msg("添加失败");
}); }
}); }
})
return false;
});
});
</script> </script>
</body> </body>
</html> </html>

@ -1,82 +1,83 @@
<%@page import="javabean.Util"%> <!-- 导入自定义的Util类 --> <%@page import="javabean.Util"%>
<%@page import="javabean.Base"%> <!-- 导入自定义的Base类 --> <%@page import="javabean.Base"%>
<%@page import="java.sql.ResultSet"%> <!-- 导入ResultSet类用于处理SQL查询结果 --> <%@page import="java.sql.ResultSet"%>
<%@page import="java.sql.PreparedStatement"%> <!-- 导入PreparedStatement类用于执行预编译的SQL语句 --> <%@page import="java.sql.PreparedStatement"%>
<%@page import="java.sql.Connection"%> <!-- 导入Connection类用于建立数据库连接 --> <%@page import="java.sql.Connection"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!-- 设置页面语言为Java内容类型为HTML字符编码为UTF-8 --> <%@ page language="java" contentType="text/html; charset=UTF-8"
<!DOCTYPE html> <!-- 声明文档类型为HTML5 --> pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html> <html>
<head> <head>
<meta charset="UTF-8"> <!-- 设置HTML文档的字符编码为UTF-8 --> <meta charset="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">
<script src="../public/layui/layui.js" charset="utf-8"></script>
<style> <style>
.layui-table, .layui-table-view{ .layui-table, .layui-table-view{
margin-top: 0px; /* 设置表格顶部边距为0 */ margin-top: 0px;
} }
</style> </style>
</head> </head>
<body> <body>
<% <%
String id = request.getParameter("id"); // 获取请求参数中的id String id = request.getParameter("id");
String name = request.getParameter("name"); // 获取请求参数中的name String name = request.getParameter("name");
Connection connection = null; // 初始化数据库连接对象 Connection connection = null;
PreparedStatement pstmt = null; // 初始化预编译SQL语句对象 PreparedStatement pstmt = null;
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";
connection = (Connection)Base.getConnection(); // 获取数据库连接 connection = (Connection)Base.getConnection();
pstmt = connection.prepareStatement(sql); // 创建预编译SQL语句对象 pstmt = connection.prepareStatement(sql);
pstmt.setString(1,id); // 设置SQL语句中的第一个参数为id pstmt.setString(1,id);
resultSet = pstmt.executeQuery(); // 执行查询并获取结果集 resultSet = pstmt.executeQuery();
/* while(resultSet.next()){ /* while(resultSet.next()){
out.print(resultSet.getString("id")); // 输出结果集中的id字段 out.print(resultSet.getString("id"));
}*/ }*/
%> %>
<div class="layui-form"> <!-- Layui表单容器 --> <div class="layui-form">
<table class="layui-table"> <!-- Layui表格 --> <table class="layui-table">
<colgroup> <colgroup>
<col width="150"> <!-- 定义列宽为150px --> <col width="150">
<col width="150"> <!-- 定义列宽为150px --> <col width="150">
<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="200">
<col width="220"> <!-- 定义列宽为220px --> <col width="220">
<col width="200"> <!-- 定义列宽为200px --> <col width="200">
<col width="200"> <!-- 定义列宽为200px --> <col width="200">
</colgroup> </colgroup>
<thead> <thead>
<tr> <tr>
<th>ID</th> <!-- 表头单元格ID --> <th>ID</th>
<th>书籍ID</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>处理人</th>
</tr> </tr>
<%while(resultSet.next()){ %> <!-- 遍历结果集 --> <%while(resultSet.next()){ %>
<tr> <tr>
<td><%=resultSet.getString("id") %></td> <!-- 显示借阅记录的ID --> <td><%=resultSet.getString("id") %></td>
<td><%=id %></td> <!-- 显示书籍ID --> <td><%=id %></td>
<td><%=name %></td> <!-- 显示书籍名 --> <td><%=name %></td>
<td><%=resultSet.getString("borrow_card.id") %></td> <!-- 显示借阅证ID --> <td><%=resultSet.getString("borrow_card.id") %></td>
<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>
<td><%=resultSet.getString("manager_id") != null? resultSet.getString("manager_id") : "" %></td> <!-- 显示处理人ID如果为空则显示空字符串 --> <td><%=resultSet.getString("manager_id") != null? resultSet.getString("manager_id") : "" %></td>
</tr> </tr>
<%} %> <%} %>
</thead> </thead>
<tbody> <tbody>
<tr> <tr>
</tr> </tr>
</tbody> </tbody>
</table> </table>
</div> </div>
</body> </body>
</html> </html>

@ -1,167 +1,180 @@
<%@ 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">
<style> <script src="../public/layui/layui.js"></script>
.layui-form{
margin: 10px 20px; <style>
} .layui-form{
</style> margin: 10px 20px;
}
</style>
</head> </head>
<body> <body>
<%
//创建数据库操作对象
JDBCBean db = new JDBCBean();
// 获取请求参数中的id值并转换为整数类型
int id = Integer.parseInt(request.getParameter("id"));
ResultSet resultSet = null;
ResultSet librarySet = null;
ResultSet bookSortSet = null;
// SQL查询语句根据id查询书籍信息
String sql = "select * from books where id=" + id;
// 执行查询操作
resultSet = db.executeQuery(sql);
// 移动到结果集的第一行数据
resultSet.next();
// 获取书籍的各项属性值
String name = resultSet.getString("name");
String author = resultSet.getString("author");
int library_id = resultSet.getInt("library_id");
int sort_id = resultSet.getInt("sort_id");
String position = resultSet.getString("position");
int status = resultSet.getInt("status");
String description = resultSet.getString("description");
// 关闭数据库连接
db.close();
// 获取图书馆列表 <%
JDBCBean db2 = new JDBCBean(); JDBCBean db = new JDBCBean();
String librarySql = "select * from library"; int id = Integer.parseInt(request.getParameter("id"));
librarySet = db2.executeQuery(librarySql); ResultSet resultSet = null;
ResultSet librarySet = null;
ResultSet bookSortSet = null;
String sql = "select * from books where id=" +id ;
resultSet = db.executeQuery(sql);
resultSet.next();
String name = resultSet.getString("name");
String author = resultSet.getString("author");
int library_id = resultSet.getInt("library_id");
int sort_id = resultSet.getInt("sort_id");
String position = resultSet.getString("position");
int status = resultSet.getInt("status");
String description = resultSet.getString("description");
db.close();
// 获取图书馆列表
JDBCBean db2 = new JDBCBean();
String librarySql = "select * from library";
librarySet = db2.executeQuery( librarySql );
// 获取书籍分类列表
JDBCBean db3 = new JDBCBean(); // 获取书籍分类
String bookSortSql = "select * from book_sort"; JDBCBean db3 = new JDBCBean();
bookSortSet = db3.executeQuery(bookSortSql); String bookSortSql = "select * from book_sort";
%> bookSortSet = db3.executeQuery( bookSortSql );
<!-- 表单开始 -->
<form class="layui-form layui-form-pane " action=""> %>
<!-- 隐藏id -->
<input type="id" name="id" value=<%=id %> class="layui-hide"> <form class="layui-form layui-form-pane" action="">
<!-- 书名 --> <%-- 隐藏id --%>
<div class="layui-form-item"> <input type="id" name="id" value=<%=id %> class="layui-hide">
<label class="layui-form-label">书名</label> <!-- 书名 -->
<div class="layui-input-block"> <div class="layui-form-item">
<input type="text" name="name" value=<%=name %> required lay-verify="required" placeholder="请输入书名" autocomplete="off" class="layui-input"> <label class="layui-form-label">书名</label>
</div> <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 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="author" value=<%=author %> required lay-verify="required" placeholder="请输入作者" autocomplete="off" class="layui-input"> <div class="layui-input-block">
</div> <input type="text" name="author" value=<%=author %> required lay-verify="required" placeholder="请输入作者" autocomplete="off" class="layui-input">
</div> </div>
<!-- 图书馆 --> </div>
<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>
<select name="library_id" lay-verify="required"> <div class="layui-input-block">
<option value=""></option> <select name="library_id" lay-verify="required">
<% while(librarySet.next()){ %> <option value=""></option>
<!-- 选中原来的图书馆 --> <% 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> <%} %>
</div> </select>
</div> </div>
<!-- 分类 --> </div>
<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>
<select name="sort_id" lay-verify="required"> <div class="layui-input-block">
<option value=""></option> <select name="sort_id" lay-verify="required">
<% while(bookSortSet.next()){ %> <option value=""></option>
<!-- 选中原来的分类 --> <% 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"> <!-- 位置 -->
<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="position" value=<%=position %> required lay-verify="required" placeholder="请输入位置编号" autocomplete="off" class="layui-input"> <div class="layui-input-block">
</div> <input type="text" name="position" value=<%=position %> required lay-verify="required" placeholder="请输入位置编号" autocomplete="off" class="layui-input">
</div> </div>
<!-- 状态 --> </div>
<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="radio" name="status" value="1" title="可借" <%if(status==1) out.print("checked"); %>> <div class="layui-input-block">
<input type="radio" name="status" value="0" title="不可借" <%if(status==0) out.print("checked"); %> > <input type="radio" name="status" value="1" title="可借" <%if(status==1) out.print("checked"); %>>
</div> <input type="radio" name="status" value="0" title="不可借" <%if(status==0) out.print("checked"); %> >
</div> </div>
<!-- 书籍简介 --> </div>
<div class="layui-form-item layui-form-text">
<label class="layui-form-label">书籍简介</label> <div class="layui-form-item layui-form-text">
<div class="layui-input-block"> <label class="layui-form-label">书籍简介</label>
<textarea class="layui-textarea" name="description" id="LAY_demo_editor"><%=description %></textarea> <div class="layui-input-block">
</div> <textarea class="layui-textarea layui-hide" name="description" lay-verify="content" id="LAY_demo_editor"><%=description %></textarea>
</div> </div>
<div class="layui-form-item"> </div>
<div class="layui-input-block">
<button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button> <div class="layui-form-item">
<button type="reset" class="layui-btn layui-btn-primary">重置</button> <div class="layui-input-block">
</div> <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
</div> </div>
</div>
</form> </form>
<!-- layui脚本 --> <script>
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();
return false; //阻止表单跳转。如果需要表单跳转,去掉这段即可。 $ = layui.jquery;
}); 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>

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

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

@ -1,89 +1,92 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> // 设置页面的语言为Java字符编码为UTF-8,设置页面的编码为UTF-8 pageEncoding="UTF-8"%>
<!DOCTYPE html> <!-- 声明HTML文档类型为HTML5 --> <!DOCTYPE html>
<html lang="en"> <!-- 设置网页的语言为英语 --> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <!-- 设置字符集为UTF-8确保中文字符正确显示 --> <meta charset="UTF-8">
<title>借阅记录</title> <!-- 设置网页的标题为“借阅记录” --> <title>借阅记录</title>
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <!-- 引入layui的CSS文件 --> <link rel="stylesheet" href="../public/layui/css/layui.css" media="all">
<style> <style>
.layui-table,.layui-table-view{ // 自定义样式设置layui表格的外边距 .layui-table,.layui-table-view{
margin: 0 0px; // 设置表格的上下外边距为0 margin: 0 0px;
} }
</style> </style>
</head> </head>
<body> <body>
<script src="../public/layui/layui.js" charset="utf-8"></script> <!-- 引入layui的JavaScript文件 --> <script src="../public/layui/layui.js" charset="utf-8"></script>
<!-- 表单 --> <!-- 表单 -->
<table class="layui-hide" id="history" lay-filter="formFilter"></table> <!-- 创建一个表格id为historylay-filter属性指定表格的过滤器 --> <table class="layui-hide" id="history" lay-filter="formFilter"></table>
<!-- 头部工具栏 --> <!-- 头部工具栏 -->
<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> <!-- ID选项 --> <option value="id">ID</option>
<option value="card_id">借阅证号</option> <!-- 借阅证号选项 --> <option value="card_id">借阅证号</option>
<option value="book_id">书籍ID</option> <!-- 书籍ID选项 --> <option value="book_id">书籍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的table和jquery模块 layui.use(['table','jquery'], function(){
$ = layui.jquery; // 获取jQuery对象 $ = layui.jquery;
var table = layui.table; // 获取table组件实例 var table = layui.table;
// 进行渲染 // 进行渲染
var tableIns = table.render({ var tableIns = table.render({
elem: '#history' // 表格容器的选择器 elem: '#history'
,url:'./borrowList' // 设置表格数据的接口地址 ,url:'./borrowList'
,toolbar: '#headBar' // 设置表格的工具栏使用之前定义的headBar模板 ,toolbar: '#headBar'
,cols: [[ // 定义表格的列 ,cols: [[
{field:'id', width:80, title: 'ID', sort: true} // ID列宽度为80支持排序 {field:'id', width:80, title: 'ID', sort: true}
,{field:'card_id', width:180, title: '借阅证号'} // 借阅证号列宽度为180 ,{field:'card_id', width:180, title: '借阅证号'}
,{field:'book_id', width:100, title: '书籍ID', sort: true} // 书籍ID列宽度为100支持排序 ,{field:'book_id', width:100, title: '书籍ID', sort: true}
,{field:'borrow_date', width:180, title: '借阅时间'} // 借阅时间列宽度为180 ,{field:'borrow_date', width:180, title: '借阅时间'}
,{field:'end_date', title: '限定时间', width: 180} // 限定时间列宽度为180 ,{field:'end_date', title: '限定时间', width: 180}
,{field:'return_date', width:180, title: '归还时间', sort: true} // 归还时间列宽度为180支持排序 ,{field:'return_date', width:180, title: '归还时间', sort: true}
,{field:'illegal', minWidth:280, title: '违章信息', sort: true} // 违章信息列最小宽度为280支持排序 ,{field:'illegal', minWidth:280, title: '违章信息', sort: true}
,{field:'manager_id', width:80, title: '处理人'} // 处理人列宽度为80 ,{field:'manager_id', width:80, title: '处理人'}
]] ]]
,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>

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

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

@ -1,145 +1,144 @@
<%@page import="javabean.Base"%> <!-- 导入Base类用于数据库连接等操作 --> <%@page import="javabean.Base"%>
<%@page import="java.sql.ResultSet"%> <!-- 导入ResultSet类用于存储查询的结果 --> <%@page import="java.sql.ResultSet"%>
<%@page import="java.sql.PreparedStatement"%> <!-- 导入PreparedStatement类用于执行预编译SQL语句 --> <%@page import="java.sql.PreparedStatement"%>
<%@page import="java.sql.Connection"%> <!-- 导入Connection类用于管理数据库连接 --> <%@page import="java.sql.Connection"%>
<%@page import="net.sf.json.JSONObject"%> <!-- 导入JSONObject类用于处理JSON对象 --> <%@page import="net.sf.json.JSONObject"%>
<%@page import="net.sf.json.JSONArray"%> <!-- 导入JSONArray类用于处理JSON数组 --> <%@page import="net.sf.json.JSONArray"%>
<%@page import="javabean.Admin"%> <!-- 导入Admin类用于管理员相关操作 --> <%@page import="javabean.Admin"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> <!-- 设置页面的语言为Java字符编码为UTF-8,设置页面的字符编码为UTF-8 --> pageEncoding="UTF-8"%>
<!DOCTYPE html> <!-- 声明文档类型为HTML5 --> <!DOCTYPE html>
<html> <!-- 开始HTML文档 --> <html>
<head> <head>
<meta charset="UTF-8"> <!-- 设置页面字符编码为UTF-8 --> <meta charset="UTF-8">
<title>图书证修改</title> <!-- 页面标题设置为“图书证修改” --> <title>图书证修改</title>
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <!-- 引入layui CSS样式 --> <link rel="stylesheet" href="../public/layui/css/layui.css" media="all">
<script src="../public/layui/layui.js" charset="utf-8"></script> <!-- 引入layui JavaScript库 --> <script src="../public/layui/layui.js" charset="utf-8"></script>
<style> <style>
.layui-form{ <!-- 样式设置 --> .layui-form{
margin: 10px 20px; <!-- 设置表单的外边距 --> margin: 10px 20px;
} }
</style> </style>
</head> </head>
<body> <body>
<% <%
// 获取借阅证ID参数 // 获取借阅证信息
String id = request.getParameter("id"); // 获取通过URL传递的“id”参数 String id = request.getParameter("id");
// 初始化数据库连接及SQL语句
Connection connection = null; // 声明数据库连接对象
PreparedStatement pstmt = null; // 声明PreparedStatement对象用于查询规则
PreparedStatement infoPstmt = null; // 声明PreparedStatement对象用于查询借阅证信息
ResultSet ruleSet = null; // 声明ResultSet对象用于存放规则查询结果
ResultSet infoSet = null; // 声明ResultSet对象用于存放借阅证信息查询结果
String sql = "select * from rules"; // 查询规则的SQL语句
String infoSql = "select * from borrow_card where id=?"; // 查询借阅证信息的SQL语句使用占位符“?”
String result = ""; // 初始化字符串变量result用于存储结果
// 获取数据库连接 // 获取rule
connection = (Connection)Base.getConnection(); // 调用Base类中的getConnection方法获取数据库连接 Connection connection = null;
pstmt = connection.prepareStatement(sql); // 准备执行规则查询SQL语句 PreparedStatement pstmt = null;
infoPstmt = connection.prepareStatement(infoSql); // 准备执行借阅证信息查询SQL语句 PreparedStatement infoPstmt = null;
infoPstmt.setString(1, id); // 设置查询借阅证信息SQL语句中的ID参数 ResultSet ruleSet = null;
infoSet = infoPstmt.executeQuery(); // 执行查询并获取结果集 ResultSet infoSet = null;
infoSet.next(); // 将结果集指针移动到查询的第一行 String sql = "select * from rules";
ruleSet = pstmt.executeQuery(); // 执行规则查询并获取结果集 String infoSql = "select * from borrow_card where id=?";
String result = "";
// 公用连接
connection = (Connection)Base.getConnection();
pstmt = connection.prepareStatement(sql);
infoPstmt = connection.prepareStatement(infoSql);
infoPstmt.setString(1,id);
infoSet = infoPstmt.executeQuery();
infoSet.next();
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的form和jquery模块 --> layui.use(['form', 'jquery'], function(){
var form = layui.form <!-- 获取form模块 --> var form = layui.form
,layer = layui.layer; <!-- 获取layer模块 --> ,layer = layui.layer;
$ = layui.jquery; <!-- 获取jQuery对象 --> $ = layui.jquery;
// 提交表单 // 提交表单
form.on('submit(submitForm)', function(data){ <!-- 监听提交按钮的点击事件 --> form.on('submit(submitForm)', function(data){
$.ajax({ <!-- 发送AJAX请求 --> $.ajax({
url: './cardEdit', <!-- 请求的URL --> url: './cardEdit',
type: 'post', <!-- 请求方式为POST --> type: 'post',
data: data.field, <!-- 提交的数据为表单数据 --> data: data.field,
dataType: 'json', <!-- 返回的数据格式为JSON --> dataType: 'json',
timeout : 3000, <!-- 设置请求的超时时间为3000毫秒 --> timeout : 3000,
success: function(data){ <!-- 请求成功时的回调函数 --> success: function(data){
if(data.code == "0"){ <!-- 如果返回的数据中的code为0表示操作成功 --> if(data.code == "0"){
layer.msg("修改成功", { <!-- 弹出提示框,提示修改成功 --> layer.msg("修改成功", {
icon: 6, icon: 6,
anim: 5, anim: 5,
time: 500, <!-- 设置提示框显示时间为500毫秒 --> time: 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); <!-- 关闭当前iframe层 --> parent.layer.close(index); //再执行关闭
}, 500) <!-- 延时500毫秒后执行关闭操作 --> }, 500)
}else{ <!-- 如果返回的数据中的code不为0表示操作失败 --> }else{
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>

@ -1,180 +1,181 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> <!-- 设置页面的语言为Java字符编码为UTF-8,设置页面的字符编码为UTF-8 --> pageEncoding="UTF-8"%>
<!DOCTYPE html> <!-- 声明文档类型为HTML5 --> <!DOCTYPE html>
<html lang="en"> <!-- 定义页面的语言为英文 --> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <!-- 设置页面字符编码为UTF-8 --> <meta charset="UTF-8">
<title>借阅卡</title> <!-- 设置页面的标题为“借阅卡” --> <title>借阅卡</title>
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <!-- 引入layui的CSS文件 --> <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; <!-- 设置表格的外边距为0 --> margin: 0 0px;
} }
</style> </style>
</head> </head>
<body> <body>
<!-- 表单 --> <!-- 表单 -->
<table class="layui-hide" id="cardTable" lay-filter="formFilter"></table> <!-- 设置一个隐藏的表格元素表格的ID为"cardTable" --> <table class="layui-hide" id="cardTable" lay-filter="formFilter"></table>
<script src="../public/layui/layui.js" charset="utf-8"></script> <!-- 引入layui的JS文件 --> <script src="../public/layui/layui.js" charset="utf-8"></script>
<!-- 头部工具栏 --> <!-- 头部工具栏 -->
<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> <!-- 搜索条件ID --> <option value="id">ID</option>
<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){ }} <!-- 如果借阅证状态为0挂失 --> {{# if(d.status == 0){ }}
<span style="color:red">挂失<span> <!-- 显示“挂失”文本,颜色为红色 --> <span style="color:red">挂失<span>
{{# } else { }} <!-- 否则 --> {{# } else { }}
可用 <!-- 显示“可用”状态 --> 可用
{{# } }} {{# } }}
</script> </script>
<script> <script>
layui.use(['table','jquery'], function(){ <!-- 引入layui的表格和jquery模块 --> layui.use(['table','jquery'], function(){
$ = layui.jquery; <!-- 使用jQuery --> $ = layui.jquery;
var table = layui.table; <!-- 获取layui的表格模块 --> var table = layui.table;
// 进行渲染 // 进行渲染
var tableIns = table.render({ var tableIns = table.render({
elem: '#cardTable' <!-- 表格的元素ID --> elem: '#cardTable'
,url:'./cardList' <!-- 请求数据的URL --> ,url:'./cardList'
,toolbar: '#headBar' <!-- 设置表格的头部工具栏 --> ,toolbar: '#headBar'
,height: 600 <!-- 设置表格的高度为600px --> ,height: 600
,cols: [[ <!-- 表格的列设置 --> ,cols: [[
{field:'id', width:180, title: 'ID', sort: true} <!-- 显示ID列支持排序 --> {field:'id', width:180, title: 'ID', sort: true}
,{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){ <!-- 监听头部工具栏的操作 --> 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;
// 添加借阅 // 添加借书
case 'add': case 'add':
var addCardLayer = layer.open({ <!-- 打开一个新窗口,用于添加借阅证 --> var addCardLayer = layer.open({
type: 2, type: 2,
title: '添加借阅证', title: '添加借书证',
area: ['800px', '500px'], area: ['800px', '500px'],
maxmin: true, maxmin: true,
shadeClose: true, shadeClose: true,
content: 'cardadd.jsp', <!-- 加载添加借阅证页面 --> content: 'cardadd.jsp',
end: function(){ end: function(){
$('.layui-laypage-btn').click(); <!-- 关闭窗口后刷新当前页 --> $('.layui-laypage-btn').click();
} }
}); });
//layer.full(addCardLayer); <!-- 注释掉的代码,可能是为了最大化窗口 --> //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; <!-- 获取当前行的tr元素 --> var tr = obj.tr;
var id = data.id; <!-- 获取当前行的ID --> var id = data.id;
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: 'cardedit.jsp?id=' +id, <!-- 加载编辑借阅证页面并传递ID --> content: 'cardedit.jsp?id=' +id,
end: function(){ end: function(){
$(".layui-laypage-btn").click(); <!-- 刷新当前页 --> $(".layui-laypage-btn").click();
} }
}) })
break;
case 'del': break;
layer.confirm('确认删除么?<br><span style="color:red;">这将删除该借阅证的所有记录</span>',function(index){ <!-- 弹出删除确认框 --> case 'del':
layer.close(index); <!-- 关闭确认框 --> layer.confirm('确认删除么?<br><span style="color:red;">这将删除该借阅证的所有记录</span>',function(index){
$.ajax({ layer.close(index);
url: './cardDel', <!-- 发送删除请求 --> $.ajax({
type: 'get', url: './cardDel',
data: 'id=' +id, <!-- 传递要删除的ID --> type: 'get',
dataType: 'json', data: 'id=' +id,
timeout: 3000, <!-- 设置超时时间为3000毫秒 --> dataType: 'json',
success: function(data){ <!-- 请求成功后的回调函数 --> timeout: 3000,
if(data.code == 0){ <!-- 如果删除成功 --> success: function(data){
console.log(data); <!-- 输出删除结果 --> if(data.code == 0){
layer.msg(data.msg,{ <!-- 显示删除成功的消息 --> console.log(data);
icon: 6, layer.msg(data.msg,{
time: 1500 icon: 6,
}) time: 1500
// 还是本页数据 })
$(".layui-laypage-btn").click(); <!-- 刷新当前页 --> // 还是本页数据
}else{ <!-- 如果删除失败 --> $(".layui-laypage-btn").click();
layer.open({ }else{
title: '失败', layer.open({
content: data.msg <!-- 显示错误信息 --> title: '失败',
}) content: data.msg
} })
}, }
error: function(){ <!-- 请求失败的回调函数 --> },
layer.msg("连接超时"); <!-- 显示超时信息 --> error: function(){
} layer.msg("连接超时");
}) }
})
}) })
break; break;
case 'cardBorrow': case 'cardBorrow':
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: 'cardborrow.jsp?id=' +id, <!-- 加载借阅历史页面并传递ID --> content: 'cardborrow.jsp?id=' +id,
end: function(){ end: function(){
//$(".layui-laypage-btn").click(); <!-- 此处可能是未使用的代码 --> //$(".layui-laypage-btn").click();
} }
}) })
} }
}) })
}); });
</script> </script>
</body> </body>
</html> </html>

@ -1,96 +1,95 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> // 页面编码为UTF-8确保中文等字符显示正确 pageEncoding="UTF-8"%>
<!DOCTYPE html>
<!DOCTYPE html> // 定义文档类型为HTML5 <html lang="en">
<html lang="en"> // 开始HTML文档指定语言为英语
<head> <head>
<meta charset="UTF-8"> // 定义文档的字符编码为UTF-8 <meta charset="UTF-8">
<title>系统管理员</title> // 页面标题,显示在浏览器标签上 <title>系统管理员</title>
<!-- layui --> <!-- layui -->
<link rel="stylesheet" href="../public/layui/css/layui.css"> // 引入layui的CSS文件用于页面样式 <link rel="stylesheet" href="../public/layui/css/layui.css">
<script src="../public/layui/layui.js"></script> // 引入layui的JavaScript文件 <script src="../public/layui/layui.js"></script>
</head> </head>
<body class="layui-layout-body"> // 定义页面主体部分应用layui的布局样式 <body class="layui-layout-body">
<div class="layui-layout layui-layout-admin"> // layui框架的布局容器管理后台使用 <div class="layui-layout layui-layout-admin">
<div class="layui-header"> // 头部区域 <div class="layui-header">
<div class="layui-logo">系统管理员</div> // 左侧logo显示为“系统管理员” <div class="layui-logo">系统管理员</div>
<!-- 头部区域可配合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"> // 使用layui的树形导航 <ul class="layui-nav layui-nav-tree" lay-filter="test">
<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加载系统管理页面内容 <iframe src="librarydata.jsp" name="content" height="100%" width="100%" frameborder="0" scrolling="no"></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的模块包括element元素模块、jquery和layer弹层模块 layui.use(['element', 'jquery', 'layer'], function(){
$ = layui.jquery; // 引入jQuery $ = layui.jquery;
var element = layui.element // 获取layui的element模块用于操作元素 var element = layui.element
$ = layui.jquery; // 重新声明jQuery防止覆盖 $ = layui.jquery;
var form = layui.form // 获取layui的form模块用于表单操作 var form = layui.form
,layer = layui.layer; // 获取layui的layer模块用于弹层操作 ,layer = layui.layer;
$("#updatePassword").click(function(){ // 点击“修改密码”时触发 $("#updatePassword").click(function(){
layer.open({ // 打开一个新的层 layer.open({
title: '修改密码', // 层的标题 title: '修改密码',
type: 2, // 类型为iframe嵌入页面 type: 2,
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>

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

@ -1,86 +1,89 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> // 设置页面编码为UTF-8确保支持中文字符 pageEncoding="UTF-8"%>
<!DOCTYPE html>
<!DOCTYPE html> // 定义文档类型为HTML5 <html>
<html> // 开始HTML文档
<head> <head>
<meta charset="UTF-8"> // 定义文档的字符集为UTF-8 <meta charset="UTF-8">
<title>管理员添加</title> // 页面标题,显示在浏览器标签页上 <title>管理员添加</title>
<!-- layui --> <!-- layui -->
<link rel="stylesheet" href="../public/layui/css/layui.css"> // 引入layui的CSS样式文件 <link rel="stylesheet" href="../public/layui/css/layui.css">
<script src="../public/layui/layui.js"></script> // 引入layui的JS文件提供UI交互功能 <script src="../public/layui/layui.js"></script>
<style> <style>
.layui-form{ .layui-form{
margin: 10px 20px; // 设置表单的外边距 margin: 10px 20px;
}
</style> }
</style>
</head> </head>
</head> </head>
<body> <body>
<form class="layui-form layui-form-pane" action="" lay-filter="formFilter"> // 使用layui的表单样式lay-filter用于表单过滤 <form class="layui-form layui-form-pane" action="" lay-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">
</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(){
form.on('submit(submitButton)', function(data){ $ = layui.jquery;
$.ajax({ // 使用AJAX发送数据到后台 var form = layui.form
url: './managerAdd', // 请求的URL路径 ,layer = layui.layer
method: 'post', // 使用POST请求方式 //监听提交
data: data.field, // 获取表单数据 form.on('submit(submitButton)', function(data){
dataType: 'json', // 设置响应数据格式为JSON $.ajax({
success: function(data){ // 成功回调 url: './managerAdd',
if(data.code == "0"){ // 判断返回数据的code是否为"0"表示成功 method: 'post',
parent.layer.msg("添加成功",{ // 使用父窗口的layer弹出提示框 data: data.field,
icon: 6, // 图标类型为“成功” dataType: 'json',
time: 500 // 显示500毫秒 success: function(data){
}); if(data.code == "0"){
setTimeout(function(){ // 延时操作 parent.layer.msg("添加成功",{
parent.location.reload(); // 刷新父窗口 icon: 6,
}, 500); time: 500
}else{ });
layer.msg(data.msg); // 如果返回失败,弹出错误信息 setTimeout(function(){
} parent.location.reload();
} }, 500);
}) }else{
return false; // 阻止表单默认提交 layer.msg(data.msg);
}); }
});
}
})
return false;
});
});
</script> </script>
</body> </body>

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

@ -1,120 +1,118 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> // 设置页面的字符编码为UTF-8 pageEncoding="UTF-8"%>
<!DOCTYPE html>
<!DOCTYPE html> // 定义文档类型为HTML5 <html lang="en">
<html lang="en"> // 设置HTML文档的语言为英语
<head> <head>
<meta charset="UTF-8"> // 设置页面字符编码为UTF-8 <meta charset="UTF-8">
<title>借阅卡</title> // 设置页面标题为“借阅卡” <title>借阅卡</title>
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> // 引入layui的CSS文件用于页面样式 <link rel="stylesheet" href="../public/layui/css/layui.css" media="all">
<style> <style>
.layui-table,.layui-table-view{ // 自定义样式调整layui表格和表格视图的外边距 .layui-table,.layui-table-view{
margin: 0 0px; margin: 0 0px;
} }
</style> </style>
</head> </head>
<body> <body>
<!-- 表单 --> <!-- 表单 -->
<table class="layui-hide" id="managerTable" lay-filter="formFilter"></table> // 创建表格指定id为“managerTable”并设置过滤器为“formFilter” <table class="layui-hide" id="managerTable" lay-filter="formFilter"></table>
<script src="../public/layui/layui.js" charset="utf-8"></script> // 引入layui的JavaScript文件提供UI功能和交互 <script src="../public/layui/layui.js" charset="utf-8"></script>
<!-- 头部工具栏 --> <!-- 头部工具栏 -->
<script type="text/html" id="headBar"> // 定义头部工具栏的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> // 按钮点击触发“add”事件用于添加管理员 <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"> // 定义操作栏的HTML模板id为“operateBar”
<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> // 删除按钮点击触发“del”事件
</script>
<script> // 开始JavaScript代码块 <!-- 表格侧边栏 -->
layui.use(['table','jquery'], function(){ // 引入layui的表格和jQuery模块 <script type="text/html" id="operateBar">
$ = layui.jquery; // 使用jQuery库 <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
var table = layui.table; // 获取layui表格模块 <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
<script>
layui.use(['table','jquery'], function(){
$ = layui.jquery;
var table = layui.table;
// 进行渲染
var tableIns = table.render({
elem: '#managerTable'
,url:'./managerList'
,toolbar: '#headBar'
,height: 600
,cols: [[
{field:'id', width:80, title: 'ID', sort: true}
,{field:'account', width:80, title: '账号', sort: true}
,{field:'name', width:80, title: '姓名'}
,{field:'email', title: '邮箱', minWidth: 150}
,{fixed: 'right', title:'操作', toolbar: '#operateBar', align: 'center', width:150}
]]
});
// 进行渲染表格 // 头部工具栏事件
var tableIns = table.render({ table.on('toolbar(formFilter)', function(obj){
elem: '#managerTable' // 表格的元素指定为“managerTable” var checkStatus = table.checkStatus(obj.config.id);
,url:'./managerList' // 设置表格数据来源的URL switch(obj.event){
,toolbar: '#headBar' // 设置头部工具栏的模板ID // 添加管理员
,height: 600 // 设置表格的高度 case 'add':
,cols: [[ // 设置表格的列 var addCardLayer = layer.open({
{field:'id', width:80, title: 'ID', sort: true} // 列ID宽度80标题为“ID”支持排序 type: 2,
,{field:'account', width:80, title: '账号', sort: true} // 列账号宽度80标题为“账号”支持排序 title: '添加管理员',
,{field:'name', width:80, title: '姓名'} // 列姓名宽度80标题为“姓名” area: ['800px', '500px'],
,{field:'email', title: '邮箱', minWidth: 150} // 列邮箱最小宽度150标题为“邮箱” maxmin: true,
,{fixed: 'right', title:'操作', toolbar: '#operateBar', align: 'center', width:150} // 操作列固定在右侧宽度150使用“operateBar”模板 shadeClose: true,
]] content: 'manageradd.jsp',
}); });
//layer.full(addCardLayer);
};
});
// 头部工具栏事件 // 侧边工具栏事件
table.on('toolbar(formFilter)', function(obj){ // 监听头部工具栏的事件 table.on(('tool(formFilter)'), function(obj){
var checkStatus = table.checkStatus(obj.config.id); // 获取选中行的数据 var data = obj.data;
switch(obj.event){ // 根据事件类型进行处理 var layEvent = obj.event;
case 'add': // 添加管理员 var id = data.id;
var addCardLayer = layer.open({ // 打开一个弹出层 var tr = obj.tr;
type: 2, // 弹出层类型为iframe switch(obj.event){
title: '添加管理员', // 弹出层标题 case 'edit':
area: ['800px', '500px'], // 弹出层的宽度和高度 layer.open({
maxmin: true, // 允许最大化和最小化 type: 2,
shadeClose: true, // 点击遮罩层关闭 title: '更改信息',
content: 'manageradd.jsp', // 弹出层内容页面 area: ['800px', '600px'],
}); maxmin: true,
//layer.full(addCardLayer); // 此行已注释,可以让弹出层最大化 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(('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>

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

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

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

@ -1,73 +1,78 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> // 设置页面的字符编码为UTF-8 pageEncoding="UTF-8"%>
<!DOCTYPE html>
<!DOCTYPE html> // 声明文档类型为HTML5 <html>
<html> // 开始HTML文档
<head> <head>
<meta charset="UTF-8"> // 设置页面的字符编码为UTF-8 <meta charset="UTF-8">
<title>分类添加</title> // 页面标题为“分类添加” <title>分类添加</title>
<!-- layui --> <!-- layui -->
<link rel="stylesheet" href="../public/layui/css/layui.css"> // 引入layui框架的CSS文件用于页面样式 <link rel="stylesheet" href="../public/layui/css/layui.css">
<script src="../public/layui/layui.js"></script> // 引入layui框架的JavaScript文件用于实现页面交互 <script src="../public/layui/layui.js"></script>
<style> <style>
.layui-form{ // 自定义表单样式 .layui-form{
margin: 10px 20px; // 设置表单的外边距 margin: 10px 20px;
}
</style> }
</style>
</head>
</head> </head>
<body> <body>
<form class="layui-form layui-form-pane" action="" lay-filter="formFilter"> // 创建一个layui表单使用layui的样式设置filter属性为"formFilter" <form class="layui-form layui-form-pane" action="" lay-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"> // 文本框输入设置为必填且有验证规则“required” <input type="text" name="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"></textarea> // 文本框区域用于输入分类描述设置高度为300px <textarea name="description" placeholder="请输入内容" class="layui-textarea" style="height:300px"></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> // 开始JavaScript代码 <script>
layui.use(['form', 'jquery'], function(){
$ = 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);
}
}
})
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); // 弹出返回的错误信息
}
}
})
return false; // 阻止表单默认提交行为 return false;
}); });
}); });
</script> </script>
</body> </body>

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

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

@ -1,82 +1,89 @@
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> // 设置页面的编码方式为UTF-8 pageEncoding="UTF-8"%>
<!DOCTYPE html> // 声明文档类型为HTML5 <!DOCTYPE html>
<html> // HTML文档开始 <html>
<head> <head>
<meta charset="UTF-8"> // 设置页面的字符编码为UTF-8 <meta charset="UTF-8">
<title>修改密码</title> // 设置页面标题为“修改密码” <title>修改密码</title>
<!-- layui --> <!-- layui -->
<link rel="stylesheet" href="../public/layui/css/layui.css"> // 引入layui的CSS样式文件 <link rel="stylesheet" href="../public/layui/css/layui.css">
<script src="../public/layui/layui.js"></script> // 引入layui的JavaScript文件 <script src="../public/layui/layui.js"></script>
<style> <style>
.layui-form{ // 设置layui表单的样式 .layui-form{
margin: 10px 20px; // 设置表单的外边距 margin: 10px 20px;
}
</style> }
</style>
</head>
</head> </head>
<body> <body>
<form class="layui-form layui-form-pane" action="" lay-filter="formFilter"> // 创建layui表单设置formFilter作为表单过滤器 <form class="layui-form layui-form-pane" action="" lay-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="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-input-block"> // 输入框所在块 <div class="layui-form-item">
<button type="submit" class="layui-btn" lay-submit="" lay-filter="submitButton">确认修改</button> // 提交按钮,点击提交表单 <div class="layui-input-block">
<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模块
// 监听提交事件
form.on('submit(submitButton)', function(data){ // 监听“确认修改”按钮点击事件
$.ajax({
url: './updatePassword', // 提交的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(){ // 设置延迟操作
var index = parent.layer.getFrameIndex(window.name); // 获取当前iframe窗口的索引
parent.layer.close(index); // 关闭当前iframe窗口
}, 500);
}else{
layer.msg(data.msg); // 如果修改失败,弹出错误信息
}
}
})
return false; // 阻止表单默认提交 layui.use(['form', 'jquery'], function(){
}); $ = layui.jquery;
}); var form = layui.form
,layer = layui.layer
//监听提交
form.on('submit(submitButton)', function(data){
$.ajax({
url: './updatePassword',
method: 'post',
data: 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(data.msg);
}
}
})
return false;
});
});
</script> </script>
</body> </body>
</html> </html>

@ -1,66 +1,67 @@
<!DOCTYPE html> // 声明文档类型为HTML5 <!DOCTYPE html>
<html> // HTML文档开始 <html>
<head> <head>
<meta charset="UTF-8"> // 设置页面的字符编码为UTF-8 <meta charset="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> // 引入jQuery库通过CDN <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"> // 引入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">
<!-- 最新的 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的JS文件 <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"> // 引入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="./public/css/animate.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" />
</head> </head>
<body> <body>
<div class="container main"> //使用Bootstrap的container类设置容器 <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"> // 表单使用POST方法提交 <form method="post">
<input type="text" name="username" class="form-control my_input" placeholder="请输入账号" required="required"> // 输入框要求用户输入账号使用form-control样式 <input type="text" name="username" 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="password" name="password" class="form-control my_input" placeholder="请输入密码" required="required">
<input type="submit" class="form-control" value="登录" onclick="javascript:void(0);"> // 提交按钮点击时调用JS函数不会刷新页面 <input type="submit" class="form-control" value="登录" onclick="javascript:void(0);">
</form> </form>
</div>
</div> </div>
</div> <div style="position:fixed; bottom:0; right:0;">
<div style="position:fixed; bottom:0; right:0;"> // 设置固定位置,位于页面底部右侧 <a href="loginReader.html" target="_blank"><img src="public/image/reader.png" width="50px" height="50px"></a><br>
<a href="loginReader.html" target="_blank"><img src="public/image/reader.png" width="50px" height="50px"></a><br> // 链接到“读者登录”页面,显示图片图标 <a href="loginManager.html" target="_blank"><img src="public/image/manager.png" width="50px" height="50px"></a>
<a href="loginManager.html" target="_blank"><img src="public/image/manager.png" width="50px" height="50px"></a> // 链接到“管理员登录”页面,显示图片图标 </div>
</div> <script src="./public/js/layer/layer.js"></script>
<script src="./public/js/layer/layer.js"></script> // 引入layer.js用于弹窗提示 <script>
<script> $(function(){
$(function(){ // 使用jQuery等待DOM加载完成 //登录
//登录 $("input[type=submit]").click(function(){
$("input[type=submit]").click(function(){ // 监听提交按钮的点击事件
$.ajax({ // 使用AJAX发送请求 $.ajax({
url: "./adminLogin", // 提交的URL地址为“adminLogin” url: "./adminLogin",
type: "post", // 请求方式为POST type: "post",
data: $("form").serialize(), // 序列化表单数据,发送到后端 data: $("form").serialize(),
dataType: "json", // 设置返回的数据类型为JSON dataType: "json",
success: function( data ){ // 请求成功时的回调函数 success: function( data ){
if(data.code == 0){ // 如果返回的code为0表示登录成功 if(data.code == 0){
layer.msg("登录成功", { // 弹出登录成功提示 layer.msg("登录成功", {
icon: 6, // 设置提示图标为“成功”图标 icon: 6,
time: 1000 // 显示时间为1秒 time: 1000
}, function(){ // 在成功提示后跳转到指定的URL }, function(){
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>

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

@ -1,67 +1,67 @@
<!DOCTYPE html> <!-- 声明文档类型为HTML5 --> <!DOCTYPE html>
<html> <!-- HTML文档的根元素 --> <html>
<head> <!-- head元素包含元数据 --> <head>
<meta charset="UTF-8"> <!-- 设置字符编码为UTF-8 --> <meta charset="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"> <!-- 表单使用POST方法提交 --> <form method="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(){ <!-- jQuery文档就绪函数 --> $(function(){
//登录 //登录
$("input[type=submit]").click(function(){ <!-- 绑定点击事件到提交按钮 --> $("input[type=submit]").click(function(){
$.ajax({ <!-- 发起Ajax请求 --> $.ajax({
url: "./managerLogin", <!-- 请求URL --> url: "./managerLogin",
type: "post", <!-- 请求类型为POST --> type: "post",
data: $("form").serialize(), <!-- 序列化表单数据作为请求参数 --> data: $("form").serialize(),
dataType: "json", <!-- 期望服务器返回JSON格式的数据 --> dataType: "json",
success: function( data ){ <!-- 请求成功时的回调函数 --> success: function( data ){
if(data.code == 0){ <!-- 如果返回码为0表示登录成功 --> if(data.code == 0){
layer.msg("登录成功", { <!-- 弹出提示消息 --> layer.msg("登录成功", {
icon: 6, <!-- 图标类型 --> icon: 6,
time: 1000 <!-- 显示时间 --> time: 1000
}, function(){ }, function(){
location.href = data.url; <!-- 跳转到指定URL --> location.href = data.url;
}) })
}else{ <!-- 如果返回码不为0表示登录失败 --> }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>

@ -1,71 +1,72 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta charset="UTF-8"> <!-- 设置文档字符编码为UTF-8 --> <meta charset="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 文件 -->
<!-- 可选的 Bootstrap 主题文件(一般不用引入) --> <script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<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"> <!-- 引入动画效果的CSS文件 --> <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/login.css" /> <!-- 引入自定义的登录页面样式表 --> <link rel="stylesheet" href="./public/css/animate.css">
<style> <link rel="stylesheet" href="./public/css/login.css" />
button:hover{ <style>
background-color:#ffd6e7; /* 鼠标悬停在按钮上时的背景颜色 */ button:hover{
} 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"> <!-- 登录表单使用POST方法提交数据 --> <form method="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="loginManager.html" target="_blank"><img width="50px" height="50px"></a><br> <!-- 跳转到管理员登录页面的链接 -->
<a href="adminLogin.html" target="_blank"><img width="50px" height="50px"></a> <!-- 跳转到管理员登录页面的链接 -->
</div>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <!-- 引入jQuery库 --> </div>
<script src="https://cdn.bootcdn.net/ajax/libs/layer/3.1.1/layer.js"></script> <!-- 引入Layer弹窗插件 --> </div>
<script> <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><br>
<a href="adminLogin.html" target="_blank"><img src="public/image/admin.png" width="50px" height="50px"></a>
</div>
<script src="./public/js/layer/layer.js"></script>
<script>
$(function(){ $(function(){
// 登录操作 //登录
$("input[type=submit]").click(function(){ $("input[type=submit]").click(function(){
$.ajax({ $.ajax({
url: "./readerLogin", // 请求的URL地址 url: "./readerLogin",
type: "post", // 请求类型为POST type: "post",
data: $("form").serialize(), // 序列化表单数据 data: $("form").serialize(),
dataType: "json", // 预期服务器返回的数据类型为JSON dataType: "json",
success: function(data){ // 成功回调函数 success: function( data ){
if(data.code == 0){ // 如果返回的code为0表示登录成功 if(data.code == 0){
layer.msg("登录成功", { layer.msg("登录成功", {
icon: 6, // 图标类型为笑脸 icon: 6,
time: 1000 // 显示时间为1秒 time: 1000
}, function(){ }, function(){
location.href = data.url; // 跳转到指定URL location.href = data.url;
}); })
} else { // 如果返回的code不为0表示登录失败 }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>

@ -1,134 +1,85 @@
<%@ 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">
<!-- 左侧导航栏应用LayUI导航类 -->
<li class="layui-nav-item"> <ul class="layui-nav layui-layout-left">
<a href=";">其它系统</a>
<!-- 导航项:其它系统 -->
<li class="layui-nav-item">
<a href="javascript:;">其它系统</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=";"> <a href="javascript:;">
<%=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=";"><i class="layui-icon layui-icon-read" style="font-size: 20px; color: lightblue;"></i>&nbsp;图书管理</a> <a class="" href="javascript:;"><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=";"><i class="layui-icon layui-icon-form" style="font-size: 20px; color: orange;"></i>&nbsp;报表管理</a> <a href="javascript:;"><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>

@ -1,137 +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">
<!-- 设置页面标题 --> <script src="../public/layui/layui.js"></script>
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <style>
<!-- 引入Layui的CSS样式文件 --> .layui-form-label{
margin-left:20%;
<style> }
.layui-form-label{ </style>
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>
<!-- 居中显示标题“借阅图书”并设置顶部边距为2% --> <div align="center"
<div align="center" style="margin-left:30%; margin-top: 5%; width: 40%;">
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">
</div> <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="bookid" lay-verify="required"
<!-- 创建表单标签,标签内容为“图书编号” --> placeholder="请输入图书编号" autocomplete="off" class="layui-input"><br>
<div class="layui-input-inline"> </div>
<input type="text" name="bookid" lay-verify="required"
placeholder="请输入图书编号" autocomplete="off" class="layui-input"><br>
<!-- 创建文本输入框名称为bookid验证规则为必填占位符为“请输入图书编号”自动完成关闭并应用Layui的输入框样式 -->
</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="date1" id="date1" autocomplete="off"
class="layui-input"><br>
<!-- 创建文本输入框名称为date1ID为date1自动完成关闭并应用Layui的输入框样式 -->
</div> </div>
</div>
<div class="layui-form-item" align="center">
<button class="layui-btn" lay-submit="" lay-filter="demo2">借阅</button>
<!-- 创建一个按钮应用Layui的按钮样式并设置点击时提交表单过滤器为demo2 -->
</div>
</form>
layui
.use(
[ 'form', 'layedit', 'laydate' ],
function() {
var form = layui.form, layer = layui.layer, layedit = layui.layedit, laydate = layui.laydate;
<!-- 加载Layui的form、layer、layedit和laydate模块 -->
//日期
laydate.render({
elem : '#date1',
type : 'datetime',
format : 'yyyy-M-d H:m:s',
value: new Date()
});
<!-- 渲染日期选择器绑定到ID为date1的元素类型为日期时间格式为“年-月-日 时:分:秒”,默认值为当前日期 -->
laydate.render({ <div class="layui-form-item" align="center">
elem : '#date2', <button class="layui-btn" lay-submit="" lay-filter="demo2">借阅</button>
type : 'datetime', </div>
format : 'yyyy-M-d H:m:s' </form>
});
<!-- 渲染另一个日期选择器绑定到ID为date2的元素类型为日期时间格式为“年-月-日 时:分:秒” -->
<script>
layui
//创建一个编辑器 .use(
var editIndex = layedit [ 'form', 'layedit', 'laydate' ],
.build('LAY_demo_editor'); function() {
var form = layui.form, layer = layui.layer, layedit = layui.layedit, laydate = layui.laydate;
//日期
//监听提交 laydate.render({
form.on('submit(demo1)', function(data) { elem : '#date1',
layer.alert(JSON.stringify(data.field), { type : 'datetime',
title : '最终的提交信息' format : 'yyyy-M-d H:m:s',
}) value: new Date()
return false; });
}); laydate.render({
elem : '#date2',
//表单赋值 type : 'datetime',
layui.$('#LAY-component-form-setval').on( format : 'yyyy-M-d H:m:s'
'click', function() { });
form.val('example', {
"username" : "贤心" // "name": "value" //创建一个编辑器
, var editIndex = layedit
"password" : "123456", .build('LAY_demo_editor');
"interest" : 1,
"like[write]" : true //复选框选中状态
, //监听提交
"close" : true //开关状态 form.on('submit(demo1)', function(data) {
, layer.alert(JSON.stringify(data.field), {
"sex" : "女", title : '最终的提交信息'
"desc" : "我爱 layui" })
}); return false;
}); });
//表单取值 //表单赋值
layui.$('#LAY-component-form-getval').on( layui.$('#LAY-component-form-setval').on(
'click', function() { 'click', function() {
var data = form.val('example'); form.val('example', {
(JSON.stringify(data)); "username" : "贤心" // "name": "value"
}); ,
}); "password" : "123456",
}); "interest" : 1,
</script> "like[write]" : true //复选框选中状态
</div> ,
"close" : true //开关状态
,
"sex" : "女",
"desc" : "我爱 layui"
});
});
//表单取值
layui.$('#LAY-component-form-getval').on(
'click', function() {
var data = form.val('example');
alert(JSON.stringify(data));
});
});
</script>
</div>
</body> </body>
</html> </html>

@ -1,137 +1,163 @@
<%@ 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"); // 获取请求参数中的用户ID String user = request.getParameter("userid");
String book = request.getParameter("bookid"); // 获取请求参数中的图书ID String book = request.getParameter("bookid");
String date1 = request.getParameter("date1"); // 获取请求参数中的借阅日期 String date1 = request.getParameter("date1");
// String date2 = request.getParameter("date2"); // 获取请求参数中的归还日期(被注释掉)
String sql1 = "select * from borrow_card where ID =" + user; // SQL查询语句根据用户ID查询借阅卡信息
ResultSet rs1 = borrow.executeQuery(sql1); // 执行SQL查询返回结果集
if(session.getAttribute("manager")!=null){ // 检查会话中是否有管理员登录
if (rs1.next()) { // 如果查询到借阅卡信息
String rule = rs1.getString("rule_id"); // 获取借阅卡的规则ID
int cardstatus = Integer.parseInt(rs1.getString("STATUS")); // 获取借阅卡状态
String sql4="select*from rules where id = " + rule; // SQL查询语句根据规则ID查询规则信息
ResultSet rs4 = borrow.executeQuery(sql4); // 执行SQL查询返回结果集
int n = 0; // 初始化变量n
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(); // 创建EndTime对象
String end = endtime.show(n); // 计算并获取借阅结束日期 //String date2 = request.getParameter("date2");
String sql1 = "select * from borrow_card where ID =" + user;
if(cardstatus!=0){ // 如果借阅卡状态有效
String sql2 = "select * from books where ID =" + book; // SQL查询语句根据图书ID查询图书信息 ResultSet rs1 = borrow.executeQuery(sql1);
ResultSet rs2 = borrow.executeQuery(sql2); // 执行SQL查询返回结果集
if (rs2.next()) { // 如果查询到图书信息
int status = Integer.parseInt(rs2.getString("STATUS")); // 获取图书状态 if(session.getAttribute("manager")!=null){
String lib = Integer.toString(rs2.getInt("library_id")); // 获取图书所在图书馆ID if (rs1.next()) {
for(int z=0;z<libraryArray.length;z++){ // 遍历图书馆数组
if(libraryArray[z].equals(lib)){ // 如果图书所在图书馆在可借阅范围内 String rule = rs1.getString("rule_id");
String countSql = "select count(*) as count from borrow_books where manager_id is null and card_id =" + user; // SQL查询语句统计当前用户已借阅的图书数量 int cardstatus = Integer.parseInt(rs1.getString("STATUS"));
ResultSet rsSql = borrow.executeQuery(countSql); // 执行SQL查询返回结果集
int count = 0; // 初始化已借阅数量 String sql4="select*from rules where id = "+rule;
while(rsSql.next()){ // 遍历结果集 ResultSet rs4 = borrow.executeQuery(sql4);
count = rsSql.getInt("count"); // 获取已借阅数量 int n =0;
} String library = "";
if(count<num){ // 如果已借阅数量小于可借阅数量 String[] libraryArray = {};
if(status==1){ // 如果图书状态为可借 int num = 0;
String sql = "insert into borrow_books(CARD_ID,BOOK_ID,BORROW_DATE,END_DATE) values('" + user + "','" + book + "','" + date1 + "','" + end + "')"; // SQL插入语句插入借阅记录 while(rs4.next()){
int i = borrow.executeUpdate(sql); // 执行SQL插入操作返回受影响的行数 n=rs4.getInt("limit_day");
if (i == 1) { // 如果插入成功 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);
int count=0;
while(rsSql.next()){
count = rsSql.getInt("count");
}
//out.println(count);
if(count<num){
if(status==1){
String sql = "insert borrow_books(CARD_ID,BOOK_ID,BORROW_DATE,END_DATE)values('" + user + "','" + book
+ "','" + date1 + "','" + end + "');";
try { try {
// 显示借阅成功消息并跳转页面 int i = borrow.executeUpdate(sql);
%> if (i == 1) {
('借阅成功!'); %>
window.location.href = "02borrow.jsp"; <script>
<% alert('借阅成功!');
String sql3="update books set STATUS=0 where ID=" + book; // SQL更新语句更新图书状态为不可借 window.location.href = "02borrow.jsp";
borrow.executeUpdate(sql3); // 执行SQL更新操作 </script>
<%
} catch (Exception e) { // 如果发生异常 <%
// 显示借阅未成功消息并跳转页面 String sql3="update books set STATUS=0 where ID="+book;
%> borrow.executeUpdate(sql3);
('借阅未成功!');
window.location.href = "02borrow.jsp"; } else {
<% %>
} <script>
} else { // 如果插入失败 alert('借阅未成功!');
// 显示借阅未成功消息并跳转页面 window.location.href = "02borrow.jsp";
%> </script>
('借阅未成功!'); <%
window.location.href = "02borrow.jsp"; }
<% } catch (Exception e) {
} %>
}else{ // 如果图书状态不可借 <script>
// 显示图书已借出消息并跳转页面 alert('借阅未成功!');
%> window.location.href = "02borrow.jsp";
('该图书已借出!'); </script>
window.location.href = "02borrow.jsp"; <%
<% }
} }else{
}else{ // 如果已借阅数量达到或超过可借阅数量 %>
// 显示已达到借阅数量上限消息并跳转页面 <script>
%> alert('该图书已借出!');
('该用户已达到可借阅数量上限!若需还书,请先借阅其他书籍!'); window.location.href = "02borrow.jsp";
window.location.href = "02borrow.jsp"; </script>
<% <%
} }
}if(z==libraryArray.length-1 && !libraryArray[z].equals(lib)){ // 如果遍历完所有图书馆且图书不在可借阅范围内 }else{
// 显示图书不在可借阅图书馆内消息并跳转页面 %>
%> <script>
('该图书未在可借阅的图书馆内!'); alert('该用户已达到可借阅数量!若需还借书,请先还书!');
window.location.href = "02borrow.jsp"; 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>
<%
} }
} %>
}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>

@ -1,96 +1,95 @@
<%@ 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" style=" margin-top: 2%;"><h1>查询图书是否逾期</h1></div> <div align="center"
<div align="center" style="margin-left:30%; margin-top: 5%; width: 40%;">
style="margin-left:30%; margin-top: 5%; width: 40%;">
<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>
<!-- 表单开始action属性指定提交的URL -->
<form class="layui-form layui-form-pane" action="04judgeSus.jsp">
<!-- 图书编号输入框 --> <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>
</div> </form>
<script>
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-M-d H:m:s',
min:0,
max:0,
value: new Date()
});
<!-- 提交按钮 --> //创建一个编辑器
<div class="layui-form-item" align="center"> var editIndex = layedit
<button class="layui-btn layui-btn-warm" lay-submit="" lay-filter="demo2">查询</button> .build('LAY_demo_editor');
</div>
</form>
<!-- LayUI模块加载和初始化 -->
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-M-d H:m:s',
min:0,
max:0,
value: new Date()
});
//创建一个编辑器实例 //监听提交
var editIndex = layedit form.on('submit(demo1)', function(data) {
.build('LAY_demo_editor'); layer.alert(JSON.stringify(data.field), {
title : '最终的提交信息'
})
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 //复选框选中状态
,
"close" : true //开关状态
,
"sex" : "女",
"desc" : "我爱 layui"
});
});
//表单赋值示例 //表单取值
layui.$('#LAY-component-form-setval').on( layui.$('#LAY-component-form-getval').on(
'click', function() { 'click', function() {
form.val('example', { var data = form.val('example');
"username" : "贤心" // "name": "value" alert(JSON.stringify(data));
, });
"password" : "123456",
"interest" : 1,
"like[write]" : true //复选框选中状态
,
"close" : true //开关状态
,
"sex" : "女",
"desc" : "我爱 layui"
});
});
//表单取值示例 });
layui.$('#LAY-component-form-getval').on( </script>
'click', function() { </div>
var data = form.val('example');
(JSON.stringify(data));
});
});
});
</script>
</div>
</body> </body>
</html> </html>

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

@ -1,149 +1,168 @@
<%@ page import="java.sql.*" %> // 导入Java SQL包用于数据库操作 <%@ page import="java.sql.*" %>
<jsp:useBean id="judge" scope="session" class="javabean.JDBCBean"></jsp:useBean> // 使用JSP的useBean标签来创建一个名为judge的JavaBean对象该对象在会话范围内有效 <%@ page language="java" contentType="text/html; charset=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">
<style> <script src="../public/layui/layui.js"></script>
.layui-form-label{ <style>
margin-left:20%; .layui-form-label{
} margin-left:20%;
</style> }
</style>
</head> </head>
<body> <body>
<div align="center" style=" margin-top: 2%; margin-left: 30%; width: 40%;"> <jsp:useBean id="judge" scope="session" class="javabean.JDBCBean"></jsp:useBean>
<h1>归还图书</h1> <div align="center" style=" margin-top: 2%;"><h1>归还图书</h1></div>
<form class="layui-form layui-form-pane" action="05returnSus.jsp"> <div align="center"
style="margin-left:30%; margin-top: 5%; width: 40%;">
<% <%
Object days = session.getAttribute("days"); // 从会话中获取“days”属性 Object days = session.getAttribute("days");
Object fee = session.getAttribute("fee"); // 从会话中获取“fee”属性 Object fee = session.getAttribute("fee");
int d = Integer.parseInt(days.toString()); // 将“days”属性转换为整数 int d = Integer.parseInt(days.toString());
float f = Float.parseFloat(fee.toString()); // 将“fee”属性转换为浮点数 float f = Float.parseFloat(fee.toString());
String book = session.getAttribute("book").toString(); // 从会话中获取“book”属性并转换为字符串 String book = session.getAttribute("book").toString();
String mes = ""; // 初始化消息变量 String mes = "";
String mes2 = ""; // 初始化消息变量 String mes2 = "";
float sum = 0; // 初始化罚款总金额 float sum = 0;
if(d<0){ // 如果天数小于0表示逾期 if(d<0){
mes = "已逾期"+(-d)+"天"; // 设置逾期消息 mes = "已逾期"+(-d)+"天";
mes2 = "罚款"+sum+"元"; // 设置罚款消息 sum = d*f*(-1);
}else{ // 如果天数不小于0表示未逾期 mes2 = "罚款"+sum;
mes = "还剩"+d+"天"; // 设置剩余天数消息 }
//mes2 = "无需罚款"; // 注释掉的代码,表示不需要罚款 else{
} mes = "还剩"+d+"天";
session.setAttribute("mes", mes); // 将消息存储到会话中 //mes2 = "无需罚款";
session.setAttribute("mes2", mes2); // 将消息存储到会话中 }
%> session.setAttribute("mes",mes);
<div><blockquote class="layui-elem-quote layui-quote-nm"> session.setAttribute("mes2",mes2);
<%=session.getAttribute("mes") %><br> // 显示会话中的逾期或剩余天数消息 %>
<%=session.getAttribute("mes2") %> // 显示会话中的罚款消息
</blockquote></div> <form class="layui-form layui-form-pane" action="05returnSus.jsp">
<div class="layui-form-item"> <div><blockquote class="layui-elem-quote layui-quote-nm">
<label class="layui-form-label">图书编号</label>
<div class="layui-input-inline"> <%=session.getAttribute("mes") %><br>
<input type="text" name="bookid" lay-verify="required" value=<%=session.getAttribute("book") %> autocomplete="off" class="layui-input"><br> // 显示图书编号输入框 <%=session.getAttribute("mes2") %>
</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匹配的借书记录
ResultSet rs2 = judge.executeQuery(sql2); // 执行查询并获取结果集 String sql2="select*from borrow_books where return_date is null and book_id = "+book;
String end = ""; // 初始化截止日期变量 ResultSet rs2 = judge.executeQuery(sql2);
while(rs2.next()){ // 遍历结果集 String end = "";
%> 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 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>
</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="date1" id="date1" autocomplete="off" class="layui-input"><br> // 显示归还日期输入框
</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-inline"> <div class="layui-input-inline">
<input type="text" name="ill" placeholder="若无违规信息,则不填" autocomplete="off" class="layui-input"><br> // 显示违规信息输入框 <input type="text" name="ill"
placeholder="若无违规信息,则不填" autocomplete="off" class="layui-input"><br>
</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-inline"> <div class="layui-input-inline">
<input type="text" name="manager" readonly="readonly" class="layui-input" value= <%=session.getAttribute("manager") %>> // 显示管理员编号输入框,只读 <input type="text" name="managerid" readonly="readonly"
class="layui-input" value="<%=session.getAttribute("manager")%>"><br>
</div>
</div> </div>
</div>
<div class="layui-form-item" align="center">
<button class="layui-btn layui-btn-warm" lay-submit="" lay-filter="demo1">归还</button> // 显示归还按钮
</div>
</form>
</div>
<script>
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');
//监听提交
form.on('submit(demo1)', function(data) {
layer.alert(JSON.stringify(data.field), {
title : '最终的提交信息' // 弹窗标题
})
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"
});
});
//表单取值 <div class="layui-form-item" align="center">
layui.$('#LAY-component-form-getval').on( <button class="layui-btn layui-btn-warm" lay-submit="" lay-filter="demo2">归还</button>
'click', function() { </div>
var data = form.val('example'); </form>
layer.alert(JSON.stringify(data)); // 弹出数据
});
<script>
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> //监听提交
form.on('submit(demo1)', function(data) {
layer.alert(JSON.stringify(data.field), {
title : '最终的提交信息'
})
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"
});
});
//表单取值
layui.$('#LAY-component-form-getval').on(
'click', function() {
var data = form.val('example');
alert(JSON.stringify(data));
});
});
</script>
</div> </div>
</body> </body>
</html> </html>

@ -11,66 +11,65 @@
<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");// 获取请求参数中的图书ID String book = request.getParameter("bookid");
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"); // 获取请求参数中的管理员ID String managerid = request.getParameter("managerid");
if(session.getAttribute("manager")!=null){ // 检查用户是否已登录 if(session.getAttribute("manager")!=null){
String sql2 = "select * from books where ID =" + book; // 查询图书信息的SQL语句 String sql2 = "select * from books where ID =" + book;
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){ // 如果图书状态为未借出0 if(status==0){
String sql = "update borrow_books set RETURN_DATE='" + date1 + "',ILLEGAL='" + ill + "',MANAGER_ID='" + managerid + "' where manager_id is null and BOOK_ID="+ book; // 更新借书记录的SQL语句 String sql = "update borrow_books set RETURN_DATE='" + date1 + "',ILLEGAL='" + ill + "',MANAGER_ID='" + managerid + "' where manager_id is null and BOOK_ID="+ book;
//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;// SQL更新语句更新图书状态为已借出1 String sql3="update books set STATUS=1 where ID="+book;
ret.executeUpdate(sql3);// 执行更新操作,返回受影响的行数 ret.executeUpdate(sql3);
%> %>
<script> <script>
alert('归还成功!');// 显示归还成功消息 alert('归还成功!');
window.location.href = "04judge.jsp";// 跳转到04judge.jsp页面 window.location.href = "04judge.jsp";
</script> </script>
<% <%
} catch (Exception e) { // 捕获异常 } catch (Exception e) {
%> %>
<script> <script>
alert('归还未成功!');// 显示归还失败消息 alert('归还未成功!');
window.location.href = "04judge.jsp";//跳转到04judge.jsp页面 window.location.href = "04judge.jsp";
</script> </script>
<% <%
} }
}else{ // 如果图书状态不为未借出0 }else{
%> %>
<script> <script>
alert('该图书未借出!');// 显示图书未借出消息 alert('该图书未借出!');
window.location.href = "04judge.jsp";// 跳转到04judge.jsp页面 window.location.href = "04judge.jsp";
</script> </script>
<% <%
} }
} }
}else{// 如果用户未登录 }else{
%> %>
<script> <script>
alert('请先登录!');// 显示请先登录消息 alert('请先登录!');
window.parent.location.href = "../loginManager.html";// 跳转到登录页面 window.parent.location.href = "../loginManager.html";
</script> </script>
<% <%
} }

@ -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>
@ -14,111 +14,107 @@
</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">
<select id="condition" name="condition" lay-verify="required">
条件搜索: <option value=""></option>
<div class="layui-inline"> <option value="card_id">借阅证号</option>
<select id="condition" name="condition" lay-verify="required"> <option value="book_id">图书编号</option>
<option value=""></option> <option value="borrow_date">借阅日期</option>
<option value="card_id">借阅证号</option> <option value="end_date">截止日期</option>
<option value="book_id">图书编号</option> <option value="return_date">归还日期</option>
<option value="borrow_date">借阅日期</option> <option value="illegal">违章信息</option>
<option value="end_date">截止日期</option> <option value="manager_id">处理人</option>
<option value="return_date">归还日期</option> </select>
<option value="illegal">违章信息</option> </div>
<option value="manager_id">处理人</option> <div class="layui-inline">
</select> <input class="layui-input" id="conditionValue" name="conditionValue" id="demoReload" autocomplete="off">
</div> </div>
<div class="layui-inline"> <button class="layui-btn" name="condition" data-type="reload" lay-event="search">搜索</button>
<input class="layui-input" id="conditionValue" name="conditionValue" id="demoReload" autocomplete="off"> </script>
</div>
<button class="layui-btn" name="condition" data-type="reload" lay-event="search">搜索</button>
</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 ,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;
case 'add': case 'add':
var addCardLayer = layer.open({ var addCardLayer = layer.open({
type: 2, type: 2,
title: '添加借书证', title: '添加借书证',
area: ['800px', '500px'], area: ['800px', '500px'],
maxmin: true, maxmin: true,
shadeClose: true, shadeClose: true,
content: 'cardadd.jsp', content: 'cardadd.jsp',
}); });
//layer.full(addCardLayer); //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>

@ -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"%> <!-- 设置页面语言为Java内容类型为HTML字符编码为UTF-8 --> pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!-- 定义文档类型为HTML 4.01 Transitional --> <!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"> <!-- 设置页面的字符编码为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"> <!-- 引入Layui的CSS文件 --> <link rel="stylesheet" href="../public/layui/css/layui.css" media="all">
<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; /* 设置表格和表格视图的外边距为0 */ 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>
<!-- 头部工具栏 -->
条件搜索: <!-- 条件搜索标签 --> <!-- 头部工具栏 -->
<div class="layui-inline"> <script type="text/html" id="headBar">
<select id="condition" name="condition" lay-verify="required"> <!-- 下拉选择框,用于选择查询条件 --> 条件搜索:
<option value=""></option> <!-- 空选项 --> <div class="layui-inline">
<option value="card_id">借阅证号</option> <!-- 借阅证号选项 --> <select id="condition" name="condition" lay-verify="required">
<option value="book_id">图书编号</option> <!-- 图书编号选项 --> <option value=""></option>
<option value="borrow_date">借阅日期</option> <!-- 借阅日期选项 --> <option value="card_id">借阅证号</option>
<option value="end_date">截止日期</option> <!-- 截止日期选项 --> <option value="book_id">图书编号</option>
</select> <option value="borrow_date">借阅日期</option>
</div> <option value="end_date">截止日期</option>
<div class="layui-inline"> </select>
<input class="layui-input" id="conditionValue" name="conditionValue" id="demoReload" autocomplete="off"> <!-- 输入框,用于输入查询条件的值 --> </div>
</div> <div class="layui-inline">
<button class="layui-btn" name="condition" data-type="reload" lay-event="search">搜索</button> <!-- 搜索按钮 --> <input class="layui-input" id="conditionValue" name="conditionValue" id="demoReload" autocomplete="off">
</script> </div>
<button class="layui-btn" name="condition" data-type="reload" lay-event="search">搜索</button>
</script>
<script> <script>
layui.use(['table','jquery'], function(){ <!-- 使用Layui的table和jQuery模块 --> layui.use(['table','jquery'], function(){
$ = layui.jquery; <!-- 获取jQuery对象 --> $ = layui.jquery;
var table = layui.table; <!-- 获取table对象 --> var table = layui.table;
// 进行渲染 // 进行渲染
var tableIns = table.render({ var tableIns = table.render({
elem: '#cardTable' <!-- 指定表格容器的ID --> elem: '#cardTable'
,url:'./returnTable' <!-- 数据接口地址 --> ,url:'./returnTable'
,toolbar: '#headBar' <!-- 指定工具栏的ID --> ,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}
]] ]]
,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;
case 'add': case 'add':
var addCardLayer = layer.open({ var addCardLayer = layer.open({
type: 2, type: 2,
title: '添加借书证', title: '添加借书证',
area: ['800px', '500px'], area: ['800px', '500px'],
maxmin: true, maxmin: true,
shadeClose: true, shadeClose: true,
content: 'cardadd.jsp', content: 'cardadd.jsp',
}); });
//layer.full(addCardLayer); //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; <!-- 获取当前行的DOM对象 --> 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>

@ -1,64 +1,69 @@
<%@ 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"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!-- 定义文档类型为HTML 4.01 Transitional --> <!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"> <!-- 引入Layui的CSS样式文件 --> <link rel="stylesheet" href="../public/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"> <!-- 创建一个表单使用Layui的表单类和过滤器 --> <form class="layui-form layui-form-pane" action="" lay-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="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%;"> <!-- 表单项开始高度为50% --> <div class="layui-form-item" style="height: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> <!-- 多行文本输入框必填自动完成关闭占位符为“请输入公告”高度为300px --> <textarea name="detail" lay-verify="required" placeholder="请输入公告" autocomplete="off" class="layui-input" style="height:300px;"></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"><i class="layui-icon layui-icon-release" style="font-size: 20px; color: yellow;"></i>&nbsp;发布</button> <!-- 提交按钮使用Layui的按钮类和图标类点击后触发提交事件 --> <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>
</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); // 弹出错误信息
}
}
})
return false; // 阻止表单默认提交行为 layui.use(['form', 'jquery'], function(){
}); $ = 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>

@ -1,111 +1,109 @@
<%@ 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">
<!-- 引入layui的CSS文件 --> <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>
<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>
</script>
<!-- 编辑和删除按钮 --> <script type="text/html" id="rightBar">
<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的模块 --> layui.use(['table','jquery'], function(){
layui.use(['table','jquery'], function(){ $ = layui.jquery;
$ = layui.jquery; // 获取jQuery对象 var table = layui.table;
var table = layui.table; // 获取table模块 // 进行渲染
// 进行渲染 var tableIns = table.render({
var tableIns = table.render({ elem: '#annTable'
elem: '#annTable' // 绑定到页面中的表格元素 ,url:'./announcement'
,url:'./announcement' // 数据接口地址 ,toolbar: '#headBar'
,toolbar: '#headBar' // 工具栏模板选择器 ,height: 600
,height: 600 // 设置表格高度 ,cols: [[
,cols: [[ // 定义表格列 {field:'id', width:80, title: 'ID', sort: true}
{field:'id', width:80, title: 'ID', sort: true} // ID列 ,{field:'title', width:230, title: '标题'}
,{field:'title', width:230, title: '标题'} // 标题列 ,{field:'detail', width:580, title: '公告'}
,{field:'detail', width:580, title: '公告'} // 公告内容列 ,{field:'publish_date', title: '发布日期', minWidth: 100, sort: true}
,{field:'publish_date', title: '发布日期', minWidth: 100, sort: true} // 发布日期列 ,{fixed: 'right', title:'操作', toolbar: '#rightBar', align: 'center', width:150}
,{fixed: 'right', title:'操作', toolbar: '#rightBar', align: 'center', width:150} // 操作列 ]]
]] });
});
// 头部工具栏事件 // 头部工具栏事件
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 'add': case 'add':
var addCardLayer = layer.open({ var addCardLayer = layer.open({
type: 2, // iframe层 type: 2,
title: '发布公告', // 标题 title: '发布公告',
area: ['800px', '500px'], // 宽高 area: ['800px', '500px'],
maxmin: true, // 允许最大化最小化 maxmin: true,
shadeClose: true, // 点击遮罩关闭 shadeClose: true,
content: '08add.jsp', // iframe的URL content: '08add.jsp',
}); });
//layer.full(addCardLayer); //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>

@ -1,80 +1,82 @@
<%@page import="java.sql.*"%> <!-- 导入Java SQL包 --> <%@page import="java.sql.*"%>
<%@page import="javabean.Base"%> <!-- 导入自定义的Base类 --> <%@page import="javabean.Base"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> <!-- 设置页面语言为Java内容类型和字符编码为UTF-8 --> pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!-- 定义文档类型为HTML 4.01 Transitional --> <!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"> <!-- 设置内容类型和字符编码为UTF-8 --> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="../public/layui/css/layui.css"> <!-- 引入Layui样式表 --> <link rel="stylesheet" href="../public/layui/css/layui.css">
<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标签声明一个名为check的JavaBean作用域为session类为javabean.JDBCBean --> <jsp:useBean id="check" scope="session" class="javabean.JDBCBean"></jsp:useBean>
<% <%
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"> <!-- 创建一个表单action属性为空lay-filter属性为formFilter --> <form class="layui-form layui-form-pane" action="" lay-filter="formFilter">
<input type="text" name="id" value=<%=id %> lay-verify="required" required autocomplete="off" placeholder="请输入姓名" class="layui-input layui-hide"> <!-- 隐藏的输入框用于存储公告的id --> <input type="text" name="id" value=<%=id %> lay-verify="required" required autocomplete="off" placeholder="请输入姓名" class="layui-input layui-hide">
<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的form和jQuery模块 --> layui.use(['form', 'jquery'], function(){
$ = layui.jquery; <!-- 将jQuery赋值给$变量 --> $ = layui.jquery;
var form = layui.form <!-- 获取form模块 --> var form = layui.form
,layer = layui.layer <!-- 获取layer模块 --> ,layer = layui.layer
//监听提交 //监听提交
form.on('submit(submitButton)', function(data){ <!-- 监听表单提交事件 --> form.on('submit(submitButton)', function(data){
$.ajax({ $.ajax({
url: './announcementEdit', <!-- AJAX请求的URL --> url: './announcementEdit',
method: 'post', <!-- HTTP请求方法为POST --> method: 'post',
data: data.field, <!-- 发送的数据为表单数据 --> data: data.field,
dataType: 'json', <!-- 期望服务器返回的数据类型为JSON --> dataType: 'json',
success: function(data){ <!-- AJAX请求成功时的回调函数 --> success: function(data){
if(data.code == "0"){ <!-- 如果返回的code为0表示操作成功 --> if(data.code == "0"){
parent.layer.msg("添加成功",{ <!-- 显示成功消息 --> parent.layer.msg("添加成功",{
icon: 6, <!-- 消息图标类型 --> icon: 6,
time: 500 <!-- 消息显示时间 --> time: 500
}); });
setTimeout(function(){ <!-- 延迟500毫秒后刷新父页面 --> setTimeout(function(){
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>

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

@ -1,52 +1,52 @@
<%@ page import="java.sql.*"%> <!-- 导入Java SQL包 --> <%@ page import="java.sql.*"%>
<%@ page import="java.util.*"%> <!-- 导入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"%> <!-- 设置页面语言为Java内容类型为HTML字符编码为UTF-8 --> pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!-- 定义文档类型为HTML 4.01 Transitional --> <!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="check" scope="session" class="javabean.JDBCBean"></jsp:useBean> <!-- 使用JSP beanID为check作用域为session类为javabean.JDBCBean --> <jsp:useBean id="check" scope="session" class="javabean.JDBCBean"></jsp:useBean>
<% <%
String psw1 = request.getParameter("psw1"); //获取请求参数psw1 String psw1 = request.getParameter("psw1");
String psw2 = request.getParameter("psw2"); //获取请求参数psw2 String psw2 = request.getParameter("psw2");
String email1 = request.getParameter("email1");//获取请求参数email1 String email1 = request.getParameter("email1");
String email2 = request.getParameter("email2"); //获取请求参数email2 String email2 = request.getParameter("email2");
String name1 = request.getParameter("name1"); //获取请求参数name1 String name1 = request.getParameter("name1");
String name2 = request.getParameter("name2"); //获取请求参数name2 String name2 = request.getParameter("name2");
//out.println(psw1 + " " + psw2); <!-- 输出psw1和psw2的值已注释 --> //out.println(psw1 + " " + psw2);
String id = session.getAttribute("manager").toString(); //从session中获取manager属性并转换为字符串 String id = session.getAttribute("manager").toString();
if(psw1!=null && psw2!=null){ //如果psw1和psw2不为空 if(psw1!=null && psw2!=null){
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("")) { //如果psw1等于psw2且都不为空且不全是空格 && !psw2.trim().equals("")) {
String sql = "update manager set PASSWORD ='" + psw1 + "' where ACCOUNT='" + id +"'"; //构建SQL更新语句 String sql = "update manager set PASSWORD ='" + psw1 + "' where ACCOUNT='" + id +"'";
try { try {
int i = check.executeUpdate(sql); //执行SQL更新语句 int i = check.executeUpdate(sql);
if (i == 1) { //如果更新成功 if (i == 1) {
%> %>
<script> <script>
alert('修改成功!');//输出修改成功信息 alert('修改成功!');
window.location.href = "09managerSelf.jsp";//跳转到09managerSelf.jsp页面 window.location.href = "09managerSelf.jsp";
</script> </script>
<% <%
} else { } else {
%> %>
<script> <script>
alert('修改未成功!');//输出修改未成功信息 alert('修改未成功!');
window.location.href = "09managerSelf.jsp";//跳转到09managerSelf.jsp页面 window.location.href = "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>
<% <%
@ -61,18 +61,18 @@
} }
}else if(email1!=null && email2!=null){//如果email1和email2不为空 }else if(email1!=null && email2!=null){
//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("")) {//如果email1等于email2且都不为空且不全是空格 && !email2.trim().equals("")) {
String sql = "update manager set EMAIL ='" + email1 + "' where ACCOUNT='" + id +"'";//构建SQL更新语句 String sql = "update manager set EMAIL ='" + email1 + "' where ACCOUNT='" + id +"'";
try { try {
int i = check.executeUpdate(sql);//执行SQL更新语句 int i = check.executeUpdate(sql);
if (i == 1) {//如果更新成功 if (i == 1) {
%> %>
<script> <script>
alert('修改成功!');//输出修改成功信息 alert('修改成功!');
window.location.href = "09managerSelf.jsp"; window.location.href = "09managerSelf.jsp";
</script> </script>
@ -103,11 +103,11 @@
} }
}else if(name1!=null && name2!=null){//如果name1和name2不为空 }else if(name1!=null && name2!=null){
//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("")) {//如果name1等于name2且都不为空且不全是空格 && !name2.trim().equals("")) {
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);

@ -3141,381 +3141,354 @@
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; /* 指定使用zoomOutLeft关键帧动画 */ -webkit-animation-name: zoomOutLeft;
animation-name: zoomOutLeft; /* 指定使用zoomOutLeft关键帧动画 */ animation-name: 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; /* 指定使用zoomOutRight关键帧动画 */ -webkit-animation-name: zoomOutRight;
animation-name: zoomOutRight; /* 指定使用zoomOutRight关键帧动画 */ animation-name: 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; /* 指定使用zoomOutUp关键帧动画 */ -webkit-animation-name: zoomOutUp;
animation-name: zoomOutUp; /* 指定使用zoomOutUp关键帧动画 */ animation-name: 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; /* 指定使用slideInDown关键帧动画 */ -webkit-animation-name: slideInDown;
animation-name: slideInDown; /* 指定使用slideInDown关键帧动画 */ animation-name: 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; /* 使用slideInLeft动画 */ -webkit-animation-name: slideInLeft;
animation-name: slideInLeft; /* 使用slideInLeft动画 */ animation-name: 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; /* 使用slideInRight动画 */ -webkit-animation-name: slideInRight;
animation-name: slideInRight; /* 使用slideInRight动画 */ animation-name: 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; /* 使用slideInUp动画 */ -webkit-animation-name: slideInUp;
animation-name: slideInUp; /* 使用slideInUp动画 */ animation-name: 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; /* 使用slideOutDown动画 */ -webkit-animation-name: slideOutDown;
animation-name: slideOutDown; /* 使用slideOutDown动画 */ animation-name: 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; /* 使用slideOutLeft动画 */ -webkit-animation-name: slideOutLeft;
animation-name: slideOutLeft; /* 使用slideOutLeft动画 */ animation-name: 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; /* 使用slideOutRight动画 */ -webkit-animation-name: slideOutRight;
animation-name: slideOutRight; /* 使用slideOutRight动画 */ animation-name: 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; /* 使用slideOutUp动画 */ -webkit-animation-name: slideOutUp;
animation-name: slideOutUp; /* 使用slideOutUp动画 */ animation-name: slideOutUp;
} }

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

@ -1,50 +1,45 @@
/* 导入Lato字体 */ /* General Demo Style */
@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,用于清除浮动 */ /* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-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;
@ -52,19 +47,17 @@ 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%;
@ -73,12 +66,10 @@ 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;
@ -88,7 +79,11 @@ 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;
@ -104,33 +99,32 @@ 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%; /* 列宽变为100% */ width: 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;
} }
} }

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

@ -1,141 +1,133 @@
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{
.border { height: 99%;
height: 99%; /* 设置高度为父容器的99% */ width: 30%;
width: 30%; /* 设置宽度为父容器的30% */
} }
.rain{
.rain { height: 400px;
height: 400px; /* 设置固定高度为400像素 */ width: 35%;
width: 35%; /* 设置宽度为父容器的35% */
} }
/* Layout with mask */
/* 使用遮罩布局 */ .rain{
.rain { padding: 10px 12px 12px 10px;
padding: 10px 12px 12px 10px; /* 设置内边距 */ -moz-box-shadow: 10px 10px 10px 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阴影效果 */ -webkit-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阴影效果 */ box-shadow: 8px 8px 8px rgba(255,255,255,1) inset, -9px -9px 8px rgba(255,255,255,1) inset;
box-shadow: 8px 8px 8px rgba(255,255,255,1) inset, -9px -9px 8px rgba(255,255,255,1) inset; /* 标准阴影效果 */ margin: 100px auto;
margin: 100px auto; /* 设置外边距,使元素居中 */
} }
/* Artifical "border" to clear border to bypass mask */
/* 人工“边框”以清除遮罩 */ .border{
.border { padding: 1px;
padding: 1px; /* 设置内边距 */ -moz-border-radius: 5px;
-moz-border-radius: 5px; /* Firefox圆角效果 */ -webkit-border-radius: 5px;
-webkit-border-radius: 5px; /* Webkit圆角效果 */ border-radius: 5px;
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;
/* Firefox下的蓝色渐变背景 */ /* Blue-ish Green Fallback for Mozilla */
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;
/* IE滤镜效果 */ /* Just do something for IE-suck */
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; /* Firefox过渡属性 */ -moz-transition-property: background-position;
-moz-transition-duration: 30s; /* Firefox过渡持续时间 */ -moz-transition-duration: 30s;
-moz-transition-timing-function: linear; /* Firefox过渡时间函数 */ -moz-transition-timing-function: linear;
-webkit-transition-property: background-position; /* Webkit过渡属性 */ -webkit-transition-property: background-position;
-webkit-transition-duration: 30s; /* Webkit过渡持续时间 */ -webkit-transition-duration: 30s;
-webkit-transition-timing-function: linear; /* Webkit过渡时间函数 */ -webkit-transition-timing-function: linear;
-o-transition-property: background-position; /* Opera过渡属性 */ -o-transition-property: background-position;
-o-transition-duration: 30s; /* Opera过渡持续时间 */ -o-transition-duration: 30s;
-o-transition-timing-function: linear; /* Opera过渡时间函数 */ -o-transition-timing-function: linear;
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, -4800px 0, -4200px 0, -3600px 0; /* 设置背景位置 */ background-position: -5400px 0, -4600px 0, -3800px 0, -3000px 0;
} }
/* 关键帧动画 */ /* Keyfram-licious animation */
@-webkit-keyframes colors { @-webkit-keyframes colors {
0% {background: pink;} /* 开始时的颜色 */ 0% {background-color: pink;}
15% {background: hotpink;} /* 15%时的颜色 */ 15% {background-color: hotpink;}
30% {background: rosybrown;} /* 30%时的颜色 */ 30% {background-color: rosybrown;}
45% {background: steelblue;} /* 45%时的颜色 */ 45% {background-color: steelblue;}
60% {background: black;} /* 60%时的颜色 */ 60% {background-color: black;}
75% {background: #c9c0d3;} /* 75%时的颜色 */ 75% {background-color: #c9c0d3;}
90% {background: darkgreen;} /* 90%时的颜色 */ 90% {background-color: darkgreen;}
100% {background: orange;} /* 结束时的颜色 */ 100% {background-color: orange;}
} }
.border,.rain{
.border, -webkit-animation-direction: normal;
.rain { -webkit-animation-duration: 20s;
-webkit-animation-direction: normal; /* Webkit动画方向 */ -webkit-animation-iteration-count: infinite;
-webkit-animation-duration: 20s; /* Webkit动画持续时间 */ -webkit-animation-name: colors;
-webkit-animation-iteration-count: infinite; /* Webkit动画迭代次数 */ -webkit-animation-timing-function: ease;
-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) inset; /* Firefox阴影效果 */ -moz-box-shadow: 0px 0px 15px rgba(255,255,255,.2);
-webkit-box-shadow: 0px 0px 15px rgba(255,255,255,.2) inset; /* Webkit阴影效果 */ -webkit-box-shadow: 0px 0px 15px rgba(255,255,255,.2);
box-shadow: 0px 0px 15px rgba(255,255,255,.2) inset; /* 标准阴影效果 */ box-shadow: 0px 0px 15px rgba(255,255,255,.2);
-webkit-animation-name: none; /* Webkit无动画 */ -webkit-animation-name: none;
} }
.rain.unfocus{
.rain.unfocus { background: #000 !important;
background: #000 !important; /* 强制背景颜色 */ -webkit-animation-name: none;
-webkit-animation-name: none; /* Webkit无动画 */
} }
/* 表单样式 */ /* Regular Form Styles */
form { form{
background: darkred; /* 设置背景颜色为深红色 */ background: darkred;
-moz-border-radius: 5px; /* Firefox圆角效果 */ -moz-border-radius: 5px;
-webkit-border-radius: 5px; /* Webkit圆角效果 */ -webkit-border-radius: 5px;
border-radius: 5px; /* 标准圆角效果 */ border-radius: 5px;
height: 100%; /* 设置高度为父容器的100% */ height: 100%;
width: 335%; /* 设置宽度为父容器的335% */ width: 335%;
background: -moz-radial-gradient(center 46% 90deg, closest-corner, white, lightblue); /* Firefox径向渐变背景 */ background: -moz-radial-gradient(50% 46% 90deg,circle closest-corner, white, lightblue);
background: -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 150, from(lightcyan), to(lightblue));/* Webkit径向渐变背景 */ background: -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 150, from(lightcyan), to(lightblue));
} }
form label{
form label { display: block;
display: block; /* 块级显示 */ padding: 10px 10px 5px 15px;
padding: 10px 15px 10px 15px; /* 设置内边距 */ font-size: 20px;
font-size: 20px; /* 设置字体大小 */ color: hotpink;
color: hotpink; /* 设置字体颜色 */
} }
form input { form textarea{
display: block; /* 块级显示 */ display: block;
margin: 5px 10px 10px 15px; /* 设置外边距 */ margin: 5px 10px 10px 15px;
width: 85%; /* 设置宽度为父容器的85% */ width: 85%;
background: #f0f8ff; /* 设置背景颜色 */ background: #f0f8ff;
-moz-box-shadow: 0px 0px 4px grey inset; /* Firefox阴影效果 */ -moz-box-shadow: 0px 0px 4px grey inset;
-webkit-box-shadow: 0px 0px 4px grey inset; /* Webkit阴影效果 */ -webkit-box-shadow: 0px 0px 4px grey inset;
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{
form input:focus { outline: 2px solid white;
outline: 2px solid white; /* 设置聚焦时的轮廓线 */ color: #c0c0c0;
color: #c0c0c0; /* 设置聚焦时的字体颜色 */ background-color: white;
background-color: white; /* 设置聚焦时的背景颜色 */
} }

File diff suppressed because it is too large Load Diff

@ -54,4 +54,4 @@ var ModalEffects = (function() {
init(); init();
})();//结束 })();

@ -1,94 +1,91 @@
<%@ 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 CSS --> <!-- Bootstrap -->
<link href="../css/bootstrap.min.css" rel="stylesheet"> <link href="../css/bootstrap.min.css" rel="stylesheet">
<!-- 引入jQueryBootstrap的JavaScript插件依赖于jQuery --> <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery所以必须放在前边) -->
<script src="../js/jquery.min.js"></script> <script src="../js/jquery.min.js"></script>
<!-- 引入Bootstrap JavaScript --> <script src="../js/bootstrap.min.js"></script>
<script src="../js/bootstrap.min.js"></script> <style>
.showCarousel .carousel-inner > .item > img {
<style> display: block;
/* 轮播图图片样式 */ width:100%;
.showCarousel .carousel-inner > .item > img { height:620px;
display: block; }
width:100%; .showCarousel{
height:620px; margin-top:2%;
} }
/* 轮播图顶部间距 */ font{
.showCarousel{ font-size:40px;
margin-top:2%; color:black;
} font-family:YouYuan;
/* 字体样式 */ font-weight:900;
font{ }
font-size:40px; .carousel-caption{
color:black; margin-bottom:10%;
font-family:YouYuan; }
font-weight:900; </style>
}
/* 轮播图文字描述底部间距 */
.carousel-caption{
margin-bottom:10%;
}
</style>
</head> </head>
<body> <body>
<% <%
// 检查会话属性 'reader' 和 'reader_first' 是否不为空且 'reader_first' 等于 "1" if(session.getAttribute("reader")!=null && session.getAttribute("reader_first")!=null &&session.getAttribute("reader_first").equals("1")){
if(session.getAttribute("reader") != null && session.getAttribute("reader_first") != null && session.getAttribute("reader_first").equals("1")){ session.setAttribute("reader_first", "2");
// 将 'reader_first' 设置为 "2",表示用户已经访问过 //session.setAttribute("reader", session.getAttribute("reader"));
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="path/to/image1.jpg" alt="..."> <!-- 在这里添加你的图片路径 --> <img src="../public/image/1.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="path/to/image2.jpg" alt="..."> <!-- 在这里添加你的图片路径 --> <img src="../public/image/2.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="path/to/image3.jpg" alt="..."> <!-- 在这里添加你的图片路径 --> <img src="../public/image/3.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>

@ -1,64 +1,61 @@
<%@ 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的CSS文件 --> <!-- 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>
<script src="../js/bootstrap.min.js"></script>
<style>
<style> </style>
</style>
</head> </head>
<body> <body>
<!-- 导航栏 --> <nav class="navbar navbar-inverse" role="navigation">
<nav class="navbar navbar-inverse" role="navigation"> <div class="container-fluid">
<div class="container-fluid"> <!-- Brand and toggle get grouped for better mobile display -->
<!-- Brand and toggle get grouped for better mobile display --> <div class="navbar-header">
<div class="navbar-header"> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<!-- 折叠按钮,用于在小屏幕设备上显示菜单 --> <span class="sr-only">Toggle navigation</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> <span class="icon-bar"></span>
<span class="icon-bar"></span> </button>
<span class="icon-bar"></span> <a class="navbar-brand" href="#">欢迎登陆图书管理系统</a>
</button> </div>
<!-- 网站标题 -->
<a class="navbar-brand" href="#">欢迎登陆图书管理系统</a> <!-- Collect the nav links, forms, and other content for toggling -->
</div> <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">
<li><p style="margin-top:25%;color:grey;">借阅者页面<span class="sr-only">(current)</span></p></li>
</ul>
<!-- 右侧导航链接 --> <ul class="nav navbar-nav navbar-right">
<ul class="nav navbar-nav navbar-right"> <li><a href="javascript:;">
<li><a href=";">
<!-- 如果session中没有reader属性则不显示任何内容否则显示reader的值 -->
<%if(session.getAttribute("reader")==null){ <%if(session.getAttribute("reader")==null){
// 空操作
} else{%> } else{%>
<%=session.getAttribute("reader") %> <%=session.getAttribute("reader") %>
<%} %> <%} %>
</a></li> </a></li>
<!-- 如果session中有reader属性则显示退出链接否则显示登录链接 --> <%if(session.getAttribute("reader") !=null) {%>
<%if(session.getAttribute("reader") !=null) {%> <li><a href="./exit" target="_parent">退出</a></li>
<li><a href="./exit" target="_parent">退出</a></li> <%}else{%>
<%}else{%> <li><a href="04readerFrame.jsp" target="_parent" onClick="">登录</a></li>
<li><a href="04readerFrame.jsp" target="_parent" onClick="">登录</a></li> <%}
<%} %>
%>
</ul> </ul>
</div>
</div> </div>
</div> </nav>
</nav>
</body> </body>
</html> </html>

@ -1,68 +1,54 @@
<%@ 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所以必须放在前边) -->
<!-- 这里没有实际引入jQuery但通常需要引入 --> <script src="../js/jquery.min.js"></script>
<style> <script src="../js/bootstrap.min.js"></script>
/* 自定义侧边栏菜单项的悬停效果 */ <style>
.sidebar li a:hover{ .sidebar li a:hover{
background:#337ab7; /* 背景颜色设置为蓝色 */ background:#337ab7;
color:white; /* 文字颜色设置为白色 */ color:white;
} }
/* 自定义侧边栏菜单项获得焦点时的效果 */ .faq-tabbable li a:focus{
.faq-tabbable li a:focus{ background:skyblue;
background:skyblue; /* 背景颜色设置为天蓝色 */ color:white;
color:white; /* 文字颜色设置为白色 */ }
} </style>
</style>
</head> </head>
<body> <body>
<div style="text-align:center;width:100%;height:100%;font-size20px;"> <div style="text-align:center;width:100%;height:100%;font-size20px;">
<!-- 创建一个居中的div容器宽度和高度均为100%字体大小为20px --> <ul class="nav nav-pills nav-stacked nav-inverse sidebar faq-tabbable">
<ul class="nav nav-pills nav-stacked nav-inverse sidebar faq-tabbable">
<!-- 创建一个无序列表,用于显示侧边栏菜单项 -->
<% if(session.getAttribute("reader")!=null){%> <% if(session.getAttribute("reader")!=null){%>
<!-- 如果 session 中存在 reader 属性,则显示以下菜单项 --> <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="01main.jsp" target="view_frame"><span class="glyphicon glyphicon-picture" 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="05book.jsp" target="view_frame"><span class="glyphicon glyphicon-search" 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="index.jsp" target="view_frame"><span class="glyphicon glyphicon-user" 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="06borrow.jsp" target="view_frame"><span class="glyphicon glyphicon-book" 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="13message.jsp" target="view_frame"><span class="glyphicon glyphicon-pencil" 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> }else{
<!-- 菜单项:个人信息 --> %>
<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="01main.jsp" target="view_frame"><span class="glyphicon glyphicon-picture" 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="08illegalInfo.jsp" target="view_frame"><span class="glyphicon glyphicon-remove" 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="13message.jsp" target="view_frame"><span class="glyphicon glyphicon-pencil" 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>
<!-- 菜单项:读者留言 --> <%
<% } else { %> }
<!-- 如果 session 中不存在 reader 属性,则显示以下菜单项 --> %>
<li role="presentation"><a href="01main.jsp" target="view_frame"><span class="glyphicon glyphicon-picture" aria-hidden="true">&nbsp;首页</span></a></li> </ul>
<!-- 菜单项:首页 --> </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>

@ -3,50 +3,33 @@
<!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">
<!-- 设置页面字符编码为UTF-8 --> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>借阅者页面</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <!-- Bootstrap -->
<!-- 确保页面在IE浏览器中以最新的渲染模式显示 --> <link href="../css/bootstrap.min.css" rel="stylesheet">
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery所以必须放在前边) -->
<meta name="viewport" content="width=device-width, initial-scale=1"> <script src="../js/jquery.min.js"></script>
<!-- 使页面在移动设备上具有响应式设计 --> <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">
<!-- 使用frameset布局将页面分为上下两个部分 --> <frame src="02readerNav.jsp" scrolling="no">
<frameset rows="7%,*" frameborder="no" border="0">
<!-- 第一部分占整个页面高度的7%,不显示滚动条 -->
<frame scrolling="no">
<!-- 这里可以放置导航栏或其他固定内容 -->
</frame>
<!-- 第二部分占整个页面剩余的高度,分为左右两个部分 --> <frameset cols="14%,*" frameborder="no" border="0">
<frameset cols="14%,*" frameborder="no" border="0"> <frame src="03readerNavLeft.jsp">
<!-- 左侧部分占整个页面宽度的14%,右侧部分占剩余宽度 -->
<frame >
<!-- 左侧框架,可以放置菜单或导航 -->
</frame>
<% <%
if(session.getAttribute("reader") == null){ if(session.getAttribute("reader") == null){
%> %>
<!-- 如果session中没有reader属性则显示一个空的view_frame框架 --> <frame src="06borrow.jsp" name="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>

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

@ -1,116 +1,130 @@
<%@ 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"> <!-- 定义文档类型为HTML 4.01 Transitional --> <!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 href="../css/bootstrap.min.css" rel="stylesheet"> <!-- 引入Bootstrap CSS文件 --> <link href="../css/bootstrap.min.css" rel="stylesheet">
<link href="../css/bootstrap-table.css" rel="stylesheet"> <!-- 引入Bootstrap Table CSS文件 --> <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 CSS文件 --> <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; /* 设置表格的外边距为0 */ margin: 0 0px;
} }
</style> </style>
</head> </head>
<body> <body>
<!-- 表单 --> <script src="../public/layui/layui.js" charset="utf-8"></script>
<% if(session.getAttribute("reader")==null){%> <!-- 检查用户是否登录 --> <!-- 表单 -->
location.href = "../loginReader.html"; <!-- 如果未登录,重定向到登录页面 --> <% if(session.getAttribute("reader")==null){%>
<% } %> <script>
<table class="layui-hide" id="cardTable" lay-filter="formFilter"></table> <!-- 隐藏的表格元素,用于后续渲染 --> location.href = "../loginReader.html";
</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"> <!-- 下拉选择框,用于选择查询条件 --> <div class="layui-inline">
<option value=""></option> <select id="condition" name="condition" lay-verify="required">
<option value="book_id">图书编号</option> <option value=""></option>
<option value="borrow_date">借阅日期</option> <option value="book_id">图书编号</option>
<option value="end_date">截止日期</option> <option value="borrow_date">借阅日期</option>
<option value="return_date">归还日期</option> <option value="end_date">截止日期</option>
</select> <option value="return_date">归还日期</option>
</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库 --> </select>
<script src="../js/bootstrap.min.js"></script> <!-- 引入Bootstrap JavaScript文件 --> </div>
<script src="../js/bootstrap-table.min.js"></script> <!-- 引入Bootstrap Table JavaScript文件 --> <div class="layui-inline">
<script src="../public/layui/layui.js"></script> <!-- 引入Layui JavaScript文件 --> <input class="layui-input" id="conditionValue" name="conditionValue" id="demoReload" autocomplete="off">
<script> </div>
layui.use(['table','jquery'], function(){ <!-- 使用Layui的table和jQuery模块 --> <button class="layui-btn" name="condition" data-type="reload" lay-event="search">搜索</button>
$ = layui.jquery; <!-- 获取jQuery对象 --> </script>
var table = layui.table; <!-- 获取table对象 -->
// 进行渲染
var tableIns = table.render({
elem: '#cardTable' <!-- 绑定表格元素 --> <script>
,url:'./borrow' <!-- 数据接口地址 --> layui.use(['table','jquery'], function(){
,toolbar: '#headBar' <!-- 绑定工具栏元素 --> $ = layui.jquery;
,cols: [[ var table = layui.table;
{field:'card_id', width:180, title: '借阅证号', sort: true}, <!-- 定义表格列 --> // 进行渲染
{field:'book_id', width:130, title: '图书编号', sort: true}, var tableIns = table.render({
{field:'borrow_date', width:250, title: '借阅日期', sort: true}, elem: '#cardTable'
{field:'end_date', title: '截止日期', width: 250, sort: true}, ,url:'./borrow'
{field:'return_date', width:250, title: '归还时间', sort: true} ,toolbar: '#headBar'
]] ,cols: [[
,page: true <!-- 启用分页 --> {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
});
// 头部工具栏事件
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':
table.on('toolbar(formFilter)', function(obj){ var addCardLayer = layer.open({
var checkStatus = table.checkStatus(obj.config.id); <!-- 获取选中状态 --> type: 2,
switch(obj.event){ title: '添加借书证',
case 'search': <!-- 处理搜索事件 --> area: ['800px', '500px'],
var conditionValue = $('#conditionValue'); <!-- 获取条件值输入框 --> maxmin: true,
var condition = $('#condition'); <!-- 获取条件选择框 --> shadeClose: true,
// 进行搜索,重新渲染 content: 'cardadd.jsp',
tableIns.reload({ });
where: { //设定异步数据接口的额外参数,任意设 //layer.full(addCardLayer);
"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; <!-- 获取当前行的DOM对象 --> 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>

@ -1,57 +1,56 @@
<%@ page import="java.sql.*" %> <!-- 导入Java SQL包用于数据库操作 --> <%@ page import="java.sql.*" %>
<%@ 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"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!-- 定义文档类型为HTML 4.01 Transitional --> <!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"> <!-- 设置字符编码为UTF-8 --> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <!-- 设置IE浏览器的兼容模式 --> <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"> <link href="../css/bootstrap.min.css" rel="stylesheet">
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery所以必须放在前边) --> <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery所以必须放在前边) -->
<script src="../js/jquery.min.js"></script>
<style> <script src="../js/bootstrap.min.js"></script>
body{ <style>
font-family:YouYuan; /* 设置页面字体为YouYuan */ body{
} 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" "this.start()" "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" onMouseOut="this.start()" onMouseOver="this.stop()">
&#10084;图书馆公告栏,记得查收公告呀!&#10084; <!-- 滚动公告栏 --> ❤图书馆公告栏,记得查收公告呀!❤
</marquee> </marquee> 
</div> </div>
<div class="a" align="center"> <div class="a" align="center">
<h2>近期公告</h2> <!-- 显示“近期公告”标题 --> <h2>近期公告</h2>
<jsp:useBean id="check" scope="session" class="javabean.JDBCBean"></jsp:useBean> <!-- 使用JSP标签声明一个JavaBean对象ID为check作用域为session类为javabean.JDBCBean --> <jsp:useBean id="check" scope="session" class="javabean.JDBCBean"></jsp:useBean>
<!-- 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%;"> <!-- 创建一个Bootstrap面板样式为信息面板左边距为5%宽度为80% --> <div class="panel panel-info" style="margin-left:5%;width: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>

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

@ -1,62 +1,64 @@
<%@ page import="java.sql.*"%> <!-- 导入Java SQL包 --> <%@ page import="java.sql.*"%>
<%@ page import="java.util.*"%> <!-- 导入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"%> <!-- 设置页面语言为Java内容类型和字符编码为UTF-8 --> pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!-- 定义HTML文档类型 --> <!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>修改密码</title> <!-- 设置页面标题 --> <title>修改密码</title>
<script src="${ctx}/toastr/toastr.min.js"></script>
<link rel="stylesheet" href="${ctx}/toastr/toastr.min.css"> <!-- 引入外部CSS样式表 --> <link rel="stylesheet" href="${ctx}/toastr/toastr.min.css">
</head> </head>
<body> <body>
<jsp:useBean id="check" scope="session" class="javabean.JDBCBean"></jsp:useBean> <!-- 使用JSP的useBean标签来实例化一个名为check的JavaBean对象 --> <jsp:useBean id="check" scope="session" class="javabean.JDBCBean"></jsp:useBean>
<% <%
String psw1 = request.getParameter("psw1"); <!-- 获取请求参数psw1的值 --> String psw1 = request.getParameter("psw1");
String psw2 = request.getParameter("psw2"); <!-- 获取请求参数psw2的值 --> String psw2 = request.getParameter("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("")
window.location.href = "index.jsp"; <!-- 重定向到index.jsp页面 --> && !psw2.trim().equals("")) {
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>

@ -1,79 +1,68 @@
<%@ 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" pageEncoding="UTF-8"%> <%@ page language="java" contentType="text/html; charset=UTF-8"
<!-- 以上三行为JSP页面指令用于设置页面属性和导入所需的Java包 --> 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">
<!-- 设置页面字符编码为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">
<!-- 兼容IE浏览器 --> <title></title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- 响应式布局的视口设置 --> <!-- Bootstrap -->
<title></title> <link href="../css/bootstrap.min.css" rel="stylesheet">
<!-- 页面标题为空 --> <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery所以必须放在前边) -->
<!-- 引入Bootstrap CSS和JS文件 --> <script src="../js/jquery.min.js"></script>
<!-- Bootstrap是一个前端框架用于快速布局和样式设计 --> <script src="../js/bootstrap.min.js"></script>
<link href="../css/bootstrap.min.css" rel="stylesheet">
<script src="../js/jquery.min.js"></script> <link rel="stylesheet" id="templatecss" type="text/css" href="../public/css/message.css">
<script src="../js/bootstrap.min.js"></script> <style>
<!-- 引入自定义CSS --> body{
<link rel="stylesheet" id="templatecss" type="text/css" href="../public/css/message.css"> background-color:#fff;
<!-- 内联样式设置body的背景色和文字颜色 --> color:black;
<style> }
body{ </style>
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){
%> %>
<!-- 如果ID为奇数使用蓝色按钮展示规则信息并设置popover提示 --> <button type="button" class="btn btn-lg btn-info" title="可借阅数量:<%=rs.getString("BORROW_NUM") %>" data-html="true"
<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-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{
%> %>
<!-- 如果ID为偶数使用蓝色按钮展示规则信息并设置popover提示 --> <button type="button" class="btn btn-lg btn-primary" title="可借阅数量:<%=rs.getString("BORROW_NUM") %>" data-html="true"
<button type="button" class="btn btn-lg btn-primary" title="可借阅数量:<%=rs.getString("BORROW_NUM") %>" data-html="true" data-container="body" data-trigger="focus" data-toggle="popover" data-placement="right"
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%;">
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>
<% <%
} }
} }
%> %>
<!-- 结束JSP脚本 --> </div>
</div>
</body> </body>
</html> </html>

@ -1,53 +1,46 @@
<%@ 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 CSS文件 --> <!-- 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> <script src="../js/jquery.min.js"></script>
<!-- 引入自定义CSS文件 --> <script src="../js/bootstrap.min.js"></script>
<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>
<!-- 以下JavaScript代码被注释掉了用于在页面加载时设置当前日期和时间 --> //$(document).ready(function () {
<!-- $(document).ready(function () { // var date = new Date(+new Date()+8*3600*1000).toISOString().replace(/T/g,' ').replace(/\.[\d]{3}Z/,'');
var date = new Date(+new Date()+8*3600*1000).toISOString().replace(/T/g,' ').replace(/\.[\d]{3}Z/,''); // alert(date);//2017-01-22 11:08:46
(date);//2017-01-22 11:08:46 // $('#date_info').val(today);
$('#date_info').val(today); //})
}) --> </script>
<div class="rain">
<div class="rain"> <div class="border start">
<div class="border start"> <form action="14messageSub.jsp" method="post">
<!-- 表单提交到14messageSub.jsp使用POST方法 --> <label for="mes" style="margin-left:36%;">留言板</label>
<form action="14messageSub.jsp" method="post"> <textarea id="mes" name="msg" placeholder="请输入您的留言" style="height:50%;width:90%"></textarea>
<!-- 留言板标题 --> <!-- <label for="date">日期</label>-->
<label for="mes" style="margin-left:36%;">留言板</label> <!-- <input id="date" type="text" name="time" placeholder="请输入时间" style="width:90%"/><br> -->
<!-- 多行文本输入框,用于用户输入留言 --> <!-- <input type="datetime_local" id="date_info" placeholder="请输入时间"/> -->
<textarea id="mes" name="msg" placeholder="请输入您的留言" style="height:50%;width:90%"></textarea> <br><br>
<!-- 日期输入框被注释掉 --> <div align="center">
<!-- <label for="date">日期</label>--> <button type="submit" class="btn btn-warning" style="margin-left:0">提交</button>&emsp;&emsp;&emsp;
<!-- <input id="date" type="text" name="time" placeholder="请输入时间" style="width:90%"/><br> --> <button type="reset" class="btn btn-danger" style="margin-right:0">重置</button>&emsp;&emsp;&emsp;
<!-- <input type="datetime_local" id="date_info" placeholder="请输入时间"/> --> <button type="reset" class="btn btn-info" style="margin-right:0" onClick="location.href='15checkMessage.jsp'">查看留言</button>
<br><br> </div>
<div align="center"> </form>
<!-- 提交按钮 -->
<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>
</form> </div>
</div> </body>
</div>
</body>
</body> </body>
</html> </html>

@ -1,53 +1,47 @@
<%@ page import="java.sql.*" %> <!-- 导入Java SQL包用于数据库操作 --> <%@ page import="java.sql.*" %>
<%@ page import="java.util.*" %> <!-- 导入Java工具包包含日期时间类等 --> <%@ page import="java.util.*" %>
<%@ page import="javabean.DateTime"%> <!-- 导入自定义的DateTime类 --> <%@ page import="javabean.DateTime"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" <%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%> <!-- 设置页面语言为Java内容类型和字符编码为UTF-8 --> pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!-- 定义HTML文档类型 --> <!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"> <!-- 设置字符编码为UTF-8 --> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <!-- 设置IE浏览器兼容模式 --> <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"> <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>
<!-- 自定义CSS文件 --> <link rel="stylesheet" id="templatecss" type="text/css"
<link rel="stylesheet" id="templatecss" type="text/css" href="../public/css/message.css"> href="../public/css/message.css">
</head> </head>
<body> <body>
<!-- 使用JSP标签声明一个JavaBean对象msg作用域为session类为javabean.JDBCBean --> <jsp:useBean id="msg" scope="session" class="javabean.JDBCBean"></jsp:useBean>
<jsp:useBean id="msg" scope="session" class="javabean.JDBCBean"></jsp:useBean> <%
<% DateTime date=new DateTime();
// 创建DateTime对象实例 //out.println(date.show());
DateTime date = new DateTime(); String time = date.show();
// 获取当前时间字符串
String time = date.show();
// 从请求中获取参数msg的值 String mes = request.getParameter("msg");
String mes = request.getParameter("msg");
try { try{
// 从session中获取reader属性并转换为字符串
String card = session.getAttribute("reader").toString(); 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 + "');";
// 检查card和mes是否不为空且mes不为空白字符串 if (card!=null&&mes!=null&& !mes.trim().equals("")) {
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";//将当前浏览器窗口重定向到指定的jsp window.location.href = "15checkMessage.jsp";
</script> </script>
<% <%
} }

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

@ -1,122 +1,141 @@
<%@ page import="java.sql.*"%> <!-- 导入Java SQL包用于数据库操作 --> <%@ page import="java.sql.*"%>
<%@ 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"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!-- 定义文档类型为HTML 4.01 Transitional --> <!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" /> <!-- 设置字符编码为UTF-8 --> <meta charset="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"> <!-- 引入Bootstrap样式表 --> <link href="../css/bootstrap.min.css" rel="stylesheet">
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery所以必须放在前边) --> <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery所以必须放在前边) -->
<script src="../js/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="../public/css/default.css" /> <!-- 引入默认样式表 --> <script src="../js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css"
href="../public/css/component.css" /> <!-- 引入组件样式表 -->
<link rel="stylesheet" type="text/css" href="../public/css/default.css" />
<link rel="stylesheet" type="text/css"
href="../public/css/component.css" />
<script src="../public/js/modernizr.custom.js"></script>
</head> </head>
<body> <body>
<% <%
if (session.getAttribute("reader") == null) { //<!-- 如果会话中的reader属性为空 --> if (session.getAttribute("reader") == null) {
%> %>
location.href = "../loginReader.html"; <!-- 重定向到登录页面 --> <script>
<% 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"> <!-- 表单提交到11updatePswSus.jsp使用POST方法水平排列表单元素 --> class="form-horizontal">
<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>
<label for="psw1" class="col-sm-2 control-label">新密码</label> <!-- 新密码标签 --> <div class="form-group" align="center">
<div class="col-sm-10" align="center"> <!-- 输入框容器 --> <label for="psw2" class="col-sm-2 control-label">新密码</label>
<input type="password" class="form-control" name="psw1" id="password1" placeholder="请输入新密码" style="width:70%;"/> <!-- 新密码输入框 --> <div class="col-sm-10">
<input type="password" class="form-control" name="psw2" id="password2" placeholder="请再次输入密码进行确认" style="width:70%;"/>
</div>
</div> </div>
</div> <div align="center">
<br> <input type="submit" class="btn btn-primary" value="确认">
<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>
</div> </form>
</form> <button class="md-close btn-primary">取消</button>
<button class="md-close btn-primary">取消</button> <!-- 取消按钮 --> <br>
<br> </div>
</div>
</div> </div>
<div class="container"> <!-- 主容器 --> <div class="container">
<!-- Top Navigation --> <!-- Top Navigation -->
<header style="backgorund-color:lightblue;height:20%;width:100%;font-family:YouYuan;"> <!-- 顶部导航栏 --> <header style="backgorund-color:lightblue;height:20%;font-align:center;width:100%;font-family:YouYuan;">
<h1>个人信息 <h1>个人信息
<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> <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>
</h1> </h1>
</header> </header>
<div class="main clearfix" style="font-size:10px;margin-top:5%;font-family:YouYuan;"> <!-- 主要内容区域 --> <div class="main clearfix" style="font-size:10px;margin-top:5%;font-family:YouYuan;">
<div class="column"> <!-- 左侧列 --> <div class="column">
<% <%
try{ try{
String cardId = session.getAttribute("reader").toString(); // 获取会话中的reader属性并转换为字符串 String cardId=session.getAttribute("reader").toString();
String sql = "select * from borrow_card where ID = '" + cardId + "';"; // SQL查询语句根据reader ID查询借阅卡信息 String sql="select*from borrow_card where ID = '"+ cardId +"';";
ResultSet rs = check.executeQuery(sql); // 执行SQL查询返回结果集 ResultSet rs = check.executeQuery(sql);
while(rs.next()){ // 遍历结果集 while (rs.next()) {
%> %>
<% int id =rs.getInt("ID"); %> <%-- 获取ID字段的值 --%> <% int id = rs.getInt(1);%>
<p><span class="glyphicon glyphicon-tags">&nbsp;借阅卡编号:<%=rs.getString("ID")%></span></p> <%-- 显示借阅卡编号 --%> <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> <%-- 显示借阅人 --%>
<p><span class="glyphicon glyphicon-tag">&nbsp;规则编号:<%=rs.getString("RULE_ID")%></span></p> <%-- 显示规则编号 --%> <p><span class="glyphicon glyphicon-user">&nbsp;借阅证姓名:<%=rs.getString("READER")%></span></p><br>
<p><span class="glyphicon glyphicon-star-empty">&nbsp;状态: <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("可用"); // 如果状态值为1显示“可用” if(rs.getString("STATUS").equals("1")){
}else{ out.println("可用");
out.println("挂失"); // 如果状态值不为1显示“挂失” }
} else{
out.println("挂失");
}
%> %>
</span></p> </span></p>
<%} <%
}catch(Exception e){ // 捕获异常 }
} }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 class="column" align="center" style="font-size:15px">
<button class="md-trigger" data-modal="modal-13" style="margin-top:20%;">修改密码</button>
</div>
</div> </div>
</div> </div>
</div> <!-- /container -->
<div class="md-overlay"></div> <!-- 模态框覆盖层 -->
<!-- classie by @desandro https://github.com/desandro/classie --> <div class="md-overlay"></div>
<!-- classie.js - class helper functions by desandro --> <!-- the overlay element -->
<script src="js/classie.js"></script>
<!-- for the blur effect --> <!-- classie.js by @desandro: https://github.com/desandro/classie -->
<!-- by @derekdrees https://github.com/ded/SpinKit --> <script src="../public/js/classie.js"></script>
<script src="js/spinkit.js"></script> <script src="../public/js/modalEffects.js"></script>
<script>
// this is important for the blur effect <!-- for the blur effect -->
var polyfillscriptpath = 'polyfill/'; // polyfill脚本路径 <!-- by @derSchepp https://github.com/Schepp/CSS-Filters-Polyfill -->
</script> <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>
</body> </body>
</html> </html>

@ -1,12 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<module type="JAVA_MODULE" version="4">
<component name="NewModuleRootManager" inherit-compiler-output="true">
<exclude-output />
<content url="file://$MODULE_DIR$">
<sourceFolder url="file://$MODULE_DIR$/src" isTestSource="false" />
</content>
<orderEntry type="inheritedJdk" />
<orderEntry type="sourceFolder" forTests="false" />
<orderEntry type="library" name="lib" level="project" />
</component>
</module>

@ -14,67 +14,25 @@ import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession; import javax.servlet.http.HttpSession;
/** /**
* *
*
*
*
* 访
*
* @author Mingyue * @author Mingyue
*
*/ */
public class AdminFilter implements Filter { public class AdminFilter implements Filter {
/**
*
*
*
*
*
* @param filterConfig
* @throws ServletException
*/
public void init(FilterConfig filterConfig) throws ServletException { public void init(FilterConfig filterConfig) throws ServletException {
// 初始化操作(当前没有)
}
/** }
*
*
* Servlet
* JavaScript
*
* @param request Servlet
* @param response Servlet
* @param chain Servlet
* @throws IOException
* @throws ServletException Servlet
*/
public void doFilter(ServletRequest request, ServletResponse response, FilterChain chain) throws IOException, ServletException { public void doFilter(ServletRequest request, ServletResponse response, FilterChain chain) throws IOException, ServletException {
// 将ServletRequest转换为HttpServletRequest以便处理HTTP请求
HttpServletRequest req = (HttpServletRequest) request; HttpServletRequest req = (HttpServletRequest) request;
// 获取会话对象
HttpSession session = req.getSession(); HttpSession session = req.getSession();
// 检查会话中是否存在名为"admin"的属性,若不存在则跳转到登录页面
if(session == null || session.getAttribute("admin") == null) { if(session == null || session.getAttribute("admin") == null) {
// 将ServletResponse转换为HttpServletResponse以便处理HTTP响应
HttpServletResponse rep = (HttpServletResponse)response; HttpServletResponse rep = (HttpServletResponse)response;
// 获取输出流 PrintWriter out =response.getWriter();
PrintWriter out = rep.getWriter(); // iframe父页面直接跳转到登录界面
// 使用JavaScript进行重定向跳转到管理员登录页面
out.print("<script>window.parent.location.href='"+ req.getContextPath() +"/adminLogin.html'</script>"); out.print("<script>window.parent.location.href='"+ req.getContextPath() +"/adminLogin.html'</script>");
} else {
// 如果管理员已登录继续执行过滤器链中的下一个过滤器或目标Servlet
chain.doFilter(request, response);
} }
} chain.doFilter(request, response);
/**
*
*
*
*/
public void destroy() {
// 销毁操作(当前没有)
} }
} }

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

@ -17,31 +17,22 @@ 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 {
} }

@ -11,62 +11,52 @@ import net.sf.json.JSONArray;
import net.sf.json.JSONObject; import net.sf.json.JSONObject;
public class Admin { public class Admin {
/** /**
* *
* *
* @param username * @param username
* @param password * @param password
* @return * @return
* @throws ClassNotFoundException * @throws ClassNotFoundException
* @throws SQLException * @throws SQLException
*/ */
@SuppressWarnings("null") @SuppressWarnings("null")
public String login(String username, String password) throws ClassNotFoundException, SQLException { public String login(String username, String password) throws ClassNotFoundException, SQLException {
// 参数校验
if (username == null || username.trim().equals("")) { if (username == null || username.trim().equals("")) {
return "账号不能为空"; return "账号不能为空";
} else if (password == null || password.trim().equals("")) { } else if (password == null || password.trim().equals("")) {
return "密码不能为空"; return "密码不能为空";
} }
Connection connection = null; Connection connection = null;
PreparedStatement pstmt = null; PreparedStatement pstmt = null;
ResultSet resultSet = null; ResultSet resultSet = null;
// SQL查询语句验证用户和密码
String sql = "select * from admin where username=? and password=? limit 1"; String sql = "select * from admin where username=? and password=? limit 1";
connection = Base.getConnection(); connection = Base.getConnection();
pstmt = (PreparedStatement) connection.prepareStatement(sql); pstmt = (PreparedStatement) connection.prepareStatement(sql);
pstmt.setString(1, username); pstmt.setString(1, username);
pstmt.setString(2, Util.passMd5(password)); // 假设Util.passMd5()是对密码的加密方法 pstmt.setString(2, Util.passMd5(password));
resultSet = pstmt.executeQuery(); resultSet = pstmt.executeQuery();
try{
try { if (resultSet.next()) {
if (resultSet.next()) { // 如果有记录,说明登录成功
return "1"; return "1";
} }
} catch (Exception e) { }catch(Exception e) {
return "发生未知错误"; return "发生未知错误";
} finally { }finally {
// 关闭数据库连接资源 if(Base.closeResource(connection, pstmt, resultSet) == false) {
if (Base.closeResource(connection, pstmt, resultSet) == false) {
return "关闭失败"; return "关闭失败";
} }
} }
// 如果没有记录,账号或密码错误
return "账号或密码错误"; return "账号或密码错误";
} }
/** /**
* *
* * @param page
* @param page * @param limit
* @param limit * @return String json
* @param where
* @return Map
* @throws ClassNotFoundException * @throws ClassNotFoundException
* @throws SQLException * @throws SQLException
*/ */
@ -76,30 +66,27 @@ public class Admin {
Connection connection = null; Connection connection = null;
PreparedStatement pstmt = null; PreparedStatement pstmt = null;
ResultSet resultSet = null; ResultSet resultSet = null;
connection = Base.getConnection(); connection = Base.getConnection();
int number = Integer.valueOf(page); // 页码 int number = Integer.valueOf(page);
int size = Integer.valueOf(limit); // 每页条数 int size = Integer.valueOf(limit);
// 构建查询语句
String sql = "select * from books "; String sql = "select * from books ";
if (where != null && !where.isEmpty()) { if(where!=null && !where.isEmpty()) {
whereString += " where " + where.get("condition") + " like '%" + where.get("conditionValue") + "%' "; whereString += " where "+where.get("condition") +" like '%" +where.get("conditionValue") +"%' ";
sql += whereString; // 根据条件拼接查询语句 sql += whereString;
} }
sql += "order by id desc limit ?,? "; // 分页查询 sql += "order by id desc limit ?,? ";
pstmt = (PreparedStatement) connection.prepareStatement(sql); pstmt = (PreparedStatement) connection.prepareStatement(sql);
pstmt.setInt(1, (number - 1) * size); // 设置分页参数 pstmt.setInt(1, (number-1) * size );
pstmt.setInt(2, size); // 每页显示的记录数 pstmt.setInt(2, size);
resultSet = pstmt.executeQuery(); resultSet = pstmt.executeQuery();
JSONObject json = new JSONObject(); JSONObject json = new JSONObject();
String result = ""; String result = "";
int i = 1; int i = 1;
// 遍历查询结果并构造JSON格式的返回数据 // 获取行数据
while (resultSet.next()) { while( resultSet.next() ) {
//System.out.println("????-------" +resultSet.getInt("count"));
json.put("id", resultSet.getInt("id")); json.put("id", resultSet.getInt("id"));
json.put("name", resultSet.getString("name")); json.put("name", resultSet.getString("name"));
json.put("author", resultSet.getString("author")); json.put("author", resultSet.getString("author"));
@ -108,74 +95,65 @@ public class Admin {
json.put("position", resultSet.getString("position")); json.put("position", resultSet.getString("position"));
json.put("status", resultSet.getInt("status")); json.put("status", resultSet.getInt("status"));
json.put("description", resultSet.getString("description")); json.put("description", resultSet.getString("description"));
if(i==1) {
// 拼接多个JSON对象
if (i == 1) {
result = json.toString(); result = json.toString();
} else { }else {
result += "," + json.toString(); result += "," +json.toString();
} }
i++; i++;
} }
map.put("data", result); map.put("data", result);
// 获取总数 // 获取总数count重写sql
int count = 0; int count = 0;
sql = "select count(*) as count from books "; sql = "select count(*) as count from books ";
if (where != null && !where.isEmpty()) { if(where!=null && !where.isEmpty()) {
sql += whereString; // 根据条件计算总数 sql += whereString;
} }
pstmt = connection.prepareStatement(sql); pstmt = connection.prepareStatement(sql);
resultSet = pstmt.executeQuery(); resultSet = pstmt.executeQuery();
if (resultSet.next()) { if(resultSet.next()) {
count = resultSet.getInt("count"); count = resultSet.getInt("count");
} }
map.put("count", count); map.put("count", count);
Base.closeResource(connection, pstmt, resultSet); Base.closeResource(connection, pstmt, resultSet);
return map; return map;
} }
/** /**
* ID * id(String)
* * @param id
* @param id ID * @return
* @return
* @throws ClassNotFoundException * @throws ClassNotFoundException
* @throws SQLException * @throws SQLException
*/ */
public static String getSortName(String id) throws ClassNotFoundException, SQLException { public static String getSortName(String id) throws ClassNotFoundException, SQLException {
if (id == null || id.equals("")) { if(id==null || id.equals(""))
return "参数错误"; return "参数错误";
}
Connection connection = null; Connection connection = null;
PreparedStatement pstmt = null; PreparedStatement pstmt = null;
ResultSet resultSet = null; ResultSet resultSet = null;
String sql = null; String sql = null;
String result = null; String result = null;
connection = Base.getConnection();
connection = Base.getConnection();
sql = "select name from book_sort where id=?"; sql = "select name from book_sort where id=?";
pstmt = connection.prepareStatement(sql); pstmt = connection.prepareStatement(sql);
pstmt.setString(1, id); pstmt.setString(1, id);
resultSet = pstmt.executeQuery(); resultSet = pstmt.executeQuery();
if (resultSet.next()) { if(resultSet.next()) {
result = resultSet.getString("name"); result = resultSet.getString("name");
} else { }else {
result = "查询失败"; result = "查询失败";
} }
Base.closeResource(connection, pstmt, null); Base.closeResource(connection, pstmt, null);
return result; return result;
} }
/** /**
* ID * id
* * @param id
* @param id ID * @return
* @return ResultSet
* @throws ClassNotFoundException * @throws ClassNotFoundException
* @throws SQLException * @throws SQLException
*/ */
@ -183,59 +161,51 @@ public class Admin {
Connection connection = null; Connection connection = null;
PreparedStatement pstmt = null; PreparedStatement pstmt = null;
ResultSet resultSet = null; ResultSet resultSet = null;
String sql = "select * from books where id=? ";
String sql = "select * from books where id=?";
connection = Base.getConnection(); connection = Base.getConnection();
pstmt = connection.prepareStatement(sql); pstmt = connection.prepareStatement(sql);
pstmt.setInt(1, id); pstmt.setInt(1, id);
resultSet = pstmt.executeQuery(); resultSet = pstmt.executeQuery();
//Base.closeResource(null, null, null);
connection.close(); connection.close();
if(resultSet.next()) {
if (resultSet.next()) { return resultSet;
return resultSet; // 返回查询到的结果
} }
return null; // 没有找到对应的书籍 return null;
} }
/** /* 没用 */
* 使
*
* @return JSONArray
* @throws ClassNotFoundException
* @throws SQLException
*/
public static JSONArray getRules() throws ClassNotFoundException, SQLException { public static JSONArray getRules() throws ClassNotFoundException, SQLException {
Connection connection = null; Connection connection = null;
PreparedStatement pstmt = null; PreparedStatement pstmt = null;
ResultSet resultSet = null; ResultSet resultSet = null;
String sql = "select * from rules";
String sql = "select * from rules"; JSONObject jsonObject = new JSONObject();
JSONObject jsonObject = new JSONObject(); JSONArray jsonArray = new JSONArray();
JSONArray jsonArray = new JSONArray(); String result = "";
connection = Base.getConnection();
connection = Base.getConnection(); pstmt = connection.prepareStatement(sql);
pstmt = connection.prepareStatement(sql); resultSet = pstmt.executeQuery();
resultSet = pstmt.executeQuery(); while(resultSet.next()) {
jsonObject.put("id", resultSet.getString("id"));
// 遍历规则表构造JSON对象 jsonObject.put("borrow_num", resultSet.getString("borrow_num"));
while (resultSet.next()) { jsonObject.put("borrow_library", resultSet.getString("borrow_library"));
jsonObject.put("id", resultSet.getString("id")); jsonObject.put("overtime_fee", resultSet.getString("overtime_fee"));
jsonObject.put("borrow_num", resultSet.getString("borrow_num")); jsonArray.add(jsonObject);
jsonObject.put("borrow_library", resultSet.getString("borrow_library")); System.out.println(jsonArray.toString());
jsonObject.put("overtime_fee", resultSet.getString("overtime_fee")); }
jsonArray.add(jsonObject); Base.closeResource(connection, pstmt, resultSet);
System.out.println(jsonArray.toString());
}
Base.closeResource(connection, pstmt, resultSet);
return jsonArray; return jsonArray;
} }
public static void main(String[] args) throws ClassNotFoundException, SQLException { public static void main(String[] args) throws ClassNotFoundException, SQLException {
//Common common = new Common();
//System.out.println(common.getCount("books"));
Admin admin = new Admin(); Admin admin = new Admin();
System.out.println(admin.getSortName("2")); // 示例,获取分类名称 System.out.println(admin.getSortName("2"));
// Map map = admin.getBookList("1", "100"); //Map map = admin.getBookList("1", "100");
// System.out.println(map.get("count")); // 示例,获取书籍数量 //System.out.println( map.get("count"));
} }
} }

@ -7,7 +7,6 @@ import java.sql.ResultSet;
import java.sql.SQLException; import java.sql.SQLException;
public class Base { public class Base {
// 数据库连接信息
private static String driver = "com.mysql.cj.jdbc.Driver"; private static String driver = "com.mysql.cj.jdbc.Driver";
private static String url = "jdbc:mysql://localhost:3306/library?&useSSL=false&serverTimezone=UTC&useUnicode=true&characterEncoding=UTF-8"; private static String url = "jdbc:mysql://localhost:3306/library?&useSSL=false&serverTimezone=UTC&useUnicode=true&characterEncoding=UTF-8";
private static String username = "root"; private static String username = "root";
@ -16,16 +15,14 @@ public class Base {
/** /**
* *
* *
* @return * @return
* @throws ClassNotFoundException JDBC * @throws ClassNotFoundException
*/ */
public static Connection getConnection() throws ClassNotFoundException { public static Connection getConnection() throws ClassNotFoundException {
Connection connection = null; Connection connection = null;
try { try {
// 加载数据库驱动
Class.forName(driver); Class.forName(driver);
// 获取数据库连接 connection = (Connection) DriverManager.getConnection(url, username, password);
connection = DriverManager.getConnection(url, username, password);
} catch (SQLException e) { } catch (SQLException e) {
e.printStackTrace(); e.printStackTrace();
} }
@ -33,70 +30,66 @@ public class Base {
} }
/** /**
* SELECT *
* *
* @param connection * @param connection
* @param preparedStatement PreparedStatement *
* @param resultSet * @param preparedStatement
* @param sql SQL * @param resultSet
* @param params SQLnull *
* @return * @param sql
* @throws SQLException SQL * @param params
* @return
* @throws SQLException
*/ */
public static ResultSet executequery(Connection connection, PreparedStatement preparedStatement, public static ResultSet executequery(Connection connection, PreparedStatement preparedStatement,
ResultSet resultSet, String sql, Object[] params) throws SQLException { ResultSet resultSet, String sql, Object[] params) throws SQLException {
if (preparedStatement == null) { if (preparedStatement == null) {
// 如果PreparedStatement为null则创建新的PreparedStatement对象 preparedStatement = (PreparedStatement) connection.prepareStatement(sql);
preparedStatement = connection.prepareStatement(sql);
} }
// 设置SQL语句中的参数
for (int i = 0; params != null && i < params.length; i++) { for (int i = 0; params != null && i < params.length; i++) {
preparedStatement.setObject(i + 1, params[i]); preparedStatement.setObject(i + 1, params[i]);
} }
// 执行查询并返回结果集
resultSet = preparedStatement.executeQuery(); resultSet = preparedStatement.executeQuery();
return resultSet; return resultSet;
} }
/** /**
* INSERTUPDATEDELETE *
* *
* @param connection * @param connection
* @param preparedStatement PreparedStatement * @param preparedStatement
* @param sql SQL * @param sql
* @param params SQLnull * @param params
* @return * @return
* @throws SQLException SQL * @throws SQLException
*/ */
public static int executeUpdate(Connection connection, PreparedStatement preparedStatement, String sql, public static int executeUpdate(Connection connection, PreparedStatement preparedStatement, String sql,
Object[] params) throws SQLException { Object[] params) throws SQLException {
if (preparedStatement == null) { if (preparedStatement == null) {
// 如果PreparedStatement为null则创建新的PreparedStatement对象 preparedStatement = (PreparedStatement) connection.prepareStatement(sql);
preparedStatement = connection.prepareStatement(sql);
} }
// 设置SQL语句中的参数
for (int i = 0; params != null && i < params.length; i++) { for (int i = 0; params != null && i < params.length; i++) {
preparedStatement.setObject(i + 1, params[i]); preparedStatement.setObject(i + 1, params[i]);
} }
// 执行更新语句,返回更新的行数
int updateRows = preparedStatement.executeUpdate(); int updateRows = preparedStatement.executeUpdate();
return updateRows; return updateRows;
} }
/** /**
* *
* *
* @param connection * @param connection
* @param preparedStatement PreparedStatement * @param preparedStatement
* @param resultSet * @param resultSet
* @return truefalse * @return
* @throws SQLException * @throws SQLException
*/ */
public static boolean closeResource(Connection connection, PreparedStatement preparedStatement, ResultSet resultSet) public static boolean closeResource(Connection connection, PreparedStatement preparedStatement, ResultSet resultSet)
throws SQLException { throws SQLException {
boolean flag = true; boolean flag = true;
// 关闭ResultSet资源
if (resultSet != null) { if (resultSet != null) {
try { try {
resultSet.close(); resultSet.close();
@ -106,8 +99,6 @@ public class Base {
flag = false; flag = false;
} }
} }
// 关闭PreparedStatement资源
if (preparedStatement != null) { if (preparedStatement != null) {
try { try {
preparedStatement.close(); preparedStatement.close();
@ -117,8 +108,6 @@ public class Base {
flag = false; flag = false;
} }
} }
// 关闭数据库连接资源
if (connection != null) { if (connection != null) {
try { try {
connection.close(); connection.close();
@ -128,8 +117,7 @@ public class Base {
flag = false; flag = false;
} }
} }
// 返回资源关闭的状态
return flag; return flag;
} }
} }

@ -1,71 +1,67 @@
package javabean; // 定义包名,用于组织类和接口 package javabean;
import java.sql.Connection; // 导入Connection类用于数据库连接 import java.sql.Connection;
import java.sql.PreparedStatement; // 导入PreparedStatement类用于执行预编译的SQL语句 import java.sql.PreparedStatement;
import java.sql.ResultSet; // 导入ResultSet类用于存储查询结果 import java.sql.ResultSet;
import java.sql.SQLException; // 导入SQLException类用于处理SQL异常 import java.sql.SQLException;
import java.util.HashMap; // 导入HashMap类用于存储键值对 import java.util.HashMap;
import java.util.TreeMap; // 导入TreeMap类用于存储有序的键值对 import java.util.TreeMap;
public class Common { // 定义公共类Common public class Common {
/** /**
* *
* @param table * @return
* @return * @throws SQLException
* @throws SQLException 访 * @throws ClassNotFoundException
* @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; // 如果为空返回0 return 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); // 准备SQL查询语句 pstmt = connection.prepareStatement("select count(*) as count from " +table);
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; // 发生异常时返回0 return 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"; // SQL查询语句 String librarySql = "select id,name from library";
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); // 准备SQL查询语句 libraryPstmt = connection.prepareStatement(librarySql);
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; // 返回null return null;
} catch (SQLException e) { // 捕获SQL异常 } catch (SQLException e) {
return null; // 返回null return 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());
} }
} }

@ -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; // 初始化between变量用于存储两个日期之间的毫秒数差 long between = 0;
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); // 将字符串Str1解析为Date对象date1 Date date1 = format.parse(Str1);
Date date2 = format.parse(Str2); // 将字符串Str2解析为Date对象date2 Date date2 = format.parse(Str2);
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) {
// 捕获并处理ParseException异常 // TODO Auto-generated catch block
e.printStackTrace(); // 打印异常堆栈信息 e.printStackTrace();
} }
long days = between / (24 * 60 * 60 * 1000); // 将毫秒数差转换为天数 long days = between / (24 * 60 * 60 * 1000);
return days; // 返回两个日期之间的天数差 return days;
} }
} }

@ -1,52 +1,52 @@
package javabean; package javabean;
import java.text.SimpleDateFormat; // 导入SimpleDateFormat类用于格式化日期 import java.text.SimpleDateFormat;
import java.util.Calendar; // 导入Calendar类用于操作日期 import java.util.Calendar;
import java.util.Date; // 导入Date类用于获取当前日期和时间 import java.util.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"); // 创建日期格式化对象 SimpleDateFormat myFmt2 = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");// 等价于now.toLocaleString()
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); // 在当前日期基础上增加n天 ca.add(Calendar.DATE, n);// num为增加的天数可以改变的
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); // 在当前日期基础上增加n天 ca.add(Calendar.DATE, n);// num为增加的天数可以改变的
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); // 在当前日期基础上增加n天 ca.add(Calendar.DATE, n);// num为增加的天数可以改变的
d = ca.getTime(); // 获取增加天数后的日期 d = ca.getTime();
String enddate = format.format(d); // 格式化增加天数后的日期 String enddate = format.format(d);
return enddate; // 返回格式化后的日期字符串 return enddate;
} }
} }

@ -1,23 +1,22 @@
package javabean; package javabean;
import java.text.SimpleDateFormat; // 导入SimpleDateFormat类用于格式化日期 import java.text.SimpleDateFormat;
import java.util.Calendar; // 导入Calendar类用于操作日期 import java.util.Calendar;
import java.util.Date; // 导入Date类用于获取当前日期和时间 import java.util.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); // 在当前日期基础上增加n天 ca.add(Calendar.DATE, n);// num为增加的天数可以改变的
d = ca.getTime(); // 获取增加天数后的日期 d = ca.getTime();
String enddate = format.format(d); // 格式化增加天数后的日期 String enddate = format.format(d);
return enddate; // 返回格式化后的日期字符串 return enddate;
} }
} }

@ -6,88 +6,51 @@ import java.sql.ResultSet;
import java.sql.Statement; import java.sql.Statement;
public class JDBCBean { public class JDBCBean {
// 数据库连接信息 private static String driver = "com.mysql.cj.jdbc.Driver";
private static String driver = "com.mysql.cj.jdbc.Driver"; // MySQL数据库驱动 private static String url = "jdbc:mysql://localhost:3306/library?&useSSL=false&serverTimezone=UTC&useUnicode=true&characterEncoding=UTF-8";
private static String url = "jdbc:mysql://localhost:3306/library?&useSSL=false&serverTimezone=UTC&useUnicode=true&characterEncoding=UTF-8"; // 数据库URL private static String username = "root";
private static String username = "root"; // 数据库用户名 private static String password = "root";
private static String password = "root"; // 数据库密码
// 数据库连接对象
private Connection conn = null; private Connection conn = null;
// 用于执行SQL查询和更新的Statement对象
private Statement stmt = null; private Statement stmt = null;
/**
*
*
* `JDBCBean`
*
*/
public JDBCBean() { public JDBCBean() {
try { try {
// 加载MySQL数据库驱动
Class.forName(driver); Class.forName(driver);
// 获取数据库连接
conn = DriverManager.getConnection(url, username, password); conn = DriverManager.getConnection(url, username, password);
// 创建Statement对象用于执行SQL语句
stmt = conn.createStatement(); stmt = conn.createStatement();
System.out.println("同数据库建立连接!"); System.out.println("同数据库建立连接!");
} catch (Exception ex) { } catch (Exception ex) {
// 捕获并输出数据库连接错误
System.out.println("无法同数据库建立连接!"); System.out.println("无法同数据库建立连接!");
} }
} }
/**
* INSERTUPDATEDELETE
*
* @param s SQLINSERTUPDATEDELETE
* @return 0
*/
public int executeUpdate(String s) { public int executeUpdate(String s) {
int result = 0; int result = 0;
try { try {
// 执行SQL更新操作
System.out.println(s + "------" + stmt + "-----"); System.out.println(s + "------" + stmt + "-----");
result = stmt.executeUpdate(s); result = stmt.executeUpdate(s);
} catch (Exception e) { } catch (Exception e) {
// 捕获并输出执行更新错误
System.out.println("执行更新错误!"); System.out.println("执行更新错误!");
} }
return result; return result;
} }
/**
* SELECT
*
* @param s SQLSELECT
* @return ResultSetnull
*/
public ResultSet executeQuery(String s) { public ResultSet executeQuery(String s) {
ResultSet rs = null; ResultSet rs = null;
try { try {
// 执行SQL查询操作
rs = stmt.executeQuery(s); rs = stmt.executeQuery(s);
} catch (Exception e) { } catch (Exception e) {
// 捕获并输出查询执行错误
System.out.println("执行查询错误! " + e.getMessage()); System.out.println("执行查询错误! " + e.getMessage());
} }
return rs; return rs;
} }
/**
* Statement
*
* Statement
*/
public void close() { public void close() {
try { try {
// 关闭Statement对象
stmt.close(); stmt.close();
// 关闭数据库连接
conn.close(); conn.close();
} catch (Exception e) { } catch (Exception e) {
// 捕获并忽略关闭资源时的异常
} }
} }
} }

@ -6,26 +6,27 @@ 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; // 预编译的SQL语句对象 PreparedStatement pstmt = null;
ResultSet resultSet = null; // 结果集对象 ResultSet resultSet = null;
String sql = "select * from manager where ACCOUNT=? and PASSWORD=?"; // SQL查询语句 String sql = "select * from manager where ACCOUNT=? and PASSWORD=?";
connection = Base.getConnection(); // 获取数据库连接 connection = Base.getConnection();
pstmt = (PreparedStatement) connection.prepareStatement(sql); // 创建预编译的SQL语句对象 pstmt = (PreparedStatement) connection.prepareStatement(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 "账号或密码错误";
} }
} }

@ -8,26 +8,24 @@ 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; // 预编译的SQL语句对象 PreparedStatement pstmt = null;
ResultSet resultSet = null; // 查询结果集对象 ResultSet resultSet = null;
String sql = "select * from borrow_card where ID=? and PASSWORD=?"; // SQL查询语句 String sql = "select * from borrow_card where ID=? and PASSWORD=?";
connection = Base.getConnection();
connection = Base.getConnection(); // 获取数据库连接 pstmt = (PreparedStatement) connection.prepareStatement(sql);
pstmt = (PreparedStatement) connection.prepareStatement(sql); // 创建PreparedStatement对象 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 "账号或密码错误";
} }
} }

@ -1,89 +1,88 @@
package javabean; // 定义包名,用于组织类和接口 package javabean;
import java.math.BigInteger; // 导入BigInteger类用于处理大整数 import java.math.BigInteger;
import java.security.MessageDigest; // 导入MessageDigest类用于生成MD5摘要 import java.security.MessageDigest;
import java.security.NoSuchAlgorithmException; // 导入NoSuchAlgorithmException异常类用于处理没有指定算法的情况 import java.security.NoSuchAlgorithmException;
import java.text.SimpleDateFormat; // 导入SimpleDateFormat类用于格式化日期 import java.text.SimpleDateFormat;
import net.sf.json.JSONObject; // 导入JSONObject类用于处理JSON数据 import net.sf.json.JSONObject;
public class Util { // 定义一个公共类Util public class Util {
/** /**
* json * json
* @param str json * @param str
* @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 .0 * @return
*/ */
public static String getFormatDateTime(String dateTime) { public static String getFormatDateTime(String dateTime) {
if(dateTime != null && dateTime.indexOf(".0") != -1) { // 如果字符串不为空且包含".0" if(dateTime != null && dateTime.indexOf(".0") != -1) {
return dateTime.substring(0, dateTime.length()-2); // 去除最后两个字符(即".0" return dateTime.substring(0, dateTime.length()-2);
}else if(dateTime != null) { // 如果字符串不为空但不包含".0" }else if(dateTime != null) {
return dateTime; // 直接返回原字符串 return dateTime;
} }
return null; // 如果字符串为空返回null return 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(); // 创建JSON对象 JSONObject jsonObject = new JSONObject();
jsonObject.put("code", code); // 添加code字段 jsonObject.put("code", code);
jsonObject.put("msg", msg); // 添加msg字段 jsonObject.put("msg", msg);
if( data!=null ) { // 如果data不为空 if( data!=null ) {
jsonObject.put("data", data); // 添加data字段 jsonObject.put("data", data);
} }
return jsonObject.toString(); // 返回JSON字符串 return jsonObject.toString();
} }
/* /*
* md5 * md5
*/ */
public static String stringToMD5(String plainText) { public static String stringToMD5(String plainText) {
byte[] secretBytes = null; // 定义字节数组用于存储MD5摘要 byte[] secretBytes = null;
try { try {
secretBytes = MessageDigest.getInstance("md5").digest( secretBytes = MessageDigest.getInstance("md5").digest(
plainText.getBytes()); // 生成MD5摘要 plainText.getBytes());
} catch (NoSuchAlgorithmException e) { // 捕获没有该算法的异常 } catch (NoSuchAlgorithmException e) {
throw new RuntimeException("没有这个md5算法"); // 抛出运行时异常 throw new RuntimeException("没有这个md5算法");
} }
String md5code = new BigInteger(1, secretBytes).toString(16); // 将字节数组转换为16进制字符串 String md5code = new BigInteger(1, secretBytes).toString(16);
for (int i = 0; i < 32 - md5code.length(); i++) { // 如果长度不足32位前面补0 for (int i = 0; i < 32 - md5code.length(); i++) {
md5code = "0" + md5code; md5code = "0" + md5code;
} }
return md5code; // 返回MD5字符串 return md5code;
} }
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); // 返回加盐后的MD5字符串 return Util.stringToMD5(password +salt);
} }
public static void main(String[] args) { public static void main(String[] args) {
System.out.println(Util.passMd5("admin")); // 测试MD5加密函数输出加密后的字符串 System.out.println(Util.passMd5("admin"));
//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));
} }
} }

@ -18,127 +18,49 @@ import net.sf.json.JSONObject;
/** /**
* *
* *
* *zhang
* Servlet
*
* Servlet
*
* *
*/ */
@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());
}
/**
* GET
*
* GET
*
* @param request HttpServletRequest
* @param response HttpServletResponse
* @throws ServletException
* @throws IOException
*/
protected void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
// 简单响应,输出请求的上下文路径
response.getWriter().append("Served at: ").append(request.getContextPath());
}
/**
* POST
*
* POST
*
*
* @param request HttpServletRequest
* @param response HttpServletResponse
* @throws ServletException
* @throws IOException
*/
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
// 设置响应的内容类型为JSON字符集为utf8
response.setContentType("application/json; charset=utf8");
PrintWriter out = response.getWriter();
// 获取客户端传递的用户名和密码
String username = request.getParameter("username");
String password = request.getParameter("password");
// 创建一个HashMap来存储返回的响应数据
HashMap<String, Object> hashMap = new HashMap<String, Object>();
// 创建Admin对象调用登录方法进行验证
Admin admin = new Admin();
String result = null;
try {
// 调用Admin类中的login方法验证用户名和密码
result = admin.login(username, password);
} catch (ClassNotFoundException | SQLException e) {
// 捕获并打印异常
e.printStackTrace();
}
// 如果登录成功返回成功的JSON响应
if (result != null && result.equals("1")) {
// 创建会话并设置管理员的用户名
HttpSession session = request.getSession();
session.setAttribute("admin", username);
// 设置响应内容为成功
hashMap.put("code", 0); // 0表示成功
hashMap.put("msg", "登录成功");
// 返回登录成功后的跳转页面(管理员首页)
hashMap.put("url", request.getContextPath() + "/admin/index.jsp");
} else {
// 如果登录失败,返回失败信息
hashMap.put("code", 1); // 1表示失败
hashMap.put("msg", result); // 登录失败的提示信息
}
// 将HashMap转化为JSON对象并返回给客户端
JSONObject json = JSONObject.fromObject(hashMap);
out.write(json.toString());
}
} }

@ -17,63 +17,32 @@ import javabean.Base;
import net.sf.json.JSONObject; import net.sf.json.JSONObject;
/** /**
* Servlet * Servlet implementation class BookAdd
*
* Servlet IDID
* JSON
*/ */
@WebServlet("/admin/bookAdd") @WebServlet("/admin/bookAdd")
public class BookAdd extends HttpServlet { public class BookAdd extends HttpServlet {
/**
* POST
*
* HTTP
* JDBC JSON
*
* @param req
* @param resp
* @throws ServletException Servlet
* @throws IOException I/O
*/
@Override @Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
// 设置响应内容类型为 JSON字符编码为 UTF-8
resp.setContentType("application/json; charset=utf8"); resp.setContentType("application/json; charset=utf8");
String name = req.getParameter("name");
// 获取请求参数(书籍信息) String author = req.getParameter("author");
String name = req.getParameter("name"); // 书名 String library_id = req.getParameter("library_id");
String author = req.getParameter("author"); // 作者 String sort_id = req.getParameter("sort_id");
String library_id = req.getParameter("library_id"); // 所属馆ID String position = req.getParameter("position");
String sort_id = req.getParameter("sort_id"); // 书籍类别ID String status = req.getParameter("status");
String position = req.getParameter("position"); // 书籍位置 String description = req.getParameter("description");
String status = req.getParameter("status"); // 书籍状态 System.out.println(description+"-------------"); //debug
String description = req.getParameter("description"); // 书籍描述
// 用于调试输出描述字段的内容
System.out.println(description + "-------------"); // debug
// 创建 JSON 对象用于存储响应数据
JSONObject json = new JSONObject(); JSONObject json = new JSONObject();
Connection connection = null; // 数据库连接 Connection connection = null;
PreparedStatement pstmt = null; // SQL 执行对象 PreparedStatement pstmt = null;
int result = 0; // 记录 SQL 执行结果(影响的行数) //ResultSet resultSet = null;
int result = 0;
// SQL 插入语句
String sql = "insert into books(name, author, library_id, sort_id, position, status, description) values(?,?,?,?,?,?,?)"; String sql = "insert into books(name, author, library_id, sort_id, position, status, description) values(?,?,?,?,?,?,?)";
System.out.println(sql); // debug输出 SQL 语句 System.out.println(sql);
// 获取响应输出流
PrintWriter out = resp.getWriter(); PrintWriter out = resp.getWriter();
try { try {
// 获取数据库连接
connection = (Connection) Base.getConnection(); connection = (Connection) Base.getConnection();
// 创建 PreparedStatement 对象
pstmt = connection.prepareStatement(sql); pstmt = connection.prepareStatement(sql);
// 设置 SQL 语句中的参数
pstmt.setString(1, name); pstmt.setString(1, name);
pstmt.setString(2, author); pstmt.setString(2, author);
pstmt.setString(3, library_id); pstmt.setString(3, library_id);
@ -81,36 +50,26 @@ public class BookAdd extends HttpServlet {
pstmt.setString(5, position); pstmt.setString(5, position);
pstmt.setString(6, status); pstmt.setString(6, status);
pstmt.setString(7, description); pstmt.setString(7, description);
// 执行 SQL 插入操作,返回影响的行数
result = pstmt.executeUpdate(); result = pstmt.executeUpdate();
} catch (SQLException e) { } catch (SQLException e) {
// 捕获 SQL 异常(可以在这里做日志记录或处理)
e.printStackTrace();
} catch (ClassNotFoundException e) { } catch (ClassNotFoundException e) {
// 捕获 ClassNotFoundException 异常(数据库驱动类未找到)
e.printStackTrace(); e.printStackTrace();
} finally { }finally {
// 关闭数据库资源
try { try {
Base.closeResource(connection, pstmt, null); Base.closeResource(connection, pstmt, null);
} catch (SQLException e) { } catch (SQLException e) {
e.printStackTrace(); // 关闭资源时发生异常 e.printStackTrace();
} }
} }
if(result==1) {
// 判断插入操作是否成功,返回相应的 JSON 数据 json.put("code", "0");
if (result == 1) { json.put("msg", "success");
// 插入成功,返回成功的 JSON 响应 }else {
json.put("code", "0"); // code = 0 表示成功 json.put("code", "1");
json.put("msg", "success"); // 返回成功消息 json.put("msg", "error");
} else {
// 插入失败,返回错误的 JSON 响应
json.put("code", "1"); // code = 1 表示失败
json.put("msg", "error"); // 返回失败消息
} }
// 将 JSON 响应写入输出流
out.write(json.toString()); out.write(json.toString());
} }
} }

@ -13,73 +13,34 @@ import javabean.JDBCBean;
import net.sf.json.JSONObject; import net.sf.json.JSONObject;
/**
* Servlet
*
* Servlet ID
* JSON
*/
@WebServlet("/admin/bookDel") @WebServlet("/admin/bookDel")
public class BookDel extends HttpServlet { public class BookDel extends HttpServlet {
/**
* GET
*
* ID
* JDBC JSON
*
* @param req
* @param resp
* @throws ServletException Servlet
* @throws IOException I/O
*/
@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");
// 获取请求参数中的书籍 ID
String id = req.getParameter("id"); String id = req.getParameter("id");
// 创建 JSON 对象用于响应数据
JSONObject json = new JSONObject(); JSONObject json = new JSONObject();
// 创建 JDBCBean 对象用于执行数据库操作
JDBCBean db = new JDBCBean(); JDBCBean db = new JDBCBean();
String sql = "delete from books where id = " +id;
// 构建 SQL 删除语句,删除指定 ID 的书籍
String sql = "delete from books where id = " + id;
// 定义删除操作的结果变量
int result = 0; int result = 0;
// 默认状态为失败
int code = 1; int code = 1;
String msg = ""; String msg = "";
if( id != null && !id.equals("") ) {
// 如果 ID 不为空且不为 "空" 字符串,则执行删除操作
if (id != null && !id.equals("")) {
// 执行 SQL 删除语句,返回影响的行数
result = db.executeUpdate(sql); result = db.executeUpdate(sql);
} }
if( result == 1 ) {
// 判断删除操作是否成功1 表示成功0 表示失败 code = 0;
if (result == 1) { msg = "删除成功";
code = 0; // 删除成功 }else {
msg = "删除成功"; // 返回成功消息 code = 1;
} else { msg = "删除失败";
code = 1; // 删除失败
msg = "删除失败"; // 返回失败消息
} }
// 将操作结果封装为 JSON 对象
json.put("code", code); json.put("code", code);
json.put("msg", msg); json.put("msg", msg);
// 关闭数据库连接
db.close(); db.close();
// 获取响应输出流并将 JSON 数据写入响应
PrintWriter out = resp.getWriter(); PrintWriter out = resp.getWriter();
out.print(json.toString()); out.print( json.toString() );
} }
} }

@ -3,6 +3,7 @@ package servlet.admin;
import java.io.IOException; import java.io.IOException;
import java.io.PrintWriter; import java.io.PrintWriter;
import java.sql.PreparedStatement; import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException; import java.sql.SQLException;
import javax.servlet.ServletException; import javax.servlet.ServletException;
@ -16,32 +17,12 @@ import java.sql.Connection;
import javabean.Base; import javabean.Base;
import net.sf.json.JSONObject; import net.sf.json.JSONObject;
/**
* Servlet
*
* Servlet
* JSON
*/
@WebServlet("/admin/bookEdit") @WebServlet("/admin/bookEdit")
public class BookEdit extends HttpServlet { public class BookEdit extends HttpServlet {
/**
* POST
*
* ID
* JSON
*
* @param req
* @param resp
* @throws ServletException Servlet
* @throws IOException I/O
*/
@Override @Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
// 设置响应内容类型为 JSON字符编码为 UTF-8
resp.setContentType("application/json; charset=utf8"); resp.setContentType("application/json; charset=utf8");
// 获取请求中的参数:书籍 ID、书名、作者、馆藏 ID、分类 ID、位置、状态和描述
String id = req.getParameter("id"); String id = req.getParameter("id");
String name = req.getParameter("name"); String name = req.getParameter("name");
String author = req.getParameter("author"); String author = req.getParameter("author");
@ -50,34 +31,18 @@ public class BookEdit extends HttpServlet {
String position = req.getParameter("position"); String position = req.getParameter("position");
String status = req.getParameter("status"); String status = req.getParameter("status");
String description = req.getParameter("description"); String description = req.getParameter("description");
System.out.println(description+"-------------");
// 打印描述信息进行调试
System.out.println(description + "-------------");
// 创建 JSON 对象用于响应数据
JSONObject json = new JSONObject(); JSONObject json = new JSONObject();
//if(id == null || id.equals(""))
// 声明数据库连接和 PreparedStatement 对象
Connection connection = null; Connection connection = null;
PreparedStatement pstmt = null; PreparedStatement pstmt = null;
//ResultSet resultSet = null;
// 更新操作的执行结果
int result = 0; int result = 0;
// SQL 更新语句,更新指定 ID 的书籍信息
String sql = "update books set name=? ,author=? ,library_id=? ,sort_id=? ,position=? ,status=?, description=? where id=?"; String sql = "update books set name=? ,author=? ,library_id=? ,sort_id=? ,position=? ,status=?, description=? where id=?";
// 获取响应输出流
PrintWriter out = resp.getWriter(); PrintWriter out = resp.getWriter();
try { try {
// 获取数据库连接
connection = (Connection) Base.getConnection(); connection = (Connection) Base.getConnection();
// 创建 PreparedStatement 对象,设置 SQL 语句
pstmt = connection.prepareStatement(sql); pstmt = connection.prepareStatement(sql);
// 设置 SQL 语句中的参数
pstmt.setString(1, name); pstmt.setString(1, name);
pstmt.setString(2, author); pstmt.setString(2, author);
pstmt.setString(3, library_id); pstmt.setString(3, library_id);
@ -86,48 +51,38 @@ public class BookEdit extends HttpServlet {
pstmt.setString(6, status); pstmt.setString(6, status);
pstmt.setString(7, description); pstmt.setString(7, description);
pstmt.setString(8, id); pstmt.setString(8, id);
// 执行更新操作
result = pstmt.executeUpdate(); result = pstmt.executeUpdate();
} catch (SQLException e) { } catch (SQLException e) {
// 捕获 SQL 异常(目前没有处理,打印错误信息)
} catch (ClassNotFoundException e) { } catch (ClassNotFoundException e) {
// 捕获类未找到异常 // TODO Auto-generated catch block
e.printStackTrace(); e.printStackTrace();
} finally { }finally {
// 确保数据库资源被释放
try { try {
Base.closeResource(connection, pstmt, null); Base.closeResource(connection, pstmt, null);
} catch (SQLException e) { } catch (SQLException e) {
e.printStackTrace(); e.printStackTrace();
} }
} }
if(result==1) {
// 判断更新操作是否成功
if (result == 1) {
// 更新成功,返回成功状态
json.put("code", "0"); json.put("code", "0");
json.put("msg", "success"); json.put("msg", "success");
} else { }else {
// 更新失败,返回失败状态
json.put("code", "1"); json.put("code", "1");
json.put("msg", "error"); json.put("msg", "error");
} }
// 将 JSON 响应数据写入输出流
out.write(json.toString()); out.write(json.toString());
//System.out.println(postData);
//JSONObject json = JSONObject.fromObject();
} }
/**
* GET POST
*
* @param req
* @param resp
* @throws ServletException Servlet
* @throws IOException I/O
*/
@Override @Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
doPost(req, resp); doPost(req, resp);
} }
} }

@ -13,111 +13,70 @@ import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse; import javax.servlet.http.HttpServletResponse;
import javabean.Admin; import javabean.Admin;
import javabean.Common;
import javabean.Util;
import net.sf.json.JSONArray; import net.sf.json.JSONArray;
import net.sf.json.JSONObject; import net.sf.json.JSONObject;
/** /**
* Servlet * Servlet implementation class BookList
*
* Servlet
* JSON
*/ */
@WebServlet("/admin/bookList") @WebServlet("/admin/bookList")
public class BookList extends HttpServlet { public class BookList extends HttpServlet {
/**
* GET
*
*
* JSON
*
* @param req
* @param resp
* @throws ServletException Servlet
* @throws IOException I/O
*/
@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");
// 初始化响应的 JSON 对象
JSONObject json = new JSONObject(); JSONObject json = new JSONObject();
// 定义返回的数据和状态码
String result = null; String result = null;
Map<String, Object> map = null; Map<String, Object> map = null;
int code = 1; int code = 1;
String msg = ""; String msg = "";
String data = ""; String data = "";
// 获取分页参数,默认值为 page=1 和 limit=10
String page = (String) req.getParameter("page"); String page = (String) req.getParameter("page");
String limit = (String) req.getParameter("limit"); String limit = (String) req.getParameter("limit");
// 获取查询条件参数(如果有)
String condition = (String) req.getParameter("condition"); String condition = (String) req.getParameter("condition");
String conditionValue = (String) req.getParameter("conditionValue"); String conditionValue = (String) req.getParameter("conditionValue");
Map where = new HashMap<String, String>();
// 创建条件过滤的 Map 对象 // 传输数据过滤
Map<String, String> where = new HashMap<String, String>();
// 如果没有传递分页参数则默认设置为第一页和每页10条记录
if(page == null) { if(page == null) {
page = "1"; page = "1";
} }
if(limit == null) { if(limit == null) {
limit = "10"; limit = "10";
} }
// 如果传递了查询条件参数,则将其加入查询条件 Map 中
if(condition == null || conditionValue == null || condition.isEmpty() || conditionValue.isEmpty()) { if(condition == null || conditionValue == null || condition.isEmpty() || conditionValue.isEmpty()) {
condition = null; condition = null;
conditionValue = null; conditionValue = null;
} else { }else {
where.put("condition", condition); where.put("condition", condition);
where.put("conditionValue", conditionValue); where.put("conditionValue", conditionValue);
} }
// 实例化 Admin 对象来调用获取书籍列表的方法
Admin admin = new Admin(); Admin admin = new Admin();
try { try {
// 调用 getBookList 方法来获取书籍列表数据
map = admin.getBookList(page, limit, where); map = admin.getBookList(page, limit, where);
result = (String) map.get("data"); // 获取查询结果 result = (String) map.get("data");
} catch (ClassNotFoundException | SQLException e) { } catch (ClassNotFoundException | SQLException e) {
// 捕获数据库操作异常,设置错误消息 msg = "数据库获取信息失败";
msg = "数据库获取信息失败";
} }
// 如果没有获取到数据或数据为空,返回错误消息
if(result == null || result.isEmpty() || result.equals("1")) { if(result == null || result.isEmpty() || result.equals("1")) {
json.put("code", 1); json.put("code", 1);
json.put("msg", "数据为空"); json.put("msg", "数据为空");
} else { } else {
// 获取到数据,返回成功状态,并包含查询结果
json.put("code", 0); json.put("code", 0);
json.put("msg", "success"); json.put("msg", "success");
json.put("count", map.get("count")); // 返回总记录数 json.put("count", map.get("count"));
result = "[" + result + "]"; // 格式化数据为 JSON 数组 result = "[" +result +"]";
json.put("data", result); // 返回数据 json.put("data", result);
} }
// 将 JSON 响应数据写入输出流
PrintWriter out = resp.getWriter(); PrintWriter out = resp.getWriter();
out.print(json.toString()); out.print(json.toString());
} }
/** @Override
* POST doGet protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
* doGet(req, resp);
* @param req }
* @param resp
* @throws ServletException Servlet
* @throws IOException I/O
*/
@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
doGet(req, resp); // 对于 POST 请求直接调用 GET 请求处理方法
}
} }

@ -18,92 +18,61 @@ import javabean.Base;
import net.sf.json.JSONArray; import net.sf.json.JSONArray;
import net.sf.json.JSONObject; import net.sf.json.JSONObject;
/**
* Servlet
*
* Servlet
* JSON
*/
@WebServlet("/admin/borrowList") @WebServlet("/admin/borrowList")
public class BorrowList extends HttpServlet { public class BorrowList extends HttpServlet {
/**
* GET
*
*
* JSON
*
* @param req
* @param resp
* @throws ServletException Servlet
* @throws IOException I/O
*/
@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 = ""; // 无限制条件
// 默认值处理:如果未传递分页参数,默认为第一页,默认每页 10 条记录
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;
ResultSet resultSet = null; ResultSet resultSet = null;
ResultSet countSet = null; ResultSet countSet = null;
String sql = "";
String sql = "select id, card_id, book_id, " String countSql = "";
+ "DATE_FORMAT(borrow_date, '%Y-%m-%d %k:%i:%s') as borrow_date, "
+ "DATE_FORMAT(return_date, '%Y-%m-%d %k:%i:%s') as return_date, "
+ "DATE_FORMAT(end_date, '%Y-%m-%d %k:%i:%s') as end_date, "
+ "illegal, manager_id from borrow_books"; // 查询借阅记录的 SQL 语句
String where = ""; // 记录条件过滤部分
if(condition != null && conditionValue != null && !condition.isEmpty() && !conditionValue.isEmpty()) {
// 如果传递了条件,构造 WHERE 语句进行过滤
where = " where " + condition + " like '%" + conditionValue + "%' ";
sql += where;
} else if(condition != null && condition.equals("other")) {
// 处理特殊的查询条件,例如逾期未还的记录
where = " where return_date is null and curtime() > end_date ";
sql += where;
}
// 添加分页查询的限制
sql += " limit ?,?";
// 准备返回参数 // 准备返回参数
int code = 1; // 默认失败的状态码 int code = 1;
String msg = "error"; // 默认错误信息 String msg = "error";
int count = 0; // 总记录数 int count = 0;
JSONObject jsonData = new JSONObject(); // 存储单条借阅记录的 JSON 对象 JSONObject jsonData = new JSONObject();
JSONArray jsonArray = new JSONArray(); // 存储所有借阅记录的 JSON 数组 JSONArray jsonArray = new JSONArray();
JSONObject jsonResult = new JSONObject(); // 最终返回的 JSON 对象 JSONObject jsonResult = new JSONObject();
// 进行查询
try { try {
// 获取数据库连接
connection = (Connection) Base.getConnection(); connection = (Connection) Base.getConnection();
sql = "select id, card_id, book_id, "
// 执行查询操作,获取借阅记录数据 + "DATE_FORMAT(borrow_date, '%Y-%m-%d %k:%i:%s') as borrow_date, "
+ "DATE_FORMAT(return_date, '%Y-%m-%d %k:%i:%s') as return_date, "
+ "DATE_FORMAT(end_date, '%Y-%m-%d %k:%i:%s') as end_date,"
+ "illegal, manager_id "
+ "from borrow_books";
if(condition!=null && conditionValue != null && !condition.equals("") && !conditionValue.equals("")) {
where = " where "+ condition +" like '%" +conditionValue +"%' ";
sql += where;
}else if(condition!=null && condition.equals("other")) {
where = " where return_date is null and curtime()>end_date ";
sql +=where;
}
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();
// 遍历查询结果,将每条借阅记录放入 JSON 数组中
while(resultSet.next()) { while(resultSet.next()) {
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"));
@ -115,20 +84,17 @@ public class BorrowList 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 ";
// 查询符合条件的总记录数 countSql +=where;
String countSql = "select count(*) as count from borrow_books " + 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 = "查询成功";
} else { }else {
code = 0; code = 0;
msg = "没有数据"; msg = "没有数据";
} }
@ -139,22 +105,22 @@ public class BorrowList extends HttpServlet {
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) {
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());
} }
} }

@ -19,44 +19,24 @@ import javabean.JDBCBean;
import net.sf.json.JSONObject; import net.sf.json.JSONObject;
/** /**
* Servlet * Servlet implementation class CardAdd
*
* Servlet
*
*/ */
@WebServlet("/admin/cardAdd") @WebServlet("/admin/cardAdd")
public class CardAdd extends HttpServlet { public class CardAdd extends HttpServlet {
/**
* POST
*
*
*
*
* @param req
* @param resp
* @throws ServletException Servlet
* @throws IOException I/O
*/
@Override @Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
// 设置响应内容类型为 JSON字符编码为 UTF-8
resp.setContentType("application/json; charset=utf8"); resp.setContentType("application/json; charset=utf8");
// 获取参数
// 获取传递的参数 String reader = req.getParameter("reader");
String reader = req.getParameter("reader"); // 读者 String password = req.getParameter("password");
String password = req.getParameter("password"); // 密码 String rule_id = req.getParameter("rule_id");
String rule_id = req.getParameter("rule_id"); // 借阅规则 ID String status = req.getParameter("status");
String status = req.getParameter("status"); // 借阅卡状态 // 准备资源
// 初始化返回信息
String code = "1"; String code = "1";
String msg = "error"; String msg = "error";
String data = ""; String data = "";
JSONObject json = new JSONObject(); JSONObject json = new JSONObject();
JSONObject jsonData = new JSONObject(); JSONObject jsonData = new JSONObject();
// 数据库连接对象
Connection connection = null; Connection connection = null;
Connection connection1 = null; Connection connection1 = null;
PreparedStatement pstmt = null; PreparedStatement pstmt = null;
@ -64,29 +44,23 @@ public class CardAdd extends HttpServlet {
String sql = null; String sql = null;
int result = 0; int result = 0;
ResultSet dataSet = null; ResultSet dataSet = null;
// 参数不能为空
// 参数不能为空校验 if(reader == null || password == null || rule_id == null || rule_id == null || status == null) {
if(reader == null || password == null || rule_id == null || status == null) {
code = "1"; code = "1";
msg = "值不能为空"; msg = "值不能为空";
} else { }else {
try { try {
// 获取数据库连接
connection = (Connection) Base.getConnection(); connection = (Connection) Base.getConnection();
// 插入借阅卡的 SQL 语句
sql = "insert into borrow_card(password, reader, rule_id, status) values(?,?,?,?)"; sql = "insert into borrow_card(password, reader, rule_id, status) values(?,?,?,?)";
pstmt = connection.prepareStatement(sql); pstmt = connection.prepareStatement(sql);
pstmt.setString(1, password); pstmt.setString(1, password);
pstmt.setString(2, reader); pstmt.setString(2, reader);
pstmt.setString(3, rule_id); pstmt.setString(3, rule_id);
pstmt.setString(4, status); pstmt.setString(4, status);
// 执行插入操作
result = pstmt.executeUpdate(); result = pstmt.executeUpdate();
// 获取插入记录的 ID //获取id
connection1 = (Connection) Base.getConnection(); connection1= (Connection) Base.getConnection();
String findIdSql = "select id from borrow_card where password=? and reader=? and rule_id=? and status=? limit 1"; String findIdSql = "select id from borrow_card where password=? and reader=? and rule_id=? and status=? limit 1";
pstmt1 = connection1.prepareStatement(findIdSql); pstmt1 = connection1.prepareStatement(findIdSql);
pstmt1.setString(1, password); pstmt1.setString(1, password);
@ -94,8 +68,6 @@ public class CardAdd extends HttpServlet {
pstmt1.setString(3, rule_id); pstmt1.setString(3, rule_id);
pstmt1.setString(4, status); pstmt1.setString(4, status);
dataSet = pstmt1.executeQuery(); dataSet = pstmt1.executeQuery();
// 获取插入记录的 ID
if(dataSet.next()) { if(dataSet.next()) {
jsonData.put("id", dataSet.getString("id")); jsonData.put("id", dataSet.getString("id"));
} }
@ -104,33 +76,27 @@ public class CardAdd extends HttpServlet {
} catch (SQLException e) { } catch (SQLException e) {
msg = "sql错误"; msg = "sql错误";
System.out.println("sql失败"); System.out.println("sql失败");
} finally {
// 关闭数据库资源
try {
Base.closeResource(connection, pstmt, null);
Base.closeResource(connection1, pstmt1, dataSet);
} catch (SQLException e) {
msg = "关闭资源失败";
}
} }
try {
// 根据插入结果更新响应消息 Base.closeResource(connection, pstmt, null);
Base.closeResource(connection1, pstmt1, dataSet);
} catch (SQLException e) {
msg = "关闭资源失败";
}
if(result == 1 && !jsonData.isNullObject() && !jsonData.isEmpty()) { if(result == 1 && !jsonData.isNullObject() && !jsonData.isEmpty()) {
System.out.println(jsonData.toString()); //debug
code = "0"; code = "0";
msg = "添加成功"; msg = "添加成功";
} else { }else {
code = "1"; code = "1";
msg = "执行失败"; msg = "执行失败";
} }
} }
// 构造 JSON 响应
json.put("code", code); json.put("code", code);
json.put("msg", msg); json.put("msg", msg);
json.put("data", jsonData.toString()); json.put("data", jsonData.toString());
// 输出 JSON 响应到客户端
PrintWriter out = resp.getWriter(); PrintWriter out = resp.getWriter();
out.print(json.toString()); out.print(json.toString());
} }
} }

@ -17,34 +17,14 @@ import javabean.Base;
import net.sf.json.JSONArray; import net.sf.json.JSONArray;
import net.sf.json.JSONObject; import net.sf.json.JSONObject;
/**
* Servlet
*
* Servlet ID
*
*/
@WebServlet("/admin/cardDel") @WebServlet("/admin/cardDel")
public class CardDel extends HttpServlet { public class CardDel extends HttpServlet {
/**
* GET
*
* ID
*
* @param req
* @param resp
* @throws ServletException Servlet
* @throws IOException I/O
*/
@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");
// 接收数据
// 获取传入的借阅卡 ID 参数
String id = req.getParameter("id"); String id = req.getParameter("id");
// 处理数据
// 初始化数据库连接和 SQL 语句
Connection connection = null; Connection connection = null;
PreparedStatement delCardPstmt = null; PreparedStatement delCardPstmt = null;
PreparedStatement delHistoryPstmt = null; PreparedStatement delHistoryPstmt = null;
@ -52,28 +32,24 @@ public class CardDel extends HttpServlet {
String delHistorySql = null; String delHistorySql = null;
int delCardResult = 0; int delCardResult = 0;
int delHistoryResult = 0; int delHistoryResult = 0;
// 返回数据
// 初始化返回信息
String code = "1"; String code = "1";
String msg = "error"; String msg = "error";
JSONObject jsonObject = new JSONObject(); JSONObject jsonObject = new JSONObject();
JSONObject jsonData = new JSONObject(); JSONObject jsonData = new JSONObject();
// 开始处理
// 如果传入的 ID 不为空,开始处理删除操作
if(id != null && !id.equals("")) { if(id != null && !id.equals("")) {
try { try {
// 获取数据库连接 // 公共连接
connection = (Connection) Base.getConnection(); connection = (Connection) Base.getConnection();
// 删除借书记录 // 删除借书记录
delHistorySql = "delete from borrow_books where card_id=?"; delHistorySql = "delete from borrow_books where card_id=?";
delHistoryPstmt = connection.prepareStatement(delHistorySql); delHistoryPstmt = connection.prepareStatement(delHistorySql);
delHistoryPstmt.setString(1, id); delHistoryPstmt.setString(1, id);
delHistoryResult = delHistoryPstmt.executeUpdate(); delHistoryResult = delHistoryPstmt.executeUpdate();
// 返回删除的借书记录数 // 返回删除记录
jsonData.put("num", delHistoryResult); jsonData.put("num", delHistoryResult);
// 删除阅读证
// 删除借阅卡
delCardSql = "delete from borrow_card where id=? limit 1"; delCardSql = "delete from borrow_card where id=? limit 1";
delCardPstmt = connection.prepareStatement(delCardSql); delCardPstmt = connection.prepareStatement(delCardSql);
delCardPstmt.setString(1, id); delCardPstmt.setString(1, id);
@ -84,7 +60,6 @@ public class CardDel extends HttpServlet {
} catch (SQLException e) { } catch (SQLException e) {
msg = "sql错误"; msg = "sql错误";
} finally { } finally {
// 关闭数据库资源
try { try {
delCardPstmt.close(); delCardPstmt.close();
Base.closeResource(connection, delCardPstmt, null); Base.closeResource(connection, delCardPstmt, null);
@ -93,20 +68,15 @@ public class CardDel extends HttpServlet {
} }
} }
} }
// 获取响应输出流
PrintWriter out = resp.getWriter(); PrintWriter out = resp.getWriter();
// 判断删除操作是否成功
if(delCardResult == 1) { if(delCardResult == 1) {
code = "0"; code = "0";
msg = "删除借阅证成功"; msg = "删除借阅证成功";
} }
// 返回 JSON 格式的响应
jsonObject.put("code", code); jsonObject.put("code", code);
jsonObject.put("msg", msg); jsonObject.put("msg", msg);
jsonObject.put("data", jsonData); jsonObject.put("data", jsonData);
out.print(jsonObject.toString()); out.print(jsonObject.toString());
} }
} }

@ -17,97 +17,64 @@ import java.sql.Connection;
import javabean.Base; import javabean.Base;
import net.sf.json.JSONObject; import net.sf.json.JSONObject;
/**
* Servlet
*
* Servlet ID
*/
@WebServlet("/admin/cardEdit") @WebServlet("/admin/cardEdit")
public class CardEdit extends HttpServlet { public class CardEdit extends HttpServlet {
/**
* POST
*
* ID ID
*
*
* @param req
* @param resp
* @throws ServletException Servlet
* @throws IOException I/O
*/
@Override @Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
// 设置响应内容类型为 JSON字符编码为 UTF-8
resp.setContentType("application/json; charset=utf8"); resp.setContentType("application/json; charset=utf8");
// 接受数据
// 获取传入的借阅卡参数
String id = req.getParameter("id"); String id = req.getParameter("id");
String password = req.getParameter("password"); String password = req.getParameter("password");
String reader = req.getParameter("reader"); String reader = req.getParameter("reader");
String rule_id = req.getParameter("rule_id"); String rule_id = req.getParameter("rule_id");
String status = req.getParameter("status"); String status = req.getParameter("status");
// 准备资源
// 初始化数据库连接和 SQL 语句
Connection connection = null; Connection connection = null;
PreparedStatement pstmt = null; PreparedStatement pstmt = null;
ResultSet resultSet = null; ResultSet resultSet = null;
int result = 0; int result = 0;
String sql = null; String sql = null;
// 返回数据
// 初始化返回信息
String code = "1"; String code = "1";
String msg = "error"; String msg = "error";
JSONObject json = new JSONObject(); JSONObject json = new JSONObject();
PrintWriter out = resp.getWriter(); PrintWriter out = resp.getWriter();
// 判断数据
// 判断接收到的参数是否为空 if(id == null || password == null || reader == null || reader == null || status == null ||
if(id == null || password == null || reader == null || rule_id == null || status == null ||
id.equals("") || password.equals("") || reader.equals("") || rule_id.equals("") || status.equals("")) { id.equals("") || password.equals("") || reader.equals("") || rule_id.equals("") || status.equals("")) {
code = "1"; code = "1";
msg = "参数不能为空"; msg = "参数不能为空";
} else { }else {
// 构建更新 SQL 语句
sql = "update borrow_card set password=?, reader=?, rule_id=?, status=? where id=?"; sql = "update borrow_card set password=?, reader=?, rule_id=?, status=? where id=?";
try { try {
// 获取数据库连接
connection = (Connection) Base.getConnection(); connection = (Connection) Base.getConnection();
// 预编译 SQL 语句并设置参数
pstmt = connection.prepareStatement(sql); pstmt = connection.prepareStatement(sql);
pstmt.setString(1, password); pstmt.setString(1, password);
pstmt.setString(2, reader); pstmt.setString(2, reader);
pstmt.setString(3, rule_id); pstmt.setString(3, rule_id);
pstmt.setString(4, status); pstmt.setString(4, status);
pstmt.setString(5, id); pstmt.setString(5, id);
// 执行更新操作
result = pstmt.executeUpdate(); result = pstmt.executeUpdate();
} catch (ClassNotFoundException e1) { } catch (ClassNotFoundException e1) {
msg = "数据库连接错误"; msg = "错误";
} catch (SQLException e) { } catch (SQLException e) {
msg = "SQL 错误"; msg = "sql错误";
} finally { } finally {
try { try {
// 关闭数据库连接和资源
Base.closeResource(connection, pstmt, resultSet); Base.closeResource(connection, pstmt, resultSet);
} catch (SQLException e) { } catch (SQLException e) {
msg = "资源关闭失败"; msg = "关闭失败";
} }
} }
// 判断更新操作是否成功
if(result == 1) { if(result == 1) {
code = "0"; code = "0";
msg = "修改成功"; msg = "修改成功";
} }
json.put("code", code);
json.put("msg", msg);
out.print(json.toString());
} }
// 将返回信息封装成 JSON 格式
json.put("code", code);
json.put("msg", msg);
// 输出响应数据
out.print(json.toString());
} }
} }

@ -18,46 +18,25 @@ import net.sf.json.JSONArray;
import net.sf.json.JSONObject; import net.sf.json.JSONObject;
/** /**
* Servlet * Servlet implementation class CardList
*
* Servlet
*/ */
@WebServlet("/admin/cardList") @WebServlet("/admin/cardList")
public class CardList extends HttpServlet { public class CardList extends HttpServlet {
/**
* GET
*
*
*
* @param req
* @param resp
* @throws ServletException Servlet
* @throws IOException I/O
*/
@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");
// 接收参数
// 接收查询参数limit, page, condition 和 conditionValue
String limit = req.getParameter("limit"); String limit = req.getParameter("limit");
String page = req.getParameter("page"); String page = req.getParameter("page");
String condition = req.getParameter("condition"); String condition = (String) req.getParameter("condition");
String conditionValue = req.getParameter("conditionValue"); String conditionValue = (String) req.getParameter("conditionValue");
// 初始化 SQL 查询条件
String where = null; // 无限制条件 String where = null; // 无限制条件
// 设置默认值
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;
ResultSet resultSet = null; ResultSet resultSet = null;
@ -65,41 +44,29 @@ public class CardList extends HttpServlet {
String msg = "error"; String msg = "error";
int count = 0; int count = 0;
String sql = ""; String sql = "";
// String countSql = ""
// 准备返回数据的 JSON 对象
JSONObject jsonObject = new JSONObject(); JSONObject jsonObject = 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 id,password,reader,rule_id,status from borrow_card";
// 初始 SQL 查询语句 // where
sql = "select id, password, reader, rule_id, status from borrow_card";
// 如果有查询条件,构造 where 子句
if (condition != null && conditionValue != null && !condition.isEmpty() && !conditionValue.isEmpty()) { if (condition != null && conditionValue != null && !condition.isEmpty() && !conditionValue.isEmpty()) {
where = " where " + condition + " like '%" + conditionValue + "%'"; where = " where " + condition + " like '%" + conditionValue + "%'";
sql = sql + where; sql = sql + where;
} }
// 分页
// 构造分页查询 sql += " order by id desc limit ?,?";
sql += " order by id desc limit ?,?";
pstmt = connection.prepareStatement(sql); pstmt = connection.prepareStatement(sql);
try { try {
// 设置分页参数
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));
} catch (NumberFormatException | SQLException e1) { } catch (NumberFormatException | SQLException e1) {
// 异常捕获,避免参数错误影响执行
} }
// 执行查询
resultSet = pstmt.executeQuery(); resultSet = pstmt.executeQuery();
while (resultSet.next()) { while (resultSet.next()) {
// 构造每一条借阅卡记录的 JSON 数据
jsonObject.put("id", resultSet.getString("id")); jsonObject.put("id", resultSet.getString("id"));
jsonObject.put("password", resultSet.getString("password")); jsonObject.put("password", resultSet.getString("password"));
jsonObject.put("reader", resultSet.getString("reader")); jsonObject.put("reader", resultSet.getString("reader"));
@ -107,46 +74,41 @@ public class CardList extends HttpServlet {
jsonObject.put("status", resultSet.getString("status")); jsonObject.put("status", resultSet.getString("status"));
jsonArray.add(jsonObject); jsonArray.add(jsonObject);
} }
// 获取总数
// 获取借阅卡总数,用于分页 sql = "select count(*) as count from borrow_card ";
sql = "select count(*) as count from borrow_card"; // 有限制
if (where != null) { if (where != null) {
sql = sql + where; sql = sql + where;
} }
pstmt = connection.prepareStatement(sql); pstmt = connection.prepareStatement(sql);
resultSet = pstmt.executeQuery(); resultSet = pstmt.executeQuery();
if (resultSet.next()) { if (resultSet.next()) {
count = resultSet.getInt("count"); count = resultSet.getInt("count");
} }
// 判断查询结果是否为空
if (!jsonArray.isEmpty()) { if (!jsonArray.isEmpty()) {
code = 0; code = 0;
msg = "查询成功"; msg = "成功";
} }
} catch (ClassNotFoundException e) { } catch (ClassNotFoundException e) {
msg = "数据库连接失败"; msg = "没找到";
e.printStackTrace(); e.printStackTrace();
} catch (SQLException e) { } catch (SQLException e) {
msg = "SQL 错误"; msg = "sql错误";
} finally { } finally {
// 关闭数据库连接和资源
try { try {
Base.closeResource(connection, pstmt, resultSet); Base.closeResource(connection, pstmt, resultSet);
} 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.toString()); jsonResult.put("data", jsonArray.toString());
// 输出响应
PrintWriter out = resp.getWriter(); PrintWriter out = resp.getWriter();
out.print(jsonResult.toString()); out.print(jsonResult.toString());
// out.print("{\"code\":0,\"msg\":\"\",\"count\":\"234\",\"data\":[{\"id\":\"1\",\"password\":\"23442\",\"reader\":\"minm\",\"rule_id\":\"1\",\"status\":\"2\"}]}");
} }
} }

@ -19,31 +19,14 @@ import javabean.Util;
import net.sf.json.JSONArray; import net.sf.json.JSONArray;
import net.sf.json.JSONObject; import net.sf.json.JSONObject;
/**
* Servlet
*
* Servlet 30
*/
@WebServlet("/admin/libraryData") @WebServlet("/admin/libraryData")
public class LibraryData extends HttpServlet { public class LibraryData extends HttpServlet {
private static final long serialVersionUID = 1L; private static final long serialVersionUID = 1L;
/** @Override
* GET protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
*
* 30
*
* @param req
* @param resp
* @throws ServletException Servlet
* @throws IOException I/O
*/
@Override
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");
// 准备参数
// 初始化数据库连接、SQL语句、JSON 数据
Connection connection = null; Connection connection = null;
PreparedStatement pstmt = null; PreparedStatement pstmt = null;
ResultSet resultSet = null; ResultSet resultSet = null;
@ -51,61 +34,51 @@ public class LibraryData extends HttpServlet {
JSONObject jsonObject = new JSONObject(); JSONObject jsonObject = new JSONObject();
JSONArray jsonData = new JSONArray(); JSONArray jsonData = new JSONArray();
JSONArray jsonDays = new JSONArray(); JSONArray jsonDays = new JSONArray();
// 返回参数
// 返回参数:状态码、消息、数据
int code = 1; int code = 1;
String msg = "error"; String msg = "error";
int count = 0; int count = 0;
// 获取响应输出流
PrintWriter out = resp.getWriter(); PrintWriter out = resp.getWriter();
// 开始查询获取过去30天的借阅数据 // 开始查询
try { try {
connection = Base.getConnection(); // 获取数据库连接 connection = Base.getConnection();
int i = 30; // 查询过去30天的数据 int i = 30;
while (i != 0) { // 获取30天
while(i!=0) {
i--; i--;
sql = "select count(*) as count from borrow_books where date_format(borrow_date,'%Y-%m-%d')=? order by id desc"; sql = "select count(*) as count from borrow_books where date_format(borrow_date,'%Y-%m-%d')=? order by id desc";
String date = DateTime.showDate(-i); // 获取当前日期的前i天 String date = DateTime.showDate(-i); // 设置日期
String md = DateTime.showMD(-i); // 获取当前日期的前i天的月日格式MM-dd String md = DateTime.showMD(-i);
pstmt = connection.prepareStatement(sql); pstmt = connection.prepareStatement(sql);
pstmt.setString(1, date); // 设置日期参数 pstmt.setString(1,date);
resultSet = pstmt.executeQuery(); resultSet = pstmt.executeQuery();
while(resultSet.next()) {
while (resultSet.next()) {
// 将借阅数量和日期分别添加到 JSON 数组中
jsonData.add(resultSet.getString("count")); jsonData.add(resultSet.getString("count"));
jsonDays.add(md); jsonDays.add(md);
} }
} }
// 将查询结果放入 JSON 对象中
jsonObject.put("data", jsonData); jsonObject.put("data", jsonData);
jsonObject.put("days", jsonDays); jsonObject.put("days", jsonDays);
if(!jsonObject.isEmpty()) {
// 判断查询结果是否为空 code = 0;
if (!jsonObject.isEmpty()) { msg = "查询成功";
code = 0; // 状态码为 0 表示成功 }else {
msg = "查询成功";
} else {
msg = "数据为空"; msg = "数据为空";
} }
} catch (ClassNotFoundException e) { } catch (ClassNotFoundException e) {
msg = "数据库连接失败"; msg = "没找到";
e.printStackTrace(); e.printStackTrace();
} catch (SQLException e) { } catch (SQLException e) {
msg = "SQL 错误"; msg = "sql错误";
} finally { }finally {
// 关闭数据库连接和资源
try { try {
Base.closeResource(connection, pstmt, resultSet); Base.closeResource(connection, pstmt, resultSet);
} catch (SQLException e) { } catch (SQLException e) {
msg = "关闭数据库资源失败"; msg = "关闭失败";
} }
} }
out.print( Util.jsonResponse(code, msg, jsonObject.toString()) );
}
// 返回 JSON 响应
out.print(Util.jsonResponse(code, msg, jsonObject.toString()));
}
} }

@ -9,35 +9,20 @@ import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession; import javax.servlet.http.HttpSession;
/** /**
* Servlet * Servlet implementation class LoginOut
*
* Servlet
*/ */
@WebServlet("/admin/logOut") @WebServlet("/admin/logOut")
public class LoginOut extends HttpServlet { public class LoginOut extends HttpServlet {
private static final long serialVersionUID = 1L; private static final long serialVersionUID = 1L;
/** @Override
* GET protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
* // TODO Auto-generated method stub
* `admin` HttpSession session = req.getSession();
* if(session.getAttribute("admin") != null) {
* @param req session.removeAttribute("admin");
* @param resp }
* @throws ServletException Servlet resp.sendRedirect(req.getContextPath() +"/adminLogin.html");
* @throws IOException I/O }
*/
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
// 获取当前会话对象
HttpSession session = req.getSession();
// 如果会话中存在 "admin" 属性(即管理员已登录),则移除该属性
if (session.getAttribute("admin") != null) {
session.removeAttribute("admin");
}
// 重定向到管理员登录页面
resp.sendRedirect(req.getContextPath() + "/adminLogin.html");
}
} }

@ -19,71 +19,46 @@ import javabean.Util;
import net.sf.json.JSONArray; import net.sf.json.JSONArray;
import net.sf.json.JSONObject; import net.sf.json.JSONObject;
/**
* Servlet
*
* Servlet SQL
*/
@WebServlet("/admin/managerAdd") @WebServlet("/admin/managerAdd")
public class ManagerAdd extends HttpServlet { public class ManagerAdd extends HttpServlet {
/**
* POST
*
*
* JSON
*
* @param req
* @param resp
* @throws ServletException Servlet
* @throws IOException I/O
*/
@Override @Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
// 设置响应内容类型为 JSON
resp.setContentType("application/json; charset=utf8"); resp.setContentType("application/json; charset=utf8");
// 接收参数
// 接收前端传递的参数
String name = req.getParameter("name"); String name = req.getParameter("name");
String account = req.getParameter("account"); String account = req.getParameter("account");
String password = req.getParameter("password"); String password = req.getParameter("password");
String email = req.getParameter("email"); String email = req.getParameter("email");
// 准备参数
// SQL 语句及数据库连接准备
String sql = ""; String sql = "";
Connection connection = null; Connection connection = null;
PreparedStatement pstmt = null; PreparedStatement pstmt = null;
ResultSet resultSet = null; ResultSet resultSet = null;
int result = 0; int result = 0;
int count = 0; int count = 0;
// 返回参数
// 返回的响应数据
int code = 1; int code = 1;
String msg = ""; String msg = "";
PrintWriter out = resp.getWriter(); PrintWriter out = resp.getWriter();
JSONArray jsonArray = new JSONArray(); JSONArray jsonArray = new JSONArray();
JSONObject jsonObject = new JSONObject(); JSONObject jsonObject = new JSONObject();
// 进行查询
// 进行参数校验,检查不能为空的字段 if(name==null || name.equals("") || account==null || account.equals("") || password==null || password.equals("") || email==null || email.equals("")) {
if (name == null || name.equals("") || account == null || account.equals("") ||
password == null || password.equals("") || email == null || email.equals("")) {
msg = "参数不能为空"; msg = "参数不能为空";
out.print(Util.jsonResponse(code, msg, null)); out.print(Util.jsonResponse(code, msg, null));
} else { }else {
try { try {
// 获取数据库连接
connection = (Connection) Base.getConnection(); connection = (Connection) Base.getConnection();
// 验证账号
// 验证账号是否已存在
sql = "select count(*) as count from manager where account=?"; sql = "select count(*) as count from manager where account=?";
pstmt = connection.prepareStatement(sql); pstmt = connection.prepareStatement(sql);
pstmt.setString(1, account); pstmt.setString(1, account);
resultSet = pstmt.executeQuery(); resultSet = pstmt.executeQuery();
resultSet.next(); resultSet.next();
count = resultSet.getInt("count"); count = resultSet.getInt("count");
// 添加管理员
// 如果账号不存在,则插入新管理员 if(count == 0) {
if (count == 0) {
sql = "insert into manager(name, account, password, email) values(?,?,?,?)"; sql = "insert into manager(name, account, password, email) values(?,?,?,?)";
pstmt = connection.prepareStatement(sql); pstmt = connection.prepareStatement(sql);
pstmt.setString(1, name); pstmt.setString(1, name);
@ -92,14 +67,13 @@ public class ManagerAdd extends HttpServlet {
pstmt.setString(4, email); pstmt.setString(4, email);
result = pstmt.executeUpdate(); result = pstmt.executeUpdate();
} }
// 返回数据
// 根据执行结果返回响应信息 if(result == 1 && count == 0) {
if (result == 1 && count == 0) {
code = 0; code = 0;
msg = "添加成功"; msg = "添加成功";
} else if (count > 0) { }else if(count > 0){
msg = "账号重复"; msg = "账号重复";
} else { }else {
msg = "添加失败"; msg = "添加失败";
} }
} catch (ClassNotFoundException e) { } catch (ClassNotFoundException e) {
@ -108,14 +82,11 @@ public class ManagerAdd extends HttpServlet {
msg = "sql错误"; msg = "sql错误";
} finally { } finally {
try { try {
// 关闭数据库资源
Base.closeResource(connection, pstmt, resultSet); Base.closeResource(connection, pstmt, resultSet);
} catch (SQLException e) { } catch (SQLException e) {
e.printStackTrace(); e.printStackTrace();
} }
} }
// 返回响应结果
out.print(Util.jsonResponse(code, msg, null)); out.print(Util.jsonResponse(code, msg, null));
} }
} }

@ -17,75 +17,42 @@ import java.sql.Connection;
import javabean.Base; import javabean.Base;
import javabean.Util; import javabean.Util;
/**
* Servlet
*
* Servlet ID
*/
@WebServlet("/admin/managerDel") @WebServlet("/admin/managerDel")
public class ManagerDel extends HttpServlet { public class ManagerDel extends HttpServlet {
/**
* GET ID
*
* ID
*
* @param req
* @param resp
* @throws ServletException Servlet
* @throws IOException I/O
*/
@Override @Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
// 设置响应内容类型为 JSON
resp.setContentType("application/json; charset=utf8"); resp.setContentType("application/json; charset=utf8");
// 获取请求中的 ID 参数
String id = req.getParameter("id"); String id = req.getParameter("id");
// 准备参数
// SQL 语句及数据库连接准备
String sql = ""; String sql = "";
Connection connection = null; Connection connection = null;
PreparedStatement pstmt = null; PreparedStatement pstmt = null;
ResultSet resultSet = null; ResultSet resultSet = null;
int result = 0; int result = 0;
// 返回参数
// 返回的响应数据
int code = 1; int code = 1;
String msg = ""; String msg = "";
PrintWriter out = resp.getWriter(); PrintWriter out = resp.getWriter();
try { try {
// 获取数据库连接
connection = (Connection) Base.getConnection(); connection = (Connection) Base.getConnection();
// SQL 删除语句
sql = "delete from manager where id=?"; sql = "delete from manager where id=?";
pstmt = connection.prepareStatement(sql); pstmt = connection.prepareStatement(sql);
pstmt.setString(1, id); // 设置 ID 参数 pstmt.setString(1, id);
result = pstmt.executeUpdate(); // 执行删除操作 result = pstmt.executeUpdate();
if(result == 1) {
// 根据操作结果返回响应
if (result == 1) {
code = 0; code = 0;
msg = "删除成功"; msg = "删除成功";
} else { }else {
msg = "删除失败"; msg = "删除失败";
} }
} catch (ClassNotFoundException e) { } catch (ClassNotFoundException e) {
msg = "class not found"; msg = "class not found";
} catch (SQLException e) { } catch (SQLException e) {
msg = "sql错误"; msg = "sql错误";
} finally {
// 关闭数据库资源
try {
Base.closeResource(connection, pstmt, resultSet);
} catch (SQLException e) {
e.printStackTrace();
}
} }
// 返回 JSON 格式的响应
out.print(Util.jsonResponse(code, msg, null)); out.print(Util.jsonResponse(code, msg, null));
} }
} }

@ -19,70 +19,50 @@ import javabean.Util;
import net.sf.json.JSONArray; import net.sf.json.JSONArray;
import net.sf.json.JSONObject; import net.sf.json.JSONObject;
/**
* Servlet
*
* Servlet ID
*/
@WebServlet("/admin/managerEdit") @WebServlet("/admin/managerEdit")
public class ManagerEdit extends HttpServlet { public class ManagerEdit extends HttpServlet {
/**
* POST ID
*
* ID
*
* @param req
* @param resp
* @throws ServletException Servlet
* @throws IOException I/O
*/
@Override @Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
// 设置响应内容类型为 JSON
resp.setContentType("application/json; charset=utf8"); resp.setContentType("application/json; charset=utf8");
// 接收参数
// 获取请求中的参数
String id = req.getParameter("id"); String id = req.getParameter("id");
String name = req.getParameter("name"); String name = req.getParameter("name");
String password = req.getParameter("password"); String password = req.getParameter("password");
String email = req.getParameter("email"); String email = req.getParameter("email");
// 准备参数
// 返回的响应参数
String sql = ""; String sql = "";
Connection connection = null; Connection connection = null;
PreparedStatement pstmt = null; PreparedStatement pstmt = null;
ResultSet resultSet = null; ResultSet resultSet = null;
int result = 0; int result = 0;
// 返回参数
int code = 1; int code = 1;
String msg = ""; String msg = "";
PrintWriter out = resp.getWriter(); PrintWriter out = resp.getWriter();
JSONArray jsonArray = new JSONArray();
// 如果参数为空,返回错误信息 JSONObject jsonObject = new JSONObject();
if (name == null || name.equals("") || password == null || password.equals("") || email == null || email.equals("")) { // 进行查询
if(name==null || name.equals("")|| password==null || password.equals("") || email==null || email.equals("")) {
msg = "参数不能为空"; msg = "参数不能为空";
out.print(Util.jsonResponse(code, msg, null)); out.print(Util.jsonResponse(code, msg, null));
} else { }else {
try { try {
// 获取数据库连接
connection = (Connection) Base.getConnection(); connection = (Connection) Base.getConnection();
// 添加管理员
// SQL 更新语句
sql = "update manager set name=?, password=?, email=? where id=?"; sql = "update manager set name=?, password=?, email=? where id=?";
pstmt = connection.prepareStatement(sql); pstmt = connection.prepareStatement(sql);
pstmt.setString(1, name); // 设置名称 pstmt.setString(1, name);
pstmt.setString(2, password); // 设置密码 pstmt.setString(2, password);
pstmt.setString(3, email); // 设置邮箱 pstmt.setString(3, email);
pstmt.setString(4, id); // 设置管理员 ID pstmt.setString(4, id);
// 执行更新操作
result = pstmt.executeUpdate(); result = pstmt.executeUpdate();
// 根据更新结果返回响应 // 返回数据
if (result == 1) { if(result == 1 ){
code = 0; code = 0;
msg = "修改成功"; msg = "修改成功";
} else { }else {
msg = "修改失败"; msg = "修改失败";
} }
} catch (ClassNotFoundException e) { } catch (ClassNotFoundException e) {
@ -90,16 +70,15 @@ public class ManagerEdit extends HttpServlet {
} catch (SQLException e) { } catch (SQLException e) {
msg = "sql错误"; msg = "sql错误";
} finally { } finally {
// 关闭数据库资源
try { try {
Base.closeResource(connection, pstmt, resultSet); Base.closeResource(connection, pstmt, resultSet);
} catch (SQLException e) { } catch (SQLException e) {
e.printStackTrace(); e.printStackTrace();
} }
} }
// 返回 JSON 格式的响应
out.print(Util.jsonResponse(code, msg, null)); out.print(Util.jsonResponse(code, msg, null));
} }
} }
} }

@ -19,75 +19,47 @@ import javabean.Util;
import net.sf.json.JSONArray; import net.sf.json.JSONArray;
import net.sf.json.JSONObject; import net.sf.json.JSONObject;
/**
* Servlet
*
* Servlet
*/
@WebServlet("/admin/managerList") @WebServlet("/admin/managerList")
public class ManagerList extends HttpServlet { public class ManagerList extends HttpServlet {
/**
* GET
*
* `manager` ID
*
* @param req
* @param resp
* @throws ServletException Servlet
* @throws IOException I/O
*/
@Override @Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
// 设置响应内容类型为 JSON
resp.setContentType("application/json; charset=utf8"); resp.setContentType("application/json; charset=utf8");
// 准备数据
// 初始化数据库连接相关变量
Connection connection = null; Connection connection = null;
PreparedStatement pstmt = null; PreparedStatement pstmt = null;
String sql = ""; String sql = "";
ResultSet resultSet = null; ResultSet resultSet = null;
// 返回数据
// 返回的数据初始化 int code = 1;
int code = 1; // 默认为失败 String msg = "error";
String msg = "error"; // 默认为错误信息 JSONObject jsonObject = new JSONObject();
JSONObject jsonObject = new JSONObject(); // 存储单条管理员信息 JSONArray jsonArray = new JSONArray();
JSONArray jsonArray = new JSONArray(); // 存储所有管理员信息
PrintWriter out = resp.getWriter(); PrintWriter out = resp.getWriter();
try { try {
// 获取数据库连接
connection = (Connection) Base.getConnection(); connection = (Connection) Base.getConnection();
// SQL 查询语句:查询所有管理员信息
sql = "select * from manager"; sql = "select * from manager";
pstmt = connection.prepareStatement(sql); pstmt = connection.prepareStatement(sql);
resultSet = pstmt.executeQuery(); resultSet = pstmt.executeQuery();
// 遍历查询结果,将每条管理员信息加入 JSON 数组
while (resultSet.next()) { while (resultSet.next()) {
jsonObject.put("id", resultSet.getString("id")); // 管理员ID jsonObject.put("id", resultSet.getString("id"));
jsonObject.put("name", resultSet.getString("name")); // 管理员名称 jsonObject.put("name", resultSet.getString("name"));
jsonObject.put("account", resultSet.getString("account")); // 管理员账号 jsonObject.put("account", resultSet.getString("account"));
jsonObject.put("password", resultSet.getString("password")); // 管理员密码 jsonObject.put("password", resultSet.getString("password"));
jsonObject.put("email", resultSet.getString("email")); // 管理员邮箱 jsonObject.put("email", resultSet.getString("email"));
jsonArray.add(jsonObject); // 将该管理员信息加入 JSON 数组 jsonArray.add(jsonObject);
} }
// 检查是否成功查询到管理员信息
if (!jsonArray.isEmpty()) { if (!jsonArray.isEmpty()) {
code = 0; // 查询成功 code = 0;
msg = "查询成功"; msg = "查询成功";
} else { } else {
msg = "数据为空"; // 查询结果为空 msg = "数据为空";
} }
} catch (ClassNotFoundException e) { } catch (ClassNotFoundException e) {
msg = "class找不到"; // 类加载失败 msg = "class找不到";
} catch (SQLException e) { } catch (SQLException e) {
msg = "sql错误"; // SQL 执行错误 msg = "sql错误";
} }
// 返回 JSON 响应
out.print(Util.jsonResponse(code, msg, jsonArray.toString())); out.print(Util.jsonResponse(code, msg, jsonArray.toString()));
} }
} }

@ -19,30 +19,13 @@ import javabean.Base;
import javabean.Common; import javabean.Common;
import javabean.Util; import javabean.Util;
/**
* Servlet
*
* Servlet POST
*/
@WebServlet("/admin/ruleAdd") @WebServlet("/admin/ruleAdd")
public class RuleAdd extends HttpServlet { public class RuleAdd extends HttpServlet {
/**
* POST
*
*
*
* @param req
* @param resp
* @throws ServletException Servlet
* @throws IOException I/O
*/
@Override @Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
// 设置响应内容类型为 JSON
resp.setContentType("application/json; charset=utf8"); resp.setContentType("application/json; charset=utf8");
// 准备数据
// 初始化数据库连接相关变量
Connection connection = null; Connection connection = null;
PreparedStatement pstmt = null; PreparedStatement pstmt = null;
ResultSet resultSet = null; ResultSet resultSet = null;
@ -50,72 +33,62 @@ public class RuleAdd extends HttpServlet {
String sql = ""; String sql = "";
String borrow_library = ""; String borrow_library = "";
// 返回数据初始化 // 准备返回数据
int code = 1; // 默认为失败 int code = 1;
String msg = ""; // 默认为错误信息 String msg = "";
// 获取数据:首先检查允许借阅的图书馆 // 获取数据
// 获取限定图书馆1、2、3
int num = 0; int num = 0;
try { try {
// 获取图书馆的配置信息
Map<String, String> libraryMap = Common.getLibraryMap(); Map<String, String> libraryMap = Common.getLibraryMap();
// 遍历图书馆信息,获取前端传来的借阅图书馆 for(String key : libraryMap.keySet()) {
for (String key : libraryMap.keySet()) { if(req.getParameter("borrow_library[" +key +"]") != null) {
if (req.getParameter("borrow_library[" + key + "]") != null) { if(num == 0) {
if (num == 0) {
borrow_library += key; borrow_library += key;
num++; num++;
} else { }else {
borrow_library += "、" + key; borrow_library += "、"+key;
} }
} }
} }
// 检查是否选择了允许的图书馆 if(borrow_library.isEmpty()) {
if (borrow_library.isEmpty()) {
msg = "允许图书馆不能为空"; msg = "允许图书馆不能为空";
} }
} catch (SQLException e) { } catch (SQLException e) {
msg = "获取图书馆失败"; msg = "获取图书馆失败";
} }
String borrow_num = req.getParameter("borrow_num");
// 获取其他规则参数 String limit_day = req.getParameter("limit_day");
String borrow_num = req.getParameter("borrow_num"); // 借阅数量 String overtime_fee = req.getParameter("overtime_fee");
String limit_day = req.getParameter("limit_day"); // 限制天数 try {
String overtime_fee = req.getParameter("overtime_fee"); // 逾期费用 connection = (Connection) Base.getConnection();
sql = "insert into rules(borrow_num, limit_day, borrow_library, overtime_fee) values(?,?,?,?)";
// 如果借阅图书馆不为空,保存借阅规则 pstmt = connection.prepareStatement(sql);
if (msg.isEmpty()) { pstmt.setString(1, borrow_num);
pstmt.setString(2, limit_day);
pstmt.setString(3, borrow_library);
pstmt.setString(4, overtime_fee);
result = pstmt.executeUpdate();
if(result == 1) {
code = 0;
msg = "success";
}
} catch (ClassNotFoundException e) {
msg = "classnotfound";
} catch (SQLException e) {
msg = "SQL错误";
} finally {
try { try {
connection = Base.getConnection(); Base.closeResource(connection, pstmt, null);
sql = "insert into rules(borrow_num, limit_day, borrow_library, overtime_fee) values(?,?,?,?)";
pstmt = connection.prepareStatement(sql);
pstmt.setString(1, borrow_num);
pstmt.setString(2, limit_day);
pstmt.setString(3, borrow_library);
pstmt.setString(4, overtime_fee);
result = pstmt.executeUpdate();
// 判断插入是否成功
if (result == 1) {
code = 0;
msg = "success";
}
} catch (ClassNotFoundException e) {
msg = "classnotfound";
} catch (SQLException e) { } catch (SQLException e) {
msg = "SQL错误"; msg = "关闭失败";
} finally {
try {
// 关闭数据库资源
Base.closeResource(connection, pstmt, null);
} catch (SQLException e) {
msg = "关闭失败";
}
} }
} }
// 将结果返回给前端
PrintWriter out = resp.getWriter(); PrintWriter out = resp.getWriter();
out.print(Util.jsonResponse(code, msg, null)); out.print(Util.jsonResponse(code, msg, null));
} }
} }

@ -17,71 +17,43 @@ import java.sql.Connection;
import javabean.Base; import javabean.Base;
import javabean.Util; import javabean.Util;
/**
* Servlet
*
* Servlet ID
*/
@WebServlet("/admin/ruleDel") @WebServlet("/admin/ruleDel")
public class RuleDel extends HttpServlet { public class RuleDel extends HttpServlet {
/**
* GET
*
* ID ID
*
* @param req
* @param resp
* @throws ServletException Servlet
* @throws IOException I/O
*/
@Override @Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
// 设置响应内容类型为 JSON
resp.setContentType("application/json; charset=utf8"); resp.setContentType("application/json; charset=utf8");
// 接受数据
// 获取前端传来的规则 ID
String id = req.getParameter("id"); String id = req.getParameter("id");
// 准备数据
// 数据库连接相关变量
Connection connection = null; Connection connection = null;
PreparedStatement pstmt = null; PreparedStatement pstmt = null;
ResultSet resultSet = null; ResultSet resultSet = null;
int result = 0; int result = 0;
String sql = ""; String sql = "";
// 返回数据
// 返回数据相关变量 int code = 1;
int code = 1; // 默认为失败 String msg = "error";
String msg = "error"; // 默认为错误消息 PrintWriter out = resp.getWriter();
// 进行查询
// 获取 PrintWriter 用于返回响应
PrintWriter out = resp.getWriter();
try { try {
// 获取数据库连接 connection = (Connection) Base.getConnection();
connection = Base.getConnection();
sql = "delete from rules where id = ?"; sql = "delete from rules where id = ?";
// 使用 PreparedStatement 来执行删除操作
pstmt = connection.prepareStatement(sql); pstmt = connection.prepareStatement(sql);
pstmt.setString(1, id); pstmt.setString(1, id);
result = pstmt.executeUpdate(); // 执行删除操作 result = pstmt.executeUpdate();
if(result == 1) {
// 判断删除操作是否成功
if (result == 1) {
code = 0; code = 0;
msg = "删除成功"; // 删除成功 msg = "删除成功";
} else { }else {
msg = "删除失败"; // 删除失败 msg = "删除失败";
} }
} catch (ClassNotFoundException e) { } catch (ClassNotFoundException e) {
msg = "class没找到"; // 发生 ClassNotFoundException 异常时返回错误消息 msg = "class没找到";
} catch (SQLException e) { } catch (SQLException e) {
msg = "sql错误"; // 发生 SQL 异常时返回错误消息 msg = "sql错误";
} }
// 将结果作为 JSON 响应返回
out.print(Util.jsonResponse(code, msg, null)); out.print(Util.jsonResponse(code, msg, null));
} }
} }

Some files were not shown because too many files have changed in this diff Show More

Loading…
Cancel
Save