|
|
|
|
@ -59,7 +59,13 @@
|
|
|
|
|
/>
|
|
|
|
|
<div v-loading="chartLoading">
|
|
|
|
|
<el-empty v-if="!selectedParam" description="请选择左侧参数" />
|
|
|
|
|
<EChart v-else :key="chartRenderKey" :options="chartOption" height="70vh" />
|
|
|
|
|
<el-empty v-else-if="chartState === 'empty'" description="暂无数据" />
|
|
|
|
|
<EChart
|
|
|
|
|
v-else-if="chartState === 'ready'"
|
|
|
|
|
:key="chartRenderKey"
|
|
|
|
|
:options="chartOption"
|
|
|
|
|
height="70vh"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</ContentWrap>
|
|
|
|
|
</el-col>
|
|
|
|
|
@ -120,6 +126,7 @@ const selectedModelId = ref<number | undefined>(undefined)
|
|
|
|
|
|
|
|
|
|
const selectedParam = ref<DeviceTreeNode | null>(null)
|
|
|
|
|
const chartLoading = ref(false)
|
|
|
|
|
const chartState = ref<'idle' | 'loading' | 'empty' | 'ready'>('idle')
|
|
|
|
|
const chartXAxis = ref<string[]>([])
|
|
|
|
|
const chartSeries = ref<{ name: string; data: Array<number | null> }[]>([])
|
|
|
|
|
const chartRenderKey = ref(0)
|
|
|
|
|
@ -251,6 +258,7 @@ const loadTree = async () => {
|
|
|
|
|
selectedParam.value = null
|
|
|
|
|
selectedDeviceId.value = undefined
|
|
|
|
|
selectedModelId.value = undefined
|
|
|
|
|
chartState.value = 'idle'
|
|
|
|
|
chartXAxis.value = []
|
|
|
|
|
chartSeries.value = []
|
|
|
|
|
}
|
|
|
|
|
@ -300,6 +308,7 @@ const fetchChart = async () => {
|
|
|
|
|
return date.includes(':') ? date : `${date} ${suffix}`
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
chartState.value = 'loading'
|
|
|
|
|
chartLoading.value = true
|
|
|
|
|
resetChartData()
|
|
|
|
|
try {
|
|
|
|
|
@ -313,6 +322,7 @@ const fetchChart = async () => {
|
|
|
|
|
if (!rows.length) {
|
|
|
|
|
chartXAxis.value = []
|
|
|
|
|
chartSeries.value = []
|
|
|
|
|
chartState.value = 'empty'
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@ -356,8 +366,11 @@ const fetchChart = async () => {
|
|
|
|
|
const values = keys.map((k) => toNumber(firstRow[k]))
|
|
|
|
|
chartSeries.value = [{ name: param?.label || '参数', data: values }]
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
chartState.value = chartXAxis.value.length && chartSeries.value.length ? 'ready' : 'empty'
|
|
|
|
|
} catch {
|
|
|
|
|
message.error('获取图表数据失败')
|
|
|
|
|
chartState.value = 'idle'
|
|
|
|
|
} finally {
|
|
|
|
|
chartLoading.value = false
|
|
|
|
|
}
|
|
|
|
|
|