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

fix:修改BUG

Browse Source 
1.metric指标名称过长时，覆盖右侧的label名称(新增图表和图表预览中)
2.指标预览中，不可用按钮样式调整
3.指标预览中，右侧label值选择下拉列表样式调整
This commit is contained in:
hanyuxia
2020-01-17 10:25:36 +08:00
parent 172815d6d8
commit 15a0e803f8
4 changed files with 33 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -30,10 +30,10 @@
}
.li-list-part-label-val-list {
width: 100%;
height: 165px;
height: 145px;
border: 1px solid #cfcfcf;
overflow-y: auto;
margin-top: -10px;/*21*/
margin-top: 20px;/*21*/
border: 0px;
}
.no-list-style{
@@ -75,12 +75,12 @@
<button @click="clickTabelShow(1,'normal')" class="nz-btn nz-btn-size-small nz-btn-style-light float-left">
<span>{{$t('dashboard.metric.normal')}}</span>
</button>
<button @click="" class="nz-btn nz-btn-size-small nz-btn-disabled nz-btn-style-normal float-left">
<button @click="" class="nz-btn nz-btn-size-small nz-btn-style-normal float-left">
<span>{{$t('dashboard.metric.expert')}}</span>
</button>
</div>
<div class="nz-btn-group float-left" v-show="tableShow == 1">
<button @click="" class="nz-btn nz-btn-size-small nz-btn-disabled nz-btn-style-normal float-left">
<button @click="" class="nz-btn nz-btn-size-small nz-btn-style-normal float-left">
<span>{{$t('dashboard.metric.normal')}}</span>
</button>
<button @click="clickTabelShow(2,'expert')" class="nz-btn nz-btn-size-small nz-btn-style-light float-left">

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

@@ -30,10 +30,10 @@
}
.li-list-part-label-val-list {
width: 100%;
height: 165px;
height: 145px;
border: 1px solid #cfcfcf;
overflow-y: auto;
margin-top: -10px;/*21*/
margin-top: 20px;/*21*/
border: 0px;
}
.no-list-style{
@@ -75,12 +75,12 @@
<button @click="clickTabelShow(1,'normal')" class="nz-btn nz-btn-size-small nz-btn-style-light float-left">
<span>{{$t('dashboard.metric.normal')}}</span>
</button>
<button @click="" class="nz-btn nz-btn-size-small nz-btn-disabled nz-btn-style-normal float-left">
<button @click="" class="nz-btn nz-btn-size-small nz-btn-style-normal float-left">
<span>{{$t('dashboard.metric.expert')}}</span>
</button>
</div>
<div class="nz-btn-group float-left" v-show="tableShow == 1">
<button @click="" class="nz-btn nz-btn-size-small nz-btn-disabled nz-btn-style-normal float-left">
<button @click="" class="nz-btn nz-btn-size-small nz-btn-style-normal float-left">
<span>{{$t('dashboard.metric.normal')}}</span>
</button>
<button @click="clickTabelShow(2,'expert')" class="nz-btn nz-btn-size-small nz-btn-style-light float-left">
@@ -132,7 +132,8 @@
</el-col>
<el-col span="12">
<div class="li-list-part-label-val-list" >
<el-form-item class="metric-title-position" v-for="(item, index) in elementInfo.selectedTagList" :key="index" :label="item.name" :label-width="100" :ref="'tagItem' + index" :prop="'tagList.' + index + '.value'" >
<el-form-item class="metric-title-position" v-for="(item, index) in elementInfo.selectedTagList" :key="index" :label-width="100" :ref="'tagItem' + index" :prop="'tagList.' + index + '.value'" >
<el-row >{{item.name}}</el-row>
<el-row class="metric-title-row-position" >
<!--多选列表 -->
<el-col span="20" >

8
nezha-fronted/src/components/page/dashboard/metricSet.scss
View File

@@ -21,6 +21,7 @@
border-top: 1px solid #dfe7f2;
border-bottom: 1px solid #dfe7f2;
padding: 5px 0;
margin-left:3px;
.operate-area-title {
padding: 5px 0;
font-size: 14px;
@@ -48,8 +49,11 @@
.mt-10{
margin-top:10px;
}
.nx-btn-disabled{
cursor:not-allowed;
.ml-3{
margin-left:3px;
}
.btn-disabled-cursor-not-allowed{
cursor:not-allowed !important;
}
.w-select{
width:130px;

25
nezha-fronted/src/components/page/dashboard/metricSet.vue
View File

@@ -11,20 +11,20 @@
@on-change-condition="getCondition"
></chart-metric>
</el-row>
<el-row class="pt-5 pb-5">
<el-row class="pt-5 pb-5 ml-3">
<button type="primary" @click="preview" :disabled="loading" class="nz-btn nz-btn-size-normal nz-btn-style-normal ">{{$t('dashboard.metric.previewChart')}}</button>
<button :disabled="saveDisabled || loading" type="primary" @click="preview('change')"
:class="{'nz-btn nx-btn-disabled' : (saveDisabled || loading), 'nz-btn nz-btn-size-normal nz-btn-style-normal' : !(saveDisabled || loading)}"
:class="{'nz-btn nz-btn-disabled nz-btn-size-normal nz-btn-style-light nz-btn-min-width-75 btn-disabled-cursor-not-allowed' : (saveDisabled || loading), 'nz-btn nz-btn-size-normal nz-btn-style-normal' : !(saveDisabled || loading)}"
>{{chartSwitchWord}}</button>
<!-- <Button type="primary" @click="addTarget">添加指标</Button> -->
</el-row>
<el-row class="operate-area">
<div class="operate-area-title">{{$t('dashboard.metric.saveChartToPanel')}}:</div>
<button :disabled="saveDisabled" type="primary" @click="createNew"
:class="{'nz-btn nx-btn-disabled' : saveDisabled , 'nz-btn nz-btn-size-normal nz-btn-style-normal' : !saveDisabled}"
:class="{'nz-btn nz-btn-disabled nz-btn-size-normal nz-btn-style-light btn-disabled-cursor-not-allowed' : saveDisabled , 'nz-btn nz-btn-size-normal nz-btn-style-normal' : !saveDisabled}"
>{{$t('dashboard.metric.createPanel')}}</button>
<button :disabled="saveDisabled" type="primary" @click="selectPanel"
:class="{'nz-btn nx-btn-disabled' : saveDisabled , 'nz-btn nz-btn-size-normal nz-btn-style-normal' : !saveDisabled}"
:class="{'nz-btn nz-btn-disabled nz-btn-size-normal nz-btn-style-light nz-btn-min-width-75 btn-disabled-cursor-not-allowed' : saveDisabled , 'nz-btn nz-btn-size-normal nz-btn-style-normal' : !saveDisabled}"
>{{$t('dashboard.metric.selectPanel')}}</button>
</el-row>
<el-row class="mt-10">
@@ -33,7 +33,7 @@
<el-form :model="chartInfo" ref="chartInfo" v-show="isSave">
<el-row>
<div class="common-float-left">
<el-form-item :label-width="80" :label="$t('dashboard.panel.chartForm.width')" prop="span"
<el-form-item :label-width="80" :label="$t('dashboard.panel.chartForm.width')" prop="span"
:rules="{ required: true, type: 'number', trigger: 'change' }">
<el-select class="w-select" size="small" v-model="chartInfo.span" transfer>
<el-option v-for="item in spanList" :key="item" :label="'span-' + item" :value="item">
@@ -71,7 +71,7 @@
</div>
</template>
<script>
import axios from 'axios';
//import axios from 'axios';
import bus from '../../../libs/bus';
import chartMetric from "./chartMetricForPreview";
import metricPrePanelBox from "../../common/rightBox/metricPrePanelBox";
@@ -158,8 +158,6 @@ export default {
reload(){
this.saveDisabled = true;
this.elementTarget = {};
},
// 创建看板
createNew() {
@@ -177,6 +175,7 @@ export default {
this.$refs.panelBox.setChartTitle(this.metricInfo.metric);
this.$refs.panelBox.getTableData();
},
/*
// 取消创建modal
cancel() {
this.panelList = [];
@@ -190,16 +189,20 @@ export default {
}
this.createModal = false;
},
*/
/*
// 重置已选择的看板
initSaveInfo() {
this.chartSaveInfo.name = ''; // panel名称创建
this.chartSaveInfo.panelId = ''; // 选择panel
},
close() {
this.elementTarget = {}; // 初始化清空参数
this.initInfo();
this.chartModal = false;
},
*/
// 初始化信息
initInfo() {
this.chartInfo.title = '';
@@ -260,6 +263,7 @@ export default {
}
});
},
/*
// 确认创建图表
createConfirm() {
this.$refs.chartInfo.validate((valid) => {
@@ -292,6 +296,7 @@ export default {
}
});
},
// 选择看板
panelSelect(id) {
if (id) {
@@ -301,6 +306,8 @@ export default {
}
}
},
*/
/*
// 生成图表的时候,使用该函数,汇总创建图表参数
getOptions() {
this.$refs.chartInfo.validate((valid) => {
@@ -431,10 +438,12 @@ export default {
});
}
},
// 增加指标,tarNum
addTarget() {
this.elements.push(1);
},
*/
// 获取metric列表
getSuggestMetric(id) {
this.$get('metric', {pageNo: 1, pageSize: -1}).then(response => {