基微信程序健身商城台
Fitness Ecommerce Platform Based on Wechat Small Program
中文摘：
伴着新媒体发展现代科技信息技术新媒体带领断发展更新微信程序受电子商务界热捧量APP应提供功程序提供时微信拥身庞户基数定程度微信程序发展奠定基础相传统线健身室实体店营方式开发线商城着拟优势
文设计开发套基微信程序健身商城台系统介绍微信程序开发基础出健身商城台系统总体设计方案技术路线展示系统运行效果台资讯健身网络课程户提供线购买服务利nestjs框架搭建台vue框架进行前台搭建前台通JSON数交互测试表明系统够实现户需求效果
系统开发够减少实体店运营成易商家开拓域客源推进互联网+健身行业新业态具定实性适应行业转型发展意义
关键词：程序 健身商城 功体验 发展意义
Abstract
With the development of new media modern technology and information technology under the leadership of new media continue to develop and update WeChat small program by the ecommerce industry The functions provided by a large number of apps can also be provided by small programs At the same time WeChat has its own large user base to a certain extent for the development of WeChat small procedures laid a foundation Compared with the traditional offline physical fitness shop the development of online mall has incomparable advantages
This paper designs and develops a set of fitness mall platform system based on WeChat small program On the basis of introducing the development of WeChat small program it gives the overall design scheme and technical route of fitness mall platform system and shows the running effect of the system The platform focuses on information and fitness online courses and provides online purchasing services for users It mainly USES nest Js framework to build the background vue framework to build the foreground and the foreground and background to interact with JSON data The e test shows that the system can achieve the user＇s demand effect
The development of the system can reduce the operation cost of physical stores make it easier for businesses to develop customers in various regions and promote the new format of Internet + fitness industry which has certain practicability and significance to adapt to the transformation and development of the industry
Keywords applet fitness mall functional experience development significance
目录
第章 绪 1
11 项目背景意义 1
12 国外发展现状 1
13 文研究容 2
14 文结构 2
第二章 开发工具介绍 3
21 微信程序 3
211 微信web开发者工具软件 3
212 微信程序API 4
22 Hbuilder x软件 4
23 visual studio code软件 4
24 MySQL Workbench软件 4
第三章 系统行性分析需求分析 4
31 行性分析 4
311 技术行性 4
312 济行性 5
32 需求分析 5
321 台功需求 5
322 台性需求 6
323 户特点 6
第四章 系统设计 6
41 系统物理设计 6
42 系统户角色设计 8
43 系统功设计 9
431 微信程序端 9
432 服务器端 10
44 系统数库设计 11
441 系统数库ER图设计 11
442 系统数库逻辑结构设计 12
第五章 系统实现 15
51 登录注册功 15
52 资讯功 17
53 商城页功 18
531 视频播放 18
532 商品详情页面 18
533 收藏购物车 19
534 商品购买 20
54 中心功 20
541 订单查询 21
542 健身日记 22
543 智客服 24
544 设置 25
第六章 测试调试 26
61 资讯页面测试 26
62 商品购买测试 26
63 日记编写测试 27
第七章 总结展 27
71 总结 27
72 展 27
参考文献 28
致谢28
第章 绪
11 项目背景意义
着新媒体应开发时伴着电子网络技术提升基够拥台智手机手机愈愈演变成必少生活具新代网络沟通工具基微信等软件代
2017年4月24日腾讯软件公司公布旗微信产品新2017微信户&生态研究报告根份新研究里数方知微信正式新媒体推出面广应市场截止2016年12月全球累计微信户量账号月达889亿微信附带公众号阅读台申请约1000万带动网络信息效应济消费总17425亿元占年中国信息消费总规模达454微信程序E时代中发展正微信背拥口基数支撑
目前基生活工作压力忙碌锻炼健身时间工作者说种奢侈型线健身室方等问题需客户实体店进行注册会员课程选择锻炼等疑客户造成时间空间限制相传统线健身室实体店营方式线健身商城台程序拟优势程序客户进行时注册课程购买时练减少实体店运营成信息体化理易商家开拓域客源设计基微信程序健身商城台目商家破传统营销模式面更广泛客源针位户需求购买属课程定制私教练方便户时健身锻炼根具体应情况界面清晰便操作维护健身秘书名健身商城台推进健身行业互联网+相结合具定实性适应行业转型发展新发展
12 国外发展现状
着世界科技信息技术断发展进步信息技术已普社会生活等方层面势趋2017年腾讯微信通讯软件基础推出微信程序应优点存占户需移动客服端扫扫需载应程式该程序年微信程序电子商务应运生技术发展愈愈成熟量APP应提供功程序提供成开发方API接口获取数微信程序降低难度市场需求方面商家户接受仅商家台说商机户角度提供足够便利线实体店转型线微商台直呈升趋势健身方注入微信程序新苗头具发展潜力
根国家卫计委统计数分析显示2015年中国居民健康素养水1025增长046百分点呈现稳步升态势时目标2020年国居民健康素养水达 202030 年达 30仅国民健康素养求断提升时健身需求断增加群体方面民健身消费需求日益剧烈膨胀市场处供应求形势然国健身行业终端消费发展目标逐渐线二线城市倾斜中国健身行业区域发展呈稳定趋势
国现代网络技术起步晚期发展快实体健身行业营方式线营手段方式规限等条件存着较差异线台存较优点开发者消费者支持网络市场少关健身类型题APP成型例子例：Keep运动软件产品整体开发设计没展现出轻易效果功方面覆盖量较健身类型商城台建立微信程序值研究设计问题
13 文研究容
文研究设计基微信程序健身商城台系统健身商城台系统分户登录日资讯健身商城中心四部分中第部分户新建注册信息完成注册实现登录便查中心第二部分资讯页面提供天精彩健康资讯户需登录浏览日新闻容第三部分商城台具线课程器材等类商品购买第四部分中心页面户提供订单查询购买等信息健身日记智机器客服服务功现实系统设计完成成果整体前端设计暖调住符合众设计眼光页面清晰简单利户操作简便功齐全够实现户基需求
文设计健身商城台系统HTMLCSS JavaScript逻辑框架等技术实现程序前端界面采MSq1数库JavaScriptvue逻辑框架等技术实现程序台数处理系统数源调API接口通MySql数库入库提供系统HbuilderX软件编写代码开发设计台逻辑微信开发者工具检测系统台前端时效果功实现情况MySql数库储存商城订单户间物理量等容系统进行部署设计
14 文结构
文介绍基微信程序健身商城台开发实现系统瀑布模型软件开发程进行系统设计实现全文分七章节分：
第1章绪：介绍健身商城台开发背景实际意义根前国外发展现状结合系统开发目开发容介绍出系统功介绍文文结构安排
第2章开发工具介绍：章介绍开发程中技术框架开发软件
第3章需求分析行性分析：章介绍系统行性分析中技术济行性分析列出系统功性等需求分析
第4章系统设计：章次介绍系统结构设计数库设计
第5章系统实现：章根户线户实现功进行功介绍系统功关键代码进行介绍
第6章系统测试：章首先列出关测试系统必性原性列举三测试实例说明相关情况
第7章总结展：章针整系统开发研究程进行总结概括系统总体功收获提出系统足处便改进
第二章 开发工具介绍
系统采开发框架整体响应式数绑定系统视图界面台数直接简单快速保持更新步系统拆分成视图层逻辑层两分层开发程中逻辑层修改更改数系统视图层会根数改变步新响应界面整系统页面路属响应式开发框架理利点界面缝切换终界面赋予新生命周期开发程中重中重系统页面数生命周期函数方法等开发框架里进行处理
21 微信程序
211 微信web开发者工具软件
微信web开发者工具款基微信软件系列开发编辑器集中开发调试等功软件微信web开发者工具界面工具分三区域：模拟器程序操作区调试工具模拟器客户端界面真实逻辑表现显示出模拟器呈现出绝部分 API状态调试工具划分 6 功模块包括Appdata Network WxmlConsoleStorageSourcesWxmlPannel系统微信开发者工具作总体测试
212 微信程序API
微信程序API帮助实现微信程序强功接口提供网络请求数交互开放接口设备界面等功获取数需通网络接口实现针系统中资讯页面智机器模块需填写相应服务网络接口址请求方法应key时配置json文件需设置回调函数
22 Hbuilder x软件
Hbuilder x款前端开发工具软件支持HTML5Web开发IDE语言JavaWebCRuby包含Eclipse插件全代码语法库兼容数支撑HTMLCSSJSPHP等语言Hbuilder x里快速开发语法提示库框架emmetjquerybootstrapangularmui等中亮点预编辑器lesssass等编写JSDoc利提升代码读性生成API手册框架
系统利跨台开发基uniappVue框架作前端Vue基JavaScript创建设计测试性维护性更强代码库换句话说Vue渐进式页面划分成复组件组件属渲染页面相应方HtmlCSSJavaScript
23 visual studio code软件
visual studio code款支持Git 开箱编辑器软件款现代代码编辑器具收集代码片段匹配括号语法高亮绑定热键等便捷功受程序员欢迎热捧系统采vs软件编写代码台nestjs框架进行开发
24 MySQL Workbench软件
MySQL Workbench前身基MySQL数库融合视化图层功成款新集成化数库软件SQL取代My SQL Query Bro wser数库理取代My SQL Adminstrator系统数库采My SQL作系统数支撑
第三章 系统行性分析需求分析
31 行性分析
行性分析系统需求分析前提开展行性分析利续系统开发
311 技术行性
台系统终拟定Windows 7更高版操作系统web服务器编辑调试终发布iOS安卓操作系统运行
硬件方面：现代社会户普遍具备台具ios安卓系统手机硬件条件台提供硬性支持
网络方面：网络ipv4ipv6移动蜂窝
软件方面：台采windows等集成网络开发软件DNS服务器FTP服务器等采Dcloud公司开发Hbuilderx做系统框架商城台中vue框架定义许功函数方便快速开发出户界面
312 济行性
（1）成收益分析：电子商务台开发成角度鉴传统APP开发程集成开发环境已组件第三方库加原微信强基础台开发成低运营成角度减免实体店力资源成交易环境活动空间突破传统限制降低运营成根健身行业基行情系统进入市场环节系统收益系统开发成会实现定济效益
（2）短期长远利益分析：系统开成低短期基开发开支会定利益收入长远维护系统开发升级维护成升收益然保持稳升状态
32 需求分析
系统采结构化需求分析方法瀑布模型作需求分析第步
出需求分析系统开发占首位
321 台功需求
目前线实体行业健身中心采取工理存着量必浪费余成减掉成维持行业营行业质量会出现受相应良影响情况时线营容易受方面社会济确定素诸影响加传统健身行业发展理相较落信息网络变更影响代实体行业发展台根特点弊端进行线健身行业开发健身商城台系统功包括储存删查找修改信息传文件视化窗口界面根资料搜集需求设计出商城前台台指定求系统拥服务功：
（1）户注册登录功
（2）资讯功：包括新闻容增加满足户元化浏览需求
（3）商城功：包括商品详细容满足户寻找合适商品需求
（4）中心功：包括户账户里详细订单信息信息智客服日记等容满足户时查询账号信息容需求
322 台性需求
系统环境数量应线环境保持致台线预期性指标时期间秒登录户数量30特殊情况秒1000
针系统具体特点系统求提出性方面求：
（1）系统数库性求定义址仓库便系统数扩展移植
（2）种系统进行操作种服务器正常运行独立性强系统结构影响较
（3）支持流网络协议例TCPIP等
323 户特点
新媒体环境时代众媒体客户端出现PC端转手机移动端现象直呈升趋势2020年微信户数量已突破10亿次网络微信已定基础支持时程序发展相较热收追捧现代热衷网络消费网络消费趋年轻化
系统目标户介18岁35岁青年群体青年群体具基网络熟悉度稳居收入阶层定济基础支撑进行网购物根现阶段国健身市场呈现出样化特点青年群体成健身市场推动力量
第四章 系统设计
系统总体设计系统外构造搭建进行总概括设计系统总体框架间房屋梁柱支撑系统设计重组成部分
41 系统物理设计
台系统物理设计分六层分系统微信程序UI层展示层业务层数层数库层运行环境层台系统物理设计图1示
图 1 系统总体设计图
系统微信程序UI层页面详情容样式结构进行配置
系统展示层UI层页面网络接口交互进行展示
系统业务层系统中提供项功服务
系统数层读取户数消息微信程序nestjs台框架业务层交互链接
系统数库层数持久化数层相互融合联系
系统运行环境客户移动端系统服务器进行访问进行网络传输访问
整体系统架构通户手机移动端完成相关程序操作相关信息会传输数库服务器Web端进行数输入处理保存理分析程序代码编写完成代码通微信开发者工具编译成功户手机端实现通登录等数信息输入完成信息获取实现线购买查询等功时理员台数库全部户信息进行查理解户需商城状态实现交互作
42 系统户角色设计
系统户角色设计分普通众户理员普通众户手机移动客户端设备中进行系统侧重功理员说注重台数理
前端普通户者说例：
1资讯浏览
2商品查四扩展分四全身运动课程徒手运动课程瑜伽运动课程健身器材
3单商品查该例两泛化例分查简介价格收藏加入购物车
4中心该例四扩展例分信息添加修改订单详情查询日记客服
系统前端普通户例图图2示
图 2 前端普通户例图
台理者说功系统中数进行理台理者例包括前端户信息理资讯更新理健身订单理健身日记理机器客服台理等理员例图图3示：
图 3 台理者例图
43 系统功设计
431 微信程序端
前端部分根户需求系统分析需求程序端应模块：户登录注册资讯页交易商城（收藏加入购物车立购买生成订单付款收货）智客服健身日记五模块
（1）登录流程模块
台系统登录方式采户名密码方式登录登录户微信数绑定显示微信户名称头保持致户需商城台时分两种情况：①正常登录户已户名密码情况正常登录②新户户第次台时点击注册账号填入户名密码选择协议注册新账户登录处理流程图示
（2）资讯浏览模块
健身商城首页会显示环球网民网北京青年报网易综合中国新闻网网易健康等媒体网络网站天关健康资讯新闻容咨询容达10条天更新户根喜点击开查阅查阅程中开网站里链接资讯页面功提供没登录户
（3） 交易商城
商城页面交易商品包括全身运动课程徒手运动课程瑜伽运动课程健身器材四网课商品类类商品相应视频介绍户根需购买相应健身网课器材具体商品页面相应课程介绍课时时长消耗卡路里具体日课程容商城功需户登录①收藏商品课程商品页里户喜欢某商品想易翻查记录点击页面左角收藏图案进行收藏点击收藏星星图案填充橙色文字显示已收藏户收藏容页面里收藏查找详细商品信息②加入购物车课程商品页里户喜欢某商品会立点击购买时点击页面底部第二购物车钮健身课程商品加入购物车
（4）智客服户浏览商品商品疑问时候通点击中心里智客服户发送相关问题智客服出相应回复
（5）健身日记户登录系统时天观健身课程学训练时长容学点心情等信息记录中心里健身日记天编写日记数量受限制户时删日记容台根户账户信息日记数储存户退出登录次次登录重新查阅编写日记容
432 服务器端
服务器端挂历系统数包括户理商品理订单理日记理客服理资讯理等
系统整体功框架结构图4示：
图 4 系统功框架图
44 系统数库设计
完整数库软件系统台里理着量数重支撑良全面数库保证系统数完整性前提者够效数节省储存空间方便理数库应系统数库条道路条道路规划良具定前瞻性车流量会道路造成塞车现象理数库进行设计时第需满足数设计准测第二需列明系统中数库中实体间关系第三数库中表里设定该实体具备属性设定合适外键满足数库设计响应约束
441 系统数库ER图设计
前章功分析分析知系统台设计实体7：户商品订单订单详情收藏购物车址实体关系：
微信户前提拥商城账号户时创建拥账号户微信户账号间关系
健身商城里商品商城账户收藏户收藏商品网课商城商品商城户间关系
商城户加入购物车商城商品商城商品商城户加入购物车二者关系
商城户创建商城订单商城订单商城户创建商城户商城订单间关系
商城商品产生商城订单商城订单属商城商品商城商品商城订单间关系关系
商城订单产生商城订单详情商城订单详情属商城订单商城订单商城订单详情间关系关系
邮寄址属商城户商城户拥邮寄址商城户邮寄址间关系关系
商城订单邮寄址邮寄址应商城订单商城订单邮寄址间关系关系
根述分析获系统ER图图5示
图 5 数库ER图
图知户实体包括属性：商城户ID商城户名商城密码程序昵称程序头商品实体属性包括：商城商品ID商品标题商品容商品分类订单实体属性包括：商城户ID订单创建时间订单总价订单状态订单详情实体属性包括：商城商品ID商品订单ID商品数量收藏实体属性包括：商品收藏ID商城商品ID商城户ID购物车实体属性包括：购物车ID商城商品ID商城户ID商品数量址实体属性包括：址ID昵称详细址联系电话创建时间
442 系统数库逻辑结构设计
根数库ER图设计完成系统数库逻辑设计出系统数库表关系图图6示系统采mysql workbench软件进行数库设计navicat编写语句查询数7张表分户表商品表订单表订单详情表收藏表购物车表址表系统表关系表17示
图 6数库关系图
表1 记录系统户表信息包括属性：昵称头创建时间户ID户ID密码
名称
数类型
非空？
键？
外键？
备注
User_id
Varchar(50)
否
户ID
User name
Varchar(20)
否
否
户ID
Pass word
Varchar(255)
否
否
密码
Nickname
Varchar(20)
否
否
昵称
avatar
Varchar(255)
否
否
头
Creat_time
Varchar(50)
否
否
创建时间
表 1 户表
表2记录商品表包括属性：商品ID标题容（详情图片购买数天数消耗卡路里天需时间）分类价格
名称
数类型
非空？
键？
外键？
备注
Item_id
Varchar(50)
商品ID
Title
Varchar(255)
否
否
标题
Detail
TinyText
否
否
详情
Img_url
Varchar(255)
否
否
图片
Count
Int
否
否
购买数
Days
Int
否
否
天数
Consume_calorie
Int
否
否
消耗卡路里
Min_per_day
Int
否
否
天需时间
category
Varchar(45)
否
否
分类
Price
Decimal(10)
否
否
价格
表 2 商品表
表3系统订单表包括属性：户ID创建时间总价状态址ID
名称
数类型
非空？
键？
外键？
备注
Order_id
Varchar(50)
否
订单ID
User_id
Varchar(50)
否
户ID
Created_at
Datetime
否
否
创建时间
sum
Decimal
否
否
总价
status
Int
否
否
状态
Address_id
Varchar(50)
否
址ID
表 3 订单表
表4记录系统订单详情表属性包括：商品ID订单ID数量
名称
数类型
非空？
键？
外键？
备注
Item_id
Varchar(50)
否
否
商品ID
Order_id
Varchar(50)
否
否
订单ID
count
Int
否
否
数量
表 4 订单详情表
表5记录收藏表属性包括：收藏ID商品ID户ID
名称
数类型
非空？
键？
外键？
备注
Collection_id
Varchar(50)
否
收藏ID
Item_id
Varchar(50)
否
商品ID
User_id
Varchar(50)
否
户ID
表 5 收藏表
表6记录购物车表实体属性包括：购物车ID商品ID户ID数量
名称
数类型
非空？
键？
外键？
备注
cart_id
Varchar(50)
否
购物车ID
Item_id
Varchar(50)
否
商品ID
User_id
Varchar(50)
否
户ID
count
Int
否
否
数量
表 6 购物车表
表7记录址表属性包括：址ID昵称详细址联系电话创建时间户ID
名称
数类型
非空？
键？
外键？
备注
address_id
Varchar(50)
否
址ID
Name
Varchar(45)
否
否
昵称
address
Varchar(45)
否
详细址
tel
Varchar(45)
否
否
联系电话
Created_at
Datetime
否
否
创建时间
User_id
Varchar(50)
否
户ID
表 7 址表
第五章 系统实现
51 登录注册功
户需商城台进行购买商品时首先需进行登录账户登录账户需填写户名密码中密码长度5位密码错误情况界面会出现提示户首次登录需进行注册根页面提示勾选协议成功注册功界面图7示：
图 7 登陆注册图
定义 salt 方法生成salt 加密密码登录注册功实现代码示：
let { username password nickName avatarUrl } userRegisterDto let newUser new User()
const SALT genSaltSync(10)
newUseruserId generateUUID()
newUserpassword hashSync(password SALT)
newUserusername username
newUseravatar avatarUrl
newUsernickname nickName
try {
await thisuserRepositoryinsert(newUser)
52 资讯功
户授权成功进入程序系统首页数条健康资讯户通滑动选择感兴趣新闻容功界面图8示：
图 8 资讯页面图
网络接口API形式进行获取资讯容资讯功实现代码示：
Async queryNews()
{let res a wait get(＇https3g163comtouchreconstructarticlelistBDC4QSV3wangning010html＇)
consolelog(typeof res)
let reg ＼[*＼]
res resmatch(reg)[0]
let data JSONparse(res)
return data}
53 商城页功
531 视频播放
商城台里页面页面中部会两相关容健身视频户根需求点击观功界面图9示：
图 9 视频播放图
视频采址外链方式实现代码：
Fitness Ecommerce Platform Based on Wechat Small Program
中文摘：
伴着新媒体发展现代科技信息技术新媒体带领断发展更新微信程序受电子商务界热捧量APP应提供功程序提供时微信拥身庞户基数定程度微信程序发展奠定基础相传统线健身室实体店营方式开发线商城着拟优势
文设计开发套基微信程序健身商城台系统介绍微信程序开发基础出健身商城台系统总体设计方案技术路线展示系统运行效果台资讯健身网络课程户提供线购买服务利nestjs框架搭建台vue框架进行前台搭建前台通JSON数交互测试表明系统够实现户需求效果
系统开发够减少实体店运营成易商家开拓域客源推进互联网+健身行业新业态具定实性适应行业转型发展意义
关键词：程序 健身商城 功体验 发展意义
Abstract
With the development of new media modern technology and information technology under the leadership of new media continue to develop and update WeChat small program by the ecommerce industry The functions provided by a large number of apps can also be provided by small programs At the same time WeChat has its own large user base to a certain extent for the development of WeChat small procedures laid a foundation Compared with the traditional offline physical fitness shop the development of online mall has incomparable advantages
This paper designs and develops a set of fitness mall platform system based on WeChat small program On the basis of introducing the development of WeChat small program it gives the overall design scheme and technical route of fitness mall platform system and shows the running effect of the system The platform focuses on information and fitness online courses and provides online purchasing services for users It mainly USES nest Js framework to build the background vue framework to build the foreground and the foreground and background to interact with JSON data The e test shows that the system can achieve the user＇s demand effect
The development of the system can reduce the operation cost of physical stores make it easier for businesses to develop customers in various regions and promote the new format of Internet + fitness industry which has certain practicability and significance to adapt to the transformation and development of the industry
Keywords applet fitness mall functional experience development significance
目录
第章 绪 1
11 项目背景意义 1
12 国外发展现状 1
13 文研究容 2
14 文结构 2
第二章 开发工具介绍 3
21 微信程序 3
211 微信web开发者工具软件 3
212 微信程序API 4
22 Hbuilder x软件 4
23 visual studio code软件 4
24 MySQL Workbench软件 4
第三章 系统行性分析需求分析 4
31 行性分析 4
311 技术行性 4
312 济行性 5
32 需求分析 5
321 台功需求 5
322 台性需求 6
323 户特点 6
第四章 系统设计 6
41 系统物理设计 6
42 系统户角色设计 8
43 系统功设计 9
431 微信程序端 9
432 服务器端 10
44 系统数库设计 11
441 系统数库ER图设计 11
442 系统数库逻辑结构设计 12
第五章 系统实现 15
51 登录注册功 15
52 资讯功 17
53 商城页功 18
531 视频播放 18
532 商品详情页面 18
533 收藏购物车 19
534 商品购买 20
54 中心功 20
541 订单查询 21
542 健身日记 22
543 智客服 24
544 设置 25
第六章 测试调试 26
61 资讯页面测试 26
62 商品购买测试 26
63 日记编写测试 27
第七章 总结展 27
71 总结 27
72 展 27
参考文献 28
致谢28
第章 绪
11 项目背景意义
着新媒体应开发时伴着电子网络技术提升基够拥台智手机手机愈愈演变成必少生活具新代网络沟通工具基微信等软件代
2017年4月24日腾讯软件公司公布旗微信产品新2017微信户&生态研究报告根份新研究里数方知微信正式新媒体推出面广应市场截止2016年12月全球累计微信户量账号月达889亿微信附带公众号阅读台申请约1000万带动网络信息效应济消费总17425亿元占年中国信息消费总规模达454微信程序E时代中发展正微信背拥口基数支撑
目前基生活工作压力忙碌锻炼健身时间工作者说种奢侈型线健身室方等问题需客户实体店进行注册会员课程选择锻炼等疑客户造成时间空间限制相传统线健身室实体店营方式线健身商城台程序拟优势程序客户进行时注册课程购买时练减少实体店运营成信息体化理易商家开拓域客源设计基微信程序健身商城台目商家破传统营销模式面更广泛客源针位户需求购买属课程定制私教练方便户时健身锻炼根具体应情况界面清晰便操作维护健身秘书名健身商城台推进健身行业互联网+相结合具定实性适应行业转型发展新发展
12 国外发展现状
着世界科技信息技术断发展进步信息技术已普社会生活等方层面势趋2017年腾讯微信通讯软件基础推出微信程序应优点存占户需移动客服端扫扫需载应程式该程序年微信程序电子商务应运生技术发展愈愈成熟量APP应提供功程序提供成开发方API接口获取数微信程序降低难度市场需求方面商家户接受仅商家台说商机户角度提供足够便利线实体店转型线微商台直呈升趋势健身方注入微信程序新苗头具发展潜力
根国家卫计委统计数分析显示2015年中国居民健康素养水1025增长046百分点呈现稳步升态势时目标2020年国居民健康素养水达 202030 年达 30仅国民健康素养求断提升时健身需求断增加群体方面民健身消费需求日益剧烈膨胀市场处供应求形势然国健身行业终端消费发展目标逐渐线二线城市倾斜中国健身行业区域发展呈稳定趋势
国现代网络技术起步晚期发展快实体健身行业营方式线营手段方式规限等条件存着较差异线台存较优点开发者消费者支持网络市场少关健身类型题APP成型例子例：Keep运动软件产品整体开发设计没展现出轻易效果功方面覆盖量较健身类型商城台建立微信程序值研究设计问题
13 文研究容
文研究设计基微信程序健身商城台系统健身商城台系统分户登录日资讯健身商城中心四部分中第部分户新建注册信息完成注册实现登录便查中心第二部分资讯页面提供天精彩健康资讯户需登录浏览日新闻容第三部分商城台具线课程器材等类商品购买第四部分中心页面户提供订单查询购买等信息健身日记智机器客服服务功现实系统设计完成成果整体前端设计暖调住符合众设计眼光页面清晰简单利户操作简便功齐全够实现户基需求
文设计健身商城台系统HTMLCSS JavaScript逻辑框架等技术实现程序前端界面采MSq1数库JavaScriptvue逻辑框架等技术实现程序台数处理系统数源调API接口通MySql数库入库提供系统HbuilderX软件编写代码开发设计台逻辑微信开发者工具检测系统台前端时效果功实现情况MySql数库储存商城订单户间物理量等容系统进行部署设计
14 文结构
文介绍基微信程序健身商城台开发实现系统瀑布模型软件开发程进行系统设计实现全文分七章节分：
第1章绪：介绍健身商城台开发背景实际意义根前国外发展现状结合系统开发目开发容介绍出系统功介绍文文结构安排
第2章开发工具介绍：章介绍开发程中技术框架开发软件
第3章需求分析行性分析：章介绍系统行性分析中技术济行性分析列出系统功性等需求分析
第4章系统设计：章次介绍系统结构设计数库设计
第5章系统实现：章根户线户实现功进行功介绍系统功关键代码进行介绍
第6章系统测试：章首先列出关测试系统必性原性列举三测试实例说明相关情况
第7章总结展：章针整系统开发研究程进行总结概括系统总体功收获提出系统足处便改进
第二章 开发工具介绍
系统采开发框架整体响应式数绑定系统视图界面台数直接简单快速保持更新步系统拆分成视图层逻辑层两分层开发程中逻辑层修改更改数系统视图层会根数改变步新响应界面整系统页面路属响应式开发框架理利点界面缝切换终界面赋予新生命周期开发程中重中重系统页面数生命周期函数方法等开发框架里进行处理
21 微信程序
211 微信web开发者工具软件
微信web开发者工具款基微信软件系列开发编辑器集中开发调试等功软件微信web开发者工具界面工具分三区域：模拟器程序操作区调试工具模拟器客户端界面真实逻辑表现显示出模拟器呈现出绝部分 API状态调试工具划分 6 功模块包括Appdata Network WxmlConsoleStorageSourcesWxmlPannel系统微信开发者工具作总体测试
212 微信程序API
微信程序API帮助实现微信程序强功接口提供网络请求数交互开放接口设备界面等功获取数需通网络接口实现针系统中资讯页面智机器模块需填写相应服务网络接口址请求方法应key时配置json文件需设置回调函数
22 Hbuilder x软件
Hbuilder x款前端开发工具软件支持HTML5Web开发IDE语言JavaWebCRuby包含Eclipse插件全代码语法库兼容数支撑HTMLCSSJSPHP等语言Hbuilder x里快速开发语法提示库框架emmetjquerybootstrapangularmui等中亮点预编辑器lesssass等编写JSDoc利提升代码读性生成API手册框架
系统利跨台开发基uniappVue框架作前端Vue基JavaScript创建设计测试性维护性更强代码库换句话说Vue渐进式页面划分成复组件组件属渲染页面相应方HtmlCSSJavaScript
23 visual studio code软件
visual studio code款支持Git 开箱编辑器软件款现代代码编辑器具收集代码片段匹配括号语法高亮绑定热键等便捷功受程序员欢迎热捧系统采vs软件编写代码台nestjs框架进行开发
24 MySQL Workbench软件
MySQL Workbench前身基MySQL数库融合视化图层功成款新集成化数库软件SQL取代My SQL Query Bro wser数库理取代My SQL Adminstrator系统数库采My SQL作系统数支撑
第三章 系统行性分析需求分析
31 行性分析
行性分析系统需求分析前提开展行性分析利续系统开发
311 技术行性
台系统终拟定Windows 7更高版操作系统web服务器编辑调试终发布iOS安卓操作系统运行
硬件方面：现代社会户普遍具备台具ios安卓系统手机硬件条件台提供硬性支持
网络方面：网络ipv4ipv6移动蜂窝
软件方面：台采windows等集成网络开发软件DNS服务器FTP服务器等采Dcloud公司开发Hbuilderx做系统框架商城台中vue框架定义许功函数方便快速开发出户界面
312 济行性
（1）成收益分析：电子商务台开发成角度鉴传统APP开发程集成开发环境已组件第三方库加原微信强基础台开发成低运营成角度减免实体店力资源成交易环境活动空间突破传统限制降低运营成根健身行业基行情系统进入市场环节系统收益系统开发成会实现定济效益
（2）短期长远利益分析：系统开成低短期基开发开支会定利益收入长远维护系统开发升级维护成升收益然保持稳升状态
32 需求分析
系统采结构化需求分析方法瀑布模型作需求分析第步
出需求分析系统开发占首位
321 台功需求
目前线实体行业健身中心采取工理存着量必浪费余成减掉成维持行业营行业质量会出现受相应良影响情况时线营容易受方面社会济确定素诸影响加传统健身行业发展理相较落信息网络变更影响代实体行业发展台根特点弊端进行线健身行业开发健身商城台系统功包括储存删查找修改信息传文件视化窗口界面根资料搜集需求设计出商城前台台指定求系统拥服务功：
（1）户注册登录功
（2）资讯功：包括新闻容增加满足户元化浏览需求
（3）商城功：包括商品详细容满足户寻找合适商品需求
（4）中心功：包括户账户里详细订单信息信息智客服日记等容满足户时查询账号信息容需求
322 台性需求
系统环境数量应线环境保持致台线预期性指标时期间秒登录户数量30特殊情况秒1000
针系统具体特点系统求提出性方面求：
（1）系统数库性求定义址仓库便系统数扩展移植
（2）种系统进行操作种服务器正常运行独立性强系统结构影响较
（3）支持流网络协议例TCPIP等
323 户特点
新媒体环境时代众媒体客户端出现PC端转手机移动端现象直呈升趋势2020年微信户数量已突破10亿次网络微信已定基础支持时程序发展相较热收追捧现代热衷网络消费网络消费趋年轻化
系统目标户介18岁35岁青年群体青年群体具基网络熟悉度稳居收入阶层定济基础支撑进行网购物根现阶段国健身市场呈现出样化特点青年群体成健身市场推动力量
第四章 系统设计
系统总体设计系统外构造搭建进行总概括设计系统总体框架间房屋梁柱支撑系统设计重组成部分
41 系统物理设计
台系统物理设计分六层分系统微信程序UI层展示层业务层数层数库层运行环境层台系统物理设计图1示
图 1 系统总体设计图
系统微信程序UI层页面详情容样式结构进行配置
系统展示层UI层页面网络接口交互进行展示
系统业务层系统中提供项功服务
系统数层读取户数消息微信程序nestjs台框架业务层交互链接
系统数库层数持久化数层相互融合联系
系统运行环境客户移动端系统服务器进行访问进行网络传输访问
整体系统架构通户手机移动端完成相关程序操作相关信息会传输数库服务器Web端进行数输入处理保存理分析程序代码编写完成代码通微信开发者工具编译成功户手机端实现通登录等数信息输入完成信息获取实现线购买查询等功时理员台数库全部户信息进行查理解户需商城状态实现交互作
42 系统户角色设计
系统户角色设计分普通众户理员普通众户手机移动客户端设备中进行系统侧重功理员说注重台数理
前端普通户者说例：
1资讯浏览
2商品查四扩展分四全身运动课程徒手运动课程瑜伽运动课程健身器材
3单商品查该例两泛化例分查简介价格收藏加入购物车
4中心该例四扩展例分信息添加修改订单详情查询日记客服
系统前端普通户例图图2示
图 2 前端普通户例图
台理者说功系统中数进行理台理者例包括前端户信息理资讯更新理健身订单理健身日记理机器客服台理等理员例图图3示：
图 3 台理者例图
43 系统功设计
431 微信程序端
前端部分根户需求系统分析需求程序端应模块：户登录注册资讯页交易商城（收藏加入购物车立购买生成订单付款收货）智客服健身日记五模块
（1）登录流程模块
台系统登录方式采户名密码方式登录登录户微信数绑定显示微信户名称头保持致户需商城台时分两种情况：①正常登录户已户名密码情况正常登录②新户户第次台时点击注册账号填入户名密码选择协议注册新账户登录处理流程图示
（2）资讯浏览模块
健身商城首页会显示环球网民网北京青年报网易综合中国新闻网网易健康等媒体网络网站天关健康资讯新闻容咨询容达10条天更新户根喜点击开查阅查阅程中开网站里链接资讯页面功提供没登录户
（3） 交易商城
商城页面交易商品包括全身运动课程徒手运动课程瑜伽运动课程健身器材四网课商品类类商品相应视频介绍户根需购买相应健身网课器材具体商品页面相应课程介绍课时时长消耗卡路里具体日课程容商城功需户登录①收藏商品课程商品页里户喜欢某商品想易翻查记录点击页面左角收藏图案进行收藏点击收藏星星图案填充橙色文字显示已收藏户收藏容页面里收藏查找详细商品信息②加入购物车课程商品页里户喜欢某商品会立点击购买时点击页面底部第二购物车钮健身课程商品加入购物车
（4）智客服户浏览商品商品疑问时候通点击中心里智客服户发送相关问题智客服出相应回复
（5）健身日记户登录系统时天观健身课程学训练时长容学点心情等信息记录中心里健身日记天编写日记数量受限制户时删日记容台根户账户信息日记数储存户退出登录次次登录重新查阅编写日记容
432 服务器端
服务器端挂历系统数包括户理商品理订单理日记理客服理资讯理等
系统整体功框架结构图4示：
图 4 系统功框架图
44 系统数库设计
完整数库软件系统台里理着量数重支撑良全面数库保证系统数完整性前提者够效数节省储存空间方便理数库应系统数库条道路条道路规划良具定前瞻性车流量会道路造成塞车现象理数库进行设计时第需满足数设计准测第二需列明系统中数库中实体间关系第三数库中表里设定该实体具备属性设定合适外键满足数库设计响应约束
441 系统数库ER图设计
前章功分析分析知系统台设计实体7：户商品订单订单详情收藏购物车址实体关系：
微信户前提拥商城账号户时创建拥账号户微信户账号间关系
健身商城里商品商城账户收藏户收藏商品网课商城商品商城户间关系
商城户加入购物车商城商品商城商品商城户加入购物车二者关系
商城户创建商城订单商城订单商城户创建商城户商城订单间关系
商城商品产生商城订单商城订单属商城商品商城商品商城订单间关系关系
商城订单产生商城订单详情商城订单详情属商城订单商城订单商城订单详情间关系关系
邮寄址属商城户商城户拥邮寄址商城户邮寄址间关系关系
商城订单邮寄址邮寄址应商城订单商城订单邮寄址间关系关系
根述分析获系统ER图图5示
图 5 数库ER图
图知户实体包括属性：商城户ID商城户名商城密码程序昵称程序头商品实体属性包括：商城商品ID商品标题商品容商品分类订单实体属性包括：商城户ID订单创建时间订单总价订单状态订单详情实体属性包括：商城商品ID商品订单ID商品数量收藏实体属性包括：商品收藏ID商城商品ID商城户ID购物车实体属性包括：购物车ID商城商品ID商城户ID商品数量址实体属性包括：址ID昵称详细址联系电话创建时间
442 系统数库逻辑结构设计
根数库ER图设计完成系统数库逻辑设计出系统数库表关系图图6示系统采mysql workbench软件进行数库设计navicat编写语句查询数7张表分户表商品表订单表订单详情表收藏表购物车表址表系统表关系表17示
图 6数库关系图
表1 记录系统户表信息包括属性：昵称头创建时间户ID户ID密码
名称
数类型
非空？
键？
外键？
备注
User_id
Varchar(50)
否
户ID
User name
Varchar(20)
否
否
户ID
Pass word
Varchar(255)
否
否
密码
Nickname
Varchar(20)
否
否
昵称
avatar
Varchar(255)
否
否
头
Creat_time
Varchar(50)
否
否
创建时间
表 1 户表
表2记录商品表包括属性：商品ID标题容（详情图片购买数天数消耗卡路里天需时间）分类价格
名称
数类型
非空？
键？
外键？
备注
Item_id
Varchar(50)
商品ID
Title
Varchar(255)
否
否
标题
Detail
TinyText
否
否
详情
Img_url
Varchar(255)
否
否
图片
Count
Int
否
否
购买数
Days
Int
否
否
天数
Consume_calorie
Int
否
否
消耗卡路里
Min_per_day
Int
否
否
天需时间
category
Varchar(45)
否
否
分类
Price
Decimal(10)
否
否
价格
表 2 商品表
表3系统订单表包括属性：户ID创建时间总价状态址ID
名称
数类型
非空？
键？
外键？
备注
Order_id
Varchar(50)
否
订单ID
User_id
Varchar(50)
否
户ID
Created_at
Datetime
否
否
创建时间
sum
Decimal
否
否
总价
status
Int
否
否
状态
Address_id
Varchar(50)
否
址ID
表 3 订单表
表4记录系统订单详情表属性包括：商品ID订单ID数量
名称
数类型
非空？
键？
外键？
备注
Item_id
Varchar(50)
否
否
商品ID
Order_id
Varchar(50)
否
否
订单ID
count
Int
否
否
数量
表 4 订单详情表
表5记录收藏表属性包括：收藏ID商品ID户ID
名称
数类型
非空？
键？
外键？
备注
Collection_id
Varchar(50)
否
收藏ID
Item_id
Varchar(50)
否
商品ID
User_id
Varchar(50)
否
户ID
表 5 收藏表
表6记录购物车表实体属性包括：购物车ID商品ID户ID数量
名称
数类型
非空？
键？
外键？
备注
cart_id
Varchar(50)
否
购物车ID
Item_id
Varchar(50)
否
商品ID
User_id
Varchar(50)
否
户ID
count
Int
否
否
数量
表 6 购物车表
表7记录址表属性包括：址ID昵称详细址联系电话创建时间户ID
名称
数类型
非空？
键？
外键？
备注
address_id
Varchar(50)
否
址ID
Name
Varchar(45)
否
否
昵称
address
Varchar(45)
否
详细址
tel
Varchar(45)
否
否
联系电话
Created_at
Datetime
否
否
创建时间
User_id
Varchar(50)
否
户ID
表 7 址表
第五章 系统实现
51 登录注册功
户需商城台进行购买商品时首先需进行登录账户登录账户需填写户名密码中密码长度5位密码错误情况界面会出现提示户首次登录需进行注册根页面提示勾选协议成功注册功界面图7示：
图 7 登陆注册图
定义 salt 方法生成salt 加密密码登录注册功实现代码示：
let { username password nickName avatarUrl } userRegisterDto let newUser new User()
const SALT genSaltSync(10)
newUseruserId generateUUID()
newUserpassword hashSync(password SALT)
newUserusername username
newUseravatar avatarUrl
newUsernickname nickName
try {
await thisuserRepositoryinsert(newUser)
52 资讯功
户授权成功进入程序系统首页数条健康资讯户通滑动选择感兴趣新闻容功界面图8示：
图 8 资讯页面图
网络接口API形式进行获取资讯容资讯功实现代码示：
Async queryNews()
{let res a wait get(＇https3g163comtouchreconstructarticlelistBDC4QSV3wangning010html＇)
consolelog(typeof res)
let reg ＼[*＼]
res resmatch(reg)[0]
let data JSONparse(res)
return data}
53 商城页功
531 视频播放
商城台里页面页面中部会两相关容健身视频户根需求点击观功界面图9示：
图 9 视频播放图
视频采址外链方式实现代码：