《基于SpringBoot+Vue技术的可视化电商平台设计》14000字（论文）

第2章需求分析III基于SpringBoot+Vue技术的可视化电商平台设计摘要近年来大数据时代的来临，我国电商平台发展迅猛，人们的消费观念和消费方式已经发生了翻天覆地的变化。人们的购物方式已经由传统线下实体店购物方式转移到网上购物，网上购物方式不仅让购物变得简单、快捷，而且可以实现人们足不出户就可以购买到所需要的商品，人们的购物不再受时间和空间上限制。然而在电子商务平台发展的过程中，引发了一系列的新问题，其中实时获取有效数据工作问题尤为突出。许多传统的电商平台虽然收集了很多商业数据，但是大多都仅存储在数据库中，即只实现了数据基本的增删改查操作，这不利于有效的提高用户使用体验和挖掘数据存在的潜在信息。本文主要研究内容为两个方面。第一，设计并实现基于web端的传统模式下电子商务平台系统，帮助中小型企业电子商务系统的发展变革。第二，将利用电商平台的电子商务数据，结合现如今不断发展的大数据环境下涌现的新兴数据可视化技术和工具，提出基于电子商务平台实时的数据可视化展示方案，最后设计出一套在传统电子商务平台基础上，结合平台数据的实时可视化的系统，实现数据可视化图表的动态交互，使数据的更加灵活，更加多样的展示。本系统进行开发使用的语言主要是JAVA。前端使用Vue.js+ElementUI集成框架进行开发，后端则使用了SpringBoot+Mybatis两大成熟框架进行开发，采用MySQL关系型数据库，辅以Navicat数据库管理工具，最终构建一个基于B/S架构以及MVVM设计模式的电商平台系统。系统用户界面设计时贯彻一致性与简洁性原则，提高界面组件清晰性。系统对功能模块进行合理划分，充分保证系统的灵活性以及可扩展性。关键词：电子商务；SpringBoot；Vue；Echarts；数据可视化目录TOC\o"1-3"\h\u9682第1章引言 1127291.1研究背景及意义 1285431.2研究现状 2325521.3研究技术分析 3278871.3.1前端技术分析 397981.3.2后端技术分析 3100931.3.3数据库技术分析 4155831.4主要研究内容 442261.5本文结构 5321611.6本章小结 521087第2章需求分析 6172222.1功能需求分析 663632.1.1用户功能需求分析 6322992.1.2管理员功能需求分析 6161922.2非功能需求分析 6326162.2.1性能需求分析 635622.2.2安全性需求分析 774562.2.3可扩充性需求分析 756732.2.4容错性需求分析 7312802.2.5可维护性需求分析 7127732.3本章小结 711227第3章总体设计 8136683.1系统功能的结构设计 8252073.1.1游客功能结构设计 8118763.1.2已登录用户功能结构设计 91593.1.3超级管理员功能结构设计 1065543.2系统架构设计 11190883.3本章小结 11813第4章数据库设计 12310534.1数据库总体关系设计 12286014.2数据库表结构设计 1361414.3本章小结 1631430第5章系统实现 1713155.1项目总体结构 17157635.1.1前端总体结构 17324115.1.2后端总体结构 18270495.2登录注册功能实现 1957645.3用户地址管理功能 2073115.4商品推荐功能 2183245.5商品分类功能 22242155.6我的订单功能 23250845.7我的购物车功能 2432315.8本章小结 2425907第6章系统测试 25115686.1测试目的 2537116.2系统主要功能测试用例 25295546.3本章小结 2719433第7章总结与展望 2917297.1总结 29150897.2展望 2971467.2.1不足 29156967.2.2展望 305469参考文献 31引言研究背景及意义在互联网+的时代背景下，电子商务平台发展速度十分迅猛，人们的消费理念和购物方式发生了翻天覆地的变化REF_Ref14892\r\h[1]。人们的消费方式已经由传统线下实体店现金购物方式转移到网上电子货币购物方式，网上购物方式不仅让购物变得简单、方便、快捷，而且可以实现人们不用花费大量时间外出就可以购买到用户所需要的商品，人们的购物方式不再受时间和空间上限制，很大程度上节约了人们线下购物的时间，提高了人们购物的效率。然而在这个网购已经成为主流消费方式的时代，网购的商品订单信息数据、网购的用户资料信息数据、用户网购偏好商品数据和网购各产品销售量等数据不断激增，这些数据不仅来源复杂，类型多样而且十分庞大杂乱，收集和整理这些数据将要占用大量的人力资源和物力资源。电商平台原有的数据展示方式对于电商业务的支持已经越来越捉襟见肘，且传统的数据处理方式不能更好的体现出数据的潜在价值和规律REF_Ref15003\r\h[2]，然而这些数据又蕴含着巨大的潜在价值，是电子商务平台商家及平台高层制定决策计划的重要依据。因此，这些与用户直接产生关联的数据怎样进行充分利用，并把这些数据转化成商家容易理解且有价值的数据，从而提高平台用户体验，提高平台商家和平台高层决策效率和正确性，获得更多新老用户的青睐是目前电商平台普遍考虑的问题REF_Ref15190\r\h[3]。后来随着大数据时代的来临，电子商务平台为了应对不断激增的多种多样数据REF_Ref15284\r\h[4]，平台采用了离线数据可视化的方式去展示数据库中的存储数据，即在后端管理系统中或前端页面中通过添加适当的图表把数据库中不同类型的数据展示出来，以便平台内部数据分析人员更加直观的分析数据并进行决策。然而，根据调查结果显示，国内一些知名度较高的电商平台每天产生的信息数据量都十分庞大，甚至在一些巨头级电商平台中每天需要展示分析的信息数据量超过一亿条。但是，由于电商平台主要提供的是离线信息数据，这使得平台内部数据分析人员和决策层对平台产品销售等信息的了解相对滞后，无法对平台业务做出准确及时的调整。对此，平台高层和各个技术部门对数据的处理和展示提出了实时性的需求。因此，很多电商平台希望数据可视化向实时数据的方向转变，在大数据时代下，只有利用可视化技术才能把这些多类型的、海量的、非结构化数据完美呈现出来，以便平台数据分析人员和决策层更好更快的为平台决策和运营提供可靠的数据支撑。然而，就整个电商市场而言，绝大多数企业都是中小型企业，甚至一些是个体经营的企业，他们往往受限于技术、人才、资金等各方面因素的影响，让他们自己来实现数据的统计分析以及可视化有一定的困难。因此，设计并实现出一款用户使用体验感良好的、并具备数据可视化及分析的电子商务平台，对于个体运营者或者中小型企业来说有着十分重要的意义，将帮助他们更好的制定决策计划和分析用户产品需求。在这样的背景下，本系统以具有电商平台代表性的公司，世界500强小米商城为例，在实现传统的电商平台基础功能上，展开对电商平台数据实时可视化的设计与实现。研究现状可视化是利用计算机图形学和\t"/item/%E5%8F%AF%E8%A7%86%E5%8C%96/_blank"图像处理技术，将数据转换成图形或图像在屏幕上显示出来，并进行交互处理的理论、方法和技术REF_Ref15392\r\h[5]。它不仅涉及到计算机图形学、图像处理、\t"/item/%E5%8F%AF%E8%A7%86%E5%8C%96/_blank"计算机视觉、\t"/item/%E5%8F%AF%E8%A7%86%E5%8C%96/_blank"计算机辅助设计等多个领域，成为研究\t"/item/%E5%8F%AF%E8%A7%86%E5%8C%96/_blank"数据表示、数据处理、决策分析等一系列问题的综合技术。数据可视化，是关于数据视觉表现形式的\t"/item/%E6%95%B0%E6%8D%AE%E5%8F%AF%E8%A7%86%E5%8C%96/_blank"科学技术研究REF_Ref15591\r\h[6]。它的概念随着技术的发展处于不断更新之中，它所包含领域边界也在不断地扩大。它在技术方面主要是指较为高级的技术方法，而这些技术方法允许利用图形、\t"/item/%E6%95%B0%E6%8D%AE%E5%8F%AF%E8%A7%86%E5%8C%96/_blank"图像处理、\t"/item/%E6%95%B0%E6%8D%AE%E5%8F%AF%E8%A7%86%E5%8C%96/_blank"计算机视觉以及用户界面，通过表达、建模以及对立体、表面、属性以及动画的显示，对数据加以可视化解释。其中国外学者是数据可视化分析研究的主导力量，有证明表示在1990年IEEE就举办了首届IEEEVisualizationConference，这个学术群体是由不同领域的研究人员所组成REF_Ref15686\r\h[7]。这个群体涉及计算、图形学、物理、图像处理等各个领域，在这些有重合的交叉学科领域，他们提出了以前从未有过的全新的概念和研究方向。多年来通过不同领域的研究人员不断探索和不断完善，数据可视化理论逐步完善。相对国内而言，在数据可视化方面的研究早期并不被重视，因此起步较晚，西方国家数据可视化技术和工具的发展也遥遥领先与我国。这项技术被国内首次采用还是因为科研机构对大量的科研数据有了数据可视化的需求，国内首次引入在20世纪90年代。自那以后，数据可视化需求在国内越来越大，对于该领域的研究也受到了国内研究学者的重视。现如今国内数据可视化技术正处于高速发展的阶段。目前，在数据可视化技术方面国内外研究已经有了诸多成果。国外在2011年正式推出了一款面向Web端使用JavaScript编写的D3数据可视化框架REF_Ref15761\r\h[8]。虽然该技术是现在主流的前端数据可视化库，但由于该框架出色的功能和丰富的组件，所以学习成本很高。在国内，百度公司也推出了一款开源且免费的数据可视化工具ECharts。它不仅拥有丰富的图表和强大的前端数据渲染能力，而且可以在多种终端上流畅运行。研究技术分析前端技术分析Vue.js是一个构建数据驱动的web界面的渐进式框架，是MVVM架构的最佳实践。与其它大型框架不同的是，Vue被设计为可以自底向上逐层应用。Vue的核心库只关注视图层方面，并且非常容易学习，非常容易与其它库或已有项目整合。在其他方面，Vue也完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。Vue.js的目标是通过尽可能简单的API实现响应的数据绑定和组合的视图组件REF_Ref19226\r\h[9]。ECharts是一个开源的、基于web的、跨平台的框架，支持交互式可视化的快速构建。动机是由三个目标驱动的：易于使用、丰富的内置交互和高性能。（1）易于使用，对于用户来说，学习这些知识有一些困难如果使用声明性语言，则为可视表示。它是希望能让用户专注于可视化的设计而不是使用一些工具。（2）丰富的内置交互，高效的数据探索和分析需要大量可配置的交互。电子艺品设计并实现附加到每个图表类型，最大限度地减少了用户的定制需求。（3）高性能，通过引入流媒体系统架构和增量渲染模式，提高了系统的性能使用ECharts实现，即使在处理数百万个数据点时也是如此REF_Ref19327\r\h[10]。后端技术分析SpringBoot不仅继承了Spring框架原先的优秀性能，而且还通过简化文件配置来进一步简化Spring应用的在整个项目搭建和开发过程，同时对Spring原有的缺点进行了改善和优化。SpringBoot框架有两个十分重要的策略，其一就是SpringBoot开箱即用，是指在项目开发过程中，软件开发人员可以在MAVEN项目的pom文件中添加与项目相关的依赖包，然后在编写代码时使用对应注解替代繁琐的、大量的XML配置文件来进行对象的软件生命周期管理。另一个重要的策略是约定优于配置的思想，就是目标结构由SpringBoot本身进行配置工作，虽然这一特点降低了设计的部分灵活性，但是同时也减少了软件开发人员对项目大量的XML文件配置，从而大大提高了项目开发的效率，并且在一定程度上缩短了整个项目周期。同时，SpringBoot还提供可以修改默认值来满足项目特定的需求，提供了许多大型软件开发项目中常见的非功能性特性，比如，安全检测、嵌入式Tomcat服务器、指标，外部配置等。数据库技术分析MySQL是一种DBMS，而且是一款小型的、速度快的关系型数据库管理系统。MySQL数据库可以称得上是目前运行速度最快的SQL语言数据库之一。MySQL数据库除了拥有许多其他的数据库所不具备的功能之外，MySQL数据库还是一款完全免费的产品，软件开发人员可以直接通过联网下载MySQL数据库，而不必支付任何商业费用REF_Ref19428\r\h[11]。主要研究内容本系统功能模块主要分为三个，分别为前台用户模块、后台管理员模块和面向大屏的实时数据可视化图表展示模块。在完成传统的电商平台基本功能基础上，即实现电商平台系统数据库设计和功能设计以及商品显示、用户登录注册、商品分类管理、商品订单管理和商品信息管理等功能，之后通过数据可视化技术，设计并实现大屏进行图表展示。本次研究内容主要包含以下部分：设计实现一种基于Vue和ECharts并且支持生成多种类型的、操作相对方便简单的大屏图表展示系统。设计实现基于ECharts可视化框架的一种大屏动态配置功能，该功能主要包括有良好的界面布局、数据的实时更新和完善的图表渲染REF_Ref19507\r\h[12]。设计实现大屏页面快速渲染和提高页面刷新率，给用户一种良好的使用体验。提供一个安全稳定性好、可用性高的大屏数据实时可视化图表展示系统。本文结构本文共分为七章：第一章为本文引言。主要说明了本课题进行研究的研究背景及意义，分析了本课题的国内外研究现状，并进行了研究技术分析，最后介绍了本文的主要研究内容。第二章为系统的需求分析。主要从功能需求和非功能需求进行系统需求分析，并从主要用户角色角度出发进行功能需求分析。第三章为系统的概要设计。主要介绍了系统功能的总体设计以及不同用户身份的系统访问权限，然后对系统架构的设计也进行了简要的分析。第四章为本系统的数据库设计。主要从数据库方面介绍了本系统的数据库表字段之间的实体联系，并且列举了系统数据库中主要的表结构设计。第五章为本系统的功能实现。主要从项目总体结构、登录注册功能、用户地址管理功能、商品推荐功能、商品分类功能、我的订单功能、购物车功能等方面进行系统的详细设计与实现。第六章为系统测试。主要介绍了系统测试的目的与过程，分析了此次测试的结果，并列举了一些主要的测试用例。第七章为对本系统的总结与展望。主要对本次系统开发工作进行项目总结，分析了此次项目开发中存在的一些不足，并对以后系统完善方向提出一些建议。本章小结本章主要介绍了当前国内的电商平台发展背景，并从系统的实用性与有效性角度出发，阐述了本文系统的研究意义，然后对国内外的数据可视化的技术以及工具实现方面现状进行了调研分析，之后对本系统的技术可行性进行了研究分析，然后根据国内外的数据可视化研究现状以及本系统的实际需求情况出发，描述了本系统的主要研究内容，最后从总体上介绍了本文论文的主要行文结构。需求分析功能需求分析本系统的主要用户分为两大类，第一大类为浏览商城物品准备或进行购物的用户，即商城前台客户。第二大类为发布商品信息进行商品销售的用户，即系统后台管理员。用户功能需求分析本系统做为一个网上购物平台，web端用户分为两类，其中一类是游客身份，即未登录系统的用户，主要功能需求是浏览商城物品、注册，但是在未登录时无法完成将心仪商品加入购物车进行购买等需要先获取用户ID才能进行的操作；另一类是已登录用户，主要功能需求有登录、找回密码、浏览商城、商品查询、个人中心、个人信息修改、商品分类显示、查看指定商品详情、加入购物车、用户购物车管理、订单查询、商品评价、退出等。图STYLEREF1\s2-SEQ图\*ARABIC\s11用户用例图以下展示部分用户用例规约：表STYLEREF1\s2-SEQ表\*ARABIC\s11注册账号用例规约用例编号10001用例名称注册账号角色参与者未登录用户前置条件用户进入系统首页界面，点击注册按钮后置条件（请求结果）反馈注册状态信息给用户基本事件流（主事件流）参与者行为系统响应1用户进入系统，点击注册按钮2系统接受请求后，跳转到注册页面3等待系统跳转到注册界面，按照要求输入基本信息完成注册4反馈注册成功或失败信息给用户扩展事件流（扩展用例）例外处理表STYLEREF1\s2-SEQ表\*ARABIC\s12编辑个人信息用例规约用例编号10002用例名称编辑个人信息角色参与者已登录用户前置条件用户进入系统首页界面，点击个人头像后置条件（请求结果）反馈编辑状态信息给用户基本事件流（主事件流）参与者行为系统响应1已登录的用户进入系统后，点击个人头像2系统接受请求后，跳转到个人信息页面3等待系统跳转到注册界面，按照自己要求修改个人基本信息4反馈编辑信息结果给用户扩展事件流（扩展用例）例外处理表STYLEREF1\s2-SEQ表\*ARABIC\s13查看订单信息用例规约用例编号10003用例名称查看订单信息角色参与者已登录用户前置条件用户进入系统首页界面，点击我的订单后置条件（请求结果）反馈历史订单信息给用户基本事件流（主事件流）参与者行为系统响应1已登录的用户进入系统后，点击我的订单按钮2系统接受请求后，跳转到订单显示页面3等待系统跳转到订单界面，用户可以查看历史全部订单和订单状态4在页面进行订单详细信息展示扩展事件流（扩展用例）例外处理表STYLEREF1\s2-SEQ表\*ARABIC\s14移除购物车商品用例规约用例编号10004用例名称移除购物车里的商品角色参与者已登录用户前置条件用户进入系统首页界面，点击我的购物车后置条件（请求结果）反馈移除结果信息给用户基本事件流（主事件流）参与者行为系统响应1已登录的用户进入系统后，点击我的购物车按钮2系统接受请求后，跳转到购物车显示页面3用户可以查看购物车里的全部商品，并移除其中一件商品4反馈移除结果给用户扩展事件流（扩展用例）例外处理管理员功能需求分析本系统管理员端只有超级管理员这一个用户角色，主要功能需求是登录账号、用户信息管理、商品管理、推荐商品管理、商品分类管理、错误处理、修改密码、退出登录等。超级管理员的主要作用是帮助商城上下架商品，对用户信息进行查看和管理等，一切行为操作都是为了商城更好的运行，为用户提供优质的服务。图STYLEREF1\s2-SEQ图\*ARABIC\s12管理员用例图以下展示部分管理员用户用例规约：表STYLEREF1\s2-SEQ表\*ARABIC\s15账号登录用例规约用例编号10005用例名称账号登录角色参与者未登录的管理员前置条件用户进入管理员系统首页界面并已拥有账号后置条件（请求结果）反馈登录状态信息给管理员基本事件流（主事件流）参与者行为系统响应1进入后台管理员系统登录页面2系统接受请求到登录页面3按照要求输入账号、密码基本信息进行登录4反馈登录成功或失败信息给管理员扩展事件流（扩展用例）例外处理表STYLEREF1\s2-SEQ表\*ARABIC\s16添加商品用例规约用例编号10006用例名称添加商品角色参与者已登录系统的管理员前置条件用户进入管理员系统，点击商品管理按钮后置条件（请求结果）反馈添加结果信息给管理员基本事件流（主事件流）参与者行为系统响应1管理员进入后台管理员系统2系统接受请求跳转到商品管理界面3点击添加商品，输入商品基本信息并上传商品图片进行商品上架4反馈添加商品结果给管理员扩展事件流（扩展用例）例外处理非功能需求分析性能需求分析系统开发人员应该从用户的身份去考虑问题，根据用户的使用习惯进行界面的开发，而不应该只考虑软件实现的难易程度。要使用户在使用本系统时感到一致、简洁、快速、方便等特点，充分保证用户使用体验。安全性需求分析系统设计时应该注重安全性防护，做到对用户敏感信息的加密，同时用户需求完成身份认证才可查看个人信息等重要数据。例如：管理员后台需要管理员用户登录后才能进行访问相关信息，并对普通用户密码信息进行加密处理防止用户信息泄露。可扩充性需求分析可扩展性在系统设计时应被充分考虑，尽量提高系统的内聚性，降低系统的耦合性，便于系统加入新的业务需求，使系统能够迭代开发。容错性需求分析系统主要功能是网上购物平台，应该具备一定的容错性，当系统发生错误时，应该给予用户反馈并帮助用户处理当前状况，返回上一级操作。可维护性需求分析系统设计时应当注重各类文档的编写，文档要帮助维护人员了解设计思路和系统结构，便于理解系统编码从而进行维护工作。程序开发时要保持良好的编写规范、注释清晰明确等，便于测试人员调试系统。本章小结本章详细阐述了电子商务系统中的主要两大用户以及三种角色，同时说明用户和管理员的主要功能需求，随后说明了系统非功能性需求。明确了系统面向的主要用户以及主要功能，并且明确了系统设计时应当注重的非功能需求，为构建完整的电子商务系统奠定基础。第3章总体设计总体设计系统功能的结构设计依据电子商务系统的需求分析结合我国电子商务平台遇到的主要问题，从软件开发角度出发，本系统将电子商务系统用户分为以下三个角色：游客身份，已登录用户，超级管理员。游客功能结构设计游客身份就是没有登录系统的用户，如图3-1所示，系统允许游客进行以下访问操作权限。首页：系统首页对所有人开发，以游客身份进入系统后可以浏览系统首页商品页面。因游客未登录，首页页面会从数据库中选择一部分商品进行推荐。登录注册功能：游客进入系统后，如果游客没有账号，可以选择注册功能填写自己的个人基本信息进行账号注册；如游客已有系统账号，游客可以选择登录功能进行账号登录。商品分类功能：商城系统允许游客进行商品分类查看，且商品实现一级分类和二级分类功能。商品详情显示功能：系统的商品详情页面对游客开发，游客可以浏览商品详情查看商品属性和规格等信息。大屏展示功能：系统允许以游客身份观看商品销售量等信息，并以图表等形式进行展示。商品检索功能：游客可以通过系统搜索框，搜索自己喜欢的商品，主要搜索模式有关键字搜索和模糊搜索两类。图STYLEREF1\s3-SEQ图\*ARABIC\s11游客用户功能结构图已登录用户功能结构设计游客进行账号登录后就会成为已登录用户，登录用户不仅拥有游客所有的操作权限，同时还具备以下访问操作权限，如图3-2所示。个人中心：登录用户可以点击自己的头像查看个人中心界面，还可以进行个人基本信息的修改等操作，完善自我信息有利于保护账号资金安全。我的购物车：已登录用户可以选择商城心仪的商品加入到我的购物车，并且点击购物车图标可以查看已加入到购物车所有的商品。我的订单：加入到购物车的商品可以进行结算功能，点击我的订单可以查看所有订单状态。联系我们：用户可以反馈问题和其他可以帮助到用户操作的网站链接。图STYLEREF1\s3-SEQ图\*ARABIC\s12已登录用户功能结构图超级管理员功能结构设计系统需实现超级管理员用户进行系统的基本管理，超级管理员账号由系统创建，无法注册管理员账号。管理员用户的功能结构如图3-3所示。超级管理员登录功能：超级管理员可以用管理员的账号和密码登录到商城后端管理界面。商品分类管理功能：超级管理员可以对商城里的商品进行分类以及增删改查操作。商品信息管理功能：超级管理员可以对商城里的商品信息进行增删改查操作。商品订单管理功能：超级管理员可以对订单信息进行查看，可执行增删改查相关操作。用户反馈消息管理功能：超级管理员可以对用户反馈的问题进行查看。错误处理：超级管理员可以对界面错误进行处理。修改密码功能：超级管理员可以进行管理员登录密码修改操作。退出：退出超级管理员登录。图STYLEREF1\s3-SEQ图\*ARABIC\s13管理员用户功能结构图系统架构设计本系统的架构如图3-5所示。前端由Vue、ElementUI、Echarts框架实现界面展示，Vue.js对请求数据进行请求处理，然后通过axios技术调用后端提供的API接口。后端API接口的Controller层方法会调用service层的方法，service层的方法定义为接口，具体由serviceImp层具体实现接口功能。之后serviceImp方法将调用mapper层提供的方法，由mapper层的方法来进行关系型数据库的访问及增删改查等操作。最终返回数据给Controller层，Controller层返回JSON类型的数据给前端。前端的Vue.js处理完后端返回的数据后进行界面渲染，这就完成了一次完整的请求过程REF_Ref19631\r\h[13]。本章小结这一章节章主要阐述了不同用户类型的系统功能，分别展示了游客身份、已登录用户、超级管理员三种用户的功能结构设计图，然后对系统的总体架构进行了一番阐述，为系统制定了总体框架并且明确了系统的各个功能。第4章数据库设计数据库设计数据库总体关系设计本系统共涉及10张数据库表，如图4-1所示。图STYLEREF1\s4-SEQ图\*ARABIC\s11系统数据库表展示图其中用户信息表是userinfo表，admin表为超级管理员信息表，address表为用户收货地址信息表，goods表为商品信息表，orde表为用户订单信息表，cart表为用户购物车信息表，category表为商品分类信息表。其中address表通过userid字段与userinfo表的userid字段相关联，用户获取用户id信息。其中cart表通过user_id字段和good_id字段分别与userinfo表的userid字段和goods表的good_id字段相关联，用户获取用户id信息和商品id信息。其中goodsuggebig表通过category_id字段与category表的categoryid字段相关联，用户获取商品分类类别信息。其中orde表通过orderNO字段与ordergood表中的orderNo字段相关联，用户获取订单编号信息。数据库表结构设计以下展示本系统数据库中主要的表结构设计。表STYLEREF1\s4-SEQ表\*ARABIC\s11用户信息表所属表名字段名字段类型字段说明userinfoUseridvarchar用户唯一id，主键userinfoNamevarchar用户账号名称userinfoEmailvarchar用户邮箱userinfoPasswordvarchar用户密码userinfoTelvarchar用户电话userinfoStatusvarchar用户是否可用userinfoDatevarchar用户注册日期userinfoPrivatekeyvarchar私钥用户基本信息表结构如表4-1所示，记录了用户的id、账号名称、联系电话、邮箱等基本信息，其中用户密码进行了RSA加密处理，并且生成了用户私钥，还记录了用户的注册日期，用户注册日期用于计算用户的注册时长，用户status字段表示用户状态，可用为正常，不可用为封停状态。表STYLEREF1\s4-SEQ表\*ARABIC\s12管理员信息表所属表名字段名字段类型字段说明adminUsernamevarchar管理员用户名adminPasswordvarchar管理员密码（加密）adminIdvarchar管理员唯一id，主键用户管理员信息表结构如表4-2所示，记录了管理员的id，管理员用户名称和管理员登录密码信息，其中管理员登录密码进行了RSA加密处理显示。表STYLEREF1\s4-SEQ表\*ARABIC\s13地址信息表所属表名字段名字段类型字段说明addressIdintid，主键addressUseridvarchar用户id（外键）addressReceivernamevarchar收货人姓名addressReceivermobilevarchar收货人联系方式addressReceiverprovicevarchar收货人省份addressReceivercityvarchar收货人市区addressReceiveraddressvarchar收货人具体地址addressReceicerzipvarchar收货人邮编，非空用户地址信息表结构如表4-3所示，记录了id，用户id，用户名称，用户联系方式，用户收货省份，用户收货市区，用户具体地址和用户邮编基本信息，其中用户邮编信息不可为空，因为商城商品发货需要获取收货人邮编信息。表STYLEREF1\s4-SEQ表\*ARABIC\s14订单信息表所属表名字段名字段类型字段说明ordeOrdernoint订单号，主键ordeHostidvarchar用户idordeProductidint商品idordeProductnamevarchar商品名称ordeProductimagevarchar购物车商品urlordePaymenttimevarchar商品支付时间ordePaymentTypeint商品支付类型ordePaymentTypeDescvarchar商品支付类型说明ordeQuantityint订单商品数量ordeTotalpriceint订单商品总价格ordeCreatetimevarchar订单创建时间ordeEndtimevarchar订单结束时间ordeReceivernamevarchar收货人姓名ordeReceivermobilevarchar收货人联系方式ordeReceiverprovicevarchar收货人省份ordeReceivercityvarchar收货人市区ordeReceiveraddressvarchar收货人具体地址ordeReceicerzipvarchar收货人邮编，非空用户订单信息表结构如表4-4所示，记录了订单编号，用户id，商品id，商品名称，购物车商品url等基本信息，其中商品数量记录了订单中总商品数量，并且订单表中的Totalprice字段记录了计算后订单商品总价格，最后生成订单创建时间记录在订单表中的Createtime字段中存放。此外订单信息表还记录了收货人基本信息，比如，查看收货人姓名，收货人联系方式，收货人省份，收货人市区，收货人具体地址，收货人邮编信息详情。还记录了商品支付时间，商品支付类型和商品支付类型说明等信息，便于区分商品支付具体信息。表STYLEREF1\s4-SEQ表\*ARABIC\s15商品信息表所属表名字段名字段类型字段说明goodsidintid，主键goodsGood_idint商品id（外键）goodsNamevarchar商品名称goodsSubtitlevarchar二级标题goodsPriceint商品实际价格goodsOldpriceint商品原来价格goodsCategory_idint所属分类目录idgoodsImagehostvarchar图片来源网址goodsDescribevarchar商品描述goodsSellcountint商品销售量goodsPushtimevarchar商品推出时间goodsProductstockint商品库存goodsStatusvarchar是否销售商品信息表结构如表4-5所示，记录了id，商品id，商品名称，商品二级标题，商品实际价格，商品原来价格，商品所属分类目录id，商品来源网址，商品信息介绍等商品基本信息。此外还记录了商品的销售量，商品库存信息，最后将生成的商品推出时间记录在商品信息表中的pushtime字段中存放。商品信息表中的status字段表示商品是否销售信息，1表示商品正常销售，0表示商品暂时不进行销售。表STYLEREF1\s4-SEQ表\*ARABIC\s16购物车信息表所属表名字段名字段类型字段说明cartIdintid，主键cartUser_idvarchar用户id（外键）cartGood_idint商品id（外键）cartGood_namevarchar商品名称cartPriceint商品价格cartCountint数量cartPic_urlvarchar商品图片urlcartAdd_timevarchar加入购物车时间cartUpdate_timevarchar更新购物车时间cartSubtitlevarchar商品子标题cartProductselectedvarchar购物车中商品是否被选中cartProductstockint商品库存cartStatusint商品状态cartProducttotalpriceint商品总价格用户购物车信息表结构如表4-6所示，记录了id，用户id（外键），商品id（外键），商品名称，商品价格，商品图片url，商品子标题，商品库存等基本信息。此外还记录了商品加入购物车的时间以及更新购物车的时间，以及记录了用户选中购物车中商品的数量，最后记录购物车商品的总价格。其中购物车信息表中status字段用户判断该商品是否正常销售，1表示商品正常销售，0表示商品暂时不进行销售。本章小结本章主要介绍了系统数据库中各个数据表的联系以及列举了主要的6个数据表结构设计图，并且阐述了各个实体表之间的关系，明确的说明了系统数据库表所涉及的各个实体及其联系，使得系统数据库表逻辑结构更为清晰明确。第5章系统实现系统实现项目总体结构前端总体结构图STYLEREF1\s5-SEQ图\*ARABIC\s11前端总体结构图项目前端的总体结构如图5-1所示，其中assets负责存储项目的logo及所用到的一些小图标，主要放置一些静态资源文件，存放在cdn上，因此不用请求图片资源。components为项目的界面组件包，放置页面组件文件，同时命名方式采用驼峰式命名规则，负责存放抽离出前端的各个界面相同的组件信息。router为前端项目的路由结构及配置，负责界面的跳转及界面所需权限的设定。storage为项目放置缓存cookie、sessionStorage、localStorage等存取及删除等基本操作方法，便于操作缓存数据（虽然缓存提供了一些API接口，但自己封装的数据结构能根据具体项目而决定）。store为vuex状态管理，主要负责一些用户以及系统的数据状态存储工作。util包主要存放自己封装的一些工具类函数，比如，本系统中有时间转换工具类函数。views包里放置系统界面，其余为项目的配置文件和配置类。后端总体结构图STYLEREF1\s5-SEQ图\*ARABIC\s12项目后端结构图项目后端的结构如图5-2所示，其中Controller包负责接收前端的请求，并调用逻辑层代码，并且返回最终结果给前端。Entity包为数据库对应实体，用于接受数据库查询的数据，Mapper包为dao层，被对应的ServiceImp调用，主要用于对数据库的一系列操作。Service包负责功能主要逻辑，为接口包，具体实现类为对应的ServiceImp，utils为工具包，包含一些返回前端数据的统一实体类，时间转换工具类，获取token的工具类，密码加密工具类等。Vo包是对数据进行一定封装，然后发送给前端进行显示。登录注册功能实现图STYLEREF1\s5-SEQ图\*ARABIC\s13登录注册类图用户在使用系统中如果遇到需要登录权限才能访问的功能时，系统会提醒游客用户进行系统登录或直接跳转到登录界面。用户通过输入已注册的合法的用户信息登录成功后，方可跳转到系统首页。用户在登录系统时，需要对用户密码进行加密处理，在输入账号和密码后点击登录系统会给予相关操作的信息反馈。未进行注册的用户可以进入系统点击注册按钮进行用户注册，用户在注册时需要填写账号、密码、手机号、邮箱信息。用户地址管理功能图STYLEREF1\s5-SEQ图\*ARABIC\s14地址管理功能类图已登录的用户在我的购物车进行商品结算时可以进行收货地址管理，比如，编辑修改之前的用户收货地址、收货联系人、联系电话、邮编等信息，还可以删除之前收货地址信息，添加新的收货地址，但是在商品进行结算时务必保证有一个完整收货地址可供选择，以便商城进行商品的发货。商品推荐功能图STYLEREF1\s5-SEQ图\*ARABIC\s15商品推荐功能类图用户进入到商城系统时，商城会将一系列销售量较高的商品进行推荐，并放在系统首页进行展示，以便用户进入系统时优先浏览到这些较高销售量的商品，从而提高这些商品的浏览量，进而提高这些销售量较好的商品销量，提高商城的利润。商品分类功能图STYLEREF1\s5-SEQ图\*ARABIC\s16商品分类功能类图用户在进入系统后，方可查看商品分类显示，且本商城商品分类显示有两类，为一级分类显示和二级分类显示两种，比如，用户进入系统后可看到手机系列为一级分类，将鼠标停留在手机一级分类上，有小米11，Readmek30s纪念版等等二级分类，且后面没有将商品进行再次分类。我的订单功能图STYLEREF1\s5-SEQ图\*ARABIC\s17我的订单功能类图已登录的用户可以点击我的订单进行订单查看，在我的订单中可以查看订单详细信息、订单收货地址、收货人等信息，并且可以查看订单支付状态和历史全部订单信息。还可以进行订单取消操作和点击某一订单进行收货确认。我的购物车功能图STYLEREF1\s5-SEQ图\*ARABIC\s18购物车功能类图用户们在浏览商城系统的物品时，已登录的用户可以将自己喜欢的商品添加到我的购物车中，并且用户可以点击我的购物车可以对已加入商品进行操作，比如，修改购物车中某商品的数量、删除购物车中自己不满意的商品、购中购物车中指定的一部分商品可以查看选中商品的总价等。本章小结本章主要介绍了项目的前端后的总体项目结构，然后对系统的主要功能方面进行了较深入的分析，同时结合UML的类图对各个主要功能进行了展示，对本课题最终实现的系统了解更为清晰。致谢系统测试测试目的为了保证系统功能的准确性和有效性以及提高用户在使用本系统时的体验REF_Ref19729\r\h[14]，作者在完成系统的开发后制定了一系列测试计划，从用户角度出发对系统各个功能进行了黑盒测试，并且制定了一系列测试用例，对系统各功能进行功能性测试，保证系统功能的稳定性和准确性，切实保证用户使用过程中有着良好的使用体验。系统主要功能测试用例表STYLEREF1\s6-SEQ表\*ARABIC\s11测试用例10001测试项目仿小米商城功能模块登录功能用例编号10001编写者徐周用例标题登录功能重要级别高预置条件当前用户已注册账号操作步骤点击登录按钮，进入登录界面输入已注册用户账号输入正确用户密码点击登录期望结果完成用户登录，获取用户信息。测试结果pass表STYLEREF1\s6-SEQ表\*ARABIC\s12测试用例10002测试项目仿小米商城功能模块注册功能用例编号10002编写者徐周用例标题注册功能重要级别高预置条件当前用户未注册账号操作步骤点击注册按钮，进入注册界面输入用户账号，密码等基本信息点击注册期望结果反馈注册成功信息测试结果pass表STYLEREF1\s6-SEQ表\*ARABIC\s13测试用例10003测试项目仿小米商城功能模块商品分类功能用例编号10003编写者徐周用例标题查看商品分类信息访问权限重要级别高预置条件以游客身份进入系统操作步骤进入商城首页界面查看商品分类信息期望结果商品实现分类处理测试结果pass表STYLEREF1\s6-SEQ表\*ARABIC\s14测试用例10004测试项目仿小米商城功能模块商品详情功能用例编号10004编写者徐周用例标题商品详情界面访问权限重要级别高预置条件当前用户以游客身份进入系统操作步骤游客点击系统商城里的商品，进入商品详情界面查看商品介绍结果期望结果游客可以查看商品详情界面测试结果pass表STYLEREF1\s6-SEQ表\*ARABIC\s15测试用例10005测试项目仿小米商城功能模块大屏显示模块用例编号10005编写者徐周用例标题大屏显示重要级别高预置条件当前用户可以以游客身份进入系统操作步骤点击大屏显示按钮，跳转到大屏界面查看大屏展示的图表期望结果游客可以查看商城大屏显示图表测试结果pass表STYLEREF1\s6-SEQ表\*ARABIC\s16测试用例10006测试项目仿小米商城功能模块我的订单功能用例编号10006编写者徐周用例标题我的订单功能重要级别高预置条件当前用户已登录商城系统操作步骤用户点击我的订单按钮，进入订单显示界面用户可以查看订单界面信息期望结果已登录用户可以查看历史全部订单测试结果pass表STYLEREF1\s6-SEQ表\*ARABIC\s17测试用例1007测试项目仿小米商城功能模块购物车功能用例编号10007编写者徐周用例标题购物车功能重要级别高预置条件当前用户已登录商城系统操作步骤1.用户点击喜欢商品加入购物车中2.用户购物车能够查看商品期望结果已登录用户可以查看加入购物车中的全部商品测试结果pass本章小结本章主要阐述了系统测试的目的，然后例举了系统商城几个最重要的黑盒测试用例，其中的用例10005大屏显示界面模块存在一些瑕疵，通过图表的形式将数据进行展示，虽然方便了用户和管理员的对数据理解，但是数据库一些不便用户查看的重要数据可能有泄露。此瑕疵将后续通过系统不断迭代进行优化，在大屏显示界面展示数据之前先进行数据判断，若此数据不便用户浏览将直接拦截，不进行展示。从测试结果而言，本系统稳定性较高、功能准确性也是较高的。总结与展望总结电子商务平台系统的迅猛发展产生了海量的商业数据，及时准确的数据分析和产品决策决定着电商企业的核心竞争力REF_Ref19837\r\h[15]。而想要高效的进行电商数据分析，数据可视化技术及工具的应用就显得尤为重要。电商数据可视化是获取信息的最佳方式之一，通过视觉化方式能够快速抓住信息要点。当人们迷失在众多电商信息数据中时，电商数据通过视觉化的方式展现出数据，能够十分简单的统计出数据呈现的结果和看到数据显而易见的趋势，帮助人们得出正确的结论。回顾本论文研究的所有内容，作者主要完成了以下工