gfwleak/nezha-nezha-fronted
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix:系统设置页面调整 & overview地图图表数据使用接口数据

Browse Source 
1.系统设置页面校验调整
2.overview  地图图表使用接口数据
3.mib 列表调整
This commit is contained in:
wangwenrui
2020-03-31 20:08:33 +08:00
parent e3809a11dc
commit 203e977b87
7 changed files with 255 additions and 167 deletions
Download Patch File Download Diff File Expand all files Collapse all files

73
nezha-fronted/src/components/page/dashboard/overview/chart.vue
View File

@@ -37,69 +37,12 @@
},
methods:{
tooltipPosition:function(point,params,dom,rect,size){
dom.style.transform = "translateZ(0)";
//提示框位置
var x=0;
var y=0;
//当前鼠标位置
var pointX = point[0];
var pointY = point[1];
//外层div大小
var viewWidth = size.viewSize[0];
var viewHeight = size.viewSize[1];
//提示框大小
var boxWidth = size.contentSize[0];
var boxHeight = size.contentSize[1];
let chartDom = document.getElementById(this.chartId);
if(chartDom){
let parTop = chartDom.offsetTop;
let parLeft = chartDom.offsetLeft;
let parent = chartDom.parentElement;
let parClientHeight = parent.clientHeight;//可视高度
let parClientWidth = parent.clientWidth;//可视宽度
let parScrollTop = parent.scrollTop;
if((parClientWidth-pointX-parLeft-20)>=boxWidth){//说明鼠标在左边放不下提示框
x=pointX+10;
}else{
x = pointX - boxWidth;
}
if((parClientHeight-pointY-(parTop-parScrollTop)-20)>=boxHeight){//说明鼠标上面放不下提示框
y = pointY+10;
}else {
y = pointY-boxHeight;
}
return [x,y];
}else {
x = pointX - boxWidth;
y = pointY+10;
return [x,y];
modifyOption:function(target,name,obj){
if(this.option){
this.option=chartConfig.getOption(this.chartType);
}
},
tooltipFormatter:function(params){
let str = `<div>`;
params.forEach((item, i) => {
if(i===0){
let t_date = new Date(item.data[0]);
str += [t_date.getFullYear(), t_date.getMonth() + 1, t_date.getDate()].join('-') + " "
+ [t_date.getHours(), t_date.getMinutes(),t_date.getSeconds()].join(':');
str +=`<br/>`;
}
let val = Number(item.data[1]);
str += `<div style="white-space:nowrap;overflow-x:hidden;text-overflow:ellipsis;display: flex; justify-content: space-between; min-width: 150px; max-width: 600px; line-height: 18px; font-size: 12px;">`;
str += `<div style="max-width: 500px;white-space:nowrap;overflow-x:hidden;text-overflow:ellipsis;"><span style='display:inline-block;margin-right:5px;border-radius:10px;width:15px;height:5px;background-color: ${item.color};}'></span>${item.seriesName}: </div>`;
str += `<div style="padding-left: 10px;">`;
str += chartDataFormat.getUnit(5).compute(val,null,2);
str += `</div>`;
str += `</div>`;
});
str +=`</div>`;
return str;
},
yAxisFormatter:function(value,index){
let unit=chartDataFormat.getUnit(5);
return unit.compute(value,index);
this.$set(this.option[target],name,obj)
},
setSeries:function(series){
if(!this.chart){
@@ -115,13 +58,15 @@
}
}
this.option=chartConfig.getOption(this.chartType);
if(this.option){
this.option=chartConfig.getOption(this.chartType);
}
this.$set(this.option,'series',this.series);
if(this.chartType == 'line'){
/*if(this.chartType == 'line'){
this.$set(this.option.tooltip,'formatter',this.tooltipFormatter);
this.$set(this.option.tooltip,'position',this.tooltipPosition);
this.$set(this.option.yAxis,'formatter',this.yAxisFormatter);
}
}*/
this.chart.clear();
this.chart.setOption(this.option)