From bb876681574cd5e508433e9e73d57e075340443f Mon Sep 17 00:00:00 2001 From: dengzedong <dengzedong@email> Date: 星期五, 06 六月 2025 18:49:48 +0800 Subject: [PATCH] 建议快照 上下限 bug --- src/views/model/sche/suggest/suggestSnapshot.vue | 186 +++++++++++++++++++++++++++++++--------------- 1 files changed, 124 insertions(+), 62 deletions(-) diff --git a/src/views/model/sche/suggest/suggestSnapshot.vue b/src/views/model/sche/suggest/suggestSnapshot.vue index fc2f607..62c6405 100644 --- a/src/views/model/sche/suggest/suggestSnapshot.vue +++ b/src/views/model/sche/suggest/suggestSnapshot.vue @@ -8,8 +8,8 @@ <el-checkbox-group v-model="selectedData" @change="refreshCharts"> <el-checkbox v-for="item in dataList" - :label="item.dataNo" - :key="item.dataNo" + :label="item.dataName" + :key="item.dataName" > {{ item.dataName }} </el-checkbox> @@ -40,19 +40,20 @@ const loading = ref(false) - const open = async (id: string) => { + const open = async (suggestId: string) => { visible.value = true - await getDataList(id) + await getDataList(suggestId) } defineExpose({ open }) /** 获取数据列表 */ - const getDataList = async (id: string) => { + const getDataList = async (suggestId: string) => { try { - const res = await suggestSnapshotApi.getList(id) + const res = await suggestSnapshotApi.getList(suggestId) dataList.value = res selectedData.value = [] // 清空已选项 + refreshCharts() } catch (error) { console.error(error) message.error('获取数据列表失败') @@ -69,62 +70,21 @@ loading.value = true try { - const chartData = await suggestSnapshotApi.getChartList({ - chooseDataList: selectedData.value - }) - // const chartData =[ - // { - // "dataNo": "F0000101228", - // "categories": [ - // "2024-02-01T00:00:00", - // "2024-02-01T02:00:00", - // "2024-02-01T04:00:00", - // "2024-02-01T06:00:00", - // "2024-02-01T08:00:00", - // "2024-02-01T10:00:00", - // "2024-02-01T12:00:00", - // "2024-02-01T14:00:00", - // "2024-02-01T16:00:00", - // "2024-02-01T18:00:00" - // ], - // "series": [ - // { - // "name": "温度", - // "data": [22.1, 21.8, 21.5, 22.3, 24.5, 26.7, 28.2, 27.9, 25.6, 23.4] - // } - // ] - // }, - // { - // "dataNo": "F0000100152", - // "categories": [ - // "2024-02-01T00:00:00", - // "2024-02-01T02:00:00", - // "2024-02-01T04:00:00", - // "2024-02-01T06:00:00", - // "2024-02-01T08:00:00", - // "2024-02-01T10:00:00", - // "2024-02-01T12:00:00", - // "2024-02-01T14:00:00", - // "2024-02-01T16:00:00", - // "2024-02-01T18:00:00" - // ], - // "series": [ - // { - // "name": "电压", - // "data": [220.1, 219.8, 220.2, 219.9, 220.5, 221.0, 220.8, 220.6, 220.3, 220.0] - // } - // ] - // } - // ] + const selectedDataList = selectedData.value.map(code => + dataList.value.find(d => d.dataName === code) + ).filter(Boolean) // 过滤无效项 + const chartData = await suggestSnapshotApi.getChartList( + selectedDataList + ) destroyCharts() // 生成图表配置数据 charts.value = selectedData.value.map(code => { - const item = dataList.value.find(d => d.dataNo === code) + const item = dataList.value.find(d => d.dataName === code) return { id: `chart-${code}`, name: item?.dataName || code, - data: chartData.find((d: any) => d.dataNo === code) + data: chartData.find((d: any) => d.dataName === code) } }) @@ -153,6 +113,98 @@ 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: { text: chartInfo.name, @@ -160,22 +212,32 @@ }, tooltip: { trigger: 'axis' }, grid: { top: 30, left: '3%', right: '5%', bottom: 20 }, - xAxis: { - type: 'category', - data: chartInfo.data?.categories || [] - }, + xAxis: {type: 'category'}, yAxis: { type: 'value' }, dataZoom: [{ type: 'inside' }], series: [{ type: 'line', - data: chartInfo.data?.series?.[0]?.data || [], - lineStyle: { color: '#5B8FF9', width: 1 } + data: chartInfo.data?.dataList || [], + lineStyle: { color: '#5B8FF9', width: 1 }, + markLine: { + silent: true, + symbol: ['none', 'none'], + lineStyle: { + type: 'solid', + width: 1, + color: '#95E6FF', + }, + label: { + show: false, + }, + data: markLineData, + }, }] } chart.setOption(option) return chart - }).filter(Boolean) as echarts.ECharts[] + }) } </script> -- Gitblit v1.9.3