能量:样式调整

实时数据:修改状态字段
单风机:修改状态字段
This commit is contained in:
高云鹏 2024-12-11 10:00:21 +08:00
parent e95e974547
commit 42b465f57f
5 changed files with 78 additions and 53 deletions

View File

@ -118,7 +118,7 @@
<div class="btnLeft"> <div class="btnLeft">
<el-button <el-button
@click="sendCommand('setTurbineFastStart')" @click="sendCommand('setTurbineFastStart')"
v-if="realTimeData.iturbineoperationmode !== 16" v-if="realTimeData.processedoperationmode !== 16"
class="control-btn" class="control-btn"
type="primary" type="primary"
>启动</el-button >启动</el-button
@ -356,7 +356,7 @@ let timer: any = null
let myTable = ref<TableInstance>() let myTable = ref<TableInstance>()
const overviewData = reactive({ const overviewData = reactive({
// iturbineoperationmode: '-', // processedoperationmode: '-',
iwindspeed: '-', iwindspeed: '-',
iwinddirection: '-', iwinddirection: '-',
igenspeed: '-', igenspeed: '-',
@ -963,12 +963,12 @@ const createScroll = () => {
} }
const realTimeData = ref<any>({ const realTimeData = ref<any>({
iturbineoperationmode: 1111, processedoperationmode: 1111,
locked: 0, locked: 0,
}) })
const realTimeDataState = computed(() => { const realTimeDataState = computed(() => {
switch (realTimeData.value.iturbineoperationmode) { switch (realTimeData.value.processedoperationmode) {
case 20: case 20:
return '并网' return '并网'
case 10: case 10:
@ -1015,7 +1015,7 @@ const createRealTimeData = async () => {
try { try {
const modelList: any = await getModelList() const modelList: any = await getModelList()
const realData: any = await getRealTimeData() const realData: any = await getRealTimeData()
realTimeData.value.iturbineoperationmode = getRealTimeState(realData) realTimeData.value.processedoperationmode = getRealTimeState(realData)
realTimeData.value.locked = realData.locked realTimeData.value.locked = realData.locked
temperatureChartsData[0].value = getCutDecimalsValue(realData.itempoutdoor_1sec) temperatureChartsData[0].value = getCutDecimalsValue(realData.itempoutdoor_1sec)

View File

@ -6,7 +6,14 @@
<div class="airBlowerList"> <div class="airBlowerList">
<div class="title">风机列表</div> <div class="title">风机列表</div>
<el-table class="table" :data="tableData"> <el-table class="table" :data="tableData">
<el-table-column v-for="item in tableColumn" :key="item.prop" :prop="item.prop" :label="item.label" align="center"> <el-table-column
v-for="item in tableColumn"
:key="item.prop"
:prop="item.prop"
:label="item.label"
align="center"
:width="item.width"
>
<template #default="scope"> <template #default="scope">
<div v-if="item.prop === 'iturbineoperationmode'"> <div v-if="item.prop === 'iturbineoperationmode'">
<el-tag v-if="scope.row.locked === 1" color="rgba(254,55,49,0.20)" style="color: #fe3731">已锁定</el-tag> <el-tag v-if="scope.row.locked === 1" color="rgba(254,55,49,0.20)" style="color: #fe3731">已锁定</el-tag>
@ -110,7 +117,7 @@
</div> </div>
</div> </div>
<div class="bottom"> <div class="bottom">
<el-input placeholder="本地目标值设置MW 请输入"> <el-input v-model="agcTargetValue" placeholder="本地目标值设置MW 请输入">
<template #suffix> <template #suffix>
<div class="saveBtn"></div> <div class="saveBtn"></div>
</template> </template>
@ -200,7 +207,7 @@
</div> </div>
</div> </div>
<div class="bottom"> <div class="bottom">
<el-input placeholder="本地目标值设置MW 请输入"> <el-input v-model="avcTargetValue" placeholder="本地目标值设置MW 请输入">
<template #suffix> <template #suffix>
<div class="saveBtn"></div> <div class="saveBtn"></div>
</template> </template>
@ -255,11 +262,13 @@ 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'
import { ElMessage, dayjs } from 'element-plus' import { ElMessage, dayjs } from 'element-plus'
import { debounce } from 'lodash-es'
import * as echarts from 'echarts' import * as echarts from 'echarts'
const agcOnoffSwitch = ref(true) const agcOnoffSwitch = ref(true)
const agcOnOff = ref(true) const agcOnOff = ref(true)
const agcLocalRemoteSwitch = ref(false) const agcLocalRemoteSwitch = ref(false)
const agcTargetValue = ref()
const agcAdd = ref(true) const agcAdd = ref(true)
const agcSub = ref(false) const agcSub = ref(false)
const agcRecordList = ref([ const agcRecordList = ref([
@ -273,6 +282,7 @@ const agcRecordList = ref([
const avcOnoffSwitch = ref(true) const avcOnoffSwitch = ref(true)
const avcOnOff = ref(false) const avcOnOff = ref(false)
const avcLocalRemoteSwitch = ref(false) const avcLocalRemoteSwitch = ref(false)
const avcTargetValue = ref()
const avcAdd = ref(true) const avcAdd = ref(true)
const avcSub = ref(false) const avcSub = ref(false)
const avcRecordList = ref([ const avcRecordList = ref([
@ -287,34 +297,42 @@ const tableColumn = [
{ {
label: '编号', label: '编号',
prop: 'name', prop: 'name',
width: '',
}, },
{ {
label: '风速m/s', label: '风速m/s',
prop: 'iwindspeed', prop: 'iwindspeed',
width: '',
}, },
{ {
label: '转速rmp', label: '转速rmp',
prop: 'igenspeed', prop: 'igenspeed',
width: '',
}, },
{ {
label: '有功kW', label: '有功kW',
prop: 'igenpower', prop: 'igenpower',
width: '',
}, },
{ {
label: '有功给定kW', label: '有功给定kW',
prop: 'iactivepowersetpointvalue', prop: 'iactivepowersetpointvalue',
width: '',
}, },
{ {
label: '无功kVar', label: '无功kVar',
prop: 'ireactivepower', prop: 'ireactivepower',
width: '',
}, },
{ {
label: '无功给定kVar', label: '无功给定kVar',
prop: 'ireactivepowersetpointvalue', prop: 'ireactivepowersetpointvalue',
width: '',
}, },
{ {
label: '状态', label: '状态',
prop: 'iturbineoperationmode', prop: 'iturbineoperationmode',
width: '',
}, },
] ]
@ -541,7 +559,6 @@ const createChartData = (data: { [k: string]: number }, time: string) => {
if (realDataSeries.length) { if (realDataSeries.length) {
const seriesItem = realDataSeries.find((series) => series.id === item) const seriesItem = realDataSeries.find((series) => series.id === item)
console.log(seriesItem, '------------------')
seriesItem.data.push(curVal) seriesItem.data.push(curVal)
return seriesItem return seriesItem
} else { } else {
@ -780,16 +797,23 @@ const getContainerHeight = () => {
containerHeight.value = `${height}px` containerHeight.value = `${height}px`
} }
} }
const resizeChart = debounce(() => {
chartInstance?.resize()
}, 500)
const resizeFn = () => {
resizeChart()
getContainerHeight()
}
onMounted(() => { onMounted(() => {
getContainerHeight() getContainerHeight()
autoUpdateAirBlower() autoUpdateAirBlower()
nextTick(() => { nextTick(() => {
createChart() createChart()
}) })
window.addEventListener('resize', getContainerHeight) window.addEventListener('resize', resizeFn)
}) })
onUnmounted(() => { onUnmounted(() => {
window.removeEventListener('resize', getContainerHeight) window.removeEventListener('resize', resizeFn)
timer && clearInterval(timer) timer && clearInterval(timer)
}) })
</script> </script>
@ -1000,6 +1024,7 @@ onUnmounted(() => {
@include record; @include record;
} }
.centerContainer { .centerContainer {
margin-bottom: 20px;
height: v-bind('containerHeight'); height: v-bind('containerHeight');
color: #4e5969; color: #4e5969;
.airBlowerList { .airBlowerList {
@ -1032,7 +1057,7 @@ onUnmounted(() => {
} }
.lineChart { .lineChart {
width: 100%; width: 100%;
height: calc(100% - 132px); height: calc(100% - 102px);
.chart { .chart {
width: 100%; width: 100%;
height: 100%; height: 100%;
@ -1043,7 +1068,7 @@ onUnmounted(() => {
flex-wrap: wrap; flex-wrap: wrap;
padding: 10px; padding: 10px;
width: 100%; width: 100%;
height: 100px; height: 70px;
background-color: #f0f6ff; background-color: #f0f6ff;
.infoItem { .infoItem {
display: flex; display: flex;

View File

@ -6,13 +6,13 @@
<div class="selectPart"> <div class="selectPart">
<span>{{ t('airBlower.status') }}</span> <span>{{ t('airBlower.status') }}</span>
<el-select <el-select
v-model="airBlowerSelect.iturbineoperationmode" v-model="airBlowerSelect.processedoperationmode"
@change="selectAirBlower('iturbineoperationmode')" @change="selectAirBlower('processedoperationmode')"
:placeholder="'请选择' + t('airBlower.status')" :placeholder="'请选择' + t('airBlower.status')"
class="airBlowerSelect" class="airBlowerSelect"
> >
<el-option <el-option
v-for="v in airBlowerSelectOptions.iturbineoperationmode" v-for="v in airBlowerSelectOptions.processedoperationmode"
:key="v.value" :key="v.value"
:label="v.label" :label="v.label"
:value="v.value" :value="v.value"
@ -87,39 +87,39 @@
/> />
<el-table-column v-else :label="item.label" :align="item.align" :width="item.width"> <el-table-column v-else :label="item.label" :align="item.align" :width="item.width">
<template v-if="item.custom === 'default'" #default="scope"> <template v-if="item.custom === 'default'" #default="scope">
<div v-if="item.prop === 'iturbineoperationmode'"> <div v-if="item.prop === 'processedoperationmode'">
<el-tag v-if="scope.row.locked === 1" color="rgba(254,55,49,0.20)" style="color: #fe3731">已锁定</el-tag> <el-tag v-if="scope.row.locked === 1" color="rgba(254,55,49,0.20)" style="color: #fe3731">已锁定</el-tag>
<el-tag v-if="scope.row.iturbineoperationmode === 20" color="rgba(0,100,170,0.20)" style="color: #0064aa" <el-tag v-if="scope.row.processedoperationmode === 20" color="rgba(0,100,170,0.20)" style="color: #0064aa"
>并网</el-tag >并网</el-tag
> >
<el-tag v-if="scope.row.iturbineoperationmode === 10" color="rgba(0,160,150,0.20)" style="color: #00a096" <el-tag v-if="scope.row.processedoperationmode === 10" color="rgba(0,160,150,0.20)" style="color: #00a096"
>维护</el-tag >维护</el-tag
> >
<el-tag v-if="scope.row.iturbineoperationmode === 8" color="rgba(255,126,0,0.20)" style="color: #ff7e00" <el-tag v-if="scope.row.processedoperationmode === 8" color="rgba(255,126,0,0.20)" style="color: #ff7e00"
>限功率运行</el-tag >限功率运行</el-tag
> >
<el-tag v-if="scope.row.iturbineoperationmode === 0" color="rgba(153,153,153,0.20)" style="color: #666666" <el-tag v-if="scope.row.processedoperationmode === 0" color="rgba(153,153,153,0.20)" style="color: #666666"
>离线</el-tag >离线</el-tag
> >
<el-tag v-if="scope.row.iturbineoperationmode === 16" color="rgba(6,180,41,0.20)" style="color: #06b429" <el-tag v-if="scope.row.processedoperationmode === 16" color="rgba(6,180,41,0.20)" style="color: #06b429"
>启动</el-tag >启动</el-tag
> >
<el-tag v-if="scope.row.iturbineoperationmode === 6" color="rgba(254,55,49,0.20)" style="color: #fe3731" <el-tag v-if="scope.row.processedoperationmode === 6" color="rgba(254,55,49,0.20)" style="color: #fe3731"
>正常停机</el-tag >正常停机</el-tag
> >
<el-tag v-if="scope.row.iturbineoperationmode === 1" color="rgba(254,55,49,0.20)" style="color: #fe3731" <el-tag v-if="scope.row.processedoperationmode === 1" color="rgba(254,55,49,0.20)" style="color: #fe3731"
>外部因素导致停机</el-tag >外部因素导致停机</el-tag
> >
<el-tag v-if="scope.row.iturbineoperationmode === 2" color="rgba(254,55,49,0.20)" style="color: #fe3731" <el-tag v-if="scope.row.processedoperationmode === 2" color="rgba(254,55,49,0.20)" style="color: #fe3731"
>停机</el-tag >停机</el-tag
> >
<el-tag v-if="scope.row.iturbineoperationmode === 11" color="rgba(255,182,0,0.20)" style="color: #ffb600" <el-tag v-if="scope.row.processedoperationmode === 11" color="rgba(255,182,0,0.20)" style="color: #ffb600"
>待机</el-tag >待机</el-tag
> >
<el-tag v-if="scope.row.iturbineoperationmode === 1110" color="rgba(153,153,153,0.20)" style="color: #666666" <el-tag v-if="scope.row.processedoperationmode === 1110" color="rgba(153,153,153,0.20)" style="color: #666666"
>解缆状态</el-tag >解缆状态</el-tag
> >
<el-tag v-if="scope.row.iturbineoperationmode === 1111" color="rgba(254,55,49,0.20)" style="color: #fe3731" <el-tag v-if="scope.row.processedoperationmode === 1111" color="rgba(254,55,49,0.20)" style="color: #fe3731"
>电网故障停机</el-tag >电网故障停机</el-tag
> >
</div> </div>
@ -226,12 +226,12 @@ const router = useRouter()
const { t } = useI18n() const { t } = useI18n()
const airBlowerSelect = reactive<SelectTypeObjType>({ const airBlowerSelect = reactive<SelectTypeObjType>({
iturbineoperationmode: 987654321, processedoperationmode: 987654321,
belongLine: '全部', belongLine: '全部',
}) })
const airBlowerSelectOptions = reactive<{ [K in SelectTypeKeyUnionType]: { label: string; value: string | number }[] }>({ const airBlowerSelectOptions = reactive<{ [K in SelectTypeKeyUnionType]: { label: string; value: string | number }[] }>({
iturbineoperationmode: [ processedoperationmode: [
{ {
label: '全部', label: '全部',
value: 987654321, value: 987654321,
@ -289,33 +289,33 @@ const airBlowerSelectOptions = reactive<{ [K in SelectTypeKeyUnionType]: { label
}) })
const selectAirBlower = (type: SelectTypeKeyUnionType) => { const selectAirBlower = (type: SelectTypeKeyUnionType) => {
if (airBlowerSelect.belongLine === '全部' && airBlowerSelect.iturbineoperationmode === 987654321) { if (airBlowerSelect.belongLine === '全部' && airBlowerSelect.processedoperationmode === 987654321) {
tableData.value = originTableData.value tableData.value = originTableData.value
return return
} else if (airBlowerSelect.belongLine !== '全部' && airBlowerSelect.iturbineoperationmode !== 987654321) { } else if (airBlowerSelect.belongLine !== '全部' && airBlowerSelect.processedoperationmode !== 987654321) {
if (type === 'iturbineoperationmode' && airBlowerSelect.iturbineoperationmode === 2) { if (type === 'processedoperationmode' && airBlowerSelect.processedoperationmode === 2) {
const type1 = originTableData.value.filter((item) => item.iturbineoperationmode === 1) const type1 = originTableData.value.filter((item) => item.processedoperationmode === 1)
const type6 = originTableData.value.filter((item) => item.iturbineoperationmode === 6) const type6 = originTableData.value.filter((item) => item.processedoperationmode === 6)
const type2 = originTableData.value.filter((item) => item.iturbineoperationmode === 2) const type2 = originTableData.value.filter((item) => item.processedoperationmode === 2)
const typeAll = [...type1, ...type6, ...type2] const typeAll = [...type1, ...type6, ...type2]
tableData.value = typeAll.filter((item) => item.belongLine === airBlowerSelect.belongLine) tableData.value = typeAll.filter((item) => item.belongLine === airBlowerSelect.belongLine)
return return
} }
const resData = originTableData.value.filter((item) => item.iturbineoperationmode === airBlowerSelect.iturbineoperationmode) const resData = originTableData.value.filter((item) => item.processedoperationmode === airBlowerSelect.processedoperationmode)
tableData.value = resData.filter((item) => item.belongLine === airBlowerSelect.belongLine) tableData.value = resData.filter((item) => item.belongLine === airBlowerSelect.belongLine)
return return
} else { } else {
if (type === 'belongLine' && airBlowerSelect.belongLine === '全部') { if (type === 'belongLine' && airBlowerSelect.belongLine === '全部') {
tableData.value = originTableData.value.filter((item) => item.iturbineoperationmode === airBlowerSelect.iturbineoperationmode) tableData.value = originTableData.value.filter((item) => item.processedoperationmode === airBlowerSelect.processedoperationmode)
return return
} else if (type === 'iturbineoperationmode' && airBlowerSelect.iturbineoperationmode === 987654321) { } else if (type === 'processedoperationmode' && airBlowerSelect.processedoperationmode === 987654321) {
tableData.value = originTableData.value.filter((item) => item.belongLine === airBlowerSelect.belongLine) tableData.value = originTableData.value.filter((item) => item.belongLine === airBlowerSelect.belongLine)
return return
} }
if (type === 'iturbineoperationmode' && airBlowerSelect.iturbineoperationmode === 2) { if (type === 'processedoperationmode' && airBlowerSelect.processedoperationmode === 2) {
const type1 = originTableData.value.filter((item) => item.iturbineoperationmode === 1) const type1 = originTableData.value.filter((item) => item.processedoperationmode === 1)
const type6 = originTableData.value.filter((item) => item.iturbineoperationmode === 6) const type6 = originTableData.value.filter((item) => item.processedoperationmode === 6)
const type2 = originTableData.value.filter((item) => item.iturbineoperationmode === 2) const type2 = originTableData.value.filter((item) => item.processedoperationmode === 2)
tableData.value = [...type1, ...type6, ...type2] tableData.value = [...type1, ...type6, ...type2]
return return
} }
@ -396,7 +396,7 @@ const defaultColumn: TableColumnType[] = [
}, },
{ {
label: '风机状态', label: '风机状态',
prop: 'iturbineoperationmode', prop: 'processedoperationmode',
align: 'center', align: 'center',
custom: 'default', custom: 'default',
width: 100, width: 100,
@ -522,7 +522,7 @@ const createTableReqParams = (airblowerList: { irn: string; name: string }[]) =>
airBlowerIds.push(item.irn) airBlowerIds.push(item.irn)
return { return {
deviceId: item.irn, deviceId: item.irn,
attributes: [...curTableKey, 'iturbineoperationmode', 'iyplevel', 'gridlostdetected', 'ibplevel'], attributes: [...curTableKey, 'processedoperationmode', 'iyplevel', 'gridlostdetected', 'ibplevel'],
} }
}) })
return { params, airBlowerInfo, airBlowerIds } return { params, airBlowerInfo, airBlowerIds }
@ -560,12 +560,12 @@ const getTableData = () => {
belongLine: airBlowerInfoObj[id].belongLine, belongLine: airBlowerInfoObj[id].belongLine,
deviceCode: airBlowerInfoObj[id].deviceCode, deviceCode: airBlowerInfoObj[id].deviceCode,
...realData, ...realData,
iturbineoperationmode: state, processedoperationmode: state,
} }
}) })
originTableData.value = data originTableData.value = data
if (airBlowerSelect.belongLine === '全部' && airBlowerSelect.iturbineoperationmode === 987654321) { if (airBlowerSelect.belongLine === '全部' && airBlowerSelect.processedoperationmode === 987654321) {
tableData.value = data tableData.value = data
} else { } else {
const irn = tableData.value.map((item) => item.irn) const irn = tableData.value.map((item) => item.irn)

View File

@ -1,5 +1,5 @@
export type SelectTypeObjType = { export type SelectTypeObjType = {
iturbineoperationmode?: number processedoperationmode?: number
belongLine: string belongLine: string
} }
export type SelectTypeKeyUnionType = keyof SelectTypeObjType export type SelectTypeKeyUnionType = keyof SelectTypeObjType
@ -12,7 +12,7 @@ export type TableDataObjType = {
name: string name: string
model: string model: string
iotModelId: string iotModelId: string
iturbineoperationmode: number processedoperationmode: number
belongLine: string belongLine: string
iwindspeed: string iwindspeed: string
igenpower: string igenpower: string

View File

@ -3,14 +3,14 @@ import { useEnumStore } from '/@/stores/enums'
const enumStore = useEnumStore() const enumStore = useEnumStore()
export const getRealTimeState = (data: any) => { export const getRealTimeState = (data: any) => {
if (data.iturbineoperationmode) { if (data.processedoperationmode) {
if (data.iturbineoperationmode > 1 && data.iturbineoperationmode < 6) { if (data.processedoperationmode > 1 && data.processedoperationmode < 6) {
return 2 return 2
} }
if (data.iturbineoperationmode === 21) { if (data.processedoperationmode === 21) {
return 20 return 20
} }
return data.iturbineoperationmode return data.processedoperationmode
} else if (data.iyplevel === 10) { } else if (data.iyplevel === 10) {
return 1110 return 1110
} else if (data.gridlostdetected === 1) { } else if (data.gridlostdetected === 1) {