当前位置:   article > 正文

基于Springboot+Vue电商应用项目实战与毕业设计指导

基于Springboot+Vue电商应用项目实战与毕业设计指导

引 言

作为一个职场新人,项目经验少,工作总也干不好,最后薪资还挺少;

如果是在校生,毕业设计往往无从下手,实战经验少,设计总是做不好;

面对用户,总会遇到一些项目需求很多,同时业务经验少的窘境;

在这里,根据我们多年的开发与实战经验,对项目设计与开发,特别是Java项目的开发做一个完整的分析与总结,主要从以下几个方面着手解析:

六大应用场景: 电商销售、旅游健康、金融办公、酒店物业、租赁政务 、工程电信

架构体系:JavaEE原生、SSM经典、Springboot微服务、大数据与AI预测模型未来服务

开发模式:前后端一体开发、前后端分离开发

用户模式:前台管理 、后台管理

下面,我们来看一下基于Springboot+Vue易购电商应用项目实战吧!

一、项目简介

本款电商App实现了时下热门的电商应用效果。系统分为系统管理员和普通商家用户两个角色,管理员登录能管理商品的上下架和订单功能,用户管理等,普通商家和用户登录能浏览商品,上传商品,添加购物车和下单等功能。

 此应用满足商家出售商品需求,亦能满足用户购买需求。

二、产品优势 

随着时代的发展,社会生产力迅速发展,科学技术突飞猛进,人们对购物的需求不断增长。
对于商家来说,大量信息需要发布,订单需要生成并管理;对于顾客来说,如何快速找到自己需求的商品并且快速购买是一个考量。
 易购电商应用项目搭建了一个商家和顾客之间交互的平台,改平台能提供商品,购物车和订单等等服务,满足商家和顾客双方需求。

三、技术体系

四、功能列表

 五、项目架构

  前台用户管理:

  业务流程:

 六、效果展示

  首页效果:

        商家列表: 

        商家详情: 

  订单列表:

        在线支付: 

七、部分源码参考

全局跨域配置:

  1. @Configuration
  2. public class CrossConfig implements WebMvcConfigurer {
  3. @Override
  4. public void addCorsMappings(CorsRegistry registry) {
  5. registry.addMapping("/**")
  6. .allowedOriginPatterns("*")
  7. .allowedMethods("*")
  8. .allowedHeaders("*")
  9. //Access-Control-Allow-Credentials允许跨域
  10. //是否允许cookie
  11. .allowCredentials(true)
  12. .maxAge(3600);
  13. }
  14. }

全局异常管理:

  1. @ControllerAdvice
  2. public class GlobalAdvice {
  3. /**
  4. * 空指针异常
  5. * @return
  6. */
  7. @ExceptionHandler(NullPointerException.class)
  8. public String nullPointer(){
  9. //直接转发到static根下
  10. return "forward:null.html";
  11. }
  12. /**
  13. * 数组越界
  14. * @return
  15. */
  16. @ExceptionHandler(ArrayIndexOutOfBoundsException.class)
  17. public String arrayOutof(){
  18. //直接转发到static根下
  19. return "forward:out.html";
  20. }
  21. /**
  22. * 文件未找到
  23. * @return
  24. * 传入反射对象
  25. */
  26. @ExceptionHandler(FileNotFoundException.class)
  27. public String notFind(){
  28. //跳到/static/not.html
  29. return "forward:not.html";
  30. }
  31. @ExceptionHandler(SqlSessionException.class)
  32. @ResponseBody//返回json字符串
  33. public ResultVo mysqlException(){
  34. //跟前端约定好接口的标准
  35. return new ResultVo(3001,null,"数据更新异常 ");
  36. }
  37. }

 自定义全局拦截器:

  1. /**
  2. * 自定义拦截器
  3. */
  4. @Slf4j
  5. public class MyInterception implements HandlerInterceptor {
  6. @Override
  7. public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception {
  8. Object us=request.getSession().getAttribute("username");
  9. log.info("后端us:"+us);
  10. if(us==null){//用户名为空,转发一定要用request携带
  11. request.setAttribute("error","请先登录");
  12. //这里要写映射的地址
  13. request.getRequestDispatcher("/login").forward(request,response);
  14. return false;
  15. }
  16. //正常执行
  17. return true;
  18. }
  19. }

订单服务类:

  1. @Service
  2. public class OrdersServiceImpl implements OrdersService {
  3. //订单基本管理
  4. @Resource
  5. private OrdersMapper ordersMapper;
  6. //订单详情管理
  7. @Resource
  8. private OrderDetailsMapper orderDetailsMapper;
  9. //购物车管理
  10. @Resource
  11. private CartMapper cartMapper;
  12. /**
  13. * 生成订单:同步添加订单表orders与订单详情表
  14. * 要使用事务管理:多表与多sql操作
  15. * @param orders
  16. * @return
  17. */
  18. @Transactional
  19. @Override
  20. public ResultVo addOrders(Orders orders) {
  21. //拿到当前的时间
  22. LocalDate localDate = LocalDate.now();
  23. DateTimeFormatter dateTimeFormatter = DateTimeFormatter.ofPattern("yyyy-MM-dd");
  24. String date = localDate.format(dateTimeFormatter);
  25. //存入当前日期
  26. orders.setOrderDate(date);
  27. //存入当前状态,未支付
  28. orders.setOrderState(0);
  29. int n = ordersMapper.insertOrders(orders);
  30. Integer orderId=orders.getOrderId();
  31. //声明订单详情集合
  32. List<OrderDetails> orderDetails = new ArrayList<>();
  33. if (n > 0) {
  34. //同时执行订单详情操作
  35. List<Cart> list = cartMapper.selectByUserIdAndBusinessId(orders.getUserId(), orders.getBusinessId());
  36. //批量存订单详情信息,并删除用户对应的购物车信息
  37. for (Cart temp : list) {
  38. OrderDetails od = new OrderDetails();
  39. //订单id
  40. od.setOrderId(orderId);
  41. //食品id
  42. od.setFoodId(temp.getFoodId());
  43. //食品数量
  44. od.setQuantity(temp.getQuantity());
  45. //存入订单详情集合
  46. orderDetails.add(od);
  47. }//for
  48. int num = orderDetailsMapper.insertOrderDetailsBatch(orderDetails);
  49. 删除当前用户的购物车信息
  50. if (num > 0) {//直接遍历删除
  51. for (Cart temp : list){
  52. cartMapper.deleteCart(temp);
  53. }//for
  54. }
  55. 将生成的订单id传到前端
  56. return new ResultVo(1000, orders.getOrderId(), "订单已生成");
  57. }
  58. return new ResultVo(1001, null, "订单生成失败");
  59. }
  60. /**
  61. * 通过用户id查询订单
  62. *
  63. * @param userId,使用包装类对象,可以判断前端是否传了空对象
  64. * @return
  65. */
  66. @Override
  67. public ResultVo queryOrdersByUserId(Integer userId) {
  68. if (userId == null) {
  69. return new ResultVo(1001, null, "用户Id为空");
  70. } else {
  71. List<Orders> list = ordersMapper.selectByUserId(userId);
  72. if (list != null) {
  73. return new ResultVo(1000, list, "订单查询成功");
  74. }
  75. return new ResultVo(1001, null, "订单查询失败");
  76. }
  77. }
  78. /**
  79. * 通过订单id查询订单,并关联查询
  80. * @param orderId
  81. * @return
  82. */
  83. @Override
  84. public ResultVo queryOrdersByOrderId(Integer orderId) {
  85. Orders orders =ordersMapper.selectByOrderId(orderId);
  86. if(orders!=null){
  87. return new ResultVo(1000,orders,"订单查询成功");
  88. }
  89. return new ResultVo(1001,null,"订单查询失败");
  90. }
  91. /**
  92. * 修改订单状态:0未支付,1已支付,2已取消
  93. * 使用包装类对象,可以判断前端是否传了空对象
  94. *
  95. * @param orderId
  96. * @param orderState
  97. * @return
  98. */
  99. @Override
  100. public ResultVo updateOrdersState(Integer orderId, Integer orderState) {
  101. if (orderId == null || orderState == null) {
  102. return new ResultVo(1001, null, "传入的为空数据");
  103. } else {
  104. int n = ordersMapper.updateStatus(orderId, orderState);
  105. if (n > 0) {
  106. return new ResultVo(1000, null, "订单状态更新成功");
  107. }
  108. return new ResultVo(1001, null, "订单状态更新失败");
  109. }
  110. }
  111. }

订单控制器层,实现接口映射: 

  1. @RestController
  2. @RequestMapping("/Orders")
  3. public class OrdersController {
  4. @Resource
  5. private OrdersService ordersService;
  6. /**
  7. * 生成订单
  8. * @param orders
  9. * @return
  10. */
  11. @PostMapping("/add")
  12. public ResultVo addOrders(Orders orders){
  13. return ordersService.addOrders(orders);
  14. }
  15. /**
  16. * 通过用户id查询订单
  17. * @param userId
  18. * @return
  19. */
  20. @GetMapping("/query")
  21. public ResultVo queryOrders(int userId){
  22. return ordersService.queryOrdersByUserId(userId);
  23. }
  24. /**
  25. * @param orderId
  26. * @return
  27. */
  28. @GetMapping("/orderId")
  29. @CrossOrigin
  30. public ResultVo queryOrdersByOrderId(int orderId){
  31. return ordersService.queryOrdersByOrderId(orderId);
  32. }
  33. /**
  34. * 更新订单状态:0未支付,1已支付
  35. * @param orderId
  36. * @param orderState
  37. * @return
  38. */
  39. @PostMapping("/update")
  40. public ResultVo updateOrders(int orderId,int orderState){
  41. return ordersService.updateOrdersState(orderId,orderState);
  42. }
  43. }

更多内容与项目源码,请关注本站后续分享,敬请期待 ! 

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/喵喵爱编程/article/detail/853363
推荐阅读
相关标签
  

闽ICP备14008679号