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('获取数据列表失败')
@@ -70,52 +71,20 @@
    loading.value = true
    try {
      const selectedDataList = selectedData.value.map(code =>
        dataList.value.find(d => d.dataNo === code)
        dataList.value.find(d => d.dataName === code)
      ).filter(Boolean) // 过滤无效项
      const chartData = await suggestSnapshotApi.getChartList(
        selectedDataList
      )
      // const chartData = [
      //   {
      //     "dataNo": "F0000101228",
      //     "dataList": [
      //       ["2024-02-01 00:00:00", 220.1],
      //       ["2024-02-01 01:00:00", 219.8],
      //       ["2024-02-01 02:00:00", 220.2],
      //       ["2024-02-01 03:00:00", 219.9],
      //       ["2024-02-01 04:00:00", 220.5],
      //       ["2024-02-01 05:00:00", 221.0],
      //       ["2024-02-01 06:00:00", 220.8],
      //       ["2024-02-01 07:00:00", 220.6],
      //       ["2024-02-01 08:00:00", 220.3],
      //       ["2024-02-01 09:00:00", 220.0]
      //     ]
      //   },
      //   {
      //     "dataNo": "F0000100152",
      //     "dataList": [
      //       ["2024-02-01 00:00:00", 220.1],
      //       ["2024-02-01 01:00:00", 219.8],
      //       ["2024-02-01 02:00:00", 220.2],
      //       ["2024-02-01 03:00:00", 219.9],
      //       ["2024-02-01 04:00:00", 220.5],
      //       ["2024-02-01 05:00:00", 221.0],
      //       ["2024-02-01 06:00:00", 220.8],
      //       ["2024-02-01 07:00:00", 220.6],
      //       ["2024-02-01 08:00:00", 220.3],
      //       ["2024-02-01 09:00:00", 220.0]
      //     ]
      //   }
      // ];
      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)
        }
      })

@@ -157,13 +126,33 @@
        series: [{
          type: 'line',
          data: chartInfo.data?.dataList || [],
          lineStyle: { color: '#5B8FF9', width: 1 }
          lineStyle: { color: '#5B8FF9', width: 1 },
          markLine: {
            silent: true,
            symbol: ['none', 'none'],
            lineStyle: {
              type: 'solid',
              width: 1,
              color: '#95E6FF',
            },
            label: {
              show: false,
            },
            data: [
              {
                xAxis: chartInfo.data?.scheduleTime || 0, // 真实数据分割线
                lineStyle: {
                  color: '#5DFF9E',
                },
              }
            ],
          },
        }]
      }

      chart.setOption(option)
      return chart
    }).filter(Boolean) as echarts.ECharts[]
    })
  }
</script>