CN105511891A - 一种自助取数平台的前端框架建立方法及装置 - Google Patents

Abstract

本发明实施例公开了一种自助取数平台的前端框架建立方法及装置，解决了目前的电子商务在贸易过程中，在电子商务平台端的excel文件生成下载均依赖与后端程序，而造成的后端服务器计算压力的技术问题。本发明实施例自助取数平台的前端框架建立方法包括：引入avalon库；对avalon库进行timerangeui组件、timeweekui组件、excelui组件、tooltipui组件按照对应的预置加载位置加载处理；将加载处理后的timerangeui组件、timeweekui组件、excelui组件、tooltipui组件在前端平台进行展示。

Description

一种自助取数平台的前端框架建立方法及装置

技术领域

本发明涉及大数据技术领域，尤其涉及一种自助取数平台的前端框架建立方法及装置。

背景技术

大数据就是互联网发展到现今阶段的一种表象或特征而已，没有必要神话它或对它保持敬畏之心，在以云计算为代表的技术创新大幕的衬托下，这些原本很难收集和使用的数据开始容易被利用起来了，通过各行各业的不断创新，大数据会逐步为人类创造更多的价值。

电子商务是以信息网络技术为手段，以商品交换为中心的商务活动；也可理解为在互联网(Internet)、企业内部网(Intranet)和增值网(VAN，ValueAddedNetwork)上以电子交易方式进行交易活动和相关服务的活动，是传统商业活动各环节的电子化、网络化、信息化。电子商务通常是指在全球各地广泛的商业贸易活动中，在因特网开放的网络环境下，基于浏览器/服务器应用方式，买卖双方不谋面地进行各种商贸活动，实现消费者的网上购物、商户之间的网上交易和在线电子支付以及各种商务活动、交易活动、金融活动和相关的综合服务活动的一种新型的商业运营模式。各国政府、学者、企业界人士根据自己所处的地位和对电子商务参与的角度和程度的不同，给出了许多不同的定义。电子商务分为：ABC、B2B、B2C、C2C、B2M、M2C、B2A(即B2G)、C2A(即C2G)、O2O等。同时网络营销也是电子商务的一种产物，而且对于网络营销来说，在做之前要先做好网络营销方案，那样才有便于计划的实施。

目前的电子商务在贸易过程中，在电子商务平台端的excel文件生成下载均依赖与后端程序，从而造成了后端服务器计算压力的技术问题。

发明内容

本发明实施例提供的一种自助取数平台的前端框架建立方法及装置，解决了目前的电子商务在贸易过程中，在电子商务平台端的excel文件生成下载均依赖与后端程序，而造成的后端服务器计算压力的技术问题。

本发明实施例提供的一种自助取数平台的前端框架建立方法，包括：

引入avalon库；

对所述avalon库进行timerangeui组件、timeweekui组件、excelui组件、tooltipui组件按照对应的预置加载位置加载处理；

将加载处理后的所述timerangeui组件、所述timeweekui组件、所述excelui组件、所述tooltipui组件在前端平台进行展示。

优选地，对所述avalon库进行timerangeui组件、timeweekui组件或dateui组件、excelui组件、tooltipui组件按照对应的预置加载位置加载处理之前还包括：

对所述timerangeui组件、所述timeweekui组件或dateui组件、所述excelui组件、所述tooltipui组件进行配置处理。

优选地，对所述timerangeui组件、所述timeweekui组件或dateui组件、所述excelui组件、所述tooltipui组件进行配置处理具体包括：

对所述timerangeui组件的开始参数、结束参数、每次时间范围变化时执行的回调函数及时间跨度参数配置；

对所述excelui组件的对应的若干个原始table元素的id配置；

对所述timeweekui组件或dateui组件、所述tooltipui组件进行配置。

优选地，所述的自助取数平台的前端框架建立方法还包括：

对所述avalon库进行multiselectui组件、collapseui组件、helpui组件、hang组件、轮播滑块组件按照对应的预置加载位置加载处理。

优选地，对所述avalon库进行multiselectui组件、collapseui组件、helpui组件、hang组件、轮播滑块组件按照对应的预置加载位置加载处理之前还包括：

对所述multiselectui组件、所述collapseui组件、所述helpui组件、所述hang组件、所述轮播滑块组件进行配置处理。

本发明实施例提供的一种自助取数平台的前端框架建立装置，包括：

引入单元，用于引入avalon库；

第一加载单元，用于对所述avalon库进行timerangeui组件、timeweekui组件、excelui组件、tooltipui组件按照对应的预置加载位置加载处理；

展示单元，用于将加载处理后的所述timerangeui组件、所述timeweekui组件、所述excelui组件、所述tooltipui组件在前端平台进行展示。

优选地，自助取数平台的前端框架建立装置还包括：

第一配置单元，用于对所述timerangeui组件、所述timeweekui组件或dateui组件、所述excelui组件、所述tooltipui组件进行配置处理。

优选地，第一配置单元具体包括：

第一配置子单元，用于对所述timerangeui组件的开始参数、结束参数、每次时间范围变化时执行的回调函数及时间跨度参数配置；

第二配置子单元，用于对所述excelui组件的对应的若干个原始table元素的id配置；

第三配置子单元，用于对所述timeweekui组件或dateui组件、所述tooltipui组件进行配置。

优选地，自助取数平台的前端框架建立装置还包括：

第二加载单元，用于对所述avalon库进行multiselectui组件、collapseui组件、helpui组件、hang组件、轮播滑块组件按照对应的预置加载位置加载处理。

优选地，自助取数平台的前端框架建立装置还包括：

第二配置单元，用于对所述multiselectui组件、所述collapseui组件、所述helpui组件、所述hang组件、所述轮播滑块组件进行配置处理。

从以上技术方案可以看出，本发明实施例具有以下优点：

本发明实施例提供的一种自助取数平台的前端框架建立方法及装置，其中，自助取数平台的前端框架建立方法包括：引入avalon库；对avalon库进行timerangeui组件、timeweekui组件、excelui组件、tooltipui组件按照对应的预置加载位置加载处理；将加载处理后的timerangeui组件、timeweekui组件、excelui组件、tooltipui组件在前端平台进行展示。本实施例中，通过引入avalon库；对avalon库进行timerangeui组件、timeweekui组件、excelui组件、tooltipui组件按照对应的预置加载位置加载处理；将加载处理后的timerangeui组件、timeweekui组件、excelui组件、tooltipui组件在前端平台进行展示，解决了目前的电子商务在贸易过程中，在电子商务平台端的excel文件生成下载均依赖与后端程序，而造成的后端服务器计算压力的技术问题。

附图说明

为了更清楚地说明本发明实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动性的前提下，还可以根据这些附图获得其它的附图。

图1为本发明实施例提供的一种自助取数平台的前端框架建立方法的一个实施例的流程示意图；

图2为本发明实施例提供的一种自助取数平台的前端框架建立方法的另一个实施例的流程示意图；

图3为本发明实施例提供的一种自助取数平台的前端框架建立装置的一个实施例的结构示意图；

图4为本发明实施例提供的一种自助取数平台的前端框架建立装置的另一个实施例的结构示意图；

图5为multiselectui组件加载后的界面示意图；

图6(a)和(b)为collapseui组件加载后的界面示意图；

图7为timerangeui组件加载后的界面示意图；

图8为timeweekui组件加载后的界面示意图；

图9为tooltipui组件加载后的界面示意图；

图10为helpui组件加载后的界面示意图；

图11(a)和(b)为hang组件加载后的界面示意图；

图12为tableui组件加载后的界面示意图；

图13为轮播滑块组件加载后的界面示意图；

图14为前端框架目录结构示意图。

具体实施方式

本发明实施例提供的一种自助取数平台的前端框架建立方法及装置，解决了目前的电子商务在贸易过程中，在电子商务平台端的excel文件生成下载均依赖与后端程序，而造成的后端服务器计算压力的技术问题。

AMD(AsynchronousModuleDefinition)，异步模块加载机制。从它的规范描述页面看，AMD很短也很简单，但它却完整描述了模块的定义，依赖关系，引用关系以及加载机制。从它被requireJS，NodeJs，Dojo，JQuery使用也可以看出它具有很大的价值，没错，JQuery近期也采用了AMD规范。在这篇文章中，我们就将介绍AMD的性质，用法，优势以及应用场景。从AMD中我们也能学习到如何在更高层面去设计自己的前端应用。

为使得本发明的发明目的、特征、优点能够更加的明显和易懂，下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，下面所描述的实施例仅仅是本发明一部分实施例，而非全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其它实施例，都属于本发明保护的范围。

请参阅图1，本发明实施例提供的一种自助取数平台的前端框架建立方法的一个实施例包括：

101、引入avalon库；

本实施例中，当需要建立自助取数的前端时，首先需要引入avalon库。

102、对avalon库进行timerangeui组件、timeweekui组件、excelui组件、tooltipui组件按照对应的预置加载位置加载处理；

当引入avalon库之后，需要对avalon库进行timerangeui组件、timeweekui组件、excelui组件、tooltipui组件按照对应的预置加载位置加载处理。

103、将加载处理后的timerangeui组件、timeweekui组件、excelui组件、tooltipui组件在前端平台进行展示。

当对avalon库进行timerangeui组件、timeweekui组件、excelui组件、tooltipui组件按照对应的预置加载位置加载处理之后，需要将加载处理后的timerangeui组件、timeweekui组件、excelui组件、tooltipui组件在前端平台进行展示。

本实施例中，通过引入avalon库；对avalon库进行timerangeui组件、timeweekui组件、excelui组件、tooltipui组件按照对应的预置加载位置加载处理；将加载处理后的timerangeui组件、timeweekui组件、excelui组件、tooltipui组件在前端平台进行展示，解决了目前的电子商务在贸易过程中，在电子商务平台端的excel文件生成下载均依赖与后端程序，而造成的后端服务器计算压力的技术问题。

请参阅图2，本发明实施例提供的一种自助取数平台的前端框架建立方法的一个实施例包括：

201、引入avalon库；

本实施例中，当需要建立自助取数的前端时，首先需要引入avalon库。

202、对timerangeui组件、timeweekui组件或dateui组件、excelui组件、tooltipui组件进行配置处理；

当引入avalon库之后，需要对timerangeui组件、timeweekui组件或dateui组件、excelui组件、tooltipui组件进行配置处理。

对timerangeui组件、timeweekui组件或dateui组件、excelui组件、tooltipui组件进行配置处理具体包括：

对timerangeui组件的开始参数、结束参数、每次时间范围变化时执行的回调函数及时间跨度参数配置；

对excelui组件的对应的若干个原始table元素的id配置；

对timeweekui组件或dateui组件、tooltipui组件进行配置。

203、对avalon库进行timerangeui组件、timeweekui组件或dateui组件、excelui组件、tooltipui组件按照对应的预置加载位置加载处理；

当对timerangeui组件、timeweekui组件或dateui组件、excelui组件、tooltipui组件进行配置处理之后，需要对avalon库进行timerangeui组件、timeweekui组件或dateui组件、excelui组件、tooltipui组件按照对应的预置加载位置加载处理。

204、对multiselectui组件、collapseui组件、helpui组件、hang组件、轮播滑块组件进行配置处理；

当引入avalon库之后，需要对multiselectui组件、collapseui组件、helpui组件、hang组件、轮播滑块组件进行配置处理。

205、对avalon库进行multiselectui组件、collapseui组件、helpui组件、hang组件、轮播滑块组件按照对应的预置加载位置加载处理；

当对multiselectui组件、collapseui组件、helpui组件、hang组件、轮播滑块组件进行配置处理之后，需要对avalon库进行multiselectui组件、collapseui组件、helpui组件、hang组件、轮播滑块组件按照对应的预置加载位置加载处理。

206、将加载处理后的timerangeui组件、timeweekui组件或dateui组件、excelui组件、tooltipui组件在前端平台进行展示。

当对avalon库进行timerangeui组件、timeweekui组件或dateui组件、excelui组件、tooltipui组件按照对应的预置加载位置加载处理和对avalon库进行multiselectui组件、collapseui组件、helpui组件、hang组件、轮播滑块组件按照对应的预置加载位置加载处理之后，需要将加载处理后的timerangeui组件、timeweekui组件或dateui组件、excelui组件、tooltipui组件在前端平台进行展示。

必须说明的是，本实施例中的前端组件的timeweekui组件可以是通过dateui组件进行替代。

需要说明的是，本实施例中的所有组件的中文意思如下：

timerangeui组件：可选日期区间的日期组件；

timeweekui组件：选择周的日期组件；

excelui组件：Excel导出组件；

tooltipui组件：分步骤提示组件，用于分步骤说明页面如何使用；

multiselectui组件：多选下拉框组件；

collapseui组件：可伸缩展示组件，用于将模块设置为可收起或展开；

helpui组件：帮助组件，用于隐藏或展开显示帮助信息；

hang组件：悬停挂起组件，当组件内容被滚轴卷出可视范围时，悬停在页面上方；

slideui组件：轮播滑块组件，用于切换展示区域。

本实施例中，通过引入avalon库；对avalon库进行timerangeui组件、timeweekui组件、excelui组件、tooltipui组件按照对应的预置加载位置加载处理；将加载处理后的timerangeui组件、timeweekui组件、excelui组件、tooltipui组件在前端平台进行展示，解决了目前的电子商务在贸易过程中，在电子商务平台端的excel文件生成下载均依赖与后端程序，而造成的后端服务器计算压力的技术问题。

下面以一具体应用场景对各组件进行详细的描述，应用例包括：

LOADING组件

加载位置widgets/loadingui/avalon.loadingui

使用示例<divms-widget＝"loadingui"data-loadingui-switch＝"xx"></div>

switch绑定到一个VM属性，布尔类型，决定loading遮罩的显示和关闭。

如图5所示，multiselectui组件

加载位置widgets/multiselectui/avalon.multiselectui

使用示例<spanms-widget＝"multiselectui,$,opt"></span>(multiselectui是使用的组件名，$代表组件ID随机生成，opt为组件所在VM的一个属性，作为组件的配置项)

opt{

placeholder:"(未知)",//(可选)未选中任何一条时显示的文字默认为(未知)

values:[],//(可选，和val2选1)对应存放选中的数据值的数组

val:null,//(可选，和values2选1)存放选中的单选值，当配置了values时val配置项无效

data:[],//[{name:”,value:”},...]//对应的显示的数组name是显示的text，value是显示的值

change:func//(可选)当选项任何一条发生变化时触发

changeBatch:func//(可选)当每次离开关闭了选择界面，前后数据发生变化时才触发

}

当选项多于12条时，搜索框出现。

如图6(a)和(b)所示，collapseui组件

加载位置widgets/collapseui/avalon.collapseui

使用示例<divms-widget＝"collapseui"data-collapseui-title＝"趋势"data-collapseui-bgcolor＝"#F0F0F0">内容</div>

title默认为空字符串,点击title可以缩起

bgcolor默认#FFFFFF白色为内容区域背景颜色

stateui组件

加载位置widgets/stateui/avalon.stateui

使用示例<divms-widget＝"stateui,state_id,$opt"></div>

state_idstate_id为组件ID可以自己命名，目的是可以在其它地方获取这个组件的VM

avalon.vmodels[state_id]

$opt$opt为组件配置项，内容为

{

beforeStore:function(){},//保存之前

afterStore:function(){},//保存之后

restore:function(){},//还原之后

afterRemove:function(){},//删除之后

afterChange:function(){}//保存的状态切换后触发

}

可以指定保存和还原状态时执行的函数

具体监控状态属性的js书写用法

在全局avalon.scan()执行之后，监听你要保存状态的VM属性

avalon.vmodels['state'].merge(avalon.vmodels['body'],"v","vs")

avalon.vmodels['body']是一个VM,"v"和"vs"是对应VM的属性名参数长度不限可以有多个，

这样对应VM的对应多个属性就被设置于状态保存监控之下了。

state组件的其它方法sync_store(val)获取或设置state组件的底层存储数据。state组件中的信息默认是存放在本地浏览器内，如果需要

将信息存储在其它地方比如数据库中，可以通过avalon.vmodels['state_id'].sync_store()获取底层数据，而初始化则需要

avalon.vmodels['state_id'].sync_store(val)//state_id是你的组件ID,val是之前存放在别处的底层数据

restore()//触发还原操作

左红圈1点击某个状态标签则对应的左侧选择条件都会变成对应之前保存的筛选条件。

左红圈2为保存当前筛选条件保存为一个状态固话左。

左红圈3删除某个固话状态。

如图7所示，timerangeui组件

加载位置widgets/timerangeui/avalon.timerangeui

使用示例<inputtype＝"text"style＝"width:160px；"ms-widget＝"timerangeui"readonly＝""data-timerangeui-begin＝'params.begin'data-timerangeui-end＝'params.end'data-timerangeui-change＝"func"data-timerangeui-maxinterval＝'7'/>

params.begin和params.end为时间范围绑定的开始和结束时间为组件所处的VM的两个属性根据情况自定义，注意必须是Date类型属性。

data-timerangeui-begin绑定开始参数

data-timerangeui-end绑定结束参数

data-timerangeui-change(可选)指定每次时间范围变化时执行的回调函数

data-timerangeui-maxinterval(可选)指定选择的时间跨度，例如：data-timerangeui-maxinterval＝'7'，日期跨度最大为7天，默认跨度为90天

如图8所示，timeweekui组件

加载位置widgets/timeweekui/avalon.timeweekui

使用示例<spanclass＝"con_option">

week日期:

<divclass＝"input-appenddateform_datetime">

<inputtype＝"text"style＝"width:160px；"ms-widget＝"timeweekui"readonly＝""data-timerangeui-week＝'param.week'/>

<spanclass＝"add-on"><iclass＝"icon-th"></i></span>

</div>

</span>

params.week为该周周日，根据情况自定义，注意必须是Date类型属性。

dateui组件

加载位置widgets/dateui/avalon.dateui

使用示例<inputms-widget＝"dateui"data-dateui-date＝"param.date"type＝"text"readonly＝"true"/>

其中param.date是你要双向绑定的那个vm属性，类型为Date。

excelui组件

加载位置widgets/excelui/avalon.excelui

使用示例绑定到一个vm属性上

<divstyle＝"height:100px；"ms-widget＝"excelui,$,conf"></div>

vm.conf＝{

clickBefore:function(){}//可选参数，点击之前的回调。如果是异步的需要返回deferred对象

tables:[{name:'sheetName',table:[2维数组]}]

loadAfter:function(){}//可选参数，excel下载后执行

}

或者

直接配置对应的若干个原始table元素的id

<divstyle＝"height:100px；"ms-widget＝"excelui"data-excelui-tables＝"tableId1,tableId2"></div>

如图9所示，tooltipui组件

加载位置widgets/tooltipui/avalon.tooltipui

使用示例<divms-widget＝"tooltipui"data-tooltipui-title＝"移动画像分为全部，渠道，城市，机型四种类型数据，

点击查看类型下拉框选择类型"data-tooltipui-top＝"35"data-tooltipui-left＝"75"data-tooltipui-step＝"1"data-tooltipui-group＝"one"></div>

data-tooltipui-top＝"35"表示style＝"top:35px"

data-tooltipui-left＝"75"表示style＝"left:75px"

tooltip可以定义多个group：

data-tooltipui-group＝"one"表示在onegroup中

data-tooltipui-step＝"1"表示第一步骤

如图10所示，helpui组件

加载位置widgets/helpui/avalon.helpui

使用示例<divms-widget＝"helpui"data-helpui-childId＝"public_age_help"class＝"help"data-helpui-width＝"300"data-helpui-height＝"100">

测试

</div>

data-helpui-width＝"300"表示帮助层显示宽度为300px

data-helpui-height＝“100”表示帮助层显示高度为100px

不传width和height，帮助层默认显示为100*100

如图11(a)和(b)所示，hang组件(悬停组件)

加载位置widgets/hang/avalon.hang

使用示例<divms-widget＝"hang"data-hang-offset＝"0">

测试

</div>

功能说明可以避免某一内容在滚轴向下滚动导致部分不可见的情况，而仍然使其完全可见类似悬停效果。

配置项container(可选)默认是window。可以指定组件相对于哪个容器内执行悬停，采用jqurey的查询字符串方式确定是哪一个容器。

offset(可选)默认是0,指定悬停相对于容器顶部的触发相对位置，比如相距顶部10像素时就触发悬停等等。

如图12所示，tableui组件(表格组件)

加载位置widgets/tableui/avalon.tableui

使用示例<divms-widget＝"tableui"data-tableui-columns＝"activity_columns"data-tableui-data＝"activity_from">

</div>

data-tableui-columns绑定的是表头列，格式是[{name:'行为名称',index:'activity_name'}...]诸如此类

data-tableui-data绑定的是表格数据，格式是[{activity_name:'xxxx'...}，....]诸如此类

data-tableui-size＝"8"(可选)指定每页大小

如图13所示，轮播滑块组件

加载位置widgets/slideui/avalon.slideui

使用示例<divms-widget＝"slideui">

<divstyle＝"min-height:400px；width:750px；"data-title＝"转化率">

</div>

<divdata-title＝"UV占比趋势">

</div>

</div>

组件的子级div就是滑块轮播的各个页，其中容器是以第一个子div的高宽为容器高宽，data-title是各自子块的标题。

图13中点击小圆点即在各个子块中来回切换。

本实施例的组件遵守AMD原则。

以下为加载所用UI组件,ready！为document加载完毕的事件

require(["jquery","bootstrap","css！bootstrap","widgets/loadingui/avalon.loadingui","ready！"],function(){

})

其中，excelui组件，基于html5技术标准,可以直接基于浏览器自身计算能力就打包、生成、下载对应数据的excel文件且性能较好，不同于以往的excel文件生成下载多依赖于后端程序(javac++…)，从而在大多数情况下前端工程师自己就能完成，大大简化相关流程并减轻后端服务器计算压力。

请参阅图3，本发明实施例中提供的一种自助取数平台的前端框架建立装置一个实施例包括：

引入单元301，用于引入avalon库；

第一加载单元302，用于对avalon库进行timerangeui组件、timeweekui组件、excelui组件、tooltipui组件按照对应的预置加载位置加载处理；

展示单元303，用于将加载处理后的timerangeui组件、timeweekui组件、excelui组件、tooltipui组件在前端平台进行展示。

本实施例中，通过引入单元301引入avalon库；第一加载单元302对avalon库进行timerangeui组件、timeweekui组件、excelui组件、tooltipui组件按照对应的预置加载位置加载处理；展示单元303将加载处理后的timerangeui组件、timeweekui组件、excelui组件、tooltipui组件在前端平台进行展示，解决了目前的电子商务在贸易过程中，在电子商务平台端的excel文件生成下载均依赖与后端程序，而造成的后端服务器计算压力的技术问题。

上面是对自助取数平台的前端框架建立装置的单元进行详细的描述，下面将对附加单元进行详细的描述，请参阅图4，本发明实施例中提供的一种自助取数平台的前端框架建立装置另一个实施例包括：

引入单元401，用于引入avalon库；

第一配置单元402，用于对timerangeui组件、timeweekui组件、excelui组件、tooltipui组件进行配置处理。

第一配置单元402具体包括：

第一配置子单元4021，用于对timerangeui组件的开始参数、结束参数、每次时间范围变化时执行的回调函数及时间跨度参数配置；

第二配置子单元4022，用于对excelui组件的对应的若干个原始table元素的id配置；

第三配置子单元4023，用于对timeweekui组件、tooltipui组件进行配置。

第一加载单元403，用于对avalon库进行timerangeui组件、timeweekui组件、excelui组件、tooltipui组件按照对应的预置加载位置加载处理；

第二配置单元404，用于对multiselectui组件、collapseui组件、helpui组件、hang组件、轮播滑块组件进行配置处理。

第二加载单元405，用于对avalon库进行multiselectui组件、collapseui组件、helpui组件、hang组件、轮播滑块组件按照对应的预置加载位置加载处理。

展示单元406，用于将加载处理后的timerangeui组件、timeweekui组件、excelui组件、tooltipui组件在前端平台进行展示。

本实施例中，通过引入单元401引入avalon库；第一加载单元403对avalon库进行timerangeui组件、timeweekui组件、excelui组件、tooltipui组件按照对应的预置加载位置加载处理；展示单元406将加载处理后的timerangeui组件、timeweekui组件、excelui组件、tooltipui组件在前端平台进行展示，解决了目前的电子商务在贸易过程中，在电子商务平台端的excel文件生成下载均依赖与后端程序，而造成的后端服务器计算压力的技术问题。

所属领域的技术人员可以清楚地了解到，为描述的方便和简洁，上述描述的系统，装置和单元的具体工作过程，可以参考前述方法实施例中的对应过程，在此不再赘述。

在本申请所提供的几个实施例中，应该理解到，所揭露的系统，装置和方法，可以通过其它的方式实现。例如，以上所描述的装置实施例仅仅是示意性的，例如，所述单元的划分，仅仅为一种逻辑功能划分，实际实现时可以有另外的划分方式，例如多个单元或组件可以结合或者可以集成到另一个系统，或一些特征可以忽略，或不执行。另一点，所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口，装置或单元的间接耦合或通信连接，可以是电性，机械或其它的形式。

所述作为分离部件说明的单元可以是或者也可以不是物理上分开的，作为单元显示的部件可以是或者也可以不是物理单元，即可以位于一个地方，或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。

另外，在本发明各个实施例中的各功能单元可以集成在一个处理单元中，也可以是各个单元单独物理存在，也可以两个或两个以上单元集成在一个单元中。上述集成的单元既可以采用硬件的形式实现，也可以采用软件功能单元的形式实现。

所述集成的单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时，可以存储在一个计算机可读取存储介质中。基于这样的理解，本发明的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的全部或部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储介质中，包括若干指令用以使得一台计算机设备(可以是个人计算机，服务器，或者网络设备等)执行本发明各个实施例所述方法的全部或部分步骤。而前述的存储介质包括：U盘、移动硬盘、只读存储器(ROM，Read-OnlyMemory)、随机存取存储器(RAM，RandomAccessMemory)、磁碟或者光盘等各种可以存储程序代码的介质。

以上所述，以上实施例仅用以说明本发明的技术方案，而非对其限制；尽管参照前述实施例对本发明进行了详细的说明，本领域的普通技术人员应当理解：其依然可以对前述各实施例所记载的技术方案进行修改，或者对其中部分技术特征进行等同替换；而这些修改或者替换，并不使相应技术方案的本质脱离本发明各实施例技术方案的精神和范围。

Claims (10)

1.一种自助取数平台的前端框架建立方法，其特征在于，包括：

引入avalon库；

对所述avalon库进行timerangeui组件、timeweekui组件、excelui组件、tooltipui组件按照对应的预置加载位置加载处理；

将加载处理后的所述timerangeui组件、所述timeweekui组件、所述excelui组件、所述tooltipui组件在前端平台进行展示。

2.根据权利要求1所述的自助取数平台的前端框架建立方法，其特征在于，对所述avalon库进行timerangeui组件、timeweekui组件、excelui组件、tooltipui组件按照对应的预置加载位置加载处理之前还包括：

对所述timerangeui组件、所述timeweekui组件或dateui组件、所述excelui组件、所述tooltipui组件进行配置处理。

3.根据权利要求1所述的自助取数平台的前端框架建立方法，其特征在于，对所述timerangeui组件、所述timeweekui组件或dateui组件、所述excelui组件、所述tooltipui组件进行配置处理具体包括：

对所述timerangeui组件的开始参数、结束参数、每次时间范围变化时执行的回调函数及时间跨度参数配置；

对所述excelui组件的对应的若干个原始table元素的id配置；

对所述timeweekui组件或dateui组件、所述tooltipui组件进行配置。

4.根据权利要求1至3中任意一项所述的自助取数平台的前端框架建立方法，其特征在于，所述的自助取数平台的前端框架建立方法还包括：

对所述avalon库进行multiselectui组件、collapseui组件、helpui组件、hang组件、轮播滑块组件按照对应的预置加载位置加载处理。

5.根据权利要求4所述的自助取数平台的前端框架建立方法，其特征在于，对所述avalon库进行multiselectui组件、collapseui组件、helpui组件、hang组件、轮播滑块组件按照对应的预置加载位置加载处理之前还包括：

对所述multiselectui组件、所述collapseui组件、所述helpui组件、所述hang组件、所述轮播滑块组件进行配置处理。

6.一种自助取数平台的前端框架建立装置，其特征在于，包括：

引入单元，用于引入avalon库；

第一加载单元，用于对所述avalon库进行timerangeui组件、timeweekui组件、excelui组件、tooltipui组件按照对应的预置加载位置加载处理；

展示单元，用于将加载处理后的所述timerangeui组件、所述timeweekui组件、所述excelui组件、所述tooltipui组件在前端平台进行展示。

7.根据权利要求6所述的自助取数平台的前端框架建立装置，其特征在于，自助取数平台的前端框架建立装置还包括：

第一配置单元，用于对所述timerangeui组件、所述timeweekui组件或dateui组件、所述excelui组件、所述tooltipui组件进行配置处理。

8.根据权利要求7所述的自助取数平台的前端框架建立装置，其特征在于，第一配置单元具体包括：

第一配置子单元，用于对所述timerangeui组件的开始参数、结束参数、每次时间范围变化时执行的回调函数及时间跨度参数配置；

第二配置子单元，用于对所述excelui组件的对应的若干个原始table元素的id配置；

第三配置子单元，用于对所述timeweekui组件或dateui组件、所述tooltipui组件进行配置。

9.根据权利要求6至8中任意一项所述的自助取数平台的前端框架建立装置，其特征在于，自助取数平台的前端框架建立装置还包括：

第二加载单元，用于对所述avalon库进行multiselectui组件、collapseui组件、helpui组件、hang组件、轮播滑块组件按照对应的预置加载位置加载处理。

10.根据权利要求9所述的自助取数平台的前端框架建立装置，其特征在于，自助取数平台的前端框架建立装置还包括：

第二配置单元，用于对所述multiselectui组件、所述collapseui组件、所述helpui组件、所述hang组件、所述轮播滑块组件进行配置处理。