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

Merge branch 'dev-3.2' of https://git.mesalab.cn/nezha/nezha-fronted into dev-3.3

Browse Source
This commit is contained in:
zhangyu
2022-03-30 15:17:08 +08:00
parent 9104c2502c fc0a575ea5
commit 42ae7d5dfe
24 changed files with 175 additions and 97 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
nezha-fronted/src/components/chart/chart.vue
View File

@@ -309,6 +309,7 @@ export default {
this.chartChildrenData = flag
},
resize () {
console.log(this.$refs['chart' + this.chartInfo.id])
this.$refs['chart' + this.chartInfo.id] && this.$refs['chart' + this.chartInfo.id].resize()
},
refreshLogs (params) {

5
nezha-fronted/src/components/chart/chart/chartAssetInfo.vue
View File

@@ -16,6 +16,11 @@ export default {
data () {
return {
}
},
methods: {
resize () {
}
}
}

5
nezha-fronted/src/components/chart/chart/chartEndpointInfo.vue
View File

@@ -16,6 +16,11 @@ export default {
data () {
return {
}
},
methods: {
resize () {
}
}
}

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

@@ -214,11 +214,13 @@ export default {
})
},
resize () {
setTimeout(() => {
this.getLayout().then(layout => {
this.renderGauge(layout).then(() => {
this.gaugeChartResize()
})
})
})
},
formatterFunc: function (params, ticket, callback) {
const self = this

7
nezha-fronted/src/components/chart/chart/chartGroup.vue
View File

@@ -54,9 +54,8 @@ export default {
setTimeout(() => {
this.dataList = this.dataList.map(item => {
return {
...item,
...item
// hide: item.name.indexOf(this.filter.searchName) === -1, // 搜索条件
loaded: false
}
})
}, 100)
@@ -70,9 +69,9 @@ export default {
const arr = JSON.parse(JSON.stringify(n))
this.dataList = arr.map(item => {
return {
...item,
...item
// hide: item.name.indexOf(this.filter.searchName) === -1, // 搜索条件
loaded: false
// loaded: false
}
})
})

7
nezha-fronted/src/components/chart/chart/chartNoData.vue
View File

@@ -6,6 +6,11 @@
<script>
export default {
name: 'chartNoData'
name: 'chartNoData',
methods: {
resize () {
}
}
}
</script>

3
nezha-fronted/src/components/chart/chart/chartText.vue
View File

@@ -21,6 +21,9 @@ export default {
}
},
methods: {
resize () {
}
},
watch: {
chartInfo: {

20
nezha-fronted/src/components/chart/chart/chartTimeSeries.vue
View File

@@ -98,6 +98,9 @@ export default {
chartOption.yAxis.axisLabel.formatter = this.yAxisLabelFormatter(minValue, maxValue, copies, unit, decimals)
chartOption.yAxis.minInterval = chartDataFormat.Interval(maxValue, copies, unit.type, 'min')
chartOption.yAxis.maxInterval = chartDataFormat.Interval(maxValue, copies, unit.type, 'max') * Math.ceil(chartOption.series.length / 5)
if (this.chartInfo.param.stack) {
chartOption.yAxis.maxInterval = chartOption.yAxis.maxInterval * (Math.ceil(chartOption.series.length / 5) + 1)
}
if (unit.type === 'Time') {
delete chartOption.yAxis.minInterval
delete chartOption.yAxis.maxInterval
@@ -169,7 +172,6 @@ export default {
maxValue = Math.floor(oldValue) / Math.pow(10, dot)
dot++
}
console.log(oldValue)
const copies = chartDataFormat.copies(Number(oldValue), unit.type)
return { minTime, maxTime, minValue, maxValue, copies, unit, dot }
},
@@ -210,7 +212,11 @@ export default {
let sum = 0
let flag = true
params.forEach((item, i) => {
const seriesName = item.seriesName.split('-')[0]
const nameArr = item.seriesName.split('-')
if (nameArr.length > 1) {
nameArr.splice(nameArr.length - 1, 1)
}
const seriesName = nameArr.join('-')
if (i === 0 && item.seriesName.indexOf('Previous') === -1) {
const value = bus.computeTimezone(item.data[0] * 1000)
const tData = new Date(value)
@@ -326,11 +332,19 @@ export default {
self.isStack = !self.isStack
// 改变tooltip
option.tooltip[0].formatter = self.tooltipFormatter(self.isStack)
if (!self.chartInfo.param.stack) {
option.yAxis.maxInterval = option.yAxis.maxInterval / (Math.ceil(option.series.length / 5) + 1)
} else {
option.yAxis.maxInterval = option.yAxis.maxInterval * (Math.ceil(option.series.length / 5) + 1)
}
myChart.setOption(option)
}
},
resize () {
getChart(this.chartId).resize()
console.log(213)
setTimeout(() => {
getChart(this.chartId) && getChart(this.chartId).resize()
}, 100)
}
},
mounted () {

7
nezha-fronted/src/components/chart/chart/legend.vue
View File

@@ -5,7 +5,10 @@
<div class="legend--table">
<div class="legend--table-row table-header">
<div class="legend--table-cell"></div>
<div v-for="statistics in chartInfo.param.legend.values" :key="statistics" class="legend--table-cell">{{statistics}}</div>
<div v-for="statistics in chartInfo.param.legend.values" :key="statistics" class="legend--table-cell">
<span v-if="statisticsList.find(key=>key.value === statistics)">{{$t(statisticsList.find(key=>key.value === statistics).label)}}</span>
<span v-else>--</span>
</div>
</div>
<div v-for="(item, index) in legends"
:key="index"
@@ -40,6 +43,7 @@
import lodash from 'lodash'
import { getChart } from '@/components/common/js/common'
import chartDataFormat from '@/components/charts/chartDataFormat'
import { statisticsList } from '@/components/common/js/constants'
export default {
name: 'chartLegend',
props: {
@@ -51,6 +55,7 @@ export default {
},
data () {
return {
statisticsList,
isGrey: [],
legendDefaultCount: 20, // 初始显示的legend条数
showLegends: [], // 要显示的legend；若legend数量过多，初始时这个数据里只有前20条legend

35
nezha-fronted/src/components/chart/chartList.vue
View File

@@ -47,6 +47,7 @@
:chart-info="item"
:from="from"
:time-range="timeRange"
@groupShow="groupShow"
:chart-detail-info="chartDetailInfo"
@refreshPanel="refreshPanel"
@showFullscreen="showFullscreen"
@@ -232,7 +233,7 @@ export default {
this.copyDataList = [...this.copyDataList]
// this.$refs.layout.layoutUpdate()
}
this.moveChart()
this.onScroll(this.scrollTop)
},
cleanData () {
@@ -243,11 +244,7 @@ export default {
this.onScroll(this.scrollTop)
},
moveChart () {
if (this.timer) {
clearTimeout(this.timer)
this.timer = null
}
this.timer = setTimeout(() => {
this.onScroll(this.scrollTop)
const arr = this.copyDataList.filter(item => !item.staic)
const charts = []
let weight = 0
@@ -287,7 +284,6 @@ export default {
this.$store.commit('setChartLastPosition', position)
})
}
}, 1000)
},
onScroll (scrollTop = 0, groupTop = 0) {
const self = this
@@ -298,14 +294,19 @@ export default {
this.scrollTopTimer = setTimeout(() => {
this.copyDataList.forEach(item => {
if (!this.$refs['grid-item' + item.id] || !this.$refs['grid-item' + item.id][0]) {
return;
return
}
const dom = this.$refs['grid-item' + item.id][0].$el
if (dom) {
let top = dom.style.top
top = Number(top.substring(0, top.length - 2)) + groupTop
if (item.type === 'group') {
if (item.type === 'group' && item.loaded) {
this.$refs['chart' + item.id][0] && this.$refs['chart' + item.id][0].$refs.chart && this.$refs['chart' + item.id][0].$refs.chart.$refs['chart' + item.id] && this.$refs['chart' + item.id][0].$refs.chart.$refs['chart' + item.id].$refs.chartList.onScroll(scrollTop, top)
return
}
if (item.type === 'group' && !item.loaded) {
item.loaded = true
this.$refs['chart' + item.id][0].getChartData()
}
if (item.loaded) {
return
@@ -333,6 +334,16 @@ export default {
})
}, 200)
},
resize () {
this.init()
this.copyDataList.forEach(item => {
if (item.type === 'group') {
this.$refs['chart' + item.id][0] && this.$refs['chart' + item.id][0].groupShow(item.param.collapse)
this.$refs['chart' + item.id][0] && this.$refs['chart' + item.id][0].$refs.chart && this.$refs['chart' + item.id][0].$refs.chart.$refs['chart' + item.id] && this.$refs['chart' + item.id][0].$refs.chart.$refs['chart' + item.id].$refs.chartList.resize()
}
this.$refs['chart' + item.id][0] && this.$refs['chart' + item.id][0].resize()
})
},
refreshPanel () {
bus.$emit('refreshPanel')
}
@@ -345,8 +356,12 @@ export default {
if (!this.isGroup) {
bus.$on('groupMove', this.changeGroupHeight)
this.$store.commit('setChartListId', `chartList${this.timestamp}`)
window.addEventListener('resize', this.resize)
}
},
beforeDestroy () {
window.removeEventListener('resize', this.resize)
},
watch: {
dataList: {
deep: true,
@@ -397,7 +412,9 @@ export default {
this.copyDataList = JSON.parse(JSON.stringify(tempList))
setTimeout(() => {
this.gridLayoutShow = true
if (!this.isGroup) {
this.onScroll()
}
})
setTimeout(() => {
this.firstInit = false

17
nezha-fronted/src/components/chart/chartMixin.js
View File

@@ -110,16 +110,17 @@ export default {
if (data.metric.__name__) {
legend += '}'
}
if (!legend && chartInfo.elements) {
legend = chartInfo.elements[expressionIndex].expression
}
// if (!legend && chartInfo.elements) {
// // legend = chartInfo.elements[expressionIndex].expression
// legend = ''
// }
// 处理legend别名
alias = alias + this.handleLegendAlias(legend, chartInfo.elements[expressionIndex].legend)
if (!alias) {
alias = legend
alias = chartInfo.elements[expressionIndex].expression
}
if (alias == 'Previous ') {
alias += legend
alias += chartInfo.elements[expressionIndex].expression
}
// proj_status_
const name = alias + '-' + dataIndex
@@ -146,6 +147,9 @@ export default {
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
}
const reg = new RegExp(label + '=".+?"')
let value = null
if (reg.test(legend)) {
@@ -257,7 +261,10 @@ export default {
}
},
resize () {
console.log('reszie')
setTimeout(() => {
getChart(this.chartId) && getChart(this.chartId).resize()
}, 100)
}
},
watch: {

4
nezha-fronted/src/components/chart/panelChart.vue
View File

@@ -420,7 +420,7 @@ export default {
})
},
resize () {
this.$refs.chart.resize()
this.$refs.chart && this.$refs.chart.resize()
},
refresh () {
this.getChartData(true)
@@ -532,7 +532,7 @@ export default {
timeRange: {
deep: true,
handler (n) {
this.refresh()
// this.refresh()
}
},
loading: {

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

@@ -495,7 +495,7 @@ export default {
})
break
}
case 'average': {
case 'avg': {
result = classifies.map(group => {
const groupData = group.map(t => parseFloat(t.data[1]))
const sum = eval(groupData.join('+'))

3
nezha-fronted/src/components/charts/chartDataFormat.js
View File

@@ -397,6 +397,9 @@ function asciiCompute2 (num, ascii, units, dot = 2, unitIndex = 0) {
* unit:设置的单位
* */
function timeCompute (value, unit, dot = 0) {
if (isNaN(value)) {
return `0 ${unit}`
}
if (unit == 'year') {
return `${value.toFixed(dot)} ${unit}`
}

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

@@ -1449,7 +1449,7 @@ export default {
})
break
}
case 'average': {
case 'avg': {
result = classifies.map(group => {
const groupData = group.map(t => parseFloat(t.data[1]))
const sum = eval(groupData.join('+'))

2
nezha-fronted/src/components/common/js/constants.js
View File

@@ -212,7 +212,7 @@ export const alertMessage = {
export const statisticsList = [
{ value: 'min', label: i18n.t('dashboard.panel.chartForm.statisticsVal.min') },
{ value: 'max', label: i18n.t('dashboard.panel.chartForm.statisticsVal.max') },
{ value: 'average', label: i18n.t('dashboard.panel.chartForm.statisticsVal.average') },
{ value: 'avg', label: i18n.t('dashboard.panel.chartForm.statisticsVal.average') },
{ value: 'total', label: i18n.t('dashboard.panel.chartForm.statisticsVal.total') },
{ value: 'first', label: i18n.t('dashboard.panel.chartForm.statisticsVal.first') },
{ value: 'last', label: i18n.t('dashboard.panel.chartForm.statisticsVal.last') },

10
nezha-fronted/src/components/common/js/tools.js
View File

@@ -13,6 +13,7 @@ export const clickoutside = {
let oldValue
try {
oldValue = JSON.parse(JSON.stringify(binding.value.obj))
el.__newValue__ = oldValue
} catch (e) {
}
@@ -36,8 +37,8 @@ export const clickoutside = {
return false
}
if (oldValue) {
const newValue = JSON.parse(JSON.stringify(binding.value.obj))
if (unsavedChange == 'on' && !isEqual(oldValue, newValue)) {
// const newValue = JSON.parse(JSON.stringify(binding.value.obj))
if (unsavedChange == 'on' && !isEqual(oldValue, el.__newValue__)) {
MessageBox.confirm(i18n.t('tip.confirmCancel'), {
confirmButtonText: i18n.t('tip.yes'),
cancelButtonText: i18n.t('tip.no'),
@@ -66,6 +67,9 @@ export const clickoutside = {
el.__vueClickOutside__ = documentHandler
document.addEventListener('mousedown', documentHandler)
},
update (el, binding, vnode) {
el.__newValue__ = binding.value.obj
},
unbind (el, binding) {
// 解除事件监听
document.removeEventListener('mousedown', el.__vueClickOutside__)
@@ -907,7 +911,7 @@ export function getMetricTypeValue (queryItem, type) {
const max = copy.sort((x, y) => { return parseFloat(y[1]) - parseFloat(x[1]) })[0][1]
return max
}
case 'average': {
case 'avg': {
copy = copy.map(t => parseFloat(t[1]))
const sum = eval(copy.join('+'))
const avg = sum / copy.length

2
nezha-fronted/src/components/common/language/cn.js
View File

@@ -349,7 +349,7 @@ const cn = {
statisticsVal: {
min: 'Min',
max: 'Max',
average: 'Average',
avg: 'Avg',
total: 'Total',
first: 'First',
last: 'Last',

2
nezha-fronted/src/components/common/language/en.js
View File

@@ -365,7 +365,7 @@ const en = {
statisticsVal: {
min: 'Min',
max: 'Max',
average: 'Average',
avg: 'Avg',
total: 'Total',
first: 'First',
last: 'Last',

2
nezha-fronted/src/components/common/rightBox/chart/chartConfig.vue
View File

@@ -487,7 +487,7 @@
<span @click="addColumns('')">
<i class="nz-icon nz-icon-create-square" style="font-weight: normal; font-size: 17px; cursor: pointer;"></i>
</span>
<span class="nz-icon-copy">
<span style="margin-right: 5px">
<i @click="copyColumns(index)" class="nz-icon nz-icon-override"></i>
</span>
<span class="nz-icon-minus-medium">

42
nezha-fronted/src/components/common/rightBox/chart/chartRightBox.vue
View File

@@ -457,42 +457,42 @@ export default {
if (obj.param && !obj.param.thresholds) {
obj.param.thresholds = []
}
this.editChart = obj
if (this.editChart.groupId === -1) {
this.editChart.groupId = ''
if (obj.groupId === -1) {
obj.groupId = ''
}
if (this.editChart.param) {
if (!this.editChart.param.min) {
this.editChart.param.min = 0
if (obj.param) {
if (!obj.param.min) {
obj.param.min = 0
}
if (!this.editChart.param.max) {
this.editChart.param.max = 100
if (!obj.param.max) {
obj.param.max = 100
}
if (!this.editChart.param.link) {
this.$set(this.editChart.param, 'link', '')
if (!obj.param.link) {
this.$set(obj.param, 'link', '')
}
if (!this.editChart.param.enable) {
this.editChart.param.enable = {
if (!obj.param.enable) {
obj.param.enable = {
thresholds: false,
legend: false,
valueMapping: false
}
}
// this.editChart.varType = 1
if (this.editChart.param.enable.legend && !this.editChart.param.legend) {
this.editChart.param.legend = { placement: 'bottom', values: [], show: true }
if (obj.param.enable.legend && !obj.param.legend) {
obj.param.legend = { placement: 'bottom', values: [], show: true }
}
if (this.editChart.param.datasource && !this.editChart.param.datasource[0].legend) {
this.editChart.param.datasource[0].legend = ''
if (obj.param.datasource && !obj.param.datasource[0].legend) {
obj.param.datasource[0].legend = ''
}
if (this.editChart.param.valueMapping) {
this.editChart.param.valueMapping.forEach(item => {
if (obj.param.valueMapping) {
obj.param.valueMapping.forEach(item => {
if (!item.show) {
item.show = false
}
})
}
}
this.editChart = obj
}
},
'editChart.type': {
@@ -501,6 +501,12 @@ export default {
this.editChart.groupId = ''
}
}
},
editChart: {
deep: true,
handler () {
}
}
}
}

2
nezha-fronted/src/components/common/rightBox/chart/publicConfig.js
View File

@@ -346,6 +346,7 @@ export default {
},
showMapping (index) {
this.chartConfig.param.valueMapping[index].show = !this.chartConfig.param.valueMapping[index].show
this.change()
},
mappingItemChange (index, type) {
const mapping = this.chartConfig.param.valueMapping[index]
@@ -416,6 +417,7 @@ export default {
},
showColumns (index) {
this.chartConfig.param.columns[index].show = !this.chartConfig.param.columns[index].show
this.change()
},
tagsChange (newTags) {
this.chartConfig.param.tags = newTags

2
nezha-fronted/src/components/common/rightBox/chart/systemChartConfig.vue
View File

@@ -449,7 +449,7 @@
<span @click="addColumns('')">
<i class="nz-icon nz-icon-create-square" style="font-weight: normal; font-size: 17px; cursor: pointer;"></i>
</span>
<span class="nz-icon-copy">
<span style="margin-right: 5px">
<i @click="copyColumns(index)" class="nz-icon nz-icon-override"></i>
</span>
<span class="nz-icon-minus-medium">

2
nezha-fronted/src/libs/bus.js
View File

@@ -192,7 +192,7 @@ export default new Vue({
statisticsRlt = dataArray.reduce(function (a, b) {
return b > a ? b : a
})
} else if (statistics === 'average') { // average：平均值
} else if (statistics === 'avg') { // avg：平均值
let sum = 0
dataArray.forEach((item) => {
sum = Number(sum) + Number(item)