fix:修复 alertMessage 图表不显示的问题 以及 查看图表后 分页查询带了时间参数的问题

This commit is contained in:
zhangyu
2021-05-14 15:24:32 +08:00
parent 212cb25ad0
commit 801180443f
22 changed files with 72 additions and 44 deletions

View File

@@ -301,7 +301,7 @@ export default {
return (key, value) => { return (key, value) => {
if (key == 'type') { if (key == 'type') {
if (value == 1) { if (value == 1) {
value = this.$t('project.project.project') value = this.$t('project.project.projectName')
} else if (value == 2) { } else if (value == 2) {
value = this.$t('module.module.module') value = this.$t('module.module.module')
} else if (value == 3) { } else if (value == 3) {

View File

@@ -357,7 +357,7 @@ export default {
path: this.$t('project.endpoint.path'), path: this.$t('project.endpoint.path'),
param: this.$t('project.endpoint.param'), param: this.$t('project.endpoint.param'),
state: this.$t('alert.list.state'), state: this.$t('alert.list.state'),
project: this.$t('project.project.project'), project: this.$t('project.project.projectName'),
module: this.$t('project.module.module') module: this.$t('project.module.module')
} }
} }

View File

@@ -198,7 +198,7 @@ export default {
disabled: false disabled: false
}, { }, {
id: 20, id: 20,
name: this.$t('project.project.project'), name: this.$t('project.project.projectName'),
type: 'project', type: 'project',
label: 'project', label: 'project',
disabled: false disabled: false
@@ -272,7 +272,7 @@ export default {
return (key, value) => { return (key, value) => {
if (key == 'type') { if (key == 'type') {
if (value == 1) { if (value == 1) {
value = this.$t('project.project.project') value = this.$t('project.project.projectName')
} else if (value == 2) { } else if (value == 2) {
value = this.$t('module.module.module') value = this.$t('module.module.module')
} else if (value == 3) { } else if (value == 3) {

View File

@@ -193,7 +193,7 @@ export default {
prop: 'id', prop: 'id',
show: true show: true
}, { }, {
label: this.$t('project.project.project'), label: this.$t('project.project.projectName'),
prop: 'project', prop: 'project',
show: true, show: true,
width: '120' width: '120'
@@ -288,7 +288,7 @@ export default {
readonly: true readonly: true
}, { }, {
id: 34, id: 34,
name: this.$t('project.project.project'), name: this.$t('project.project.projectName'),
// name: this.$t('asset.asset'), // name: this.$t('asset.asset'),
type: 'input', type: 'input',
label: 'projectName', label: 'projectName',

View File

@@ -253,7 +253,7 @@ export default {
}, },
createMenu: [ // 新增按钮内容 createMenu: [ // 新增按钮内容
{ {
label: this.$t('project.project.project'), label: this.$t('project.project.projectName'),
url: 'project', url: 'project',
type: 1, type: 1,
permission: 'header_add_project' permission: 'header_add_project'

View File

@@ -106,7 +106,8 @@ const cn = {
moreOption: '更多选项', moreOption: '更多选项',
copy: '复制', copy: '复制',
silence: '静默', silence: '静默',
labels: '标签' labels: '标签',
editType: '类型'
}, },
setup: { setup: {
step0: '欢迎', step0: '欢迎',
@@ -1163,7 +1164,7 @@ const cn = {
}, },
project: { project: {
project: '名称', project: '名称',
projectName: '系统名称', projectName: '系统',
editProject: '编辑系统', editProject: '编辑系统',
description: '描述', description: '描述',
createProject: '新增系统' createProject: '新增系统'

View File

@@ -111,7 +111,8 @@ const en = {
labels: 'Labels', labels: 'Labels',
moreOption: 'More option', moreOption: 'More option',
copy: 'Copy', copy: 'Copy',
silence: 'Silence' silence: 'Silence',
editType: 'Type'
}, },
pageSize: '/page', pageSize: '/page',
setup: { setup: {
@@ -1177,7 +1178,7 @@ const en = {
}, },
project: { project: {
project: 'Name', // "系统" project: 'Name', // "系统"
projectName: 'Project name', // "系统名称" projectName: 'Project', // "系统名称"
editProject: 'Edit project', // "编辑系统" editProject: 'Edit project', // "编辑系统"
description: 'Description', // "描述" description: 'Description', // "描述"
createProject: 'New project'// "新增系统" createProject: 'New project'// "新增系统"

View File

@@ -1884,8 +1884,14 @@ export default {
outline: none; outline: none;
} }
/deep/ .el-input-number:focus {
.el-input-number__decrease, .el-input-number__increase {
visibility: visible;
outline: none;
}
}
/deep/ .el-input-number:focus-within { /deep/ .el-input-number:focus-within {
/deep/ .el-input-number__decrease, /deep/ .el-input-number__increase { .el-input-number__decrease, .el-input-number__increase {
visibility: visible; visibility: visible;
outline: none; outline: none;
} }

View File

@@ -203,7 +203,7 @@ export default {
return (key, value) => { return (key, value) => {
if (key == 'type') { if (key == 'type') {
if (value == 1) { if (value == 1) {
value = this.$t('project.project.project') value = this.$t('project.project.projectName')
} else if (value == 2) { } else if (value == 2) {
value = this.$t('module.module.module') value = this.$t('module.module.module')
} else if (value == 3) { } else if (value == 3) {
@@ -284,7 +284,7 @@ export default {
disabled: false disabled: false
}, { }, {
id: 22, id: 22,
name: this.$t('project.project.project'), name: this.$t('project.project.projectName'),
type: 'project', type: 'project',
label: 'project', label: 'project',
disabled: false disabled: false

View File

@@ -130,7 +130,7 @@ export default {
return (key, value) => { return (key, value) => {
if (key == 'type') { if (key == 'type') {
if (value == 1) { if (value == 1) {
value = this.$t('project.project.project') value = this.$t('project.project.projectName')
} else if (value == 2) { } else if (value == 2) {
value = this.$t('module.module.module') value = this.$t('module.module.module')
} else if (value == 3) { } else if (value == 3) {

View File

@@ -116,7 +116,7 @@ export default {
return (key, value) => { return (key, value) => {
if (key == 'type') { if (key == 'type') {
if (value == 1) { if (value == 1) {
value = this.$t('project.project.project') value = this.$t('project.project.projectName')
} else if (value == 2) { } else if (value == 2) {
value = this.$t('module.module.module') value = this.$t('module.module.module')
} else if (value == 3) { } else if (value == 3) {

View File

@@ -13,7 +13,7 @@
<div class="right-box-form-box right-box__container" style="overflow: hidden"> <div class="right-box-form-box right-box__container" style="overflow: hidden">
<el-form class="right-box-form right-box-form-left" label-position = "top" ref="addEndpoint" :model="endpoint" :rules="rules"> <el-form class="right-box-form right-box-form-left" label-position = "top" ref="addEndpoint" :model="endpoint" :rules="rules">
<!--project--> <!--project-->
<el-form-item :label='$t("project.project.project")' prop="projectId" class="select-warp"> <el-form-item :label='$t("project.project.projectName")' prop="projectId" class="select-warp">
<el-select @change="((val) => {changeProject(val)})" value-key="id" popper-class="config-dropdown" v-model="currentProjectCopy" placeholder="" size="small" id="add-endpoint-project"> <el-select @change="((val) => {changeProject(val)})" value-key="id" popper-class="config-dropdown" v-model="currentProjectCopy" placeholder="" size="small" id="add-endpoint-project">
<el-option v-for="item in projectList" :key="item.id" :label="item.name" :value="item" :id="'project-'+item.id"></el-option> <el-option v-for="item in projectList" :key="item.id" :label="item.name" :value="item" :id="'project-'+item.id"></el-option>
</el-select> </el-select>

View File

@@ -10,7 +10,7 @@
<div class="container__form"> <div class="container__form">
<!-- Edit type --> <!-- Edit type -->
<el-form ref="assetEditForm" :model="editData" :rules="rules" label-position="top" label-width="120px"> <el-form ref="assetEditForm" :model="editData" :rules="rules" label-position="top" label-width="120px">
<el-form-item :label="$t('overall.name')" prop="editType"> <el-form-item :label="$t('overall.editType')" prop="editType">
<el-select v-model="editData.editType" class="right-box__select" popper-class="right-box-select-dropdown prevent-clickoutside" size="small" value-key="value"> <el-select v-model="editData.editType" class="right-box__select" popper-class="right-box-select-dropdown prevent-clickoutside" size="small" value-key="value">
<el-option v-for="type in assetConstants.editTypeOptions" :key="type.value" :label="type.label" :value="type.value"/> <el-option v-for="type in assetConstants.editTypeOptions" :key="type.value" :label="type.label" :value="type.value"/>
</el-select> </el-select>

View File

@@ -373,7 +373,7 @@ export default {
disabled: false disabled: false
}, { }, {
id: 34, id: 34,
name: this.$t('project.project.project'), name: this.$t('project.project.projectName'),
// name: this.$t('asset.asset'), // name: this.$t('asset.asset'),
type: 'input', type: 'input',
label: 'projectName', label: 'projectName',

View File

@@ -17,7 +17,7 @@
<div class="right-box-form-box"> <div class="right-box-form-box">
<el-form class="right-box-form right-box-form-left" :model="editEndpoint" label-position = "top" label-width="120px" :rules="rules" ref="endpointForm"> <el-form class="right-box-form right-box-form-left" :model="editEndpoint" label-position = "top" label-width="120px" :rules="rules" ref="endpointForm">
<!--project--> <!--project-->
<el-form-item :label="$t('project.project.project')" prop="project.id"> <el-form-item :label="$t('project.project.projectName')" prop="project.id">
<el-select @change="((val) => {changeProject(val);})" value-key="id" popper-class="config-dropdown" v-model="editEndpoint.projectId" placeholder="" size="small" id="edit-endpoint-input-project"> <el-select @change="((val) => {changeProject(val);})" value-key="id" popper-class="config-dropdown" v-model="editEndpoint.projectId" placeholder="" size="small" id="edit-endpoint-input-project">
<el-option :id="'edit-project-'+item.id" v-for="item in projectList" :key="item.id" :label="item.name" :value="item.id"></el-option> <el-option :id="'edit-project-'+item.id" v-for="item in projectList" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select> </el-select>

View File

@@ -27,7 +27,7 @@
<el-input placeholder="" maxlength="64" show-word-limit v-model="editEndpoint.name" size="small" id="module-box-input-name"></el-input> <el-input placeholder="" maxlength="64" show-word-limit v-model="editEndpoint.name" size="small" id="module-box-input-name"></el-input>
</el-form-item> </el-form-item>
<!--project--> <!--project-->
<el-form-item :label='$t("project.project.project")' prop="projectId"> <el-form-item :label='$t("project.project.projectName")' prop="projectId">
<el-select value-key="id" popper-class="config-dropdown" v-model="editEndpoint.projectId" placeholder="" size="small" id="module-box-input-project" @change="changeProject" :disabled="disabled"> <el-select value-key="id" popper-class="config-dropdown" v-model="editEndpoint.projectId" placeholder="" size="small" id="module-box-input-project" @change="changeProject" :disabled="disabled">
<el-option :id="'module-project-'+item.id" v-for="item in projectList" :key="item.id" :label="item.name" :value="item.id"></el-option> <el-option :id="'module-project-'+item.id" v-for="item in projectList" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select> </el-select>
@@ -121,18 +121,18 @@
</el-form-item> </el-form-item>
<transition name="el-zoom-in-top"> <transition name="el-zoom-in-top">
<div v-show="showAllBasicOption" > <div v-show="showAllBasicOption" >
<!--name pattern--> <!-- &lt;!&ndash;name pattern&ndash;&gt;-->
<el-form-item :label='$t("project.endpoint.pattern")' prop="pattern" class="half-form-item"> <!-- <el-form-item :label='$t("project.endpoint.pattern")' prop="pattern" class="half-form-item">-->
<!-- <el-input placeholder="" v-model=""></el-input>--> <!-- &lt;!&ndash; <el-input placeholder="" v-model=""></el-input>&ndash;&gt;-->
<el-autocomplete <!-- <el-autocomplete-->
class="inline-input" <!-- class="inline-input"-->
size="small" <!-- size="small"-->
id="module-box-input-pattern" <!-- id="module-box-input-pattern"-->
v-model="editEndpoint.endpointNameTmpl" <!-- v-model="editEndpoint.endpointNameTmpl"-->
:fetch-suggestions="querySearch" <!-- :fetch-suggestions="querySearch"-->
placeholder="请输入内容" <!-- placeholder="请输入内容"-->
></el-autocomplete> <!-- ></el-autocomplete>-->
</el-form-item> <!-- </el-form-item>-->
<!--scrape_interval--> <!--scrape_interval-->
<el-form-item :label='$t("project.endpoint.scrape_interval")' prop="scrape_interval" class="half-form-item"> <el-form-item :label='$t("project.endpoint.scrape_interval")' prop="scrape_interval" class="half-form-item">
<el-input :placeholder='$t("project.endpoint.scrape_interval_placeholder")' v-model.number="editEndpoint.configs.scrape_interval" size="small" id="module-box-input-scrape_interval"> <el-input :placeholder='$t("project.endpoint.scrape_interval_placeholder")' v-model.number="editEndpoint.configs.scrape_interval" size="small" id="module-box-input-scrape_interval">

View File

@@ -122,7 +122,7 @@
id="module-box-input-pattern" id="module-box-input-pattern"
v-model="editModule.endpointNameTmpl" v-model="editModule.endpointNameTmpl"
:fetch-suggestions="querySearch" :fetch-suggestions="querySearch"
placeholder="请输入内容" :placeholder="$t('overall.placeHolder')"
></el-autocomplete> ></el-autocomplete>
</el-form-item> </el-form-item>
<!--scrape_interval--> <!--scrape_interval-->

View File

@@ -224,7 +224,7 @@ export default {
return (key, value) => { return (key, value) => {
if (key == 'type') { if (key == 'type') {
if (value == 1) { if (value == 1) {
value = this.$t('project.project.project') value = this.$t('project.project.projectName')
} else if (value == 2) { } else if (value == 2) {
value = this.$t('module.module.module') value = this.$t('module.module.module')
} else if (value == 3) { } else if (value == 3) {

View File

@@ -20,7 +20,7 @@ export default {
height: calc(100% - 50px); height: calc(100% - 50px);
background-color: #f6f6f6; background-color: #f6f6f6;
width: 100%; width: 100%;
padding-right: 10px;
&>div { &>div {
height: 100%; height: 100%;
} }

View File

@@ -79,7 +79,7 @@ export default {
// 顶部菜单相关 // 顶部菜单相关
createMenu: [ // 新增按钮内容 createMenu: [ // 新增按钮内容
{ {
label: this.$t('project.project.project'), label: this.$t('project.project.projectName'),
url: 'project', url: 'project',
type: 1, type: 1,
permission: 'header_add_project' permission: 'header_add_project'

View File

@@ -89,7 +89,7 @@
<div slot="title"> <div slot="title">
{{$t("project.endpoint.dialogTitle")}} {{$t("project.endpoint.dialogTitle")}}
<div class="float-right panel-calendar dialog-tool" style="display: flex"> <div class="float-right panel-calendar dialog-tool" style="display: flex">
<pick-time v-model="searchTime" :refresh-data-func="queryChartDate" :use-chart-unit="false" :use-refresh="false" style="height: 28px;" @unitChange="chartUnitChange"></pick-time> <pick-time v-model="searchTimeDialog" :refresh-data-func="queryChartDate" :use-chart-unit="false" :use-refresh="false" style="height: 28px;" @unitChange="chartUnitChange"></pick-time>
</div> </div>
</div> </div>
<chart ref="messageChart" :unit="chartUnit" name="alertMessageChart"></chart> <chart ref="messageChart" :unit="chartUnit" name="alertMessageChart"></chart>
@@ -132,6 +132,7 @@ export default {
sameLabels: ['instance', 'module', 'project', 'asset', 'endpoint', 'datacenter'], sameLabels: ['instance', 'module', 'project', 'asset', 'endpoint', 'datacenter'],
legend: [], legend: [],
searchTime: [], searchTime: [],
searchTimeDialog: [],
searchTimeSelect: bus.getTimezontDateRange(), searchTimeSelect: bus.getTimezontDateRange(),
currentMsg: {}, currentMsg: {},
chartUnit: 5, chartUnit: 5,
@@ -193,7 +194,7 @@ export default {
return (key, value) => { return (key, value) => {
if (key == 'type') { if (key == 'type') {
if (value == 1) { if (value == 1) {
value = this.$t('project.project.project') value = this.$t('project.project.projectName')
} else if (value == 2) { } else if (value == 2) {
value = this.$t('module.module.module') value = this.$t('module.module.module')
} else if (value == 3) { } else if (value == 3) {
@@ -247,7 +248,7 @@ export default {
// const end = this.searchTime[1] ? this.searchTime[1] : getTime(0, 'h') // const end = this.searchTime[1] ? this.searchTime[1] : getTime(0, 'h')
const start = this.currentMsg.startAt const start = this.currentMsg.startAt
const end = this.currentMsg.endAt const end = this.currentMsg.endAt
this.searchTime = [start, end] this.searchTimeDialog = [start, end]
const timeDiff = (new Date(end).getTime() - new Date(start).getTime()) / 1000 / (24 * 60 * 60) const timeDiff = (new Date(end).getTime() - new Date(start).getTime()) / 1000 / (24 * 60 * 60)
let step = '15s' let step = '15s'
if (timeDiff < 1) { if (timeDiff < 1) {
@@ -323,7 +324,7 @@ export default {
chartData.name += '}' chartData.name += '}'
const legend = { const legend = {
name: chartData.name, name: chartData.name,
alias: alias, alias: chartData.name,
isGray: false isGray: false
} }
this.legend.push(legend) this.legend.push(legend)
@@ -344,7 +345,7 @@ export default {
this.$refs.messageChart.endLoading() this.$refs.messageChart.endLoading()
}) })
} catch (err) { } catch (err) {
this.$message.error(err) // this.$message.error(err)
this.$refs.messageChart.endLoading() this.$refs.messageChart.endLoading()
} }
}) })
@@ -584,8 +585,27 @@ export default {
this.$refs.dataTable.$refs.dataTable.bodyWrapper.scrollTop = 0 this.$refs.dataTable.$refs.dataTable.bodyWrapper.scrollTop = 0
} }
this.getTableData() this.getTableData()
},
computeDistance (str) {
let width = 0
const html = document.createElement('span')
html.innerText = str
html.className = 'getTextWidth'
document.querySelector('body').appendChild(html)
width = document.querySelector('.getTextWidth').offsetWidth
document.querySelector('.getTextWidth').remove()
return Number('-' + (width + 5))
},
returnMarkArea () {
if (this.currentMsg) {
if (this.currentMsg.alertRule.operator == '>' || this.currentMsg.alertRule.operator == '>=') {
return [{ yAxis: this.currentMsg.alertRule.threshold }, {}]
} else {
return [{}, { yAxis: this.currentMsg.alertRule.threshold }]
} }
} }
},
}
} }
</script> </script>

View File

@@ -1,7 +1,7 @@
<template> <template>
<div class="panel list-page"> <div class="panel list-page">
<div class="main-list"> <div class="main-list">
<div class="main-container"> <div class="main-container" style="padding-right: 0">
<div class="top-tools"> <div class="top-tools">
<div v-if="panelData.length == 0" class="top-tool-left" style="margin-left: 10px;"> <div v-if="panelData.length == 0" class="top-tool-left" style="margin-left: 10px;">
<button id="panel-add-panel" class="nz-btn nz-btn-style-light nz-btn-size-small" @click="toAdd"><i class="nz-icon nz-icon-create-square"></i>&nbsp;&nbsp;{{$t("dashboard.panel.createPanelTitleSec")}}</button> <button id="panel-add-panel" class="nz-btn nz-btn-style-light nz-btn-size-small" @click="toAdd"><i class="nz-icon nz-icon-create-square"></i>&nbsp;&nbsp;{{$t("dashboard.panel.createPanelTitleSec")}}</button>