注:仅展示部分文档内容和系统截图,需要完整的视频、代码、文章和安装调试环境请私信up主。
摘 要
随着经济的快速发展,人们物质生活水平有了极大提高,对美食的探索愈发热爱。传统点餐在顾客多时无法及时提供快速点餐服务,浪费大量的人力物力,且顾客对点餐速度太慢很不满意。自2011年微信诞生以来,微信的影响越来越大,人们对微信的使用越来越普遍,近年来,微信旗下的小程序因不占内存、用完即走的特点,吸引了众多用户,这也导致了使用微信小程序设计系统的增加。因此,本文设计了一个小程序,用于在校园内实现点餐功能。该小程序不仅能降低餐厅用工成本,还能为顾客和商家提供便利、快速的点餐服务,同时还支持外卖点餐配送服务,具有非常好的发展前景。
随着智能时代的到来,人们越来越追求高效的生活,旧的点餐系统效率低下,浪费了很多的物力和人力,已经不能满足大众的需求。而小程序则带来了应用无处不在的优势,随时搜索随时可用而且不需要安装和卸载,校园点餐小程序的推出对于用户的点餐带来了很大的便利。对于商家而言,该软件可以满足简单的基础需求,尤其适合经营生活服务类线下商店的商家。它有助于降低餐厅的经营成本,减少人工雇佣费,并且能够对更多潜在客户产生吸引力。对于点餐的客户而言,这个小程序运用了“用完即走”的理念,不但能减轻手机内存的负担,而且操作方式也更方便,这个小程序将点餐服务和互联网深度融合,消除了柜台点餐和排队付款等繁琐环节,让客户可以轻松快捷地点餐,并通过微信支付进行付款结算。相比于传统的餐厅点餐服务,这个小程序更注重用户体验、更加人性化。针对小程序的开发者而言,相对于其他软件,小程序的开发门槛较低,难度也较小,但需求却相对较高。因此校园点餐小程序的开发具有广阔的市场空间和应用前景。
关键词: 微信小程序;点餐系统;JSP;MySQL
目 录
1.2 设计课题意义
位于冬奥城市张家口的河北建筑工程学院,已有70多年历史。学校以土木建筑学科为龙头,同时涵盖工、管、理、文、艺等多个学科,相互协同发展,形成了独特的特色。良好的学习氛围以及浓厚的地域风情,吸引了世界各地的人,选择我校的人数也日益递增,但是学校的基础设施还不够完善,随之出现了一些问题,其中一个便是食堂就餐问题。学校总共建有三个食堂,每次遇到下课吃饭高峰期,都会异常拥挤,一是学生们要花费很长时间去排队,加上食堂座位有限,一定数量的学生就会没有位置就餐,更甚者有人吃不到饭;二是部分学生享受宿舍生活,懒于在教学楼、宿舍和食堂之间奔波;三是学生属于特殊的群体,处于学校和社会两种环境之中,除了平时上课以外,还会有大大小小的会议和比赛,身体上的疲惫也会让学生懒于去餐厅排队买饭。内外部原因无形中暴露了学生对就餐的需求,也推动了校园网络订餐的发展。
我校已有成型的订餐公众号供全校学生使用,然而很明显,学生群体庞大,仅仅一个订餐系统远远不能满足学生的需求。再者,校园内勤工助学的学生也不在少数,我校现有的订餐公众号必然不能为勤工助学的学生提供太多机会。
在生活节奏加快、时间观念加强的学生群体中,网上订餐成为了新型的营销方式,无疑会受到青睐。微信小程序点餐系统是计算机技术与餐饮管理相结合的产物,通过微信小程序外卖下单系统实现了对餐饮的高效管理。校园用户集中且持续稳定,学生就餐需求多样化,追求时尚,学生可通过一部手机,进行食堂菜品浏览、预定、下单,不仅节约了学生的时间,提高了学生的就餐体验,也为勤工助学的学生提供一个兼职的机会,更为学校食堂管理工作提供了便利,开发这个校园点餐小程序非常必要。
3.2.1 系统功能模块分析
1. 系统功能模块分析
(1) 后台管理员端:管理员通过后台管理平台可以查看、编辑和删除餐厅、菜品以及配送员的信息。
后端功能包括个人资料的修改和密码重置,以及用户管理页面,方便管理员对小程序的用户资料信息进行管理。商家管理、配送员管理和订单派送管理也都由管理员监管负责,管理员具有修改、查看和删除餐厅、配送员和订单信息的权限。
管理美食信息:管理员可以审查、修改以及删除餐厅的菜品和用户评论。
管理美食分类:管理员操作小程序端的美食分类显示。
管理跑腿订单:管理员可以查看商家的跑腿订单详情,并对其进行修改或删除。
管理系统设置:管理员能够查看或更换小程序首页的轮播图片。
管理订单:管理员可以根据订单对商家信息进行修改或删除。
- 商家端:商家通过后台端口设置所需的客户端的商户、菜单等信息,管理和执行所有订单。商家后台功能包括个人中心,用于管理登录密码和餐厅信息。美食信息管理功能包括查看、更改、删除菜品和菜品类别,以及用户评论。商家可以管理已完成、已发货、已支付、未支付、已取消和已退款订单,并可删除相应记录。商家需将发货订单添加到跑腿订单里面供配送员选择,也可查看配送员的配送进度,并支付相应佣金。跑腿订单管理功能包括查看本餐厅的跑腿订单详情。
- 用户通过微信公众平台内的客户端进入从而进行下单、查看商家及美食信息以及对订单进行付款、取消和评价等操作,该系统的小程序端功能模块包含:
用户登录:第一次使用时必须先注册。
首页:用户进入小程序后可以看见推荐的美食信息、轮播图以及美食资讯。
美食信息:展示出售的美食,使用者可以按类别浏览美食,可点击查询详细美食资料。当遇见想要购买的美食时可以添加购物车进行下单,或者直接进行下单购买。
我的个人中心:可以修改自己的信息,对于自己收藏的美食进行下单,此外,还可以进行充值操作,以便对已加入购物车的美食进行删除或立即下单,并可查看订单记录。
- 系统功能模块图
在进行需求分析后,总结出了以下系统的功能模块图,如图3.1所示。
用户登录实现流程图如图5.2所示。
图5.2 登录流程图
管理员输入账号和密码,选择管理员角色,进入系统后台,进行操作。
//登录
if(user==null ) {
return R .error("账号不存在");
}else{
if ( !user .getPassword() .equals(password)) {
return R .error("密码错误");
}
}
{
String token = tokenService .generateToken(user .getId(),username, "users", user . getRole());
R result= R .ok();
result .put("登录成功", token);
return result;
}
//退出
{
HttpSession session=request .getSession();
session .invalidate();
R result= R .ok("退出成功");
return result;
}
//密码重置
{
if(null==user) {
return R .error("账号不存在");
}
user .setPassword("123456");
userService .update(user,null);
R result= R .ok("密码已重置为: 123456");
return result;
}
5.2 跑腿订单页面以及订单生成的实现
用户可以详细的查看跑腿订单的美食价格、美食图片、餐厅名称、餐厅电话、餐厅地址等信息,在配送员登录小程序后,其可在跑腿订单中自由选择接单。跑腿订单界面效果见图5.3。
图5.5 生成订单流程图
具体实现如下:
前台:用户点击“提交订单”按钮时,直接方法生成订单的请求:cart?method=createOrder
后台:
if(user!=null)
{
//生成订单信息
Orders order = new Orders();
//后台生成订单id
orders .setOid(id);
//获取
orders .setYonghu(yonghu);
//订单状态
orders .setState(0);
//订单日期
orders .setOrdertime(new Date());
//订单总金额
cart = session .getAttr("cart");
orders .setTotal(cart .getTotal());
List<CartItem> cartItemList = cart .getCartItemList();
for(CartItem ci:cartItemList)
{
// 订单项
OrderItem oi = new OrderItem();
oi .setItemId(ID);
//订单信息,总金额
oi .setProduct(ci .getProduct(),ci .getCount(),ci .getSubTotal()); // 将订单项放入订单项集合中
orders .getList() .add(oi);
5.3 轮播图展示功能
“首页”中的商品包括头部的banner餐厅照片、菜品信息和美食资讯推荐。轮播图常用于网页中推荐内容的展示,可促进网页页面收录,使得使用者提高体验感。在首页,图像可以跟随指示器轮播。实现过程包括布局设计、图书图片加载和循环切换图片三个步骤。其主要代码实现如下。
<swiperclass="swiper" indicator-dots="{{ ' .swiper-pagination '==null?false:true}}" autoplay="{{autoplaySwiper}}"circular="{{false}}"
indicator-active-color="rgba(13, 255, 0, 1)"
indicator-color="rgba(30,144,255,1)"
duration="{{5}}" interval="{{intervalSwiper}}"
vertical="{{ 'vertical '== 'horizontal '?false:false}}">
<block wx:for="{{swiperList}}" wx:for-item="swiper" wx:for-index="index"wx:key=" index">
<swiper-item data-event-opts="{{[[ 'tap ' ,[[ 'onSwiperTap ' ,[ '$0']
[[[ 'swiperList ' , '' , index]]]]]]]}}" bindtap="__e">
<image mode="aspectFill" src="{{swiper .img}}"></image>
</swiper-item>
</block>
</swiper>