diff --git a/klp-ui/src/views/wms/receive/report/charts/bar.vue b/klp-ui/src/views/wms/receive/report/charts/bar.vue index 6afe2a02..dd2c858f 100644 --- a/klp-ui/src/views/wms/receive/report/charts/bar.vue +++ b/klp-ui/src/views/wms/receive/report/charts/bar.vue @@ -80,7 +80,7 @@ export default { { type: 'category', data: xAxisData, - axisLabel: { interval: 0 }, // 强制显示所有X轴标签,不隐藏 + // axisLabel: { interval: 0 }, // 强制显示所有X轴标签,不隐藏 axisTick: { show: false } // 隐藏X轴刻度线,美化 } ], diff --git a/klp-ui/src/views/wms/receive/report/charts/line.vue b/klp-ui/src/views/wms/receive/report/charts/line.vue index 48eb0997..560e3a5e 100644 --- a/klp-ui/src/views/wms/receive/report/charts/line.vue +++ b/klp-ui/src/views/wms/receive/report/charts/line.vue @@ -58,11 +58,14 @@ export default { // 初始化图表实例 this.chartInstance = echarts.init(chartDom) - // 从props接收的data中提取图表所需数据 - const xAxisData = this.data.map(item => item.productName) - const coilCountData = this.data.map(item => item.coilCount) - // 总重量是字符串格式,强制转数字,保证图表能正常渲染 - const totalWeightData = this.data.map(item => Number(item.totalWeight)) + // 1. 浅拷贝原数组 + 按planDate日期升序排序,生成新数组,不修改原this.data + const sortedData = [...this.data].sort((a, b) => new Date(a.planDate) - new Date(b.planDate)) + + // 2. 从排序后的新数组中,提取图表所需数据 + const xAxisData = sortedData.map(item => item.productName) + const coilCountData = sortedData.map(item => item.coilCount) + // 总重量字符串转数字,保证图表渲染正常 + const totalWeightData = sortedData.map(item => Number(item.totalWeight)) // echarts核心配置项 - 双Y轴折线图 const option = { @@ -85,7 +88,7 @@ export default { type: 'category', data: xAxisData, axisLabel: { - interval: 0, // 强制显示所有X轴标签,不隐藏 + // interval: 0, // 强制显示所有X轴标签,不隐藏 fontSize: 12 } } @@ -131,7 +134,7 @@ export default { symbolSize: 6, lineStyle: { width: 2, color: '#ff6600' }, itemStyle: { color: '#ff6600' } - } + }, ] } // 设置配置项并渲染图表