【基于微信小程序的菜篮子小程序设计8800字（论文）】

基于微信小程序的菜篮子小程序设计摘要随着网络的快速发展，微信小程序的开发技术逐渐简化，周期逐渐缩短，微信小程序管理模式很快融入到了许多模式之中。近期，疫情汹涌而来，每当有局部地区出现确诊病例，街道办工作人员会立即组织封锁小区，严格控制进出人数，做到“非必要不出小区”。由此，导致了许许多多居民在家中的蔬菜，水果等基本食用物品耗尽后，急需出门购买，却又受限于防疫政策的难题。为了便于防疫管理，本研究题目选择设计“菜篮子小程序”。对于本菜篮子小程序开发主要是采用微信小程序技术，开发环境为微信开发者工具，利用云开发中的数据库来作为后端存储系统，同时根据社区管理员销售蔬菜等生活必需品的需求来设计功能，进入微信小程序的菜篮子系统页面之后，会识别数据库中两种角色导航到不同页面，系统角色分为封闭在家的居民和社区工作管理员，管理员端功能包括：商品管理，订单管理，退单管理，管理员注册审核。普通用户的功能包括：浏览商品，加购物车（可修改购买数量），商品购买，退订单等。关键词：菜篮子小程序，微信开发者工具，云开发数据库目录TOC\o"1-2"\h\u25397第一章概述 第一章概述1.1研究背景现如今，网络发展越来越迅速，同时系统开发技术越来越简化，我们已逐渐进入了一个“人人编程”的时代，但进行系统开发的同时也要对其有一个全面的了解与设计。要在设计功能的同时满足一些实际意义，能够真切解决使用者的部分痛点，依靠网络技术的快速发展和现代通讯技术的结合为用户带来方便。同时，由于我们已进入一个疫情大背景下，正好可以借助着我国网络技术的高速发展，开发、设计一个操作简单，适用于任何年龄段使用的菜篮子小程序。我相信能够实际解决防疫过程中的痛点问题的想法是十分具有前景的。1.2研究目的由于新冠肺炎疫情汹涌而来，中国人从去年一直到如今，都在经历着险阻重重而又井然有序的抗疫斗争。每当有局部地区出现确诊病例，街道办工作人员会立即组织封锁小区，严格控制进出人数，做到“非必要不出小区”。由此，导致了许许多多居民在家中的蔬菜，水果等基本食用物品耗尽后，急需出门购买，却又受限于防疫政策的难题。我选择的研究课题是“疫情背景下社区居民‘菜篮子’购物小程序的设计与开发”。此小程序的主要目的为可以使居民在足不出户的情况下，利用小程序远程下单，购买自己所需蔬菜，水果等必需物品；同时，小程序管理方为社区工作人员，接收到订单后，可根据订单信息线下联系商户，进行统一商品配送，如此可减少居民在疫情下出门接触人群的次数，严格把控疫情防守大关。本系统的开发与设计基于对当前疫情大背景的分析与调研，同时得出结论：即面向社区群体进行生活物品购买的痛点解决。把原本线下完成的菜品选购改为线上进行，在疫情期间减少接触，符合防疫相关规定，保证广大用户、菜贩的身体健康。最终希望通过菜篮子小程序可以实现下列功能：1.为居民提供足不出户即可购买生活必需品的便于疫情封闭管理的情形。2.管理员可以通过菜篮子小程序及时、便捷更新必需品信息，同时线下与周边生活区商户进行对接配送。3.此菜篮子小程序尽量满足使用简便的初衷，保证独自居家的老年人也可以迅速理解及使用，兼顾绝大多数社区居民。1.3市场现状当前市场上，无论是京东这种B2C商城，还是闲鱼的C2C商业模式，笔者都未找到针对疫情特定背景下的与居民生活区对接的商城类程序提供使用，自然也就给居民在封闭情况下购买蔬菜水果等必需物品造成了极大不便，本题可以在一定程度上弥补这种市场空缺。

第二章开发技术介绍2.1微信开发者工具介绍微信开发者工具是由微信官方设计并发行，该开发工具是专门针对微信小程序的开发工具。其功能主要分为：小程序个人及企业的开发、调试、预览以及最后上线供用户使用，微信团队发布了微信开发者工具、API官方文档以及对应的调试指南，微信开发工具是开源的，可以给我这种个人开发且没有太多经验的提供很大的帮助与指导。[[]杨选辉.信息系统分析与设计[J].北京：清华大学出版社.2012][]杨选辉.信息系统分析与设计[J].北京：清华大学出版社.2012使用微信开发者工具前，开发者需事先准备好微信账号并申请相关权限，之后再使用微信扫描其生成的二维码进行开发者登录。如果微信号尚未申请相关权限，即使扫码进入微信开发者程序，也无法将制作的程序进行上传操作，只能在本地电脑进行最基础的调试等工作。2.2云开发介绍云开发是云端一体化的后端云服务，采用serverless架构，免去了移动软件需要事先构建好复杂的服务器和搭建服务器后续不可或缺的运维工作。同时云开发提供的静态托管、命令行工具（CLI）、FlutterSDK等能力降低了应用开发的门槛。使用云开发可以完成完整的小程序/小游戏、H5、Web、移动App等软件的开发工作。2.3云数据库介绍云数据库具有专业性强、性能优秀、可靠程度极高等特点。云数据库不仅提供对web页面的配置功能，还提供操作数据库的具体范例，以及对已删除或丢失的数据进行备份和恢复的功能。除此以外，云数据库还能完成完备的安全管理、对系统的实时监控，还提供易于获取的扩展工具。众多支持功能汇聚于云数据库。相对于由用户自行设计、构建数据库，云数据库更廉价、更快捷、更方便、更安全，专业性也远胜于由用户自行设计的数据库，以上众多优点使用户能更专注于核心业务。2.4渲染层与逻辑层介绍微信小程序在开发时主要分为两方面：渲染层和逻辑层。其中渲染层包括WXML（用户端的视图编写）以及WXSS（编辑对应的文字、图片格式）。渲染层主要功能为对于用户页面进行视图编辑，例如在菜篮子小程序中插入蔬菜图片，输入蔬菜的介绍文字，加入顶部的一些生活必需品的轮播图和底部可点击跳转不同页面的导航按键，或者是一些加购物车的按键等。对于逻辑层来说，主要是对前端渲染层传输的数据进行处理，例如用户点击购买按钮后会触发一个方法，在数据库中更新订单状态，同时自动保存购买信息到订单库中。此方法的具体内容即写在逻辑层中。

第三章系统分析3.1可行性分析对于基于疫情背景下的菜篮子小程序来说，开发这个系统可以实现最大限度执行防疫相关政策的同时，又可以使居民足不出户买到生活所需的蔬菜水果等生活必需品，使得菜篮子小程序既解决了防疫特定背景下的痛点及难题，还可以极大的减轻工作人员的负担。[[]姜丽希.厉旭杰.微信小程序云开发超详细实战攻略.清华大学出版社[M].2020.]疫情情况下，小区居民足不出户便可进行蔬菜购买，同时可让商户，管理员对销售信息一目了然，解决了区域封闭时居民最基本的生活问题，减少了防疫所需投入的人力，物力，财力。对各方皆有积极意义。所以本小程序设计的目的是完全可行的，同时也一定会有应用目标市场。[]姜丽希.厉旭杰.微信小程序云开发超详细实战攻略.清华大学出版社[M].2020.3.1.1技术可行性菜篮子小程序设计与实现中，微信小程序技术是核心。本系统主要使用微信开发者工具来进行菜篮子小程序居民用户页面和社区管理员系统的开发。数据库方面每个数据库表设置了唯一主键以及不同数量的外键，可以对每个库表进行唯一识别，同时可以进行库与库之间的连接与交互，保证用户使用过程流畅、便捷，且个人隐私能得到充分的保护。我在校期间对微信小程序相关技术进行学习，同时参考了一些b站小程序教学视频后，了解了编程所需的语法以及一些封装的组件库，基本可以对此毕业设计做出简单的系统开发、检测和辨别。3.1.2经济可行性本系统中所用软件均微开源软件，基本可以算零成本，只需投入一定时间进行基础小程序的开发即可；同时开发本菜篮子小程序也只需一台办公电脑即可完成，对于硬件设施也没有较高要求，对于学生开发系统具备友好性，整体来说在经济上完全可行。[[][]戴晟晖.微信公众平台搭建、开发与实践指南[M].北京：中国铁道出版社,2014.3.1.3操作可行性界面简单且易操作是菜篮子小程序的一大特点。该小程序都是采用最基本的商城功能进行系统开发，也就是意味着只需一部手机即可进行生活必须品的购买。该系统主要采用的微信开发者工具、云开发数据库等开发工具，且使用便捷、快速，从而使得系统更加以人为本。因此基于疫情背景下的菜篮子小程序的开发可操作性强，耗费成本低。经过以上的叙述，所以开发此系统在多方面可行且具备前景及实际意义。3.2系统性能分析每一个系统都必须有自己的设计规则并且严格遵守。以下是该系统的设计标准：操作简捷性：尽可能使系统设计的更容易操作，这样既保证了对于用户的友好性，又保证了后期进行系统维护的简便。针对性：开发菜篮子小程序必须针对社区居民及社区工作人员作为针对群体，突出针对疫情特定背景下便于居民购买必需品的特点。适用范围：对于本菜篮子小程序来说，用户端无论是二三十岁的年轻人，还是六七十岁的老年人，都可使用本小程序，简单易上手。3.3系统功能需求分析本论文主要设计目的是基于疫情背景下的社区居民菜篮子小程序的设计与开发。主要分为两种不同菜篮子小程序使用角色。社区工作人员：订单管理，退单管理，菜品信息管理以及新管理员注册审核。社区居民：浏览菜品信息、加购物车（可在购物车内修改数量）、购买商品，退订单等功能。3.3.1用户端用例图出于对于社区用户需被数据库后台成功识别的考虑，居民需在使用前注册登录菜篮子小程序方可继续进行后续操作。[[]青龙老贼,赵黎,方雨,刘琪.微信终极秘籍:精通小程序商业运营[M].北京：电子工业出版社,2014.][]青龙老贼,赵黎,方雨,刘琪.微信终极秘籍:精通小程序商业运营[M].北京：电子工业出版社,2014.图3-3-1用户端用例图（1）浏览菜品信息社区用户可在小程序首页浏览经过分类的菜品信息，大致种类有蔬菜、水果、其他等不同细分类型。（2）加购物车社区用户可将自己心仪的蔬菜水果等商品统一添加至购物车，便于一次性购买。修改商品数量用户可在购物车修改商品的具体数量后再形成最终订单发送给管理员。我的订单用户可在“我的订单”里查看自己的历史购买记录，同时可以对还未确认收货的商品进行退单管理，避免出现买完突然不需要的尴尬场景。3.3.2管理员用例图该系统的核心是管理员，通常由社区工作者担任。该系统包括多个功能模块，系统中的社区居民信息、蔬菜等商品信息都由管理员统一管理，管理员在后台可以实现对用户信息、菜品信息的实时更新，以及订单的及时管理。[[]周文洁.微信小程序开发实战.清华大学出版社[M].2019.][]周文洁.微信小程序开发实战.清华大学出版社[M].2019.图3-3-2管理员端用例图订单管理管理员可对订单基本信息进行管理：增、删、改、查等。用户管理管理员可在小程序后端查看包括社区用户和管理员在内的基本注册信息，便于防疫相关工作的登记和管理。菜品分类管理管理员可将不同菜品进行任意分类改变，便于商品信息统一管理。菜品信息管理管理员可对不同菜品信息进行修改，其中包括商品名称，类型，数量，单位，价格，插入图片等商品基本信息。管理员注册审核笔者考虑到社区工作人员之间可能存在工作交接的情况，或是新任员工入职，所以在菜篮子小程序中添加了新管理员注册需进行审核的功能，预防别有用心的人恶意注册管理员账号进行系统修改。退单管理若社区管理员在接收到用户的退单申请后，可由管理员来决定本次订单是否符合退单标准，进而操作究竟是否同意退单，由此可以一定程度避免恶意退单的情况。系统管理管理员可对“菜篮子”小程序这个系统进行整体管理。3.4业务流程分析在分析业务流程之前，需对菜篮子小程序的整体思路进行汇总整理，具体流程图如下图3-4所示：图3-4系统开发流程图3.4.1登录流程社区居民（即用户）登录流程图如图3-4所示：图3-4-1登录流程图3.4.2注册流程第一次登录菜篮子小程序的用户需先注册才可进入购买蔬菜等商品页面。[[]刘向南.小程序时代.清华大学出版社[M].2017.]用户注册流程图如图3-4-2所示。[]刘向南.小程序时代.清华大学出版社[M].2017.图3-4-2注册信息流程图3.4.3用户购买流程使用本菜篮子小程序的社区居民登陆后可进行购买操作，如图3-4-3所示：图3-4-3用户购买流程图3.4.4管理员管理菜品流程管理员登录后可进行菜品管理，具体如图3-4-4所示：图3-4-4管理员管理菜品信息流程图第四章系统设计4.1系统的功能结构图本菜篮子系统功能主要分为两个方面：社区工作者（即管理员）功能包括：蔬菜水果等商品分类管理及删除、新社区工作者注册审核、订单管理和退单管理。社区居民功能包括：浏览菜品信息、加购物车及修改购物车、我的订单、退单管理。其功能结构图如下图4-1所示：图4-1系统功能图4.2系统数据库设计概念数据模型被用来表示各个数据之间的交互关系。落实到具体的程序中，即是指系统对用户提交的信息的进行处理和管理。同时，在设计数据库前务必先建立起E-R图来表示具体的实体、属性和联系的关系。[[]钱雪忠.数据库原理及应用[M].北京：北京邮电大学出版社.2017.08[]钱雪忠.数据库原理及应用[M].北京：北京邮电大学出版社.2017.084.2.1、商品分类E-R图如图4-2-1所示：图4-2-1菜品分类实体图4.2.2、社区居民信息E-R图如图4-2-2所示：图4-2-2用户信息实体图4.2.3、以蔬菜为例的商品信息E-R图如图4-4所示：图4-2-3菜品信息实体图4.2.4.E-R总图如图4-2-4所示：图4-2-4E-R总图4.3数据表字段设计每个数据库在系统运行的过程中彼此独立但并不完全独立，他们会根据数据和功能与用户端构建联系并产生数据的输出、输入、修改。在程序运行时，系统会自动完成构建数据库之间的连接并完成信息的传递和交互。如果想要查询某个数据库中的数据，只需选择数据库的库名，然后就会自动进入。在单击进入按钮之后系统就会自动识别数据源并显示出对应的名称。菜篮子小程序设计与实现一共涉及到购物车信息表、菜品信息表、用户信息表、订单信息表四个数据库表。以下是四个数据库表的设计结构及每个数据库表的具体项表示:表4-3-1菜篮子小程序购物车信息表列名数据类型长度主键外键说明允许空idString16是否菜篮子小程序的购物车专有序号否ImgpathString200否否菜篮子小程序的图片存储路径否MobileNumber11否否社区居民手机号否NameString2否否商品名称否NumString20否否菜篮子小程序中各商品数量否User-idString20否是对象标识符否PidString20否否菜篮子各蔬菜编码否PriceString20否否菜篮子小程序各蔬菜价格否ProtypeString20否否菜篮子小程序不同种类否UnitString20否否单位否表4-3-2菜篮子小程序菜品信息表列名数据类型长度主键外键允许空说明idString4是否否菜篮子小程序的菜品序号ImgpathString20否否否菜篮子小程序的菜品图片存储路径NameString20否否否菜篮子小程序的菜品名字NumNumber20否否否菜篮子小程序的菜品数量PriceString20否否否菜篮子小程序的菜品价格ProtypeString20否否否菜篮子小程序的菜品分类UnitString20否否否菜篮子小程序的菜品单位表4-3-3users用户信息表列名数据类型长度主键允许空说明idString4是否菜篮子小程序的用户序号AddressString20否否菜篮子小程序的社区居民地址GenderString20否否菜篮子小程序的社区居民性别MobileString12否否菜篮子小程序的社区居民手机号NameString20否否菜篮子小程序的社区居民名字PasswordString20否否菜篮子小程序的社区居民密码TimeNumber20否否添加时间UserroleNumber1否否用户角色表4-3-4订单信息表列名数据类型长度主键外键允许空说明idString4是否否菜篮子小程序的序号User-idString20否是否社区居民编号PriceString20否否否菜篮子小程序的菜品价格TimeString20否否否添加时间NumNumber20否否否菜篮子小程序的蔬菜数量MobileNumber11否否否社区居民手机号

第五章系统功能实现5.1登录与注册用户端的登录系统要求用户使用账号、密码进行登录。如果用户因为尚未注册导致还没有账户、密码，可以点击登录按钮下方的注册按钮进行注册的操作。注册完毕，系统会将用户填写的个人信息上传的对应的数据库并记录，以便用户后续的登录。菜篮子小程序社区居民端登录效果图如图5-1所示：

图5-1登录界面5.1.1用户角色对比用户在登录输入账号密码之后，会选择相应的登录权限，即选择管理员权限或者用户权限，选择完毕登录时系统会在后台进行对比查找，如果与云开发数据库内的角色权限相同，则会跳转到对应页面；若是账号密码与数据库识别角色不一致，则会显示用户权限错误，并提示登录失败。图5-1-1用户角色对比图5.1.2用户注册考虑到本小程序针对的管理员身份为社区工作者，可能会存在一些工作或是人员交接的情况，不可能只有一位管理员账号，所以在设计了用户注册的同时，额外添加了一项管理员注册的功能，同时，此注册需经过老管理员审核才可注册成功。图5-1-2普通用户与管理员注册页面截图5.1.3注册成功图5-1-3管理员注册成功后页面显示（用户无此页面）5.2用户功能模块用户登录本“菜篮子”小程序后便可进行商品浏览等基本购物功能，如下图所示。图5-2用户功能模块5.2.1购物车功能用户可在购物车查看自己的全部想要购买的蔬菜水果等商品，同时修改商品数量，确认后形成订单发送给管理员，等待发货。如下图所示。 图5-2-1购物车界面图5.2.2用户订单管理用户可在订单形成后在我的订单中查看自己的相关订单信息，同时在收到管理员的线下配送后在线下完成结账，若是规定时间内未收到商品配送或因自身原因无需此商品，可点击退单进行退单管理。如下图所示。图5-2-2我的订单页面5.3管理员端相关功能管理员可进行商品管理，订单管理，退单管理以及管理员审核注册等。如下图所示：图5-3管理员页面5.3.1菜品信息管理社区工作人员对蔬菜水果等商品进行添加、删除、修改以及查看等操作。如图5-3-1：图5-3-1菜品信息管理界面5.3.1.1菜品信息管理社区工作人员对菜品信息点击修改功能后。程序效果图如下图5-6所示：图5-3-1-1管理员管理菜品界面5.3.2订单管理社区工作人员可进行删除订单操作。如下图5-3-2所示：图5-3-2订单管理界面5.3.3退单管理管理员可与线下商户确认无法正常发货后点击对社区居民进行退单。如下图5-3-3所示：图5-3-3退单管理界面5.3.4管理员注册管理旧管理员对可对新注册的管理员账号进行审核，确认是否允许注册。程序效果图如下图5-9所示：图5-3-4管理员注册审核界面第六章系统测试6.1程序调试根据程序开发者的普遍经验，在系统开发早期，如果出现预期之内的问题，那么就要及时作出相应的改正。从数据输入、输出、修改等角度寻找系统可能存在的漏洞。如果在初期不及时找出错误并彻底修正，那么在后续的功能模块设计完毕后可能出现一连串相互影响的错误。对某处错误的修改可能会导致其他模块出现错误，极大的拖慢系统制作过程。要根据系统特点，预先构想程序发布后用户可能执行的操作，提前对程序进行数据输出、输入、修改、交互等测试，找出其中的错误，同时，程序调试成本占据了程序开发总成本中很高的比例。[[]王珊.数据库系统原理教程[M].北京：清华大学出版社,2013,56.]在测试中，每个程序都有可能出现错误。在该程序开发的过程中，只靠人工方式模仿用户进行输入、输出等指令去查找错误是比较繁琐和困难的。如果在编写代码时出现了语法错误，程序开发工具会将错误的代码标红，并提示可能出现错误的原因和修改方法，这样就方便找出错误。但是另一种类型的错误是由于程序运行过程中某些特定的输入、输出导致的，这类错误属于隐藏类错误，且难以复现。[[]WeiWang;BotaoLiu;YingZhong;JinAn..LongListDataDisplaybasedonWeChatApplet[J].2021.][]王珊.数据库系统原理教程[M].北京：清华大学出版社,2013,56.[]WeiWang;BotaoLiu;YingZhong;JinAn..LongListDataDisplaybasedonWeChatApplet[J].2021.6.2程序测试的重要性基于疫情背景下菜篮子小程序的核心是使用户快速、便捷地实现需求。所以从用户的角度去测试时，编写测试用例时，要充分考虑用户可能进行的操作，以系统的特点和所实现的功能为出发点，在测试的时候，能够快速、高效地完成测试工作。作为系统的开发者，原则希望菜篮子小程序在测试中表现稳定、可靠，能够实现功能。6.3测试分析设计好测试所用数据后，对测试结果进行分析。菜篮子小程序的测试主要从以下几个方面进行：用例名称：社区居民登录菜篮子小程序测试方案：使用社区居民角色进行已有的账密登录，观察能否成功识别后端数据库登录。（1）社区居民登录测试：表6-1登录测试表测试编号01测试名称登录测试前提条件打开首页页面并未登录步骤操作描述数据期望结果1点击登录按钮无跳转到登录页面2填社区居民账号）和000000（密码），点击登录按钮社区居民账号、密码输入框清空内容并提示“请选择用户权限”3填写在菜篮子数据库中未登记的社区居民账户社区居民账号、密码输入框清空内容并提示“用户名或密码错误”4填写正确的社区居民账号和密码，选择用户权限社区居民账号、密码、权限跳转到不同角色页面（2）蔬菜等商品管理测试：表6-2社区工作人员进行商品修改测试表