tab控件可以绑定自由块,控制任意自由块的显隐。但是tab按键只能横向或纵向整齐紧密排列,每个按钮不能自由摆放,样式也不能自由个性化设置。
使用图表鼠标左键自定义事件,即可实现更加自由的样式和布局,自定义鼠标左键事件方法定义如下。
mouseLeftClikEventCallBack = function(data){
scope.$emit("hide-layers-emit",
{target:[ "146749-6f7-b5c", "dc4d28-3ac-e7f"],
tabWids:[ "62779f-c45-406", "88c8c0-bb9-d83" ]}
);
$rootScope.$digest();
};
上方target与tabWids值的获取方式。
浏览器调试,在play_modules-***.js中搜索 updateActiveWidgets, 并在下方第一个_.each处打断点获取每个tab按钮对应的target与tabWids值。
$scope.updateActiveWidgets = function (e) {
var o = e.target,
a = e.tabWids;
_.each($scope.chartBook.pages, function (e) {
_.each(e.freeWidgets, function (t) {
- 1 < a.indexOf(t.tab) && (t.hide = o && 0 < o.length && - 1 < o.indexOf(t.wid), 'tabs' == t.type &&
_.each(t.resource.tabs, function (e) {
e.hide = t.hide
}))
})
})
};