Compare commits

...

26 Commits

Author SHA1 Message Date
ptk8lyo5v bae21b308b 代码注释 王 (#30)
12 months ago
ptk8lyo5v 3df730785b 代码注释 王 (#29)
12 months ago
pscmholb5 24fe1fd27b Merge pull request '代码注释 王' (#25) from develop_wangd into develop
12 months ago
Wangder03 b17dca87f2 wangd
12 months ago
Wangder03 5f63dbb590 wangd
12 months ago
ptk8lyo5v 563d3e1698 代码注释 王/12.14 (#17)
12 months ago
Wangder03 516b993881 wangd
12 months ago
pscmholb5 09b62d451f Merge pull request '代码注释 王' (#15) from branch_wang into develop
12 months ago
p9fu3l5ok 5806532468 注释shi (#14)
12 months ago
ptk8lyo5v 1c9d27ef1e Merge pull request '代码注释 王' (#16) from develop_wangd into develop
12 months ago
Wangder03 ddb79f2fcd wangd
12 months ago
pscmholb5 8183456880 wangd (#12)
12 months ago
zw-j2003 e7ed851637 sovled problem
12 months ago
zw-j2003 b5a65b3e05 Merge remote-tracking branch 'origin/develop' into develop
12 months ago
zw-j2003 948c6c1abf wangd
12 months ago
zw-j2003 de77c2f94c sovled problem
12 months ago
zw-j2003 e9bf3d828c Merge remote-tracking branch 'origin/branch_wang' into branch_wang
12 months ago
pscmholb5 cd7c4d19e8 注释_zhang (#9)
12 months ago
p9fu3l5ok 4667f9fa56 注释 (#6)
12 months ago
pifh2pw87 a60905a41e 注释__何家燕 (#7)
12 months ago
zw-j2003 f26839a1d5 Merge remote-tracking branch 'origin/develop' into develop
12 months ago
Wangder03 c41c268df3 wangd
12 months ago
Wangder03 416648a741 wangd
12 months ago
Wangder03 cb9406e260 wangd
12 months ago
Wangder03 16411a7127 wangd
12 months ago
pscmholb5 cd8fcbf6d5 注释
12 months ago

8
.idea/.gitignore vendored

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

@ -0,0 +1,18 @@
<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>

@ -0,0 +1,6 @@
<?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>

@ -0,0 +1,8 @@
<?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>

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

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

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

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

@ -1,244 +1,226 @@
<%@page import="net.sf.json.JSONObject"%>
<%@page import="java.sql.ResultSet"%>
<%@page import="javabean.JDBCBean"%>
<%@page import="java.util.Map"%>
<%@page import="java.util.HashMap"%>
<%@page import="net.sf.json.JSONObject"%> // 导入JSON库
<%@page import="java.sql.ResultSet"%> // 导入SQL查询结果类
<%@page import="javabean.JDBCBean"%> // 导入自定义数据库连接类
<%@page import="java.util.Map"%> // 导入Map接口
<%@page import="java.util.HashMap"%> // 导入HashMap类
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en">
pageEncoding="UTF-8"%> // 设置页面编码为UTF-8
<!DOCTYPE html> <!-- HTML5文档类型声明 -->
<html lang="en"> <!-- 设置页面语言为英文 -->
<head>
<meta charset="UTF-8">
<title>test</title>
<!-- layui -->
<link rel="stylesheet" href="../public/layui/css/layui.css">
<script src="../public/layui/layui.js"></script>
<style>
.layui-table, .layui-table-view{
margin-top: 0px;
}
</style>
<meta charset="UTF-8"> <!-- 设置页面字符集为UTF-8 -->
<title>test</title> <!-- 页面标题 -->
<!-- layui 样式文件 -->
<link rel="stylesheet" href="../public/layui/css/layui.css">
<script src="../public/layui/layui.js"></script> <!-- layui JavaScript文件 -->
<style>
.layui-table, .layui-table-view{
margin-top: 0px; <!-- 设置表格上方的外边距为0 -->
}
</style>
</head>
<body>
<%
JDBCBean libraryDb = new JDBCBean();
JDBCBean bookSortDb = new JDBCBean();
ResultSet librarySet = null;
ResultSet bookSortSet = null;
// 准备sql
String librarySql = "select * from library";
String bookSortSql = "select * from book_sort";
// 进行查询
librarySet = libraryDb.executeQuery( librarySql );
bookSortSet = bookSortDb.executeQuery( bookSortSql );
// 准备json
JSONObject libraryJson = new JSONObject();
JSONObject bookSortJson = new JSONObject();
// 遍历set
// 获取图书馆json
while( librarySet.next() ){
libraryJson.put(librarySet.getString("id") , librarySet.getString("name"));
}
// 获取分类json
while( bookSortSet.next() ){
bookSortJson.put(bookSortSet.getString("id") , bookSortSet.getString("name"));
}
librarySet.close();
libraryDb.close();
%>
<!-- 搜索框 -->
<script type="text/html" id="search">
<div class="demoTable">
<%
JDBCBean libraryDb = new JDBCBean(); // 创建JDBCBean对象用于连接数据库
JDBCBean bookSortDb = new JDBCBean(); // 创建JDBCBean对象用于连接数据库
ResultSet librarySet = null; // 定义ResultSet变量用于存放查询结果
ResultSet bookSortSet = null; // 定义ResultSet变量用于存放查询结果
// 准备sql查询语句
String librarySql = "select * from library"; // 查询所有图书馆信息
String bookSortSql = "select * from book_sort"; // 查询所有书籍分类信息
// 执行查询
librarySet = libraryDb.executeQuery(librarySql); // 执行查询图书馆
bookSortSet = bookSortDb.executeQuery(bookSortSql); // 执行查询书籍分类
// 创建JSON对象
JSONObject libraryJson = new JSONObject(); // 用于存放图书馆数据的JSON对象
JSONObject bookSortJson = new JSONObject(); // 用于存放书籍分类数据的JSON对象
// 遍历查询结果集并将数据加入到JSON对象
// 获取图书馆信息并存入JSON对象
while( librarySet.next() ){
libraryJson.put(librarySet.getString("id"), librarySet.getString("name")); // 将图书馆的id和name加入到JSON对象
}
// 获取书籍分类信息并存入JSON对象
while( bookSortSet.next() ){
bookSortJson.put(bookSortSet.getString("id"), bookSortSet.getString("name")); // 将分类的id和name加入到JSON对象
}
librarySet.close(); // 关闭图书馆查询结果集
libraryDb.close(); // 关闭数据库连接
%>
<!-- 搜索框模板 -->
<script type="text/html" id="search">
<div class="demoTable">
条件搜索:
<div class="layui-inline">
<select id="condition" name="condition" lay-verify="required">
<option value=""></option>
<option value="id">ID</option>
<option value="name">书名</option>
<option value="author">作者</option>
<option value="library_id">图书馆</option>
<option value="position">位置</option>
<option value="status">状态</option>
<option value="description">描述</option>
</select>
</div>
<div class="layui-inline">
<input class="layui-input" name="conditionValue" id="conditionValue" autocomplete="off" placeholder="请输入搜索内容">
</div>
<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>
<div class="layui-inline">
<select id="condition" name="condition" lay-verify="required"> <!-- 条件选择下拉框 -->
<option value=""></option>
<option value="id">ID</option>
<option value="name">书名</option>
<option value="author">作者</option>
<option value="library_id">图书馆</option>
<option value="position">位置</option>
<option value="status">状态</option>
<option value="description">描述</option>
</select>
</div>
<div class="layui-inline">
<input class="layui-input" name="conditionValue" id="conditionValue" autocomplete="off" placeholder="请输入搜索内容"> <!-- 搜索内容输入框 -->
</div>
<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> <!-- 添加书籍按钮 -->
</div>
</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
var bookSortJson = <%=bookSortJson %>
</script>
<!-- 状态模板 -->
<script type="text/html" id="statusTpl">
{{# if(d.status == 1){ }}
<span style="color:#5FB878;">可借</span>
{{# } else { }}
借出
{{# } }}
</script>
<script>
layui.use(['table', 'jquery'],function(){
$ = layui.jquery;
var table = layui.table;
var tableIns = table.render({
elem: '#demo'
,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'}
,{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();
}
</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){ // 表格编辑事件
console.log(obj.value); // 打印修改后的值
console.log(obj.field); // 打印编辑字段名
console.log(obj.data); // 打印所在行数据
});
// 监听操作栏的事件(编辑、删除、查看借阅)
table.on('tool(form)', function(obj){ // 表格工具栏事件
var data = obj.data; // 获取当前行数据
var layEvent = obj.event; // 获取事件名
var tr = obj.tr; // 获取当前行的DOM对象
var id = data.id; // 获取书籍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') { //查看该书籍借阅历史
layer.open({
title: '书籍借阅历史',
type: 2,
area: ['800px', '600px'],
maxmin: true,
shadeClose: true,
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;
};
});
}else if(layEvent === 'bookBorrowList') { // 查看借阅历史
// 打开借阅历史页面
layer.open({
title: '书籍借阅历史',
type: 2,
area: ['800px', '600px'],
maxmin: true,
shadeClose: true,
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 // 从第一页开始加载
}
});
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>
</html>
</html>

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

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

@ -1,117 +1,115 @@
<%@page import="javabean.Base"%>
<%@page import="java.sql.ResultSet"%>
<%@page import="java.sql.PreparedStatement"%>
<%@page import="java.sql.Connection"%>
<%@page import="net.sf.json.JSONObject"%>
<%@page import="net.sf.json.JSONArray"%>
<%@page import="javabean.Admin"%>
<%@page import="javabean.Base"%> <!-- 导入javabean.Base类 -->
<%@page import="java.sql.ResultSet"%> <!-- 导入ResultSet类处理SQL查询结果 -->
<%@page import="java.sql.PreparedStatement"%> <!-- 导入PreparedStatement类用于执行SQL语句 -->
<%@page import="java.sql.Connection"%> <!-- 导入Connection类表示数据库连接 -->
<%@page import="net.sf.json.JSONObject"%> <!-- 导入JSONObject类用于处理JSON对象 -->
<%@page import="net.sf.json.JSONArray"%> <!-- 导入JSONArray类用于处理JSON数组 -->
<%@page import="javabean.Admin"%> <!-- 导入javabean.Admin类 -->
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
pageEncoding="UTF-8"%> <!-- 设置页面的语言为Java字符编码为UTF-8,设置页面的编码为UTF-8 -->
<!DOCTYPE html> <!-- 声明HTML5文档类型 -->
<html> <!-- 开始HTML文档 -->
<head>
<meta charset="UTF-8">
<title>图书证修改</title>
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all">
<script src="../public/layui/layui.js" charset="utf-8"></script>
<style>
.layui-form{
margin: 10px 20px;
}
</style>
<meta charset="UTF-8"> <!-- 设置页面字符编码为UTF-8 -->
<title>图书证修改</title> <!-- 设置页面标题为“图书证修改” -->
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> <!-- 引入layui的CSS文件 -->
<script src="../public/layui/layui.js" charset="utf-8"></script> <!-- 引入layui的JS文件 -->
<style>
.layui-form{ <!-- 定义layui表单样式 -->
margin: 10px 20px; <!-- 设置表单的外边距为10px 20px -->
}
</style>
</head>
<body>
<%
Connection connection = null;
PreparedStatement pstmt = null;
ResultSet ruleSet = null;
String sql = "select * from rules";
String result = "";
connection = (Connection)Base.getConnection();
pstmt = connection.prepareStatement(sql);
ruleSet = pstmt.executeQuery();
Connection connection = null; // 声明数据库连接对象
PreparedStatement pstmt = null; // 声明PreparedStatement对象
ResultSet ruleSet = null; // 声明ResultSet对象用于存储查询结果
String sql = "select * from rules"; // 定义SQL查询语句
String result = ""; // 定义结果字符串
connection = (Connection)Base.getConnection(); // 获取数据库连接
pstmt = connection.prepareStatement(sql); // 创建PreparedStatement对象并执行SQL查询
ruleSet = pstmt.executeQuery(); // 执行查询并返回结果集
%>
<form class="layui-form layui-form-pane" action="" lay-filter="cardFilter">
<form class="layui-form layui-form-pane" action="" lay-filter="cardFilter"> <!-- 定义表单layui样式 -->
<!-- 姓名 -->
<div class="layui-form-item">
<label class="layui-form-label">姓名</label>
<div class="layui-input-block">
<input type="text" name="reader" lay-verify="required" autocomplete="off" placeholder="请输入姓名" class="layui-input">
<div class="layui-form-item"> <!-- 表单项 -->
<label class="layui-form-label">姓名</label> <!-- 表单标签 -->
<div class="layui-input-block"> <!-- 表单输入框 -->
<input type="text" name="reader" lay-verify="required" autocomplete="off" placeholder="请输入姓名" class="layui-input"> <!-- 输入框,必须填写 -->
</div>
</div>
<!-- 密码 -->
<div class="layui-form-item">
<label class="layui-form-label">密码</label>
<div class="layui-input-block">
<input type="password" name="password" placeholder="请输入密码" autocomplete="off" class="layui-input" lay-verify="required">
<div class="layui-form-item"> <!-- 表单项 -->
<label class="layui-form-label">密码</label> <!-- 表单标签 -->
<div class="layui-input-block"> <!-- 表单输入框 -->
<input type="password" name="password" placeholder="请输入密码" autocomplete="off" class="layui-input" lay-verify="required"> <!-- 输入框,密码字段,必须填写 -->
</div>
</div>
<!-- 借阅规则 -->
<div class="layui-form-item">
<label class="layui-form-label">规则</label>
<div class="layui-input-block">
<select name="rule_id" lay-filter="rule_id" lay-verify="required">
<% while(ruleSet.next()){ %>
<option value=<%=ruleSet.getString("id") %>><%=ruleSet.getString("id") %></option>
<div class="layui-form-item"> <!-- 表单项 -->
<label class="layui-form-label">规则</label> <!-- 表单标签 -->
<div class="layui-input-block"> <!-- 表单输入框 -->
<select name="rule_id" lay-filter="rule_id" lay-verify="required"> <!-- 下拉框,规则选择,必须选择 -->
<% while(ruleSet.next()){ %> <!-- 循环遍历查询结果 -->
<option value=<%=ruleSet.getString("id") %>><%=ruleSet.getString("id") %></option> <!-- 为每个规则生成一个选项 -->
<%} %>
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">状态</label>
<div class="layui-input-block">
<input type="radio" name="status" value="1" title="可用" checked="">
<input type="radio" name="status" value="0" title="挂失">
<div class="layui-form-item"> <!-- 表单项 -->
<label class="layui-form-label">状态</label> <!-- 表单标签 -->
<div class="layui-input-block"> <!-- 表单输入框 -->
<input type="radio" name="status" value="1" title="可用" checked=""> <!-- 单选按钮,表示“可用”状态 -->
<input type="radio" name="status" value="0" title="挂失"> <!-- 单选按钮,表示“挂失”状态 -->
</div>
</div>
<div class="layui-form-item">
<div class="layui-input-block">
<button class="layui-btn" lay-submit="" lay-filter="submitForm">立即提交</button>
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
<div class="layui-form-item"> <!-- 表单项 -->
<div class="layui-input-block"> <!-- 表单输入框 -->
<button class="layui-btn" lay-submit="" lay-filter="submitForm">立即提交</button> <!-- 提交按钮点击时触发submitForm事件 -->
<button type="reset" class="layui-btn layui-btn-primary">重置</button> <!-- 重置按钮,清空表单内容 -->
</div>
</div>
</form>
<script>
layui.use(['form', 'jquery'], function(){
var form = layui.form
,layer = layui.layer;
$ = 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);*/
}else{
leyer.msg("添加失败");
}
}
});
return false;
})
});
layui.use(['form', 'jquery'], function(){ // 使用layui的form和jquery模块
var form = layui.form // 获取form模块实例
,layer = layui.layer; // 获取layer模块实例
$ = layui.jquery; // 获取jQuery对象
// 提交表单
form.on('submit(submitForm)', function(data){ // 当提交表单时触发submitForm事件
$.ajax({ // 发送AJAX请求
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; // 阻止表单默认提交
})
});
</script>
</body>
</html>
</html>

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

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

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

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

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

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

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

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

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

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

@ -1,119 +1,120 @@
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en">
pageEncoding="UTF-8"%> // 设置页面的字符编码为UTF-8
<!DOCTYPE html> // 声明HTML5文档类型
<html lang="en"> // 开始HTML文档指定语言为英语
<head>
<meta charset="UTF-8">
<title>规则列表</title>
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all">
<meta charset="UTF-8"> // 设置页面的字符编码为UTF-8
<title>规则列表</title> // 页面标题设置为“规则列表”
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all"> // 引入layui框架的CSS文件用于样式支持
<style>
.layui-table,.layui-table-view{
margin: 0 0px;
.layui-table,.layui-table-view{ // 自定义layui表格和表格视图的样式
margin: 0 0px; // 设置表格的外边距为0
}
</style>
</head>
<body>
<!-- 表单 -->
<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 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}
]]
});
// 头部工具栏事件
table.on('toolbar(formFilter)', function(obj){
var checkStatus = table.checkStatus(obj.config.id);
switch(obj.event){
// 添加规则
case 'add':
var addCardLayer = layer.open({
type: 2,
title: '添加规则',
area: ['800px', '500px'],
maxmin: true,
content: 'ruleadd.jsp',
});
};
<!-- 表单 -->
<table class="layui-hide" id="ruleTable" lay-filter="formFilter"></table> // 定义一个表格元素使用layui样式并指定ID为ruleTablelay-filter用于表格过滤
<script src="../public/layui/layui.js" charset="utf-8"></script> // 引入layui框架的JavaScript文件提供组件和交互功能
<!-- 头部工具栏 -->
<script type="text/html" id="headBar"> // 自定义头部工具栏模板
<button type="button" class="layui-btn layui-btn-sm" lay-event="add"><i class="layui-icon">添加</i></button> // 添加按钮点击时触发“add”事件
</script>
<!-- 表格后面的操作 -->
<script type="text/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>
layui.use(['table','jquery'], function(){ // 使用layui的table和jquery模块
$ = 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(('tool(formFilter)'), function(obj){
var data = obj.data;
var layEvent = obj.event;
var tr = obj.tr;
var id = data.id;
switch(obj.event){
case 'edit':
layer.open({
type: 2,
title: '更改信息',
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{
layer.msg(data.msg,{
icon:5,
anim:6
})
}
},
error: function(){
layer.msg("连接超时");
}
})
})
}
})
// 头部工具栏事件
table.on('toolbar(formFilter)', function(obj){ // 监听头部工具栏的事件
var checkStatus = table.checkStatus(obj.config.id); // 获取选中的表格行
switch(obj.event){ // 根据事件类型处理不同的操作
// 添加规则
case 'add':
var addCardLayer = layer.open({ // 打开添加规则的弹窗
type: 2, // 弹窗类型为iframe
title: '添加规则', // 弹窗标题
area: ['800px', '500px'], // 弹窗宽度800px高度500px
maxmin: true, // 启用最大化和最小化按钮
content: 'ruleadd.jsp', // 弹窗内容来自ruleadd.jsp页面
});
};
});
// 侧边工具栏事件
table.on(('tool(formFilter)'), function(obj){ // 监听侧边操作栏的事件
var data = obj.data; // 获取当前操作行的数据
var layEvent = obj.event; // 获取事件类型
var tr = obj.tr; // 获取当前操作行的tr元素
var id = data.id; // 获取当前操作行的ID
switch(obj.event){ // 根据事件类型处理不同的操作
case 'edit': // 编辑操作
layer.open({ // 打开编辑规则的弹窗
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>
</html>
</html>

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

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

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

@ -1,89 +1,82 @@
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
pageEncoding="UTF-8"%> // 设置页面的编码方式为UTF-8
<!DOCTYPE html> // 声明文档类型为HTML5
<html> // HTML文档开始
<head>
<meta charset="UTF-8">
<title>修改密码</title>
<!-- layui -->
<link rel="stylesheet" href="../public/layui/css/layui.css">
<script src="../public/layui/layui.js"></script>
<style>
.layui-form{
margin: 10px 20px;
}
</style>
</head>
<meta charset="UTF-8"> // 设置页面的字符编码为UTF-8
<title>修改密码</title> // 设置页面标题为“修改密码”
<!-- layui -->
<link rel="stylesheet" href="../public/layui/css/layui.css"> // 引入layui的CSS样式文件
<script src="../public/layui/layui.js"></script> // 引入layui的JavaScript文件
<style>
.layui-form{ // 设置layui表单的样式
margin: 10px 20px; // 设置表单的外边距
}
</style>
</head>
<body>
<form class="layui-form layui-form-pane" action="" lay-filter="formFilter">
<form class="layui-form layui-form-pane" action="" lay-filter="formFilter"> // 创建layui表单设置formFilter作为表单过滤器
<div class="layui-form-item">
<label class="layui-form-label">旧密码</label>
<div class="layui-input-block">
<input type="password" name="oldPassword" lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input">
<div class="layui-form-item"> // 定义表单项
<label class="layui-form-label">旧密码</label> // 设置标签为“旧密码”
<div class="layui-input-block"> // 输入框所在块
<input type="password" name="oldPassword" lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input"> // 密码输入框,带有验证规则
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">新密码</label>
<div class="layui-input-block">
<input type="password" name="newPassword" lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input">
<div class="layui-form-item"> // 定义表单项
<label class="layui-form-label">新密码</label> // 设置标签为“新密码”
<div class="layui-input-block"> // 输入框所在块
<input type="password" name="newPassword" lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input"> // 新密码输入框,带有验证规则
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">确认密码</label>
<div class="layui-input-block">
<input type="password" name="conPassword" lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input">
<div class="layui-form-item"> // 定义表单项
<label class="layui-form-label">确认密码</label> // 设置标签为“确认密码”
<div class="layui-input-block"> // 输入框所在块
<input type="password" name="conPassword" lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input"> // 确认密码输入框,带有验证规则
</div>
</div>
<div class="layui-form-item">
<div class="layui-input-block">
<button type="submit" class="layui-btn" lay-submit="" lay-filter="submitButton">确认修改</button>
<div class="layui-form-item"> // 定义表单项
<div class="layui-input-block"> // 输入框所在块
<button type="submit" class="layui-btn" lay-submit="" lay-filter="submitButton">确认修改</button> // 提交按钮,点击提交表单
</div>
</div>
</form>
<script>
<script>
layui.use(['form', 'jquery'], function(){ // 使用layui的form和jquery模块
$ = layui.jquery; // 获取jquery库
var form = layui.form, // 获取layui的form模块
layer = layui.layer; // 获取layui的layer模块
layui.use(['form', 'jquery'], function(){
$ = layui.jquery;
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;
});
});
// 监听提交事件
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; // 阻止表单默认提交
});
});
</script>
</body>
</html>
</html>

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

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

@ -1,85 +1,134 @@
<%@ 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">
<!-- 文档类型声明使用HTML 4.01 Transitional DTD -->
<html>
<head>
<meta charset="utf-8">
<meta charset="utf-8">
<!-- 设置页面字符编码为UTF-8 -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<!-- 视口设置,确保页面在移动设备上正确显示 -->
<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>
<body class="layui-layout-body">
<!-- 页面主体部分应用LayUI布局类 -->
<div class="layui-layout layui-layout-admin">
<!-- LayUI布局容器应用管理员布局类 -->
<div class="layui-header">
<!-- 头部区域 -->
<div class="layui-logo">图书馆管理人员页面</div>
<!-- 网站Logo和标题 -->
<!-- 头部区域可配合layui已有的水平导航 -->
<ul class="layui-nav layui-layout-left">
<ul class="layui-nav layui-layout-left">
<!-- 左侧导航栏应用LayUI导航类 -->
<li class="layui-nav-item">
<a href="javascript:;">其它系统</a>
<a href=";">其它系统</a>
<!-- 导航项:其它系统 -->
<dl class="layui-nav-child">
<!-- 子菜单 -->
<dd><a href="../reader/04readerFrame.jsp" target="parent">图书馆首页</a></dd>
<!-- 子菜单项:图书馆首页 -->
<dd><a href="../adminLogin.html" target="parent">系统管理员</a></dd>
<!-- 子菜单项:系统管理员登录页 -->
</dl>
</li>
</ul>
<ul class="layui-nav layui-layout-right">
<!-- 右侧导航栏应用LayUI导航类 -->
<li class="layui-nav-item">
<a href="javascript:;">
<%=session.getAttribute("manager") %>
<a href=";">
<%=session.getAttribute("manager") %>
<!-- 动态显示当前登录的管理人员名称 -->
</a>
<dl class="layui-nav-child">
<dd><a href="09managerSelf.jsp" target="content">基本资料</a></dd>
<!-- 子菜单 -->
<dd><a href="09managerSelf.jsp" target="content">基本资料</a></dd>
<!-- 子菜单项:基本资料 -->
</dl>
</li>
<li class="layui-nav-item"><a href="./quit" target="_parent">退出</a></li>
<!-- 导航项:退出 -->
</ul>
</div>
<div class="layui-side layui-bg-black">
<!-- 左侧侧边栏,应用黑色背景类 -->
<div class="layui-side-scroll">
<!-- 滚动区域 -->
<!-- 左侧导航区域可配合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">
<a class="" href="javascript:;"><i class="layui-icon layui-icon-read" style="font-size: 20px; color: lightblue;"></i>&nbsp;图书管理</a>
<a class="" href=";"><i class="layui-icon layui-icon-read" style="font-size: 20px; color: lightblue;"></i>&nbsp;图书管理</a>
<!-- 主导航项:图书管理 -->
<dl class="layui-nav-child">
<!-- 子菜单 -->
<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>
</li>
<li class="layui-nav-item">
<a href="javascript:;"><i class="layui-icon layui-icon-form" style="font-size: 20px; color: orange;"></i>&nbsp;报表管理</a>
<a href=";"><i class="layui-icon layui-icon-form" style="font-size: 20px; color: orange;"></i>&nbsp;报表管理</a>
<!-- 主导航项:报表管理 -->
<dl class="layui-nav-child">
<!-- 子菜单 -->
<dd><a href="06borrowTable.jsp" target="content">借书报表</a></dd>
<!-- 子菜单项:借书报表 -->
<dd><a href="07returnTable.jsp" target="content">还书报表</a></dd>
<!-- 子菜单项:还书报表 -->
</dl>
</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>
</div>
</div>
<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 class="layui-footer">
<!-- 底部固定区域 -->
© 图书管理系统
&#169; 图书管理系统
<!-- 版权信息 -->
</div>
</div>
<script src="../src/layui.js"></script>
<script>
//JavaScript代码区域
layui.use('element', function(){
var element = layui.element;
});
</script>
</body>
</html>
</html>

@ -1,114 +1,137 @@
<%@ 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">
<!-- 定义文档类型为HTML 4.01 Transitional -->
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all">
<script src="../public/layui/layui.js"></script>
<style>
.layui-form-label{
margin-left:20%;
}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!-- 设置页面的字符编码为UTF-8 -->
<title>Insert title here</title>
<!-- 设置页面标题 -->
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all">
<!-- 引入Layui的CSS样式文件 -->
<style>
.layui-form-label{
margin-left:20%;
}
</style>
<!-- 自定义样式将表单标签的左边距设置为20% -->
</head>
<body>
<div align="center" style=" margin-top: 2%;"><h1>借阅图书</h1></div>
<div align="center"
style="margin-left:30%; margin-top: 5%; width: 40%;">
<form class="layui-form layui-form-pane" action="03borrowSus.jsp">
<div class="layui-form-item">
<label class="layui-form-label">借阅证号</label>
<div class="layui-input-inline">
<input type="text" name="userid" lay-verify="required"
placeholder="请输入借阅证号" autocomplete="off" class="layui-input"><br>
</div>
<div align="center" style=" margin-top: 2%;"><h1>借阅图书</h1></div>
<!-- 居中显示标题“借阅图书”并设置顶部边距为2% -->
<div align="center"
style="margin-left:30%; margin-top: 5%; width: 40%;">
<!-- 设置表单容器的左外边距、上外边距和宽度 -->
<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 class="layui-form-item">
<label class="layui-form-label">图书编号</label>
<div class="layui-input-inline">
<input type="text" name="bookid" lay-verify="required"
placeholder="请输入图书编号" autocomplete="off" class="layui-input"><br>
</div>
</div>
<div class="layui-form-item">
<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>
<!-- 创建文本输入框名称为bookid验证规则为必填占位符为“请输入图书编号”自动完成关闭并应用Layui的输入框样式 -->
</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 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 class="layui-form-item" align="center">
<button class="layui-btn" lay-submit="" lay-filter="demo2">借阅</button>
</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',
value: new Date()
});
laydate.render({
elem : '#date2',
type : 'datetime',
format : 'yyyy-M-d H:m:s'
});
//创建一个编辑器
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"
});
});
//表单取值
layui.$('#LAY-component-form-getval').on(
'click', function() {
var data = form.val('example');
alert(JSON.stringify(data));
});
});
</script>
</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({
elem : '#date2',
type : 'datetime',
format : 'yyyy-M-d H:m:s'
});
<!-- 渲染另一个日期选择器绑定到ID为date2的元素类型为日期时间格式为“年-月-日 时:分:秒” -->
//创建一个编辑器
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"
});
});
//表单取值
layui.$('#LAY-component-form-getval').on(
'click', function() {
var data = form.val('example');
(JSON.stringify(data));
});
});
});
</script>
</div>
</body>
</html>

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

@ -1,95 +1,96 @@
<%@ 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>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all">
<script src="../public/layui/layui.js"></script>
<style>
.layui-form-label{
margin-left:20%;
}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all">
<style>
.layui-form-label{
margin-left:20%;
}
</style>
</head>
<body>
<div align="center" style=" margin-top: 2%;"><h1>查询图书是否逾期</h1></div>
<div align="center"
style="margin-left:30%; margin-top: 5%; width: 40%;">
<!-- 页面主体内容开始 -->
<div align="center" style=" margin-top: 2%;"><h1>查询图书是否逾期</h1></div>
<div align="center"
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">
<button class="layui-btn layui-btn-warm" lay-submit="" lay-filter="demo2">查询</button>
<!-- 图书编号输入框 -->
<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>
</form>
</div>
<!-- 提交按钮 -->
<div class="layui-form-item" align="center">
<button class="layui-btn layui-btn-warm" lay-submit="" lay-filter="demo2">查询</button>
</div>
</form>
<script>
layui
.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
.build('LAY_demo_editor');
<!-- 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()
});
//监听提交
form.on('submit(demo1)', function(data) {
layer.alert(JSON.stringify(data.field), {
title : '最终的提交信息'
})
return false;
});
//创建一个编辑器实例
var editIndex = layedit
.build('LAY_demo_editor');
//表单赋值
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"
});
});
//监听表单提交事件
form.on('submit(demo1)', function(data) {
layer.alert(JSON.stringify(data.field), {
title : '最终的提交信息'
});
return false; //阻止表单跳转。如果需要表单跳转,去掉这段即可。
});
//表单取值
layui.$('#LAY-component-form-getval').on(
'click', function() {
var data = form.val('example');
alert(JSON.stringify(data));
});
//表单赋值示例
layui.$('#LAY-component-form-setval').on(
'click', function() {
form.val('example', {
"username" : "贤心" // "name": "value"
,
"password" : "123456",
"interest" : 1,
"like[write]" : true //复选框选中状态
,
"close" : true //开关状态
,
"sex" : "女",
"desc" : "我爱 layui"
});
});
});
</script>
</div>
//表单取值示例
layui.$('#LAY-component-form-getval').on(
'click', function() {
var data = form.val('example');
(JSON.stringify(data));
});
});
});
</script>
</div>
</body>
</html>
</html>

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

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

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

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

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

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

@ -1,109 +1,111 @@
<%@ 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>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all">
<script src="../public/layui/layui.js"></script>
<title>Insert title here</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!-- 引入layui的CSS文件 -->
<link rel="stylesheet" href="../public/layui/css/layui.css" media="all">
<title>Insert title here</title>
</head>
<body>
<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>
<!-- 定义一个隐藏的表格,用于展示公告信息 -->
<table class="layui-hide" id="annTable" lay-filter="formFilter"></table>
<!-- 添加公告按钮 -->
<button type="button" class="layui-btn layui-btn-sm" lay-event="add"><i class="layui-icon"><i class="layui-icon layui-icon-release" style="font-size: 20px; color: yellow;"></i>&nbsp;发布新公告</i></button>
<!-- 编辑和删除按钮 -->
<a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
<script type="text/html" id="rightBar">
<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: '#annTable'
,url:'./announcement'
,toolbar: '#headBar'
,height: 600
,cols: [[
{field:'id', width:80, title: 'ID', sort: true}
,{field:'title', width:230, title: '标题'}
,{field:'detail', width:580, title: '公告'}
,{field:'publish_date', title: '发布日期', minWidth: 100, sort: true}
,{fixed: 'right', title:'操作', toolbar: '#rightBar', align: 'center', width:150}
]]
});
// 头部工具栏事件
table.on('toolbar(formFilter)', function(obj){
var checkStatus = table.checkStatus(obj.config.id);
switch(obj.event){
// 添加公告
case 'add':
var addCardLayer = layer.open({
type: 2,
title: '发布公告',
area: ['800px', '500px'],
maxmin: true,
shadeClose: true,
content: '08add.jsp',
});
//layer.full(addCardLayer);
};
<script>
<!-- 使用layui的模块 -->
layui.use(['table','jquery'], function(){
$ = layui.jquery; // 获取jQuery对象
var table = layui.table; // 获取table模块
// 进行渲染
var tableIns = table.render({
elem: '#annTable' // 绑定到页面中的表格元素
,url:'./announcement' // 数据接口地址
,toolbar: '#headBar' // 工具栏模板选择器
,height: 600 // 设置表格高度
,cols: [[ // 定义表格列
{field:'id', width:80, title: 'ID', sort: true} // ID列
,{field:'title', width:230, title: '标题'} // 标题列
,{field:'detail', width:580, title: '公告'} // 公告内容列
,{field:'publish_date', title: '发布日期', minWidth: 100, sort: true} // 发布日期列
,{fixed: 'right', title:'操作', toolbar: '#rightBar', align: 'center', width:150} // 操作列
]]
});
// 头部工具栏事件
table.on('toolbar(formFilter)', function(obj){
var checkStatus = table.checkStatus(obj.config.id); // 获取选中状态
switch(obj.event){
// 添加公告
case 'add':
var addCardLayer = layer.open({
type: 2, // iframe层
title: '发布公告', // 标题
area: ['800px', '500px'], // 宽高
maxmin: true, // 允许最大化最小化
shadeClose: true, // 点击遮罩关闭
content: '08add.jsp', // iframe的URL
});
//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>
</body>
</html>

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

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

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

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

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

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

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

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

File diff suppressed because it is too large Load Diff

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

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

@ -1,61 +1,64 @@
<%@ 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>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
<!-- Bootstrap -->
<link href="../css/bootstrap.min.css" rel="stylesheet">
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery所以必须放在前边) -->
<script src="../js/jquery.min.js"></script>
<script src="../js/bootstrap.min.js"></script>
<style>
<!-- 引入Bootstrap的CSS文件 -->
<link href="../css/bootstrap.min.css" rel="stylesheet">
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery所以必须放在前边) -->
</style>
<style>
</style>
</head>
<body>
<nav class="navbar navbar-inverse" role="navigation">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<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>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">欢迎登陆图书管理系统</a>
</div>
<!-- 导航栏 -->
<nav class="navbar navbar-inverse" role="navigation">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<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>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<!-- 网站标题 -->
<a class="navbar-brand" href="#">欢迎登陆图书管理系统</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<!-- 左侧导航链接 -->
<ul class="nav navbar-nav">
<li><p style="margin-top:25%;color:grey;">借阅者页面<span class="sr-only">(current)</span></p></li>
</ul>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li><p style="margin-top:25%;color:grey;">借阅者页面<span class="sr-only">(current)</span></p></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="javascript:;">
<%if(session.getAttribute("reader")==null){
<!-- 右侧导航链接 -->
<ul class="nav navbar-nav navbar-right">
<li><a href=";">
<!-- 如果session中没有reader属性则不显示任何内容否则显示reader的值 -->
<%if(session.getAttribute("reader")==null){
// 空操作
} else{%>
<%=session.getAttribute("reader") %>
<%} %>
</a></li>
<%if(session.getAttribute("reader") !=null) {%>
<li><a href="./exit" target="_parent">退出</a></li>
<%}else{%>
<li><a href="04readerFrame.jsp" target="_parent" onClick="">登录</a></li>
<%}
%>
</ul>
</div>
<%=session.getAttribute("reader") %>
<%} %>
</a></li>
<!-- 如果session中有reader属性则显示退出链接否则显示登录链接 -->
<%if(session.getAttribute("reader") !=null) {%>
<li><a href="./exit" target="_parent">退出</a></li>
<%}else{%>
<li><a href="04readerFrame.jsp" target="_parent" onClick="">登录</a></li>
<%}
%>
</ul>
</div>
</nav>
</div>
</nav>
</body>
</html>
</html>

@ -1,54 +1,68 @@
<%@ 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>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
<!-- Bootstrap -->
<link href="../css/bootstrap.min.css" rel="stylesheet">
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery所以必须放在前边) -->
<script src="../js/jquery.min.js"></script>
<script src="../js/bootstrap.min.js"></script>
<style>
.sidebar li a:hover{
background:#337ab7;
color:white;
}
.faq-tabbable li a:focus{
background:skyblue;
color:white;
}
</style>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
<!-- 引入Bootstrap样式表 -->
<link href="../css/bootstrap.min.css" rel="stylesheet">
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery所以必须放在前边) -->
<!-- 这里没有实际引入jQuery但通常需要引入 -->
<style>
/* 自定义侧边栏菜单项的悬停效果 */
.sidebar li a:hover{
background:#337ab7; /* 背景颜色设置为蓝色 */
color:white; /* 文字颜色设置为白色 */
}
/* 自定义侧边栏菜单项获得焦点时的效果 */
.faq-tabbable li a:focus{
background:skyblue; /* 背景颜色设置为天蓝色 */
color:white; /* 文字颜色设置为白色 */
}
</style>
</head>
<body>
<div style="text-align:center;width:100%;height:100%;font-size20px;">
<ul class="nav nav-pills nav-stacked nav-inverse sidebar faq-tabbable">
<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">
<!-- 创建一个无序列表,用于显示侧边栏菜单项 -->
<% if(session.getAttribute("reader")!=null){%>
<li role="presentation"><a href="01main.jsp" target="view_frame"><span class="glyphicon glyphicon-picture" aria-hidden="true">&nbsp;首页</span></a></li>
<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="index.jsp" target="view_frame"><span class="glyphicon glyphicon-user" aria-hidden="true">&nbsp;个人信息</span></a></li>
<li role="presentation"><a href="06borrow.jsp" target="view_frame"><span class="glyphicon glyphicon-book" aria-hidden="true">&nbsp;借阅信息</span></a></li>
<li role="presentation"><a href="08illegalInfo.jsp" target="view_frame"><span class="glyphicon glyphicon-remove" aria-hidden="true">&nbsp;违章信息</span></a></li>
<li role="presentation"><a href="13message.jsp" target="view_frame"><span class="glyphicon glyphicon-pencil" aria-hidden="true">&nbsp;读者留言</span></a></li>
<%
}else{
%>
<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="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>
<!-- 如果 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="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="index.jsp" target="view_frame"><span class="glyphicon glyphicon-user" aria-hidden="true">&nbsp;个人信息</span></a></li>
<!-- 菜单项:个人信息 -->
<li role="presentation"><a href="06borrow.jsp" target="view_frame"><span class="glyphicon glyphicon-book" aria-hidden="true">&nbsp;借阅信息</span></a></li>
<!-- 菜单项:借阅信息 -->
<li role="presentation"><a href="08illegalInfo.jsp" target="view_frame"><span class="glyphicon glyphicon-remove" aria-hidden="true">&nbsp;违章信息</span></a></li>
<!-- 菜单项:违章信息 -->
<li role="presentation"><a href="13message.jsp" target="view_frame"><span class="glyphicon glyphicon-pencil" aria-hidden="true">&nbsp;读者留言</span></a></li>
<!-- 菜单项:读者留言 -->
<% } 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>
<!-- 菜单项:首页 -->
<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>
</html>
</html>

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

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

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

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

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

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

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

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

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

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

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

@ -0,0 +1,12 @@
<?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,25 +14,67 @@ import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
/**
*
* @author Mingyue
*
*
*
*
* 访
*
* @author Mingyue
*/
public class AdminFilter implements Filter {
/**
*
*
*
*
*
* @param 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 {
// 将ServletRequest转换为HttpServletRequest以便处理HTTP请求
HttpServletRequest req = (HttpServletRequest) request;
// 获取会话对象
HttpSession session = req.getSession();
// 检查会话中是否存在名为"admin"的属性,若不存在则跳转到登录页面
if(session == null || session.getAttribute("admin") == null) {
// 将ServletResponse转换为HttpServletResponse以便处理HTTP响应
HttpServletResponse rep = (HttpServletResponse)response;
PrintWriter out =response.getWriter();
// iframe父页面直接跳转到登录界面
// 获取输出流
PrintWriter out = rep.getWriter();
// 使用JavaScript进行重定向跳转到管理员登录页面
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,39 +1,37 @@
package filter;
package filter; // 定义包名
import java.io.IOException;
import java.io.IOException; // 导入IOException类
import javax.servlet.Filter;
import javax.servlet.FilterChain;
import javax.servlet.FilterConfig;
import javax.servlet.ServletException;
import javax.servlet.ServletRequest;
import javax.servlet.ServletResponse;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.Filter; // 导入Filter接口
import javax.servlet.FilterChain; // 导入FilterChain接口
import javax.servlet.FilterConfig; // 导入FilterConfig接口
import javax.servlet.ServletException; // 导入ServletException类
import javax.servlet.ServletRequest; // 导入ServletRequest接口
import javax.servlet.ServletResponse; // 导入ServletResponse接口
import javax.servlet.http.HttpServletRequest; // 导入HttpServletRequest类
import javax.servlet.http.HttpServletResponse; // 导入HttpServletResponse类
/**
*
* @author Mingyue
*
*/
import javax.servlet.*;
import java.io.IOException;
import javax.servlet.*; // 再次导入javax.servlet包可能是多余的
import java.io.IOException; // 再次导入IOException类可能是多余的
public class CharacterEncodingFilter implements Filter {
public void init(FilterConfig filterConfig) throws ServletException {
public class CharacterEncodingFilter implements Filter { // 定义一个实现Filter接口的类
public void init(FilterConfig filterConfig) throws ServletException { // 初始化方法接收FilterConfig对象
// 空实现,可以在这里进行一些初始化操作
}
public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException {
servletRequest.setCharacterEncoding("UTF-8");
servletResponse.setCharacterEncoding("UTF-8");
filterChain.doFilter(servletRequest, servletResponse);
public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException { // 过滤方法,处理请求和响应
servletRequest.setCharacterEncoding("UTF-8"); // 设置请求的字符编码为UTF-8
servletResponse.setCharacterEncoding("UTF-8"); // 设置响应的字符编码为UTF-8
filterChain.doFilter(servletRequest, servletResponse); // 将请求和响应传递给下一个过滤器或目标资源
}
public void destroy() {
public void destroy() { // 销毁方法,在过滤器被销毁时调用
// 空实现,可以在这里进行一些清理操作
}
}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

@ -13,70 +13,111 @@ import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javabean.Admin;
import javabean.Common;
import javabean.Util;
import net.sf.json.JSONArray;
import net.sf.json.JSONObject;
/**
* Servlet implementation class BookList
* Servlet
*
* Servlet
* JSON
*/
@WebServlet("/admin/bookList")
public class BookList extends HttpServlet {
/**
* GET
*
*
* JSON
*
* @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");
// 初始化响应的 JSON 对象
JSONObject json = new JSONObject();
// 定义返回的数据和状态码
String result = null;
Map<String, Object> map = null;
int code = 1;
String msg = "";
String data = "";
// 获取分页参数,默认值为 page=1 和 limit=10
String page = (String) req.getParameter("page");
String limit = (String) req.getParameter("limit");
// 获取查询条件参数(如果有)
String condition = (String) req.getParameter("condition");
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) {
page = "1";
}
if(limit == null) {
limit = "10";
}
// 如果传递了查询条件参数,则将其加入查询条件 Map 中
if(condition == null || conditionValue == null || condition.isEmpty() || conditionValue.isEmpty()) {
condition = null;
conditionValue = null;
}else {
} else {
where.put("condition", condition);
where.put("conditionValue", conditionValue);
}
// 实例化 Admin 对象来调用获取书籍列表的方法
Admin admin = new Admin();
try {
// 调用 getBookList 方法来获取书籍列表数据
map = admin.getBookList(page, limit, where);
result = (String) map.get("data");
result = (String) map.get("data"); // 获取查询结果
} catch (ClassNotFoundException | SQLException e) {
msg = "数据库获取信息失败";
// 捕获数据库操作异常,设置错误消息
msg = "数据库获取信息失败";
}
// 如果没有获取到数据或数据为空,返回错误消息
if(result == null || result.isEmpty() || result.equals("1")) {
json.put("code", 1);
json.put("msg", "数据为空");
} else {
// 获取到数据,返回成功状态,并包含查询结果
json.put("code", 0);
json.put("msg", "success");
json.put("count", map.get("count"));
result = "[" +result +"]";
json.put("data", result);
json.put("count", map.get("count")); // 返回总记录数
result = "[" + result + "]"; // 格式化数据为 JSON 数组
json.put("data", result); // 返回数据
}
// 将 JSON 响应数据写入输出流
PrintWriter out = resp.getWriter();
out.print(json.toString());
}
@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
doGet(req, resp);
}
}
/**
* POST doGet
*
* @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,61 +18,92 @@ import javabean.Base;
import net.sf.json.JSONArray;
import net.sf.json.JSONObject;
/**
* Servlet
*
* Servlet
* JSON
*/
@WebServlet("/admin/borrowList")
public class BorrowList extends HttpServlet {
/**
* GET
*
*
* JSON
*
* @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");
// 接收参数
String limit = req.getParameter("limit");
String page = req.getParameter("page");
String condition = (String) req.getParameter("condition");
String conditionValue = (String) req.getParameter("conditionValue");
String where = ""; // 无限制条件
// 获取分页、查询条件相关的参数
String limit = req.getParameter("limit"); // 每页显示的记录数
String page = req.getParameter("page"); // 当前页码
String condition = (String) req.getParameter("condition"); // 查询条件(字段)
String conditionValue = (String) req.getParameter("conditionValue"); // 查询条件值
// 默认值处理:如果未传递分页参数,默认为第一页,默认每页 10 条记录
if(page == null) {
page = "1";
}
if(limit == null) {
limit = "10";
}
// 准备查询
page = "1";
}
if(limit == null) {
limit = "10";
}
// 准备 SQL 查询
Connection connection = null;
PreparedStatement pstmt = null;
PreparedStatement countPstmt = null;
ResultSet resultSet = null;
ResultSet countSet = null;
String sql = "";
String countSql = "";
String 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"; // 查询借阅记录的 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;
String msg = "error";
int count = 0;
JSONObject jsonData = new JSONObject();
JSONArray jsonArray = new JSONArray();
JSONObject jsonResult = new JSONObject();
// 进行查询
int code = 1; // 默认失败的状态码
String msg = "error"; // 默认错误信息
int count = 0; // 总记录数
JSONObject jsonData = new JSONObject(); // 存储单条借阅记录的 JSON 对象
JSONArray jsonArray = new JSONArray(); // 存储所有借阅记录的 JSON 数组
JSONObject jsonResult = new JSONObject(); // 最终返回的 JSON 对象
try {
// 获取数据库连接
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.setInt(1, (Integer.parseInt(page)-1) * Integer.parseInt(limit));
pstmt.setInt(2, Integer.parseInt(limit));
pstmt.setInt(1, (Integer.parseInt(page) - 1) * Integer.parseInt(limit)); // 设置分页的起始位置
pstmt.setInt(2, Integer.parseInt(limit)); // 设置分页的限制条数
resultSet = pstmt.executeQuery();
// 遍历查询结果,将每条借阅记录放入 JSON 数组中
while(resultSet.next()) {
jsonData.put("id", resultSet.getString("id"));
jsonData.put("card_id", resultSet.getString("card_id"));
@ -84,43 +115,46 @@ public class BorrowList extends HttpServlet {
jsonData.put("manager_id", resultSet.getString("manager_id"));
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);
countSet = countPstmt.executeQuery();
if(countSet.next()) {
count = countSet.getInt("count");
}
// 根据查询结果设置响应状态
if(!jsonArray.isEmpty()) {
code = 0;
msg = "查询成功";
}else {
} else {
code = 0;
msg = "没有数据";
}
} catch (ClassNotFoundException e) {
msg = "class没找到";
} catch (SQLException e) {
msg = "sql错误";
} finally {
try {
// 关闭数据库连接和相关资源
Base.closeResource(null, pstmt, resultSet);
Base.closeResource(connection, countPstmt, countSet);
} catch (SQLException e) {
msg = "关闭资源失败";
}
}
// 返回数据
// 构造返回的 JSON 数据
jsonResult.put("code", code);
jsonResult.put("count", count);
jsonResult.put("msg", msg);
jsonResult.put("data", jsonArray.toArray());
jsonResult.put("data", jsonArray.toArray()); // 返回的借阅记录数据
// 输出最终的 JSON 响应
PrintWriter out = resp.getWriter();
out.print(jsonResult.toString());
}
}

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

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

@ -17,64 +17,97 @@ import java.sql.Connection;
import javabean.Base;
import net.sf.json.JSONObject;
/**
* Servlet
*
* Servlet ID
*/
@WebServlet("/admin/cardEdit")
public class CardEdit extends HttpServlet {
/**
* POST
*
* ID ID
*
*
* @param req
* @param resp
* @throws ServletException Servlet
* @throws IOException I/O
*/
@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
// 设置响应内容类型为 JSON字符编码为 UTF-8
resp.setContentType("application/json; charset=utf8");
// 接受数据
// 获取传入的借阅卡参数
String id = req.getParameter("id");
String password = req.getParameter("password");
String reader = req.getParameter("reader");
String rule_id = req.getParameter("rule_id");
String status = req.getParameter("status");
// 准备资源
// 初始化数据库连接和 SQL 语句
Connection connection = null;
PreparedStatement pstmt = null;
ResultSet resultSet = null;
int result = 0;
String sql = null;
// 返回数据
// 初始化返回信息
String code = "1";
String msg = "error";
JSONObject json = new JSONObject();
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("")) {
code = "1";
msg = "参数不能为空";
}else {
} else {
// 构建更新 SQL 语句
sql = "update borrow_card set password=?, reader=?, rule_id=?, status=? where id=?";
try {
// 获取数据库连接
connection = (Connection) Base.getConnection();
// 预编译 SQL 语句并设置参数
pstmt = connection.prepareStatement(sql);
pstmt.setString(1, password);
pstmt.setString(2, reader);
pstmt.setString(3, rule_id);
pstmt.setString(4, status);
pstmt.setString(5, id);
// 执行更新操作
result = pstmt.executeUpdate();
} catch (ClassNotFoundException e1) {
msg = "错误";
msg = "数据库连接错误";
} catch (SQLException e) {
msg = "sql错误";
msg = "SQL 错误";
} finally {
try {
// 关闭数据库连接和资源
Base.closeResource(connection, pstmt, resultSet);
} catch (SQLException e) {
msg = "关闭失败";
msg = "资源关闭失败";
}
}
// 判断更新操作是否成功
if(result == 1) {
code = "0";
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,25 +18,46 @@ import net.sf.json.JSONArray;
import net.sf.json.JSONObject;
/**
* Servlet implementation class CardList
* Servlet
*
* Servlet
*/
@WebServlet("/admin/cardList")
public class CardList extends HttpServlet {
/**
* GET
*
*
*
* @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");
// 接收参数
// 接收查询参数limit, page, condition 和 conditionValue
String limit = req.getParameter("limit");
String page = req.getParameter("page");
String condition = (String) req.getParameter("condition");
String conditionValue = (String) req.getParameter("conditionValue");
String condition = req.getParameter("condition");
String conditionValue = req.getParameter("conditionValue");
// 初始化 SQL 查询条件
String where = null; // 无限制条件
// 设置默认值
if (page == null) {
page = "1";
}
if (limit == null) {
limit = "10";
}
// 初始化数据库连接和 SQL 语句
Connection connection = null;
PreparedStatement pstmt = null;
ResultSet resultSet = null;
@ -44,29 +65,41 @@ public class CardList extends HttpServlet {
String msg = "error";
int count = 0;
String sql = "";
// String countSql = ""
// 准备返回数据的 JSON 对象
JSONObject jsonObject = new JSONObject();
JSONArray jsonArray = new JSONArray();
JSONObject jsonResult = new JSONObject();
try {
// 获取数据
// 获取数据库连接
connection = (Connection) Base.getConnection();
sql = "select id,password,reader,rule_id,status from borrow_card";
// where
// 初始 SQL 查询语句
sql = "select id, password, reader, rule_id, status from borrow_card";
// 如果有查询条件,构造 where 子句
if (condition != null && conditionValue != null && !condition.isEmpty() && !conditionValue.isEmpty()) {
where = " where " + condition + " like '%" + conditionValue + "%'";
sql = sql + where;
}
// 分页
sql += " order by id desc limit ?,?";
// 构造分页查询
sql += " order by id desc limit ?,?";
pstmt = connection.prepareStatement(sql);
try {
// 设置分页参数
pstmt.setInt(1, (Integer.parseInt(page) - 1) * Integer.parseInt(limit));
pstmt.setInt(2, Integer.parseInt(limit));
} catch (NumberFormatException | SQLException e1) {
// 异常捕获,避免参数错误影响执行
}
// 执行查询
resultSet = pstmt.executeQuery();
while (resultSet.next()) {
// 构造每一条借阅卡记录的 JSON 数据
jsonObject.put("id", resultSet.getString("id"));
jsonObject.put("password", resultSet.getString("password"));
jsonObject.put("reader", resultSet.getString("reader"));
@ -74,41 +107,46 @@ public class CardList extends HttpServlet {
jsonObject.put("status", resultSet.getString("status"));
jsonArray.add(jsonObject);
}
// 获取总数
sql = "select count(*) as count from borrow_card ";
// 有限制
// 获取借阅卡总数,用于分页
sql = "select count(*) as count from borrow_card";
if (where != null) {
sql = sql + where;
}
pstmt = connection.prepareStatement(sql);
resultSet = pstmt.executeQuery();
if (resultSet.next()) {
count = resultSet.getInt("count");
}
// 判断查询结果是否为空
if (!jsonArray.isEmpty()) {
code = 0;
msg = "成功";
msg = "查询成功";
}
} catch (ClassNotFoundException e) {
msg = "没找到";
msg = "数据库连接失败";
e.printStackTrace();
} catch (SQLException e) {
msg = "sql错误";
msg = "SQL 错误";
} finally {
// 关闭数据库连接和资源
try {
Base.closeResource(connection, pstmt, resultSet);
} catch (SQLException e) {
msg = "关闭失败";
msg = "资源关闭失败";
}
}
// 构造返回的 JSON 数据
jsonResult.put("code", code);
jsonResult.put("count", count);
jsonResult.put("msg", msg);
jsonResult.put("data", jsonArray.toString());
// 输出响应
PrintWriter out = resp.getWriter();
out.print(jsonResult.toString());
// out.print("{\"code\":0,\"msg\":\"\",\"count\":\"234\",\"data\":[{\"id\":\"1\",\"password\":\"23442\",\"reader\":\"minm\",\"rule_id\":\"1\",\"status\":\"2\"}]}");
}
}

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

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

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

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

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

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

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