羽焱零食订送系统的开发(附件)【字数：6007】
简便的网络购物流程能够让人们享受方便快捷的购物，对于商家而言，可以增加优质客户数，提升品牌影响力。在查阅了相关网站建设的文献资料以及流程图资料之后，结合羽焱零食的网站运营，设计开发了羽焱零食订送系统。羽焱零食订送系统的前端使用vue.js实现，后端使用node.js，数据库为MySQL。本文详细阐述了系统具体的实现过程，先对零食网站的总体功能需求和模块图进行了分析，介绍了网站的开发和运营环境，分析了该网站的各项功能的实现过程，以及具体的操作方式，接着进行了网站测试，最后总结出该系统网站的未来发展和前景。
目 录
一、引言 1
二、课题简介 1
（一）课题背景 1
（二）课题内容 1
三、网站分析与设计 1
（一）网站功能需求 1
（二）网站功能模块结构图 1
（三）注册流程图 2
（四）下单模块 2
（五）开发及运行环境 2
1. 前端开发环境 3
2. 后台开发环境 3
3. 测试环境 3
四、网站功能实现 3
（一）商品列表 3
1. 搜索商品 3
2. 查看详情 5
（二）购物车 6
1. 添加商品至购物车 6
2. 删除商品 7
3. 增加商品数量 8
4. 减少商品数量 8
（三）地址管理 9
1. 新增地址 9
2. 删除地址 10
（四）付款 12
1. 提交获取订单 12
2. 支付成功 13
（五）订单详情 14
1. 查看所有订单 14
2. 等待收货的订单 15
（六）订单管理 15
1. 确认收货 15
2. 查看成交订单 16
五、网站测试 16
六、未来与展望 17
七、总结 18
致谢 19
参考文献 20
一、引言
随着人们生活水平的不断提高，日常的基本需求已 *好棒文|www.hbsrm.com +Q: ^351916072*
经转向满足、发展、享受的需求，人们不断追求更好质量的美好生活，这是社会发展所产生的必然趋势之一。俗话说“民以食为天”，在当代，“食”的目的不仅是吃饱保命，更是为了要吃好愉快。作为美食中最重要的组成部分之一——零食，越来越受到人们的追捧，尤其是当代年轻人。以此为契机,通过网站的开发一款可以针对零食购买的电商网站,完全可以在生活中满足各层人们对于零食的需求,所以本篇论文主要是以零食网站为研究对象，深入的分析了该网站的各项功能和工作原理,指出该网站弥补了线上目前所空缺的专卖网站中的零食类网站，进而探讨其未来的发展前景。
二、课题简介
（一）课题背景
在当下的快节奏的生活状态下，人们更加热衷于缩短购买流程中所耗费的时间，这是线下消费和综合性电商网站的弱势，正是如此，快捷便利是线上的一大亮点。若消费者购买前，心里已有心仪的商品，那么，消费者在购买时就可以有明确目的的选购，直接下单；若消费者在购买前并没有确定的购买对象，这时，零食网站的优势便能体现出来。零食网站的专业性使得与其它综合行电商网站相比时，更具有简洁性、便利性。没有过多的营销套路、促销手段或者广告，带来极简的购物体验，这是很多综合性网站所不能达到的。
（二）课题内容
零食网站的设计与实现，利用的是笔者在实习期间的知识和平时的项目开发经验等。网站模块包括前台模块和后台模块：在前台模块中用户可以实现在线登录注册，浏览零食列表、查看商品详情以及商品加入购物车等，而查看商品详情是亮点所在。后台功能模块是给网站管理员的功能模块，在零食网站后台功能模块中用户可以实现账号信息管理，修改登录密码，货物商品管理，发货管理，商品信息管理，订单详情管理等功能。
三、网站分析与设计
（一）网站功能需求
注册、登录模块是通过手机号码进行注册登录使用的。登录成功之后显示已有的商品在商品列表。选购的商品可以加入购物车模块中，在购物车模块中可以随意添加、减少、删除商品。选中的商品进行支付，可选择多种支付方式。已经付款的商品会在订单模块出现，用来查看订单状态。
（二）网站功能模块结构图
通过网站功能模块图的整理能够让整个项目的功能模块更加清晰，将网站功能进行说明分析。如图31所示。
图31 功能模块结构图
（三）注册流程图
用户根据个人手机号码和密码进行注册，并在注册成功之后，户籍将数据存放到数据库中，之后通过用户名和密码的登录网站，在网站内部进行调用查看，如图32所示。
图32 注册流程图
（四）下单模块
用户在登录账户之后，寻找自己的合适的商品，进行下单购买，选择好的商品下单后付款之后，数据会通过平台自动跳转到订单页面，如图33所示。
图 33 下单流程图
（五）开发及运行环境
前端开发环境
硬件：window10 32位网站电脑一台（16GB运存，1T内存）
软件：HbuilderX，谷歌浏览器，SDK 1.8、
前端运行命令: npm run dev
后台开发环境
硬件：window10 32位电脑一台（16GB运存，1T内存）
软件：vscode，JDK 1.8
后端接口运行命令: 1.cd servere 2.npm run start
测试环境
window10 32位网站电脑一台（16GB运存，1T内存）：
谷歌浏览器、火狐浏览器
四、网站功能实现
该网站功能主要是通过node.js对接口进行api封装，将通过SQL所建立的数据库中的具体数据与前端通过vue.js所构建的前端页面进行数据交互。分别实现了商品的列表排列、搜索、详情、购物车中商品的增加、减少、删除；付款时地址的更改、新增以及付款成功后的订单查看，确认收货等功能。首页效果图如图41所示。
目 录
一、引言 1
二、课题简介 1
（一）课题背景 1
（二）课题内容 1
三、网站分析与设计 1
（一）网站功能需求 1
（二）网站功能模块结构图 1
（三）注册流程图 2
（四）下单模块 2
（五）开发及运行环境 2
1. 前端开发环境 3
2. 后台开发环境 3
3. 测试环境 3
四、网站功能实现 3
（一）商品列表 3
1. 搜索商品 3
2. 查看详情 5
（二）购物车 6
1. 添加商品至购物车 6
2. 删除商品 7
3. 增加商品数量 8
4. 减少商品数量 8
（三）地址管理 9
1. 新增地址 9
2. 删除地址 10
（四）付款 12
1. 提交获取订单 12
2. 支付成功 13
（五）订单详情 14
1. 查看所有订单 14
2. 等待收货的订单 15
（六）订单管理 15
1. 确认收货 15
2. 查看成交订单 16
五、网站测试 16
六、未来与展望 17
七、总结 18
致谢 19
参考文献 20
一、引言
随着人们生活水平的不断提高，日常的基本需求已 *好棒文|www.hbsrm.com +Q: ^351916072*
经转向满足、发展、享受的需求，人们不断追求更好质量的美好生活，这是社会发展所产生的必然趋势之一。俗话说“民以食为天”，在当代，“食”的目的不仅是吃饱保命，更是为了要吃好愉快。作为美食中最重要的组成部分之一——零食，越来越受到人们的追捧，尤其是当代年轻人。以此为契机,通过网站的开发一款可以针对零食购买的电商网站,完全可以在生活中满足各层人们对于零食的需求,所以本篇论文主要是以零食网站为研究对象，深入的分析了该网站的各项功能和工作原理,指出该网站弥补了线上目前所空缺的专卖网站中的零食类网站，进而探讨其未来的发展前景。
二、课题简介
（一）课题背景
在当下的快节奏的生活状态下，人们更加热衷于缩短购买流程中所耗费的时间，这是线下消费和综合性电商网站的弱势，正是如此，快捷便利是线上的一大亮点。若消费者购买前，心里已有心仪的商品，那么，消费者在购买时就可以有明确目的的选购，直接下单；若消费者在购买前并没有确定的购买对象，这时，零食网站的优势便能体现出来。零食网站的专业性使得与其它综合行电商网站相比时，更具有简洁性、便利性。没有过多的营销套路、促销手段或者广告，带来极简的购物体验，这是很多综合性网站所不能达到的。
（二）课题内容
零食网站的设计与实现，利用的是笔者在实习期间的知识和平时的项目开发经验等。网站模块包括前台模块和后台模块：在前台模块中用户可以实现在线登录注册，浏览零食列表、查看商品详情以及商品加入购物车等，而查看商品详情是亮点所在。后台功能模块是给网站管理员的功能模块，在零食网站后台功能模块中用户可以实现账号信息管理，修改登录密码，货物商品管理，发货管理，商品信息管理，订单详情管理等功能。
三、网站分析与设计
（一）网站功能需求
注册、登录模块是通过手机号码进行注册登录使用的。登录成功之后显示已有的商品在商品列表。选购的商品可以加入购物车模块中，在购物车模块中可以随意添加、减少、删除商品。选中的商品进行支付，可选择多种支付方式。已经付款的商品会在订单模块出现，用来查看订单状态。
（二）网站功能模块结构图
通过网站功能模块图的整理能够让整个项目的功能模块更加清晰，将网站功能进行说明分析。如图31所示。
图31 功能模块结构图
（三）注册流程图
用户根据个人手机号码和密码进行注册，并在注册成功之后，户籍将数据存放到数据库中，之后通过用户名和密码的登录网站，在网站内部进行调用查看，如图32所示。
图32 注册流程图
（四）下单模块
用户在登录账户之后，寻找自己的合适的商品，进行下单购买，选择好的商品下单后付款之后，数据会通过平台自动跳转到订单页面，如图33所示。
图 33 下单流程图
（五）开发及运行环境
前端开发环境
硬件：window10 32位网站电脑一台（16GB运存，1T内存）
软件：HbuilderX，谷歌浏览器，SDK 1.8、
前端运行命令: npm run dev
后台开发环境
硬件：window10 32位电脑一台（16GB运存，1T内存）
软件：vscode，JDK 1.8
后端接口运行命令: 1.cd servere 2.npm run start
测试环境
window10 32位网站电脑一台（16GB运存，1T内存）：
谷歌浏览器、火狐浏览器
四、网站功能实现
该网站功能主要是通过node.js对接口进行api封装，将通过SQL所建立的数据库中的具体数据与前端通过vue.js所构建的前端页面进行数据交互。分别实现了商品的列表排列、搜索、详情、购物车中商品的增加、减少、删除；付款时地址的更改、新增以及付款成功后的订单查看，确认收货等功能。首页效果图如图41所示。
版权保护: 本文由 hbsrm.com编辑，转载请保留链接: www.hbsrm.com/jsj/wljs/137.html
