自学内容网 自学内容网

外卖商城平台的微信小程序ssm+论文源码调试讲解

第2章 关键技术简介

2.1 微信小程序

微信小程序,简称小程序,英文名Mini Program,是一种全新的连接用户与服务的方式,可以快速访问、快速传播,并具有良好的使用体验[12]。

小程序的主要开发语言是JavaScript,它与普通web的开发有很多相似之处。小程序和普通网页开发并不是相同的东西,是有差异的。网页开发的渲染线程和脚本线程是互斥的,而在小程序中,确实分开的,分别在不同的线程之中运行。网页开发的工作者可以运用各种浏览器暴露出来的DOM API,进行DOM选中和操作,但小程序不行,它并没有一个完整的浏览器对象,因此缺失DOM API和BOM API。这样的差别使得前端开发中经常用到的一些库是无法在小程序中运行的。另外,网页开发的工作者在开发网页时所要面对的环境是在各式各样系统上运行的各式各样的浏览器,,而小程序只,只需面对iOS和Android这两道操作系统下的微信就足够了。

小程序和传统的APP相比,有着开发成本更低,获客成本更低,开发周期更短,发展空间更大等的优点。不过,为了体现“用完即走”、“无需安装”等理念,小程序的功能、性能还有大小都受到了制约,可以说是各有利弊。

2.2 微信开发者工具

为了能够让微信小程序的开发人员有根家优秀的开发环境,腾讯在原有的公众号网页调试工具的基础上,推出了全新的微信web开发者工具。

微信web开发者工具具备编辑、调试、项目、编译、关闭、后台和缓存这七个选项卡,让开发者能够更方便的进行开发和调试,节省开发所耗费的时间。

2.3微信小程序API接口

微信小程序API接口是腾讯公司为了微信小程序和微信公众号提供的接口文档,里面包含了各种需要使用的接口技术[7],例如本项目用到的获取微信用户信息(wx.getUserInfo)、蓝牙通讯传输功能、网络请求(wx.request)、定位功能等,总的来说,小程序API是满足一个程序开发的大部分接口。

2.4 WXML 、WXS、JS小程序编写语言

WXML全称是 WeiXin Markup Language,是微信标记语言,是微信小程序的标签语言,结合小程序的基础组件、事件系统,可以构建出页面的结构。类似于HTML语言,但是他自身也拥有一定的特色。

WXSS(WeiXin Style Sheets)是微信样式表,是微信小程序用于修饰标签语言的样式文件,WXSS 用来决定 WXML 的组件应该怎么显示。为了适应广大的前端开发者,WXSS 具有 CSS 大部分特性,同时为了更适合开发微信小程序,WXSS对CSS语言进行修改和扩充,引入全新尺寸单位rpx,但大体语法于CSS语言不分离。

JS是 JavaScript[4]语言的简称,微信小程序里面也可以叫做WXS,是一门脚本语言,通俗易懂,用于页面交互的语言。

2.5 MYSQL数据库

MySQL 是关系型数据库管理系统的代表,它是属于 Oracle 旗下产品,使用C语言和C++语言编写的,使用了多种技术,由于它体积小,易使用,成本低,灵活性[2],该数据库在中小企业比较受欢迎。MySQL的灵活性体现在非常多方面,可是适应高要求的环境,通过不同配置适应各种硬件,同时支持各种不同的数据。因为MySQL是其免费开源的,而且MySQL的功能已经足够用对于学习和中小型企业来讲,所以开发中小型网站都会选择MySQL作为网站的数据库。[5]

第3章 系统分析

3.1 可行性分析

需要使用大部分精力开发的外卖商城平台微信小程序为了充分降低开发风险,特意在开发之前进行可行性分析这个验证系统开发是否可行的步骤。本文就会从技术角度,经济角度,还有操作角度等进行综合阐述。

3.1.1技术可行性

本外卖商城平台微信小程序采用Java技术,基于微信小程序,采用MYSQL数据库进行开发的。

(1)Java提供了稳定的性能、优秀的升级性、更快速的开发、更简便的管理、全新的语言以及服务。整个系统帮用户做了大部分不重要的琐碎的工作。

(2)基于微信小程序的系统的开发已发展日趋成熟。

(3)作为计算机专业的学生,对数据库比较熟悉,掌握了MYSQL数据库,建立这样一个系统应该在能力范围之内

综上所述:外卖商城平台微信小程序的开发技术具有很高可行性。

3.1.2 经济可行性

该系统的开发工具使用的都是免费的开发工具,且内容较为简单,一台计算机便可以开发出这个系统,且后期的维护,修改等对本系统的改动,都可以只通过一台计算机实现,因此开发该系统的成本在有计算机的情况下基本为0,所以本系统在经济上是可行的。

3.1.3 操作可行性

本系统操作页面简洁明了,操作极其容易,用户登陆后一眼便可看到自己所需要的信息,而管理员的操作也十分轻松便捷,只要操作人员具有一定的文字水平以及简单的逻辑思维,就可以轻松操作本系统,因此本系统在操作上是可行的。

3.1.4时间可行性

从2020年11月份我们在学校就没有课程了,同学们大部分选择找工作实习了,我也是在其中。一边找工作的同时,一边忙着完成毕业设计工作。对于我本人来讲,目前的情况是白天我要上班参加实习工作,只有晚上我才有时间完成论文编写工作。论文答辩是在2021年5月份左右,将近半年时间来完成毕业设计,时间上还是很充分。

综上可以看出,本外卖商城平台微信小程序的开发在技术、经济、操作以及时间四个方面都具有很高的可行性,开发本程序可行。

3.2 系统性能分析

随着互联网的发展,微信小程序越来越完善,现在的生活中充斥着微信小程序,由于小程序方便快捷,基于微信这个大平台,小程序发展是高速的,吃饭可以通过小程序点餐,出去玩可以用小程序打车,因此外卖也可以使用小程序。系统性能需求如下:

(1)软件功能清晰明了,尽量多用列表的展示简化用户操作,提升使用者体验,减少下拉菜单这种降低体验的操作。

(2)软件的功能要尽量完整,也要全面。

(3)经常的在以后版本更新完善软件,使得软件保持一个新鲜度,也可以做一些活动来促进用户使用软件。

(4)减少软件使用过程中出错,做好优化,遵循开发逻辑,降低bug的产生率以提升用户体验。

3.3 系统功能分析

本外卖商城平台微信小程序满足了不同用户的功能需求,包括用户、骑手、商家以及管理员,下面对这不同用户的功能需求进行简介。

(1)管理员功能分析

管理员可进行后台进行管理,包含个人中心、用户管理、商家管理、骑手管理、商品类型管理、商品信息管理、订单信息管理、配送订单管理以及系统管理。

管理员用例图如图3.1所示。

图 3.1 管理员用例图

(2)商家功能分析

商家注册登录后主要功能模块包括个人中心、商品信息管理、订单信息管理、配送订单管理以及系统管理。

商家用例图如图3.2所示。

图 3.2 商家用例图

(3)用户功能分析

没有账号的用户可进行注册操作,注册登录后主要功能模块包括首页、商品信息以及我的(商品信息、订单信息、配送订单、我的收藏管理、在线客服)。

用户用例图如图3.3所示。

图 3.3 用户用例图

(4)骑手功能分析

骑手注册登录后主要功能模块包括首页、商品信息以及我的(订单信息、配送订单、在线客服)。

骑手用例图如图3.3所示。

图 3.4 骑手用例图

3.4 系统流程分析

3.4.1注册登录流程

没有账号的用户、商家和骑手都可进行注册,注册后可进行登录系统,注册登录流程图如图3.5所示。

图3.5注册登录流程图

3.4.2添加信息流程

管理员、骑手、用户以及商家登录后均可进行添加信息操作,下面是添加信息的时候的流程图,如图3.6所示

图3.6 添加信息流程图

3.5系统界面分析

用户界面指的是用户直接看到的图形界面也称为前端设计。用户界面的好坏直接影响到用户操作时的体验、效率,愉快性,而且用户界面设计不当还会导致无法很好的发挥出系统的性能。

1.界面元素

常见的用户界面都会包括:整体页面的主颜色,字体的大小,字体的颜色,整体页面的布局,主要功能在页面上的布局位置,重要的输入界面和输出界面,人机交互界面。用户界面采用的主颜色,还有整体的布局的美观和功能布局的位置是否符合人性的设计都会直接的影响到用户对本系统软件的认同度。

2.用户角色

界面的设计必须建立在用户的角度,只有把自己当作用户思考人们的使用习惯和爱好的时候,才能开发出一个围绕用户的界面。通过调查用户的操作习惯,并将收集而来的纷乱复杂信息,进行总结,抽象得出满足用户的用户界面模型。

3.需求变化

人们的审美和习惯爱好,总是在不断的改变着。故要根据不同用户的喜好,操作习惯作不同的需求设计分析,作出更加符合的用户口味的操作界面。从而得到用户的认可。

4.界面原型

设计的前期通过快速的创建界面原型,通过同学的建议一点一点的改进用户界面从快速的达到理想的效果。用户界面的设计原则要满足以下几点:

(1)页面简洁,操作简单。

(2)对于用户而言,浏览信息比记忆信息更友好。

(3)从用户的角度思考,才能让用户更好的接纳。

(4)利用当今已经流行的页面设计,让用户快速的学会操作。

5.安全性问题

安全性问题应该是人们最看重的。用户界面上输入的信息不会被别人窃取,还有若输入的时候出现错误页面必须能够回退。

第4章 系统设计

4.1系统结构设计

本外卖商城平台微信小程序主要实现了商家功能模块、骑手功能模块、用户功能模块和管理员功能模块四大部分,系统结构图如图4-1所示。

图4.1系统功能结构图

4.2系统顺序图设计

4.2.1登录模块顺序图

登录模块主要满足了管理员、骑手、商家和用户的权限登录,登录模块的顺序图如图 4.2 所示。

图4.2登录顺序图

4.2.2添加信息模块顺序图

管理员、骑手、用户以及商家登录后均可进行信息的添加操作,添加信息顺序图如图4.3所示

图4.3添加信息顺序图

4.3系统数据库设计

4.3.1 数据库E-R图设计

系统E-R图就是系统的实体关系图,它是用来描述某一组织(单位)的概念模型,提供了表示实体、属性和联系的方法。构成E-R图的基本要素是实体、属性和关系。实体是指客观存在并可相互区分的事特;属性指指实体所具有的每一个特性。根据数据库中的几个表分别绘制数据库的实体图。以下给出本系统中比较重要的实体E-R图。

(1)订单信息实体E- R图,如图4.4所示

图4.4 订单信息实体属性图

(2)配送订单信息实体E- R图,如图4.5所示

图4.5 配送订单信息实体属性图

(3)管理员信息实体E- R图,如图4.6所示

图4.6 管理员信息实体属性图

(4)用户信息实体E- R图,如图4.7所示

图4.7 用户信息实体属性图

(5)骑手信息实体E- R图,如图4.8所示

图4.8 骑手信息实体属性图

(6)商家信息实体E- R图,如图4.9所示

图4.9 商家信息实体属性图

(7)商品信息实体E- R图,如图4.10所示

图4.10 商品信息实体属性图

4.3.2 数据库表设计

本外卖商城平台微信小程序在开发过程中使用MySQL数据库系统进行系统数据的储存,以下是本系统的主要数据库表信息。

表4.1 dingdanxinxi订单信息表

序号

字段

描述

类型和长度

主键

是否可空

1

id

编号

bigint(20)

不允许

2

addtime

创建时间

timestamp

允许

3

dingdanbianhao

订单编号

varchar(200)

允许

4

`shangpinmingcheng

商品名称

varchar(200)

允许

5

shangpinleixing

商品类型

varchar(200)

允许

6

zhanghao

账号

varchar(200)

允许

7

jiage

价格

varchar(200)

允许

8

shuliang

数量

int(11)

允许

9

zongjiage

总价格

varchar(200)

允许

10

peisongfei

配送费

varchar(200)

允许

11

goumairiqi

购买日期

datetime

允许

12

yonghuming

用户名

varchar(200)

允许

13

`xingming

姓名

varchar(200)

允许

14

shouji

手机

varchar(200)

允许

15

`dizhi

地址

varchar(200)

允许

16

ispay

是否支付

varchar(200)

允许

17

userid`

用户编号

bigint(20)

允许

表4.2 peisongdingdan配送订单信息表

序号

字段

描述

类型和长度

主键

是否可空

1

id

编号

bigint(20)

不允许

2

addtime

创建时间

timestamp

允许

3

dingdanbianhao

订单编号

varchar(200)

允许

4

`shangpinmingcheng

商品名称

varchar(200)

允许

5

shangpinleixing

商品类型

varchar(200)

允许

6

zhanghao

账号

varchar(200)

允许

7

zongjiage

总价格

varchar(200)

允许

8

peisongfei

配送费

int(11)

允许

9

goumairiqi

购买日期

varchar(200)

允许

10

yonghuming

用户名

varchar(200)

允许

11

`xingming

姓名

varchar(200)

允许

12

shouji

手机

varchar(200)

允许

13

`dizhi

地址

varchar(200)

允许

14

`peisongzhuangtai

配送状态

varchar(200)

允许

15

peisongneirong`

配送内容

longtext

允许

16

gonghao

工号

varchar(200)

允许

17

qishouxingming

骑手姓名

varchar(200)

允许

18

sfsh

是否审核

varchar(200)

允许

19

shhf`

审核回复

longtext

允许

20

userid

用户编号

bigint(20)

允许

表4.3 users管理员信息表

序号

字段

描述

类型和长度

主键

是否可空

1

id

编号

bigint(20)

不允许

2

username

用户名

varchar(100)

允许

3

password

密码

varchar(100)

允许

4

role

角色

varchar(100)

允许

5

addtime

新增时间

timestamp

允许

表4.4 yonghu用户信息表

序号

字段

描述

类型和长度

主键

是否可空

1

id

编号

bigint(20)

不允许

2

addtime

创建时间

timestamp

允许

3

yonghuming

用户名

varchar(200)

允许

4

mima

密码

varchar(200)

允许

5

xingming

姓名

varchar(200)

允许

6

xingbie

性别

varchar(200)

允许

7

touxiang

头像

varchar(200)

允许

8

shouji

手机

varchar(200)

允许

9

youxiang

邮箱

varchar(200)

允许

10

dizhi

地址

varchar(200)

允许

表4.5 qishou骑手信息表

序号

字段

描述

类型和长度

主键

是否可空

1

id

编号

bigint(20)

不允许

2

addtime

创建时间

timestamp

允许

3

gonghao

工号

varchar(200)

允许

4

mima

密码

varchar(200)

允许

5

qishouxingming`

骑手姓名

varchar(200)

允许

6

xingbie

性别

varchar(200)

允许

7

touxiang

头像

varchar(200)

允许

8

dianhua`

电话

varchar(200)

允许

表4.6 shangjia商家信息表

序号

字段

描述

类型和长度

主键

是否可空

1

id

编号

bigint(20)

不允许

2

addtime

创建时间

timestamp

允许

3

zhanghao

账号

varchar(200)

允许

4

mima

密码

varchar(200)

允许

5

dianpumingcheng

店铺名称

varchar(200)

允许

6

shangjiaxingming

商家姓名

varchar(200)

允许

7

xingbie

性别

varchar(200)

允许

8

`touxiang

头像

varchar(200)

允许

9

youxiang

邮箱

varchar(200)

允许

10

lianxidianhua

联系电话

varchar(200)

允许

表4.7 `shangpinxinxi商品信息表

序号

字段

描述

类型和长度

主键

是否可空

1

id

编号

bigint(20)

不允许

2

addtime

创建时间

timestamp

允许

3

dianpumingcheng

店铺名称

varchar(200)

允许

4

shangpinmingcheng

商品名称

varchar(200)

允许

5

shangpinleixing

商品类型

varchar(200)

允许

6

tupian

图片

varchar(200)

允许

7

jiage

价格

int(11)

允许

8

shuliang`

数量

int(11)

允许

9

faburiqi

发布日期

date

允许

10

`qisongjia

起送价

varchar(200)

允许

11

`peisongfei

配送费

int(11))

允许

12

shangpinxiangqing`

商品详情

longtext

允许

13

pingfen`

评分

varchar(200)

允许

14

`zhanghao

账号

varchar(200)

允许

15

shangjiaxingming

商家姓名

varchar(200)

允许

16

lianxidianhua`

联系电话

varchar(200)

允许

17

userid

用户编号

bigint(20)

第5章 系统的实现

5.1微信端功能模块的实现

5.1.1注册登录界面

没有账号的用户和骑手均可进行注册操作,注册后可进行登录系统,用户注册登录界面展示如图5.1所示。

 

 

 

图5.1 用户注册登录界面

5.1.2首页界面

用户和骑手登录后均可进入首页查看首页信息,首页界面展示如图5.2所示。

 

图5.2首页界面

5.1.3商品信息界面

用户登录后可查看商品信息,并可根据条件快速查询所需商品,可选择商品进行查看详情操作,商品信息界面展示如图5.3所示。

 

 

图5.3 商品信息界面

5.1.4订单支付界面

用户对个人订单可选择进行支付操作,订单支付界面展示如图5.4所示。

 

 

图5.4 订单支付界面

5.1.5配送接单界面

骑手登录后可查看订单信息,并可选择进行配送接单,配送接单界面展示如图5.5所示。

 

 

图5.5 配送接单界面

5.1.6配送订单界面

用户可查看骑手接单信息,并可对其进行审核操作,配送订单界面展示如图5.6所示。

 

图5.6 配送订单界面

5.2服务端功能模块的实现

5.2.1服务端登录界面

管理员和商家要想进入对应角色后台进行管理操作,必须进行登录,服务端登录界面展示如图5.7所示。

 

图5.7 服务端登录界面

5.2.2用户管理界面

管理员登录后可查看所有用户信息,并可对其进行修改和删除操作,用户管理界面如图5.8所示。

 

图5.8 用户管理界面

5.2.3商家管理界面

管理员在商家管理界面可查看所有商家信息,对已有商家信息可进行编辑和删除操作,商家管理界面如图5.9所示。

 

图5.9 商家管理界面

5.2.4骑手管理界面

管理员可查看、修改和删除骑手信息,骑手管理界面展示如图5.10所示。

 

图5.10 骑手管理界面

5.2.5商品信息管理界面

商家可增删改查个人店铺商品信息,管理员可管理所有商品信息,商品信息管理界面展示如图5.11所示。

 

图5.11 商品信息管理界面

5.2.6订单信息管理界面

商家可管理个人店铺订单,管理员可管理所有订单,订单信息管理界面展示如图5.12所示。

 

图5.12 订单信息管理界面

5.2.7配送订单管理界面

商家可管理个人店铺配送订单信息,管理员可管理所有配送订单信息,配送订单管理界面展示如图5.13所示。

 

图5.13 配送订单管理界面


原文地址:https://blog.csdn.net/u014445459/article/details/144017968

免责声明:本站文章内容转载自网络资源,如本站内容侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!