一、系统简介
本项目采用eclipse工具开发,jsp+servlet+jquery+layui技术编写,数据库采用的是mysql,navicat开发工具。
系统一共分为4个角色分别是:管理员,会员,工作人员,教练
二、模块简介
管理员
1、登录
教练
1、登录
2、个人信息管理
3、预约管理
4、公告管理
会员
1、登录注册
2、查看教练
3、运动器材管理
4、健身项目管理
5、预约记录管理
6、查看公告
工作人员
1、登录
2、个人信息管理
3、器材分类管理
4、运动器材管理
5、健身项目管理
6、器材损坏管理
7、公告管理
项目简介:
难度等级:✩✩✩
用户类型:三角色(管理员,会员,工作人员,教练)
设计模式:MVC
项目架构:B/S架构
开发语言:Java语言
前端技术:layui、HTML、CSS、JS、JQuery等
后端技术:JSP、servlet框架
运行环境:Windows7或10、JDK1.8
运行工具:本系统采用Eclipse开发,仅支持Eclipse运行,不支持MyEclipse和IDEA运行,因为三者的骨架不一样,强行导入打开运行可能会导致出现未知的错误。(如若想用idea运行,需要转换!!!!)
数 据 库:MySQL5.5/5.7/8.0版本
运行服务器:Tomcat7.0/8.0/8.5/9.0等版本
是否基于Maven环境:否
是否采用框架:是
数据库表数量:10张表
JSP页面数量:30多张
是否有分页:有分页
项目截图
项目结构
数据库
登录注册
教练信息管理
会员管理
工作人员
公告管理
器材管理
器材分类
器材损坏
相关代码
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<!DOCTYPE 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,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title>健身房管理系统</title>
<link href="resource/css/bootstrap.min.css" rel="stylesheet">
<link href="resource/css/a3common.css" rel="stylesheet">
<link rel="stylesheet" href="resource/css/login.css">
<link rel="stylesheet" href="resource/css/font_43459_lbtux0zjkr6yldi.css">
</head>
<div id="main" class="main-warp">
<div class="main-content">
<div class="formDiv">
<h2 class="text-center">登录</h2>
<form id="loginForm" action="LoginServlet?action=login" method="post">
<div class="dataform" >
<div class="input-warp gap">
<span class="input-icon iconfont icon-yonghu1"></span>
<input id="userName" name="username" type="text" class="inputs" placeholder="手机号码或登录账号" maxlength="64">
</div>
<span id="userNameErr" style="color:red" >${message}</span>
<div class="input-warp gap">
<span class="input-icon iconfont icon-baomi"></span>
<input class="inputs" type="password" name="pwd" placeholder="密码" id="pwd" maxlength="20">
</div>
<div class=" gap">
<span class="input-icon ">角色</span>
<select name="type" class="select">
<option value="1">管理员</option>
<option value="2">会员</option>
<option value="3">工作人员</option>
<option value="4">教练</option>
</select>
</div>
<!-- input type="radio" name="type" id="type" value="1" title="管理员" checked>管理员
<input type="radio" name="type" id="type" value="2" title="会员" > 会员
<input type="radio" name="type" id="type" value="3" title="工作人员" > 工作人员
<input type="radio" name="type" id="type" value="4" title="教练" > 教练 -->
<div class="btn-warp gap">
<div class="text-center">
<button type="submit" id="btnLogin" class="btn btn-block lgbtn blue">登录</button>
</div>
</div>
<div class="gap">
<div class="pull-right" style="margin-top: 6px">
|<a href="LoginServlet?action=toRegister" class="link">新会员注册</a></div>
<div class="pretty-box">
</div>
</div>
<div class="biggap third-party-title">
<h5 class="text-center"><span>第三方账号登录</span></h5>
</div>
<div class="third-auth">
<a title="用钉钉登录" class="dt" href="javascript:;"></a>
<a title="用微信账户登录" class="wx" href="javascript:;"></a>
<a title="用QQ账户登录" class="qq" href="javascript:;"></a>
</div>
</div>
</form>
</div>
</div>
</div>
<style>
.copyrights{text-indent:-9999px;height:0;line-height:0;font-size:0;overflow:hidden;}
</style>
<div class="copyrights" id="links20210126">
Collect from <a href="http://www.cssmoban.com/" title="网站模板">模板之家</a>
<a href="https://www.chazidian.com/" title="查字典">查字典</a>
</div>
<script src="resource/component/layui/layui.js"></script>
<script src="resource/component/pear/pear.js"></script>
<script>
layui.use(['layer', 'form','jquery'], function(){
var form = layui.form,
layer = layui.layer,
$= layui.jquery;
form.render();//这句一定要加,占坑
$("#btnLogin").on("click", function() {
var userName = $("#userName").val().trim(); // trim()去除空格
var password = $("#pwd").val().trim();
var type = $("#type").val();
if(userName == ""){
layer.msg('用户名或者手机号不能为空!');
return false;
}
if(password == ""){
layer.msg('密码不能为空!');
return false;
}
if(type == ""){
layer.msg('请选择角色!');
return false;
}
});
setTimeout(function(){ $("#userNameErr").html("")},3000);
}
});
</script>
</body>
</html>
/**
* 登录
* @param request
* @param response
*/
private void login(HttpServletRequest request, HttpServletResponse response) {
// TODO Auto-generated method stub
removeAll(request,response);
String userName = request.getParameter("username");
String password = request.getParameter("pwd");
String type = request.getParameter("type");
if(type.equals("1")){
Admin admin = new Admin();
admin.setUsername(userName);
admin.setPwd(password);
Admin admin1 = service.selectAdmin(admin);
try {
if (admin1 == null){
request.setAttribute("message", "管理员用户不存在或者密码错误");
request.getRequestDispatcher("/WEB-INF/views/login.jsp").forward(request, response);
}else {
request.getSession().setAttribute("admin",admin1);
request.getSession().setAttribute("flag",1);
request.getRequestDispatcher("/WEB-INF/views/main.jsp").forward(request, response);
}
} catch (Exception e) {
e.printStackTrace();
}
}else if(type.equals("2")){
User user = new User();
user.setPhone(userName);
user.setPwd(password);
User user1 = service.selectUser(user);
try {
if (user1 == null){
request.setAttribute("message", "会员不存在或者密码错误");
request.getRequestDispatcher("/WEB-INF/views/login.jsp").forward(request, response);
}else {
request.getSession().setAttribute("user",user1);
request.getSession().setAttribute("flag",2);
request.getRequestDispatcher("/WEB-INF/views/main.jsp").forward(request, response);
}
} catch (Exception e) {
e.printStackTrace();
}
}else if(type.equals("3")){
Gzry gzry = service.selectGzry(userName,password);
try {
if (gzry == null){
request.setAttribute("message", "工作人员不存在或者密码错误");
request.getRequestDispatcher("/WEB-INF/views/login.jsp").forward(request, response);
}else {
request.getSession().setAttribute("gzry",gzry);
request.getSession().setAttribute("flag",3);
request.getRequestDispatcher("/WEB-INF/views/main.jsp").forward(request, response);
}
} catch (Exception e) {
e.printStackTrace();
}
}else if(type.equals("4")){
Coach coach = service.selectCoach(userName,password);
try {
if (coach == null){
request.setAttribute("message", "教练不存在或者密码错误");
request.getRequestDispatcher("/WEB-INF/views/login.jsp").forward(request, response);
}else {
request.getSession().setAttribute("coach",coach);
request.getSession().setAttribute("flag",4);
request.getRequestDispatcher("/WEB-INF/views/main.jsp").forward(request, response);
}
} catch (Exception e) {
e.printStackTrace();
}
}else{
request.setAttribute("message", "账号不存在或者密码错误");
try {
request.getRequestDispatcher("/WEB-INF/views/login.jsp").forward(request, response);
} catch (Exception e) {
e.printStackTrace();
}
}
}
注册
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>
<!DOCTYPE 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,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title>注册界面 </title>
<link href="<%=path %>/resource/css/bootstrap.min.css" rel="stylesheet">
<link href="<%=path %>/resource/css/a3common.css" rel="stylesheet">
<link rel="stylesheet" href="<%=path %>/resource/css/login.css">
<link rel="stylesheet" href="<%=path %>/resource/css/font_43459_lbtux0zjkr6yldi.css">
</head>
<body>
<div id="main" class="main-warp">
<div class="main-content">
<div class="formDiv">
<h2 class="text-center">会员注册</h2>
<form id="loginForm" method="post" action="UserServlet?action=adduser">
<div class="dataform" >
<div class="error-content">
<span style="color: red">${msg}</span>
<span id="msg" style="color: red" ></span>
</div>
<div class="input-warp gap">
<span class="input-icon iconfont "> 姓名:</span>
<input class="inputs" type="text" name="realname" id="realname" placeholder="请输入姓名"maxlength="20">
</div>
<div class="input-warp gap">
<span class="input-icon iconfont ">手机号:</span>
<input id="phone" name="phone" type="text" class="inputs" placeholder="请输入手机号" maxlength="64">
</div>
<div class="input-warp gap">
<span class="input-icon iconfont ">密码:</span>
<input class="inputs" type="text" name="pwd" placeholder="请输入密码" id="pwd" maxlength="20">
</div>
<div class="input-warp gap">
<span class="input-icon iconfont ">年龄:</span>
<input class="inputs" type="text" name="age" id="age" placeholder="请输入年龄" maxlength="20">
</div>
<div class="input-warp gap">
<span class="input-icon iconfont "> 昵称:</span>
<input class="inputs" type="text" name="nickname" id="nickname" placeholder="请输入昵称" maxlength="20">
</div>
<div class=" gap">
<span class="input-icon ">性别</span>
<select name="sex" class="select">
<option value="男">男</option>
<option value="女">女</option>
</select>
</div>
<div class="error-content">
<span id="passwordErr" class="errMsg"></span>
</div>
<div class="btn-warp gap">
<div class="text-center">
<input type="hidden" value="jsform" id="_app"/>
<button type="submit" id="registe" class="btn btn-block lgbtn blue">确认注册</button>
</div>
</div>
<div class="gap">
<div class="pull-right" style="margin-top: 6px"><a href="LoginServlet?action=LoginOutAct" class="link">返回登录</a></div>
</div>
<div class="biggap third-party-title">
<br>
</div>
</div>
</form>
</div>
</div>
</div>
<style>
.copyrights{text-indent:-9999px;height:0;line-height:0;font-size:0;overflow:hidden;}
</style>
<div class="copyrights" id="links20210126">
Collect from <a href="http://www.cssmoban.com/" title="网站模板">模板之家</a>
<a href="https://www.chazidian.com/" title="查字典">查字典</a>
</div>
<script src="<%=path%>/resource//js/jquery-1.8.0.min.js"></script>
<script>
$(function () {
$("#registe").click(function() {
var stuno = $("#stuno").val(); // trim()去除空格
var realname = $("#realname").val(); // trim()去除空格
var pwd = $("#pwd").val();
var confirmPwd = $("#confirmPwd").val();
var bj = $("#bj").val();
var major = $("#major").val();
var phone = $("#phone").val();
/*
if(!stuno) {
$("#msg").html("学号不能为空!");
$("#stuno").focus(); // 聚焦
return false;
}else if(!realname){
$("#msg").html("真实姓名不能为空!");
$("#realname").focus(); // 聚焦
return false;
}else if(!pwd){
$("#msg").html("密码不能为空!");
$("#pwd").focus(); // 聚焦
return false;
}
else if(!confirmPwd){
$("#msg").html("确认密码不能为空!");
$("#confirmPwd").focus(); // 聚焦
return false;
} else if(pwd != confirmPwd){
$("#msg").html("密码和确认密码不一致!");
$("#pwd").focus(); // 聚焦
return false;
}else if(!major){
$("#msg").html("专业不能为空!");
$("#major").focus(); // 聚焦
return false;
}else if(!bj){
$("#msg").html("班级不能为空!");
$("#bj").focus(); // 聚焦
return false;
}else if(!(/^\d{5}$/).test(stuno)){
$("#msg").html("学号只能为五位数字!");
$("#stuno").focus(); // 聚焦
return false;
}else if(!(/^[a-zA-Z\u4e00-\u9fa5]+$/.test(realname))){
$("#msg").html("真实姓名只能为中文!");
$("#realname").focus(); // 聚焦
return false;
}else if(!(/^1[34578]\d{9}$/.test(phone))){
$("#msg").html("手机号码格式不正确!");
$("#phone").focus(); // 聚焦
return false;
} */
});
});
</script>
</body>
</html>