⽤eclipse实现电商平台系统
(SpringBoot+Thymeleaf+MyBatis)
1.开发⼯具:eclipse、Spring Boot+Thymeleaf + MyBatis、MySQL8.0
2.项⽬功能:
游客浏览商品,注册⽤户浏览商品,管理员后台增删改查商品
商品类型(goodstype)的增删查
商品(goodstable)的增删改查
后台顾客信息的删除,注册界⾯顾客的添加
查看或加⼊购物车,查看或加⼊收藏夹,查看或加⼊⽤户个⼈订单,查看⽤户个⼈信息。
3.其他功能
后台上传前台商品照⽚到mysql,前台验证码登录,异常界⾯处理,商品关键字搜索,前台轮播图展⽰,后台设置前台的推荐商品栏,后台设置前台的新添加商品栏,后台使⽤分页查询,前台模拟订单⽀付。
4.数据库表
在MySQL8中创建数据库shop1
创建8张与系统相关的数据表: ausertable 、busertable、carttable、focustable、goodstable、goodstype、orderdetail和orderbasetable.
⼀、eclipse中新建spring boot项⽬。
⼆、建⽴如下项⽬⽬录的⽂件。
1.1.1系统设计
电⾯务平台分为两个⼦系统,⼀是后台管理⼦系统, ⼆是前台电⼦商务⼦系统,下⾯分别说明这两个⼦系统的功能需求与模块划分。
1.1.1系统功能需求
1、后台管理⼦系统
后台管理⼦系统要求管理员登录成功后,才能对商品进⾏管理,包括添加商品、查询商品、修改商品以及删除商品。除商品管理外,管理员还需要对商品类型、注册⽤户以及⽤户的订单等进⾏管理。
2、前台电⼦商务⼦系统
1)⾮注册⽤户
⾮注册⽤户或未登录⽤户具有的功能如下:浏览⾸页、查看商品详情以及搜索商品。
2)⽤户
成功登录的⽤户除具有未登录⽤户具有的功能外,还具有购买商品、查看购物车、收藏商品、查看订
单、查看收藏以及查看⽤户个⼈信息的功能。
三、编写HTML代码
addGood.html
1<!DOCTYPE html>
2<html xmlns:th="">
3<head>
4<meta charset="UTF-8">
5<title>商品类型添加页⾯</title>
6<link rel="stylesheet" th:href="@{/css/bootstrap.min.css}" />
7<body>
8 <div th:include="admin/header"></div>
9 <br><br><br>
10 <div class="container">
11  <div class="bg-primary"  >
12        <h3 align="center">添加商品</h3>
13    </div><br>
14  <form th:action="@{/goods/addGoods?act=add}"
15  name="myform" method="post"
16  th:object="${goods}"
17  class="form-horizontal"
18  enctype="multipart/form-data" >
19  <div class="form-group has-success">
20    <label class="col-sm-2 col-md-2 control-label">商品名称</label>
21    <div class="col-sm-4 col-md-4">
21    <div class="col-sm-4 col-md-4">
22    <input type="text" class="form-control"
23      placeholder="请输⼊商品名"
24    th:field="*{gname}"/>
25    </div>
26  </div>
27  <div class="form-group has-success">
28    <label class="col-sm-2 col-md-2 control-label">商品原价</label>
29    <div class="col-sm-4 col-md-4">
30    <input type="number" class="form-control"
31      placeholder="请输⼊商品原价"
32    th:field="*{goprice}"/>
33    </div>
34  </div>
35  <div class="form-group has-success">
36    <label class="col-sm-2 col-md-2 control-label">商品折扣价</label>
37    <div class="col-sm-4 col-md-4">
38    <input type="number" class="form-control"
39      placeholder="请输⼊商品折扣价"
40    th:field="*{grprice}"/>
41    </div>
42  </div>
43  <div class="form-group has-success">
44    <label class="col-sm-2 col-md-2 control-label">商品库存</label>
45    <div class="col-sm-4 col-md-4">
46    <input type="number" class="form-control"
47      placeholder="请输⼊商品库存"
48    th:field="*{gstore}"/>
49    </div>
50  </div>
51  <div class="form-group has-success">
52      <label class="col-sm-2 col-md-2 control-label">商品图⽚</label>
53      <div class="col-sm-4 col-md-4">
54        <input type="file" placeholder="请选择商品图⽚"  class="form-control" name="fileName"/>
55      </div>thymeleaf用法
56    </div>
57  <div class="form-group has-success">
58    <label class="col-sm-2 col-md-2 control-label">是否推荐</label>
59    <div class="col-sm-4 col-md-4 radio">
60    <label>
61      <input type="radio" th:field="*{isRecommend}" value="1">是
62    </label>
63    <label>
64      <input type="radio"  th:field="*{isRecommend}" value="0">否
65    </label>
66    </div>
67  </div>
68  <div class="form-group has-success">
69    <label class="col-sm-2 col-md-2 control-label">是否⼴告</label>
70    <div class="col-sm-4 col-md-4 radio">
71    <label>
72      <input type="radio" th:field="*{isAdvertisement}" value="1">是
73    </label>
74    <label>
75      <input type="radio"    th:field="*{isAdvertisement}"s  value="0">否
76    </label>
77    </div>
78  </div>
79  <div class="form-group has-success">
80    <label class="col-sm-2 col-md-2 control-label">商品类型</label>
81    <div class="col-sm-4 col-md-4">
82    <select class="form-control" th:field="*{goodstype_id}">
83                        <option th:each="gty:${goodsType}" th:value="${gty.id}" th:text="${pename}">
84    </select>
85    </div>
86  </div>
86  </div>
87  <div class="form-group">
88    <div class="col-sm-offset-2 col-sm-10">
89    <button type="submit"class="btn btn-success" >添加</button>
90    <button type="reset" class="btn btn-primary" >重置</button>
91    </div>
92  </div>
93  </form>
94 </div>
95</body>
96</html>
addType.html
1<!DOCTYPE html>
2<html xmlns:th="">
3<head>
4<meta charset="UTF-8">
5<title>商品类型添加页⾯</title>
6<link rel="stylesheet" th:href="@{/css/bootstrap.min.css}" />
7<body>
8 <div th:include="admin/header"></div>
9 <br><br><br>
10 <div class="container">
11  <div class="bg-primary"  >
12        <h3 align="center">添加类型</h3>
13    </div><br>
14  <form th:action="@{/type/addType}" name="myform" method="post" th:object="${goodsType}"  class="form-horizontal" role="form" >
15  <div class="form-group has-success">
16    <label class="col-sm-2 col-md-2 control-label">类型名称</label>
17    <div class="col-sm-4 col-md-4">
18    <input type="text" class="form-control"
19      placeholder="请输⼊类型名"
20    th:field="*{typename}"/>
21    </div>
22  </div>
23  <div class="form-group">
24    <div class="col-sm-offset-2 col-sm-10">
25    <button type="submit"class="btn btn-success" >添加</button>
26    <button type="reset" class="btn btn-primary" >重置</button>
27    </div>
28  </div>
29  </form>
30 </div>
31</body>
32</html>
allOrder.html
1<!DOCTYPE html>
2<html xmlns:th="">
3<head>
4<base th:href="@{/}">
5<meta charset="UTF-8">
6<title>主页</title>
7<link rel="stylesheet" href="css/bootstrap.min.css" />
8</head>
9<body>
10 <!-- 加载header.html -->
11 <div th:include="admin/header"></div>
12 <br><br><br>
13 <div class="container">
14  <div class="panel panel-primary">
15  <div class="panel-heading">
16    <h3 class="panel-title">订单列表</h3>
17  </div>
18  <div class="panel-body">
19    <div class="table table-responsive">
20    <table class="table table-bordered table-hover">
21      <tbody class="text-center">
22      <tr>
23        <th>订单ID</th>
24        <th>⽤户邮箱</th>
25        <th>订单⾦额</th>
26        <th>订单状态</th>
27        <th>下单⽇期</th>
28      </tr>
29      <tr th:each="ao:${allOrders}">
30        <td th:text="${ao.id}"></td>
31        <td th:text="${ao.bemail}"></td>
32        <td th:text="${ao.amount}"></td>
33        <td th:text="(${ao.status} == 1)?'已⽀付':'未⽀付'"></td>
34        <td th:text="${ao.orderdate}"></td>
35      </tr>
36      <tr>
37        <td colspan="5" align="right">
38        <ul class="pagination">
39          <li><a>第<span th:text="${currentPage}" ></span>页</a></li>
40          <li><a>共<span th:text="${totalPage}" ></span>页</a></li>
41          <li>
42          <span th:if="${currentPage} != 1" >
43            <a th:href="@{selectOrder?currentPage=${currentPage - 1}}">上⼀页</a>
44          </span>
45          <span th:if="${currentPage} != ${totalPage}" >
46            <a th:href="@{selectOrder?currentPage=${currentPage - 1}}">下⼀页</a>
47          </span>
48          </li>
49        </ul>
50        </td>
51      </tr>
52      </tbody>
53    </table>
54    </div>
55  </div>
56  </div>
57 </div>
58</body>
59</html>
allUser.html
1<!DOCTYPE html>

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。