项目背景：
随着互联网的爆炸式发展，自中国加入WTO以来，电子商务在中国也得到了迅速的发展，现在互联网上的各种电子商务网站都在迅速增长。开发一个适合自己的二手商品交易网站，希望能为您提供便捷的服务。作为一个网购爱好者，我很同情他们。我穿的衣服，我用的工具，我用的书，生活用品和各种商品都会在一段时间后被淘汰。一些用户干脆把它们扔掉，这不仅是一种浪费，也污染了环境。还有一些用户想要出售自己的产品，但却很难找到买家，最终只能将产品卖给高端商品。因此，这种材料不能得到充分利用。为了解决这种资源的浪费，所以才开发了这个商品交易信息网站，借助互联网的低交易成本。为广大学生提供一个成本低廉、快捷高效的二手物品购买平台。
主要技术设计：spring、 springmvc、 springboot、 mybatis 、 jquery 、 md5 、bootstarp.js tomcat、富文本编译器、拦截器等
主要功能设计:登录、注册、二手商品浏览、分类设置、模糊查找、轮播图、热销商品、购物车、订单、订单流程控制、用户管理、修改密码等
用户分类查看二手物品信息 管理员可以在后台进行设置、用户可以登录个注册账号
用户登录模块主要代码设计：
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>OnlineMall-登录</title>
<link rel="stylesheet" th:href="@{mall/css/common.css}">
<link rel="stylesheet" th:href="@{mall/styles/login.css}">
<link rel="stylesheet" th:href="@{mall/styles/header.css}">
<link rel="stylesheet" th:href="@{/admin/plugins/sweetalert/sweetalert.css}"/>
</head>
<body style="background-image: url("11.jpg")">
<div class="form center">
<div class="login">
<div class="login_center">
<div class="login_top">
<div class="left fl">用户登录</div>
<div class="right fr"><a href="register.html" target="_self">立即注册</a></div>
<div class="clear"></div>
<div class="under-line center"></div>
</div>
<form id="loginForm" onsubmit="return false;" action="##">
<div class="login_main center">
<div class="login-info">手机号: <input class="login-info-input" type="text" name="loginName"
id="loginName"
placeholder="请输入你的手机号"/>
</div>
<div class="login-info">密 码: <input class="login-info-input"
id="password"
type="password"
name="password"
placeholder="请输入你的密码"/></div>
<div class="login-info">
验证码:
<input class="login-info-input verify-code" type="text" name="verifyCode"
placeholder="请输入验证码" id="verifyCode"/>
<img alt="单击图片刷新！" style="top: 14px;position: relative;" th:src="@{/common/mall/kaptcha}"
onclick="this.src='/common/mall/kaptcha?d='+new Date()*1">
</div>
</div>
<div class="login_submit">
<input class="submit" type="submit" onclick="login()" value="立即登录">
</div>
</form>
</div>
</div>
</div>
</body>
<!-- jQuery -->
<script th:src="@{/admin/plugins/jquery/jquery.min.js}"></script>
<script th:src="@{/admin/dist/js/public.js}"></script>
<script th:src="@{/admin/plugins/sweetalert/sweetalert.min.js}"></script>
<script type="text/javascript">
function login() {
var loginName = $("#loginName").val();
if (!validPhoneNumber(loginName)) {
swal('请输入正确的登录名(即手机号)', {
icon: "error",
});
return false;
}
var password = $("#password").val();
if (!validPassword(password)) {
swal('请输入正确的密码格式(6-20位字符和数字组合)', {
icon: "error",
});
return false;
}
var verifyCode = $("#verifyCode").val();
if (!validLength(verifyCode, 7)) {
swal('请输入正确的验证码', {
icon: "error",
});
return false;
}
//验证
var params = $("#loginForm").serialize();
var url = '/login';
$.ajax({
type: 'POST',//方法类型
url: url,
data: params,
success: function (result) {
if (result.resultCode == 200) {
window.location.href = '/index';
} else {
swal(result.message, {
icon: "error",
});
}
;
},
error: function () {
swal("操作失败", {
icon: "error",
});
}
});
}
</script>
</html>