20 Commits

Author SHA1 Message Date
29ab53056a 故障告警,搜索栏 告警等级宽度调整 2026-01-29 19:57:10 +08:00
5250db915f Merge branch 'develop' of http://101.43.41.9:13000/xzzn/emsfront into develop 2026-01-28 21:36:14 +08:00
814103c881 统计报表优化 2026-01-28 21:34:58 +08:00
55b7fba021 修改图片 2026-01-27 16:58:50 +08:00
da4ecc4792 修改顺序 2026-01-27 13:45:14 +08:00
498dc117f2 变更图片 2026-01-27 10:43:54 +08:00
4d29de93a1 大数据图片更新 2026-01-26 23:30:01 +08:00
445e9dfc9f 大数据图片改为切换模式 2026-01-26 22:40:57 +08:00
ac1d1ae154 更新workStatus状态枚举 2026-01-25 16:45:33 +08:00
825243e741 电池簇备注 2026-01-25 16:36:23 +08:00
0389ed85f3 Merge branch 'develop' of http://101.43.41.9:13000/xzzn/emsfront into develop 2026-01-25 16:33:00 +08:00
aef94f406a 电池簇、电池堆工作状态更新 2026-01-25 16:30:43 +08:00
95d69fb7b1 簇枚举变更 2026-01-25 16:27:35 +08:00
684002ffc8 簇枚举变更 2026-01-25 15:12:07 +08:00
098dfa05f8 簇枚举变更 2026-01-25 14:34:01 +08:00
d6c9310e50 净置改成静置 2026-01-25 13:54:23 +08:00
142de3102b 大数据图片更新 2026-01-24 21:14:43 +08:00
9b5806a2c0 0或没有返回值隐藏alarmNum的展示 2026-01-24 10:27:43 +08:00
2b6697fa5a pointName改成 dataPointName 2026-01-24 10:02:11 +08:00
3bb859b693 BMS电池簇数据同步 2026-01-23 22:32:12 +08:00
20 changed files with 652 additions and 651 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 MiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 11 MiB

After

Width:  |  Height:  |  Size: 11 MiB

View File

@ -1,8 +1,32 @@
<template> <template>
<el-dialog :fullscreen="true" :append-to-body="true" :visible.sync="show" :show-close="false" top="0" <el-dialog
custom-class="big-data-dialog"> :fullscreen="true"
<img src="@/assets/images/ems/bigData.png" alt=""> :append-to-body="true"
<div class="close-btn" @click="show=false"> :visible.sync="show"
:show-close="false"
top="0"
custom-class="big-data-dialog"
>
<div class="swiper-container">
<div class="swiper-icon left-icon" v-show="imgIndex > 0">
<i class="el-icon-d-arrow-left icon" @click="toLeft"></i>
</div>
<div v-show="showRightIcon" class="swiper-icon right-icon">
<i class="el-icon-d-arrow-right icon" @click="toRight"></i>
</div>
<div
class="img-container"
:style="{ transform: 'translateX(' + imgIndex * -100 + 'vw)' }"
>
<img
v-for="index in maxImgNumber"
:key="'swiperImg' + index"
:src="require(`@/assets/images/ems/bigData-${index}.png`)"
alt=""
/>
</div>
</div>
<div class="close-btn" @click="show = false">
<i class="el-icon-close"></i> <i class="el-icon-close"></i>
</div> </div>
</el-dialog> </el-dialog>
@ -14,15 +38,54 @@
top: 10px; top: 10px;
font-size: 23px; font-size: 23px;
line-height: 20px; line-height: 20px;
color: rgba(176, 228, 255, 0.7); color: rgba(217, 242, 255, 1);
cursor: pointer; cursor: pointer;
} }
.swiper-container {
img { height: 100%;
height: 100vh; width: 100%;
width: 100vw; overflow: hidden;
display: block; position: relative;
margin: 0; .swiper-icon {
color: rgba(217, 242, 255, 1);
position: absolute;
top: 50%;
transform: translateY(-50%);
z-index: 20;
cursor: pointer;
font-size: 30px;
padding: 20px;
background: transparent;
&.left-icon {
left: 20px;
}
&.right-icon {
right: 20px;
}
&:hover {
.icon {
opacity: 1;
}
}
.icon {
transition: all 0.6s;
opacity: 0;
}
}
.img-container {
height: 100%;
transition: all 1s;
display: flex;
flex-direction: row;
z-index: 0;
img {
width: 100vw;
height: 100vh;
display: block;
margin: 0;
flex-shrink: 0;
}
}
} }
</style> </style>
<style lang="scss"> <style lang="scss">
@ -42,8 +105,33 @@ img {
export default { export default {
data() { data() {
return { return {
show: false show: false,
} imgIndex: 0,
} maxImgNumber: 3,
} };
</script> },
computed: {
showRightIcon() {
return this.imgIndex < this.maxImgNumber - 1;
},
},
watch: {
show: {
handler(newValue) {
if (!newValue) this.imgIndex = 0;
},
immediate: true,
},
},
methods: {
toLeft() {
if (this.imgIndex === 0) return;
this.imgIndex -= 1;
},
toRight() {
if (this.imgIndex >= this.maxImgNumber - 1) return;
this.imgIndex += 1;
},
},
};
</script>

View File

@ -5,9 +5,17 @@ const ems = {
dzjkAlarmLighting: false,//单站监控 告警统计红点标志 dzjkAlarmLighting: false,//单站监控 告警统计红点标志
zdList: [], zdList: [],
zdDeviceCategoryOptions: {},//站点各个站点包含的设备种类 {021_DDS_01:["BATTERY","CLUSTER","STACK", "DH", "AMMETER", "PCS", "XF"],021_DDS_02:[]...} zdDeviceCategoryOptions: {},//站点各个站点包含的设备种类 {021_DDS_01:["BATTERY","CLUSTER","STACK", "DH", "AMMETER", "PCS", "XF"],021_DDS_02:[]...}
workStatusOptions: {'0': '运行', '1': '机', '2': '故障'},//工作状态 CLUSTERWorkStatusOptions: {'0': '静置', '1': '充电', '2': '放电', '3': '待机', '5': '运行', '9': "故障"},//电池簇工作状态
PCSWorkStatusOptions: {'0': '运行', '1': '停机', '2': '故障', '3': '待机', '4': '充电', '5': '放电'},//PCS工作状态 PCSWorkStatusOptions: {'0': '运行', '1': '停机', '2': '故障', '3': '待机', '4': '充电', '5': '放电'},//PCS工作状态
STACKWorkStatusOptions: {"0": "净置", "1": "充电", "2": "放电", "3": "浮充", '9': "故障"},//STACKBMS总览工作状态 STACKWorkStatusOptions: {
"0": "静置",
"1": "充电",
"2": "放电",
"3": "浮充",
'4': '待机',
'5': '运行',
'9': "故障"
},//STACKBMS总览工作状态
deviceStatusOptions: {'0': '离线', '1': '在线'},//设备状态 deviceStatusOptions: {'0': '离线', '1': '在线'},//设备状态
gridStatusOptions: {'0': '并网', '1': '未并网'},//并网状态 gridStatusOptions: {'0': '并网', '1': '未并网'},//并网状态
controlModeOptions: {'0': '远程', '1': '本地'},//控制模式 controlModeOptions: {'0': '远程', '1': '本地'},//控制模式

View File

@ -1,27 +1,30 @@
<template> <template>
<el-card v-loading="loading" gshadow="always" class="common-card-container common-card-container-no-title-bg"> <el-card v-loading="loading" gshadow="always" class="common-card-container common-card-container-no-title-bg">
<!-- 搜索栏--> <!-- 搜索栏-->
<el-form :inline="true" class="select-container"> <el-form :inline="true" class="select-container">
<el-form-item label="设备清单"> <el-form-item label="设备清单">
<el-select v-model="search.deviceId" clearable placeholder="请选择" :loading="loading" loading-text="正在加载数据"> <el-select v-model="search.deviceId" clearable placeholder="请选择" :loading="loading"
<el-option :label="item.deviceName" :value="item.deviceId" v-for="(item,key) in deviceOptions" :key="key+'deviceIdOptions'"></el-option> loading-text="正在加载数据">
<el-option :label="item.deviceName" :value="item.deviceId" v-for="(item,key) in deviceOptions"
:key="key+'deviceIdOptions'"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="告警等级"> <el-form-item label="告警等级">
<el-select v-model="search.alarmLevel" clearable placeholder="请选择" :loading="loading" loading-text="正在加载数据"> <el-select v-model="search.alarmLevel" clearable placeholder="请选择" :loading="loading"
<el-option :label="value" :value="key" v-for="(value,key) in $store.state.ems.alarmLevelOptions" :key="key+'alarmLevelOptions'"></el-option> loading-text="正在加载数据" style="width: 130px">
<el-option :label="value" :value="key" v-for="(value,key) in $store.state.ems.alarmLevelOptions"
:key="key+'alarmLevelOptions'"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="时间选择"> <el-form-item label="时间选择">
<el-date-picker <el-date-picker
v-model="dateRange" v-model="dateRange"
type="daterange" type="daterange"
range-separator="" range-separator=""
start-placeholder="开始时间" start-placeholder="开始时间"
:picker-options="pickerOptions" :picker-options="pickerOptions"
:default-value="defaultDateRange" :default-value="defaultDateRange"
end-placeholder="结束时间"> end-placeholder="结束时间">
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
@ -36,7 +39,9 @@
<el-row style=""> <el-row style="">
<el-col :xs="24" :sm="24" :lg="24"> <el-col :xs="24" :sm="24" :lg="24">
<el-button-group class="ems-btns-group"> <el-button-group class="ems-btns-group">
<el-button v-for="(item,index) in btnList" :key="index+'dtdcBtns'" :class="{'activeBtn' : activeBtn === item.id}" @click="changeDataType(item.id)">{{item.name}}</el-button> <el-button v-for="(item,index) in btnList" :key="index+'dtdcBtns'"
:class="{'activeBtn' : activeBtn === item.id}" @click="changeDataType(item.id)">{{ item.name }}
</el-button>
</el-button-group> </el-button-group>
</el-col> </el-col>
</el-row> </el-row>
@ -47,64 +52,69 @@
stripe stripe
max-height="500" max-height="500"
style="width: 100%;margin-top:25px;"> style="width: 100%;margin-top:25px;">
<el-table-column <el-table-column
prop="deviceName" prop="deviceName"
label="设备名称"> label="设备名称">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
label="告警等级" label="告警等级"
> >
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{$store.state.ems.alarmLevelOptions[scope.row.alarmLevel]}}</span> <span>{{ $store.state.ems.alarmLevelOptions[scope.row.alarmLevel] }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="alarmContent" prop="alarmContent"
show-overflow-tooltip show-overflow-tooltip
label="告警内容"> label="告警内容">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="alarmStartTime" prop="alarmStartTime"
label="告警发生时间"> label="告警发生时间">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{formatDate(scope.row.alarmStartTime,true)}}</span> <span>{{ formatDate(scope.row.alarmStartTime, true) }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="alarmEndTime" prop="alarmEndTime"
label="告警结束时间"> label="告警结束时间">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{formatDate(scope.row.alarmEndTime,true)}}</span> <span>{{ formatDate(scope.row.alarmEndTime, true) }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
label="状态"> label="状态">
<template slot-scope="scope"> <template slot-scope="scope">
<span :class="['0','2'].includes(scope.row.status) ? 'warning-status' : ''">{{$store.state.ems.alarmStatusOptions[scope.row.status]}}</span> <span
</template> :class="['0','2'].includes(scope.row.status) ? 'warning-status' : ''">{{
</el-table-column> $store.state.ems.alarmStatusOptions[scope.row.status]
<el-table-column }}</span>
</template>
</el-table-column>
<el-table-column
label="工单" label="工单"
fixed="right" fixed="right"
width="250" width="250"
> >
<template slot-scope="scope"> <template slot-scope="scope">
<el-button type="text" size="mini" v-if="scope.row.ticketNo" @click="toTicket">已生成工单(工单号:{{scope.row.ticketNo}})</el-button> <el-button type="text" size="mini" v-if="scope.row.ticketNo" @click="toTicket">
<el-button type="primary" size="mini" v-else @click="createTicket(scope.row.id)">生成工单</el-button> 已生成工单(工单号:{{ scope.row.ticketNo }})
</template> </el-button>
</el-table-column> <el-button type="primary" size="mini" v-else @click="createTicket(scope.row.id)">生成工单</el-button>
</el-table> </template>
</el-table-column>
</el-table>
<el-pagination <el-pagination
v-show="tableData.length>0" v-show="tableData.length>0"
background background
@size-change="handleSizeChange" @size-change="handleSizeChange"
@current-change="handleCurrentChange" @current-change="handleCurrentChange"
:current-page="pageNum" :current-page="pageNum"
:page-size="pageSize" :page-size="pageSize"
:page-sizes="[10, 20, 30, 40]" :page-sizes="[10, 20, 30, 40]"
layout="total, sizes, prev, pager, next, jumper" layout="total, sizes, prev, pager, next, jumper"
:total="totalSize" :total="totalSize"
style="margin-top:15px;text-align: center" style="margin-top:15px;text-align: center"
> >
</el-pagination> </el-pagination>
</div> </div>
@ -113,113 +123,127 @@
<script> <script>
import {getAlarmDetailList,createTicketNo} from'@/api/ems/dzjk' import {createTicketNo, getAlarmDetailList} from '@/api/ems/dzjk'
import {getDeviceList} from'@/api/ems/site' import {getDeviceList} from '@/api/ems/site'
import getQuerySiteId from "@/mixins/ems/getQuerySiteId"; import getQuerySiteId from "@/mixins/ems/getQuerySiteId";
import { formatDate } from '@/filters/ems' import {formatDate} from '@/filters/ems'
export default { export default {
name:'DzjkGzgj', name: 'DzjkGzgj',
mixins:[getQuerySiteId], mixins: [getQuerySiteId],
data() { data() {
return { return {
loading:false, loading: false,
btnList:[ btnList: [
{name:'未处理告警',id:'today'}, {name: '未处理告警', id: 'today'},
{name:'历史告警',id:'history'}, {name: '历史告警', id: 'history'},
], ],
deviceOptions:[],//设备列表 deviceOptions: [],//设备列表
pickerOptions:{ pickerOptions: {
disabledDate(time) { disabledDate(time) {
return time.getTime() > Date.now(); return time.getTime() > Date.now();
}, },
}, },
defaultDateRange:[],//默认展示的时间 defaultDateRange: [],//默认展示的时间
dateRange:[],//alarmStartTime,alarmEndTime dateRange: [],//alarmStartTime,alarmEndTime
activeBtn:'today', activeBtn: 'today',
search:{deviceId:'',alarmLevel:''}, search: {deviceId: '', alarmLevel: ''},
// 表格、分页 // 表格、分页
tableData:[], tableData: [],
pageSize:10,//分页栏当前每个数据总数 pageSize: 10,//分页栏当前每个数据总数
pageNum:1,//分页栏当前页数 pageNum: 1,//分页栏当前页数
totalSize:0,//table表格数据总数 totalSize: 0,//table表格数据总数
} }
}, },
methods:{ methods: {
formatDate, formatDate,
toTicket(){ toTicket() {
this.$router.push({path:'/ticket'}) this.$router.push({path: '/ticket'})
}, },
//生成工单 //生成工单
createTicket(id){ createTicket(id) {
this.loading = true this.loading = true
createTicketNo({id}).then(response=>{ createTicketNo({id}).then(response => {
response?.data && this.toTicket() response?.data && this.toTicket()
}).finally(()=>{this.loading = false}) }).finally(() => {
this.loading = false
})
}, },
// 判断是否是同一天 // 判断是否是同一天
isSameDay(day1, day2) { isSameDay(day1, day2) {
const date1 = new Date(day1),date2 = new Date(day2) const date1 = new Date(day1), date2 = new Date(day2)
return date1.getFullYear() === date2.getFullYear() && return date1.getFullYear() === date2.getFullYear() &&
date1.getMonth() === date2.getMonth() && date1.getMonth() === date2.getMonth() &&
date1.getDate() === date2.getDate(); date1.getDate() === date2.getDate();
}, },
// 分页 // 分页
handleSizeChange(val) { handleSizeChange(val) {
this.pageSize = val; this.pageSize = val;
this.$nextTick(()=>{ this.$nextTick(() => {
this.getData() this.getData()
}) })
}, },
handleCurrentChange(val) { handleCurrentChange(val) {
this.pageNum = val this.pageNum = val
this.$nextTick(()=>{ this.$nextTick(() => {
this.getData() this.getData()
}) })
}, },
// 搜索 // 搜索
onSearch(){ onSearch() {
this.pageNum =1//每次搜索从1开始搜索 this.pageNum = 1//每次搜索从1开始搜索
this.getData() this.getData()
}, },
// 重置 // 重置
onReset(){ onReset() {
this.search={deviceId:'',alarmLevel:''} this.search = {deviceId: '', alarmLevel: ''}
this.dateRange=[] this.dateRange = []
this.pageNum =1//每次搜索从1开始搜索 this.pageNum = 1//每次搜索从1开始搜索
this.getData() this.getData()
}, },
// 切换今日、历史告警 // 切换今日、历史告警
changeDataType(id){ changeDataType(id) {
if(id !== this.activeBtn){ if (id !== this.activeBtn) {
console.log('点击了不同的菜单,更新数据') console.log('点击了不同的菜单,更新数据')
this.activeBtn=id; this.activeBtn = id;
this.getData() this.getData()
} }
}, },
// 获取数据 // 获取数据
getData(){ getData() {
this.$store.dispatch('getSiteAlarmNum',this.siteId) this.$store.dispatch('getSiteAlarmNum', this.siteId)
this.loading=true this.loading = true
const {deviceId,alarmLevel} = this.search const {deviceId, alarmLevel} = this.search
const {siteId,pageNum,pageSize,activeBtn} =this const {siteId, pageNum, pageSize, activeBtn} = this
const [alarmStartTime='',alarmEndTime='']=(this.dateRange || []) const [alarmStartTime = '', alarmEndTime = ''] = (this.dateRange || [])
let status = activeBtn === 'today' ? '0' : '1,2' let status = activeBtn === 'today' ? '0' : '1,2'
getAlarmDetailList({status,deviceId,alarmLevel,siteId,pageSize,pageNum,alarmStartTime:formatDate(alarmStartTime),alarmEndTime:formatDate(alarmEndTime)}).then(response => { getAlarmDetailList({
this.tableData=response?.rows || []; status,
deviceId,
alarmLevel,
siteId,
pageSize,
pageNum,
alarmStartTime: formatDate(alarmStartTime),
alarmEndTime: formatDate(alarmEndTime)
}).then(response => {
this.tableData = response?.rows || [];
this.totalSize = response?.total || 0 this.totalSize = response?.total || 0
}).finally(() => {this.loading=false}) }).finally(() => {
this.loading = false
})
}, },
getDeviceOptions(){ getDeviceOptions() {
getDeviceList(this.siteId).then(response => { getDeviceList(this.siteId).then(response => {
this.deviceOptions = JSON.parse(JSON.stringify(response?.data || [])) this.deviceOptions = JSON.parse(JSON.stringify(response?.data || []))
}) })
}, },
init(){ init() {
this.getDeviceOptions() this.getDeviceOptions()
this.onReset() this.onReset()
}, },
}, },
mounted(){ mounted() {
const now = new Date(); const now = new Date();
const lastMonth = new Date(now.getFullYear(), now.getMonth() - 1, 1); const lastMonth = new Date(now.getFullYear(), now.getMonth() - 1, 1);
this.defaultDateRange = [lastMonth, now]; this.defaultDateRange = [lastMonth, now];

View File

@ -3,11 +3,7 @@
<div v-for="(baseInfo,index) in baseInfoList" :key="index+'bmsdccContainer'" style="margin-bottom:25px;"> <div v-for="(baseInfo,index) in baseInfoList" :key="index+'bmsdccContainer'" style="margin-bottom:25px;">
<el-card shadow="always" <el-card shadow="always"
class="sbjk-card-container common-card-container-body-no-padding common-card-container-no-title-bg" class="sbjk-card-container common-card-container-body-no-padding common-card-container-no-title-bg"
:class="{ :class="handleCardClass(baseInfo)">
'timing-card-container':!['0','2'].includes(baseInfo.workStatus),
'warning-card-container':baseInfo.workStatus === '2',
'running-card-container':baseInfo.workStatus === '0'
}">
<div slot="header"> <div slot="header">
<span <span
class="large-title">{{ class="large-title">{{
@ -20,7 +16,7 @@
<el-button type="primary" round size="small" style="margin-right:20px;" <el-button type="primary" round size="small" style="margin-right:20px;"
@click="pointDetail(baseInfo,'point')">详细 @click="pointDetail(baseInfo,'point')">详细
</el-button> </el-button>
<el-badge :value="baseInfo.alarmNum || 0" class="item"> <el-badge :hidden="!baseInfo.alarmNum" :value="baseInfo.alarmNum || 0" class="item">
<i <i
class="el-icon-message-solid alarm-icon" class="el-icon-message-solid alarm-icon"
@click="pointDetail(baseInfo,'alarmPoint')" @click="pointDetail(baseInfo,'alarmPoint')"
@ -30,16 +26,16 @@
</div> </div>
<div class="descriptions-main"> <div class="descriptions-main">
<el-descriptions direction="vertical" :column="3" :colon="false"> <el-descriptions direction="vertical" :column="3" :colon="false">
<el-descriptions-item labelClassName="descriptions-label" <el-descriptions-item
:contentClassName="`descriptions-direction ${baseInfo.workStatus === '0' ? 'save' :'danger'}`" contentClassName="descriptions-direction work-status"
:span="1" label="工作状态"> :span="1" label="工作状态">
{{ $store.state.ems.workStatusOptions[baseInfo.workStatus] }} {{ CLUSTERWorkStatusOptions[baseInfo.workStatus] }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item labelClassName="descriptions-label" contentClassName="descriptions-direction" <el-descriptions-item contentClassName="descriptions-direction"
:span="1" label="与PCS通信"> :span="1" label="与PCS通信">
{{ $store.state.ems.communicationStatusOptions[baseInfo.pcsCommunicationStatus] }} {{ $store.state.ems.communicationStatusOptions[baseInfo.pcsCommunicationStatus] }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item labelClassName="descriptions-label" contentClassName="descriptions-direction" <el-descriptions-item contentClassName="descriptions-direction"
:span="1" label="与EMS通信"> :span="1" label="与EMS通信">
{{ $store.state.ems.communicationStatusOptions[baseInfo.emsCommunicationStatus] }} {{ $store.state.ems.communicationStatusOptions[baseInfo.emsCommunicationStatus] }}
</el-descriptions-item> </el-descriptions-item>
@ -132,11 +128,17 @@ import PointTable from "@/views/ems/site/sblb/PointTable.vue";
import {getBMSBatteryCluster} from '@/api/ems/dzjk' import {getBMSBatteryCluster} from '@/api/ems/dzjk'
import getQuerySiteId from "@/mixins/ems/getQuerySiteId"; import getQuerySiteId from "@/mixins/ems/getQuerySiteId";
import intervalUpdate from "@/mixins/ems/intervalUpdate"; import intervalUpdate from "@/mixins/ems/intervalUpdate";
import {mapState} from "vuex";
export default { export default {
name: 'DzjkSbjkBmsdcc', name: 'DzjkSbjkBmsdcc',
mixins: [getQuerySiteId, intervalUpdate], mixins: [getQuerySiteId, intervalUpdate],
components: {PointTable, pointChart}, components: {PointTable, pointChart},
computed: {
...mapState({
CLUSTERWorkStatusOptions: state => state?.ems?.CLUSTERWorkStatusOptions || {},
})
},
data() { data() {
return { return {
loading: false, loading: false,
@ -171,6 +173,10 @@ export default {
} }
}, },
methods: { methods: {
handleCardClass(item) {
const {workStatus = ''} = item
return !(Object.keys(this.CLUSTERWorkStatusOptions).includes(item.workStatus)) ? "timing-card-container" : workStatus === '9' ? 'warning-card-container' : 'running-card-container'
},
// 查看设备电位表格 // 查看设备电位表格
pointDetail(row, dataType) { pointDetail(row, dataType) {
const {siteId, deviceId} = row const {siteId, deviceId} = row

View File

@ -14,7 +14,7 @@
<el-button type="primary" round size="small" style="margin-right:20px;" <el-button type="primary" round size="small" style="margin-right:20px;"
@click="pointDetail(baseInfo,'point')">详细 @click="pointDetail(baseInfo,'point')">详细
</el-button> </el-button>
<el-badge :value="baseInfo.alarmNum || 0" class="item"> <el-badge :hidden="!baseInfo.alarmNum" :value="baseInfo.alarmNum || 0" class="item">
<i <i
class="el-icon-message-solid alarm-icon" class="el-icon-message-solid alarm-icon"
@click="pointDetail(baseInfo,'alarmPoint')" @click="pointDetail(baseInfo,'alarmPoint')"

View File

@ -25,7 +25,7 @@
<el-button type="primary" round size="small" style="margin-right:20px;" @click="pointDetail(item,'point')"> <el-button type="primary" round size="small" style="margin-right:20px;" @click="pointDetail(item,'point')">
详细 详细
</el-button> </el-button>
<el-badge :value="item.alarmNum || 0" class="item"> <el-badge :hidden="!item.alarmNum" :value="item.alarmNum || 0" class="item">
<i <i
class="el-icon-message-solid alarm-icon" class="el-icon-message-solid alarm-icon"
@click="pointDetail(item,'alarmPoint')" @click="pointDetail(item,'alarmPoint')"

View File

@ -14,7 +14,7 @@
<el-button type="primary" round size="small" style="margin-right:20px;" @click="pointDetail(item,'point')"> <el-button type="primary" round size="small" style="margin-right:20px;" @click="pointDetail(item,'point')">
详细 详细
</el-button> </el-button>
<el-badge :value="item.alarmNum || 0" class="item"> <el-badge :hidden="!item.alarmNum" :value="item.alarmNum || 0" class="item">
<i <i
class="el-icon-message-solid alarm-icon" class="el-icon-message-solid alarm-icon"
@click="pointDetail(item,'alarmPoint')" @click="pointDetail(item,'alarmPoint')"

View File

@ -1,206 +1,5 @@
<template> <template>
<div v-loading="loading" class="ems"> <div v-loading="loading" class="ems">
<!-- <div-->
<!-- v-for="(item, index) in list"-->
<!-- :key="index + 'PcsHome'"-->
<!-- 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"-->
<!-- >-->
<!-- &lt;!&ndash; 标题&ndash;&gt;-->
<!-- <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>-->
<!-- &lt;!&ndash; 工作状态&ndash;&gt;-->
<!-- <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-->
<!-- &lt;!&ndash;-->
<!-- {{-->
<!-- $store.state.ems.warnOptions[item.warnMode]-->
<!-- }}&ndash;&gt;-->
<!-- </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>-->
<!-- &lt;!&ndash; 用电量&ndash;&gt;-->
<!-- <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>-->
<!-- &lt;!&ndash; 表格&ndash;&gt;-->
<!-- <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>-->
<!-- &lt;!&ndash; 图表&ndash;&gt;-->
<!-- <div id="emsChart" style="height: 350px"></div>-->
<!-- </el-card>-->
<!-- </div>-->
<el-card <el-card
v-for="(item,index) in list" v-for="(item,index) in list"
:key="index+'emsList'" :key="index+'emsList'"
@ -220,7 +19,7 @@
<div class="alarm"> <div class="alarm">
<el-button size="small" round style="margin-right:20px;" type="primary" @click="pointDetail(item,'point')">详细 <el-button size="small" round style="margin-right:20px;" type="primary" @click="pointDetail(item,'point')">详细
</el-button> </el-button>
<el-badge :value="item.alarmNum || 0" class="item"> <el-badge :hidden="!item.alarmNum" :value="item.alarmNum || 0" class="item">
<i <i
class="el-icon-message-solid alarm-icon" class="el-icon-message-solid alarm-icon"
@click="pointDetail(item,'alarmPoint')" @click="pointDetail(item,'alarmPoint')"

View File

@ -31,7 +31,7 @@
@click="pointDetail(pcsItem,'point')"> @click="pointDetail(pcsItem,'point')">
详细 详细
</el-button> </el-button>
<el-badge :value="pcsItem.alarmNum || 0" class="item"> <el-badge :hidden="!pcsItem.alarmNum" :value="pcsItem.alarmNum || 0" class="item">
<i <i
class="el-icon-message-solid alarm-icon" class="el-icon-message-solid alarm-icon"
@click="pointDetail(pcsItem,'alarmPoint')" @click="pointDetail(pcsItem,'alarmPoint')"

View File

@ -25,7 +25,7 @@
<el-button type="primary" round size="small" style="margin-right:20px;" @click="pointDetail(item,'point')"> <el-button type="primary" round size="small" style="margin-right:20px;" @click="pointDetail(item,'point')">
详细 详细
</el-button> </el-button>
<el-badge :value="item.alarmNum || 0" class="item"> <el-badge :hidden="!item.alarmNum" :value="item.alarmNum || 0" class="item">
<i <i
class="el-icon-message-solid alarm-icon" class="el-icon-message-solid alarm-icon"
@click="pointDetail(item,'alarmPoint')" @click="pointDetail(item,'alarmPoint')"

View File

@ -14,7 +14,7 @@
<el-button type="primary" round size="small" style="margin-right:20px;" @click="pointDetail(item,'point')"> <el-button type="primary" round size="small" style="margin-right:20px;" @click="pointDetail(item,'point')">
详细 详细
</el-button> </el-button>
<el-badge :value="item.alarmNum || 0" class="item"> <el-badge :hidden="!item.alarmNum" :value="item.alarmNum || 0" class="item">
<i <i
class="el-icon-message-solid alarm-icon" class="el-icon-message-solid alarm-icon"
@click="pointDetail(item,'alarmPoint')" @click="pointDetail(item,'alarmPoint')"

View File

@ -1,4 +1,3 @@
<template> <template>
<div style="width:100%" v-loading="loading"> <div style="width:100%" v-loading="loading">
<!-- 搜索栏--> <!-- 搜索栏-->
@ -22,172 +21,185 @@
<el-form-item> <el-form-item>
<el-button @click="onReset" native-type="button">重置</el-button> <el-button @click="onReset" native-type="button">重置</el-button>
</el-form-item> </el-form-item>
<el-form-item>
<el-button type="primary" @click="exportTable" native-type="button">导出</el-button>
</el-form-item>
</el-form> </el-form>
<!--表格--> <!--表格-->
<el-table <el-table
class="common-table" class="common-table"
:data="tableData" :data="tableData"
stripe stripe
style="width: 100%;margin-top:25px;"> style="width: 100%;margin-top:25px;">
<!-- 汇总列--> <!-- 汇总列-->
<el-table-column label="汇总"> <el-table-column label="汇总">
<el-table-column <el-table-column
prop="dataTime" prop="dataTime"
label="日期" label="日期"
width="120"> width="120">
</el-table-column> </el-table-column>
</el-table-column> </el-table-column>
<!--充电量列--> <!--充电量列-->
<el-table-column label="充电量" align="center"> <el-table-column label="充电量" align="center">
<el-table-column <el-table-column
align="center" align="center"
prop="activePeakKwh" prop="activePeakKwh"
label="尖"> label="尖">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
align="center" align="center"
prop="activeHighKwh" prop="activeHighKwh"
label="峰"> label="峰">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
align="center" align="center"
prop="activeFlatKwh" prop="activeFlatKwh"
label="平"> label="平">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
align="center" align="center"
prop="activeValleyKwh" prop="activeValleyKwh"
label="谷"> label="谷">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
align="center" align="center"
prop="activeTotalKwh" prop="activeTotalKwh"
label="总"> label="总">
</el-table-column> </el-table-column>
</el-table-column> </el-table-column>
<!--充电量列--> <!--充电量列-->
<el-table-column label="放电量" align="center"> <el-table-column label="放电量" align="center">
<el-table-column <el-table-column
align="center" align="center"
prop="reActivePeakKwh" prop="reActivePeakKwh"
label="尖"> label="尖">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
align="center" align="center"
prop="reActiveHighKwh" prop="reActiveHighKwh"
label="峰"> label="峰">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
align="center" align="center"
prop="reActiveFlatKwh" prop="reActiveFlatKwh"
label="平"> label="平">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
align="center" align="center"
prop="reActiveValleyKwh" prop="reActiveValleyKwh"
label="谷"> label="谷">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
align="center" align="center"
prop="reActiveTotalKwh" prop="reActiveTotalKwh"
label="总"> label="总">
</el-table-column> </el-table-column>
</el-table-column> </el-table-column>
<!-- 效率--> <!-- 效率-->
<el-table-column label="效率(%)" align="center"> <el-table-column label="效率(%)" align="center">
<el-table-column <el-table-column
align="center" align="center"
prop="effect"> prop="effect">
</el-table-column> </el-table-column>
</el-table-column> </el-table-column>
</el-table> </el-table>
<el-pagination <el-pagination
v-show="tableData.length>0" v-show="tableData.length>0"
background background
@size-change="handleSizeChange" @size-change="handleSizeChange"
@current-change="handleCurrentChange" @current-change="handleCurrentChange"
:current-page="pageNum" :current-page="pageNum"
:page-size="pageSize" :page-size="pageSize"
:page-sizes="[10, 20, 30, 40]" :page-sizes="[10, 20, 30, 40]"
layout="total, sizes, prev, pager, next, jumper" layout="total, sizes, prev, pager, next, jumper"
:total="totalSize" :total="totalSize"
style="margin-top:15px;text-align: center" style="margin-top:15px;text-align: center"
> >
</el-pagination> </el-pagination>
</div> </div>
</template> </template>
<script> <script>
import getQuerySiteId from "@/mixins/ems/getQuerySiteId"; import getQuerySiteId from "@/mixins/ems/getQuerySiteId";
import { getAmmeterData} from '@/api/ems/dzjk' import {getAmmeterData} from '@/api/ems/dzjk'
import {formatDate} from "@/filters/ems"; import {formatDate} from "@/filters/ems";
export default { export default {
name:'DzjkTjbbDbbb', name: 'DzjkTjbbDbbb',
mixins: [getQuerySiteId], mixins: [getQuerySiteId],
data() { data() {
return { return {
loading:false, loading: false,
pickerOptions:{ pickerOptions: {
disabledDate(time) { disabledDate(time) {
return time.getTime() > Date.now(); return time.getTime() > Date.now();
}, },
}, },
defaultDateRange:[],//默认展示的时间 defaultDateRange: [],//默认展示的时间
dateRange:[], dateRange: [],
tableData:[], tableData: [],
pageSize:10,//分页栏当前每个数据总数 pageSize: 10,//分页栏当前每个数据总数
pageNum:1,//分页栏当前页数 pageNum: 1,//分页栏当前页数
totalSize:0,//table表格数据总数 totalSize: 0,//table表格数据总数
} }
}, },
methods:{ methods: {
// 导出表格
exportTable() {
if (!this.dateRange?.length) return
const [startTime, endTime] = this.dateRange
this.download('ems/statsReport/exportAmmeterData', {
siteId: this.siteId,
startTime,
endTime,
}, `电表报表_${startTime}-${endTime}.xlsx`)
},
// 搜索 // 搜索
onSearch(){ onSearch() {
this.pageNum =1//每次搜索从1开始搜索 this.pageNum = 1//每次搜索从1开始搜索
this.getData() this.getData()
}, },
// 重置 // 重置
onReset(){ onReset() {
this.dateRange=this.defaultDateRange this.dateRange = this.defaultDateRange
this.pageNum =1//每次搜索从1开始搜索 this.pageNum = 1//每次搜索从1开始搜索
this.getData() this.getData()
}, },
// 分页 // 分页
handleSizeChange(val) { handleSizeChange(val) {
this.pageSize = val; this.pageSize = val;
this.$nextTick(()=>{ this.$nextTick(() => {
this.getData() this.getData()
}) })
}, },
handleCurrentChange(val) { handleCurrentChange(val) {
this.pageNum = val this.pageNum = val
this.$nextTick(()=>{ this.$nextTick(() => {
this.getData() this.getData()
}) })
}, },
// 获取数据 // 获取数据
getData(){ getData() {
this.loading=true this.loading = true
const {siteId,pageNum,pageSize} =this const {siteId, pageNum, pageSize} = this
const [startTime='',endTime='']=(this.dateRange || []) const [startTime = '', endTime = ''] = (this.dateRange || [])
getAmmeterData({siteId:siteId,startTime,endTime,pageSize,pageNum}).then(response=>{ getAmmeterData({siteId: siteId, startTime, endTime, pageSize, pageNum}).then(response => {
this.tableData=response?.rows || []; this.tableData = response?.rows || [];
this.totalSize = response?.total || 0 this.totalSize = response?.total || 0
}).finally(()=> { }).finally(() => {
this.loading = false this.loading = false
}) })
}, },
init(){ init() {
this.dateRange=[] this.dateRange = []
this.tableData=[] this.tableData = []
this.totalSize=0 this.totalSize = 0
this.pageSize=10 this.pageSize = 10
this.pageNum = 1 this.pageNum = 1
const now = new Date().getTime(); let now = new Date(), lastDay = now.getTime(), firstDay = new Date(now.setDate(1)).getTime();
const lastMonth = new Date(now-30 * 24 * 60 * 60 * 1000).getTime(); this.defaultDateRange = [formatDate(firstDay), formatDate(lastDay)];
this.defaultDateRange = [formatDate(lastMonth), formatDate(now)]; this.dateRange = [formatDate(firstDay), formatDate(lastDay)];
this.dateRange=[formatDate(lastMonth), formatDate(now)];
this.getData() this.getData()
}, },
}, },
@ -195,8 +207,8 @@ export default {
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
::v-deep{ ::v-deep {
.common-table.el-table .el-table__header-wrapper th, .common-table.el-table .el-table__fixed-header-wrapper th{ .common-table.el-table .el-table__header-wrapper th, .common-table.el-table .el-table__fixed-header-wrapper th {
border-bottom: 1px solid #dfe6ec; border-bottom: 1px solid #dfe6ec;
} }
} }

View File

@ -1,22 +1,23 @@
<template> <template>
<el-card <el-card
shadow="always" shadow="always"
class="common-card-container time-range-card" class="common-card-container time-range-card"
style="margin-top: 20px" style="margin-top: 20px"
> >
<div slot="header" class="time-range-header"> <div slot="header" class="time-range-header">
<span class="card-title"> </span> <span class="card-title"> </span>
<date-range-select ref="dateRangeSelect" @updateDate="updateDate" /> <date-range-select ref="dateRangeSelect" @updateDate="updateDate"/>
</div> </div>
<div class="card-main" v-loading="loading"> <div class="card-main" v-loading="loading">
<el-button-group class="ems-btns-group"> <el-button-group class="ems-btns-group">
<el-button <el-button
v-for="(item, index) in btnList" v-for="(item, index) in btnList"
:key="index + 'dcdqxBtns'" :key="index + 'dcdqxBtns'"
size="mini" size="mini"
:class="{ activeBtn: activeBtn === item.id }" :class="{ activeBtn: activeBtn === item.id }"
@click="changeDataType(item.id)" @click="changeDataType(item.id)"
>{{ item.name }}</el-button >{{ item.name }}
</el-button
> >
</el-button-group> </el-button-group>
<div id="dcdEchart" style="height: 310px"></div> <div id="dcdEchart" style="height: 310px"></div>
@ -28,12 +29,13 @@
import * as echarts from "echarts"; import * as echarts from "echarts";
import resize from "@/mixins/ems/resize"; import resize from "@/mixins/ems/resize";
import getQuerySiteId from "@/mixins/ems/getQuerySiteId"; import getQuerySiteId from "@/mixins/ems/getQuerySiteId";
import { getStackData, getStackNameList } from "@/api/ems/dzjk"; import {getStackData} from "@/api/ems/dzjk";
import { formatDate } from "@/filters/ems"; import {formatDate} from "@/filters/ems";
import DateRangeSelect from "@/components/Ems/DateRangeSelect/index.vue"; import DateRangeSelect from "@/components/Ems/DateRangeSelect/index.vue";
export default { export default {
name: "DzjkTjbbDcdqx", name: "DzjkTjbbDcdqx",
components: { DateRangeSelect }, components: {DateRangeSelect},
mixins: [resize, getQuerySiteId], mixins: [resize, getQuerySiteId],
data() { data() {
return { return {
@ -46,10 +48,10 @@ export default {
loading: false, loading: false,
activeBtn: "1", activeBtn: "1",
btnList: [ btnList: [
{ name: "堆平均维度", id: "1", attr: ["temp"], source: ["有功功率"] }, {name: "堆平均维度", id: "1", attr: ["temp"], source: ["有功功率"]},
{ name: "堆电压", id: "2", attr: ["voltage"], source: ["堆电压"] }, {name: "堆电压", id: "2", attr: ["voltage"], source: ["堆电压"]},
{ name: "堆电流", id: "3", attr: ["current"], source: ["堆电流"] }, {name: "堆电流", id: "3", attr: ["current"], source: ["堆电流"]},
{ name: "堆soc", id: "4", attr: ["soc"], source: ["堆soc"] }, {name: "堆soc", id: "4", attr: ["soc"], source: ["堆soc"]},
], ],
}; };
}, },
@ -66,7 +68,7 @@ export default {
this.getData(); this.getData();
}, },
getData() { getData() {
const { siteId, activeBtn } = this; const {siteId, activeBtn} = this;
const [start = "", end = ""] = this.dateRange || []; const [start = "", end = ""] = this.dateRange || [];
//接口调用完成之后 设置图表、结束loading //接口调用完成之后 设置图表、结束loading
this.loading = true; this.loading = true;
@ -76,12 +78,12 @@ export default {
endTime: formatDate(end), endTime: formatDate(end),
dataType: activeBtn, dataType: activeBtn,
}) })
.then((response) => { .then((response) => {
this.setOption(response?.data || []); this.setOption(response?.data || []);
}) })
.finally(() => { .finally(() => {
this.loading = false; this.loading = false;
}); });
}, },
compareDate(date1, date2) { compareDate(date1, date2) {
console.log("比较时间", date1, date2); console.log("比较时间", date1, date2);
@ -92,9 +94,9 @@ export default {
const [date1_Y = "", date1_M = "", date1_D = ""] = date1.split("-"); //根据空格区分[年月日,小时] const [date1_Y = "", date1_M = "", date1_D = ""] = date1.split("-"); //根据空格区分[年月日,小时]
const [date2_Y = "", date2_M = "", date2_D = ""] = date2.split("-"); //根据空格区分[年月日,小时] const [date2_Y = "", date2_M = "", date2_D = ""] = date2.split("-"); //根据空格区分[年月日,小时]
return ( return (
(date1_Y === date2_Y && date1_M === date2_M && date1_D - date2_D) || (date1_Y === date2_Y && date1_M === date2_M && date1_D - date2_D) ||
(date1_Y === date2_Y && date1_M - date2_M) || (date1_Y === date2_Y && date1_M - date2_M) ||
date1_Y - date2_Y date1_Y - date2_Y
); );
}, },
setOption(data) { setOption(data) {
@ -106,7 +108,7 @@ export default {
const source = []; const source = [];
const sourceTop = ["日期"]; const sourceTop = ["日期"];
let map = {}, let map = {},
mapArr = []; mapArr = [];
// 生成所有{日期:[],日期:[]}格式的对象和所有包含所有日期的[日期1,日期2...] // 生成所有{日期:[],日期:[]}格式的对象和所有包含所有日期的[日期1,日期2...]
data.forEach((item) => { data.forEach((item) => {
item.dataList.forEach((inner) => { item.dataList.forEach((inner) => {
@ -136,38 +138,53 @@ export default {
}); });
source.unshift(sourceTop); source.unshift(sourceTop);
this.chart.setOption( this.chart.setOption(
{ {
grid: { grid: {
containLabel: true, containLabel: true,
},
legend: {
left: "center",
bottom: "15",
},
tooltip: {
trigger: "axis",
axisPointer: {
// 坐标轴指示器,坐标轴触发有效
type: "shadow", // 默认为直线,可选为:'line' | 'shadow'
}, },
legend: {
left: "center",
top: "10",
},
tooltip: {
trigger: "axis",
axisPointer: {
// 坐标轴指示器,坐标轴触发有效
type: "shadow", // 默认为直线,可选为:'line' | 'shadow'
},
},
textStyle: {
color: "#333333",
},
xAxis: {
type: "category",
},
yAxis: {
type: "value",
},
dataZoom: [
{
type: "inside",
start: 0,
end: 100,
},
{
start: 0,
end: 100,
},
],
dataset: {source},
series: source[0].slice(1).map((item) => {
return {
type: "line",
smooth: true,
areaStyle: {
opacity: 0.7,
},
};
}),
}, },
textStyle: { true
color: "#333333",
},
xAxis: {
type: "category",
},
yAxis: {
type: "value",
},
dataset: { source },
series: source[0].slice(1).map((item) => {
return {
type: "line",
};
}),
},
true
); );
}, },
initChart() { initChart() {
@ -176,7 +193,7 @@ export default {
init() { init() {
this.$nextTick(() => { this.$nextTick(() => {
this.initChart(); this.initChart();
this.$refs.dateRangeSelect.init(); this.$refs.dateRangeSelect.init(true);
}); });
}, },
}, },

View File

@ -1,15 +1,14 @@
<template> <template>
<el-card <el-card
shadow="always" shadow="always"
class="common-card-container time-range-card" class="common-card-container time-range-card"
style="margin-top: 20px" style="margin-top: 20px"
> >
<div slot="header" class="time-range-header"> <div slot="header" class="time-range-header">
<span class="card-title">功率曲线</span> <span class="card-title">功率曲线</span>
<date-range-select <date-range-select
ref="dateRangeSelect" ref="dateRangeSelect"
@reset="resetTime" @updateDate="updateDate"
@updateDate="updateDate"
/> />
</div> </div>
<div class="card-main" v-loading="loading"> <div class="card-main" v-loading="loading">
@ -22,12 +21,13 @@
import * as echarts from "echarts"; import * as echarts from "echarts";
import resize from "@/mixins/ems/resize"; import resize from "@/mixins/ems/resize";
import getQuerySiteId from "@/mixins/ems/getQuerySiteId"; import getQuerySiteId from "@/mixins/ems/getQuerySiteId";
import { getPcsNameList, getPowerData } from "@/api/ems/dzjk"; import {getPowerData} from "@/api/ems/dzjk";
import { formatDate } from "@/filters/ems"; import {formatDate} from "@/filters/ems";
import DateRangeSelect from "@/components/Ems/DateRangeSelect/index.vue"; import DateRangeSelect from "@/components/Ems/DateRangeSelect/index.vue";
export default { export default {
name: "DzjkTjbbGlqx", name: "DzjkTjbbGlqx",
components: { DateRangeSelect }, components: {DateRangeSelect},
mixins: [resize, getQuerySiteId], mixins: [resize, getQuerySiteId],
data() { data() {
return { return {
@ -38,7 +38,6 @@ export default {
}, },
dateRange: [], dateRange: [],
loading: false, loading: false,
dateRangeInit: true,
}; };
}, },
methods: { methods: {
@ -47,30 +46,22 @@ export default {
this.dateRange = data || []; this.dateRange = data || [];
this.getData(); this.getData();
}, },
resetTime() {
this.dateRangeInit = true;
},
getData() { getData() {
const { siteId } = this; const {siteId} = this;
let [start = "", end = ""] = this.dateRange || []; let [start = "", end = ""] = this.dateRange || [];
//接口调用完成之后 设置图表、结束loading //接口调用完成之后 设置图表、结束loading
this.loading = true; this.loading = true;
if (this.dateRangeInit) {
start = "";
end = "";
this.dateRangeInit = false;
}
getPowerData({ getPowerData({
siteId, siteId,
startDate: formatDate(start), startDate: formatDate(start),
endDate: formatDate(end), endDate: formatDate(end),
}) })
.then((response) => { .then((response) => {
this.setOption(response?.data || []); this.setOption(response?.data || []);
}) })
.finally(() => { .finally(() => {
this.loading = false; this.loading = false;
}); });
}, },
setOption(data) { setOption(data) {
const source = [["日期", "电网功率", "负载功率", "储能功率", "光伏功率"]]; const source = [["日期", "电网功率", "负载功率", "储能功率", "光伏功率"]];
@ -84,47 +75,74 @@ export default {
]); ]);
}); });
this.chart.setOption( this.chart.setOption(
{ {
grid: { grid: {
containLabel: true, containLabel: true,
},
legend: {
left: "center",
bottom: "15",
},
tooltip: {
trigger: "axis",
axisPointer: {
// 坐标轴指示器,坐标轴触发有效
type: "shadow", // 默认为直线,可选为:'line' | 'shadow'
}, },
}, legend: {
textStyle: { left: "center",
color: "#333333", top: "10",
},
xAxis: {
type: "category",
},
yAxis: {
type: "value",
},
dataset: { source },
series: [
{
type: "line",
}, },
{ tooltip: {
type: "line", trigger: "axis",
axisPointer: {
// 坐标轴指示器,坐标轴触发有效
type: "shadow", // 默认为直线,可选为:'line' | 'shadow'
},
}, },
{ textStyle: {
type: "line", color: "#333333",
}, },
{ xAxis: {
type: "line", type: "category",
}, },
], yAxis: {
}, type: "value",
true },
dataset: {source},
dataZoom: [
{
type: "inside",
start: 0,
end: 100,
},
{
start: 0,
end: 100,
},
],
series: [
{
type: "line",
smooth: true,
areaStyle: {
opacity: 0.7,
},
},
{
type: "line",
smooth: true,
areaStyle: {
opacity: 0.7,
},
},
{
type: "line",
smooth: true,
areaStyle: {
opacity: 0.7,
},
},
{
type: "line",
smooth: true,
areaStyle: {
opacity: 0.7,
},
},
],
},
true
); );
}, },
initChart() { initChart() {
@ -133,7 +151,6 @@ export default {
}, },
init() { init() {
this.$nextTick(() => { this.$nextTick(() => {
this.dateRangeInit = true;
this.initChart(); this.initChart();
this.$refs.dateRangeSelect.init(); this.$refs.dateRangeSelect.init();
}); });

View File

@ -1,22 +1,23 @@
<template> <template>
<el-card <el-card
shadow="always" shadow="always"
class="common-card-container time-range-card" class="common-card-container time-range-card"
style="margin-top: 20px" style="margin-top: 20px"
> >
<div slot="header" class="time-range-header"> <div slot="header" class="time-range-header">
<span class="card-title"> </span> <span class="card-title"> </span>
<date-range-select ref="dateRangeSelect" @updateDate="updateDate" /> <date-range-select ref="dateRangeSelect" @updateDate="updateDate"/>
</div> </div>
<div class="card-main" v-loading="loading"> <div class="card-main" v-loading="loading">
<el-button-group class="ems-btns-group"> <el-button-group class="ems-btns-group">
<el-button <el-button
v-for="(item, index) in btnList" v-for="(item, index) in btnList"
:key="index + 'flqxcBtns'" :key="index + 'flqxcBtns'"
size="mini" size="mini"
:class="{ activeBtn: activeBtn === item.id }" :class="{ activeBtn: activeBtn === item.id }"
@click="changeDataType(item.id)" @click="changeDataType(item.id)"
>{{ item.name }}</el-button >{{ item.name }}
</el-button
> >
</el-button-group> </el-button-group>
<div id="pcsEchart" style="height: 310px"></div> <div id="pcsEchart" style="height: 310px"></div>
@ -28,12 +29,13 @@
import * as echarts from "echarts"; import * as echarts from "echarts";
import resize from "@/mixins/ems/resize"; import resize from "@/mixins/ems/resize";
import getQuerySiteId from "@/mixins/ems/getQuerySiteId"; import getQuerySiteId from "@/mixins/ems/getQuerySiteId";
import { getPCSData, getPcsNameList } from "@/api/ems/dzjk"; import {getPCSData} from "@/api/ems/dzjk";
import { formatDate } from "@/filters/ems"; import {formatDate} from "@/filters/ems";
import DateRangeSelect from "@/components/Ems/DateRangeSelect/index.vue"; import DateRangeSelect from "@/components/Ems/DateRangeSelect/index.vue";
export default { export default {
name: "DzjkTjbbPcsqx", name: "DzjkTjbbPcsqx",
components: { DateRangeSelect }, components: {DateRangeSelect},
mixins: [resize, getQuerySiteId], mixins: [resize, getQuerySiteId],
data() { data() {
return { return {
@ -82,7 +84,7 @@ export default {
this.getData(); this.getData();
}, },
getData() { getData() {
const { siteId, activeBtn } = this; const {siteId, activeBtn} = this;
const [start = "", end = ""] = this.dateRange || []; const [start = "", end = ""] = this.dateRange || [];
this.loading = true; this.loading = true;
//接口调用完成之后 设置图表、结束loading //接口调用完成之后 设置图表、结束loading
@ -92,12 +94,12 @@ export default {
endTime: formatDate(end), endTime: formatDate(end),
dataType: activeBtn, dataType: activeBtn,
}) })
.then((response) => { .then((response) => {
this.setOption(response?.data || []); this.setOption(response?.data || []);
}) })
.finally(() => { .finally(() => {
this.loading = false; this.loading = false;
}); });
}, },
compareDate(date1, date2) { compareDate(date1, date2) {
console.log("比较时间", date1, date2); console.log("比较时间", date1, date2);
@ -108,9 +110,9 @@ export default {
const [date1_Y = "", date1_M = "", date1_D = ""] = date1.split("-"); //根据空格区分[年月日,小时] const [date1_Y = "", date1_M = "", date1_D = ""] = date1.split("-"); //根据空格区分[年月日,小时]
const [date2_Y = "", date2_M = "", date2_D = ""] = date2.split("-"); //根据空格区分[年月日,小时] const [date2_Y = "", date2_M = "", date2_D = ""] = date2.split("-"); //根据空格区分[年月日,小时]
return ( return (
(date1_Y === date2_Y && date1_M === date2_M && date1_D - date2_D) || (date1_Y === date2_Y && date1_M === date2_M && date1_D - date2_D) ||
(date1_Y === date2_Y && date1_M - date2_M) || (date1_Y === date2_Y && date1_M - date2_M) ||
date1_Y - date2_Y date1_Y - date2_Y
); );
}, },
setOption(data) { setOption(data) {
@ -122,7 +124,7 @@ export default {
const source = []; const source = [];
const sourceTop = ["日期"]; const sourceTop = ["日期"];
let map = {}, let map = {},
mapArr = []; mapArr = [];
// 生成所有{日期:[],日期:[]}格式的对象和所有包含所有日期的[日期1,日期2...] // 生成所有{日期:[],日期:[]}格式的对象和所有包含所有日期的[日期1,日期2...]
data.forEach((item) => { data.forEach((item) => {
item.dataList.forEach((inner) => { item.dataList.forEach((inner) => {
@ -152,38 +154,53 @@ export default {
}); });
source.unshift(sourceTop); source.unshift(sourceTop);
this.chart.setOption( this.chart.setOption(
{ {
grid: { grid: {
containLabel: true, containLabel: true,
},
legend: {
left: "center",
bottom: "15",
},
tooltip: {
trigger: "axis",
axisPointer: {
// 坐标轴指示器,坐标轴触发有效
type: "shadow", // 默认为直线,可选为:'line' | 'shadow'
}, },
legend: {
left: "center",
top: "10",
},
tooltip: {
trigger: "axis",
axisPointer: {
// 坐标轴指示器,坐标轴触发有效
type: "shadow", // 默认为直线,可选为:'line' | 'shadow'
},
},
textStyle: {
color: "#333333",
},
xAxis: {
type: "category",
},
yAxis: {
type: "value",
},
dataZoom: [
{
type: "inside",
start: 0,
end: 100,
},
{
start: 0,
end: 100,
},
],
dataset: {source},
series: source[0].slice(1).map((item) => {
return {
type: "line",
smooth: true,
areaStyle: {
opacity: 0.7,
},
};
}),
}, },
textStyle: { true
color: "#333333",
},
xAxis: {
type: "category",
},
yAxis: {
type: "value",
},
dataset: { source },
series: source[0].slice(1).map((item) => {
return {
type: "line",
};
}),
},
true
); );
}, },
initChart() { initChart() {
@ -192,7 +209,7 @@ export default {
init() { init() {
this.$nextTick(() => { this.$nextTick(() => {
this.initChart(); this.initChart();
this.$refs.dateRangeSelect.init(); this.$refs.dateRangeSelect.init(true);
}); });
}, },
}, },

View File

@ -21,6 +21,9 @@
<el-form-item> <el-form-item>
<el-button @click="onReset" native-type="button">重置</el-button> <el-button @click="onReset" native-type="button">重置</el-button>
</el-form-item> </el-form-item>
<el-form-item>
<el-button type="primary" @click="exportTable" native-type="button">导出</el-button>
</el-form-item>
</el-form> </el-form>
<!--表格--> <!--表格-->
<el-table <el-table
@ -144,6 +147,16 @@ export default {
} }
}, },
methods: { methods: {
// 导出表格
exportTable() {
if (!this.dateRange?.length) return
const [startTime, endTime] = this.dateRange
this.download('ems/statsReport/exportAmmeterRevenueData', {
siteId: this.siteId,
startTime,
endTime,
}, `收益报表_${startTime}-${endTime}.xlsx`)
},
// 搜索 // 搜索
onSearch() { onSearch() {
this.pageNum = 1//每次搜索从1开始搜索 this.pageNum = 1//每次搜索从1开始搜索

View File

@ -80,7 +80,7 @@
<el-table-column label="数据点位" prop="dataPoint"></el-table-column> <el-table-column label="数据点位" prop="dataPoint"></el-table-column>
<el-table-column <el-table-column
label="数据点位名称" label="数据点位名称"
prop="pointName" prop="dataPointName"
></el-table-column> ></el-table-column>
<!-- <el-table-column label="modbus地址">--> <!-- <el-table-column label="modbus地址">-->
<!-- <template slot-scope="scope">--> <!-- <template slot-scope="scope">-->
@ -88,8 +88,8 @@
<!-- `${scope.row.ipAddress || ""} ${scope.row.ipPort || ""}`--> <!-- `${scope.row.ipAddress || ""} ${scope.row.ipPort || ""}`-->
<!-- }}</span>--> <!-- }}</span>-->
<!-- </template>--> <!-- </template>-->
<!-- </el-table-column>--> <!-- </el-table-column>
<el-table-column label="寄存器地址" prop="寄存器地址"></el-table-column> <el-table-column label="寄存器地址" prop="寄存器地址"></el-table-column>-->
<el-table-column <el-table-column
label="最新值" label="最新值"
prop="pointValue" prop="pointValue"