基于Java+SpringBoot+vue+element实现前后端分离蛋糕商城系统详细设计
前言介绍:
随着社会的快速发展,计算机的影响是全面且深入的。人们生活水平的不断提高,日常生活中用户对网上蛋糕商城方面的要求也在不断提高,网上蛋糕商城得到广大用户的青睐,使得网上蛋糕商城的开发成为必需而且紧迫的事情。网上蛋糕商城主要是借助计算机,通过对网上蛋糕商城所需的信息管理,增加用户的选择,同时也方便对广大用户信息的及时查询、修改以及对用户信息的及时了解。网上蛋糕商城对用户带来了更多的便利,该系统通过和数据库管理系统软件协作来满足用户的需求。计算机技术在现代管理中的应用,使计算机成为人们应用现代技术的重要工具。能够有效的解决获取信息便捷化、全面化的问题,提高效率。
流程分析:
系统开发流程
网上蛋糕商城系统开发时,首先进行需求分析,进而对系统进行总体的设计规划,设计系统功能模块,数据库的选择等,本系统的开发流程如图所示
图系统开发流程图
用户登录流程
为了保证系统的安全性,要使用本系统对系统信息进行管理,必须先登陆到系统中。如图所示。
图登录流程图
系统操作流程
用户打开并进入系统后,会先显示登录界面,输入正确的用户名和密码,系统自动检测信息,若信息无误,则用户会进入系统功能界面,进行操作,否则会提示错误无法登录,操作流程如图3-3所示。
图系统操作流程图
功能截图:
用户前台展示:
系统首页:
用户登陆注册:用户要想实现蛋糕购买操作必须进行登录系统,用户登录界面展示如图用户登录界面图所示;在用户信息添加界面,填写信息后,通过客户端验证后,提交数据到数据库。后台对用户信息进行保存操作,保存数据就,在数据库中可以查看到刚才录入的数据。用户注册在操作上属于数据的插入操作,用户注册前,需要验证该用户是否存在数据库,如果有这个用户,就不能继续注册
商家店铺信息:
店铺详情信息:
蛋糕商品展示:用户在蛋糕详情界面可查看家具详情,可点击购买按钮进行购买操作,蛋糕详情界面展示如图所示
商品详情信息:
加入购物车:用户可进购物车界面查看购物车蛋糕信息,购物车界面展示如图所示。点击收银台按钮时进入地址填写界面。
购买和订单管理:在用户点击加入购物车后,通过客户端验证后,提交数据到数据库。后台对用户信息进行保存操作,保存数据就,在数据库中可以查看到刚才插入的数据。
用户在我的订单界面可查看订单信息,对已发货的订单可进行确认收货操作,我的订单界面展示如图我的订单界面图所示。
蛋糕资讯:
个人中心管理:
普通用户后台管理:
管理员后台管理:
管理员要想进入系统后台对系统进行管理操作,必须进行登录,管理员登录界面展示如图所示
用户管理:管理员可查看所有会员信息,并可修改会员资料以及删除操作,会员管理界面展示如图所示
蛋糕商家管理:
蛋糕类型管理:管理员可添加、编辑和删除蛋糕分类信息,蛋糕分类管理界面展示如图所示点击蛋糕分类管理链接,录入蛋糕分类信息。在蛋糕分类信息添加界面,填写信息后,通过客户端验证后,提交数据到数据库。后台对蛋糕分类信息进行保存操作,保存数据就,在数据库中可以查看到刚才录入的数据。录入蛋糕分类信息后,在蛋糕分类列表中,通过后台查询方法,把所有的蛋糕分类信息读取到集合对象,把集合对象通过html的方式显示到界面。查询有两种类型,一个是查询所有的蛋糕分类集合,也可以通过条件查询蛋糕分类,实现的sql语句不同而已,最终实现的流程一样。在列表中,可以对蛋糕分类信息进行删除,删除前,需要提示信息,是否确定删除。这一步骤的提示属于客户端控制,当确定删除后,调用服务器端删除方法,实现数据库数据删除,并刷新蛋糕分类列表。
蛋糕商品详情:管理员可进行蛋糕管理操作,可添加、删除和编辑蛋糕信息,蛋糕管理界面展示如图所示
订单信息管理:管理员可进行订单管理操作,可查看所有订单信息,并可对其订单进行发货和删除操作,订单管理界面展示如图所示。
蛋糕资讯以及系统轮播图等维护管理:
数据设计:
本系统采用MYSQL数据库作为数据存储,下面介绍数据库中的各个表的详细信息。
管理员表是保存在线蛋糕销售的用户信息表,其中表结构如4.1所示。
表4-1 admin管理员表
列名 |
解释 |
类型 |
大小 |
主键 |
空 |
Idyaopin |
主键 |
int |
4 |
是主键 |
不能为空 |
Usernameyaopin |
用户名 |
varchar |
50 |
不是 |
可以为空 |
Passwordyaopin |
密码 |
varchar |
50 |
不是 |
可以为空 |
typeyaopin |
类型 |
varchar |
30 |
不是 |
可以为空 |
订单表是保存在线蛋糕销售的订单信息表,其中id为主键,表结构如4.2所示。
表4-2 orders订单表
列名 |
解释 |
类型 |
大小 |
主键 |
空 |
idyaopin |
主键 |
int |
11 |
是主键 |
不能为空 |
onumberyaopin |
订单号 |
varchar |
50 |
不是 |
可以为空 |
Spcyaopin |
商品 |
varchar |
50 |
不是 |
可以为空 |
Slcyaopin |
数量 |
varchar |
50 |
不是 |
可以为空 |
addressyaopin |
地址 |
varchar |
50 |
不是 |
可以为空 |
teyaopin |
电话 |
varchar |
13 |
不是 |
可以为空 |
emailyaopin |
用户邮箱 |
varchar |
20 |
不是 |
可以为空 |
shffyaopin |
收货 |
varchar |
60 |
不是 |
可以为空 |
zfffyaopin |
用户支付 |
varchar |
10 |
不是 |
可以为空 |
leavewordyaopin |
用户留言 |
varchar |
2000 |
不是 |
可以为空 |
addtimeyaopin |
日期 |
time |
不是 |
可以为空 |
|
xnameyaopin |
下单人 |
varchar |
10 |
不是 |
可以为空 |
ztyaopin |
订单的状态 |
varchar |
2 |
不是 |
可以为空 |
totalyaopin |
总价格 |
varchar |
10 |
不是 |
可以为空 |
kuaidiyaopin |
快递名称 |
varchar |
20 |
不是 |
可以为空 |
knumberyaopin |
单号 |
int |
20 |
不是 |
可以为空 |
Receiveryaopin |
收货人姓名 |
varchar |
10 |
不是 |
可以为空 |
类别表是保存蛋糕销售的类别信息表,其中id为主键,表结构如4.3所示。
表4-3 category类别表
列名 |
解释 |
类型 |
大小 |
主键 |
空 |
idyaopin |
主键 |
int |
4 |
是主键 |
不能为空 |
pidyaopin |
分类类型 |
int |
6 |
不是 |
可以为空 |
titleyaopin |
分类名称 |
varchar |
60 |
不是 |
可以为空 |
商品表是保存蛋糕销售的商品信息表,其中id为主键,表结构如4.4所示。
表4-4 goods商品表
列名 |
解释 |
类型 |
大小 |
主键 |
空 |
idyaopin |
主键 |
int |
4 |
是主键 |
不能为空 |
pidyaopin |
类型编号 |
int |
4 |
不是 |
可以为空 |
categoryidyaopin |
分类编号 |
int |
4 |
不是 |
可以为空 |
pnumberyaopin |
商品的编号 |
varchar |
10 |
不是 |
可以为空 |
titleyaopin |
商品的名称 |
varchar |
10 |
不是 |
可以为空 |
amountyaopin |
库存数量 |
int |
10 |
不是 |
可以为空 |
cishuyaopin |
销量 |
int |
10 |
不是 |
可以为空 |
mpriceyaopin |
市场的价格 |
decimal |
10 |
不是 |
可以为空 |
spriceyaopin |
会员的价格 |
decimal |
10 |
不是 |
可以为空 |
contentyaopin |
详细介绍 |
text |
不是 |
可以为空 |
|
apvyaopin |
点击 |
int |
4 |
不是 |
可以为空 |
imgyaopin |
图片 |
varchar |
50 |
不是 |
可以为空 |
statusyaopin |
状态 |
int |
2 |
不是 |
可以为空 |
addtimeyaopin |
添加时间 |
timestamp |
不是 |
可以为空 |
部分代码:
/*** 订单* 后端接口* @author * @email * @date 2022-03-27 17:11:41*/
@RestController
@RequestMapping("/orders")
public class OrdersController {@Autowiredprivate OrdersService ordersService;/*** 后端列表*/@RequestMapping("/page")public R page(@RequestParam Map<String, Object> params,OrdersEntity orders,HttpServletRequest request){if(!request.getSession().getAttribute("role").toString().equals("管理员")) {orders.setUserid((Long)request.getSession().getAttribute("userId"));}EntityWrapper<OrdersEntity> ew = new EntityWrapper<OrdersEntity>();PageUtils page = ordersService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, orders), params), params));return R.ok().put("data", page);}/*** 前端列表*/@RequestMapping("/list")public R list(@RequestParam Map<String, Object> params,OrdersEntity orders, HttpServletRequest request){EntityWrapper<OrdersEntity> ew = new EntityWrapper<OrdersEntity>();PageUtils page = ordersService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, orders), params), params));return R.ok().put("data", page);}/*** 列表*/@RequestMapping("/lists")public R list( OrdersEntity orders){EntityWrapper<OrdersEntity> ew = new EntityWrapper<OrdersEntity>();ew.allEq(MPUtil.allEQMapPre( orders, "orders")); return R.ok().put("data", ordersService.selectListView(ew));}/*** 查询*/@RequestMapping("/query")public R query(OrdersEntity orders){EntityWrapper< OrdersEntity> ew = new EntityWrapper< OrdersEntity>();ew.allEq(MPUtil.allEQMapPre( orders, "orders")); OrdersView ordersView = ordersService.selectView(ew);return R.ok("查询订单成功").put("data", ordersView);}/*** 后端详情*/@RequestMapping("/info/{id}")public R info(@PathVariable("id") Long id){OrdersEntity orders = ordersService.selectById(id);return R.ok().put("data", orders);}/*** 前端详情*/@RequestMapping("/detail/{id}")public R detail(@PathVariable("id") Long id){OrdersEntity orders = ordersService.selectById(id);return R.ok().put("data", orders);}/*** 后端保存*/@RequestMapping("/save")public R save(@RequestBody OrdersEntity orders, HttpServletRequest request){orders.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());//ValidatorUtils.validateEntity(orders);orders.setUserid((Long)request.getSession().getAttribute("userId"));ordersService.insert(orders);return R.ok();}/*** 前端保存*/@RequestMapping("/add")public R add(@RequestBody OrdersEntity orders, HttpServletRequest request){orders.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());//ValidatorUtils.validateEntity(orders);ordersService.insert(orders);return R.ok();}/*** 修改*/@RequestMapping("/update")public R update(@RequestBody OrdersEntity orders, HttpServletRequest request){//ValidatorUtils.validateEntity(orders);ordersService.updateById(orders);//全部更新return R.ok();}/*** 删除*/@RequestMapping("/delete")public R delete(@RequestBody Long[] ids){ordersService.deleteBatchIds(Arrays.asList(ids));return R.ok();}/*** 提醒接口*/@RequestMapping("/remind/{columnName}/{type}")public R remindCount(@PathVariable("columnName") String columnName, HttpServletRequest request, @PathVariable("type") String type,@RequestParam Map<String, Object> map) {map.put("column", columnName);map.put("type", type);if(type.equals("2")) {SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");Calendar c = Calendar.getInstance();Date remindStartDate = null;Date remindEndDate = null;if(map.get("remindstart")!=null) {Integer remindStart = Integer.parseInt(map.get("remindstart").toString());c.setTime(new Date()); c.add(Calendar.DAY_OF_MONTH,remindStart);remindStartDate = c.getTime();map.put("remindstart", sdf.format(remindStartDate));}if(map.get("remindend")!=null) {Integer remindEnd = Integer.parseInt(map.get("remindend").toString());c.setTime(new Date());c.add(Calendar.DAY_OF_MONTH,remindEnd);remindEndDate = c.getTime();map.put("remindend", sdf.format(remindEndDate));}}Wrapper<OrdersEntity> wrapper = new EntityWrapper<OrdersEntity>();if(map.get("remindstart")!=null) {wrapper.ge(columnName, map.get("remindstart"));}if(map.get("remindend")!=null) {wrapper.le(columnName, map.get("remindend"));}if(!request.getSession().getAttribute("role").toString().equals("管理员")) {wrapper.eq("userid", (Long)request.getSession().getAttribute("userId"));}int count = ordersService.selectCount(wrapper);return R.ok().put("count", count);}}
@Service("ordersService")
public class OrdersServiceImpl extends ServiceImpl<OrdersDao, OrdersEntity> implements OrdersService {@Overridepublic PageUtils queryPage(Map<String, Object> params) {Page<OrdersEntity> page = this.selectPage(new Query<OrdersEntity>(params).getPage(),new EntityWrapper<OrdersEntity>());return new PageUtils(page);}@Overridepublic PageUtils queryPage(Map<String, Object> params, Wrapper<OrdersEntity> wrapper) {Page<OrdersView> page =new Query<OrdersView>(params).getPage();page.setRecords(baseMapper.selectListView(page,wrapper));PageUtils pageUtil = new PageUtils(page);return pageUtil;}@Overridepublic List<OrdersVO> selectListVO(Wrapper<OrdersEntity> wrapper) {return baseMapper.selectListVO(wrapper);}@Overridepublic OrdersVO selectVO(Wrapper<OrdersEntity> wrapper) {return baseMapper.selectVO(wrapper);}@Overridepublic List<OrdersView> selectListView(Wrapper<OrdersEntity> wrapper) {return baseMapper.selectListView(wrapper);}@Overridepublic OrdersView selectView(Wrapper<OrdersEntity> wrapper) {return baseMapper.selectView(wrapper);}}
获取源码:
大家点赞、收藏、关注、评论啦 、查看
基于Java+SpringBoot+vue+element实现前后端分离蛋糕商城系统详细设计相关推荐
- 基于Java+SpringBoot+vue+element实现前后端分离玩具商城系统
- 基于Java+SpringBoot+vue+element实现前后端分离牙科诊所管理系统详细设计
博主介绍:✌公司项目主程.全网粉丝10W+,csdn特邀作者.博客专家.CSDN新星计划导师.java领域优质创作者,CSDN博客之星TOP100.掘金/华为云/阿里云/InfoQ等平台优质作者.专注 ...
- 基于Springboot+MybatisPlus+Vue的前后端分离电子商城系统
一.基于Springboot+MybatisPlus+Vue的前后端分离电子商城系统 基于Springboot+MybatisPlus+Vue的前后端分离电子商城系统,主要分为用户端和管理端两个模块. ...
- 使用SpringBoot + Vue (若依前后端分离版) 写项目的一些总结(持续更新...)
使用SpringBoot + Vue(若依前后端分离版) 写项目的一些总结 获取Redis服务 @Autowired private RedisCache redisCache; String cap ...
- Vue+Spring Boot 前后端分离的商城项目开源啦!
1 新蜂商城 Vue 移动端版本开源啦! 去年开源新蜂商城项目后,就一直在计划这个项目 Vue 版本的改造,2020 年开始开发并且自己私下一直在测试,之前也有文章介绍过测试过程和存在的问题,修改完成 ...
- 基于SpringBoot+Vue开发的前后端分离博客项目-Java后端接口开发
文章目录 1. 前言 2. 新建Springboot项目 3. 整合mybatis plus 第一步:导依赖 第二步:写配置文件 第三步:mapper扫描+分页插件 第四步:代码生成配置 第五步:执行 ...
- 基于SpringBoot+Vue开发的前后端分离人力资源管理系统
项目介绍 一款 Java 语言基于 SpringBoot2.x.MybatisPlus.Vue.ElementUI.MySQL等框架精心打造的一款前后端分离框架,致力于实现模块化.组件化.可插拔的前后 ...
- 前后端分离跨服务器文件上传,SpringBoot+Vue.js实现前后端分离的文件上传功能
这篇文章需要一定vue和springboot的知识,分为两个项目,一个是前端vue项目,一个是后端springboot项目. 后端项目搭建 我使用的是springboot1.5.10+jdk8+ide ...
- 悟空CRM(基于TP5.0+vue+ElementUI的前后端分离CRM系统)
悟空CRM(9.0版本)(PHP版本) 悟空软件长期为企业提供企业管理软件(CRM/HRM/OA/ERP等)的研发.实施.营销.咨询.培训.服务于一体的信息化服务.悟空软件以高科技为起点,以技术为核心 ...
最新文章
- Spring定时任务的配置
- 撒花!《图解深度学习》已开源,16 章带你无障碍深度学习,高中生数学就 ok!
- 前端网址导航-最酷前端圈子在这里
- ROS笔记(15) Xacro
- 计算机难点知识,(必先看)计算机文化基础知识难点
- 基于JAVA+SpringMVC+Mybatis+MYSQL的汽车饰品销售系统
- 基于JAVA+SpringMVC+MYSQL的便利店运营管理系统
- 抢购 mysql 优化_处理抢购、秒杀应用场景降低“超卖”发生几个优化方案(php)...
- 用友nc操作手册_铁军人物汤轩宇, 入职两年,她用努力和汗水编制出单户试算操作手册...
- 写给《我也能做CTO》作者的一封信
- java游戏猿人时代_猿人时代游戏下载-猿人时代游戏(附攻略)正版下载v1.0.0-第五驱动...
- MySQL面试问题包含答案仅参考
- 怎样提高工作积极性与工作效率
- linux(07)之内核系统调用
- SQL注入——联合注入
- 吴雪筠校友报告会 --职场仪表—心态—自强之道
- 「镁客早报」特斯拉称已与中国多家银行达成协议获取建厂贷款;沃达丰将在英国19个城市推出5G服务... 1
- 带孩子们做环球旅行的读后感_郭晶晶带孩子做家务:做家务的孩子,究竟赢在哪里了?...
- 中英词典+mysql_php+mysql实现英汉查询词典的功能
- Java开发环境简介及下载
热门文章
- 在windows环境下ftp服务器的文件上传和下载
- CSS3动画和VUE动画整理
- pythonturtle画彩虹蟒蛇_python如何用turtle库画蟒蛇?
- oracle中12523,【Oracle】静态监听导致的ORA-12523错误
- span 里面的文字不显示_“无糖饮料”显示不含糖,为何还这么甜?原来里面加了这个...
- python 找质数的个数_用Python打造一款文件搜索工具,所有功能自己定义!
- 如何反映两条曲线的拟合精度_用水平仪如何检测导轨的直线度?
- 类java的步骤_java类加载的过程
- 腾讯视频真实下载地址_腾讯视频如何多倍速播放视频
- java 自定义注解+AOP实现日志记录