选题背景及意义：
随着信息技术的飞速发展，图书馆作为信息资源的集中地，其规模和复杂度也在不断扩大。传统的图书管理模式往往需要耗费大量的人力、物力和时间，而且在图书管理过程中容易出现错误和漏洞，使得图书管理效率低下，无法满足读者的需求。因此，设计和实现一个基于JavaSSM+MySQL的图书管理系统，对于提高图书馆的管理效率和服务质量，具有重要的现实意义。
本文旨在设计和实现一个基于JavaSSM+MySQL的图书管理系统，通过使用Java语言、Spring框架、SpringMVC框架、MyBatis框架和MySQL数据库等技术，实现图书管理的各项功能，包括图书信息管理、读者信息管理、借阅管理等。同时，本系统将充分考虑系统的可扩展性和可维护性，使得系统具有良好的适应性，能够满足不同图书馆的需求。
此外，本文还将对系统进行性能测试和安全测试，确保系统的稳定性和安全性。最后，我们将通过实验验证系统的可行性和有效性，为图书馆的图书管理提供更加高效、便捷的服务。
通过本文的研究，我们希望能够为图书管理领域的发展做出一定的贡献，并为图书馆提供一种更加先进、高效的图书管理解决方案。
需求分析：
功能需求：本系统应实现图书信息管理、读者信息管理、借阅管理等功能。图书信息管理包括图书的增加、修改、查询、删除等操作；读者信息管理包括读者的增加、修改、查询、删除等操作；借阅管理包括借书、还书、查询借阅记录等操作。
性能需求：本系统应具有良好的稳定性和安全性，保证系统在高负载下能够正常运行，防止黑客攻击和数据泄露。同时，系统应具有良好的可扩展性和可维护性，便于后续功能升级和优化。
其他需求：本系统应具有人性化的界面，操作简单方便，易于上手。另外，系统应具有良好的用户权限管理功能，确保不同用户只能操作其对应权限下的功能模块。
基于以上需求分析，我们可以进一步设计和实现基于JavaSSM+MySQL的图书管理系统，以提高图书管理效率和服务质量。
<%@ page contentType="text/html;charset=UTF-8" language="java"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<html>
<head>
<title>图书馆首页</title>
<link rel="stylesheet" href="../css/bootstrap.min.css">
<script src="../js/jquery-3.2.1.js"></script>
<script src="../js/bootstrap.min.js"></script>
<script src="../js/js.cookie.js"></script>
<style>
#myCarousel {
margin-left: 2%;
width: 60%;
height: 70%;
float: left;
z-index: 999;
display: inline;
}
#login {
float: left;
height: 50%;
width: 23%;
margin-left: 6%;
margin-top: 6%;
display: inline;
z-index: 999;
}
* {
padding: 0;
margin: 0;
}
</style>
<script>
$(function() {
$('#myCarousel').carousel({
interval : 2000
})
});
</script>
</head>
<body>
<c:if test="${!empty error}">
<script>
alert("${error}");
window.location.href = "login.html";
</script>
</c:if>
<h2
style="text-align: center; font-family: 'Adobe 楷体 Std R'; color: palevioletred">图
书 馆</h2>
<div style="float: right;" id="github_iframe"></div>
<!-- <script type="text/javascript" src="../js/canvas-nest.js"></script> -->
<div id="myCarousel" class="carousel slide">
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
</ol>
<div class="carousel-inner">
<div class="item active">
<img src="../images/82839-106.jpg" alt="第一张">
</div>
<div class="item">
<img src="../images/105905-106.jpg" alt="第二张">
</div>
<div class="item">
<img src="../images/296494-106.jpg" alt="第三张">
</div>
</div>
<a class="carousel-control left" href="#myCarousel" data-slide="prev">‹
</a> <a class="carousel-control right" href="#myCarousel"
data-slide="next">› </a>
</div>
<div class="panel panel-default" id="login">
<div class="panel-heading" style="background-color: #fff">
<h3 class="panel-title">请登录</h3>
</div>
<div class="panel-body">
<div class="form-group">
<label for="id">用户名</label> <input type="text" class="form-control"
id="id" placeholder="请输入用户名">
</div>
<div class="form-group">
<label for="passwd">密码</label> <input type="password"
class="form-control" id="passwd" placeholder="请输入密码">
</div>
<div class="form-group">
<label for="passwd">用户类型</label>
<!-- 以下是bootstrap的单选框的写法 -->
<div class="btn-group" id="type" data-toggle="buttons">
<label class="radio-inline"> <input type="radio"
name="optionsRadiosinline" value="0" checked> 管理员
</label> <label class="radio-inline"> <input type="radio"
name="optionsRadiosinline" value="1"> 用户
</label>
</div>
</div>
<div class="checkbox text-left">
<label> <input type="checkbox" id="remember">记住密码
</label> <a style="margin-left: 100px" href="#">忘记密码?</a>
</div>
<p style="text-align: right; color: red; position: absolute"
id="info"></p>
<br />
<button id="loginButton" class="btn btn-primary btn-block">
登陆</button>
</div>
</div>
<script>
$("#id").keyup(function() {
if (isNaN($("#id").val())) {
$("#info").text("提示:账号只能为数字");
} else {
$("#info").text("");
}
})
// 记住登录信息
function rememberLogin(username, password, checked) {
Cookies.set('loginStatus', {
username : username,
password : password,
remember : checked
}, {
expires : 30,
path : ''
})
}
// 若选择记住登录信息，则进入页面时设置登录信息
function setLoginStatus() {
var loginStatusText = Cookies.get('loginStatus')
if (loginStatusText) {
var loginStatus
try {
loginStatus = JSON.parse(loginStatusText);
$('#id').val(loginStatus.username);
$('#passwd').val(loginStatus.password);
$("#remember").prop('checked', true);
} catch (__) {
}
}
}
// 设置登录信息
setLoginStatus();
$("#loginButton").click(function() {
var id = $("#id").val();
var passwd = $("#passwd").val();
var type = $('#type input:radio:checked').val();
var remember = $("#remember").prop('checked');
if (id == '' && passwd == '') {
alter("000")
$("#info").text("提示:账号和密码不能为空");
} else if (id == '') {
alter("111")
$("#info").text("提示:账号不能为空");
} else if (passwd == '') {
alter("222")
$("#info").text("提示:密码不能为空");
} else if (isNaN(id)) {
alter("333")
$("#info").text("提示:账号必须为数字");
} else {
var data = "id=" + id + "&passwd=" + passwd;
if (type == "0") {
/*type为0就是管理员登陆 */
$.ajax({
"type" : "POST",
"url" : "../admin/login.do",
"data" : data,
"dataType" : "json",
"success" : function(json) {
if (json.state == 200) {
location.href = "admin_main.jsp";
} else if (json.state == 402) {
alert("登录失败，用户名不存在");
} else if (json.state == 403) {
alert("密码错误");
}
}
});
} else {
/*type为1就是用户登录*/
$.ajax({
"type" : "POST",
"url" : "../user/login.do",
"data" : data,
"dataType" : "json",
"success" : function(json) {
if (json.state == 200) {
location.href = "reader_main.jsp";
} else if (json.state == 402) {
alert("登录失败，用户名不存在");
} else if (json.state == 403) {
alert("密码错误");
}
}
});
}
}
})
</script>
</body>
</html>
