From e295922209fb87c6dcd68ea1560fd16c3e6d808c Mon Sep 17 00:00:00 2001 From: dongyukun <1208714201@qq.com> Date: 星期五, 27 六月 2025 09:36:51 +0800 Subject: [PATCH] Merge remote-tracking branch 'origin/feature/ai' --- src/views/model/sche/suggest/suggestSnapshot.vue | 120 ++++++++++++++++++++++++++++++++++++++++++++++++++++-------- 1 files changed, 104 insertions(+), 16 deletions(-) diff --git a/src/views/model/sche/suggest/suggestSnapshot.vue b/src/views/model/sche/suggest/suggestSnapshot.vue index f23ae2e..801a654 100644 --- a/src/views/model/sche/suggest/suggestSnapshot.vue +++ b/src/views/model/sche/suggest/suggestSnapshot.vue @@ -16,10 +16,10 @@ </el-checkbox-group> <div - v-for="(chart, index) in charts" + v-for="chart in charts" :key="chart.id" class="chart-container" - :ref="el => chartDoms[index] = el" + :ref="el => chartDoms[chart.id] = el" v-loading="loading" ></div> </el-dialog> @@ -34,8 +34,8 @@ const visible = ref(false) const dataList = ref([]) const selectedData = ref([]) - const charts = ref([]) - const chartDoms = ref([]) + const charts = ref() + const chartDoms = ref({}) const chartInstances = ref([]) const loading = ref(false) @@ -106,12 +106,104 @@ /** 渲染图表 */ const renderCharts = () => { - chartInstances.value = chartDoms.value.map((dom, index) => { + chartInstances.value = charts.value.map((chartInfo, index) => { + const dom = chartDoms.value[chartInfo.id] if (!dom) return null const chart = echarts.init(dom) - const chartInfo = charts.value[index] if (!chartInfo) return chart + + const markLineData = [] + + if (chartInfo.data?.limitH !== null) { + markLineData.push({ + yAxis: chartInfo.data?.limitH, // 上限 + label: { + show: true, + formatter: '上限', + position: 'insideStartTop', + color: '#FF9A3D' + }, + lineStyle: { + color: '#FF9A3D', + type: 'dashed' + }, + }) + } + 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, + lineStyle: { + color: '#ff0000', + }, + }) + }) + } const option = { title: { @@ -119,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', @@ -138,14 +233,7 @@ label: { show: false, }, - data: [ - { - xAxis: chartInfo.data?.scheduleTime || 0, // 真实数据分割线 - lineStyle: { - color: '#5DFF9E', - }, - } - ], + data: markLineData, }, }] } -- Gitblit v1.9.3