Compare commits

...

26 Commits

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