一、系统简介
本项目采用idea工具开发，jsp+spring+spring-mvc+mybatis+jquery技术编写，数据库采用的是mysql，navicat开发工具。
系统一共分为2个角色分别是：管理员，用户
二、模块简介
管理员
1、登录
2、商品管理
3、订单管理
4、轮播图管理
5、评论管理
6、分类管理
7、个人信息管理
8、统计管理
用户
1、登录注册
2、个人信息管理
3、浏览网站
4、查看商品详情
5、加入购物车
6、地址信息管理
7、下单商品，退货,签收等
8、订单历史记录查询
9、评论商品
项目简介
难度等级：✩✩
用户类型：2角色（管理员，用户）
设计模式：MVC
项目架构：B/S架构
开发语言：Java语言
前端技术：HTML、CSS、JS、JQuery等
后端技术：JSP、ssm框架
运行环境：Windows7或10、JDK1.8
运行工具：本系统采用idea开发，仅支持idea运行，不支持MyEclipse和eclipse运行，因为三者的骨架不一样，强行导入打开运行可能会导致出现未知的错误。
数 据 库：MySQL5.5/5.7/8.0版本
运行服务器：Tomcat7.0/8.0/8.5/9.0等版本
是否基于Maven环境:否
是否采用框架：是
数据库表数量：15张表
JSP页面数量：30多张
是否有分页：有分页
相关截图
相关代码
登录
<%@ page contentType="text/html;charset=UTF-8" language="java"
pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<head>
<base href="<%=basePath%>">
<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>
<link href="resources/css/style.css" rel="stylesheet">
<link href="resources/css/layui.css" rel="stylesheet">
<link href="resources/css/admin.css" rel="stylesheet">
<link href="resources/css/pro.css" rel="stylesheet">
<link href="resources/css/login.css" rel="stylesheet">
<script src="resources/js/jquery.min.js" type="text/javascript"></script>
<script src="resources/js/layui.js" type="text/javascript"></script>
<style type="text/css">
</style>
</head>
<body>
<!--导航栏部分-->
<jsp:include page="userview/include/header.jsp" />
<!-- 中间内容 -->
<div class="container-fluid">
<form id="loginForm">
<div class="layadmin-user-login layadmin-user-display-show" style="padding-bottom:0px;padding-top:50px;height:250px;"
id="LAY-user-login">
<div class="layadmin-user-login-main" style="height:200px;">
<div class="layadmin-user-login-box layadmin-user-login-header">
<h2>用户登录</h2>
</div>
<div
class="layadmin-user-login-box layadmin-user-login-body layui-form" style="height:100px;">
<div class="layui-form-item">
<label
class="layadmin-user-login-icon layui-icon layui-icon-username"
for="LAY-user-login-username"></label> <input type="text"
name="userName" id="userName"
lay-verify="required" placeholder="用户名"
class="layui-input layui-form-danger">
</div>
<div class="layui-form-item">
<label
class="layadmin-user-login-icon layui-icon layui-icon-password"
for="LAY-user-login-password"></label> <input type="password"
name="userPass" id="userPass"
lay-verify="required" placeholder="密码" class="layui-input">
</div>
<div class="layui-row">
<div class="layui-col-xs7">
<!-- <label class="layadmin-user-login-icon layui-icon layui-icon-vercode" for="LAY-user-login-vercode"></label> -->
<input type="text" name="verifycode" id="verifycode" lay-verify="required" placeholder="图形验证码" class="layui-input">
</div>
<div class="layui-col-xs5">
<%-- <a href="javascript:refreshCode();">
<img src="${pageContext.request.contextPath}/CheckCodeServlet" title="看不清点击刷新" id="vcode"/>
</a> --%>
<div style="margin-left: 10px;">
<a href="javascript:refreshCode();">
<img src="${pageContext.request.contextPath}/view/checkcode" class="layadmin-user-login-codeimg" id="vcode"></a>
</div>
</div>
</div>
<br>
<div class="layui-form-item">
<button class="layui-btn layui-btn-fluid" type="button" lay-submit=""
lay-filter="loginSubmit">登录</button>
</div>
</div>
</div>
</div>
</form>
</div>
<div style="margin-top: 100px"> </div>
<!--尾部-->
<jsp:include page="userview/include/foot.jsp" />
<script type="text/javascript">
function refreshCode(){
//1.获取验证码图片对象
var vcode = document.getElementById("vcode");
//2.设置其src属性，加时间戳
vcode.src = "${pageContext.request.contextPath}/view/checkcode?time="+new Date().getTime();
}
layui.use(['form','layer'], function() {
var form = layui.form;
var layer=layui.layer;
form.on('submit(loginSubmit)',function(){
$.ajax({
type:"post",
url:"user/login",
data:$("#loginForm").serialize(),
success:function(data){
if(data=="success"){
layer.msg("登录成功！",{icon:1,anim:2,time:2000},function(){
window.location.href="view/index";
});
}else if(data=="codeError"){
layer.msg("验证码错误！",{icon:1,anim:2,time:2000});
}else{
layer.msg("登录失败！请检查用户名和密码后重试！",{icon:5,anim:6,time:1000} );
}
}
});
});
});
</script>
</body>
</html>
@RequestMapping("login")
@ResponseBody
public String login(String userName, String userPass, HttpServletRequest request) {
Users user = userService.login(userName, MD5Utils.passToMD5(userPass));
String verifycode = request.getParameter("verifycode");
//3.验证码校验
HttpSession session = request.getSession();
String checkcode_server = (String) session.getAttribute("CHECKCODE_SERVER");
//session.removeAttribute("CHECKCODE_SERVER");//确保验证码一次性
if(!checkcode_server.equalsIgnoreCase(verifycode)){
//验证码不正确
//提示信息
return "codeError";
}
if (user != null) {
session.setAttribute("user", user);
return "success";
}
return "fail";
}