基于Java+SpringBoot+vue+element实现前后端分离蛋糕商城系统详细设计

Posted java李杨勇

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了基于Java+SpringBoot+vue+element实现前后端分离蛋糕商城系统详细设计相关的知识,希望对你有一定的参考价值。

博主介绍公司项目主程、全网粉丝15W+,csdn特邀作者、博客专家、CSDN新星计划导师、java领域优质创作者,CSDN博客之星TOP100、掘金/华为云/阿里云/InfoQ/51CTO等平台优质作者、专注于Java技术领域和毕业设计

公众号:java李杨勇   简历模板、学习资料、面试题库等都给你💪

🍅文末获取源码联系🍅

🍅CSDN官方推荐10W+JAVA技术人文章发布打卡社区🍅

前言介绍:

       随着社会的快速发展,计算机的影响是全面且深入的。人们生活水平的不断提高,日常生活中用户对网上蛋糕商城方面的要求也在不断提高,网上蛋糕商城得到广大用户的青睐,使得网上蛋糕商城的开发成为必需而且紧迫的事情。网上蛋糕商城主要是借助计算机,通过对网上蛋糕商城所需的信息管理,增加用户的选择,同时也方便对广大用户信息的及时查询、修改以及对用户信息的及时了解。网上蛋糕商城对用户带来了更多的便利,该系统通过和数据库管理系统软件协作来满足用户的需求。计算机技术在现代管理中的应用,使计算机成为人们应用现代技术的重要工具。能够有效的解决获取信息便捷化、全面化的问题,提高效率。 

流程分析:

系统开发流程

网上蛋糕商城系统开发时,首先进行需求分析,进而对系统进行总体的设计规划,设计系统功能模块,数据库的选择等,本系统的开发流程如图所示

图系统开发流程图

 用户登录流程

为了保证系统的安全性,要使用本系统对系统信息进行管理,必须先登陆到系统中。如图所示。

图登录流程图

系统操作流程

用户打开并进入系统后,会先显示登录界面,输入正确的用户名和密码,系统自动检测信息,若信息无误,则用户会进入系统功能界面,进行操作,否则会提示错误无法登录,操作流程如图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 
    @Autowired
    private 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 
	
	
    @Override
    public PageUtils queryPage(Map<String, Object> params) 
        Page<OrdersEntity> page = this.selectPage(
                new Query<OrdersEntity>(params).getPage(),
                new EntityWrapper<OrdersEntity>()
        );
        return new PageUtils(page);
    
    
    @Override
	public 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;
 	
    
    @Override
	public List<OrdersVO> selectListVO(Wrapper<OrdersEntity> wrapper) 
 		return baseMapper.selectListVO(wrapper);
	
	
	@Override
	public OrdersVO selectVO(Wrapper<OrdersEntity> wrapper) 
 		return baseMapper.selectVO(wrapper);
	
	
	@Override
	public List<OrdersView> selectListView(Wrapper<OrdersEntity> wrapper) 
		return baseMapper.selectListView(wrapper);
	

	@Override
	public OrdersView selectView(Wrapper<OrdersEntity> wrapper) 
		return baseMapper.selectView(wrapper);
	


获取源码:

 大家点赞、收藏、关注、评论啦 、查看👇🏻👇🏻👇🏻微信公众号获取联系方式👇🏻👇🏻👇🏻

打卡 文章 更新 245/  365天

 精彩专栏推荐订阅下方专栏👇🏻👇🏻👇🏻👇🏻

Java项目精品实战案例《100套》

web前端期末大作业网页实战《100套》

以上是关于基于Java+SpringBoot+vue+element实现前后端分离蛋糕商城系统详细设计的主要内容,如果未能解决你的问题,请参考以下文章

Vue项目安装流程(vue+ele+mongodb+axios)

Java+MySQL 基于Springboot+vue的旧物置换网站#毕业设计

Java+MySQL 基于Springboot+vue的疫情网课管理系统#毕业设计

Java+MySQL基于Springboot+vue的酒店民宿管理系统前后台#毕业设计

计算机毕业设计之java+springboot基于vue的学习平台

java基于springboot+vue的汉服交流网站