From eaa13c25d23f57084450c19b7663937b9fe86cbe Mon Sep 17 00:00:00 2001 From: zyh Date: Tue, 21 Nov 2023 17:47:32 +0800 Subject: [PATCH] =?UTF-8?q?NEZ-3337=20fix=EF=BC=9Adashboard=20bar=E5=9B=BE?= =?UTF-8?q?=E8=A1=A8=E7=B1=BB=E5=9E=8B=E6=A0=B7=E5=BC=8F=E4=BC=98=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/assets/css/components/chart/chart.scss | 14 ++++++++++++-- .../src/components/chart/chart/chartBar.vue | 8 ++++---- 2 files changed, 16 insertions(+), 6 deletions(-) diff --git a/nezha-fronted/src/assets/css/components/chart/chart.scss b/nezha-fronted/src/assets/css/components/chart/chart.scss index 99a264c60..acac4906f 100644 --- a/nezha-fronted/src/assets/css/components/chart/chart.scss +++ b/nezha-fronted/src/assets/css/components/chart/chart.scss @@ -950,8 +950,13 @@ display: flex; align-items: center; justify-content: flex-end; - white-space: nowrap; color: $--color-text-primary; + white-space: nowrap; + span{ + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } } } @@ -1024,7 +1029,12 @@ display: flex; align-items: center; justify-content: flex-end; - white-space: nowrap; color: $--color-text-primary; + white-space: nowrap; + span{ + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } } } \ No newline at end of file diff --git a/nezha-fronted/src/components/chart/chart/chartBar.vue b/nezha-fronted/src/components/chart/chart/chartBar.vue index edd68dd50..32965a067 100644 --- a/nezha-fronted/src/components/chart/chart/chartBar.vue +++ b/nezha-fronted/src/components/chart/chart/chartBar.vue @@ -405,7 +405,7 @@ export default { const titleFontSize = Math.min(titleHeight, 28) const maxValueWidth = 150 - const valueWidth = this.chartInfo.param.text === 'value' || this.chartInfo.param.text === 'all' ? Math.min(this.boxWidth * 0.2, maxValueWidth) : 0 + const valueWidth = this.chartInfo.param.text === 'value' || this.chartInfo.param.text === 'all' ? Math.min(this.boxWidth * 0.15, maxValueWidth) : 0 this.barData.forEach((item) => { item.height = height @@ -428,7 +428,7 @@ export default { valueText = item.showValue } item.valueWidth = valueWidth - item.valueFontSize = this.calculateFontSize(valueText, item.valueWidth - 10 * 2, height, 1.2) + item.valueFontSize = Math.max(this.calculateFontSize(valueText, item.valueWidth - 10 * 2, height, 1.2), 12) }) const titleWidthArr = this.barData.map(item => item.titleWidth) const maxTitleWidth = Math.max(...titleWidthArr) @@ -500,7 +500,7 @@ export default { const titleHeight = Math.max(height * maxTitleHeightRatio, 12) const titleFontSize = Math.min(titleHeight, 28) const maxValueWidth = 150 - const valueWidth = this.chartInfo.param.text === 'value' || this.chartInfo.param.text === 'all' ? Math.min(this.boxWidth * 0.2, maxValueWidth) : 0 + const valueWidth = this.chartInfo.param.text === 'value' || this.chartInfo.param.text === 'all' ? Math.min(this.boxWidth * 0.15, maxValueWidth) : 0 const cellWidth = 10 const cellHeight = height @@ -526,7 +526,7 @@ export default { valueText = item.showValue } item.valueWidth = valueWidth - item.valueFontSize = this.calculateFontSize(valueText, item.valueWidth - 10 * 2, height, 1.2) + item.valueFontSize = Math.max(this.calculateFontSize(valueText, item.valueWidth - 10 * 2, height, 1.2), 12) }) const titleWidthArr = this.barData.map(item => item.titleWidth) const maxTitleWidth = Math.max(...titleWidthArr)