diff --git a/src/components/cockpit/exceedanceLevel/components/dailyTrendChart.vue b/src/components/cockpit/exceedanceLevel/components/dailyTrendChart.vue
index c761d21..cdd8fb4 100644
--- a/src/components/cockpit/exceedanceLevel/components/dailyTrendChart.vue
+++ b/src/components/cockpit/exceedanceLevel/components/dailyTrendChart.vue
@@ -15,13 +15,13 @@ import { mainHeight } from '@/utils/layout'
import { limitExtentDayData } from '@/api/harmonic-boot/cockpit/cockpit'
const prop = defineProps({
- width: { type: [String, Number]},
- height: { type: [String, Number]},
- timeKey: { type: [String, Number]},
+ width: { type: [String, Number] },
+ height: { type: [String, Number] },
+ timeKey: { type: [String, Number] },
timeValue: { type: Object }
})
-const pageHeight = ref(mainHeight(332))
+const pageHeight = mainHeight(0, 2)
const dialogVisible: any = ref(false)
@@ -36,35 +36,26 @@ const echartList = ref()
const init = () => {
echartList.value = {
title: {
- text: dialogText.value,
- textStyle: {
- fontSize: 14,
- rich: {
- lineName: {
- color: '#333',
- fontSize: 14
- },
- timeLabel: {
- color: '#333',
- fontSize: 14,
- padding: [0, 0, 0, 10]
- },
- name: {
- color: '#333',
- fontSize: 14,
- padding: [0, 0, 0, 10]
- }
- }
- }
+ text: dialogText.value
+ },
+ legend: {
+ itemWidth: 20,
+ itemHeight: 20,
+ itemStyle: { opacity: 0 }, //去圆点
+ right: 70
},
xAxis: {
- type: 'category',
- data: []
- },
- yAxis: {
- type: 'value',
- name: '数值'
- },
+ type: 'time',
+ axisLabel: {
+ formatter: {
+ day: '{MM}-{dd}',
+ month: '{MM}',
+ year: '{yyyy}'
+ }
+ }
+ },
+
+ yAxis: [{}, {}],
grid: {
left: '1%',
right: '45px',
@@ -112,12 +103,17 @@ const initData = async (row: any) => {
// 处理每条相位数据
const seriesData = res.data.map((item: any) => {
- const values = item.value.split(',').map((v: string) => parseFloat(v) || 0)
+ const values = xAxisData.map((time: string, index: number) => {
+ // 将传入的日期与时间拼接成完整的时间字符串
+ const fullTime = `${row.time} ${time}`
+ const value = parseFloat(item.value.split(',')[index]) || 0
+ return [fullTime, value]
+ })
return {
name: `${item.phasic}相`,
type: 'line',
- showSymbol: true,
+ showSymbol: false,
smooth: true,
data: values,
itemStyle: {
@@ -130,18 +126,17 @@ const initData = async (row: any) => {
})
// 更新图表配置
- echartList.value.xAxis.data = xAxisData
echartList.value.options.series = seriesData
+ // 注意:使用时间轴时不需要设置 xAxis.data
}
})
}
-
onMounted(() => {})
const open = async (row: any) => {
dialogVisible.value = true
dialogTitle.value = row.name + '日趋势图'
- dialogText.value = `{lineName|${row.lineName}}{timeLabel|${row.time}}{name|${row.name}日趋势图}`
+ dialogText.value = `监测点:${row.lineName} 时间:${row.time} 指标:${row.name}`
nextTick(() => {
initData(row)
})
diff --git a/src/components/cockpit/exceedanceLevel/index.vue b/src/components/cockpit/exceedanceLevel/index.vue
index f2d2236..10c72dc 100644
--- a/src/components/cockpit/exceedanceLevel/index.vue
+++ b/src/components/cockpit/exceedanceLevel/index.vue
@@ -14,7 +14,7 @@
isGroup
>
-
+