Merge branch 'dev-3.9' of https://git.mesalab.cn/nezha/nezha-fronted into dev-3.10-uPlot

This commit is contained in:
zhangyu
2023-11-02 09:40:09 +08:00
25 changed files with 148 additions and 120 deletions

View File

@@ -22765,9 +22765,9 @@
"integrity": "sha512-NB6Dk1A9xgQPMoGqC5CVXn123gWyte215ONT5Pp5a0yt4nlEoO1ZWeCwpncaekPHXO60i47ihFnZPiRPjRMq4Q==" "integrity": "sha512-NB6Dk1A9xgQPMoGqC5CVXn123gWyte215ONT5Pp5a0yt4nlEoO1ZWeCwpncaekPHXO60i47ihFnZPiRPjRMq4Q=="
}, },
"tinycolor2": { "tinycolor2": {
"version": "1.4.2", "version": "1.6.0",
"resolved": "https://registry.npmjs.org/tinycolor2/-/tinycolor2-1.4.2.tgz", "resolved": "https://registry.npmjs.org/tinycolor2/-/tinycolor2-1.6.0.tgz",
"integrity": "sha512-vJhccZPs965sV/L2sU4oRQVAos0pQXwsvTLkWYdqJ+a8Q5kPFzJTuOFwy7UniPli44NKQGAglksjvOcpo95aZA==" "integrity": "sha512-XPaBkWQJdsf3pLKJV9p4qN/S+fm2Oj8AIPo1BTUhg5oxkvm9+SVEGFdhyOz7tTdUTfvxMiAs4sp6/eZO2Ew+pw=="
}, },
"tinyqueue": { "tinyqueue": {
"version": "2.0.3", "version": "2.0.3",

View File

@@ -92,6 +92,7 @@
"showdown": "^2.1.0", "showdown": "^2.1.0",
"spark-md5": "^3.0.2", "spark-md5": "^3.0.2",
"speed-measure-webpack-plugin": "^1.5.0", "speed-measure-webpack-plugin": "^1.5.0",
"tinycolor2": "^1.6.0",
"uplot": "^1.6.26", "uplot": "^1.6.26",
"uplot-vue": "^1.1.5", "uplot-vue": "^1.1.5",
"v-selectpage": "^2.1.4", "v-selectpage": "^2.1.4",

View File

@@ -746,3 +746,23 @@ i.nz-icon-override{
input::placeholder{ input::placeholder{
text-transform:capitalize; text-transform:capitalize;
} }
.vue-tags-input {
.ti-tag.ti-valid {
max-width: 100%;
.ti-content {
max-width: 90%;
flex-shrink: 0;
.ti-tag-center {
max-width: 100%;
flex-shrink: 0;
> span {
max-width: 100%;
display: inline-block;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
}
}
}
}

View File

@@ -143,7 +143,7 @@
overflow: hidden; overflow: hidden;
white-space: nowrap; white-space: nowrap;
font-size: 18px; font-size: 18px;
color: #333; color: $--color-text-primary;
font-weight: 700; font-weight: 700;
} }
.chart-header__tools { .chart-header__tools {
@@ -556,6 +556,10 @@
flex-grow: 1; flex-grow: 1;
position: relative; position: relative;
border: 1px solid $--background-color-empty; border: 1px solid $--background-color-empty;
.stat-text{
text-align: center;
line-height: 1.2;
}
.sparkline{ .sparkline{
width: 100%; width: 100%;
height: 40%; height: 40%;

View File

@@ -233,7 +233,7 @@
.bottom-box__top .my-loading-box { .bottom-box__top .my-loading-box {
height: calc(100% + 20px) !important; height: calc(100% + 20px) !important;
} }
.my-loading-parent--relative{ .my-loading-parent--relative:not(.panel-chart){
height: calc(100% - 20px) !important; height: calc(100% - 20px) !important;
} }
} }

View File

@@ -352,3 +352,10 @@
.el-date-range-picker__content.el-date-range-picker__content__only{ .el-date-range-picker__content.el-date-range-picker__content__only{
width: 100%; width: 100%;
} }
.nz-time-box.nz-dropdown {
width: 64px;
.dropdown-content {
height: 32px;
line-height: 32px;
}
}

View File

@@ -1,6 +1,6 @@
.query-prompt-box { .query-prompt-box {
//width: calc(100% - 10px); //width: calc(100% - 10px);
height: 400px; height: 440px;
background: $--background-color-empty; background: $--background-color-empty;
box-shadow: 0px 0px 21px 4px $--dropdown-menu-box-shadow-color; box-shadow: 0px 0px 21px 4px $--dropdown-menu-box-shadow-color;
border-radius: 2px; border-radius: 2px;
@@ -9,7 +9,7 @@
//left: 5px; //left: 5px;
transform: unset; transform: unset;
z-index: 11; z-index: 11;
max-height: 400px; max-height: 440px;
font-size: 14px; font-size: 14px;
.explore-history-box-header { .explore-history-box-header {
padding-left: 20px; padding-left: 20px;
@@ -32,6 +32,7 @@
} }
.query-prompt-log-content { .query-prompt-log-content {
height: 220px; height: 220px;
flex-shrink: 0;
border: 1px solid $--border-color-light; border: 1px solid $--border-color-light;
border-radius: 2px; border-radius: 2px;
display: flex; display: flex;

View File

@@ -240,8 +240,8 @@ export default {
const descending = this.operations.descending const descending = this.operations.descending
const params = { const params = {
logql: this.chartInfo.elements.map(item => item.expression), logql: this.chartInfo.elements.map(item => item.expression),
start: this.$stringTimeParseToUnix(this.filterTime[0]), start: this.momentStrToTimestamp(this.filterTime[0]),
end: this.$stringTimeParseToUnix(this.filterTime[1]), end: this.momentStrToTimestamp(this.filterTime[1]),
direction: descending ? 'backward' : 'forward', direction: descending ? 'backward' : 'forward',
limit limit
} }

View File

@@ -16,43 +16,52 @@
background:item.mapping ? item.mapping.color.bac : (statData.length===1 ? '' : colorList[index]), background:item.mapping ? item.mapping.color.bac : (statData.length===1 ? '' : colorList[index]),
height:item.height+'px', height:item.height+'px',
width:item.width + 'px', width:item.width + 'px',
fontSize: item.fontSize + 'px',
}" }"
> >
<div style="maxWidth:100%;z-index: 10;"> <div style="maxWidth:100%;z-index: 10;">
<!-- all --> <!-- all -->
<template v-if="chartInfo.param.text==='all'"> <template v-if="chartInfo.param.text==='all'">
<div v-if="item.mapping" :style="{color:item.mapping.color.text}"> <div v-if="item.mapping" :style="{color:item.mapping.color.text}">
<p style="white-space: nowrap;">{{item.legend}}</p> <p class="stat-text" :style="{fontSize: item.titleFontSize + 'px'}">{{item.legend}}</p>
<template v-if="item.mapping && item.mapping.icon"> <p class="stat-text" :style="{fontSize: item.valueFontSize + 'px'}">
<i :class="item.mapping.icon" :style="{color: item.mapping.color.icon,fontSize:'1em'}"></i> <template v-if="item.mapping && item.mapping.icon">
</template> <i :class="item.mapping.icon" :style="{color: item.mapping.color.icon,fontSize:'1em'}"></i>
<span style="white-space: nowrap;">{{handleDisplay(item.mapping.display, { ...item.label, value: item.showValue })}}</span> </template>
<span>{{handleDisplay(item.mapping.display, { ...item.label, value: item.showValue })}}</span>
</p>
</div> </div>
<div v-else> <div v-else>
<p style="white-space: nowrap;">{{item.legend}}</p> <p class="stat-text" :style="{fontSize: item.titleFontSize + 'px'}">{{item.legend}}</p>
<span style="white-space: nowrap;">{{item.showValue}}</span> <p class="stat-text" :style="{fontSize: item.valueFontSize + 'px'}">{{item.showValue}}</p>
</div> </div>
</template> </template>
<!-- legend --> <!-- legend -->
<template v-if="chartInfo.param.text==='legend'"> <template v-if="chartInfo.param.text==='legend'">
<div v-if="item.mapping" :style="{color:item.mapping.color.text}"> <div v-if="item.mapping" :style="{color:item.mapping.color.text}">
<template v-if="item.mapping && item.mapping.icon"> <p class="stat-text" :style="{fontSize: item.valueFontSize + 'px'}">
<i :class="item.mapping.icon" :style="{color: item.mapping.color.icon,fontSize:'1em'}"></i> <template v-if="item.mapping && item.mapping.icon">
</template> <i :class="item.mapping.icon" :style="{color: item.mapping.color.icon,fontSize:'1em'}"></i>
<span style="white-space: nowrap;">{{item.legend}}</span> </template>
<span>{{item.legend}}</span>
</p>
</div>
<div v-else>
<p class="stat-text" :style="{fontSize: item.valueFontSize + 'px'}">{{item.legend}}</p>
</div> </div>
<div v-else style="white-space: nowrap;">{{item.legend}}</div>
</template> </template>
<!-- value --> <!-- value -->
<template v-if="chartInfo.param.text==='value'|| !chartInfo.param.text"> <template v-if="chartInfo.param.text==='value'|| !chartInfo.param.text">
<div v-if="item.mapping" :style="{color:item.mapping.color.text}"> <div v-if="item.mapping" :style="{color:item.mapping.color.text}">
<template v-if="item.mapping && item.mapping.icon"> <p class="stat-text" :style="{fontSize: item.valueFontSize + 'px'}">
<i :class="item.mapping.icon" :style="{color: item.mapping.color.icon,fontSize:'1em'}"></i> <template v-if="item.mapping && item.mapping.icon">
</template> <i :class="item.mapping.icon" :style="{color: item.mapping.color.icon,fontSize:'1em'}"></i>
<span style="white-space: nowrap;">{{handleDisplay(item.mapping.display, { ...item.label, value: item.showValue })}}</span> </template>
<span>{{handleDisplay(item.mapping.display, { ...item.label, value: item.showValue })}}</span>
</p>
</div>
<div v-else style="white-space: nowrap;">
<p class="stat-text" :style="{fontSize: item.valueFontSize + 'px'}">{{item.showValue}}</p>
</div> </div>
<div v-else style="white-space: nowrap;">{{item.showValue}}</div>
</template> </template>
<!-- none --> <!-- none -->
<template v-if="chartInfo.param.text==='none'"></template> <template v-if="chartInfo.param.text==='none'"></template>
@@ -118,7 +127,7 @@
</div> </div>
</div> </div>
</div> </div>
<span class="temp-dom--12" ref="temp-dom"></span> <span class="temp-dom" ref="temp-dom"></span>
</div> </div>
</template> </template>
@@ -133,6 +142,7 @@ import { initColor } from '@/components/chart/chart/tools'
import * as echarts from 'echarts' import * as echarts from 'echarts'
import chartSparklineOption from './options/chartSparkline' import chartSparklineOption from './options/chartSparkline'
import lodash from 'lodash' import lodash from 'lodash'
import tinycolor from 'tinycolor2'
export default { export default {
name: 'chart-stat', name: 'chart-stat',
mixins: [chartMixin, chartFormat], mixins: [chartMixin, chartFormat],
@@ -291,7 +301,6 @@ export default {
}) })
}, },
renderStat (layout) { renderStat (layout) {
let isDouble = false
const width = this.boxWidth / layout.col const width = this.boxWidth / layout.col
const height = this.boxHeight / layout.row const height = this.boxHeight / layout.row
const integer = Math.floor(this.statData.length / layout.col) const integer = Math.floor(this.statData.length / layout.col)
@@ -305,86 +314,62 @@ export default {
} else { } else {
item.width = width item.width = width
} }
let font = '' // 获取显示的字体
let display = '' let display = ''
if (item.mapping) { if (item.mapping) {
display = this.handleDisplay(item.mapping.display, { ...item.label, value: item.showValue }) display = this.handleDisplay(item.mapping.display, { ...item.label, value: item.showValue })
} }
let titleFont = ''
let valueFont = ''
let titleFontSize = ''
let valueFontSize = ''
const padding = 10
switch (this.chartInfo.param.text) { switch (this.chartInfo.param.text) {
case 'all': case 'all':
titleFont = item.legend
if (item.mapping) { if (item.mapping) {
isDouble = true valueFont = display
if (item.legend.length > item.showValue.length + 2) { if (item.mapping.icon) {
font = item.legend valueFont += 'AA'
} else {
font = display
if (item.mapping.icon) {
font += 'AA'
}
} }
} else { } else {
isDouble = true valueFont = item.showValue
if (item.legend.length > item.showValue.length) {
font = item.legend
} else {
font = item.showValue
}
} }
titleFontSize = this.calculateFontSize(titleFont, (item.width - padding * 2), (item.height - padding * 2) * 0.4, 30)
valueFontSize = this.calculateFontSize(valueFont, (item.width - padding * 2), (item.height - padding * 2) * 0.4)
titleFontSize = Math.min(valueFontSize * 0.7, titleFontSize)
break break
case 'legend': case 'legend':
titleFont = item.legend
if (item.mapping) { if (item.mapping) {
isDouble = true if (item.mapping.icon) {
if (item.legend.length > item.showValue.length + 2) { titleFont += 'AA'
font = item.legend
} else {
font = display
if (item.mapping.icon) {
font += 'AA'
}
} }
} else {
font = item.legend
} }
valueFontSize = this.calculateFontSize(titleFont, (item.width - padding * 2), (item.height - padding * 2) * 0.4)
break break
case 'none': case 'none':
font = '' titleFontSize = ''
valueFontSize = ''
break break
case 'value': case 'value':
default: default:
if (item.mapping) { if (item.mapping) {
font = display valueFont = display
if (item.mapping.icon) { if (item.mapping.icon) {
font += 'AA' valueFont += 'AA'
} }
} else { } else {
font = item.showValue valueFont = item.showValue
} }
valueFontSize = this.calculateFontSize(valueFont, (item.width - padding * 2), (item.height - padding * 2) * 0.4)
break break
} }
const el = this.$refs['temp-dom'] item.titleFontSize = titleFontSize
el.innerText = font item.valueFontSize = valueFontSize
const elWidth = el.offsetWidth
const elHeight = el.offsetHeight
const dimension = Math.min(item.width, item.height * 1.3)
const fontScale = parseInt('70%', 10) / 100
let fontSize = Math.min(dimension / 5, 100) * fontScale
let scale = item.width / elWidth
if (scale * elHeight > item.height) {
scale = item.height / elHeight
}
if (isDouble) {
if (scale * elHeight * 2.5 > item.height) {
scale = item.height / elHeight * 2.5
}
}
item.scale = scale < 1 ? 1 : parseFloat(scale)
fontSize = fontSize > 12 ? fontSize : this.minFontSzie
item.fontSize = fontSize
if (fontSize > 36) { if (item.valueFontSize > 36) {
item.comparisonFont = 16 item.comparisonFont = 16
} else if (fontSize > 24) { } else if (item.valueFontSize > 24) {
item.comparisonFont = 14 item.comparisonFont = 14
} else { } else {
item.comparisonFont = 12 item.comparisonFont = 12
@@ -392,28 +377,43 @@ export default {
}) })
this.isInit = false this.isInit = false
}, },
calculateFontSize (text, width, height, maxSize, lineHeight = 1.2) {
const el = this.$refs['temp-dom']
el.innerText = text
const elWidth = el.offsetWidth
const fontSizeBasedOnWidth = (width / (elWidth + 2)) * 14
const fontSizeBasedOnHeight = height / lineHeight
const optimalSize = Math.min(fontSizeBasedOnHeight, fontSizeBasedOnWidth)
return Math.min(optimalSize, maxSize || optimalSize)
},
// 绘制图表 // 绘制图表
drawChart () { drawChart () {
this.statData.forEach((item, index) => { this.statData.forEach((item, index) => {
const chart = this.sparkline[index] ? this.sparkline[index] : echarts.init(document.getElementById(`chart-canvas-${this.chartId}-${index}`)) const chart = this.sparkline[index] ? this.sparkline[index] : echarts.init(document.getElementById(`chart-canvas-${this.chartId}-${index}`))
const chartOption = lodash.cloneDeep(chartSparklineOption) const chartOption = lodash.cloneDeep(chartSparklineOption)
// sparkline 颜色和 字体颜色 保持一致
const theme = localStorage.getItem(`nz-user-${localStorage.getItem('nz-user-id')}-theme`) || 'light' // sparkline 颜色根据背景色计算
let color = theme === 'light' ? '#666666' : '#BEBEBE' const color = item.mapping ? item.mapping.color.bac : this.colorList[index]
if (item.mapping) { const lineColor = tinycolor(color).brighten(40).toRgbString()
color = item.mapping.color.text let areaColor = 'rgba(255,255,255,0.4)'
if (this.statData.length === 1 && !item.mapping) {
areaColor = tinycolor(color).setAlpha(0.2).toRgbString()
} }
chartOption.series = [{ chartOption.series = [{
...chartOption.series[0], ...chartOption.series[0],
data: item.data, data: item.data,
lineStyle: { lineStyle: {
color width: 1,
color: lineColor
} }
}] }]
if (this.chartInfo.param.sparklineMode === 'area') { if (this.chartInfo.param.sparklineMode === 'area') {
chartOption.series[0].areaStyle = { chartOption.series[0].areaStyle = {
color: color, color: areaColor
opacity: 0.1
} }
} }
chartOption.yAxis.max = this.maxValue chartOption.yAxis.max = this.maxValue

View File

@@ -303,6 +303,7 @@ export default {
oldValue: '' oldValue: ''
} }
const display = this.globalVariablesReplace(column.display) const display = this.globalVariablesReplace(column.display)
console.log(column, display, /\{\{.+\}\}/.test(display), params)
if (/\{\{.+\}\}/.test(display)) { if (/\{\{.+\}\}/.test(display)) {
const labelValue = display.replace(/(\{\{.+?\}\})/g, function (i) { const labelValue = display.replace(/(\{\{.+?\}\})/g, function (i) {
const label = i.substr(i.indexOf('{{') + 2, i.indexOf('}}') - i.indexOf('{{') - 2) const label = i.substr(i.indexOf('{{') + 2, i.indexOf('}}') - i.indexOf('{{') - 2)
@@ -312,7 +313,8 @@ export default {
if (label.indexOf('$value') !== -1) { if (label.indexOf('$value') !== -1) {
value = chartDataFormat.getUnit(column.unit ? column.unit : 2).compute(value, null, -1, 2) value = chartDataFormat.getUnit(column.unit ? column.unit : 2).compute(value, null, -1, 2)
} }
if (!((typeof value) == 'string' && value.constructor == String)) { console.log(value)
if (!((typeof value) == 'string' && value.constructor == String) && isNaN(value)) {
let legend = '' let legend = ''
if (value.__name__) { if (value.__name__) {
legend += `${value.__name__}{` legend += `${value.__name__}{`
@@ -339,7 +341,7 @@ export default {
let value = null let value = null
if (lodash.get(params, label)) { if (lodash.get(params, label)) {
value = lodash.get(params, label) value = lodash.get(params, label)
if (!((typeof value) == 'string' && value.constructor == String)) { if (!((typeof value) == 'string' && value.constructor == String) && isNaN(value)) {
let legend = '' let legend = ''
if (value.__name__) { if (value.__name__) {
legend += `${value.__name__}{` legend += `${value.__name__}{`
@@ -361,6 +363,7 @@ export default {
} }
return value || '' return value || ''
}) })
console.log(labelValue)
obj[column.title + 'display'] = { obj[column.title + 'display'] = {
display: labelValue, display: labelValue,
oldValue: oldLabelValue oldValue: oldLabelValue
@@ -394,7 +397,7 @@ export default {
if (label.indexOf('$value') !== -1) { if (label.indexOf('$value') !== -1) {
value = chartDataFormat.getUnit(col.unit ? col.unit : 2).compute(value, null, -1, 2) value = chartDataFormat.getUnit(col.unit ? col.unit : 2).compute(value, null, -1, 2)
} }
if (!((typeof value) == 'string' && value.constructor == String)) { if (!((typeof value) == 'string' && value.constructor == String) && isNaN(value)) {
let legend = '' let legend = ''
if (value.__name__) { if (value.__name__) {
legend += `${value.__name__}{` legend += `${value.__name__}{`

View File

@@ -271,11 +271,11 @@ export default {
case 'logs': { case 'logs': {
if (this.from === fromRoute.chartTemp || this.from === fromRoute.dashboardTemp || this.from === fromRoute.integration) { if (this.from === fromRoute.chartTemp || this.from === fromRoute.dashboardTemp || this.from === fromRoute.integration) {
setTimeout(() => { setTimeout(() => {
this.chartData = [chartTempData.data.result] this.chartData = []
this.chartData.forEach(item => { elements.forEach(item => {
item.forEach(children => { const data = this.$lodash.cloneDeep(chartTempData.data.result)
children.elements = elements[0] data[0].elements = item
}) this.chartData.push(data)
}) })
this.loading = false this.loading = false
}, 100) }, 100)

View File

@@ -19,7 +19,7 @@
<el-select v-model="state" class="margin-r-10" size="small" value-key="value" :disabled="from === fromRoute.alertSilence" @change="getTableData" popper-class="right-box-select-top right-public-box-dropdown-top" style="width: 110px"> <el-select v-model="state" class="margin-r-10" size="small" value-key="value" :disabled="from === fromRoute.alertSilence" @change="getTableData" popper-class="right-box-select-top right-public-box-dropdown-top" style="width: 110px">
<el-option v-for="item in stateOptions" :key="item.value" :label="$t(item.label)" :value="item.value"></el-option> <el-option v-for="item in stateOptions" :key="item.value" :label="$t(item.label)" :value="item.value"></el-option>
</el-select> </el-select>
<pick-time ref="pickTime" v-model="searchTimeHeader" :default-pick="defaultPick" :refresh-data-func="dateChange" :show-empty="true" :use-chart-unit="false" :use-refresh="false" :sign="sign"></pick-time> <pick-time ref="pickTime" v-model="searchTimeHeader" :default-pick="defaultPick" :refresh-data-func="dateChange" :show-empty="true" :use-chart-unit="false" :use-refresh="true" :sign="sign"></pick-time>
</template> </template>
<template v-slot> <template v-slot>
<alertMessageTable <alertMessageTable

View File

@@ -103,8 +103,8 @@ export default {
exportLog ({ limit, descending }) { exportLog ({ limit, descending }) {
const params = { const params = {
logql: this.expressions, logql: this.expressions,
start: this.$stringTimeParseToUnix(bus.formateTimeToTime(this.filterTime[0])), start: this.momentStrToTimestamp(this.filterTime[0]),
end: this.$stringTimeParseToUnix(bus.formateTimeToTime(this.filterTime[1])), end: this.momentStrToTimestamp(this.filterTime[1]),
direction: descending ? 'backward' : 'forward', direction: descending ? 'backward' : 'forward',
limit limit
} }

View File

@@ -363,11 +363,15 @@ export const chart = {
export const intervalList = [ export const intervalList = [
{ value: 0, label: i18n.t('dashboard.dashboard.chartForm.lockList.off') }, { value: 0, label: i18n.t('dashboard.dashboard.chartForm.lockList.off') },
{ value: 5, label: '5s' },
{ value: 10, label: '10s' },
{ value: 30, label: '30s' }, { value: 30, label: '30s' },
{ value: 60, label: '1m' }, { value: 60, label: '1m' },
{ value: 300, label: '5m' }, { value: 300, label: '5m' },
{ value: 900, label: '15m' }, { value: 900, label: '15m' },
{ value: 1800, label: '30m' } { value: 1800, label: '30m' },
// { value: 3600, label: '1h' },
// { value: 7200, label: '2h' }
] ]
export const setting = { export const setting = {

View File

@@ -12,7 +12,7 @@
<span class="select-refresh-time-label" v-if="interval">{{interLabel}}</span> <span class="select-refresh-time-label" v-if="interval">{{interLabel}}</span>
<i class="nz-icon nz-icon-arrow-down" style="font-size: 12px;"></i> <i class="nz-icon nz-icon-arrow-down" style="font-size: 12px;"></i>
<transition name="el-zoom-in-top"> <transition name="el-zoom-in-top">
<ul v-show="dropdownShow" class="el-dropdown-menu el-popper el-dropdown-menu--mini nz-dropdown popper-z-index" v-clickoutside="dropdownHandler"> <ul v-show="dropdownShow" class="el-dropdown-menu el-popper el-dropdown-menu--mini nz-dropdown popper-z-index nz-time-box" v-clickoutside="dropdownHandler">
<li v-for="i in $CONSTANTS.intervalList" :key="i.value + i.label" :style="{color:interval === i.value || interval.value === i.value ? theme.themeColor : ''}" class="el-dropdown-menu__item dropdown-content" @click="selectInterval(i,true)"> <li v-for="i in $CONSTANTS.intervalList" :key="i.value + i.label" :style="{color:interval === i.value || interval.value === i.value ? theme.themeColor : ''}" class="el-dropdown-menu__item dropdown-content" @click="selectInterval(i,true)">
{{$t(i.label)}} {{$t(i.label)}}
</li> </li>

View File

@@ -216,7 +216,6 @@
> >
<vue-tags-input <vue-tags-input
v-model="tag" v-model="tag"
:maxlength="32"
:placeholder="$t('tagsInput.placeholder')" :placeholder="$t('tagsInput.placeholder')"
:tags="chartConfig.param.tags" :tags="chartConfig.param.tags"
@tags-changed="(newTags)=>{tagsChange(newTags)}" @tags-changed="(newTags)=>{tagsChange(newTags)}"

View File

@@ -188,7 +188,6 @@
> >
<vue-tags-input <vue-tags-input
v-model="tag" v-model="tag"
:maxlength="32"
:placeholder="$t('tagsInput.placeholder')" :placeholder="$t('tagsInput.placeholder')"
:tags="chartConfig.param.tags" :tags="chartConfig.param.tags"
@tags-changed="(newTags)=>{tagsChange(newTags)}" @tags-changed="(newTags)=>{tagsChange(newTags)}"

View File

@@ -236,7 +236,6 @@
<el-form-item :prop="'paramObj.' + index + '.value'" class="param-box-row-value"> <el-form-item :prop="'paramObj.' + index + '.value'" class="param-box-row-value">
<vue-tags-input <vue-tags-input
v-model="item.tags" v-model="item.tags"
:maxlength="32"
:placeholder="$t('tagsInput.placeholder')" :placeholder="$t('tagsInput.placeholder')"
:tags="item.value" :tags="item.value"
@tags-changed="(newTags)=>{tagsChange(newTags, index)}" @tags-changed="(newTags)=>{tagsChange(newTags, index)}"
@@ -296,7 +295,6 @@
]"> ]">
<vue-tags-input <vue-tags-input
v-model="item.tags" v-model="item.tags"
:maxlength="32"
ref="relabelTag" ref="relabelTag"
tabindex="9999" tabindex="9999"
:placeholder="$t('tagsInput.placeholder')" :placeholder="$t('tagsInput.placeholder')"
@@ -467,7 +465,6 @@
> >
<vue-tags-input <vue-tags-input
v-model="item.namespaces.tags" v-model="item.namespaces.tags"
:maxlength="32"
:placeholder="$t('tagsInput.placeholder')" :placeholder="$t('tagsInput.placeholder')"
:tags="item.namespaces.names" :tags="item.namespaces.names"
@tags-changed="(newTags)=>{logsTagsChange(newTags,item)}" @tags-changed="(newTags)=>{logsTagsChange(newTags,item)}"
@@ -499,7 +496,6 @@
]"> ]">
<vue-tags-input <vue-tags-input
v-model="subItem.tags" v-model="subItem.tags"
:maxlength="32"
:ref="'logsRelabelTag'+index+subIndex" :ref="'logsRelabelTag'+index+subIndex"
tabindex="9999" tabindex="9999"
:placeholder="$t('tagsInput.placeholder')" :placeholder="$t('tagsInput.placeholder')"

View File

@@ -187,7 +187,6 @@
<el-form-item :prop="'paramObj.' + index + '.value'" class="param-box-row-value"> <el-form-item :prop="'paramObj.' + index + '.value'" class="param-box-row-value">
<vue-tags-input <vue-tags-input
v-model="item.tags" v-model="item.tags"
:maxlength="32"
:placeholder="$t('tagsInput.placeholder')" :placeholder="$t('tagsInput.placeholder')"
:tags="item.value" :tags="item.value"
@tags-changed="(newTags)=>{tagsChange(newTags, index)}" @tags-changed="(newTags)=>{tagsChange(newTags, index)}"
@@ -247,7 +246,6 @@
]"> ]">
<vue-tags-input <vue-tags-input
v-model="item.tags" v-model="item.tags"
:maxlength="32"
ref="relabelTag" ref="relabelTag"
tabindex="9999" tabindex="9999"
:placeholder="$t('tagsInput.placeholder')" :placeholder="$t('tagsInput.placeholder')"
@@ -420,7 +418,6 @@
> >
<vue-tags-input <vue-tags-input
v-model="item.namespaces.tags" v-model="item.namespaces.tags"
:maxlength="32"
:placeholder="$t('tagsInput.placeholder')" :placeholder="$t('tagsInput.placeholder')"
:tags="item.namespaces.names" :tags="item.namespaces.names"
@tags-changed="(newTags)=>{logsTagsChange(newTags,item)}" @tags-changed="(newTags)=>{logsTagsChange(newTags,item)}"
@@ -472,7 +469,6 @@
]"> ]">
<vue-tags-input <vue-tags-input
v-model="subItem.tags" v-model="subItem.tags"
:maxlength="32"
:ref="'logsRelabelTag'+index+subIndex" :ref="'logsRelabelTag'+index+subIndex"
tabindex="9999" tabindex="9999"
:placeholder="$t('tagsInput.placeholder')" :placeholder="$t('tagsInput.placeholder')"

View File

@@ -12,8 +12,7 @@
<!-- begin--表单--> <!-- begin--表单-->
<div class="right-box__container"> <div class="right-box__container">
<div class="container__form"> <div class="container__form">
<el-form ref="recordRuleForm" :model="editRecordRule" <el-form ref="recordRuleForm" :model="editRecordRule" :rules="rules" label-position="top" label-width="120px">
:rules="rules" label-position="top" label-width="120px">
<!-- name --> <!-- name -->
<el-form-item :label='$t("overall.name")' prop="name"> <el-form-item :label='$t("overall.name")' prop="name">
<el-input <el-input
@@ -262,6 +261,7 @@ export default {
}, },
metricChange (val) { metricChange (val) {
this.editRecordRule.expr = val this.editRecordRule.expr = val
this.$refs.recordRuleForm?.clearValidate('expr')
}, },
labelsSort (obj) { labelsSort (obj) {
if (typeof obj != 'object') { if (typeof obj != 'object') {

View File

@@ -15,7 +15,7 @@
<el-select v-model="state" class="margin-r-10" size="small" value-key="value" @change="getTableData" popper-class="right-box-select-top right-public-box-dropdown-top" style="width: 100px"> <el-select v-model="state" class="margin-r-10" size="small" value-key="value" @change="getTableData" popper-class="right-box-select-top right-public-box-dropdown-top" style="width: 100px">
<el-option v-for="item in stateOptions" :key="item.value" :label="$t(item.label)" :value="item.value"></el-option> <el-option v-for="item in stateOptions" :key="item.value" :label="$t(item.label)" :value="item.value"></el-option>
</el-select> </el-select>
<pick-time ref="pickTime" v-model="searchTime" sign="message" :default-pick="defaultPick" :refresh-data-func="dateChange" :show-empty="true" :use-chart-unit="false" :use-refresh="false"></pick-time> <pick-time ref="pickTime" v-model="searchTime" sign="message" :default-pick="defaultPick" :refresh-data-func="dateChange" :show-empty="true" :use-chart-unit="false" :use-refresh="true"></pick-time>
<button id="roles-add" v-has="'alertMessage_view'" :title="$t('overall.exportExcel')" class="top-tool-btn margin-r-10" type="button" @click="showExportDialog"> <button id="roles-add" v-has="'alertMessage_view'" :title="$t('overall.exportExcel')" class="top-tool-btn margin-r-10" type="button" @click="showExportDialog">
<i class="nz-icon-download1 nz-icon"></i> <i class="nz-icon-download1 nz-icon"></i>
</button> </button>

View File

@@ -30,7 +30,6 @@
<el-form-item :label="$t('config.system.monitor.interface_name')" prop="interface_name"> <el-form-item :label="$t('config.system.monitor.interface_name')" prop="interface_name">
<vue-tags-input <vue-tags-input
v-model="tag" v-model="tag"
:maxlength="32"
:class="monitor.interface_name.length !== 0 ? 'interface-name' : ''" :class="monitor.interface_name.length !== 0 ? 'interface-name' : ''"
:placeholder="$t('tagsInput.placeholder')" :placeholder="$t('tagsInput.placeholder')"
:tags="monitor.interface_name" :tags="monitor.interface_name"

View File

@@ -3842,8 +3842,8 @@ export default {
exportLog ({ limit, descending }) { exportLog ({ limit, descending }) {
const params = { const params = {
logql: this.expressions, logql: this.expressions,
start: this.$stringTimeParseToUnix(bus.formateTimeToTime(this.filterTime[0])), start: this.momentStrToTimestamp(this.filterTime[0]),
end: this.$stringTimeParseToUnix(bus.formateTimeToTime(this.filterTime[1])), end: this.momentStrToTimestamp(this.filterTime[1]),
direction: descending ? 'backward' : 'forward', direction: descending ? 'backward' : 'forward',
limit limit
} }

View File

@@ -98,7 +98,7 @@ export default {
const params = { const params = {
...this.pageObj, ...this.pageObj,
queryValue: this.searchStr, queryValue: this.searchStr,
orderBy: 'uts' orderBy: '-uts'
} }
if (this.type === 'metric') { if (this.type === 'metric') {
params.queryKey = 'explore-metric' params.queryKey = 'explore-metric'
@@ -151,7 +151,7 @@ export default {
const params = { const params = {
pageNo: 1, pageNo: 1,
queryValue: this.searchStr, queryValue: this.searchStr,
orderBy: 'uts', orderBy: '-uts',
pageSize pageSize
} }
if (this.type === 'metric') { if (this.type === 'metric') {

View File

@@ -583,7 +583,6 @@ export default {
})), })),
span: /^[a-zA-Z0-9_:]+$/ span: /^[a-zA-Z0-9_:]+$/
} }
console.log(res.options)
// 过滤 非logs的函数 // 过滤 非logs的函数
if (res !== null) { if (res !== null) {
historyItems.options = historyItems.options.concat(res.options) historyItems.options = historyItems.options.concat(res.options)