ems接口、综合查询
This commit is contained in:
@ -24,6 +24,14 @@ export function getSiteAllDeviceCategory(siteId) {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
//EMS
|
||||||
|
export function getEmsDataList(siteId) {
|
||||||
|
return request({
|
||||||
|
url: `/ems/siteMonitor/getEmsDataList?siteId=${siteId}`,
|
||||||
|
method: 'get',
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
//获取pcs、实时运行头部的设备信息
|
//获取pcs、实时运行头部的设备信息
|
||||||
export function getRunningHeadInfo(siteId) {
|
export function getRunningHeadInfo(siteId) {
|
||||||
return request({
|
return request({
|
||||||
|
|||||||
@ -1,35 +1,224 @@
|
|||||||
<template>
|
<template>
|
||||||
<div v-loading="loading" class="ems">
|
<div v-loading="loading" class="ems">
|
||||||
<div
|
<!-- <div-->
|
||||||
v-for="(item, index) in list"
|
<!-- v-for="(item, index) in list"-->
|
||||||
:key="index + 'PcsHome'"
|
<!-- :key="index + 'PcsHome'"-->
|
||||||
style="margin-bottom: 25px"
|
<!-- style="margin-bottom: 25px"-->
|
||||||
>
|
<!-- >-->
|
||||||
|
<!-- <el-card-->
|
||||||
|
<!-- :class="{-->
|
||||||
|
<!-- 'warning-card-container': item.workStatus === '1',-->
|
||||||
|
<!-- 'timing-card-container': item.workStatus === '2',-->
|
||||||
|
<!-- 'running-card-container': !['1', '2'].includes(item.workStatus),-->
|
||||||
|
<!-- }"-->
|
||||||
|
<!-- class="sbjk-card-container common-card-container-body-no-padding common-card-container-no-title-bg"-->
|
||||||
|
<!-- shadow="always"-->
|
||||||
|
<!-- >-->
|
||||||
|
<!-- <!– 标题–>-->
|
||||||
|
<!-- <div slot="header">-->
|
||||||
|
<!-- <span class="large-title"-->
|
||||||
|
<!-- >{{ item.deviceName }}</span-->
|
||||||
|
<!-- >-->
|
||||||
|
<!-- <div class="info">-->
|
||||||
|
<!-- <div>-->
|
||||||
|
<!-- {{-->
|
||||||
|
<!-- $store.state.ems.workStatusOptions[item.workStatus]-->
|
||||||
|
<!-- }}-->
|
||||||
|
<!-- </div>-->
|
||||||
|
<!-- <div>数据更新时间:{{ item.dataUpdateTime }}</div>-->
|
||||||
|
<!-- </div>-->
|
||||||
|
<!-- <div class="alarm">-->
|
||||||
|
<!-- <el-button type="primary" size="small" style="margin-right:20px;" @click="pointDetail(item,'point')">-->
|
||||||
|
<!-- 详细-->
|
||||||
|
<!-- </el-button>-->
|
||||||
|
<!-- <el-badge :value="item.alarmNum || 0" class="item">-->
|
||||||
|
<!-- <i-->
|
||||||
|
<!-- class="el-icon-message-solid alarm-icon"-->
|
||||||
|
<!-- @click="pointDetail(item,'alarmPoint')"-->
|
||||||
|
<!-- ></i>-->
|
||||||
|
<!-- </el-badge>-->
|
||||||
|
<!-- </div>-->
|
||||||
|
<!-- </div>-->
|
||||||
|
<!-- <!– 工作状态–>-->
|
||||||
|
<!-- <div class="descriptions-main">-->
|
||||||
|
<!-- <el-descriptions :colon="false" :column="5" direction="vertical">-->
|
||||||
|
<!-- <el-descriptions-item-->
|
||||||
|
<!-- :contentClassName="`descriptions-direction ${-->
|
||||||
|
<!-- item.workStatus === '0' ? 'save' : 'danger'-->
|
||||||
|
<!-- }`"-->
|
||||||
|
<!-- :span="1"-->
|
||||||
|
<!-- label="工作状态"-->
|
||||||
|
<!-- labelClassName="descriptions-label"-->
|
||||||
|
<!-- >{{-->
|
||||||
|
<!-- $store.state.ems.workStatusOptions[item.workStatus]-->
|
||||||
|
<!-- }}-->
|
||||||
|
<!-- </el-descriptions-item-->
|
||||||
|
<!-- >-->
|
||||||
|
<!-- <el-descriptions-item-->
|
||||||
|
<!-- :span="1"-->
|
||||||
|
<!-- contentClassName="descriptions-direction"-->
|
||||||
|
<!-- label="工作模式"-->
|
||||||
|
<!-- labelClassName="descriptions-label"-->
|
||||||
|
<!-- >-->
|
||||||
|
<!-- todo 手动/自动-->
|
||||||
|
<!-- {{-->
|
||||||
|
<!-- $store.state.ems.gridStatusOptions[item.gridStatus]-->
|
||||||
|
<!-- }}-->
|
||||||
|
|
||||||
|
<!-- </el-descriptions-item-->
|
||||||
|
<!-- >-->
|
||||||
|
<!-- <el-descriptions-item-->
|
||||||
|
<!-- :span="1"-->
|
||||||
|
<!-- contentClassName="descriptions-direction"-->
|
||||||
|
<!-- label="并网状态"-->
|
||||||
|
<!-- labelClassName="descriptions-label"-->
|
||||||
|
<!-- >{{-->
|
||||||
|
<!-- $store.state.ems.gridStatusOptions[item.gridStatus]-->
|
||||||
|
<!-- }}-->
|
||||||
|
<!-- </el-descriptions-item-->
|
||||||
|
<!-- >-->
|
||||||
|
<!-- <el-descriptions-item-->
|
||||||
|
<!-- :span="1"-->
|
||||||
|
<!-- contentClassName="descriptions-direction"-->
|
||||||
|
<!-- label="告警状态"-->
|
||||||
|
<!-- labelClassName="descriptions-label"-->
|
||||||
|
<!-- >-->
|
||||||
|
<!-- todo-->
|
||||||
|
<!-- <!–-->
|
||||||
|
<!-- {{-->
|
||||||
|
<!-- $store.state.ems.warnOptions[item.warnMode]-->
|
||||||
|
<!-- }}–>-->
|
||||||
|
<!-- </el-descriptions-item-->
|
||||||
|
<!-- >-->
|
||||||
|
<!-- <el-descriptions-item-->
|
||||||
|
<!-- :contentClassName="`descriptions-direction ${-->
|
||||||
|
<!-- item.deviceStatus === '2' ? 'save' : 'danger'-->
|
||||||
|
<!-- }`"-->
|
||||||
|
<!-- :span="1"-->
|
||||||
|
<!-- label="设备状态"-->
|
||||||
|
<!-- labelClassName="descriptions-label"-->
|
||||||
|
<!-- >{{-->
|
||||||
|
<!-- $store.state.ems.deviceStatusOptions[item.deviceStatus]-->
|
||||||
|
<!-- }}-->
|
||||||
|
<!-- </el-descriptions-item-->
|
||||||
|
<!-- >-->
|
||||||
|
<!-- </el-descriptions>-->
|
||||||
|
<!-- </div>-->
|
||||||
|
<!-- <!– 用电量–>-->
|
||||||
|
<!-- <div class="descriptions-main descriptions-main-bg-color">-->
|
||||||
|
<!-- <el-descriptions :colon="false" :column="5" direction="vertical">-->
|
||||||
|
<!-- <el-descriptions-item-->
|
||||||
|
<!-- :span="5"-->
|
||||||
|
<!-- contentClassName="descriptions-direction"-->
|
||||||
|
<!-- label="当日用电量:"-->
|
||||||
|
<!-- labelClassName="descriptions-label"-->
|
||||||
|
<!-- >-->
|
||||||
|
<!-- </el-descriptions-item-->
|
||||||
|
<!-- >-->
|
||||||
|
<!-- <el-descriptions-item-->
|
||||||
|
<!-- :span="1"-->
|
||||||
|
<!-- contentClassName="descriptions-direction"-->
|
||||||
|
<!-- label="电网用电量"-->
|
||||||
|
<!-- labelClassName="descriptions-label"-->
|
||||||
|
<!-- >-->
|
||||||
|
<!-- </el-descriptions-item-->
|
||||||
|
<!-- >-->
|
||||||
|
<!-- <el-descriptions-item-->
|
||||||
|
<!-- :span="1"-->
|
||||||
|
<!-- contentClassName="descriptions-direction"-->
|
||||||
|
<!-- label="储能放电量"-->
|
||||||
|
<!-- labelClassName="descriptions-label"-->
|
||||||
|
<!-- >-->
|
||||||
|
<!-- </el-descriptions-item-->
|
||||||
|
<!-- >-->
|
||||||
|
<!-- <el-descriptions-item-->
|
||||||
|
<!-- :span="1"-->
|
||||||
|
<!-- contentClassName="descriptions-direction"-->
|
||||||
|
<!-- label="储能充电量"-->
|
||||||
|
<!-- labelClassName="descriptions-label"-->
|
||||||
|
<!-- >-->
|
||||||
|
<!-- </el-descriptions-item-->
|
||||||
|
<!-- >-->
|
||||||
|
|
||||||
|
<!-- <el-descriptions-item-->
|
||||||
|
<!-- :span="1"-->
|
||||||
|
<!-- contentClassName="descriptions-direction"-->
|
||||||
|
<!-- label="负荷用电量"-->
|
||||||
|
<!-- labelClassName="descriptions-label"-->
|
||||||
|
<!-- >-->
|
||||||
|
<!-- </el-descriptions-item-->
|
||||||
|
<!-- >-->
|
||||||
|
<!-- <el-descriptions-item-->
|
||||||
|
<!-- :span="1"-->
|
||||||
|
<!-- contentClassName="descriptions-direction"-->
|
||||||
|
<!-- label="光伏发电量"-->
|
||||||
|
<!-- labelClassName="descriptions-label"-->
|
||||||
|
<!-- >-->
|
||||||
|
<!-- </el-descriptions-item-->
|
||||||
|
<!-- >-->
|
||||||
|
<!-- </el-descriptions>-->
|
||||||
|
<!-- </div>-->
|
||||||
|
<!-- <!– 表格–>-->
|
||||||
|
<!-- <el-table-->
|
||||||
|
<!-- class="common-table"-->
|
||||||
|
<!-- stripe-->
|
||||||
|
<!-- style="width: 100%;margin-top:25px;">-->
|
||||||
|
<!-- <el-table-column-->
|
||||||
|
<!-- label="功率"-->
|
||||||
|
<!-- prop="type">-->
|
||||||
|
<!-- </el-table-column>-->
|
||||||
|
<!-- <el-table-column-->
|
||||||
|
<!-- label="电网"-->
|
||||||
|
<!-- >-->
|
||||||
|
<!-- <template slot-scope="scope">-->
|
||||||
|
<!-- <span class="pointer"-->
|
||||||
|
<!-- @click="showChart('簇电压',scope.row.clusterId)">{{ scope.row.clusterVoltage }} V</span>-->
|
||||||
|
<!-- </template>-->
|
||||||
|
<!-- </el-table-column>-->
|
||||||
|
<!-- <el-table-column-->
|
||||||
|
<!-- label="储能">-->
|
||||||
|
<!-- <template slot-scope="scope">-->
|
||||||
|
<!-- <span class="pointer"-->
|
||||||
|
<!-- @click="showChart('簇电流',scope.row.clusterId)">{{ scope.row.clusterCurrent }} A</span>-->
|
||||||
|
<!-- </template>-->
|
||||||
|
<!-- </el-table-column>-->
|
||||||
|
<!-- <el-table-column-->
|
||||||
|
<!-- label="负荷">-->
|
||||||
|
<!-- <template slot-scope="scope">-->
|
||||||
|
<!-- <span class="pointer"-->
|
||||||
|
<!-- @click="showChart('簇电流',scope.row.clusterId)">{{ scope.row.clusterCurrent }} A</span>-->
|
||||||
|
<!-- </template>-->
|
||||||
|
<!-- </el-table-column>-->
|
||||||
|
<!-- <el-table-column-->
|
||||||
|
<!-- label="光伏">-->
|
||||||
|
<!-- <template slot-scope="scope">-->
|
||||||
|
<!-- <span class="pointer"-->
|
||||||
|
<!-- @click="showChart('当前SOC',scope.row.clusterId)">{{ scope.row.currentSoc }} %</span>-->
|
||||||
|
<!-- </template>-->
|
||||||
|
<!-- </el-table-column>-->
|
||||||
|
<!-- </el-table>-->
|
||||||
|
<!-- <!– 图表–>-->
|
||||||
|
<!-- <div id="emsChart" style="height: 350px"></div>-->
|
||||||
|
<!-- </el-card>-->
|
||||||
|
<!-- </div>-->
|
||||||
<el-card
|
<el-card
|
||||||
:class="{
|
v-for="(item,index) in list"
|
||||||
'warning-card-container': item.workStatus === '1',
|
:key="index+'emsList'"
|
||||||
'timing-card-container': item.workStatus === '2',
|
class="sbjk-card-container list running-card-container"
|
||||||
'running-card-container': !['1', '2'].includes(item.workStatus),
|
|
||||||
}"
|
|
||||||
class="sbjk-card-container common-card-container-body-no-padding common-card-container-no-title-bg"
|
|
||||||
shadow="always"
|
shadow="always"
|
||||||
>
|
>
|
||||||
<!-- 标题-->
|
|
||||||
<div slot="header">
|
<div slot="header">
|
||||||
<span class="large-title"
|
<span class="large-title">{{ item.deviceName }}</span>
|
||||||
>{{ item.deviceName }}</span
|
|
||||||
>
|
|
||||||
<div class="info">
|
<div class="info">
|
||||||
<div>
|
<div>
|
||||||
{{
|
EMS控制模式: {{
|
||||||
$store.state.ems.workStatusOptions[item.workStatus]
|
item.emsStatus === 0 ? '自动' : '手动'
|
||||||
}}
|
}}
|
||||||
</div>
|
</div>
|
||||||
<div>数据更新时间:{{ item.dataUpdateTime }}</div>
|
<div>数据更新时间:{{ item.dataUpdateTime }}</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="alarm">
|
<div class="alarm">
|
||||||
<el-button type="primary" size="small" style="margin-right:20px;" @click="pointDetail(item,'point')">
|
<el-button size="small" style="margin-right:20px;" type="primary" @click="pointDetail(item,'point')">详细
|
||||||
详细
|
|
||||||
</el-button>
|
</el-button>
|
||||||
<el-badge :value="item.alarmNum || 0" class="item">
|
<el-badge :value="item.alarmNum || 0" class="item">
|
||||||
<i
|
<i
|
||||||
@ -39,168 +228,26 @@
|
|||||||
</el-badge>
|
</el-badge>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<!-- 工作状态-->
|
<el-row class="device-info-row">
|
||||||
<div class="descriptions-main">
|
<el-col v-for="(tempDataItem,tempDataIndex) in bmsDataList" :key="tempDataIndex+'bmsTempData'"
|
||||||
<el-descriptions :colon="false" :column="5" direction="vertical">
|
:span="6" class="device-info-col">
|
||||||
<el-descriptions-item
|
<span class="pointer" @click="showChart(tempDataItem.name,item.deviceId)">
|
||||||
:contentClassName="`descriptions-direction ${
|
<span class="left">{{ tempDataItem.name }}</span> <span class="right">{{ item[tempDataItem.attr] }}<span
|
||||||
item.workStatus === '0' ? 'save' : 'danger'
|
v-html="tempDataItem.unit"></span></span>
|
||||||
}`"
|
</span>
|
||||||
:span="1"
|
</el-col>
|
||||||
label="工作状态"
|
</el-row>
|
||||||
labelClassName="descriptions-label"
|
<el-row class="device-info-row" style="margin-top:20px;">
|
||||||
>{{
|
<el-col v-for="(tempDataItem,tempDataIndex) in pcsDataList" :key="tempDataIndex+'pcsTempData'"
|
||||||
$store.state.ems.workStatusOptions[item.workStatus]
|
:span="6" class="device-info-col">
|
||||||
}}
|
<span class="pointer" @click="showChart(tempDataItem.name,item.deviceId)">
|
||||||
</el-descriptions-item
|
<span class="left">{{ tempDataItem.name }}</span> <span class="right">{{ item[tempDataItem.attr] }}<span
|
||||||
>
|
v-html="tempDataItem.unit"></span></span>
|
||||||
<el-descriptions-item
|
</span>
|
||||||
:span="1"
|
</el-col>
|
||||||
contentClassName="descriptions-direction"
|
</el-row>
|
||||||
label="工作模式"
|
|
||||||
labelClassName="descriptions-label"
|
|
||||||
>
|
|
||||||
todo 手动/自动
|
|
||||||
{{
|
|
||||||
$store.state.ems.gridStatusOptions[item.gridStatus]
|
|
||||||
}}
|
|
||||||
|
|
||||||
</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item
|
|
||||||
:span="1"
|
|
||||||
contentClassName="descriptions-direction"
|
|
||||||
label="并网状态"
|
|
||||||
labelClassName="descriptions-label"
|
|
||||||
>{{
|
|
||||||
$store.state.ems.gridStatusOptions[item.gridStatus]
|
|
||||||
}}
|
|
||||||
</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item
|
|
||||||
:span="1"
|
|
||||||
contentClassName="descriptions-direction"
|
|
||||||
label="告警状态"
|
|
||||||
labelClassName="descriptions-label"
|
|
||||||
>
|
|
||||||
todo
|
|
||||||
<!--
|
|
||||||
{{
|
|
||||||
$store.state.ems.warnOptions[item.warnMode]
|
|
||||||
}}-->
|
|
||||||
</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item
|
|
||||||
:contentClassName="`descriptions-direction ${
|
|
||||||
item.deviceStatus === '2' ? 'save' : 'danger'
|
|
||||||
}`"
|
|
||||||
:span="1"
|
|
||||||
label="设备状态"
|
|
||||||
labelClassName="descriptions-label"
|
|
||||||
>{{
|
|
||||||
$store.state.ems.deviceStatusOptions[item.deviceStatus]
|
|
||||||
}}
|
|
||||||
</el-descriptions-item
|
|
||||||
>
|
|
||||||
</el-descriptions>
|
|
||||||
</div>
|
|
||||||
<!-- 用电量-->
|
|
||||||
<div class="descriptions-main descriptions-main-bg-color">
|
|
||||||
<el-descriptions :colon="false" :column="5" direction="vertical">
|
|
||||||
<el-descriptions-item
|
|
||||||
:span="5"
|
|
||||||
contentClassName="descriptions-direction"
|
|
||||||
label="当日用电量:"
|
|
||||||
labelClassName="descriptions-label"
|
|
||||||
>
|
|
||||||
</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item
|
|
||||||
:span="1"
|
|
||||||
contentClassName="descriptions-direction"
|
|
||||||
label="电网用电量"
|
|
||||||
labelClassName="descriptions-label"
|
|
||||||
>
|
|
||||||
</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item
|
|
||||||
:span="1"
|
|
||||||
contentClassName="descriptions-direction"
|
|
||||||
label="储能放电量"
|
|
||||||
labelClassName="descriptions-label"
|
|
||||||
>
|
|
||||||
</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item
|
|
||||||
:span="1"
|
|
||||||
contentClassName="descriptions-direction"
|
|
||||||
label="储能充电量"
|
|
||||||
labelClassName="descriptions-label"
|
|
||||||
>
|
|
||||||
</el-descriptions-item
|
|
||||||
>
|
|
||||||
|
|
||||||
<el-descriptions-item
|
|
||||||
:span="1"
|
|
||||||
contentClassName="descriptions-direction"
|
|
||||||
label="负荷用电量"
|
|
||||||
labelClassName="descriptions-label"
|
|
||||||
>
|
|
||||||
</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item
|
|
||||||
:span="1"
|
|
||||||
contentClassName="descriptions-direction"
|
|
||||||
label="光伏发电量"
|
|
||||||
labelClassName="descriptions-label"
|
|
||||||
>
|
|
||||||
</el-descriptions-item
|
|
||||||
>
|
|
||||||
</el-descriptions>
|
|
||||||
</div>
|
|
||||||
<!-- 表格-->
|
|
||||||
<el-table
|
|
||||||
class="common-table"
|
|
||||||
stripe
|
|
||||||
style="width: 100%;margin-top:25px;">
|
|
||||||
<el-table-column
|
|
||||||
label="功率"
|
|
||||||
prop="type">
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column
|
|
||||||
label="电网"
|
|
||||||
>
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<span class="pointer"
|
|
||||||
@click="showChart('簇电压',scope.row.clusterId)">{{ scope.row.clusterVoltage }} V</span>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column
|
|
||||||
label="储能">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<span class="pointer"
|
|
||||||
@click="showChart('簇电流',scope.row.clusterId)">{{ scope.row.clusterCurrent }} A</span>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column
|
|
||||||
label="负荷">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<span class="pointer"
|
|
||||||
@click="showChart('簇电流',scope.row.clusterId)">{{ scope.row.clusterCurrent }} A</span>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column
|
|
||||||
label="光伏">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<span class="pointer"
|
|
||||||
@click="showChart('当前SOC',scope.row.clusterId)">{{ scope.row.currentSoc }} %</span>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
</el-table>
|
|
||||||
<!-- 图表-->
|
|
||||||
<div id="emsChart" style="height: 350px"></div>
|
|
||||||
</el-card>
|
</el-card>
|
||||||
</div>
|
|
||||||
<el-empty v-show="list.length <= 0" :image-size="200"></el-empty>
|
<el-empty v-show="list.length <= 0" :image-size="200"></el-empty>
|
||||||
<point-chart ref="pointChart" :site-id="siteId"/>
|
<point-chart ref="pointChart" :site-id="siteId"/>
|
||||||
<point-table ref="pointTable"/>
|
<point-table ref="pointTable"/>
|
||||||
@ -211,7 +258,7 @@
|
|||||||
import pointChart from "./../PointChart.vue";
|
import pointChart from "./../PointChart.vue";
|
||||||
import PointTable from "@/views/ems/site/sblb/PointTable.vue";
|
import PointTable from "@/views/ems/site/sblb/PointTable.vue";
|
||||||
import getQuerySiteId from "@/mixins/ems/getQuerySiteId";
|
import getQuerySiteId from "@/mixins/ems/getQuerySiteId";
|
||||||
import {getPcsDetailInfo} from "@/api/ems/dzjk";
|
import {getEmsDataList} from "@/api/ems/dzjk";
|
||||||
import intervalUpdate from "@/mixins/ems/intervalUpdate";
|
import intervalUpdate from "@/mixins/ems/intervalUpdate";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
@ -222,21 +269,53 @@ export default {
|
|||||||
return {
|
return {
|
||||||
loading: false,
|
loading: false,
|
||||||
list: [],
|
list: [],
|
||||||
|
bmsDataList: [{
|
||||||
|
name: 'BMS1SOC',
|
||||||
|
attr: 'bms1Soc'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'BMS2SOC',
|
||||||
|
attr: 'bms2Soc'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'BMS3SOC',
|
||||||
|
attr: 'bms3Soc'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'BMS4SOC',
|
||||||
|
attr: 'bms4Soc'
|
||||||
|
}],
|
||||||
|
pcsDataList: [{
|
||||||
|
name: 'PCS-1有功功率',
|
||||||
|
attr: 'pcs1Yggl'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'PCS-2有功功率',
|
||||||
|
attr: 'pcs2Yggl'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'PCS-3有功功率',
|
||||||
|
attr: 'pcs3Yggl'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'PCS-4有功功率',
|
||||||
|
attr: 'pcs4Yggl'
|
||||||
|
}]
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
// 查看设备电位表格
|
// 查看设备电位表格
|
||||||
pointDetail(row, dataType) {
|
pointDetail(row, dataType) {
|
||||||
const {deviceId} = row
|
const {deviceId} = row
|
||||||
this.$refs.pointTable.showTable({siteId: this.siteId, deviceId, deviceCategory: 'PCS'}, dataType)
|
this.$refs.pointTable.showTable({siteId: this.siteId, deviceId, deviceCategory: 'EMS'}, dataType)
|
||||||
},
|
},
|
||||||
showChart(pointName, deviceId, isBranch = false) {
|
showChart(pointName, deviceId) {
|
||||||
pointName &&
|
pointName &&
|
||||||
this.$refs.pointChart.showChart({pointName, deviceCategory: isBranch ? 'BRANCH' : 'PCS', deviceId});
|
this.$refs.pointChart.showChart({pointName, deviceCategory: 'EMS', deviceId});
|
||||||
},
|
},
|
||||||
getPcsList() {
|
getData() {
|
||||||
this.loading = true;
|
this.loading = true;
|
||||||
getPcsDetailInfo(this.siteId)
|
getEmsDataList(this.siteId)
|
||||||
.then((response) => {
|
.then((response) => {
|
||||||
const data = response?.data || {};
|
const data = response?.data || {};
|
||||||
this.list = JSON.parse(JSON.stringify(data));
|
this.list = JSON.parse(JSON.stringify(data));
|
||||||
@ -244,7 +323,7 @@ export default {
|
|||||||
.finally(() => (this.loading = false));
|
.finally(() => (this.loading = false));
|
||||||
},
|
},
|
||||||
updateData() {
|
updateData() {
|
||||||
this.getPcsList();
|
this.getData();
|
||||||
},
|
},
|
||||||
init() {
|
init() {
|
||||||
this.updateData();
|
this.updateData();
|
||||||
|
|||||||
@ -97,18 +97,14 @@
|
|||||||
<script>
|
<script>
|
||||||
import * as echarts from "echarts";
|
import * as echarts from "echarts";
|
||||||
import resize from "@/mixins/ems/resize";
|
import resize from "@/mixins/ems/resize";
|
||||||
import { getAllSites } from "@/api/ems/zddt";
|
import {getAllSites} from "@/api/ems/zddt";
|
||||||
import {
|
import {getAllBatteryIdsBySites, getAllDeviceCategory, getPointValueList, pointFuzzyQuery,} from "@/api/ems/search";
|
||||||
getAllDeviceCategory,
|
|
||||||
getPointValueList,
|
|
||||||
pointFuzzyQuery,
|
|
||||||
getAllBatteryIdsBySites,
|
|
||||||
} from "@/api/ems/search";
|
|
||||||
import DateTimeSelect from "./DateTimeSelect.vue";
|
import DateTimeSelect from "./DateTimeSelect.vue";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "Search",
|
name: "Search",
|
||||||
mixins: [resize],
|
mixins: [resize],
|
||||||
components: { DateTimeSelect },
|
components: {DateTimeSelect},
|
||||||
computed: {
|
computed: {
|
||||||
isDtdc() {
|
isDtdc() {
|
||||||
return this.form.deviceCategory === "BATTERY";
|
return this.form.deviceCategory === "BATTERY";
|
||||||
@ -161,7 +157,7 @@ export default {
|
|||||||
getChildList() {
|
getChildList() {
|
||||||
this.childOptions = [];
|
this.childOptions = [];
|
||||||
this.form.child = [];
|
this.form.child = [];
|
||||||
const { siteIds } = this.form;
|
const {siteIds} = this.form;
|
||||||
getAllBatteryIdsBySites([siteIds]).then((response) => {
|
getAllBatteryIdsBySites([siteIds]).then((response) => {
|
||||||
const data = response?.data || {};
|
const data = response?.data || {};
|
||||||
const base = 50;
|
const base = 50;
|
||||||
@ -214,11 +210,27 @@ export default {
|
|||||||
this.getDate();
|
this.getDate();
|
||||||
},
|
},
|
||||||
setOption(data) {
|
setOption(data) {
|
||||||
|
// 点位类型 dataType 1-瞬时值 2-累计值 仅当值为2展示差值
|
||||||
|
// 图表类型 chartType 1-曲线图,2-箱线图
|
||||||
if (!this.chart) return;
|
if (!this.chart) return;
|
||||||
this.chart.clear();
|
this.chart.clear();
|
||||||
console.log("返回的数据", data);
|
console.log("返回的数据", data);
|
||||||
|
if (!data || data.length <= 0) {
|
||||||
|
this.$message.warning("暂无数据");
|
||||||
|
}
|
||||||
|
console.log('展示的图表类型chartType', data[0].chartType)
|
||||||
|
|
||||||
|
if (data[0].chartType === 2) {
|
||||||
|
// 箱型图
|
||||||
|
this.setBoxOption(data)
|
||||||
|
} else {
|
||||||
|
//折线图
|
||||||
|
this.setLineOption(data)
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
setLineOption(data) {
|
||||||
let dataset = [];
|
let dataset = [];
|
||||||
if (data.length > 0) {
|
|
||||||
data.forEach((item, index) => {
|
data.forEach((item, index) => {
|
||||||
item.deviceList.forEach((inner) => {
|
item.deviceList.forEach((inner) => {
|
||||||
dataset.push({
|
dataset.push({
|
||||||
@ -231,14 +243,14 @@ export default {
|
|||||||
markPoint: {
|
markPoint: {
|
||||||
symbolSize: 30,
|
symbolSize: 30,
|
||||||
emphasis: {
|
emphasis: {
|
||||||
disabled:false//打开 鼠标高亮
|
disabled: false//打开 鼠标高亮
|
||||||
},
|
},
|
||||||
data: [//最大值、最小值
|
data: [//最大值、最小值
|
||||||
{
|
{
|
||||||
// type: 'max',
|
// type: 'max',
|
||||||
name: `最大值`,
|
name: `最大值`,
|
||||||
coord:[inner.maxDate,inner.maxValue],
|
coord: [inner.maxDate, inner.maxValue],
|
||||||
relativeTo:'coordinate',
|
relativeTo: 'coordinate',
|
||||||
label: {
|
label: {
|
||||||
position: "top",
|
position: "top",
|
||||||
formatter: item.dataType === 2 ? ([
|
formatter: item.dataType === 2 ? ([
|
||||||
@ -254,8 +266,8 @@ export default {
|
|||||||
{
|
{
|
||||||
// type: 'min',
|
// type: 'min',
|
||||||
name: `最小值`,
|
name: `最小值`,
|
||||||
coord:[inner.minDate,inner.minValue],
|
coord: [inner.minDate, inner.minValue],
|
||||||
relativeTo:'coordinate',
|
relativeTo: 'coordinate',
|
||||||
label: {
|
label: {
|
||||||
position: "top",
|
position: "top",
|
||||||
formatter: item.dataType === 2 ? ([
|
formatter: item.dataType === 2 ? ([
|
||||||
@ -280,10 +292,7 @@ export default {
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
} else {
|
console.log("折线图图表数据", dataset);
|
||||||
this.$message.warning("暂无数据");
|
|
||||||
}
|
|
||||||
console.log("图表数据", dataset);
|
|
||||||
this.chart.setOption({
|
this.chart.setOption({
|
||||||
legend: {
|
legend: {
|
||||||
// left: 'center',
|
// left: 'center',
|
||||||
@ -305,7 +314,121 @@ export default {
|
|||||||
textStyle: {
|
textStyle: {
|
||||||
color: "#333333",
|
color: "#333333",
|
||||||
},
|
},
|
||||||
xAxis: { type: "category", data: dataset?.[0]?.xdata || [] },
|
xAxis: {type: "category", data: dataset?.[0]?.xdata || []},
|
||||||
|
yAxis: {
|
||||||
|
type: "value",
|
||||||
|
},
|
||||||
|
dataZoom: [
|
||||||
|
{
|
||||||
|
type: "inside",
|
||||||
|
start: 0,
|
||||||
|
end: 100,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
start: 0,
|
||||||
|
end: 100,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
series: dataset,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
setBoxOption(data) {
|
||||||
|
let dataset = [];
|
||||||
|
data.forEach((item, index) => {
|
||||||
|
item.deviceList.forEach((inner) => {
|
||||||
|
dataset.push({
|
||||||
|
name: `${
|
||||||
|
this.isDtdc
|
||||||
|
? `${inner.parentDeviceId ? inner.parentDeviceId + "-" : ""}`
|
||||||
|
: ""
|
||||||
|
}${inner.deviceId}`,
|
||||||
|
type: "boxplot",
|
||||||
|
// markPoint: {
|
||||||
|
// symbolSize: 30,
|
||||||
|
// emphasis: {
|
||||||
|
// disabled: false//打开 鼠标高亮
|
||||||
|
// },
|
||||||
|
// data: [//最大值、最小值
|
||||||
|
// {
|
||||||
|
// // type: 'max',
|
||||||
|
// name: `最大值`,
|
||||||
|
// coord: [inner.maxDate, inner.maxValue],
|
||||||
|
// relativeTo: 'coordinate',
|
||||||
|
// label: {
|
||||||
|
// position: "top",
|
||||||
|
// formatter: item.dataType === 2 ? ([
|
||||||
|
// `最大值:${inner.maxValue}`,
|
||||||
|
// // `平均值:${inner.avgValue}`,
|
||||||
|
// `差值:${inner.diffValue}`,
|
||||||
|
// ]).join('\n') : ([
|
||||||
|
// `最大值:${inner.maxValue}`,
|
||||||
|
// // `平均值:${inner.avgValue}`,
|
||||||
|
// ]).join('\n'),
|
||||||
|
// },
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// // type: 'min',
|
||||||
|
// name: `最小值`,
|
||||||
|
// coord: [inner.minDate, inner.minValue],
|
||||||
|
// relativeTo: 'coordinate',
|
||||||
|
// label: {
|
||||||
|
// position: "top",
|
||||||
|
// formatter: item.dataType === 2 ? ([
|
||||||
|
// `最小值:${inner.minValue}`,
|
||||||
|
// // `平均值:${inner.avgValue}`,
|
||||||
|
// `差值:${inner.diffValue}`,
|
||||||
|
// ]).join('\n') : ([
|
||||||
|
// `最小值:${inner.minValue}`,
|
||||||
|
// // `平均值:${inner.avgValue}`,
|
||||||
|
// ]).join('\n'),
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
// ]
|
||||||
|
// },
|
||||||
|
xdata: [],
|
||||||
|
data: [],
|
||||||
|
});
|
||||||
|
const length = dataset.length;
|
||||||
|
inner.pointValueList.forEach((value) => {
|
||||||
|
const {valueDate, min, q1, median, q3, max} = value
|
||||||
|
dataset[length - 1].xdata.push(valueDate);
|
||||||
|
dataset[length - 1].data.push([min, q1, median, q3, max]);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
console.log("箱型图图表数据", dataset);
|
||||||
|
this.chart.setOption({
|
||||||
|
legend: {
|
||||||
|
// left: 'center',
|
||||||
|
// top: '10',
|
||||||
|
},
|
||||||
|
grid: {
|
||||||
|
containLabel: true,
|
||||||
|
},
|
||||||
|
tooltip: {
|
||||||
|
trigger: 'item',
|
||||||
|
formatter: function (params) {
|
||||||
|
console.log(11111111111, params.data)
|
||||||
|
let data = params.data;
|
||||||
|
let result = params.name + ' ' + params.seriesName + '<br/>';
|
||||||
|
result += '最小值: ' + data[1] + '<br/>';
|
||||||
|
result += '平均值: ' + data[3] + '<br/>';
|
||||||
|
result += '最大值: ' + data[5];
|
||||||
|
return result;
|
||||||
|
}
|
||||||
|
// trigger: "axis",
|
||||||
|
// axisPointer: {
|
||||||
|
// type: 'cross',
|
||||||
|
// },
|
||||||
|
// axisPointer: {
|
||||||
|
// // 坐标轴指示器,坐标轴触发有效
|
||||||
|
// type: "shadow", // 默认为直线,可选为:'line' | 'shadow'
|
||||||
|
// },
|
||||||
|
},
|
||||||
|
textStyle: {
|
||||||
|
color: "#333333",
|
||||||
|
},
|
||||||
|
xAxis: {type: "category", data: dataset?.[0]?.xdata || []},
|
||||||
yAxis: {
|
yAxis: {
|
||||||
type: "value",
|
type: "value",
|
||||||
},
|
},
|
||||||
@ -346,7 +469,7 @@ export default {
|
|||||||
const data = response?.data || [];
|
const data = response?.data || [];
|
||||||
cb(
|
cb(
|
||||||
data.map((item) => {
|
data.map((item) => {
|
||||||
return { name: item, value: item };
|
return {name: item, value: item};
|
||||||
})
|
})
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
@ -362,7 +485,8 @@ export default {
|
|||||||
.then((response) => {
|
.then((response) => {
|
||||||
this.siteList = response.data || [];
|
this.siteList = response.data || [];
|
||||||
})
|
})
|
||||||
.finally(() => {});
|
.finally(() => {
|
||||||
|
});
|
||||||
},
|
},
|
||||||
getDate() {
|
getDate() {
|
||||||
this.$refs.form.validate((valid) => {
|
this.$refs.form.validate((valid) => {
|
||||||
|
|||||||
Reference in New Issue
Block a user