Commit 1d986bc057987bdfd5831d20ea1c3896968566d8
1 parent
eb4f2d6a
fix: DEFECT-1723 修复鼠标移入折线图时无法显示具体值
Showing
3 changed files
with
16 additions
and
7 deletions
@@ -9,6 +9,7 @@ import type { NodeDataDataSourceJsonType } from '@/api/node/model' | @@ -9,6 +9,7 @@ import type { NodeDataDataSourceJsonType } from '@/api/node/model' | ||
9 | import { SocketSubscriberEnum } from '@/enums/datasource' | 9 | import { SocketSubscriberEnum } from '@/enums/datasource' |
10 | import type { SubscriptionData } from '@/core/websocket/type/message' | 10 | import type { SubscriptionData } from '@/core/websocket/type/message' |
11 | import { formatToDateTime } from '@/utils/dateUtil' | 11 | import { formatToDateTime } from '@/utils/dateUtil' |
12 | +import type { CommandSource } from '@/core/websocket/processor' | ||
12 | 13 | ||
13 | const props = defineProps<{ | 14 | const props = defineProps<{ |
14 | config: CreateComponentType | 15 | config: CreateComponentType |
@@ -25,18 +26,25 @@ function initChartInstance() { | @@ -25,18 +26,25 @@ function initChartInstance() { | ||
25 | chartInstance.value.setOption(defaultOption) | 26 | chartInstance.value.setOption(defaultOption) |
26 | } | 27 | } |
27 | 28 | ||
28 | -const handleHistoryData = (message: SubscriptionData, attr: string) => { | ||
29 | - const data = message[attr] | 29 | +const handleHistoryData = (commandSource: CommandSource, message: SubscriptionData) => { |
30 | + const { data } = commandSource | ||
31 | + const { attrInfo, deviceInfo, attr } = data as NodeDataDataSourceJsonType | ||
32 | + const { deviceName } = deviceInfo || {} | ||
33 | + | ||
34 | + const historyData = message[attr] | ||
30 | const xAxisData: string[] = [] | 35 | const xAxisData: string[] = [] |
31 | const seriesData: number[] = [] | 36 | const seriesData: number[] = [] |
32 | 37 | ||
33 | - for (const item of data) { | 38 | + for (const item of historyData) { |
34 | const [ts, value] = item | 39 | const [ts, value] = item |
35 | xAxisData.push(formatToDateTime(ts)) | 40 | xAxisData.push(formatToDateTime(ts)) |
36 | seriesData.push(value) | 41 | seriesData.push(value) |
37 | } | 42 | } |
38 | 43 | ||
39 | unref(chartInstance)?.setOption({ | 44 | unref(chartInstance)?.setOption({ |
45 | + title: { | ||
46 | + text: `${deviceName || ''}-${attrInfo.name || ''}`, | ||
47 | + }, | ||
40 | xAxis: { data: xAxisData }, | 48 | xAxis: { data: xAxisData }, |
41 | series: { data: seriesData }, | 49 | series: { data: seriesData }, |
42 | } as EChartsOption) | 50 | } as EChartsOption) |
@@ -45,11 +53,11 @@ const handleHistoryData = (message: SubscriptionData, attr: string) => { | @@ -45,11 +53,11 @@ const handleHistoryData = (message: SubscriptionData, attr: string) => { | ||
45 | const { onMessage } = useOnMessage({ | 53 | const { onMessage } = useOnMessage({ |
46 | onReceiveDataSourceMessage(commandSource, message) { | 54 | onReceiveDataSourceMessage(commandSource, message) { |
47 | const { data } = commandSource | 55 | const { data } = commandSource |
48 | - const { chartOption, attr } = data as NodeDataDataSourceJsonType | 56 | + const { chartOption } = data as NodeDataDataSourceJsonType |
49 | const { queryType } = chartOption || {} | 57 | const { queryType } = chartOption || {} |
50 | 58 | ||
51 | if (queryType === SocketSubscriberEnum.HISTORY_CMDS) | 59 | if (queryType === SocketSubscriberEnum.HISTORY_CMDS) |
52 | - handleHistoryData(message.data, attr) | 60 | + handleHistoryData(commandSource, message.data) |
53 | }, | 61 | }, |
54 | }) | 62 | }) |
55 | 63 |
@@ -4,7 +4,8 @@ import { isLightboxMode } from '@/utils/env' | @@ -4,7 +4,8 @@ import { isLightboxMode } from '@/utils/env' | ||
4 | export const getDefaultOption = (): EChartsOption => { | 4 | export const getDefaultOption = (): EChartsOption => { |
5 | return { | 5 | return { |
6 | tooltip: { | 6 | tooltip: { |
7 | - trigger: 'axis', | 7 | + trigger: 'item', |
8 | + confine: true, | ||
8 | }, | 9 | }, |
9 | grid: { | 10 | grid: { |
10 | left: '3%', | 11 | left: '3%', |
@@ -64,7 +64,7 @@ const handlerTimeSeriesData = (commandSource: CommandSource, message: Subscripti | @@ -64,7 +64,7 @@ const handlerTimeSeriesData = (commandSource: CommandSource, message: Subscripti | ||
64 | 64 | ||
65 | unref(chartInstance)?.setOption({ | 65 | unref(chartInstance)?.setOption({ |
66 | title: { | 66 | title: { |
67 | - text: `${deviceName}-${attrInfo.name}`, | 67 | + text: `${deviceName || ''}-${attrInfo.name || ''}`, |
68 | }, | 68 | }, |
69 | dataset: { | 69 | dataset: { |
70 | dimensions: ['ts', attr], | 70 | dimensions: ['ts', attr], |