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

fix:修改BUG

Browse Source 
dashboard模块
1.登陆进入页面 header菜单没有默认选中（NEZ-121）
2.表格类型图表，修改height无效（NEZ-121）
3.折线图图表，修改高度为 200px，显示不正常，height应该是整个图表的高度，而不是只是echarts图的高度（NEZ-121）
4.表格 time格式化 包含秒（NEZ-121）
5.预览模块专家模式，表达式输入错误没有提示信息（（NEZ-56））
6.panel列表选择专家模式表达式错误的panel，没有错误提示信息（NEZ-63）
This commit is contained in:
hanyuxia
2020-02-17 19:37:06 +08:00
parent a2267c626d
commit 7e118b0601
8 changed files with 27 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
nezha-fronted/src/components/charts/chart-list.vue
View File

@@ -288,7 +288,7 @@ export default {
}
*/
let t_date = new Date(dpsItem[0] * 1000);
let timeTmp = bus.timeFormate(t_date, 'yyyy-MM-dd hh:mm');
let timeTmp = bus.timeFormate(t_date, 'yyyy-MM-dd hh:mm:ss');
tableData.push({//表格数据
label: host.slice(host.indexOf('{') + 1,host.indexOf('}')),//label
metric: queryItem.metric.__name__?queryItem.metric.__name__:'',//metric列

2
nezha-fronted/src/components/charts/chart-table.scss
View File

@@ -12,7 +12,7 @@
}
.chart-table {
width: calc(100% - 62px);
height: calc(100% - 40px);
height: 100%;//calc(100% - 40px);
// min-height: 500px;
position: relative;
background: #FFF;

16
nezha-fronted/src/components/charts/chart-table.vue
View File

@@ -2,12 +2,12 @@
@import './chart-table.scss';
</style>
<template>
<div class="chart-table">
<div class="chart-table" id="chartTableDiv">
<div class="clearfix">
<div class="table-title">
{{data.title}}
</div>
<div class="nz-btn-group nz-btn-group-light edit">
<div class="nz-btn-group nz-btn-group-light edit" v-if="firstShow">
<button type="button" @click="refreshChart" style="padding: 6px 14px 5px 14px;" class="nz-btn nz-btn-size-large nz-btn-style-light"><i style="font-size: 16px;" class="global-active-color el-icon-refresh-right"></i></button><button
@click="editChart" type="button" class="nz-btn nz-btn-size-large nz-btn-style-light"><i class="nz-icon nz-icon-edit"></i></button><button
@click="removeChart" type="button" class="nz-btn nz-btn-size-large nz-btn-style-light"><i class="el-icon-delete"></i></button><button
@@ -35,7 +35,7 @@
<div class="mt-10" v-cloak>
<!--
<el-table size="small" :loading="tableLoading">-->
<el-table class="nz-table" :data="seriesItem" height="350" border v-loading="tableLoading" tooltip-effect="light" v-cloak>
<el-table class="nz-table" id="tableContainer" ref="tableContainer" :data="seriesItem" :height="350" border v-loading="tableLoading" tooltip-effect="light" v-cloak>
<el-table-column sortable :show-overflow-tooltip="true" prop="metric" :label="$t('dashboard.panel.chartTableColumn.metric')" ></el-table-column>
<el-table-column sortable :show-overflow-tooltip="true" prop="label" :label="$t('dashboard.panel.chartTableColumn.label')" ></el-table-column>
<el-table-column sortable prop="time" :label="$t('dashboard.panel.chartTableColumn.time')" width="145" ></el-table-column>
@@ -52,7 +52,7 @@
<!--<button @click="refreshChart" type="button" class="nz-btn nz-btn-size-normal nz-btn-style-light"><i style="font-size: 14px;" class="el-icon-refresh-right"></i></button>-->
</div>
</div>
<el-table style="padding-top: 30px;" class="nz-table" :data="seriesItem" height="350" border v-loading="tableLoading" tooltip-effect="light">
<el-table style="padding-top: 30px;" class="nz-table" :data="seriesItem" :height="350" border v-loading="tableLoading" tooltip-effect="light">
<el-table-column sortable :show-overflow-tooltip="true" prop="metric" :label="$t('dashboard.panel.chartTableColumn.metric')" ></el-table-column>
<el-table-column sortable :show-overflow-tooltip="true" prop="label" :label="$t('dashboard.panel.chartTableColumn.label')" ></el-table-column>
<el-table-column sortable prop="time" :label="$t('dashboard.panel.chartTableColumn.time')" width="145" ></el-table-column>
@@ -254,6 +254,14 @@ export default {
this.searchTime[0] = filter.start_time;
this.searchTime[1] = filter.end_time;
this.oldSearchTime = this.searchTime;
//设置高度 chart-table
this.$nextTick(() => {
const chartBox = document.getElementById('chartTableDiv');
let height = chartItem.height;
chartBox.style.height = `${height-25}px`;
const tableBox = document.getElementById('tableContainer');
tableBox.style.height = `${height-75}px`;
});
},
// 获取格式
getNumStr(num) {

48
nezha-fronted/src/components/charts/line-chart-block.scss
View File

@@ -43,7 +43,7 @@
}
.line-chart-block {
height: 100%;
// min-height: 500px;
//min-height: 0px;
position: relative;
background: #FFF;
border: 1px solid #d8dce1;
@@ -53,15 +53,7 @@
.line-area {
box-sizing: border-box;
background: #FFF;
min-height: 300px;
span.highcharts-title {
display: block !important;
width: 50%;
font-size: 14px !important;
overflow: hidden;
word-wrap: break-word !important;
white-space: pre-wrap !important;
}
min-height: 95px;
}
/*.edit:after{
display: block;
@@ -73,39 +65,7 @@
right: 20px;
top: 17px;
z-index: 10;
/*background: $btn-light-background-color;
border-radius: 6px;;
border: 1px solid #ccc;
.set-icon {
display: inline-block;
cursor: pointer;
padding: 5px 15px;
margin-right: -3px;
border-right: 1px solid #ccc;
}
.set-icon:hover{
background: $btn-light-background-color-hover;
}
.set-icon:last-child:hover{
}
.set-icon:last-child{
border-right: none !important;
}
.el-icon-refresh-right{
color: #F0BF84;
}
i{
font-size: 16px;
color: #000;
}
.list-icon {
float: left;
}
.show-icon {
cursor: pointer;
float: right;
font-size: 14px;
}*/
}
.chart-select {
position: absolute;
@@ -138,7 +98,7 @@
.line-area {
box-sizing: border-box;
background: #FFF;
min-height: 300px;
min-height: 95px;
span.highcharts-title {/*针对highcharts设置的样式，echarts需要修改？？*/
display: block !important;
width: 50%;

8
nezha-fronted/src/components/charts/line-chart-block.vue
View File

@@ -645,7 +645,7 @@
option.title = title;
this.echartStore.setOption(option);//创建图表
this.echartStore.hideLoading();
this.echartStore.resize({height:chartInfo.height});//,width:`${ele.clientWidth-100}`}
//this.echartStore.resize({height:chartInfo.height});//,width:`${ele.clientWidth-100}`}
if(legend && legend.length>0){
this.legendList = [];
legend.forEach((item, i) => {
@@ -662,7 +662,7 @@
if(!chartInfo.height){
this.echartStore.resize({height:(400-divHeight)});
}else {
this.echartStore.resize({height:(chartInfo.height-divHeight)});
this.echartStore.resize({height:(chartInfo.height-divHeight-25)});
}
});
} else if (chartSite === 'screen') { // 全屏显示
@@ -716,7 +716,7 @@
option.title = {};
this.echartModalStore.setOption(option);//显示全屏界面
this.echartModalStore.hideLoading();
this.echartModalStore.resize({height:chartInfo.height});
//this.echartModalStore.resize({height:chartInfo.height});
if(legend && legend.length>0){
this.screenLegendList = [];
legend.forEach((item, i) => {
@@ -733,7 +733,7 @@
if(!chartInfo.height){
this.echartModalStore.resize({height:(400-divHeight)});
}else {
this.echartModalStore.resize({height:(chartInfo.height-divHeight)});
this.echartModalStore.resize({height:(chartInfo.height-divHeight-25)});
}
});
}

1
nezha-fronted/src/components/common/header.vue
View File

@@ -4,6 +4,7 @@
<el-menu
class="nz-menu float-right"
mode="horizontal"
active="1"
unique-opened
>
<el-submenu index="0" popper-class="nz-submenu">

2
nezha-fronted/src/components/page/dashboard/chartMetric.vue
View File

@@ -124,7 +124,7 @@
<template v-if="tableShow == 2">
<el-form-item class="right-box-form-content" prop="expression" :rules="{ required: true, message:$t('validate.required'), trigger: 'blur' }"><!--expression和metric的验证只能有一个，不能同时存在？？:rules="{ required: true, type: 'string', message: '', trigger: 'change' }"-->
<el-input size="mini" :class="{'right-box-row-with-btn': countTotal > 1, 'full-width': countTotal <= 1}" ref="metricExpression" type="textarea" rows="3" maxlength="512" show-word-limit v-model="elementInfo.expression" :placeholder="this.$t('dashboard.metric.expertTip')" ></el-input>
<el-input size="mini" :class="{'right-box-row-with-btn': countTotal > 1, 'full-width': countTotal <= 1}" ref="metricExpression" type="textarea" rows="7" maxlength="1024" show-word-limit v-model="elementInfo.expression" :placeholder="this.$t('dashboard.metric.expertTip')" ></el-input>
<div @click="deleteTarget" class="right-box-row-btn" v-if="countTotal > 1" style="vertical-align: top">
<i class="el-icon-minus"></i>
</div>

2
nezha-fronted/src/components/page/dashboard/chartMetricForPreview.vue
View File

@@ -190,7 +190,7 @@
<el-row v-if="tableShow == 2">
<el-col :span="24" class="mt1">
<el-form-item prop="expression" :rules="{ required: true, message:$t('validate.required'), trigger: 'blur' }"><!--expression和metric的验证只能有一个，不能同时存在？？:rules="{ required: true, type: 'string', message: '', trigger: 'change' }"-->
<el-input size="mini" @input="changeExpression" class="full-width" ref="metricExpression" type="textarea" maxlength="1024" show-word-limit v-model="elementInfo.expression" :placeholder="this.$t('dashboard.metric.expertTip')" ></el-input>
<el-input size="mini" rows="7" @input="changeExpression" class="full-width" ref="metricExpression" type="textarea" maxlength="1024" show-word-limit v-model="elementInfo.expression" :placeholder="this.$t('dashboard.metric.expertTip')" ></el-input>
</el-form-item>
</el-col>
</el-row>