基于springboot的购物商城管理系统

到山东找蓝翔

发布日期: 2021-09-13 08:14:23 浏览量: 119
评分:
star star star star star star star star star star_border
*转载请注明来自write-bug.com

1.项目简介

1.1 用户简介

用户主要分为管理员和用户端:

  • 管理员: 管理员可以对后台数据进行管理、拥有最高权限、具体权限有登录后进行首页轮播图的配置管理、商品的配置、新品家具商城的配置管理、、家具商城分类管理配置、家具商城详情商品管理、用户管理、订单管理以及、修改密码等操作

  • 客户端用户:用户输入家具商城网站系统地址、可以浏览家具商城信息、需要查看详情或其他购买加入购物车等操作需要用户进行登录、,没有账号的用户可以进行注册操作、输入相关注册信息完成注册后登录。登录完成后可以进行商品的购买、商品查询、加入购物车、修改收货地址等一系列操作

1.2 技术栈

主要技术实现:spring、 springboot、 mybatis 、 jquery 、 md5 、bootstarp.js tomcat、富文本编译器、拦截器等

1.3 功能模块

1.3.1 前端用户

  • 用户注册和登录登录功能

    • 用户的注册功能 : 访问网站的人根据网站的提示注册自己的账户
    • 用户的登录功能 : 用户可以输入用户名和密码进行登录操作,当没有该账户的时 候,提示错误,用户必须通过注册完成或者从数据库中获取才能进行会员权限级别的操 作。登录成功之后可以购买商品,查询订单的详细信息
  • 个人信息的管理

    • 用户信息的修改操作,其中包括会员名、密码、性别、联系方式 e-mail 和个人介 绍等用户信息的修改操作。但是会员邮箱是绑定账号的,会员邮箱不能进行更改操作
    • 订单管理操作:订单只能查询和删除操作,不能有修改操作,修改操作是属于管理员的权限
    • 用户退出操作:当点击用户退出时,就会退出当前用户的登录状态,恢复到游客状态
  • 商品的操作

    • 搜索商品操作: 当在 Search 栏输入想搜索的家居用品时, 会使用模糊查询, 搜索 出客户想到查询的家居用品
    • 商品列表展示
    • 商品详细信息展示
    • 购物车的管理操作
    • 显示商品信息:当我们一进入购物车页面,就会显示出商品的详细信息,以及购 物车界面的功能信息
    • 修改商品的数量:用户可以自己输入不同数量的商品,当商品的数量变动时,商 品的库存就会相应的减少,也会根据商品的数量得到购买这一种商品的金额小计
    • 删除购物车中的商品
    • 购物流程变动
  • 订单管理操作

    • 订单生成:进入结算中心,会提示用户已经登录成功并来到结算中心,然后在提 交订单的时候生成了一份订单,会显示在确认订单页面
    • 确认订单:当点击确认订单的时候会进入支付页面,那里会真正的付款操作
    • 订单查询:在我的订单页面会显示订单的详细信息,我们可以查询我们想要的订单信息
    • 订单管理:在我的订单页面会显示所有订单的信息,可以在那里删除订单,查询 订单等

1.3.2 后台管理员

系统的后台是专门为管理家居商城系统的人员设计的,功能如下:

  • 超级管理员:拥有管理该系统的最大权限,他有两个特有的功能

    • 数据字典:可以对后台的不同分类的分类列表具有增删改查的操作
    • 角色管理:将拥有不同权限的管理员分成不同的角色,每个不同角色有自己的权限,不能执行越权操作
  • 商品分类的管理

    • 添加编辑分类:点击添加按钮,会跳转到分类添加页面,需要编写分类名称,分类描述信息
    • 删除分类:当点击删除按钮时,会弹出一个提醒框,当点击确定,删除分类,点击取消,保持原来不变
  • 商品管理功能

    • 查询商品 : 查询所有商品列表, 还有通过商品的名称、 商品的类别和价格区间查询
    • 添加修改商品 : 点击添加商品会转到添加商品页面, 需要提供商品名称、 商品图片、商 5 6 品类别、商品价格、库存数量、商品描述等内容
    • 删除商品:删除商品

2.数据库设计

2.1 表结构

用户表

收货地址表

购物车表

分类表

评论表

商品表

订单详情表

产品信息表

2.2 E-R图

3.项目实现

3.1 业务代码

  1. /**
  2. * 后台管理登录验证
  3. */
  4. @PostMapping("login")
  5. @ResponseBody
  6. public Map<String,Object> login(User user, String verity, HttpSession session){
  7. Map<String, Object> map = new HashMap<String, Object>();
  8. String adminLogin = session.getAttribute("adminLogin")+"";
  9. if (!adminLogin.toUpperCase().equals(verity.toUpperCase())){
  10. map.put("state", "error");
  11. map.put("msg", "验证码输入错误,请重新输入");
  12. return map;
  13. }
  14. return userAdminService.Login(user,session,verity);
  15. }
  16. @PostMapping("upload")
  17. @ResponseBody
  18. public String upload(MultipartFile file){
  19. String filename = file.getOriginalFilename();
  20. String name = filename.substring(filename.lastIndexOf(".") + 1, filename.length());
  21. String s = UUID.randomUUID().toString();
  22. File filepath = new File("D:\\work\\ideaprojects\\gitAdmin\\shop\\upload\\"+s+"."+name);
  23. try {
  24. file.transferTo(filepath);
  25. } catch (IOException e) {
  26. e.printStackTrace();
  27. return null;
  28. }
  29. return "http://image.shop.com/"+s+"."+name;
  30. }
  31. @PostMapping("update")
  32. @ResponseBody
  33. public String update(User user){
  34. return userAdminService.update(user);
  35. }
  36. @GetMapping("delete")
  37. @ResponseBody
  38. public String delete(Long id){
  39. Integer delete = userAdminService.delete(id);
  40. if (delete>0){
  41. return "ok";
  42. }
  43. return "error";
  44. }
  45. @PostMapping("save")
  46. @ResponseBody
  47. public String save(User user){
  48. Integer save = userAdminService.save(user);
  49. if (save>0){
  50. return "ok";
  51. }
  52. return "error";
  53. }
  1. public Map<String, Object> reg(User user) {
  2. //初始化返回参数
  3. Map<String, Object> map = new HashMap<String, Object>();
  4. //初始化查询参数
  5. User us = new User();
  6. //根据用户名查询该用户是否存在
  7. us.setUsername(user.getUsername());
  8. if (userDao.selectOne(us) != null) {
  9. map.put("state", "error");
  10. map.put("msg", "该用户已存在,请重新注册");
  11. return map;
  12. }
  13. //使用md5加密密码
  14. user.setPassword(DigestUtils.md5DigestAsHex(user.getPassword().getBytes()));
  15. //添加默认值
  16. user.setRole("普通用户");
  17. user.setHeader_url("img/txs.jpg");
  18. user.setCreated(new Date());
  19. user.setUpdated(new Date());
  20. userDao.insertSelective(user);
  21. map.put("state", "success");
  22. return map;
  23. }
  24. public Map<String, Object> login(User user, HttpSession session) {
  25. //初始化返回参数
  26. Map<String, Object> map = new HashMap<String, Object>();
  27. user.setPassword(DigestUtils.md5DigestAsHex(user.getPassword().getBytes()));
  28. User selectOne = userDao.selectOne(user);
  29. if (selectOne==null) {
  30. map.put("state", "error");
  31. map.put("msg", "用户名或者密码输入错误,请重新输入");
  32. return map;
  33. }
  34. map.put("state", "success");
  35. Cart cart = new Cart();
  36. cart.setUid(selectOne.getId());
  37. user.setCartList(cartService.queryByGidUid(null,selectOne.getId()));
  38. System.out.println(user.getCartList());
  39. Address address = new Address();
  40. address.setUserId(selectOne.getId());
  41. selectOne.setAddress(addressDao.selectOne(address));
  42. session.setAttribute("portalUser",selectOne);
  43. return map;
  44. }
  45. public User update(User user) {
  46. userDao.updateByPrimaryKeySelective(user);
  47. return userDao.selectByPrimaryKey(user.getId());
  48. }
  49. public User upload(MultipartFile file,Long id) {
  50. String filename = file.getOriginalFilename();
  51. try {
  52. String name = filename.substring(filename.lastIndexOf(".") + 1, filename.length());
  53. String s = UUID.randomUUID().toString();
  54. file.transferTo(new File("D:\\work\\ideaprojects\\gitAdmin\\shop\\upload\\"+s+"."+name));
  55. User user = new User();
  56. user.setHeader_url("http://image.shop.com/"+s+"."+name);
  57. user.setId(id);
  58. userDao.updateByPrimaryKeySelective(user);
  59. } catch (IOException e) {
  60. e.printStackTrace();
  61. }
  62. return userDao.selectByPrimaryKey(id);
  63. }
  64. public void changePassword(User user) {
  65. user.setPassword(DigestUtils.md5DigestAsHex(user.getPassword().getBytes()));
  66. userDao.updateByPrimaryKeySelective(user);
  67. }
  68. public User queryById(Long id) {
  69. User user = userDao.selectByPrimaryKey(id);
  70. user.setCartList(cartService.queryByGidUid(null,id));
  71. Address address = new Address();
  72. address.setUserId(user.getId());
  73. user.setAddress(addressDao.selectOne(address));
  74. return user;
  75. }

3.2 前端视图代码编写

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="renderer" content="webkit">
  6. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  7. <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
  8. <title>商城后台管理系统</title>
  9. <link rel="stylesheet" type="text/css" href="../admin/layui/css/layui.css"/>
  10. <link rel="stylesheet" type="text/css" href="../admin/css/admin.css"/>
  11. </head>
  12. <body>
  13. <div class="main-layout" id='main-layout'>
  14. <!--侧边栏-->
  15. <div class="main-layout-side">
  16. <div class="m-logo">
  17. </div>
  18. <ul class="layui-nav layui-nav-tree" lay-filter="leftNav">
  19. <li class="layui-nav-item">
  20. <a href="javascript:;" data-url="../admin/user" data-id='1' data-text="用户管理"><i class="iconfont">&#xe60c;</i>用户管理</a>
  21. </li>
  22. <li class="layui-nav-item">
  23. <a href="javascript:;" data-url="../admin/comment" data-id='3' data-text="评价管理"><i class="iconfont">&#xe60c;</i>评价管理</a>
  24. </li>
  25. <li class="layui-nav-item layui-nav-itemed">
  26. <a href="javascript:;"><i class="iconfont">&#xe607;</i>商品管理</a>
  27. <dl class="layui-nav-child">
  28. <dd><a href="javascript:;" data-url="../admin/goods" data-id='4' data-text="商品管理"><span class="l-line"></span>商品管理</a></dd>
  29. <dd><a href="javascript:;" data-url="../admin/category" data-id='6' data-text="商品分类管理"><span class="l-line"></span>商品分类管理</a></dd>
  30. </dl>
  31. </li>
  32. <li class="layui-nav-item">
  33. <a href="javascript:;" data-url="../admin/admin-info" data-id='8' class="page" data-text="个人信息"><i class="iconfont">&#xe606;</i>个人信息</a>
  34. </li>
  35. </ul>
  36. </div>
  37. <!--右侧内容-->
  38. <div class="main-layout-container">
  39. <!--头部-->
  40. <div class="main-layout-header">
  41. <div class="menu-btn" id="hideBtn">
  42. <a href="javascript:;">
  43. <span class="iconfont">&#xe60e;</span>
  44. </a>
  45. </div>
  46. <ul class="layui-nav" lay-filter="rightNav">
  47. <li class="layui-nav-item">
  48. <a href="javascript:;" class="page" data-url="../admin/admin-info" data-id='5' data-text="个人信息">超级管理员</a>
  49. </li>
  50. <li class="layui-nav-item"><a href="../admin/login">退出</a></li>
  51. </ul>
  52. </div>
  53. <!--主体内容-->
  54. <div class="main-layout-body">
  55. <!--tab 切换-->
  56. <div class="layui-tab layui-tab-brief main-layout-tab" lay-filter="tab" lay-allowClose="true">
  57. <ul class="layui-tab-title">
  58. <li class="layui-this welcome">后台主页</li>
  59. </ul>
  60. <div class="layui-tab-content">
  61. <div class="layui-tab-item layui-show" style="background: #f5f5f5;">
  62. <!--1-->
  63. <iframe src="../admin/welcome" width="100%" height="100%" name="iframe" scrolling="auto" class="iframe" framborder="0"></iframe>
  64. <!--1end-->
  65. </div>
  66. </div>
  67. </div>
  68. </div>
  69. </div>
  70. <!--遮罩-->
  71. <div class="main-mask">
  72. </div>
  73. </div>
  74. <script type="text/javascript">
  75. var scope={
  76. link:'../admin/welcome'
  77. }
  78. </script>
  79. <script src="../admin/layui/layui.js" type="text/javascript" charset="utf-8"></script>
  80. <script src="../admin/js/common.js" type="text/javascript" charset="utf-8"></script>
  81. <script src="../admin/js/main.js" ></script>
  82. </body>
  83. </html>

4.项目展示

4.1 前端部分

主页

登录

注册

4.2 后台管理

登录

主页

用户管理

评论管理

商品管理

商品分类管理

个人信息管理

5.总结

前端部分要集中精力做前端页面的效果,bootstrap模板支撑,js,css,html,jq的代码逻辑通过ajax进行接口的请求调用,达到获取服务器数据的目的。

后端部分要也是尽其所能的做好自己的事情,分层架构,模型的选取,接口、数据库设计,性能研究,不需要像jsp那样,还需要去操作前端的代码逻辑,填充数据。

上传的附件 cloud_download 设计文档.docx ( 3.69mb, 1次下载 ) cloud_download shop-master.zip ( 25.85mb, 1次下载 )
error_outline 下载需要11点积分

发送私信

会冒泡的可乐

107
文章数
12
评论数
最近文章
eject