• SpringBoot+Vue项目网上家电商城


    文末获取源码

    开发语言:Java
    开发工具:IDEA /Eclipse
    数据库:MYSQL5.7/8.0
    应用服务:Tomcat7/Tomcat8
    是否Maven项目:是
    后端框架:SpringBoot
    前端框架:vue+element等
    JDK版本:jdk1.8
    项目架构:B/S架构

    前言介绍 

    基于springboot的恒捷网上家电商城系统根据实际情况分为前后台两部分,前台部分主要是让用户购物使用的,包括用户的注册登录,查看公告,查看和搜索商品信息,根据分类定位不同类型的商品,将喜欢的商品加入购物车,对购物车内的商品进行结算生成订单,对订单进行管理,对个人注册信息进行管理等功能;后台部分主要是给商城购物系统的管理人员使用的,主要包括添加新闻公告信息,对商品进行分类管理,对商品进行管理方便前台用户购物使用,对用户的订单信息进行发货等操作,对用户的购物评价内容进行管理等操作。通过这些功能基本可以满足一个商城购物系统的需求。

    系统结构 

    基于springboot的恒捷网上家电商城系统是为了方便人们购物而开发的,本系统根据实际情况分为前台和后台两部分,前台部分主要是让用户查看和购物使用的,同时用户还可以在前台对商品进行收藏和评价等操作;后台部分主要是给基于springboot的恒捷网上家电商城系统的管理人员使用的,主要包括对商品分类信息的管理,对商品进行管理,对用户购买商品的订单信息进行管理,以及对用户的评价等内容进行管理,基于springboot的恒捷网上家电商城系统具体功能如下图所示 

     

    系统详细设计 

    系统首页 

    本系统是一个电子商务网站,为了能够尽量满足用户的操作习惯,我们在首页的设计的时候参考了天猫,京东等一些比较成熟的电子商务网站的布局,首先是在顶部加入用户注册登录的功能,然后是在下面加入了一个搜索栏方便用户快速的查找所需的商品,在首页部门我们还加入了图片轮播的动态效果,在首页的左侧我们对商品的类型进行了展示,这样可以方便用户快速的定位不同类型的商品。首页整体设计以减价大方为主,并且兼顾了用户的操作习惯。基于springboot的恒捷网上家电商城系统首页部分具体效果如图 

     

    用户注册登录 

    在本基于springboot的恒捷网上家电商城系统中会有很多的顾客购买所需的商品,如果用户不进行注册登录就进行购买很难区分是那个客户买的商品,对后期的订单和发货等操作都会有很大的影响,所以用户在购物等操作的时候一定要先注册登录才可以进行后续操作。用户在注册的时候按照界面要求输入注册信息并点击[提交]按钮即可完成注册操作。基于springboot的恒捷网上家电商城系统用户注册效果如图

     

    基于springboot的恒捷网上家电商城系统的用户在注册之后只是确定账号存在了,在购物等操作的时候还要根据上一步中注册的账号登录才可以,用户在登录的时候输入用户名+密码+验证码之后即可完成登录,登陆后系统会将当前登录的用户保存在Session对象中,方便用户的后续购物操作,基于springboot的恒捷网上家电商城系统用户登陆界面如图

     

    商品信息 

    用户通过本基于springboot的恒捷网上家电商城系统的商品展示模块,首页的搜索模块,首页的商品分类模块和优惠商品等都可以快速的看到商品的展示信息,在商品展示模块中我们通商品的图片+商品的名称+商品的价格三要素对商品进行了展示,这样可以让用户快速的定位和筛选出自己所需的商品,当对某个商品感兴趣的时候还通过点击商品的图片和名称来查看商品的详细内容,基于springboot的恒捷网上家电商城系统商品信息效果如图 

     

    当用户上商品展示界面中点击了商品的图片或者名称之后系统会根据商品的ID自动的跳转到商品的详情页面中来,在商品的详情页面中可以看到商品的图片+商品的价格+商品的详细介绍+商品的销量等内容,当用户登录之后还可以根据需要进行收藏和加入购入车,加入购物车的时候可以选择购买的数量。同时为了能够让用户更好的查看商品的图片,我们还加入了图片放大镜的功能,用户只需将鼠标滑到图片上即可对图片进行放大查看大图,基于springboot的恒捷网上家电商城系统商品详情界面如图 

     

    用户除了可以查看商品之外可以查看优惠商品,优惠商品相当于限时秒杀,这部分和普通商品不同的是这些商品价格都相对比较低,且有时间限制,超过时间限制之后将不能够购买。基于springboot的恒捷网上家电商城系统优惠商品信息效果如图

     

     

    当用户在上一步中点击了[点击购买]按钮之后系统会跳转到确认下单界面,在确认下面界面中选择已经添加过的地址,并点击[支付]按钮即可完成下单操作,基于springboot的恒捷网上家电商城系统用户购物车管理界面如图 

    订单信息管理 

    当用户在购物车中对商品进行了结算之后系统会自动的生成订单信息,在订单信息中可以看到订单的编号+商品名称+价格+数量+总价等订单信息,并且为了让用户更加方便的对不同状态下的订单进行管理,我们根据订单状态进行了分类主要包括[未支付],[已支付],[已发货],[已完成],[已退款],[已取消],等几个类型。在[未支付]状态下用户可以进行取消和付款,[已支付]状态下可以进行退款操作,[已发货]状态下用户可以进行收货操作,[已完成]状态下用户可以进行评价操作,[已退款],[已取消]两个状态下只能查看历史订单 

     

    地址信息管理 

    当用户在进行购物的时候一般都是需要收货地址的,为了能够让用户保存自己的地址而不是每次都输入我们开发了收货地址管理模块,在收货地址添加模块中用户输入收货的联系人,手机号和地址以及是否设置为默认地址等之后点击[添加]按钮即可完成对地址的添加操作 

     

    当用户在上一步中添加地址之后可以在[我的地址]中对自己的地址进行管理,主要包括对有变化的收货地址进行修改,对不需要的收货地址进行删除等操作 

     

    管理员登录模块 

    网上家电商城系统中的管理员需要通过登录后台才可以对系统内的商品信息和订单信息进行管理,在商城购物系统管理人员登录界面中我们加入了另个input控件来存储用户名+密码,当管理人员输入了这些内容并点击 [登录]按钮之后系统会判断用户名和密码是否正确,如果正确就正常登录,否则给出提示,登录失败

     

    商品类型信息管理 

    网上家电商城系统是一个综合性的购物平台,里面的商品琳琅满目五花八门,为了能够让顾客更方便的定位所需商品的类型,管理人员要对商品进行分类以方便管理和顾客购物使用,在商品分类管理中管理人员只需输入商品类型名称并点击[提交]按钮即可完成对商品分类的添加工作 

    商品管理 

    为了方便顾客查看和购买商品,基于springboot的恒捷网上家电商城系统的管理员要可以对不同的商品进行管理,主要包括对商品的添加,修改和删除等操作,当有新的商品需要发布的时候管理人员要可以对商品进行添加,在添加界面中输入商品基本信息,并上传商品的图片之后即可完成对商品的添加工作,这里要说明的是商品类型是通过上一步的商品类型管理中的内容进行动态读取的 

    网上家电商城系统的管理人员对商品信息完成添加之后还需要能够对商品进行管理,主要包括对不再销售的商品进行删除,对有误的商品进行修改等操作

    订单管理 

    网上家电商城系统的用户在提交了自己的订单之后,管理人员要可以对订单进行管理,并且管理人员很好的控制订单的状态,当订单是没有发货的时候在订单管理中是显示发货操作按钮的,这个情况下管理人员可以进行发货处理,当订单是已发货或者其他状态下的时候发货按钮是不显示的,通过这种方式还可以起到提醒管理人员发货的作用。此外基于springboot的恒捷网上家电商城系统的管理人员还可以查看订单的详情和删除一些过期的订单内容 

     

    网上家电商城系统的管理员还可以查看订单的详细信息,在详细信息中可以看到用户过购买了那些商品

     

    部分核心代码

    1. /**
    2. * 家电产品
    3. * 后端接口
    4. * @author
    5. * @email
    6. * @date 2022-05-05 10:31:32
    7. */
    8. @RestController
    9. @RequestMapping("/jiadianchanpin")
    10. public class JiadianchanpinController {
    11. @Autowired
    12. private JiadianchanpinService jiadianchanpinService;
    13. @Autowired
    14. private StoreupService storeupService;
    15. @Autowired
    16. private OrdersService ordersService;
    17. /**
    18. * 后端列表
    19. */
    20. @RequestMapping("/page")
    21. public R page(@RequestParam Map<String, Object> params,JiadianchanpinEntity jiadianchanpin,
    22. HttpServletRequest request){
    23. String tableName = request.getSession().getAttribute("tableName").toString();
    24. if(tableName.equals("shangjia")) {
    25. jiadianchanpin.setShangjiamingcheng((String)request.getSession().getAttribute("username"));
    26. }
    27. EntityWrapper<JiadianchanpinEntity> ew = new EntityWrapper<JiadianchanpinEntity>();
    28. PageUtils page = jiadianchanpinService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, jiadianchanpin), params), params));
    29. return R.ok().put("data", page);
    30. }
    31. /**
    32. * 前端列表
    33. */
    34. @IgnoreAuth
    35. @RequestMapping("/list")
    36. public R list(@RequestParam Map<String, Object> params,JiadianchanpinEntity jiadianchanpin,
    37. HttpServletRequest request){
    38. EntityWrapper<JiadianchanpinEntity> ew = new EntityWrapper<JiadianchanpinEntity>();
    39. PageUtils page = jiadianchanpinService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, jiadianchanpin), params), params));
    40. return R.ok().put("data", page);
    41. }
    42. /**
    43. * 列表
    44. */
    45. @RequestMapping("/lists")
    46. public R list( JiadianchanpinEntity jiadianchanpin){
    47. EntityWrapper<JiadianchanpinEntity> ew = new EntityWrapper<JiadianchanpinEntity>();
    48. ew.allEq(MPUtil.allEQMapPre( jiadianchanpin, "jiadianchanpin"));
    49. return R.ok().put("data", jiadianchanpinService.selectListView(ew));
    50. }
    51. /**
    52. * 查询
    53. */
    54. @RequestMapping("/query")
    55. public R query(JiadianchanpinEntity jiadianchanpin){
    56. EntityWrapper< JiadianchanpinEntity> ew = new EntityWrapper< JiadianchanpinEntity>();
    57. ew.allEq(MPUtil.allEQMapPre( jiadianchanpin, "jiadianchanpin"));
    58. JiadianchanpinView jiadianchanpinView = jiadianchanpinService.selectView(ew);
    59. return R.ok("查询家电产品成功").put("data", jiadianchanpinView);
    60. }
    61. /**
    62. * 后端详情
    63. */
    64. @RequestMapping("/info/{id}")
    65. public R info(@PathVariable("id") Long id){
    66. JiadianchanpinEntity jiadianchanpin = jiadianchanpinService.selectById(id);
    67. jiadianchanpin.setClicknum(jiadianchanpin.getClicknum()+1);
    68. jiadianchanpin.setClicktime(new Date());
    69. jiadianchanpinService.updateById(jiadianchanpin);
    70. return R.ok().put("data", jiadianchanpin);
    71. }
    72. /**
    73. * 前端详情
    74. */
    75. @IgnoreAuth
    76. @RequestMapping("/detail/{id}")
    77. public R detail(@PathVariable("id") Long id){
    78. JiadianchanpinEntity jiadianchanpin = jiadianchanpinService.selectById(id);
    79. jiadianchanpin.setClicknum(jiadianchanpin.getClicknum()+1);
    80. jiadianchanpin.setClicktime(new Date());
    81. jiadianchanpinService.updateById(jiadianchanpin);
    82. return R.ok().put("data", jiadianchanpin);
    83. }
    84. /**
    85. * 后端保存
    86. */
    87. @RequestMapping("/save")
    88. public R save(@RequestBody JiadianchanpinEntity jiadianchanpin, HttpServletRequest request){
    89. jiadianchanpin.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());
    90. //ValidatorUtils.validateEntity(jiadianchanpin);
    91. jiadianchanpinService.insert(jiadianchanpin);
    92. return R.ok();
    93. }
    94. /**
    95. * 前端保存
    96. */
    97. @RequestMapping("/add")
    98. public R add(@RequestBody JiadianchanpinEntity jiadianchanpin, HttpServletRequest request){
    99. jiadianchanpin.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());
    100. //ValidatorUtils.validateEntity(jiadianchanpin);
    101. jiadianchanpinService.insert(jiadianchanpin);
    102. return R.ok();
    103. }
    104. /**
    105. * 修改
    106. */
    107. @RequestMapping("/update")
    108. @Transactional
    109. public R update(@RequestBody JiadianchanpinEntity jiadianchanpin, HttpServletRequest request){
    110. //ValidatorUtils.validateEntity(jiadianchanpin);
    111. jiadianchanpinService.updateById(jiadianchanpin);//全部更新
    112. return R.ok();
    113. }
    114. /**
    115. * 删除
    116. */
    117. @RequestMapping("/delete")
    118. public R delete(@RequestBody Long[] ids){
    119. jiadianchanpinService.deleteBatchIds(Arrays.asList(ids));
    120. return R.ok();
    121. }
    122. /**
    123. * 提醒接口
    124. */
    125. @RequestMapping("/remind/{columnName}/{type}")
    126. public R remindCount(@PathVariable("columnName") String columnName, HttpServletRequest request,
    127. @PathVariable("type") String type,@RequestParam Map<String, Object> map) {
    128. map.put("column", columnName);
    129. map.put("type", type);
    130. if(type.equals("2")) {
    131. SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");
    132. Calendar c = Calendar.getInstance();
    133. Date remindStartDate = null;
    134. Date remindEndDate = null;
    135. if(map.get("remindstart")!=null) {
    136. Integer remindStart = Integer.parseInt(map.get("remindstart").toString());
    137. c.setTime(new Date());
    138. c.add(Calendar.DAY_OF_MONTH,remindStart);
    139. remindStartDate = c.getTime();
    140. map.put("remindstart", sdf.format(remindStartDate));
    141. }
    142. if(map.get("remindend")!=null) {
    143. Integer remindEnd = Integer.parseInt(map.get("remindend").toString());
    144. c.setTime(new Date());
    145. c.add(Calendar.DAY_OF_MONTH,remindEnd);
    146. remindEndDate = c.getTime();
    147. map.put("remindend", sdf.format(remindEndDate));
    148. }
    149. }
    150. Wrapper<JiadianchanpinEntity> wrapper = new EntityWrapper<JiadianchanpinEntity>();
    151. if(map.get("remindstart")!=null) {
    152. wrapper.ge(columnName, map.get("remindstart"));
    153. }
    154. if(map.get("remindend")!=null) {
    155. wrapper.le(columnName, map.get("remindend"));
    156. }
    157. String tableName = request.getSession().getAttribute("tableName").toString();
    158. if(tableName.equals("shangjia")) {
    159. wrapper.eq("shangjiamingcheng", (String)request.getSession().getAttribute("username"));
    160. }
    161. int count = jiadianchanpinService.selectCount(wrapper);
    162. return R.ok().put("count", count);
    163. }
    164. /**
    165. * 前端智能排序
    166. */
    167. @IgnoreAuth
    168. @RequestMapping("/autoSort")
    169. public R autoSort(@RequestParam Map<String, Object> params,JiadianchanpinEntity jiadianchanpin, HttpServletRequest request,String pre){
    170. EntityWrapper<JiadianchanpinEntity> ew = new EntityWrapper<JiadianchanpinEntity>();
    171. Map<String, Object> newMap = new HashMap<String, Object>();
    172. Map<String, Object> param = new HashMap<String, Object>();
    173. Iterator<Map.Entry<String, Object>> it = param.entrySet().iterator();
    174. while (it.hasNext()) {
    175. Map.Entry<String, Object> entry = it.next();
    176. String key = entry.getKey();
    177. String newKey = entry.getKey();
    178. if (pre.endsWith(".")) {
    179. newMap.put(pre + newKey, entry.getValue());
    180. } else if (StringUtils.isEmpty(pre)) {
    181. newMap.put(newKey, entry.getValue());
    182. } else {
    183. newMap.put(pre + "." + newKey, entry.getValue());
    184. }
    185. }
    186. params.put("sort", "clicknum");
    187. params.put("order", "desc");
    188. PageUtils page = jiadianchanpinService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, jiadianchanpin), params), params));
    189. return R.ok().put("data", page);
    190. }
    191. /**
    192. * 协同算法(按用户购买推荐)
    193. */
    194. @RequestMapping("/autoSort2")
    195. public R autoSort2(@RequestParam Map<String, Object> params,JiadianchanpinEntity jiadianchanpin, HttpServletRequest request){
    196. String userId = request.getSession().getAttribute("userId").toString();
    197. String goodtypeColumn = "shangpinfenlei";
    198. List<OrdersEntity> orders = ordersService.selectList(new EntityWrapper<OrdersEntity>().eq("userid", userId).eq("tablename", "jiadianchanpin").orderBy("addtime", false));
    199. List<String> goodtypes = new ArrayList<String>();
    200. Integer limit = params.get("limit")==null?10:Integer.parseInt(params.get("limit").toString());
    201. List<JiadianchanpinEntity> jiadianchanpinList = new ArrayList<JiadianchanpinEntity>();
    202. //去重
    203. List<OrdersEntity> ordersDist = new ArrayList<OrdersEntity>();
    204. for(OrdersEntity o1 : orders) {
    205. boolean addFlag = true;
    206. for(OrdersEntity o2 : ordersDist) {
    207. if(o1.getGoodid()==o2.getGoodid() || o1.getGoodtype().equals(o2.getGoodtype())) {
    208. addFlag = false;
    209. break;
    210. }
    211. }
    212. if(addFlag) ordersDist.add(o1);
    213. }
    214. if(ordersDist!=null && ordersDist.size()>0) {
    215. for(OrdersEntity o : ordersDist) {
    216. jiadianchanpinList.addAll(jiadianchanpinService.selectList(new EntityWrapper<JiadianchanpinEntity>().eq(goodtypeColumn, o.getGoodtype())));
    217. }
    218. }
    219. EntityWrapper<JiadianchanpinEntity> ew = new EntityWrapper<JiadianchanpinEntity>();
    220. params.put("sort", "id");
    221. params.put("order", "desc");
    222. PageUtils page = jiadianchanpinService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, jiadianchanpin), params), params));
    223. List<JiadianchanpinEntity> pageList = (List<JiadianchanpinEntity>)page.getList();
    224. if(jiadianchanpinList.size()
    225. int toAddNum = (limit-jiadianchanpinList.size())<=pageList.size()?(limit-jiadianchanpinList.size()):pageList.size();
    226. for(JiadianchanpinEntity o1 : pageList) {
    227. boolean addFlag = true;
    228. for(JiadianchanpinEntity o2 : jiadianchanpinList) {
    229. if(o1.getId().intValue()==o2.getId().intValue()) {
    230. addFlag = false;
    231. break;
    232. }
    233. }
    234. if(addFlag) {
    235. jiadianchanpinList.add(o1);
    236. if(--toAddNum==0) break;
    237. }
    238. }
    239. } else if(jiadianchanpinList.size()>limit) {
    240. jiadianchanpinList = jiadianchanpinList.subList(0, limit);
    241. }
    242. page.setList(jiadianchanpinList);
    243. return R.ok().put("data", page);
    244. }
    245. }

     

  • 相关阅读:
    (十五)STM32——尝试把独立看门狗当成一款游戏来理解
    QT 自学内容 day04 UDP 数据传输, TCP 数据传输,ui 界面设计,按钮的设计自动绑定槽函数!
    常用的 DOS 命令
    openGauss/MogDB脚本源码浅析(2)—— gs_install_plugin/gs_install_plugin_local
    NR 2-STEP RA Absolute Timing Advance Command MAC CE的应用场景
    Putty连接服务器
    c语言从入门到实战——函数递归
    JUC第十三讲:JUC锁: ReentrantLock详解
    Ant-vue-tabel2.x表格合计通用方法
    低代码开发平台告诉您金融行业的管理系统可以做哪些模块
  • 原文地址:https://blog.csdn.net/m0_49113107/article/details/125932389