能量管理:数据关联

物模型:模态窗添加移动
This commit is contained in:
高云鹏 2025-01-22 15:47:44 +08:00
parent 25e9b71e0e
commit ac790b72a8
2 changed files with 75 additions and 26 deletions

View File

@ -1,6 +1,6 @@
<template> <template>
<div class="DeviceModel"> <div class="DeviceModel">
<el-dialog v-model="modelDialogVisible" :title="modelDialogTitle" :width="400" @close="cancelModelForm"> <el-dialog v-model="modelDialogVisible" :title="modelDialogTitle" :width="400" @close="cancelModelForm" :close-on-click-modal="false" draggable>
<el-form ref="modelFormRef" :model="modelForm" :rules="modelFormRules" label-width="110"> <el-form ref="modelFormRef" :model="modelForm" :rules="modelFormRules" label-width="110">
<el-form-item prop="iotModelName" :label="ModelFieldsEnums['iotModelName']"> <el-form-item prop="iotModelName" :label="ModelFieldsEnums['iotModelName']">
<el-input <el-input
@ -212,7 +212,7 @@
</div> </div>
</template> </template>
</ContextMenu> </ContextMenu>
<el-dialog v-model="attributeVisible" :title="attributeFormTitle" @close="closeAttributeForm" :width="600"> <el-dialog v-model="attributeVisible" :title="attributeFormTitle" @close="closeAttributeForm" :width="600" draggable :close-on-click-modal="false">
<el-form ref="attributeFormRef" :model="attributeForm" label-width="100" :rules="attributeAndServiceRules"> <el-form ref="attributeFormRef" :model="attributeForm" label-width="100" :rules="attributeAndServiceRules">
<el-form-item :label="ModelAttributeFieldsEnums['attributeName']" prop="attributeName"> <el-form-item :label="ModelAttributeFieldsEnums['attributeName']" prop="attributeName">
<el-input v-model="attributeForm.attributeName" :placeholder="'请输入' + ModelAttributeFieldsEnums['attributeName']"></el-input> <el-input v-model="attributeForm.attributeName" :placeholder="'请输入' + ModelAttributeFieldsEnums['attributeName']"></el-input>
@ -289,7 +289,7 @@
<el-button @click="closeAttributeForm">取消</el-button> <el-button @click="closeAttributeForm">取消</el-button>
</template> </template>
</el-dialog> </el-dialog>
<el-dialog v-model="serviceVisible" :title="serviceFormTitle" @close="closeServiceForm" :width="600"> <el-dialog v-model="serviceVisible" :title="serviceFormTitle" @close="closeServiceForm" :width="600" draggable :close-on-click-modal="false">
<el-form ref="serviceFormRef" :model="serviceForm" label-width="100" :rules="attributeAndServiceRules"> <el-form ref="serviceFormRef" :model="serviceForm" label-width="100" :rules="attributeAndServiceRules">
<el-form-item :label="ModelServiceFieldsEnums['serviceName']" prop="serviceName"> <el-form-item :label="ModelServiceFieldsEnums['serviceName']" prop="serviceName">
<el-input v-model="serviceForm.serviceName" :placeholder="'请输入' + ModelServiceFieldsEnums['serviceName']"></el-input> <el-input v-model="serviceForm.serviceName" :placeholder="'请输入' + ModelServiceFieldsEnums['serviceName']"></el-input>

View File

@ -132,7 +132,7 @@
<div class="imgName">全场有功</div> <div class="imgName">全场有功</div>
</div> </div>
<div class="right"> <div class="right">
<div class="num">33</div> <div class="num">{{ realDataList.windfarmactivepower }}</div>
<div class="unit">MW</div> <div class="unit">MW</div>
</div> </div>
</div> </div>
@ -142,7 +142,7 @@
<div class="imgName">AGC目标值</div> <div class="imgName">AGC目标值</div>
</div> </div>
<div class="right"> <div class="right">
<div class="num">6</div> <div class="num">{{ realDataListSetValue.AgcTarget }}</div>
<div class="unit">MW</div> <div class="unit">MW</div>
</div> </div>
</div> </div>
@ -150,8 +150,8 @@
<div class="left"> <div class="left">
<div class="name">AGC投入/退出</div> <div class="name">AGC投入/退出</div>
<div class="status"> <div class="status">
<div class="smallDot" :class="agcOnOff ? 'successColor' : 'defaultColor'"></div> <div class="smallDot" :class="realDataList.operationstatusagc ? 'successColor' : 'defaultColor'"></div>
<div class="smallDot" :class="agcOnOff ? 'defaultColor' : 'errorColor'"></div> <div class="smallDot" :class="realDataList.operationstatusagc ? 'defaultColor' : 'errorColor'"></div>
</div> </div>
</div> </div>
<div class="right"> <div class="right">
@ -176,26 +176,26 @@
<div class="check"> <div class="check">
<div class="left">AGC增闭锁</div> <div class="left">AGC增闭锁</div>
<div class="right"> <div class="right">
<div class="dot" :class="agcAdd ? 'successColor' : 'errorColor'"></div> <div class="dot" :class="realDataList.activepowerincdisabled ? 'successColor' : 'errorColor'"></div>
</div> </div>
</div> </div>
<div class="check"> <div class="check">
<div class="left">AGC减闭锁</div> <div class="left">AGC减闭锁</div>
<div class="right"> <div class="right">
<div class="dot" :class="agcSub ? 'successColor' : 'errorColor'"></div> <div class="dot" :class="realDataList.activepowerdecdisabled ? 'successColor' : 'errorColor'"></div>
</div> </div>
</div> </div>
<div class="check"> <div class="check">
<div class="left">AGC可增有功</div> <div class="left">AGC可增有功</div>
<div class="right"> <div class="right">
<div class="num">5</div> <div class="num">{{ realDataList.activepowerinccapacity }}</div>
<div class="unit">MW</div> <div class="unit">MW</div>
</div> </div>
</div> </div>
<div class="check"> <div class="check">
<div class="left">AGC可减有功</div> <div class="left">AGC可减有功</div>
<div class="right"> <div class="right">
<div class="num">5</div> <div class="num">{{ realDataList.activepowerdeccapacity }}</div>
<div class="unit">MW</div> <div class="unit">MW</div>
</div> </div>
</div> </div>
@ -222,7 +222,7 @@
<div class="imgName">全场无功</div> <div class="imgName">全场无功</div>
</div> </div>
<div class="right"> <div class="right">
<div class="num">33</div> <div class="num">{{ realDataList.windfarmreactivepower }}</div>
<div class="unit">MVar</div> <div class="unit">MVar</div>
</div> </div>
</div> </div>
@ -232,7 +232,7 @@
<div class="imgName">AVC目标值</div> <div class="imgName">AVC目标值</div>
</div> </div>
<div class="right"> <div class="right">
<div class="num">6</div> <div class="num">{{ realDataListSetValue.AvcTarget }}</div>
<div class="unit">MVar</div> <div class="unit">MVar</div>
</div> </div>
</div> </div>
@ -240,8 +240,8 @@
<div class="left"> <div class="left">
<div class="name">AVC投入/退出</div> <div class="name">AVC投入/退出</div>
<div class="status"> <div class="status">
<div class="smallDot" :class="avcOnOff ? 'successColor' : 'defaultColor'"></div> <div class="smallDot" :class="realDataList.operationstatusavc ? 'successColor' : 'defaultColor'"></div>
<div class="smallDot" :class="avcOnOff ? 'defaultColor' : 'errorColor'"></div> <div class="smallDot" :class="realDataList.operationstatusavc ? 'defaultColor' : 'errorColor'"></div>
</div> </div>
</div> </div>
<div class="right"> <div class="right">
@ -266,26 +266,26 @@
<div class="check"> <div class="check">
<div class="left">AVC增闭锁</div> <div class="left">AVC增闭锁</div>
<div class="right"> <div class="right">
<div class="dot" :class="avcAdd ? 'successColor' : 'errorColor'"></div> <div class="dot" :class="realDataList.reactivepowerincdisabled ? 'successColor' : 'errorColor'"></div>
</div> </div>
</div> </div>
<div class="check"> <div class="check">
<div class="left">AVC减闭锁</div> <div class="left">AVC减闭锁</div>
<div class="right"> <div class="right">
<div class="dot" :class="avcSub ? 'successColor' : 'errorColor'"></div> <div class="dot" :class="realDataList.reactivepowerdecdisabled ? 'successColor' : 'errorColor'"></div>
</div> </div>
</div> </div>
<div class="check"> <div class="check">
<div class="left">AVC可增无功</div> <div class="left">AVC可增无功</div>
<div class="right"> <div class="right">
<div class="num">5</div> <div class="num">{{ realDataList.reactivepowerinccapacity }}</div>
<div class="unit">MVar</div> <div class="unit">MVar</div>
</div> </div>
</div> </div>
<div class="check"> <div class="check">
<div class="left">AVC可减无功</div> <div class="left">AVC可减无功</div>
<div class="right"> <div class="right">
<div class="num">5</div> <div class="num">{{ realDataList.reactivepowerdeccapacity }}</div>
<div class="unit">MVar</div> <div class="unit">MVar</div>
</div> </div>
</div> </div>
@ -306,7 +306,7 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { ref, onMounted, onUnmounted, nextTick } from 'vue' import { ref, onMounted, onUnmounted, nextTick, reactive } from 'vue'
import { getAirBlowerListReq } from '/@/api/backend/airBlower/request' import { getAirBlowerListReq } from '/@/api/backend/airBlower/request'
import { getRealValueListReq, getRealValueRangeReq } from '/@/api/backend/deviceModel/request' import { getRealValueListReq, getRealValueRangeReq } from '/@/api/backend/deviceModel/request'
import { getRealTimeState, getCutDecimalsValue, getEnumToValue } from '/@/views/backend/equipment/airBlower/utils' import { getRealTimeState, getCutDecimalsValue, getEnumToValue } from '/@/views/backend/equipment/airBlower/utils'
@ -770,7 +770,7 @@ const getRangeValueList = () => {
} }
}) })
} }
const getRealData = () => { const getRealDataForChart = () => {
const params = [ const params = [
{ {
deviceId: tableData.value[0].irn, deviceId: tableData.value[0].irn,
@ -784,13 +784,12 @@ const getRealData = () => {
} }
}) })
} }
let autoUpdateChartTimer: any = null let autoUpdateChartTimer: any = null
const autoUpdateChart = () => { const autoUpdateChart = () => {
if (!autoUpdateChartTimer) { if (!autoUpdateChartTimer) {
autoUpdateChartTimer = setInterval(() => { autoUpdateChartTimer = setInterval(() => {
getRealData() getRealDataForChart()
}, 1000) }, 1000)
} }
} }
@ -841,13 +840,13 @@ const infoList = ref([
const activeName = ref('list') const activeName = ref('list')
const handleClick = (tabName: any) => { const handleClick = (tabName: any) => {
if (tabName === 'chart') { if (tabName === 'chart') {
console.log(tabName); console.log(tabName)
stopAutoUpdate() stopAutoUpdate()
nextTick(() => { nextTick(() => {
createChart() createChart()
}) })
}else if( tabName === 'list'){ } else if (tabName === 'list') {
autoUpdateAirBlower() autoUpdateAirBlower()
} }
} }
@ -871,8 +870,58 @@ const stopAutoUpdate = () => {
timer && clearInterval(timer) timer && clearInterval(timer)
timer = null timer = null
} }
const realDataListSetValue = reactive({
AgcTarget: '0',
AvcTarget: '0',
})
const realDataList = reactive({
windfarmactivepower: '',
operationstatusagc: '',
RemoteCtrlStatusAgc: '',
activepowerincdisabled: '',
activepowerdecdisabled: '',
activepowerinccapacity: '',
activepowerdeccapacity: '',
windfarmreactivepower: '',
operationstatusavc: '',
RemoteCtrlStatusAvc: '',
reactivepowerincdisabled: '',
reactivepowerdecdisabled: '',
reactivepowerinccapacity: '',
reactivepowerdeccapacity: '',
})
const getRealDataForList = () => {
const deviceId = '1881630608594132993'
const attrs = Object.keys(realDataList) as (keyof typeof realDataList)[]
const params = [
{
deviceId,
attributes: attrs,
},
]
getRealValueListReq(params).then((res) => {
if (res.data) {
console.log(res.data, 'res.data')
const data = res.data[deviceId]
attrs.forEach((item) => {
realDataList[item] = data?.[item] ?? '-'
})
}
})
}
let listTimer: any = null
const autoUpdateList = () => {
if (!listTimer) {
getRealDataForList()
listTimer = setInterval(() => {
getRealDataForList()
}, 2000)
}
}
onMounted(() => { onMounted(() => {
getContainerHeight() getContainerHeight()
autoUpdateList()
autoUpdateAirBlower() autoUpdateAirBlower()
window.addEventListener('resize', resizeFn) window.addEventListener('resize', resizeFn)
}) })