diff --git a/nezha-fronted/src/assets/css/components/chart/chart.scss b/nezha-fronted/src/assets/css/components/chart/chart.scss index ffdfcd502..8b058daea 100644 --- a/nezha-fronted/src/assets/css/components/chart/chart.scss +++ b/nezha-fronted/src/assets/css/components/chart/chart.scss @@ -430,6 +430,9 @@ flex-wrap: wrap; padding: 5px; box-sizing: border-box; + flex-direction: row; + align-items: center; + align-content: center; .chart-stat-item{ display: flex; justify-content: center; @@ -441,6 +444,7 @@ padding: 2px; overflow: hidden; color: $--color-text-regular; + flex-grow: 1 } } .chart-gauge-box{ diff --git a/nezha-fronted/src/components/chart/chartDetail.vue b/nezha-fronted/src/components/chart/chartDetail.vue index 4fac06def..913d12668 100644 --- a/nezha-fronted/src/components/chart/chartDetail.vue +++ b/nezha-fronted/src/components/chart/chartDetail.vue @@ -3,7 +3,7 @@
- Basic info + {{$t('overall.basicInfo')}}
@@ -78,7 +78,7 @@
-
Endpoint
+
{{$t('asset.endpoint')}}
  {{chartDetail ? chartDetail.endpointNum : 0}} diff --git a/nezha-fronted/src/components/charts/chartDataFormat.js b/nezha-fronted/src/components/charts/chartDataFormat.js index 2dc1fe2ee..dc8c71c5d 100644 --- a/nezha-fronted/src/components/charts/chartDataFormat.js +++ b/nezha-fronted/src/components/charts/chartDataFormat.js @@ -4,8 +4,12 @@ * type:自定义参数,用于区分是y轴调用还是tooltip调用,以设置不同精度 type =1 y轴调用 type=2 tooltip调用 * */ import bus from '../../libs/bus' - +import { formatScientificNotation } from '@/components/common/js/tools' function none (value, index) { + const scientificNotationValue = formatScientificNotation(num, dot) + if (!numberWithEConvent(scientificNotationValue)) { + return scientificNotationValue + } return keepDoubleNumber(value) } function short (value, index, type = 1, dot) { @@ -18,14 +22,26 @@ function short (value, index, type = 1, dot) { } } function percent01 (value, index) { + const scientificNotationValue = formatScientificNotation(value, 2) + if (!numberWithEConvent(scientificNotationValue)) { + return `${scientificNotationValue} %` + } value = parseFloat((Number(value)).toFixed(2)) return `${value} %` } function percent02 (value, index) { - value = parseFloat((Number(value) * 100).toFixed(2)) + const scientificNotationValue = formatScientificNotation(value, 2) + if (!numberWithEConvent(scientificNotationValue)) { + return `${scientificNotationValue} %` + } + value = parseFloat((Number(value) * 100)) return `${value} %` } function localFormat (value, index) { + const scientificNotationValue = formatScientificNotation(value, 2) + if (!numberWithEConvent(scientificNotationValue)) { + return `${scientificNotationValue} %` + } let num = (value || 0).toString() let result = '' while (num.length > 3) { @@ -287,6 +303,32 @@ function days (value, index, type = 1, dot) { return timeCompute(value, 'day', 3) } } +function numberWithEConvent (num) { + if (num) { + if ((('' + num).indexOf('E') !== -1) || (('' + num).indexOf('e') !== -1)) { + const regExp = /'^((\\d+.?\\d+)[Ee]{1}(\\d+))$', 'ig'/ + let result = regExp.exec(num) + let resultValue = '' + let power + if (result != null) { + resultValue = result[2] + power = result[3] + result = regExp.exec(num) + } + + if (resultValue) { + if (power) { + const powVer = Math.pow(10, power) + resultValue = resultValue * powVer + return resultValue + } + } + } else { + return num + } + } + return 0 +} /* * 一般数值格式化方法 * num: 需要格式化的值 @@ -295,6 +337,10 @@ function days (value, index, type = 1, dot) { * dot:保留的小数位, * */ function asciiCompute (num, ascii, units, dot = 2) { + const scientificNotationValue = formatScientificNotation(num, dot) + if (!numberWithEConvent(scientificNotationValue)) { + return scientificNotationValue + } if (!num && num !== 0 && num !== '0') { return '' } diff --git a/nezha-fronted/src/components/common/detailView/detailViewTopSearch.vue b/nezha-fronted/src/components/common/detailView/detailViewTopSearch.vue index 6f4714f24..b400b73db 100644 --- a/nezha-fronted/src/components/common/detailView/detailViewTopSearch.vue +++ b/nezha-fronted/src/components/common/detailView/detailViewTopSearch.vue @@ -18,7 +18,7 @@
@@ -50,7 +50,7 @@ diff --git a/nezha-fronted/src/components/common/detailView/view/detailViewRight.vue b/nezha-fronted/src/components/common/detailView/view/detailViewRight.vue index b73a182f5..85df004a8 100644 --- a/nezha-fronted/src/components/common/detailView/view/detailViewRight.vue +++ b/nezha-fronted/src/components/common/detailView/view/detailViewRight.vue @@ -160,32 +160,32 @@ export default { panel: [ { prop: 'panelTab', name: this.$t('overall.detail'), active: true }, { prop: 'alertMessageTab', name: this.$t('overall.alert'), active: false }, - { prop: 'endpointTab', name: 'Endpoint', active: false }, - { prop: 'log', name: 'Log', active: false } + { prop: 'endpointTab', name: this.$t('asset.endpoint'), active: false }, + { prop: 'log', name: this.$t('overall.logs'), active: false } ], alertMessage: [ { prop: 'panelTab', name: this.$t('overall.detail'), active: false }, { prop: 'alertMessageTab', name: this.$t('overall.alert'), active: true }, - { prop: 'endpointTab', name: 'Endpoint', active: false }, - { prop: 'log', name: 'Log', active: false } + { prop: 'endpointTab', name: this.$t('asset.endpoint'), active: false }, + { prop: 'log', name: this.$t('overall.logs'), active: false } ], endpoint: [ { prop: 'panelTab', name: this.$t('overall.detail'), active: false }, { prop: 'alertMessageTab', name: this.$t('overall.alert'), active: false }, - { prop: 'endpointTab', name: 'Endpoint', active: true }, - { prop: 'log', name: 'Log', active: false } + { prop: 'endpointTab', name: this.$t('asset.endpoint'), active: true }, + { prop: 'log', name: this.$t('overall.logs'), active: false } ], log: [ { prop: 'panelTab', name: this.$t('overall.detail'), active: false }, { prop: 'alertMessageTab', name: this.$t('overall.alert'), active: false }, - { prop: 'endpointTab', name: 'Endpoint', active: false }, - { prop: 'log', name: 'Log', active: true } + { prop: 'endpointTab', name: this.$t('asset.endpoint'), active: false }, + { prop: 'log', name: this.$t('overall.logs'), active: true } ], alertMessageSub: [ { prop: 'panelTab', name: this.$t('overall.detail'), active: false }, { prop: 'alertMessageTab', name: this.$t('overall.alert'), active: false }, - { prop: 'endpointTab', name: 'Endpoint', active: false }, - { prop: 'log', name: 'Log', active: false }, + { prop: 'endpointTab', name: this.$t('asset.endpoint'), active: false }, + { prop: 'log', name: this.$t('overall.logs'), active: false }, { prop: 'assetSubTab', name: this.$t('overall.assetSubTab'), active: true } ] }, @@ -200,8 +200,8 @@ export default { endpointTabTitle: [ { prop: 'panelTab', name: this.$t('overall.detail') }, { prop: 'endpointAlertMessage', name: this.$t('overall.alert') }, - { prop: 'endpointQuery', name: 'Metrics' }, - { prop: 'log', name: 'Log' } + { prop: 'endpointQuery', name: this.$t('project.metrics.metrics') }, + { prop: 'log', name: this.$t('overall.logs') } ] }, chartTemp: { diff --git a/nezha-fronted/src/components/common/globalSearch/globalSearch.vue b/nezha-fronted/src/components/common/globalSearch/globalSearch.vue index 6372b0a8f..7e72e7f66 100644 --- a/nezha-fronted/src/components/common/globalSearch/globalSearch.vue +++ b/nezha-fronted/src/components/common/globalSearch/globalSearch.vue @@ -93,7 +93,7 @@ {{$t('globalSearch.toEsc')}}