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

NEZ-3337 fix：dashboard bar图表类型样式优化

Browse Source
This commit is contained in:
zyh
2023-11-21 17:47:32 +08:00
parent 0c0f2c0aa1
commit eaa13c25d2
2 changed files with 16 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
nezha-fronted/src/assets/css/components/chart/chart.scss
View File

@@ -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;
}
}
}

8
nezha-fronted/src/components/chart/chart/chartBar.vue
View File

@@ -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)