diff --git a/src/views/kanbanManagement/CarouselBoard/components/QualityStatisticsCard.vue b/src/views/kanbanManagement/CarouselBoard/components/QualityStatisticsCard.vue index 1abd7d1..65fbe2b 100644 --- a/src/views/kanbanManagement/CarouselBoard/components/QualityStatisticsCard.vue +++ b/src/views/kanbanManagement/CarouselBoard/components/QualityStatisticsCard.vue @@ -338,11 +338,10 @@ export default { // 获取合格率最高的前5个 const top5 = validData.slice(0, 5) - // 准备横向柱状图数据 + // 准备横向柱状图数据,y轴显示产品描述 const topLabels = top5.map(item => { - const partNumber = item.finishedPartNumber || '未知' - const desc = item.productDescription || '' - return (partNumber + '-' + desc).substring(0, 15) // 截取前15个字符 + const desc = item.productDescription || item.finishedPartNumber || '未知' + return desc.substring(0, 20) // 截取前20个字符,优先显示描述 }) const topRates = top5.map(item => parseFloat(item.qualifiedRate) || 0) @@ -385,8 +384,17 @@ export default { type: 'category', data: topLabels, axisLabel: { - fontSize: 9, - interval: 0 + fontSize: 10, + interval: 0, + formatter: function(value) { + // 自动换行,每行最多显示8个字符 + const maxLength = 8; + let result = ''; + for (let i = 0; i < value.length; i += maxLength) { + result += value.substring(i, i + maxLength) + '\n'; + } + return result.trim(); + } } }, series: [ @@ -427,11 +435,10 @@ export default { // 获取合格率最低的前5个 const bottom5 = validData.slice(0, 5) - // 准备横向柱状图数据 + // 准备横向柱状图数据,y轴显示产品描述 const bottomLabels = bottom5.map(item => { - const partNumber = item.finishedPartNumber || '未知' - const desc = item.productDescription || '' - return (partNumber + '-' + desc).substring(0, 15) // 截取前15个字符 + const desc = item.productDescription || item.finishedPartNumber || '未知' + return desc.substring(0, 20) // 截取前20个字符,优先显示描述 }) const bottomRates = bottom5.map(item => parseFloat(item.qualifiedRate) || 0) @@ -474,8 +481,17 @@ export default { type: 'category', data: bottomLabels, axisLabel: { - fontSize: 9, - interval: 0 + fontSize: 10, + interval: 0, + formatter: function(value) { + // 自动换行,每行最多显示8个字符 + const maxLength = 8; + let result = ''; + for (let i = 0; i < value.length; i += maxLength) { + result += value.substring(i, i + maxLength) + '\n'; + } + return result.trim(); + } } }, series: [ @@ -595,7 +611,7 @@ export default { .bar-chart { flex: 1; - min-width: 200px; + min-width: 250px; /* 增加最小宽度以适应多行标签 */ } .top-chart {