基于vue的联通积分商城数据可视化APP设计与实现 .docxVIP

目录

TOC\o1-3\h\u

摘要 I

Abstract II

引言 1

1前端技术介绍 3

1.1前端开发语言 3

1.1.1HTML5 3

1.1.2CSS3 3

1.1.3JavaScript 3

1.2MVVM开发模式 4

1.3Vue框架 4

1.4Axios技术 5

1.5ECharts 5

1.6数据库技术 5

1.7本章小结 6

2前端开发的分析 7

2.1功能性需求分析 7

2.2非功能性需求分析 8

2.2.1兼容性需求 8

2.2.2性能需求 8

2.3本章小结 8

3前端开发的设计 9

3.1前端架构设计 9

3.2系统功能设计 9

3.2.1登录页面设计 9

3.2.2首页页面设计 9

3.2.3流量分析页面设计 10

3.2.4转化分析页面设计 11

3.2.5用户分析页面设计 11

3.2.6商品分析页面设计 12

3.2.7底部导航栏设计 13

3.3数据库设计 14

3.4本章小结 16

4前端开发的具体实现 17

4.1系统开发环境 17

4.1.1开发环境 17

4.1.2项目框架搭建 17

4.1.3开发系统前端项目结构 17

4.2通用组件的开发 18

4.3开发系统页面功能实现 19

4.3.1登录页 19

4.3.2首页 20

4.3.3流量分析页 22

4.3.4转化分析页 23

4.3.5用户分析页 24

4.3.6商品分析页 25

4.4开发系统的创新点 26

4.5本章小结 26

5前端开发的系统测试 27

5.1功能性测试 27

5.2兼容性测试 27

5.3本章小结 28

总结 29

致谢 30

参考文献 32

沈阳城市学院毕业设计（论文）

PAGEII

摘要

当今互联网技术突飞猛进，全球经济模式也随之变化，由传统的一手交钱，一手交货，变成现在的线上交易，加大了各种商品的成交率。而企业想要得到长久稳定的发展，则必须要对交易中产生的商业数据进行分析处理，充分利用分析结果，实现企业进一步壮大，由此可见，对企业来说企业信息化显得极为重要。在以节省成本的制约下，对企业来说，信息化的实现就显得尤为重要，而且将会是一项繁杂的工作。因此，开发一款具有数据分析能力的系统，将有效的推进企业信息化，这也将成为本课题研究的主要内容。

本课题意在研究并开发一款数据信息可视化的移动端软件，主要研究项目实现的前端框架技术。在开发项目的过程中，使用到了MVVM开发模式实现前后端分离开发，并且在Vue框架、Axios技术、ECharts组件等工具的支持下，完成该项目前端开发。实现一款多种形式的数据展示页面，来对联通积分消费用户的地理位置及消费方向进行分析。

关键词：Vue框架；数据可视化；Web前端；ECharts

Abstract

WiththedevelopmentofInternetcurrently,globaleconomyformhaschangedfromtraditionalpaymenttomodernonlinetransition,whichdeepentheturnoverratioofallkindsofgoods.Andenterpriseswanttogetlong-termachievement,theymustanalyzethebusinessinformationduringthetransition.Hence,it’snecessarytomakefulluseofenterpriseinformationforthem.Constraintstosavingcost,thepopularityofinformationmakesenormousdifferenceforenterprises.Hence,thedevelopmentofadataanalysissystemwilleffectivelypromoteenterpriseinformation,whichwillalsobecomethemaincon