微信扫码点餐小程序的设计与实现_张娅妮.pdf

第 31 卷 第 4 期 2023 年 8 月Vol.31 No.4Aug.2023电脑与信息技术Computer and Information Technology文章编号：1005-1228（2023）04-0062-05微信扫码点餐小程序的设计与实现张娅妮，刘霞（黔南民族师范学院计算机与信息学院，贵州 都匀 558000）摘要：在“移动互联网+”不断更新的背景下，为了提高餐饮业管理信息化发展，设计了一套微信扫码点餐小程序。程序的前端采用微信小程序原生框架、css 样式、JavaScript 语言；后台分为管理后台和数据后台，分别采用云开发 Cms 内容管理系统、web 网页，小程序云开发、云函数、云存储、云数据库。支持扫码点餐、菜单浏览、排号等位、搜索菜品、查看购物车、用户管理、商品管理、用户订单处理、用户评价等操作与管理。该微信小程序避免顾客浪费时间的同时提升了商家的工作效率。关键词：扫码；点餐；小程序；云开发；微信开发中图分类号：TP311.56文献标识码：ADesign and Implementation of WeChat Sweep Code Ordering AppletZHANG Ya-ni,LIU Xia（School of Computer and Information,Qiannan Normal University of Nationalities,Duyun 558000,China）Abstract：Under the background of mobile Internet+,a set of WeChat code ordering applet is designed to improve the development of restaurant management information.The front-end of the program adopts the native framework of WeChat applet,css style,JavaScript language,and the back-end is divided into management back-end and data back-end,which adopt cloud development Cms content management system,web page,applet cloud development,cloud function,cloud storage,cloud database respectively.It supports the operation and management of sweeping code ordering,menu browsing,ranking and other positions,searching dishes,viewing shopping cart,user management,commodity management,user order processing,user evaluation,etc.The program avoids customers time wasting and enhances merchants work efficiency.Key words:sweep code;ordering;small program;cloud development;WeChat development收稿日期：2022-11-23基金项目：贵州省教育厅 2022 年度自然科学研究项目（平台类）（贵州省复杂系统与智能优化特色重点实验室 合同编号：黔教技 2022058 号）；2020 年度黔南州理论创新课题（课题编号：Qnzskl-2020-02）作者简介：张娅妮(1980-)，女，满族，四川成都人，副教授，工程硕士，主要研究方向：计算机信息管理、信息技术教育；刘霞（1997-），女，贵州桐梓人，本科学生。随着“移动互联网+”不断发展，人们对于生活的消费方式和理念发生了巨大转变，微信已成为必备的手机软件。其中微信小程序占用的资源比较少，相较于下载各种各样的 app，人们更倾向于使用它。目前越来越多的餐厅开始使用微信扫码点餐小程序功能，对于用户，它是一种不需要下载安装即可使用的工具，使用难度比 app 小很多，只需在手机上浏览菜品，就可以直接在网上实现点餐的全过程。对于商家，菜品的保鲜时间相较于别的产品比较短，有了订单后，商家能根据客户的需求提前准备好充足的材料。对于开发者，开发一个 app 与开发一个微信小程序来说，微信小程序的门槛比较低，人力花费少，商家可以将更多的资金花在别的方面。同时小程序安全稳定、保密性强，它需要审核才能发布，它的功能场景丰富，可以调用比 H5 更多的手机系统来进行开发。为了提高餐饮业管理信息化发展，本文设计了一套微信扫码点餐小程序，避免顾客浪费时间的同时提升了商家的工作效率。1程序功能设计1.1功能需求分析在小程序前期开发过程中，需要对项目进行需求DOI:10.19414/ki.1005-1228.2023.04.011第 31 卷 第 4 期63张娅妮等，微信扫码点餐小程序的设计与实现分析，首先要了解程序具体做什么，实现什么样的功能，在功能模块中细分每个功能模块的使用背景，只有这样在程序开发中，才不会重复出现因为架构设计的缺陷，导致再次设计底层数据结构的发生，此外，有些非功能的特性，比如云数据库性能、安全性的考虑、网速的反映时间都是作为需求分析的约束条件，也是程序开发完成后，在运行时需要分析的目标。微信扫码点餐小程序主要由前台用户点餐模块和后台管理员模块组成。程序首页有以下几个功能：扫码点餐、菜单浏览、排号等位、饭店地址、顶部轮播图、搜索菜品、热门菜品推荐，为浏览网页的用户提供直观的界面需求。一般顾客可以对页面商品进行浏览，要对商品进行任何操作的话，就需要微信授权登录。微信扫码点餐小程序核心模块由菜品展示模块、购物车模块、订单业务模块组成，下面介绍这几个功能模块的需求分析：（1）菜品展示模块：当顾客进入首页浏览时，菜品列表是首要展现的页面，里面主要展现了该店菜品信息，包括分类、价格、菜品名、销量等。如图1所示。图 1菜品展示模块图图 2购物车模块（2）购物车模块；当用户登陆后，选定指定的菜品后，加入购物车中，可以自动结算，如图2所示。（3）订单业务模块：用户下单后，每笔订单都有自己的订单编号和餐桌地址。如图 3 所示。图 3订单业务模块图图 4用户需求用例图针对微信扫码点餐小程序的用户需求，在用户登录小程序后可以在列表里下单，也能查看菜品的分类，还可以直接搜索想要的菜品，在上餐吃完后还可以进行相关评价。用户的需求用例图如图 4 所示：针对管理员的使用需求，管理员在登录后台后可以对相关菜品进行上下架，还可以修改价格，同时也可以管理用户信息和订单信息。管理员的需求用例图如图 5 所示：图 5管理员需求用例图 1.2非功能性需求该程序不仅要满足功能性需求，还需要满足看不到的非功能性需求，比如系统的兼容性、用户界面整体性、网页访问的流畅性，主要归纳如下几点，见表1：表 1非功能性需求类别需求描述兼容性支持手机移动扫码界面性程序整体美观、元素搭配协调安全性访问控制不受到攻击，防止 sql 注入1.3流程图设计用户登陆系统工作流程为：分为前端用户登陆和管理员用户登陆，前端注册用户可在商品中浏览商品，购买商品，等支付完成后即可排号等待；管理员登陆系统后可对系统中的用户管理、商品管理及订单管理。以下是总体的流程图设计如图6所示。后厨管理流程：用户排号等位信息传来后观察是否有出现空位，反馈信息到顾客并通知点餐。点餐完成后，信息传到后厨电脑与信息技术 2023 年 8 月64端进行处理。后厨管理流程如图 7 所示。图 6用户登陆系统工作流程 图 7后厨管理流程1.4程序 ER 图 图 8程序 ER 图2小程序功能模块实现本次程序它的前端是采用微信小程序原生框架、css 样式、JavaScript 语言，后台分为管理后台和数据后台，分别采用云开发 Cms 内容管理系统、web 网页，小程序云开发、云函数、云存储、云数据库来完成对小程序的设计。首先点击Cms内容管理系统工具左上角云开发，会弹出云开发的控制界面，可根据实现开发的需求，选中云开发的方式。点击云开发中的内容管理，这种方式，可以快速定位控制微信小程序的前端开发数据，在完成内容管理过程中，需要建设自己的账号，管理自己云平台中的数据。在 cms 内容管理中，可以导入建站模型，也可以新建，这样就可完成 cms 跟微信小程序的 api 接口的对接程序。内容模型的内容就是上章节提到的 json 数据，完成数据的导入操作，即可完成 cms 的操作。2.1前端页面功能实现2.1.1 登陆模块实现当用户进入微信小程序时，程序会提示是否授权登陆，当授权登陆成功后，微信官方会将获取到的相关个人信息发送到前端，并进行载入，这些过程都需要经过官方授权的 Openid 进行 MD5 加密，主要通过安全性机制，确认信息的唯一性，如图 9 所示。图 9登录模块图2.1.2 首页模块实现用户首先用微信扫码进入点餐界面，上面大图是推荐特色菜，大图下是搜索框，点餐的用户可以在这里对商家的菜品进行搜索操作。搜索框支持模糊查询，即输入任何一个关键字符，包含这个字符的所有菜品就会在下方依次显示。搜索框下是四个功能模块，分别是:“扫码点餐”“菜单预览”“排号等位“饭店信息”，点击对应的图片即可进行相应的操作。在首页上除了可以单次搜索菜品，还可以分类显示全部菜品，或者按照销量的多少进行搜索。点击选中的菜品图片即可点开其详情介绍。如图 10 所示。2.1.3 菜品模块实现顾客通过该功能浏览菜品列表对菜品进行选择第 31 卷 第 4 期65后下单，列表中的菜品按菜品分类进行展示，顾客可先选择类别，然后选择对应类别列表中的菜品。选中后的菜品被加入购物车，也可将其从购物车中移出。在购物车中可以对已选菜品进行删除和数量修改操作.顾客选好菜品后，即可创建订单，系统将用户提交的订单发送到后台如图 11 所示。2.1.4 购物车模块实现选择菜品生成菜单后，可点击菜品后面的加减号增减其数量，最后加入购物车。也可以先加入购物车，然后再对菜品数量进行增减等操作。如图 12 所示。图 13订单模块图 图 14排号模块图 2.1.5 订单模块实现用户点击付款后，该订单将会出现在“我的订单”当中，用户可以查看订单详情，以下是订单 4 种状态待上餐、待评价、已完成、已取消，如图 13 所示。2.1.6 排号模块实现该功能主要针对用户下单后，用户可以排号，当到该用户就餐时，后端会发出叫号信息，如图14所示。图 1增加后厨管理模块图 图 16后厨订单管理模块图2.2后厨管理功能实现后台通过 cms 内容增加后厨管理员，之后管理员通过此设置账号密码并登录，用户相应的浏览商品、选择菜单操作信息会传递给后厨进行处理。如图 15所示。用户点餐结束会生成订单信息传给后厨同时伴随音频提示，订单上会出现三个选项：“待制作菜品”、图 10首页模块图图 11菜品模块图图 12购物车模块图张娅妮等，微信扫码点餐小程序的设计与实现电脑与信息技术 2023 年 8 月66“已上餐待用户评价”与“已完成”。用户拿号进行排号后，后厨管理端经过 text 文本的展示提示，在云函数中处理。经过 Type 区分，获得用户排号的具体信息，通过后提示用户进行就餐。用户用餐完毕后可对该商家和品尝过的菜品进行有效评价。如图 16 所示。3结束语小程序以微信为依托平台，用户市场巨大。它无需安装卸载即可便捷地获取服务，节省移动端存储空间的消耗。本文结合餐饮业的日常流程来设计一个微信扫码点餐小程序，该程序给用户带来了便利的同时提高了商家的工作效率。参考文献：1 胡向颖.基于 Android 的餐厅点餐系统的设计与实现 D.青岛科技大学,2018.2 张睿,沈浩,徐祎倩,等.基于微信小程序的企业信息服务系统设计与实现 J.电脑与电信,2019(12):53-56.3 田凯茜.基于微信小程序的心情调节终端 J.技术与市场,2019,26(12):79-80.4 蒙海莹.在线评测微信小程序的设计与实现 J.湖北农机化,2020(01):139-140.5 周亚楠,张佳仪,任雨杰,等.基于大数据理论指导下的高校食堂点餐微信小程序功能设计 J.电脑知识与技术,2019,15(34):55-59+68.6 王昱婷,刘静,燕明媚,等.基于微信小程序的大学生二手物品交易平台设计与开发 J.电脑知识与技术,2019,15(32):283-284+286.7 闫小坤.微信小程序开发详解 M.北京:清华大学出版社,2017.程序端下载浏览。图 7下载资源界面7结束语微信小程序快捷方便、简单高效等特点正在潜移默化地改变着人们的生活与学习方式。本文基于微信小程序设计了一个数字媒体交互设计考证的理论练习题库系统，能够有效解决 1+X 数字媒体交互设计职业技能等级证书的通过率问题，同时该小程序具备了移动端的线上学习功能，基本上能满足学生的需要。本文介绍了系统的总体设计和具体模块的实现。数字媒体交互设计资源包中内容的选择也是设计的重点，内容的选取需要考虑学生的学习能力和数据库设计可行性。实践证明，该系统减轻教师的教学负担，提高学生学习效率。不足地方就是只考虑到满足目前学生学习的需要，今后将根据实际工作需要不断探究，进一步开发完善此系统。参考文献：1 赵剑冬，许智超.微信小程序实战课程开发与实施 J.现代计算机，2020(30)：99-103.2 邹军华，张涵.基于微信小程序的初中语文练习题库设计与实现 J.中国教育技术装备，2021(18):29-31.3 邢 榕 珊，匡 芳 君.微 信 小 程 序 设 计 J.计 算 机 时代,2018(08):9-12.4 张沈梅,孙昊,王玲等.基于微信小程序的课程在线测试系统 J.电脑知识与技术，2018,14(32):82-84,88.5 李益双.基于小程序的实验室教学日志系统的设计 J.现代信息科技，2020,4(22):107-109.（上接第 61 页）