精选_基于Vue + Node + MongoDB的响应式药品商城系统的分析与设计_源码打包

# 基于Vue + Node + MongoDB的响应式药品商城系统的分析与设计 # 摘要 随着科学技术的不断发展，中国的传统行业已经受到了互联网浪潮的不断冲击，在将来很大一部分会被互联网所取代。在传统的医药行业，传统的药品销售方式都是实体药店销售，不仅成本高，还会受到时间、空间的限制，加上药店自身经营管理手段的落后，该销售模式在将来可能退出如今的市场经济。想要有所突破，提高销售利润，将实体药店线下销售模式与互联网线上销售模式相结合是一个不错的选择。 本文以构建一套在线药品商城销售系统为最终目标，系统采用B/S 架构，开发过程遵循前后端分离开发原则，前端开发使用的是HTML+CSS+JS 三大前端技术和 VUE 框架，后端开发使用了Node.js的Express框架加MongoDB数据库组合，前后端数据交互采用的是 VUE 官方推荐的 Axios 库，主要实现的功能有：前台药品列表的展示；药品列表多条件查询；购物车中药品增删改；用户登录；后台管理员登录、后台药品信息管理、后台用户信息管理等多个功能。在用户体验方面，页面开发采取响应式布局设计，完美兼容PC端和iPad、手机等移动设备。 通过本次系统开发发现，Vue+ Node 组合开发的药品商城帮助实体药店开拓了一条新的销售渠道，能够高效提高实体药店的日常工作效率，节省了大量的人力、物力成本。 **关键词**：药品商城；Node; 响应式布局 # ABSTRACT With the continuousdevelopment of science and technology, China’s traditional industries have beenconstantly impacted by the wave of the Internet. In the future, a large partwill be replaced by the Internet. In the traditional pharmaceutical industry,traditional drug sales are sold in physical pharmacies, which are not onlycostly, but also subject to time and space constraints, as well as thepharmacy's own management and management methods. The sales model cannot adaptto the current market economy. To make a breakthrough and increase salesprofits, it is a good choice to combine the offline sales model of physicalpharmacies with the online sales model of the Internet.. This paper aims tobuild an online drugstore sales system. The system adopts the B/S architecture.The development process follows the separation development principle of thefront and back ends. The front-end development uses the HTML+CSS+JS front-endtechnology and VUE framework. Development and use of a combination of Node +MongoDB, front and back end data exchange is used by the VXI officialrecommended Axios library, the main functions are: front drug list display;drug list multi-condition query; shopping cart drugs add or delete changes;user login ; Background administrator login, background drug information management,back-end user information management and other functions. In terms of userexperience, the drug display module adopts a responsive layout design and isperfectly compatible with mobile devices such as PCs and iPads and mobilephones. Through thedevelopment of this system, it was discovered that the drug store developed byVue + Node has helped the physical pharmacy open up a new sales channel, whichcan effectively improve the daily work efficiency of the physical pharmacy, andsave a lot of manpower and material costs **Keyword**：Drug Mall, Node, Responsive layout # 1 绪论 ## 1.1 选题背景和意义 当下的中国，各个行业都受到了互联网的抨击与挑战，都已经掀起了向互联网发展的浪潮。在这样的发展趋势下, 优胜劣汰，竞争将日趋激烈。药品行业作为传统行业，关系着中国百姓的基本生活，也在寻求突破与发展。在国家不断推进医疗改革的影响之下,大部分药品企业将网络销售作为他们产品的第一销售渠道，同时结合信息化的管理系统对日常的销售工作进行合理的统计与安排。 在中国市场经济体制确定后，实体药房如雨后春笋，纷纷出现在大众视野,紧随其后的是管理制度的不规范,销售方式不合理。很多中小型药店或者社区门诊药房并没有突破传统，还是手工管理药品信息和单一的实体店销售。在中国现有的条件和大环境下，实体药店要充分与互联网相结合，借助互联网进行日常管理，销售。相比于大的医院、药厂，在实体药店这片市场领域，还存在着较大的空缺与市场，实体药店药品管理销售系统正好可以添补空缺、占领市场,实现日常药品管理的智能化,减少工作人员的成本与劳动量,提高日常的工作效率和药品的销售利润。 ## 1.2 药品销售的现状 在进入21世纪后，国家逐渐重视起老百姓的民生问题，在药品行业，国家始终在不断尝试与创新，为人们提供最基本的医疗保障证，不再让老百姓看不起病，买不起药，为药品市场增添了活力。 古代药铺门前都会挂上一副对联: 但愿世间人无病，何愁架上药生尘，然而在如今的信息社会,各大药商为了提高药品销售利润，打着铺天盖地的宣传广告。往往在广告中药品疗效被夸大其词,肆意炒作，及其误导消费者，更进一步，有些药房的销售人员，为了提高业务销量，更是做起了“购药满88送鸡蛋10个”等促销活动，而有些医生，一个很常见的感冒发烧，能开出几百块钱的药给病人，一味地想赚钱，而未树立正常的医生形象、医德品质，会让顾客慢慢去而远之，最后形成生病就去大医院的局面,小诊所无人问津，严重导致社会资源使用不均匀。 # 2 关键技术的分析与抉择 ## 2.1 技术路线 使用的技术路线是 Vue + Node + MongoDB ，采用前后端分离的方式开发基于MVVM 模式的药品在线销售系统。 MVVM(Model, View, ViewModel)架构是在MVC框架的基础上衍生出来的一种新的架构，Model用于逻辑处理，View负责页面展示，ViewModel用可比二者之间的桥梁、纽带，View与Model的变化，都会通过ViewModel 传递到对方身上，这就是MVVM架构所实现的双向数据绑定，其通信方式如图 2-1 MVVM 通信。  ### 2.1.1 技术可行性分析 所使用的技术都是最几年比较流行，用户使用量大的编程语言，在各大公司的真正开发业务中也广泛使用，在全球最大的代码开源网站Github 上已经有十几万的点赞数，各大语言的交流社区活跃，在实际开发过程中，遇到的技术难题，也会有很多教程和朋友提供帮助。 ### 2.1.2 操作可行性分析 该系统在操作使用上，用户无需进行任何程序的安装，只需要使用手机、平板、电脑等设备上安装的浏览器，即可访问和使用该系统，简单而不单一的页面设计更加方便用户的使用。 ## 2.2 Node技术及其Vue框架介绍 ### 2.2.1 Node.js的介绍 Node.js相比于其他后端语言，算是非常年轻了，诞生于2009年，它是一个能在Service端运行 JavaScript 的平台[3]，同时Node.js 基于全球最大的包管理器 NPM, 使得Node得到广泛的传播和使用。在实际开发Node.js过程中，更有不同集成好的框架可供选择。 ### 2.2.2 Vue.js的介绍 Vue.js 前端框架作为MVVM架构的一个代表，是中国技术牛人尤雨溪在2014年首次发布的个人开源项目，相比于无所不能的 JQuery库和同MVVM架构的React、Angular框架，Vue.js 提供简单的API，上手简单，学习曲线平缓使得发展迅猛，其主要特点体现在响应式编程、组件化、模块化、前端路由、稳定性等方面。 本系统由于前后端逻辑分离，所以页面的跳转需要