From 5a8d76288cf467878cd8c97e5abc98ef9d59b1a7 Mon Sep 17 00:00:00 2001 From: Flow <958079825@qq.com> Date: Fri, 18 Jul 2025 16:12:45 +0800 Subject: [PATCH] =?UTF-8?q?=E8=B0=83=E6=95=B4=E6=A0=B7=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- public/abpm-report-template.html | 88 +++++++++++++++++++++++--------- 1 file changed, 64 insertions(+), 24 deletions(-) diff --git a/public/abpm-report-template.html b/public/abpm-report-template.html index f88189d..8e49199 100644 --- a/public/abpm-report-template.html +++ b/public/abpm-report-template.html @@ -1640,6 +1640,27 @@ function renderTrendChart() { const chart = echarts.init(document.getElementById('trend-chart')); + // 计算Y轴最大值（向上取整到合适的倍数） + const getYAxisMax = (arr, step = 20) => { + if (!arr || arr.length === 0) return step === 20 ? 200 : 120; + const validValues = arr.filter(v => v != null && !isNaN(v)); + if (validValues.length === 0) return step === 20 ? 200 : 120; + const max = Math.max(...validValues); + return Math.ceil(max / step) * step; + }; + + // 提取有效的血压和心率数据 + const systolicValues = chartDataTable.map(item => item.systolic); + const diastolicValues = chartDataTable.map(item => item.diastolic); + const heartRateValues = chartDataTable.map(item => item.heartRate); + + // 计算血压数据的最大值（收缩压和舒张压合并考虑） + const bpValues = [...systolicValues, ...diastolicValues]; + const bpMaxValue = getYAxisMax(bpValues, 20); + + // 计算心率数据的最大值 + const hrMaxValue = getYAxisMax(heartRateValues, 10); + // 完全参考analysis.vue的实现，使用value类型的X轴显示精确时间位置 const createBloodPressureXAxis = () => { if (chartDataTable.length === 0) return { xAxisTicks: [], xAxisLabels: [], seriesMap: {} }; @@ -1706,35 +1727,43 @@ // 计算夜间遮罩区域（每一天的22点到次日8点），使用时间戳方式 const calculateNightAreas = () => { const nightAreas = []; - const startTime = new Date(Math.min(...chartDataTable.map(item => new Date(item.originalTime).getTime()))); - const endTime = new Date(Math.max(...chartDataTable.map(item => new Date(item.originalTime).getTime()))); - - // 从第一天开始循环，为每一天生成夜间区域 + if (!chartDataTable || chartDataTable.length === 0) return nightAreas; + + const times = chartDataTable.map(item => new Date(item.originalTime).getTime()); + const startTime = Math.min(...times); + const endTime = Math.max(...times); + + // 取起始日期的前一天 let currentDate = new Date(startTime); - currentDate.setHours(0, 0, 0, 0); // 设置为当天0点 - - while (currentDate <= endTime) { - // 当天22点 + currentDate.setDate(currentDate.getDate() - 1); + currentDate.setHours(0, 0, 0, 0); + + // 终止日期的后一天 + const lastDate = new Date(endTime); + lastDate.setDate(lastDate.getDate() + 1); + lastDate.setHours(0, 0, 0, 0); + + while (currentDate <= lastDate) { + // 夜间开始：当天22:00 const nightStart = new Date(currentDate); nightStart.setHours(22, 0, 0, 0); - - // 次日8点 + + // 夜间结束：次日08:00 const nightEnd = new Date(currentDate); nightEnd.setDate(nightEnd.getDate() + 1); nightEnd.setHours(8, 0, 0, 0); - - // 只有当夜间时段与数据时间范围有交集时才添加 - if (nightStart <= endTime && nightEnd >= startTime) { + + // 只要遮罩区间和数据区间有交集就添加 + if (nightEnd > startTime && nightStart < endTime) { nightAreas.push([ - { xAxis: Math.max(nightStart.getTime(), startTime.getTime()) }, - { xAxis: Math.min(nightEnd.getTime(), endTime.getTime()) } + { xAxis: Math.max(nightStart.getTime(), startTime) }, + { xAxis: Math.min(nightEnd.getTime(), endTime) } ]); } - - // 移动到下一天 + + // 下一天 currentDate.setDate(currentDate.getDate() + 1); } - return nightAreas; }; const nightAreas = calculateNightAreas(); @@ -1824,10 +1853,13 @@ { type: 'value', name: 'mmHg', + nameTextStyle: { + color: '#000' // 设置为黑色 + }, position: 'left', min: 0, - max: 200, - interval: 20, + max: bpMaxValue, + interval: Math.max(10, Math.round(bpMaxValue / 10)), axisLabel: { color: '#666' }, @@ -1847,10 +1879,18 @@ { type: 'value', name: '次/分', + nameTextStyle: { + color: '#000' // 设置为黑色 + }, position: 'right', - min: 50, - max: 120, - interval: 10, + min: (() => { + const validHRValues = heartRateValues.filter(v => v != null && !isNaN(v)); + if (validHRValues.length === 0) return 50; + const minHR = Math.min(...validHRValues); + return Math.max(0, Math.floor(minHR / 10) * 10 - 10); + })(), + max: hrMaxValue, + interval: Math.max(5, Math.round(hrMaxValue / 10)), axisLabel: { color: '#666' }, @@ -2467,7 +2507,7 @@ function getNighttimeData() { return chartDataTable.filter(item => { const hour = new Date(item.originalTime).getHours(); - return hour < 6 || hour >= 22; + return hour < 8 || hour >= 22; }); }