微信小程序点餐系统的开发与实现

这篇具有很好参考价值的文章主要介绍了微信小程序点餐系统的开发与实现。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

作者主页:编程千纸鹤

作者简介:Java、前端、Pythone开发多年,做过高程,项目经理,架构师

主要内容:Java项目开发、毕业设计开发、面试技术整理、最新技术分享

项目编码:BS-XCX-005

一,项目简介

       随着互联网技术逐渐的深入到生活,人们的生活消费习惯,已经发生很大的变化。就餐厅用餐而言,互联网技术和移动互联网技术的应用也己相关普及,比如早几年前就出现的餐厅点餐系统,就通过信息化的技术手段代替原来纸质菜单点餐的传统方式。这种方式一是可以方便顾客实现点餐叫号,二是方便商家进行人单合一的统一管理,减少了报单出错率,提升了用户的体验,所以得以大面积的应用和普及。

       而移动互联网的出现,让智能手机的赋能更大广泛,腾讯微信适时推出微信小程序,使得智能手机的用户可以通过微信进行相应的信息化管理和参与,比如目前大面积应用的小程序商城,就将商业的业态从传统的PC互联网直接植入手机移动互联网,这种轻量级的APP应用,极大的方便使用者,也给商家通过微信带了大量的流量。

     微信小程序的功能推出,极大方便了全国2亿多的微信用户,在这个生态体系上构建了一个宠大的商业帝国,而小程序开发的应用,又快速的渗透到各个行业。在餐饮行业的信息化应用,也发生了一系统变化,比如通过微信小程序实现用户自助点餐功能,这就极大的方便了用户,减少了点餐的距离限制,用户可以在餐厅打开手机微信小程序进行点餐,也可以在去餐厅的途中或者甚至在家就可以点餐,打破了时空的限制,更加的灵活方便。经过调查和实地分析,基于对微信小程序的研究,开发了这套微信小程序点餐系统,为餐饮业的信息化建设添砖加瓦。

根据上述对微信小程序点餐系统的功能性需求分析,设计出了微信小程序点餐系统的功能结构图,如下图1-1所示。

微信小程序点餐系统的开发与实现

图1-1 系统功能结构图

     前台用户登陆小程序,采用微信账户绑定登陆实现。目前由于测试账户没开通此权限,只能用开发者的身份来进行测试进行。前台用户可以在手机小程序上浏览系统发布的餐品,实现完整的订餐流程。看中相应的餐品可以添加到购物车中,然后下单购买,并可以查看相关的订单信息。

    后台用户必须登陆方可进行相应的操作,主要进行相应的业务数据管理。

    用户管理:可以管理前端和后端的用户信息,进行相应的数据增删改查操作。

    餐品管理:可以管理点餐系统发布的餐品信息,进行相应的数据增删改查操作。

    订单管理:对前端用户的下单信息进行相应的管理操作。

    分类管理:主要实现对前端点餐显示的餐品分类管理。

    系统管理:主要可以实现对系统的相关基本信息的管理操作。

二,环境介绍

后台开发:

语言环境:Java:  jdk1.8

数据库:Mysql: mysql5.7

应用服务器:Tomcat:  tomcat8.5.31

开发工具:IDEA或eclipse

开发技术:Springboot

前端开发:

开发工具:微信开发者工具

开发技术:微信小程序

整体采用前后端分离开发,前后端单独测试

三,系统展示

3.1 微信小程序功能模块的展示

3.1.1 前台首页展示

   微信小程序点餐前端主要就是实现点餐操作,主要包含预约点餐、菜单浏览、电话订餐、客服个模块。具体操作界面展示如下图4-1所示。

微信小程序点餐系统的开发与实现

图3-1 前台首页界面

3.1.2 前台菜单浏览模块

用户进入微信点餐系统进入浏览菜单即可查看餐厅发布的餐品信息,具体如下图3-2所示:

微信小程序点餐系统的开发与实现

图3-2 菜单浏览界面

3.1.3前台用户购物车模块

    微信小程序点餐前台用户登陆系统后可以进入预约点餐模块将餐品添加到购物车。用户登陆直接绑定用户微信账户进行登陆,非常方便。添加购物车操作界面如下图3-3所示。

微信小程序点餐系统的开发与实现

图3-3前台用户添加购物车操作界面

3.1.4 前台用户点餐支付模块

    前台用户登陆点餐系统后,可以进入预约点餐模块将喜欢的餐品添加到购物车后提交订单并进行支付购买。完成餐品购买后并完成整个订单操作后,可以对餐品进行相关的评论。相关管理操作界面如下图3-4所示。

微信小程序点餐系统的开发与实现

图3-4前台用户点餐支付界面

3.1.4前台用户个人订单管理模块

    微信小程序点餐前台用户登陆系统后可以在我的模块中个人订单管理模块中管理个人的订单信息。前端用户个人订单管理操作界面如下图3-5所示。

微信小程序点餐系统的开发与实现

图3-5前台用户个人订单管理操作界面

3.2后台功能模块的展示

3.2.1用户登录功能

    微信小程序点餐后台用户如果想要对餐厅的相关信息进行管理操作,首先要登录系统,才可展开相关的操作。输入手机号和密码后用户登陆界面如下图3-6所示。

微信小程序点餐系统的开发与实现

图3-6用户登录操作界面

3.2.2用户管理功能

    微信小程序点餐系统管理员用户登陆系统后,可以进入用户管理菜单进行相应的管理员用户信息管理。用户管理操作界面如下图3-7、3-8所示:

微信小程序点餐系统的开发与实现

图3-7后台用户管理功能界面图

微信小程序点餐系统的开发与实现

图3-8后台用户新增界面图

3.2.3 后台餐品管理操作UI

    微信小程序点餐管理员用户登陆系统后,可以进入餐品管理菜单进行相应的餐品信息管理。其中主要包含餐品的添加、修改、查询、下架操作等,添加餐品时可以指定餐品的图片进行展示。餐品信息管理操作界面如下图3-9、3-10所示。

微信小程序点餐系统的开发与实现

图3-9后台餐品管理功能UI界面

微信小程序点餐系统的开发与实现

图3-10后台餐品新增功能UI界面

3.2.4 后台餐品订单管理操作UI

    微信小程序点餐系统管理员用户登陆系统后,可以进入餐品订单管理菜单进行相应的餐品订单信息管理。其中主要包含餐品订单的查询、订单明细的查看等,添加餐品时可以上传餐品的图片进行展示。订单信息管理操作界面如下图3-11、3-12所示。

微信小程序点餐系统的开发与实现

图3-11后台订单管理功能UI界面

微信小程序点餐系统的开发与实现

图3-12后台订单详情查看功能UI界面

四,核心代码展示

package com.imooc.controller;

import com.imooc.constant.CookieConstant;
import com.imooc.constant.RedisConstant;
import com.imooc.dataobject.SellerInfo;
import com.imooc.enums.ResultEnum;
import com.imooc.exception.SellException;
import com.imooc.form.SellerForm;
import com.imooc.repository.SellerInfoRepository;
import com.imooc.utils.CookieUtil;

import org.springframework.beans.BeanUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.validation.BindingResult;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.servlet.ModelAndView;

import java.util.List;
import java.util.Map;
import java.util.UUID;

import javax.servlet.http.Cookie;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.validation.Valid;

import lombok.extern.slf4j.Slf4j;


@RestController
@RequestMapping("/admin")
@Slf4j
public class AdminUserController {

    @Autowired
    SellerInfoRepository repository;

    /**
     * 后台用户登陆操作
     * @param phone
     * @param password
     * @param response
     * @return
     */
    @GetMapping("/loginAdmin")
    public String loginAdmin(@RequestParam("phone") String phone,
                             @RequestParam("password") String password,
                             HttpServletResponse response) {
        SellerInfo sellerInfo = repository.findByPhone(phone);
        log.info("商家信息={}", sellerInfo);
        if (sellerInfo != null && sellerInfo.getPassword().equals(password)) {
            String token = UUID.randomUUID().toString();
            log.info("登录成功的token={}", token);
            Integer expire = RedisConstant.EXPIRE;
            //3. 设置token至cookie
            CookieUtil.set(response, CookieConstant.TOKEN, token, expire);
            return "登录成功";
        } else {
            throw new SellException(ResultEnum.LOGIN_FAIL);
        }
    }

    @GetMapping("/logout")
    public ModelAndView logout(HttpServletRequest request,
                               HttpServletResponse response,
                               Map<String, Object> map) {
        //1. 从cookie里查询
        Cookie cookie = CookieUtil.get(request, CookieConstant.TOKEN);
        if (cookie != null) {
            //2. 清除cookie
            CookieUtil.set(response, CookieConstant.TOKEN, null, 0);
        }
        map.put("msg", ResultEnum.LOGOUT_SUCCESS.getMessage());
        map.put("url", "/sell/seller/order/list");
        return new ModelAndView("common/success", map);
    }

    /*
     * 页面相关
     * */

    @GetMapping("/list")
    public ModelAndView list(Map<String, Object> map) {
        List<SellerInfo> categoryList = repository.findAll();
        map.put("categoryList", categoryList);
        return new ModelAndView("admin/list", map);
    }

    @GetMapping("/index")
    public ModelAndView index(@RequestParam(value = "sellerId", required = false) Integer sellerId,
                              Map<String, Object> map) {
        SellerInfo sellerInfo = repository.findBySellerId(sellerId);
        map.put("category", sellerInfo);

        return new ModelAndView("admin/index", map);
    }

    /**
     * 保存/更新
     */
    @PostMapping("/save")
    public ModelAndView save(@Valid SellerForm form,
                             BindingResult bindingResult,
                             Map<String, Object> map) {
        log.info("SellerForm={}", form);
        if (bindingResult.hasErrors()) {
            map.put("msg", bindingResult.getFieldError().getDefaultMessage());
            map.put("url", "/sell/admin/index");
            return new ModelAndView("common/error", map);
        }
        SellerInfo sellerInfo = new SellerInfo();
        try {
            if (form.getSellerId() != null) {
                sellerInfo = repository.findBySellerId(form.getSellerId());
            }
            BeanUtils.copyProperties(form, sellerInfo);
            repository.save(sellerInfo);
        } catch (SellException e) {
            map.put("msg", e.getMessage());
            map.put("url", "/sell/admin/index");
            return new ModelAndView("common/error", map);
        }

        map.put("url", "/sell/admin/list");
        return new ModelAndView("common/success", map);
    }
}
package com.imooc.controller;

import com.imooc.VO.ResultVO;
import com.imooc.converter.OrderForm2OrderDTOConverter;
import com.imooc.dto.OrderDTO;
import com.imooc.enums.ResultEnum;
import com.imooc.exception.SellException;
import com.imooc.form.OrderForm;
import com.imooc.service.BuyerService;
import com.imooc.service.OrderService;
import com.imooc.utils.ResultVOUtil;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.util.CollectionUtils;
import org.springframework.util.StringUtils;
import org.springframework.validation.BindingResult;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;

import java.util.HashMap;
import java.util.List;
import java.util.Map;

import javax.validation.Valid;

import lombok.extern.slf4j.Slf4j;

/**
 * Created by znz
 */
@RestController
@RequestMapping("/buyer/order")
@Slf4j
public class BuyerOrderController {

    @Autowired
    private OrderService orderService;

    @Autowired
    private BuyerService buyerService;

    //创建订单
    @PostMapping("/create")
    public ResultVO<Map<String, String>> create(@Valid OrderForm orderForm,
                                                BindingResult bindingResult) {
        if (bindingResult.hasErrors()) {
            log.error("【创建订单】参数不正确, orderForm={}", orderForm);
            throw new SellException(ResultEnum.PARAM_ERROR.getCode(),
                    bindingResult.getFieldError().getDefaultMessage());
        }

        OrderDTO orderDTO = OrderForm2OrderDTOConverter.convert(orderForm);
        if (CollectionUtils.isEmpty(orderDTO.getOrderDetailList())) {
            log.error("【创建订单】购物车不能为空");
            throw new SellException(ResultEnum.CART_EMPTY);
        }

        OrderDTO createResult = orderService.create(orderDTO);

        Map<String, String> map = new HashMap<>();
        map.put("orderId", createResult.getOrderId());

        return ResultVOUtil.success(map);
    }

    //订单列表
    @GetMapping("/listByStatus")
    public ResultVO<List<OrderDTO>> listByStatus(@RequestParam("openid") String openid,
                                                 @RequestParam(value = "orderStatus", defaultValue = "0") Integer orderStatus) {
        if (StringUtils.isEmpty(openid)) {
            log.error("【查询订单列表】openid为空");
            throw new SellException(ResultEnum.PARAM_ERROR);
        }

        List<OrderDTO> orderList = buyerService.findOrderList(openid, orderStatus);
        return ResultVOUtil.success(orderList);
    }


    //订单详情
    @GetMapping("/detail")
    public ResultVO<OrderDTO> detail(@RequestParam("openid") String openid,
                                     @RequestParam("orderId") String orderId) {
        OrderDTO orderDTO = buyerService.findOrderOne(openid, orderId);
        return ResultVOUtil.success(orderDTO);
    }

    //确认收货
    @PostMapping("/sure")
    public ResultVO sure(@RequestParam("openid") String openid,
                           @RequestParam("orderId") String orderId) {
        buyerService.cancelOrder(openid, orderId);
        return ResultVOUtil.success();
    }

    //取消订单
    @PostMapping("/cancel")
    public ResultVO cancel(@RequestParam("openid") String openid,
                           @RequestParam("orderId") String orderId) {
        buyerService.cancelOrder(openid, orderId);
        return ResultVOUtil.success();
    }
}

package com.imooc.controller;

import com.imooc.VO.ResultVO;
import com.imooc.dataobject.Comment;
import com.imooc.dataobject.OrderMaster;
import com.imooc.dto.OrderDTO;
import com.imooc.enums.OrderStatusEnum;
import com.imooc.enums.ResultEnum;
import com.imooc.exception.SellException;
import com.imooc.repository.CommentRepository;
import com.imooc.repository.OrderMasterRepository;
import com.imooc.service.OrderService;
import com.imooc.utils.ResultVOUtil;

import org.springframework.beans.BeanUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.util.StringUtils;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;

import java.util.List;

/**
 * desc:评论相关
 */
@RestController
public class CommentController {

    @Autowired
    private CommentRepository repository;
    @Autowired
    private OrderService orderService;
    @Autowired
    private OrderMasterRepository masterRepository;

    //订单详情
    @PostMapping("/comment")
    public ResultVO<Comment> detail(@RequestParam("openid") String openid,
                                    @RequestParam("orderId") String orderId,
                                    @RequestParam("name") String name,
                                    @RequestParam("avatarUrl") String avatarUrl,
                                    @RequestParam("content") String content) {
        if (StringUtils.isEmpty(openid) || StringUtils.isEmpty(orderId)) {
            throw new SellException(ResultEnum.PARAM_ERROR);
        }
        //提交评论
        Comment comment = new Comment();
        comment.setName(name);
        comment.setAvatarUrl(avatarUrl);
        comment.setOpenid(openid);
        comment.setContent(content);
        Comment save = repository.save(comment);

        //修改订单状态
        OrderDTO orderDTO = orderService.findOne(orderId);
        orderDTO.setOrderStatus(OrderStatusEnum.COMMENT.getCode());
        OrderMaster orderMaster = new OrderMaster();
        BeanUtils.copyProperties(orderDTO, orderMaster);
        OrderMaster updateResult = masterRepository.save(orderMaster);
        return ResultVOUtil.success(save);
    }

    //所有评论
    @GetMapping("/commentList")
    public ResultVO<List<Comment>> commentList() {
        List<Comment> all = repository.findAll();
        return ResultVOUtil.success(all);
    }

    //单个用户的所有评论
    @GetMapping("/userCommentList")
    public ResultVO<List<Comment>> userCommentList(@RequestParam("openid") String openid) {
        List<Comment> all = repository.findAllByOpenid(openid);
        return ResultVOUtil.success(all);
    }
}

五,项目总结

    微信小程序点餐系统的使用者主要包含两种用户角色,其一是管理员角色,其二是前台用户角色,这两个角色的具体功能如下:

    管理员角色:管理员登录微信小程序点餐系统后台管理后可以进行相应的管理操作,主要包含:用户管理、餐品管理、订单管理、分类管理等操作;

     前台用户角色:前台用户登录微信小程序点餐系统后可以进行餐品浏览、添加购物车、在线点餐、个人订单管理等操作。

     系统整体功能完整,根据微信小程序点餐系统需求分析,进行了微信小程序点餐系统概要设计,并在此基础上进行详细设计。完成了整个项目的详细设计后,就开始了项目的编码阶段。文章来源地址https://www.toymoban.com/news/detail-495131.html

到了这里,关于微信小程序点餐系统的开发与实现的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 微信小程序毕业设计作品成品(75)微信小程序在线外卖点餐系统设计与实现

    博主介绍: 《Vue.js入门与商城开发实战》《微信小程序商城开发》图书作者,CSDN博客专家,在线教育专家,CSDN钻石讲师;专注大学生毕业设计教育和辅导。 所有项目都配有从入门到精通的基础知识视频课程,免费 项目配有对应开发文档、开题报告、任务书、PPT、论文模版

    2024年02月08日
    浏览(50)
  • 微信小程序毕业设计作品成品(06)微信小程序外卖点餐平台系统设计与实现

    博主介绍: 《Vue.js入门与商城开发实战》《微信小程序商城开发》图书作者,CSDN博客专家,在线教育专家,CSDN钻石讲师;专注大学生毕业设计教育和辅导。 所有项目都配有从入门到精通的基础知识视频课程,免费 项目配有对应开发文档、开题报告、任务书、PPT、论文模版

    2024年02月07日
    浏览(48)
  • 微信小程序毕业设计作品成品(49)微信小程序奶茶外卖点餐系统设计与实现

    博主介绍: 《Vue.js入门与商城开发实战》《微信小程序商城开发》图书作者,CSDN博客专家,在线教育专家,CSDN钻石讲师;专注大学生毕业设计教育和辅导。 所有项目都配有从入门到精通的基础知识视频课程,免费 项目配有对应开发文档、开题报告、任务书、PPT、论文模版

    2024年02月08日
    浏览(47)
  • 基于php微信小程序外卖点餐系统设计与实现

    开发概要 开发操作系统:windows10 + 4G内存 + 500G 小程序开发:微信开发者工具(MINA框架) 后台环境:IIS +PHP 后台开发语言:PHP 后台开发工具:Dreamweaver +PhpStorm 数据库:mysql8 数据库管理工具:navicat 其他开发语言:html + css +javascript

    2024年02月11日
    浏览(46)
  • 基于微信小程序的奶茶点餐系统的设计与实现

    摘  要 使用智能手机的用户经过多年的使用习惯,已经越来越不喜欢安装各种的APP,除了正常生活和工作所必须的APP,不喜欢因为喜欢某些内容而被强制安装APP软件了。最近几年,随着微信生态的布局,通过开发微信小程序接口,让广大用户可以通过微信直接访问小程序,不

    2024年03月11日
    浏览(62)
  • 项目分享:基于微信小程序的点餐系统设计与实现

    A. 研究背景和意义 餐饮行业的现状和发展趋势:餐饮行业是一个不断发展的行业,随着人们生活水平的提高和消费观念的改变,人们对于餐饮服务的要求也越来越高。传统的点餐方式已经不能满足人们的需求,因此需要研发更加智能化、便捷化的点餐系统,来提高用户体验和

    2024年01月20日
    浏览(54)
  • 【计算机开题报告】基于微信小程序的点餐系统设计与实现

    基于微信小程序的点餐系统设计与实现 近年来,随着国家的改革和建设,社会的不断进步、经济的加速发展使得人们的购买力也在逐渐增加,消费的类型变得更加多元化。 在这样的大趋势之下,智能时代的到来,人们对生活效率的追求越来越高,以往的点餐系统效率低下浪

    2024年02月05日
    浏览(41)
  • 计算机团队毕业设计:JAVA在线外卖点餐系统+微信小程序系统设计与实现

    本次选用JAVA进行在线外卖点餐系统团队毕业设计开发,包含:WEB网站系统+微信小程序系统。 开发操作系统:windows10 + 8G内存 + 500G WEB开发环境:JDK1.8 + Tomcat8 WEB开发语言:Java WEB开发框架:springboot WEB模板引擎:Thymeleaf WEB常规技术:html + css +javascript WEB开发工具:Idea 数据库:

    2024年02月13日
    浏览(60)
  • 基于微信小程序的奶茶点餐系统的设计与实现(论文+源码)_kaic

    摘  要 使用智能手机的用户经过多年的使用习惯,已经越来越不喜欢安装各种的APP,除了正常生活和工作所必须的APP,不喜欢因为喜欢某些内容而被强制安装APP软件了。最近几年,随着微信生态的布局,通过开发微信小程序接口,让广大用户可以通过微信直接访问小程序,不

    2024年03月22日
    浏览(55)
  • 基于SpringBoot+Vue+uniapp微信小程序的自助点餐系统的详细设计和实现

    💗博主介绍:✌全网粉丝10W+,CSDN特邀作者、博客专家、CSDN新星计划导师、全栈领域优质创作者,博客之星、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java、小程序技术领域和毕业项目实战✌💗 👇🏻 精彩专栏 推荐订阅👇🏻 2023-2024年最值得选的微信小程序毕业设计

    2024年04月14日
    浏览(81)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包