From 2eb996e89891da7fe35b6e909b28097ef9683b6e Mon Sep 17 00:00:00 2001 From: dengzedong <dengzedong@email> Date: 星期一, 09 六月 2025 14:39:29 +0800 Subject: [PATCH] 建议快照 图表Y轴上下限函数 --- src/views/model/sche/suggest/suggestSnapshot.vue | 131 ++++++++++++++++++++++++++++--------------- 1 files changed, 84 insertions(+), 47 deletions(-) diff --git a/src/views/model/sche/suggest/suggestSnapshot.vue b/src/views/model/sche/suggest/suggestSnapshot.vue index ca89233..fd8272f 100644 --- a/src/views/model/sche/suggest/suggestSnapshot.vue +++ b/src/views/model/sche/suggest/suggestSnapshot.vue @@ -113,57 +113,91 @@ if (!chartInfo) return chart - const markLineData = [ - { - yAxis: chartInfo.data?.limitH, // 上限 - label: { - show: true, - formatter: '上限', - position: 'insideStartTop', - color: '#FF9A3D' - }, - lineStyle: { - color: '#FF9A3D', - type: 'dashed' - }, + const markLineData = [] + + if (chartInfo.data?.limitH !== null) { + markLineData.push({ + yAxis: chartInfo.data?.limitH, // 上限 + label: { + show: true, + formatter: '上限', + position: 'insideStartTop', + color: '#FF9A3D' }, - { - yAxis: chartInfo.data?.limitL, // 下限 - label: { - show: true, - formatter: '下限', - position: 'insideStartBottom', - color: '#00C2FF' - }, - lineStyle: { - color: '#00C2FF', - type: 'dashed' - }, + lineStyle: { + color: '#FF9A3D', + type: 'dashed' }, - { - xAxis: chartInfo.data?.scheduleTime || 0, // 真实数据分割线 - label: { - show: true, - formatter: '预测时间', - position: 'end', - color: '#5DFF9E' - }, - lineStyle: { - color: '#5DFF9E', - }, - } - ] + }) + } + if (chartInfo.data?.limitL !== null) { + markLineData.push({ + yAxis: chartInfo.data?.limitL, // 下限 + label: { + show: true, + formatter: '下限', + position: 'insideStartBottom', + color: '#00C2FF' + }, + lineStyle: { + color: '#00C2FF', + type: 'dashed' + }, + }) + } + if (chartInfo.data?.scheduleTime !== null) { + markLineData.push({ + xAxis: chartInfo.data?.scheduleTime, // 真实数据分割线 + label: { + show: true, + formatter: '建\n议\n时\n间', + position: 'insideEndBottom', + color: '#5DFF9E', + rotate: 0 + }, + lineStyle: { + color: '#5DFF9E', + }, + }) + } + // 采纳 + if (chartInfo.data?.status === 1) { + markLineData.push({ + xAxis: chartInfo.data?.handleTime, + label: { + show: true, + formatter: '采\n纳\n时\n间', + position: 'insideEndBottom', + color: '#2196F3', + rotate: 0 + }, + lineStyle: { + color: '#2196F3', + }, + }) + } + // 忽略 + if (chartInfo.data?.status === 2) { + markLineData.push({ + xAxis: chartInfo.data?.handleTime, + label: { + show: true, + formatter: '忽\n略\n时\n间', + position: 'insideEndBottom', + color: '#999999', + rotate: 0 + }, + lineStyle: { + color: '#999999', + }, + }) + } + // 冲顶触底时间 if (chartInfo.data?.overLimitTimes?.length > 0) { chartInfo.data?.overLimitTimes.forEach(overLimitTime => { markLineData.push({ - xAxis: overLimitTime, // 真实数据分割线 - label: { - show: false, - formatter: '预测时间', - position: 'end', - color: '#5DFF9E' - }, + xAxis: overLimitTime, lineStyle: { color: '#ff0000', }, @@ -177,9 +211,12 @@ textStyle: { fontSize: 14 } }, tooltip: { trigger: 'axis' }, - grid: { top: 30, left: '3%', right: '5%', bottom: 20 }, + grid: { top: '10%', left: '3%', right: '5%', bottom: 20 }, xAxis: {type: 'category'}, - yAxis: { type: 'value' }, + yAxis: { type: 'value', + max: (value) => chartInfo.data?.limitH && value.max < chartInfo.data.limitH ? chartInfo.data?.limitH : null, + min: (value) => chartInfo.data?.limitL && value.min > chartInfo.data.limitL ? chartInfo.data?.limitL : null, + }, dataZoom: [{ type: 'inside' }], series: [{ type: 'line', -- Gitblit v1.9.3