sx/map
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

首页取消当日发电量

Browse Source
This commit is contained in:
fengrong 2024-10-31 16:49:12 +08:00
parent 86cb2fd092
commit 3946db15ba
1 changed files with 367 additions and 296 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

385
ui/dasadmin/src/views/backend/dashboard.vue
View File

@ -190,7 +190,7 @@
<el-text class="mx-1 homelabel">功率趋势</el-text> <el-text class="mx-1 homelabel">功率趋势</el-text>
<el-row :gutter="10"> <el-row :gutter="10">
<el-col class="lg-mb-20" :span="24"> <el-col class="lg-mb-20" :span="24">
<div class="power-chart" :ref="chartRefs.set"></div> <div class="power-chart" ref="powerChartRef"></div>
</el-col> </el-col>
</el-row> </el-row>
</div> </div>
@ -213,11 +213,11 @@
<div class="summarize panelBg"> <div class="summarize panelBg">
<div class="summarize-title"> <div class="summarize-title">
<el-text class="mx-1 homelabel">发电量概况</el-text> <el-text class="mx-1 homelabel">发电量概况</el-text>
<el-text class="mx-1" style="margin-bottom: 20px;"> <!-- <el-text class="mx-1" style="margin-bottom: 20px;">
当日发电量 当日发电量
<span class="content-number" style="color: #0277B3;">{{realData.attributeMap.windfarmdayprodenergy}}</span> <span class="content-number" style="color: #0277B3;">{{realData.attributeMap.windfarmdayprodenergy}}</span>
kWh kWh
</el-text> </el-text>-->
</div> </div>
<el-row :gutter="5"> <el-row :gutter="5">
<el-col :span="6"> <el-col :span="6">
@ -276,14 +276,11 @@
<el-text class="mx-1 homelabel">发电量趋势</el-text> <el-text class="mx-1 homelabel">发电量趋势</el-text>
<el-row :gutter="10"> <el-row :gutter="10">
<el-col :span="24"> <el-col :span="24">
<el-tabs v-model="activeName" class="demo-tabs trend-tabs" @tab-click="tabhandleClick" ref="userTab"> <el-tabs v-model="trendChartType" class="demo-tabs trend-tabs" @tab-click="tabhandleClick" ref="userTab">
<el-tab-pane label="日" name="first"> <el-tab-pane label="日" name="day"> </el-tab-pane>
<div class="trend-chart" :ref="chartRefs.set"></div> <el-tab-pane label="月" name="month"> </el-tab-pane>
</el-tab-pane>
<el-tab-pane label="月" name="second">
<div class="trend-chart" :ref="chartRefs.set"></div>
</el-tab-pane>
</el-tabs> </el-tabs>
<div class="trend-chart" ref="trendChartRef"></div>
</el-col> </el-col>
</el-row> </el-row>
</div> </div>
@ -318,38 +315,50 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import {nextTick, onActivated, onMounted, reactive, ref, onBeforeMount, onUnmounted} from "vue"; import {nextTick, onActivated, onMounted, reactive, ref, onBeforeMount, onUnmounted, VNodeRef} from "vue";
import * as echarts from 'echarts' import * as echarts from 'echarts'
import { useTemplateRefsList,useEventListener } from '@vueuse/core' import { useTemplateRefsList,useEventListener } from '@vueuse/core'
import {useI18n} from "vue-i18n"; import {useI18n} from "vue-i18n";
import WindContent from '/@/views/backend/home/windMatrix.vue' import WindContent from '/@/views/backend/home/windMatrix.vue'
import {getWindFarmRealData,getWindTurbineMatrixData} from "/@/api/backend/dashboard.ts"; import {getWindFarmRealData,getWindTurbineMatrixData,getRealValueRangeReq} from "/@/api/backend/dashboard.ts";
import {ElMessage} from "element-plus"; import {dayjs, ElMessage, TableInstance} from "element-plus";
import { getRealTimeState } from '/@/views/backend/equipment/airBlower/utils.ts' import { getRealTimeState } from '/@/views/backend/equipment/airBlower/utils.ts'
import {useRoute} from "vue-router";
const route = useRoute()
const d = new Date() const d = new Date()
const { t } = useI18n() const { t } = useI18n()
let timer = null let timer:any = null
let myTable = ref(null) let myTable = ref<TableInstance>()
const realData=ref({ const realData=ref({
windFarmId: '', windFarmId: '',
attributeMap: {} attributeMap: {}
}) })
const formatAttributeValue=(value:any) => {
if (value === undefined) {
return '-';
}
if (typeof value !== 'number') {
throw new Error('Invalid data type for attribute value');
}
return value % 1 === 0 ? value : value.toFixed(2);
}
const overviewList = () => { const overviewList = () => {
getWindFarmRealData().then((res) => { getWindFarmRealData().then((res) => {
if (res.code == 200) { if (res.code == 200) {
res.data.attributeMap.windfarmdayprodenergy= res.data.attributeMap.windfarmdayprodenergy !== undefined ? ( res.data.attributeMap.windfarmdayprodenergy % 1 === 0 ? res.data.attributeMap.windfarmdayprodenergy : res.data.attributeMap.windfarmdayprodenergy.toFixed(2)) : '-' res.data.attributeMap.windfarmdayprodenergy= formatAttributeValue(res.data.attributeMap.windfarmdayprodenergy)
res.data.attributeMap.windfarmmonthprodenergy=res.data.attributeMap.windfarmmonthprodenergy !== undefined ? ( res.data.attributeMap.windfarmmonthprodenergy % 1 === 0 ? res.data.attributeMap.windfarmmonthprodenergy : res.data.attributeMap.windfarmmonthprodenergy.toFixed(2)) : '-' res.data.attributeMap.windfarmmonthprodenergy=formatAttributeValue(res.data.attributeMap.windfarmmonthprodenergy)
res.data.attributeMap.windfarmactivepower= res.data.attributeMap.windfarmactivepower !== undefined ? ( res.data.attributeMap.windfarmactivepower % 1 === 0 ? res.data.attributeMap.windfarmactivepower : res.data.attributeMap.windfarmactivepower.toFixed(2)) : '-' res.data.attributeMap.windfarmactivepower= formatAttributeValue(res.data.attributeMap.windfarmactivepower)
res.data.attributeMap.windfarmavgwindspeed=res.data.attributeMap.windfarmavgwindspeed !== undefined ? ( res.data.attributeMap.windfarmavgwindspeed % 1 === 0 ? res.data.attributeMap.windfarmavgwindspeed : res.data.attributeMap.windfarmavgwindspeed.toFixed(2)) : '-' res.data.attributeMap.windfarmavgwindspeed=formatAttributeValue(res.data.attributeMap.windfarmavgwindspeed)
res.data.attributeMap.windfarmdayoperationhours=res.data.attributeMap.windfarmdayoperationhours !== undefined ? ( res.data.attributeMap.windfarmdayoperationhours % 1 === 0 ? res.data.attributeMap.windfarmdayoperationhours : res.data.attributeMap.windfarmdayoperationhours.toFixed(2)) : '-' res.data.attributeMap.windfarmdayoperationhours=formatAttributeValue(res.data.attributeMap.windfarmdayoperationhours)
res.data.attributeMap.windfarmmonthoperationhours=res.data.attributeMap.windfarmmonthoperationhours !== undefined ? ( res.data.attributeMap.windfarmmonthoperationhours % 1 === 0 ? res.data.attributeMap.windfarmmonthoperationhours : res.data.attributeMap.windfarmmonthoperationhours.toFixed(2)) : '-' res.data.attributeMap.windfarmmonthoperationhours=formatAttributeValue(res.data.attributeMap.windfarmmonthoperationhours)
res.data.attributeMap.windfarmyearprodenergy=res.data.attributeMap.windfarmyearprodenergy !== undefined ? ( res.data.attributeMap.windfarmyearprodenergy % 1 === 0 ? res.data.attributeMap.windfarmyearprodenergy : res.data.attributeMap.windfarmyearprodenergy.toFixed(2)) : '-' res.data.attributeMap.windfarmyearprodenergy=formatAttributeValue(res.data.attributeMap.windfarmyearprodenergy)
res.data.attributeMap.windfarmtotalprodenergy=res.data.attributeMap.windfarmtotalprodenergy !== undefined ? ( res.data.attributeMap.windfarmtotalprodenergy % 1 === 0 ? res.data.attributeMap.windfarmtotalprodenergy : res.data.attributeMap.windfarmtotalprodenergy.toFixed(2)) : '-' res.data.attributeMap.windfarmtotalprodenergy=formatAttributeValue(res.data.attributeMap.windfarmtotalprodenergy)
const data:any = { const data:any = {
windFarmId: res.data.windFarmId, windFarmId: res.data.windFarmId,
attributeMap: { attributeMap: {
@ -400,7 +409,6 @@ const StatusListData = () => {
item.attributeMap.iwindspeed=item.attributeMap.iwindspeed !== undefined ? (item.attributeMap.iwindspeed % 1 === 0 ? item.attributeMap.iwindspeed : item.attributeMap.iwindspeed.toFixed(2)) : '--' item.attributeMap.iwindspeed=item.attributeMap.iwindspeed !== undefined ? (item.attributeMap.iwindspeed % 1 === 0 ? item.attributeMap.iwindspeed : item.attributeMap.iwindspeed.toFixed(2)) : '--'
item.attributeMap.igenpower=item.attributeMap.igenpower !== undefined ? (item.attributeMap.igenpower % 1 === 0 ? item.attributeMap.igenpower : item.attributeMap.igenpower.toFixed(2)) : '--' item.attributeMap.igenpower=item.attributeMap.igenpower !== undefined ? (item.attributeMap.igenpower % 1 === 0 ? item.attributeMap.igenpower : item.attributeMap.igenpower.toFixed(2)) : '--'
item.attributeMap.ikwhthisday=item.attributeMap.ikwhthisday !== undefined ? (item.attributeMap.ikwhthisday % 1 === 0 ? item.attributeMap.ikwhthisday : item.attributeMap.ikwhthisday.toFixed(2)) : '--' item.attributeMap.ikwhthisday=item.attributeMap.ikwhthisday !== undefined ? (item.attributeMap.ikwhthisday % 1 === 0 ? item.attributeMap.ikwhthisday : item.attributeMap.ikwhthisday.toFixed(2)) : '--'
//item.attributeMap.nominalCapacity=item.attributeMap.nominalCapacity.toFixed(0)
// 初始化计数器和累加器 // 初始化计数器和累加器
if (index === 0) { if (index === 0) {
currentDayStatus.value.runNum = 0; currentDayStatus.value.runNum = 0;
@ -458,8 +466,6 @@ const StatusListData = () => {
propertiesToFormat.forEach(property => { propertiesToFormat.forEach(property => {
if (currentDayStatus.value[property] !== null && currentDayStatus.value[property] !== undefined) { if (currentDayStatus.value[property] !== null && currentDayStatus.value[property] !== undefined) {
currentDayStatus.value[property] = Number(currentDayStatus.value[property].toFixed(0)); currentDayStatus.value[property] = Number(currentDayStatus.value[property].toFixed(0));
} else {
console.warn(`Property ${property} is null or undefined`);
} }
}); });
return { return {
@ -489,54 +495,49 @@ const StatusListData = () => {
}) })
} }
const chartRefs = useTemplateRefsList<HTMLDivElement>()
const state: { const state: {
charts: any[] charts: { powerChart: any; trendChart: any }
remark: string remark: string
workingTimeFormat: string workingTimeFormat: string
pauseWork: boolean pauseWork: boolean
} = reactive({ } = reactive({
charts: [], charts: { powerChart: null, trendChart: null },
remark: 'dashboard.Loading', remark: 'dashboard.Loading',
workingTimeFormat: '', workingTimeFormat: '',
pauseWork: false, pauseWork: false,
}) })
const powerChartData = [ const powerChartRef = ref()
{ /*const powerChartData: { time: any; values: any } = {
"power": 12.6, time: {},
"windSpeed": 56.3, values: {},
"dataTime": "2024-10-17 00:00:00" }*/
const powerChartData = {
time: {
iGenPower:['00:00','00:05','00:10','00:15'],
iTheoreticalPower:['00:00','00:05','00:10','00:15'],
iWindSpeed:['00:00','00:05','00:10','00:15']
},
values: {
iGenPower:[0,5,2,7],
iTheoreticalPower:[0,0,0,0],
iWindSpeed:[3,8,9,1]
}, },
{
"power": 10.6,
"windSpeed": 16.3,
"dataTime": "2024-10-17 00:05:00"
} }
]
const initpowerChart = () => { const initpowerChart = () => {
const initpowerChart = echarts.init(chartRefs.value[0] as HTMLElement) const powerChart = state.charts.powerChart ?? echarts.init(powerChartRef.value as unknown as HTMLElement)
const xAxisdata=[];
const powerData=[];
const windSpeedData=[]
powerChartData.forEach((item, index) => {
const dataTime=item.dataTime
const dataTimearr=dataTime.split(' ')
xAxisdata.push(dataTimearr[1])
powerData.push(item.power)
windSpeedData.push(item.windSpeed)
const option = { const option = {
grid: { grid: {
top: 50, top: 50,
right: 10, right: 23,
bottom: 20, bottom: 10,
left: 10, left: 18,
containLabel:true containLabel: true,
}, },
tooltip: { tooltip: {
trigger: 'axis', trigger: 'axis',
axisPointer: { axisPointer: {
type: 'shadow' type: 'shadow',
} },
}, },
xAxis: { xAxis: {
type: 'category', type: 'category',
@ -545,24 +546,26 @@ const initpowerChart = () => {
lineStyle: { lineStyle: {
color: '#dadada', color: '#dadada',
width: 1, width: 1,
type: "solid" type: 'solid',
}
}, },
axisLabel: {//x轴文字的配置 },
axisLabel: {
//x轴文字的配置
show: true, show: true,
textStyle: { textStyle: {
color: '#4E5969', color: '#4E5969',
}, },
interval: 0, interval: 'auto',
//rotate: 45 //rotate: 45
}, },
splitLine: {//分割线配置 splitLine: {
//分割线配置
show: false, show: false,
lineStyle: { lineStyle: {
color: '#999999', color: '#999999',
}
}, },
data: xAxisdata, },
data: powerChartData.time.iTheoreticalPower,
}, },
yAxis: [ yAxis: [
{ {
@ -574,16 +577,17 @@ const initpowerChart = () => {
axisLine: { axisLine: {
show: false, show: false,
lineStyle: { lineStyle: {
color: "#dadada", color: '#dadada',
width: 0, width: 0,
type: "solid" type: 'solid',
}
}, },
axisLabel: {//x轴文字的配置 },
axisLabel: {
//x轴文字的配置
show: true, show: true,
textStyle: { textStyle: {
color: '#4E5969', color: '#4E5969',
} },
}, },
axisTick: { show: false }, axisTick: { show: false },
splitLine: { splitLine: {
@ -591,8 +595,8 @@ const initpowerChart = () => {
lineStyle: { lineStyle: {
type: 'dashed', type: 'dashed',
color: '#dadada', color: '#dadada',
} },
} },
}, },
{ {
type: 'value', type: 'value',
@ -603,16 +607,17 @@ const initpowerChart = () => {
axisLine: { axisLine: {
show: false, show: false,
lineStyle: { lineStyle: {
color: "#dadada", color: '#dadada',
width: 0, width: 0,
type: "solid" type: 'solid',
}
}, },
axisLabel: {//x轴文字的配置 },
axisLabel: {
//x轴文字的配置
show: true, show: true,
textStyle: { textStyle: {
color: '#4E5969', color: '#4E5969',
} },
}, },
axisTick: { show: false }, axisTick: { show: false },
splitLine: { splitLine: {
@ -620,15 +625,14 @@ const initpowerChart = () => {
lineStyle: { lineStyle: {
type: 'dashed', type: 'dashed',
color: '#dadada', color: '#dadada',
}
}, },
},
} },
], ],
legend: { legend: {
data: ['功率', '风速'], data: ['功率', '风速'],
textStyle: { textStyle: {
color: '#73767a' color: '#73767a',
}, },
}, },
series: [ series: [
@ -640,16 +644,18 @@ const initpowerChart = () => {
color: '#00A7EB', color: '#00A7EB',
barBorderRadius: 2 barBorderRadius: 2
}, },
data: powerData data: powerChartData.values?.iGenPower ?? [],
},
},{ {
name: '风速', name: '风速',
type: 'line', type: 'line',
yAxisIndex: 1, yAxisIndex: 1,
itemStyle: { itemStyle: {
color: '#FF7E00', color: '#FF7E00',
barBorderRadius: 2 barBorderRadius: 2,
}, },
smooth: 0.6,
symbol: 'none',
areaStyle: { areaStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ {
@ -658,60 +664,72 @@ const initpowerChart = () => {
} }
]) ])
}, },
data: windSpeedData data: powerChartData.values?.iWindSpeed ?? [],
},
],
} }
] powerChart.setOption(option)
} state.charts.powerChart = powerChart
initpowerChart.setOption(option)
state.charts.push(initpowerChart)
});
} }
const TrendData=[
const trendChartRef = ref<VNodeRef>()
const TrendDataForDay = [
{ {
"currentPeriod": 56.3, currentPeriod: 86.3,
"samePeriod": 63.5, samePeriod: 63.5,
"generationTime": "2024-10-01" generationTime: '2024-10-01',
}, },
{ {
"currentPeriod": 66.3, currentPeriod: 86.3,
"samePeriod": 73.5, samePeriod: 53.5,
"generationTime": "2024-10-02" generationTime: '2024-10-02',
}, },
{ {
"currentPeriod": 66.3, currentPeriod: 86.3,
"samePeriod": 73.5, samePeriod: 43.5,
"generationTime": "2024-10-03" generationTime: '2024-10-03',
} },
]
const TrendDataForMonth = [
{
currentPeriod: 26.3,
samePeriod: 53.5,
generationTime: '2024-10-01',
},
{
currentPeriod: 36.3,
samePeriod: 53.5,
generationTime: '2024-10-02',
},
{
currentPeriod: 46.3,
samePeriod: 53.5,
generationTime: '2024-10-03',
},
] ]
const timeType="日"
const inittrendChart = (t,u) => { const inittrendChart = (type: 'day' | 'month') => {
const currentPeriod=[]; const currentPeriod: any =
const samePeriod=[] type === 'day' ? TrendDataForDay.map((item) => item.currentPeriod) : TrendDataForMonth.map((item) => item.currentPeriod)
const xAxisdata=[] const samePeriod: any = type === 'day' ? TrendDataForDay.map((item) => item.samePeriod) : TrendDataForMonth.map((item) => item.samePeriod)
TrendData.forEach((item, index) => { const xAxisdata: any = type === 'day' ? TrendDataForDay.map((item) => item.generationTime) : TrendDataForMonth.map((item) => item.generationTime)
const generationTime=item.generationTime const trendChart = state.charts?.trendChart ?? echarts.init(trendChartRef.value as unknown as HTMLElement)
const generationTimearr=generationTime.split('-')
xAxisdata.push(generationTimearr[2])
currentPeriod.push(item.currentPeriod)
samePeriod.push(item.samePeriod)
const inittrendChart = echarts.init(chartRefs.value[u] as HTMLElement)
const option = { const option = {
grid: { grid: {
top: 30, top: 30,
right: 10, right: 10,
bottom: 20, bottom: 20,
left: 25, left: 25,
borderColor:'#dadada' borderColor: '#dadada',
}, },
tooltip: { tooltip: {
trigger: 'axis', trigger: 'axis',
axisPointer: { axisPointer: {
type: 'shadow' type: 'shadow',
} },
}, },
xAxis: { xAxis: {
type: 'category', type: 'category',
@ -720,20 +738,22 @@ const inittrendChart = (t,u) => {
lineStyle: { lineStyle: {
color: '#dadada', color: '#dadada',
width: 1, width: 1,
type: "solid" type: 'solid',
}
}, },
axisLabel: {//x轴文字的配置 },
axisLabel: {
//x轴文字的配置
show: true, show: true,
textStyle: { textStyle: {
color: '#4E5969', color: '#4E5969',
}
}, },
splitLine: {//分割线配置 },
splitLine: {
//分割线配置
show: false, show: false,
lineStyle: { lineStyle: {
color: '#999999', color: '#999999',
} },
}, },
data: xAxisdata, data: xAxisdata,
}, },
@ -747,16 +767,17 @@ const inittrendChart = (t,u) => {
axisLine: { axisLine: {
show: false, show: false,
lineStyle: { lineStyle: {
color: "#dadada", color: '#dadada',
width: 0, width: 0,
type: "solid" type: 'solid',
}
}, },
axisLabel: {//x轴文字的配置 },
axisLabel: {
//x轴文字的配置
show: true, show: true,
textStyle: { textStyle: {
color: '#4E5969', color: '#4E5969',
} },
}, },
axisTick: { show: false }, axisTick: { show: false },
splitLine: { splitLine: {
@ -764,10 +785,9 @@ const inittrendChart = (t,u) => {
lineStyle: { lineStyle: {
type: 'dashed', type: 'dashed',
color: '#dadada', color: '#dadada',
}
}
}, },
},
},
], ],
legend: { legend: {
data: ['本期', '同期'], data: ['本期', '同期'],
@ -775,39 +795,38 @@ const inittrendChart = (t,u) => {
color: '#73767a', color: '#73767a',
}, },
}, },
series: series: [
[
{ {
name: '本期', name: '本期',
data: currentPeriod, data: currentPeriod,
type: 'bar', type: 'bar',
smooth: true, smooth: true,
itemStyle: { itemStyle: {
color: '#0277B3' color: '#0277B3',
} },
},{ },
{
name: '同期', name: '同期',
data: samePeriod, data: samePeriod,
type: 'bar', type: 'bar',
smooth: true, smooth: true,
itemStyle: { itemStyle: {
color: '#00A096' color: '#00A096',
} },
}, },
], ],
} }
inittrendChart.setOption(option) trendChart.setOption(option)
state.charts.push(inittrendChart) state.charts.trendChart = trendChart
})
} }
const echartsResize = () => { const echartsResize = () => {
nextTick(() => { nextTick(() => {
for (const key in state.charts) { const chartKeys = Object.keys(state.charts) as Array<keyof typeof state.charts>
chartKeys.forEach((key) => {
state.charts[key].resize() state.charts[key].resize()
} })
}) })
} }
onActivated(() => { onActivated(() => {
@ -876,9 +895,69 @@ const createScroll = () => {
}, 30) }, 30)
} }
const getChartData = () => {
powerChartData.time = {
iGenPower:['00:00','00:05','00:10','00:15'],
iTheoreticalPowe:['00:00','00:05','00:10','00:15'],
iWindSpeed:['00:00','00:05','00:10','00:15']
}
powerChartData.values = {
iGenPower:[0,5,2,7],
iTheoreticalPowe:[0,0,0,0],
iWindSpeed:[3,8,9,1]
}
/*return new Promise((resolve) => {
const data = {
startTime: new Date(new Date().toLocaleDateString()).getTime(),
endTime: Date.now(),
devices: [
{
//deviceId: route.query.irn as string,
deviceId: '1846101273013739522',
attributes: ['iGenPower', 'iTheoreticalPower', 'iWindSpeed'],
},
],
interval: '5m',
}
getRealValueRangeReq(data).then((res) => {
console.log(res)
if (res.success) {
//const data = res.data[route.query.irn as string]
const data = res.data['1846101273013739522']
const rangeKeys = Object.keys(data)
const times: any = {}
const val: any = {}
rangeKeys.forEach((key) => {
times[key] = []
val[key] = []
data[key].times.forEach((item: number, index: number) => {
times[key].push(dayjs(item).format('HH:mm'))
})
data[key].values.forEach((item: number) => {
val[key].push(item)
})
})
powerChartData.time = times
powerChartData.values = val
resolve(true)
}
})
})*/
}
const trendChartType = ref<'day' | 'month'>('day')
const tabhandleClick = () => {
state.charts.trendChart.clear()
nextTick(() => {
inittrendChart(trendChartType.value)
})
}
onMounted(() => { onMounted(() => {
inittrendChart('日','1')
/* getChartData().then(() => {
initpowerChart()
})*/
inittrendChart(trendChartType.value)
initpowerChart() initpowerChart()
createScroll() createScroll()
overviewList() overviewList()
@ -886,24 +965,12 @@ onMounted(() => {
autoUpdate() autoUpdate()
useEventListener(window, 'resize', echartsResize) useEventListener(window, 'resize', echartsResize)
}) })
onBeforeMount(() => { /*onBeforeMount(() => {
for (const key in state.charts) { for (const key in state.charts) {
state.charts[key].dispose() state.charts[key].dispose()
} }
}) })*/
const activeName = ref('first') const activeName = ref('first')
const tabhandleClick = (tabName) => {
setTimeout(() => {
echartsResize()
}, 10)
debugger
if(tabName.props.label=="日"){
inittrendChart('日','1')
}else if(tabName.props.label=="月"){
inittrendChart('月','2')
}
}
let autoUpdateTimer: any = null let autoUpdateTimer: any = null
const autoUpdate = () => { const autoUpdate = () => {
if (!autoUpdateTimer) { if (!autoUpdateTimer) {
@ -916,6 +983,10 @@ const autoUpdate = () => {
onUnmounted(() => { onUnmounted(() => {
clearInterval(timer) clearInterval(timer)
autoUpdateTimer && clearInterval(autoUpdateTimer) autoUpdateTimer && clearInterval(autoUpdateTimer)
const chartKeys = Object.keys(state.charts) as Array<keyof typeof state.charts>
chartKeys.forEach((key) => {
state.charts[key].dispose()
})
}); });