Merge branch 'dev-3.7' of https://git.mesalab.cn/nezha/nezha-fronted into dev-3.8
This commit is contained in:
@@ -111,6 +111,47 @@ export default {
|
||||
|
||||
node.addEventListener('animationend', handleAnimationEnd, { once: true })
|
||||
})
|
||||
},
|
||||
handleLegendAlias (legend, aliasExpression, params) {
|
||||
const self = this
|
||||
const myParams = JSON.parse(JSON.stringify(params))
|
||||
myParams.$labels = JSON.parse(JSON.stringify(params))
|
||||
myParams.$value = myParams.value
|
||||
if (/\{\{.+\}\}/.test(aliasExpression)) {
|
||||
const labelValue = aliasExpression.replace(/(\{\{.+?\}\})/g, function (i) {
|
||||
const label = i.substr(i.indexOf('{{') + 2, i.indexOf('}}') - i.indexOf('{{') - 2)
|
||||
if (!legend) {
|
||||
return label
|
||||
}
|
||||
let value = null
|
||||
if (params && self.$lodash.get(myParams, label)) {
|
||||
value = self.$lodash.get(myParams, label)
|
||||
}
|
||||
if (label) {
|
||||
const reg = new RegExp(label + '=".+?"', 'g')
|
||||
if (reg.test(legend)) {
|
||||
const ans = legend.match(reg)
|
||||
let find = ''
|
||||
ans.forEach(item => {
|
||||
const index = legend.indexOf(item)
|
||||
if (legend[index - 1] !== '_') {
|
||||
find = item
|
||||
}
|
||||
})
|
||||
value = find.substr(find.indexOf('"') + 1, find.lastIndexOf('"') - find.indexOf('"') - 1)
|
||||
}
|
||||
}
|
||||
return value || ''
|
||||
})
|
||||
return labelValue
|
||||
} else {
|
||||
if (!aliasExpression) {
|
||||
return legend
|
||||
// let result =legend.substr(legend.indexOf('"') + 1,legend.lastIndexOf('"') - legend.indexOf('"') - 1);
|
||||
// return result
|
||||
}
|
||||
return aliasExpression
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -354,7 +354,9 @@ export default {
|
||||
this.chartParams = {
|
||||
...pen.data.tooltip,
|
||||
unit: this.params.unit,
|
||||
statistic: this.params.statistic
|
||||
statistic: this.params.statistic,
|
||||
legend: pen.data.legend,
|
||||
parent: pen.data.parent
|
||||
}
|
||||
this.timer3 = setTimeout(() => {
|
||||
let ePosition = window.ePosition
|
||||
|
||||
@@ -97,47 +97,6 @@ export default {
|
||||
})
|
||||
})
|
||||
},
|
||||
handleLegendAlias (legend, aliasExpression, params) {
|
||||
const self = this
|
||||
const myParams = JSON.parse(JSON.stringify(params))
|
||||
myParams.$labels = JSON.parse(JSON.stringify(params))
|
||||
myParams.$value = myParams.value
|
||||
if (/\{\{.+\}\}/.test(aliasExpression)) {
|
||||
const labelValue = aliasExpression.replace(/(\{\{.+?\}\})/g, function (i) {
|
||||
const label = i.substr(i.indexOf('{{') + 2, i.indexOf('}}') - i.indexOf('{{') - 2)
|
||||
if (!legend) {
|
||||
return label
|
||||
}
|
||||
let value = null
|
||||
if (params && self.$lodash.get(myParams, label)) {
|
||||
value = self.$lodash.get(myParams, label)
|
||||
}
|
||||
if (label) {
|
||||
const reg = new RegExp(label + '=".+?"', 'g')
|
||||
if (reg.test(legend)) {
|
||||
const ans = legend.match(reg)
|
||||
let find = ''
|
||||
ans.forEach(item => {
|
||||
const index = legend.indexOf(item)
|
||||
if (legend[index - 1] !== '_') {
|
||||
find = item
|
||||
}
|
||||
})
|
||||
value = find.substr(find.indexOf('"') + 1, find.lastIndexOf('"') - find.indexOf('"') - 1)
|
||||
}
|
||||
}
|
||||
return value || ''
|
||||
})
|
||||
return labelValue
|
||||
} else {
|
||||
if (!aliasExpression) {
|
||||
return legend
|
||||
// let result =legend.substr(legend.indexOf('"') + 1,legend.lastIndexOf('"') - legend.indexOf('"') - 1);
|
||||
// return result
|
||||
}
|
||||
return aliasExpression
|
||||
}
|
||||
},
|
||||
clacTopoData (data, queryValues) { // 主要处理 属性为原始属性 处理动画属性对原始属性的影响
|
||||
return new Promise(resolve => { // 处理加载数据
|
||||
if (!data) {
|
||||
|
||||
@@ -789,22 +789,11 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- valueMapping -->
|
||||
<!--source-->
|
||||
<div class="form-row-title">
|
||||
{{$t('dashboard.dashboard.chartForm.valueMapping')}}
|
||||
<span>
|
||||
<el-switch
|
||||
v-model="pen.data.enable.valueMapping"
|
||||
:active-value="true"
|
||||
:inactive-value="false"
|
||||
@change="change('data.enable.valueMapping')"
|
||||
></el-switch>
|
||||
<i class="nz-icon nz-icon-arrow-down" :class="elements.valueMapping&& pen.data.enable.valueMapping?'':'is-rotate'" @click="updateShow('valueMapping')"/>
|
||||
</span>
|
||||
{{$t('dashboard.dashboard.chartForm.datasource')}}
|
||||
</div>
|
||||
<transition name="el-zoom-in-top">
|
||||
<div class="el-form" v-show="elements.valueMapping && pen.data.enable.valueMapping">
|
||||
<div class="el-form">
|
||||
<div class="form-row-content">
|
||||
<div class="form-row-item form-row-item-full">
|
||||
<div class="form-row-key">
|
||||
@@ -823,6 +812,25 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- valueMapping -->
|
||||
<div class="form-row-title">
|
||||
{{$t('dashboard.dashboard.chartForm.valueMapping')}}
|
||||
<span>
|
||||
<el-switch
|
||||
v-model="pen.data.enable.valueMapping"
|
||||
:active-value="true"
|
||||
:inactive-value="false"
|
||||
@change="change('data.enable.valueMapping')"
|
||||
></el-switch>
|
||||
<i class="nz-icon nz-icon-arrow-down" :class="elements.valueMapping&& pen.data.enable.valueMapping?'':'is-rotate'" @click="updateShow('valueMapping')"/>
|
||||
</span>
|
||||
</div>
|
||||
<transition name="el-zoom-in-top">
|
||||
<div class="el-form" v-show="elements.valueMapping && pen.data.enable.valueMapping">
|
||||
<div class="form-row-content">
|
||||
<div class="form-row-item form-row-item-full chart-config">
|
||||
<el-row class="el-form">
|
||||
<draggable
|
||||
|
||||
@@ -1,11 +1,11 @@
|
||||
<template>
|
||||
<div class="tooltip-box" style="width: 400px;height: 300px;display: flex;flex-direction: column">
|
||||
<div v-if="params.titleShow && params.title" style="margin-bottom: 5px" class="tooltip-box-title">{{params.title}}</div>
|
||||
<div v-if="params.titleShow && params.title" style="margin-bottom: 5px" class="tooltip-box-title">{{ title || params.title}}</div>
|
||||
|
||||
<div
|
||||
v-if="params.chartType === 'text'"
|
||||
>
|
||||
{{params.content}}
|
||||
{{content || params.content}}
|
||||
</div>
|
||||
<panelChart
|
||||
v-else
|
||||
@@ -39,7 +39,10 @@ export default {
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
chartInfo: { ...defaultLineData, loaded: false }
|
||||
chartInfo: { ...defaultLineData, loaded: false },
|
||||
dataSource: {},
|
||||
title: '',
|
||||
content: ''
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
@@ -56,7 +59,13 @@ export default {
|
||||
this.chartInfo.id = this.meta2dId + 'meta2DTooltip'
|
||||
const chartData = []
|
||||
const elements = []
|
||||
const obj = {}
|
||||
const source = this.queryValues.find(query => query.name === this.params.legend && query.parent === this.params.parent)
|
||||
if (source) {
|
||||
this.dataSource = source
|
||||
console.log(this.params.title, this.dataSource.elements.expression, this.dataSource.metric)
|
||||
this.title = this.handleLegendAlias(this.params.title, this.params.title, this.dataSource.metric) || this.params.title
|
||||
this.content = this.handleLegendAlias(this.params.content, this.params.content, this.dataSource.metric) || this.params.content
|
||||
}
|
||||
this.params.legends.forEach(item => {
|
||||
const findItem = this.queryValues.find(query => query.name === item.legend && query.parent === item.parent)
|
||||
// if (findItem) {
|
||||
@@ -94,6 +103,8 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user