Merge remote-tracking branch 'origin/main'
This commit is contained in:
houwei
commit
f82b7d2d10
@ -31,12 +31,6 @@
|
||||
<!--实时预览-->
|
||||
<div class="overview panelBg">
|
||||
<el-text class="mx-1 homelabel">实时预览</el-text>
|
||||
<!-- <div class="radioItem">
|
||||
<el-radio-group v-model="radioactiveName">
|
||||
<el-radio value="1">模拟量</el-radio>
|
||||
<el-radio value="2">状态量</el-radio>
|
||||
</el-radio-group>
|
||||
</div> -->
|
||||
<el-row :gutter="10">
|
||||
<div class="realScroll" ref="listContainer">
|
||||
<div class="realPart">
|
||||
@ -95,7 +89,7 @@
|
||||
<el-text class="mx-1 homelabel">功率趋势</el-text>
|
||||
<el-row :gutter="10">
|
||||
<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-row>
|
||||
</div>
|
||||
@ -166,16 +160,16 @@
|
||||
|
||||
<div class="chartPart">
|
||||
<div class="chartPart-item">
|
||||
<div class="chartParm" :ref="chartRefs.set"></div>
|
||||
<div class="chartParm" ref="temperatureChartRef1"></div>
|
||||
</div>
|
||||
<div class="chartPart-item">
|
||||
<div class="chartParm" :ref="chartRefs.set"></div>
|
||||
<div class="chartParm" ref="temperatureChartRef2"></div>
|
||||
</div>
|
||||
<div class="chartPart-item">
|
||||
<div class="chartParm" :ref="chartRefs.set"></div>
|
||||
<div class="chartParm" ref="temperatureChartRef3"></div>
|
||||
</div>
|
||||
<div class="chartPart-item item_bar">
|
||||
<div class="frequencyChart" :ref="chartRefs.set"></div>
|
||||
<div class="frequencyChart" ref="frequencyChartRef"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -187,11 +181,6 @@
|
||||
<div class="summarize panelBg">
|
||||
<div class="summarize-title">
|
||||
<el-text class="mx-1 homelabel">发电量概况</el-text>
|
||||
<el-text class="mx-1" style="margin-bottom: 20px">
|
||||
当日发电量
|
||||
<span class="content-number" style="color: #0277b3">{{ realTimeDataForSingle.ikwhthisday }}</span>
|
||||
kWh
|
||||
</el-text>
|
||||
</div>
|
||||
<el-row :gutter="5">
|
||||
<el-col :span="6">
|
||||
@ -201,7 +190,7 @@
|
||||
</div>
|
||||
<div class="summarize-panel-base">
|
||||
<div>
|
||||
<span class="content-number">{{ realTimeDataForSingle.dayGeneration }}</span>
|
||||
<span class="content-number">{{ realTimeDataForSingle.ikwhthisday }}</span>
|
||||
</div>
|
||||
<div><span>kWh</span></div>
|
||||
<div><span>日发电量</span></div>
|
||||
@ -258,14 +247,13 @@
|
||||
<el-text class="mx-1 homelabel">发电量趋势</el-text>
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="24">
|
||||
<el-tabs v-model="activeName" class="demo-tabs trend-tabs" @tab-click="tabhandleClick" ref="userTab">
|
||||
<el-tab-pane label="日" name="first">
|
||||
<div class="trend-chart" :ref="chartRefs.set"></div>
|
||||
<el-tabs v-model="trendChartType" class="demo-tabs trend-tabs" @tab-click="tabhandleClick" ref="userTab">
|
||||
<el-tab-pane label="日" name="day">
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="月" name="second">
|
||||
<div class="trend-chart" :ref="chartRefs.set"></div>
|
||||
<el-tab-pane label="月" name="month">
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
<div class="trend-chart" ref="trendChartRef"></div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
@ -316,18 +304,18 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { nextTick, onActivated, onMounted, reactive, ref, computed, onBeforeMount, onUnmounted } from 'vue'
|
||||
import { nextTick, onActivated, onMounted, reactive, ref, computed, onBeforeMount, onUnmounted, VNode, VNodeRef } from 'vue'
|
||||
import * as echarts from 'echarts'
|
||||
import { useTemplateRefsList, useEventListener } from '@vueuse/core'
|
||||
import { useEventListener } from '@vueuse/core'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import { DArrowRight } from '@element-plus/icons-vue'
|
||||
import { getRealValueListReq, getRealValueRangeReq } from '/@/api/backend/deviceModel/request'
|
||||
import { getModelAttributeListReq } from '/@/api/backend/deviceModel/request'
|
||||
import { useRoute } from 'vue-router'
|
||||
import VisualList from './visualList.vue'
|
||||
import Overview from './overview.vue'
|
||||
import { TableInstance } from 'element-plus'
|
||||
import { dayjs } from 'element-plus'
|
||||
import { getRealTimeState } from '/@/views/backend/equipment/airBlower/utils'
|
||||
const route = useRoute()
|
||||
|
||||
const d = new Date()
|
||||
@ -362,47 +350,33 @@ const realTimeDataForSingle = ref<any>({
|
||||
ipitchangle: '',
|
||||
iwindspeed: '',
|
||||
})
|
||||
const chartRefs = useTemplateRefsList<HTMLDivElement>()
|
||||
|
||||
const state: {
|
||||
charts: any[]
|
||||
charts: { powerChart: any; temperatureChart1: any; temperatureChart2: any; temperatureChart3: any; frequencyChart: any; trendChart: any }
|
||||
remark: string
|
||||
workingTimeFormat: string
|
||||
pauseWork: boolean
|
||||
} = reactive({
|
||||
charts: [],
|
||||
charts: { powerChart: null, temperatureChart1: null, temperatureChart2: null, temperatureChart3: null, frequencyChart: null, trendChart: null },
|
||||
remark: 'dashboard.Loading',
|
||||
workingTimeFormat: '',
|
||||
pauseWork: false,
|
||||
})
|
||||
const powerChartData = [
|
||||
{
|
||||
power: 12.6,
|
||||
windSpeed: 56.3,
|
||||
dataTime: '2024-10-17 00:00:00',
|
||||
},
|
||||
{
|
||||
power: 10.6,
|
||||
windSpeed: 16.3,
|
||||
dataTime: '2024-10-17 00:05:00',
|
||||
},
|
||||
]
|
||||
|
||||
const powerChartRef = ref<VNodeRef>()
|
||||
const powerChartData: { time: any; values: any } = {
|
||||
time: {},
|
||||
values: {},
|
||||
}
|
||||
const initpowerChart = () => {
|
||||
const initpowerChart = echarts.init(chartRefs.value[0] as HTMLElement)
|
||||
const xAxisdata: any[] = []
|
||||
const powerData: any[] = []
|
||||
const windSpeedData: any[] = []
|
||||
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 powerChart = state.charts.powerChart ?? echarts.init(powerChartRef.value as unknown as HTMLElement)
|
||||
|
||||
const option = {
|
||||
grid: {
|
||||
top: 50,
|
||||
right: 10,
|
||||
bottom: 20,
|
||||
left: 10,
|
||||
right: 23,
|
||||
bottom: 10,
|
||||
left: 18,
|
||||
containLabel: true,
|
||||
},
|
||||
tooltip: {
|
||||
@ -427,7 +401,7 @@ const initpowerChart = () => {
|
||||
textStyle: {
|
||||
color: '#4E5969',
|
||||
},
|
||||
interval: 0,
|
||||
interval: 'auto',
|
||||
//rotate: 45
|
||||
},
|
||||
splitLine: {
|
||||
@ -437,7 +411,7 @@ const initpowerChart = () => {
|
||||
color: '#999999',
|
||||
},
|
||||
},
|
||||
data: xAxisdata,
|
||||
data: powerChartData.time.iTheoreticalPower,
|
||||
},
|
||||
yAxis: [
|
||||
{
|
||||
@ -518,19 +492,19 @@ const initpowerChart = () => {
|
||||
},
|
||||
smooth: 0.6,
|
||||
symbol: 'none',
|
||||
data: powerData,
|
||||
data: powerChartData.values?.iGenPower ?? [],
|
||||
},
|
||||
{
|
||||
name: '理论有功功率',
|
||||
type: 'line',
|
||||
barWidth: 20,
|
||||
itemStyle: {
|
||||
color: '#00a4ff',
|
||||
color: '#62bd25',
|
||||
barBorderRadius: 2,
|
||||
},
|
||||
smooth: 0.6,
|
||||
symbol: 'none',
|
||||
data: powerData,
|
||||
data: powerChartData.values?.iTheoreticalPower ?? [],
|
||||
},
|
||||
{
|
||||
name: '风速',
|
||||
@ -550,46 +524,57 @@ const initpowerChart = () => {
|
||||
}
|
||||
])
|
||||
},*/
|
||||
data: windSpeedData,
|
||||
data: powerChartData.values?.iWindSpeed ?? [],
|
||||
},
|
||||
],
|
||||
}
|
||||
initpowerChart.setOption(option)
|
||||
state.charts.push(initpowerChart)
|
||||
})
|
||||
powerChart.setOption(option)
|
||||
state.charts.powerChart = powerChart
|
||||
}
|
||||
|
||||
const TrendData = [
|
||||
const TrendDataForDay = [
|
||||
{
|
||||
currentPeriod: 56.3,
|
||||
currentPeriod: 86.3,
|
||||
samePeriod: 63.5,
|
||||
generationTime: '2024-10-01',
|
||||
},
|
||||
{
|
||||
currentPeriod: 66.3,
|
||||
samePeriod: 73.5,
|
||||
currentPeriod: 86.3,
|
||||
samePeriod: 53.5,
|
||||
generationTime: '2024-10-02',
|
||||
},
|
||||
{
|
||||
currentPeriod: 66.3,
|
||||
samePeriod: 73.5,
|
||||
currentPeriod: 86.3,
|
||||
samePeriod: 43.5,
|
||||
generationTime: '2024-10-03',
|
||||
},
|
||||
]
|
||||
const timeType = '日'
|
||||
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 trendChartRef = ref<VNodeRef>()
|
||||
|
||||
const inittrendChart = (t: any, u: any) => {
|
||||
const currentPeriod: any = []
|
||||
const samePeriod: any = []
|
||||
const xAxisdata: any = []
|
||||
TrendData.forEach((item, index) => {
|
||||
const generationTime = item.generationTime
|
||||
const generationTimearr = generationTime.split('-')
|
||||
xAxisdata.push(generationTimearr[2])
|
||||
currentPeriod.push(item.currentPeriod)
|
||||
samePeriod.push(item.samePeriod)
|
||||
const inittrendChart = (type: 'day' | 'month' = 'day') => {
|
||||
const currentPeriod: any =
|
||||
type === 'day' ? TrendDataForDay.map((item) => item.currentPeriod) : TrendDataForMonth.map((item) => item.currentPeriod)
|
||||
const samePeriod: any = type === 'day' ? TrendDataForDay.map((item) => item.samePeriod) : TrendDataForMonth.map((item) => item.samePeriod)
|
||||
const xAxisdata: any = type === 'day' ? TrendDataForDay.map((item) => item.generationTime) : TrendDataForMonth.map((item) => item.generationTime)
|
||||
const trendChart = state.charts?.trendChart ?? echarts.init(trendChartRef.value as unknown as HTMLElement)
|
||||
|
||||
const inittrendChart = echarts.init(chartRefs.value[u] as HTMLElement)
|
||||
const option = {
|
||||
grid: {
|
||||
top: 30,
|
||||
@ -689,9 +674,8 @@ const inittrendChart = (t: any, u: any) => {
|
||||
},
|
||||
],
|
||||
}
|
||||
inittrendChart.setOption(option)
|
||||
state.charts.push(inittrendChart)
|
||||
})
|
||||
trendChart.setOption(option)
|
||||
state.charts.trendChart = trendChart
|
||||
}
|
||||
const chartsData = [
|
||||
{
|
||||
@ -707,9 +691,15 @@ const chartsData = [
|
||||
value: 56,
|
||||
},
|
||||
]
|
||||
const initChart = () => {
|
||||
chartsData.forEach((item, index) => {
|
||||
const initChart = echarts.init(chartRefs.value[index + 1] as HTMLElement)
|
||||
const temperatureChartRef1 = ref<VNodeRef>()
|
||||
const temperatureChartRef2 = ref<VNodeRef>()
|
||||
const temperatureChartRef3 = ref<VNodeRef>()
|
||||
const initTemperatureChart = () => {
|
||||
const temperatureChart1 = state.charts.temperatureChart1 ?? echarts.init(temperatureChartRef1.value as unknown as HTMLElement)
|
||||
const temperatureChart2 = state.charts.temperatureChart2 ?? echarts.init(temperatureChartRef2.value as unknown as HTMLElement)
|
||||
const temperatureChart3 = state.charts.temperatureChart3 ?? echarts.init(temperatureChartRef3.value as unknown as HTMLElement)
|
||||
const options = []
|
||||
for (let i = 0; i < chartsData.length; i++) {
|
||||
const option = {
|
||||
grid: {
|
||||
top: 30,
|
||||
@ -728,8 +718,8 @@ const initChart = () => {
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: item.name,
|
||||
data: [item.value],
|
||||
name: chartsData[i].name,
|
||||
data: [chartsData[i].value],
|
||||
type: 'bar',
|
||||
label: {
|
||||
show: true,
|
||||
@ -783,9 +773,14 @@ const initChart = () => {
|
||||
},
|
||||
},
|
||||
}
|
||||
initChart.setOption(option)
|
||||
state.charts.push(initChart)
|
||||
})
|
||||
options.push(option)
|
||||
}
|
||||
temperatureChart1.setOption(options[0])
|
||||
state.charts.temperatureChart1 = temperatureChart1
|
||||
temperatureChart2.setOption(options[1])
|
||||
state.charts.temperatureChart2 = temperatureChart2
|
||||
temperatureChart3.setOption(options[2])
|
||||
state.charts.temperatureChart3 = temperatureChart3
|
||||
}
|
||||
|
||||
var frequencydata = [
|
||||
@ -839,13 +834,12 @@ var frequencydata = [
|
||||
},
|
||||
]
|
||||
|
||||
const initfrequencyChart = () => {
|
||||
const yAxisdata = []
|
||||
const seriesdata = []
|
||||
frequencydata.forEach((item, index) => {
|
||||
yAxisdata.push(item.name)
|
||||
seriesdata.push(item.value)
|
||||
const initfrequencyChart = echarts.init(chartRefs.value[4] as HTMLElement)
|
||||
const frequencyChartRef = ref()
|
||||
const initFrequencyChart = () => {
|
||||
const frequencyChart = state.charts.frequencyChart ?? echarts.init(frequencyChartRef.value as unknown as HTMLElement)
|
||||
const yAxisdata: any = frequencydata.map((item) => item.name)
|
||||
const seriesdata: any = frequencydata.map((item) => item.value)
|
||||
|
||||
const option = {
|
||||
title: [
|
||||
{
|
||||
@ -919,16 +913,16 @@ const initfrequencyChart = () => {
|
||||
},
|
||||
animation: false,
|
||||
}
|
||||
initfrequencyChart.setOption(option)
|
||||
state.charts.push(initfrequencyChart)
|
||||
})
|
||||
frequencyChart.setOption(option)
|
||||
state.charts.frequencyChart = frequencyChart
|
||||
}
|
||||
|
||||
const echartsResize = () => {
|
||||
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()
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
onActivated(() => {
|
||||
@ -999,22 +993,6 @@ const realTimeData = ref<any>({
|
||||
iturbineoperationmode: 1111,
|
||||
})
|
||||
|
||||
const getRealTimeState = (data: any) => {
|
||||
if (data.attributeMap.iturbineoperationmode) {
|
||||
if (data.attributeMap.iturbineoperationmode > 1 && data.attributeMap.iturbineoperationmode < 6) {
|
||||
return 2
|
||||
}
|
||||
if (data.attributeMap.iturbineoperationmode === 21) {
|
||||
return 20
|
||||
}
|
||||
return data.attributeMap.iturbineoperationmode
|
||||
} else if (data.attributeMap.iyplevel === 10) {
|
||||
return 1110
|
||||
} else if (data.attributeMap.gridlostdetected === 1) {
|
||||
return 1111
|
||||
}
|
||||
}
|
||||
|
||||
const realTimeDataState = computed(() => {
|
||||
switch (realTimeData.value.iturbineoperationmode) {
|
||||
case 20:
|
||||
@ -1039,6 +1017,8 @@ const realTimeDataState = computed(() => {
|
||||
return '解缆状态'
|
||||
case 1111:
|
||||
return '电网故障停机'
|
||||
case 1112:
|
||||
return '安全链停机'
|
||||
}
|
||||
})
|
||||
|
||||
@ -1060,11 +1040,12 @@ const getRealTimeData = () => {
|
||||
const createRealTimeData = async () => {
|
||||
try {
|
||||
const modelList: any = await getModelList()
|
||||
const realTimeData: any = await getRealTimeData()
|
||||
const realData: any = await getRealTimeData()
|
||||
realTimeData.value.iturbineoperationmode = getRealTimeState(realData)
|
||||
|
||||
const overviewDatakeys: any = Object.keys(overviewData)
|
||||
|
||||
const sigleDataKeys: any = Object.keys(realTimeDataForSingle.value)
|
||||
|
||||
const dataFor138And139: { name: string; value: string }[] = []
|
||||
const dataFor140: { name: string; value: string }[] = []
|
||||
const realDataForSub: any = [
|
||||
@ -1076,10 +1057,10 @@ const createRealTimeData = async () => {
|
||||
{ type138: [], type140: [] },
|
||||
]
|
||||
modelList.forEach((item: any) => {
|
||||
const realVal = realTimeData[item.attributeCode.toLowerCase()]
|
||||
const realVal = realData[item.attributeCode.toLowerCase()]
|
||||
const val = realVal === 0 ? 0 : realVal ? (realVal % 1 === 0 ? realVal : Math.floor(realVal * 1000) / 1000) : '-'
|
||||
if (sigleDataKeys.includes(item.attributeCode.toLowerCase())) {
|
||||
realTimeDataForSingle.value[item.attributeCode.toLowerCase()] = val
|
||||
realTimeDataForSingle.value[item.attributeCode.toLowerCase()] = val === '-' ? val : val
|
||||
}
|
||||
if (
|
||||
item.attributeCode.toLowerCase() === 'ipitchangle1' ||
|
||||
@ -1103,25 +1084,25 @@ const createRealTimeData = async () => {
|
||||
} else if (item.attributeType === 140) {
|
||||
dataFor140.push(showData)
|
||||
}
|
||||
if (item.subSystem === '变桨系统' || item.subSystem === '轮毂系统') {
|
||||
if (item.subSystem === '变桨系统' || item.subSystem === '轮毂') {
|
||||
if (item.attributeType === 138 || item.attributeType === 139) {
|
||||
realDataForSub[0].type138.push(showData)
|
||||
} else if (item.attributeType === 140) {
|
||||
realDataForSub[0].type140.push(showData)
|
||||
}
|
||||
} else if (item.subSystem === '轴承系统' || item.subSystem === '传动链系统' || item.subSystem === '齿轮箱系统') {
|
||||
} else if (item.subSystem === '轴承' || item.subSystem === '传动链' || item.subSystem === '齿轮箱') {
|
||||
if (item.attributeType === 138 || item.attributeType === 139) {
|
||||
realDataForSub[1].type138.push(showData)
|
||||
} else if (item.attributeType === 140) {
|
||||
realDataForSub[1].type140.push(showData)
|
||||
}
|
||||
} else if (item.subSystem === '发电机系统') {
|
||||
} else if (item.subSystem === '发电机') {
|
||||
if (item.attributeType === 138 || item.attributeType === 139) {
|
||||
realDataForSub[2].type138.push(showData)
|
||||
} else if (item.attributeType === 140) {
|
||||
realDataForSub[2].type140.push(showData)
|
||||
}
|
||||
} else if (item.subSystem === '机舱系统') {
|
||||
} else if (item.subSystem === '机舱') {
|
||||
if (item.attributeType === 138 || item.attributeType === 139) {
|
||||
realDataForSub[3].type138.push(showData)
|
||||
} else if (item.attributeType === 140) {
|
||||
@ -1133,7 +1114,7 @@ const createRealTimeData = async () => {
|
||||
} else if (item.attributeType === 140) {
|
||||
realDataForSub[4].type140.push(showData)
|
||||
}
|
||||
} else if (item.subSystem === '环境系统' || item.subSystem === '气象系统') {
|
||||
} else if (item.subSystem === '环境' || item.subSystem === '气象') {
|
||||
if (item.attributeType === 138 || item.attributeType === 139) {
|
||||
realDataForSub[5].type138.push(showData)
|
||||
} else if (item.attributeType === 140) {
|
||||
@ -1208,31 +1189,14 @@ const openSubSystem = (type: number) => {
|
||||
visible.value = true
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
inittrendChart('日', '5')
|
||||
initpowerChart()
|
||||
createScroll()
|
||||
initChart()
|
||||
initfrequencyChart()
|
||||
useEventListener(window, 'resize', echartsResize)
|
||||
autoUpdate()
|
||||
const trendChartType = ref<'day' | 'month'>('day')
|
||||
const tabhandleClick = () => {
|
||||
state.charts.trendChart.clear()
|
||||
nextTick(() => {
|
||||
console.log(trendChartType.value)
|
||||
|
||||
inittrendChart(trendChartType.value)
|
||||
})
|
||||
onBeforeMount(() => {
|
||||
for (const key in state.charts) {
|
||||
state.charts[key].dispose()
|
||||
}
|
||||
})
|
||||
const activeName = ref('first')
|
||||
const tabhandleClick = (tabName) => {
|
||||
setTimeout(() => {
|
||||
echartsResize()
|
||||
}, 10)
|
||||
debugger
|
||||
if (tabName.props.label == '日') {
|
||||
inittrendChart('日', '5')
|
||||
} else if (tabName.props.label == '月') {
|
||||
inittrendChart('月', '6')
|
||||
}
|
||||
}
|
||||
|
||||
const overviewSlotData = reactive<{ visible: boolean; type: '138' | '140'; type138: any[]; type140: any[] }>({
|
||||
@ -1252,6 +1216,7 @@ const autoUpdate = () => {
|
||||
}
|
||||
|
||||
const getChartData = () => {
|
||||
return new Promise((resolve) => {
|
||||
const data = {
|
||||
startTime: new Date(new Date().toLocaleDateString()).getTime(),
|
||||
endTime: Date.now(),
|
||||
@ -1261,15 +1226,57 @@ const getChartData = () => {
|
||||
attributes: ['iGenPower', 'iTheoreticalPower', 'iWindSpeed'],
|
||||
},
|
||||
],
|
||||
interval: '1min',
|
||||
interval: '5m',
|
||||
}
|
||||
getRealValueRangeReq(data).then((res) => {
|
||||
console.log(res)
|
||||
if (res.success) {
|
||||
const data = res.data[route.query.irn as string]
|
||||
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('YYYY-MM-DD HH:mm:ss'))
|
||||
})
|
||||
data[key].values.forEach((item: number) => {
|
||||
val[key].push(item)
|
||||
})
|
||||
})
|
||||
powerChartData.time = times
|
||||
powerChartData.values = val
|
||||
resolve(true)
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
// getChartData()
|
||||
|
||||
onMounted(() => {
|
||||
inittrendChart()
|
||||
getChartData().then(() => {
|
||||
initpowerChart()
|
||||
})
|
||||
createScroll()
|
||||
initTemperatureChart()
|
||||
initFrequencyChart()
|
||||
useEventListener(window, 'resize', echartsResize)
|
||||
autoUpdate()
|
||||
})
|
||||
// onBeforeMount(() => {
|
||||
// const chartKeys = Object.keys(state.charts) as Array<keyof typeof state.charts>
|
||||
// chartKeys.forEach((key) => {
|
||||
// state.charts[key].dispose()
|
||||
// })
|
||||
// })
|
||||
|
||||
onUnmounted(() => {
|
||||
autoUpdateTimer && clearInterval(autoUpdateTimer)
|
||||
const chartKeys = Object.keys(state.charts) as Array<keyof typeof state.charts>
|
||||
chartKeys.forEach((key) => {
|
||||
state.charts[key].dispose()
|
||||
})
|
||||
})
|
||||
</script>
|
||||
|
||||
@ -1407,7 +1414,7 @@ onUnmounted(() => {
|
||||
.el-button {
|
||||
width: 80px;
|
||||
height: 40px;
|
||||
background: #0064aa;
|
||||
// background: rgb(0,100,170);
|
||||
border-radius: 6px;
|
||||
color: #ffffff;
|
||||
border: none;
|
||||
|
||||
@ -21,7 +21,7 @@
|
||||
background
|
||||
:pager-count="7"
|
||||
layout="prev, pager, next, jumper,sizes,total"
|
||||
@change="getcurrentPage"
|
||||
@size-change="sizeChangePage"
|
||||
></el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
@ -49,7 +49,9 @@ const pageSetting = reactive({
|
||||
pageSizes: [20, 50, 100],
|
||||
})
|
||||
|
||||
const getcurrentPage = () => {}
|
||||
const sizeChangePage = () => {
|
||||
pageSetting.current = 1
|
||||
}
|
||||
|
||||
watch(
|
||||
() => props.type,
|
||||
|
||||
@ -128,8 +128,8 @@ import { useI18n } from 'vue-i18n'
|
||||
import { getAirBlowerListReq, getBelongLineListReq, runAirBlowerReq } from '/@/api/backend/airBlower/request'
|
||||
import { ElMessage, TableInstance } from 'element-plus'
|
||||
import { useRouter, useRoute } from 'vue-router'
|
||||
import { getRealTimeState } from './utils'
|
||||
const router = useRouter()
|
||||
const route = useRoute()
|
||||
|
||||
const { t } = useI18n()
|
||||
|
||||
@ -188,6 +188,10 @@ const airBlowerSelectOptions = reactive<{ [K in SelectTypeKeyUnionType]: { label
|
||||
label: '电网故障停机',
|
||||
value: 1111,
|
||||
},
|
||||
{
|
||||
label: '安全链停机',
|
||||
value: 1112,
|
||||
},
|
||||
],
|
||||
belongLine: [],
|
||||
})
|
||||
@ -198,13 +202,15 @@ const selectAirBlower = (type: SelectTypeKeyUnionType) => {
|
||||
return
|
||||
} else if (airBlowerSelect.belongLine !== '全部' && airBlowerSelect.iturbineoperationmode !== 987654321) {
|
||||
if (type === 'iturbineoperationmode' && airBlowerSelect.iturbineoperationmode === 2) {
|
||||
const type1 = tableData.value.filter((item) => item.iturbineoperationmode === 1)
|
||||
const type6 = tableData.value.filter((item) => item.iturbineoperationmode === 6)
|
||||
const type2 = tableData.value.filter((item) => item.iturbineoperationmode === 2)
|
||||
tableData.value = [...type1, ...type6, ...type2]
|
||||
const type1 = originTableData.value.filter((item) => item.iturbineoperationmode === 1)
|
||||
const type6 = originTableData.value.filter((item) => item.iturbineoperationmode === 6)
|
||||
const type2 = originTableData.value.filter((item) => item.iturbineoperationmode === 2)
|
||||
const typeAll = [...type1, ...type6, ...type2]
|
||||
tableData.value = typeAll.filter((item) => item.belongLine === airBlowerSelect.belongLine)
|
||||
return
|
||||
}
|
||||
tableData.value = tableData.value.filter((item) => item[type] === airBlowerSelect[type])
|
||||
const resData = originTableData.value.filter((item) => item.iturbineoperationmode === airBlowerSelect.iturbineoperationmode)
|
||||
tableData.value = resData.filter((item) => item.belongLine === airBlowerSelect.belongLine)
|
||||
return
|
||||
} else {
|
||||
if (type === 'belongLine' && airBlowerSelect.belongLine === '全部') {
|
||||
@ -329,22 +335,6 @@ const tableColumn: TableColumnType[] = [
|
||||
},
|
||||
]
|
||||
|
||||
const getRealTimeState = (data: any) => {
|
||||
if (data.attributeMap.iturbineoperationmode) {
|
||||
if (data.attributeMap.iturbineoperationmode > 1 && data.attributeMap.iturbineoperationmode < 6) {
|
||||
return 2
|
||||
}
|
||||
if (data.attributeMap.iturbineoperationmode === 21) {
|
||||
return 20
|
||||
}
|
||||
return data.attributeMap.iturbineoperationmode
|
||||
} else if (data.attributeMap.iyplevel === 10) {
|
||||
return 1110
|
||||
} else if (data.attributeMap.gridlostdetected === 1) {
|
||||
return 1111
|
||||
}
|
||||
}
|
||||
|
||||
const tableRef = ref<TableInstance>()
|
||||
const tableData = ref<TableDataObjType[]>([])
|
||||
const originTableData = ref<TableDataObjType[]>([])
|
||||
@ -352,7 +342,7 @@ const getTableData = () => {
|
||||
getAirBlowerListReq()
|
||||
.then((res) => {
|
||||
const data = res.data.map((item: any) => {
|
||||
const state = getRealTimeState(item)
|
||||
const state = getRealTimeState(item.attributeMap)
|
||||
const ipitchangle = Math.min(item.attributeMap.ipitchangle1, item.attributeMap.ipitchangle2, item.attributeMap.ipitchangle3)
|
||||
const resVal: any = {}
|
||||
Object.keys(item.attributeMap).forEach((attrKey) => {
|
||||
|
||||
17
ui/dasadmin/src/views/backend/equipment/airBlower/utils.ts
Normal file
17
ui/dasadmin/src/views/backend/equipment/airBlower/utils.ts
Normal file
@ -0,0 +1,17 @@
|
||||
export const getRealTimeState = (data: any) => {
|
||||
if (data.iturbineoperationmode) {
|
||||
if (data.iturbineoperationmode > 1 && data.iturbineoperationmode < 6) {
|
||||
return 2
|
||||
}
|
||||
if (data.iturbineoperationmode === 21) {
|
||||
return 20
|
||||
}
|
||||
return data.iturbineoperationmode
|
||||
} else if (data.iyplevel === 10) {
|
||||
return 1110
|
||||
} else if (data.gridlostdetected === 1) {
|
||||
return 1111
|
||||
} else if (data.ibplevel === 200) {
|
||||
return 1112
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user