xzzn/emsfront
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

首页看板、电表报表接口联调，部分接口参数更新

Browse Source
This commit is contained in:
白菜
2025-07-09 21:16:54 +08:00
parent b3b4d9c0dc
commit b8827248cb
10 changed files with 159 additions and 134 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/api/ems/dzjk.js
View File

@ -102,14 +102,14 @@ export function getPcsNameList(siteId) {
//pcs曲线
export function getPCSData({siteId,deviceId,startTime,endTime,dataType}) {
return request({
url: `/ems/statsReport/getPCSData?siteId=${siteId}&deviceId=${deviceId}&startTime=${startTime}&endTime=${endTime}&dataType=${dataType}`,
url: `/ems/statsReport/getPCSData?siteId=${siteId}&deviceId=${deviceId}&startDate=${startTime}&endDate=${endTime}&dataType=${dataType}`,
method: 'get'
})
}
//电池堆曲线
export function getStackData({siteId,deviceId,startTime,endTime,dataType}) {
return request({
url: `/ems/statsReport/getStackData?siteId=${siteId}&deviceId=${deviceId}&startTime=${startTime}&endTime=${endTime}&dataType=${dataType}`,
url: `/ems/statsReport/getStackData?siteId=${siteId}&deviceId=${deviceId}&startDate=${startTime}&endDate=${endTime}&dataType=${dataType}`,
method: 'get'
})
}
@ -153,4 +153,17 @@ export function batteryAveTemp(siteId) {
}
//电表列表
export function getLoadNameList(siteId) {
return request({
url: `/ems/statsReport/getLoadNameList/batteryAveTemp?siteId=${siteId}`,
method: 'get'
})
}
// 电表报表
export function getAmmeterData({siteId,deviceId,dateTime}) {
return request({
url: `/ems/statsReport/getAmmeterData??siteId=${siteId}&deviceId=${deviceId}&dateTime=${dateTime}`,
method: 'get'
})
}

7
src/api/ems/home.js
View File

@ -6,3 +6,10 @@ export function getSiteTotalInfo() {
method: 'get'
})
}
// 图表
export function dataList() {
return request({
url: '/ems/homePage/dataList',
method: 'get'
})
}

90
src/views/ems/dzjk/tjbb/dbbb/index.vue
View File

@ -4,15 +4,15 @@
<!-- 搜索栏-->
<el-form :inline="true" class="select-container">
<el-form-item label="电表">
<el-select v-model="search.db" placeholder="请选择" :loading="loading" loading-text="正在加载数据">
<el-option :label="item.name" :value="item.id" v-for="(item,index) in dbOptions" :key="index+'dbOptions'"></el-option>
</el-select>
</el-form-item>
<el-form-item label="日报">
<el-select v-model="search.rb" placeholder="请选择" :loading="loading" loading-text="正在加载数据">
<el-option :label="item.name" :value="item.id" v-for="(item,index) in rbOptions" :key="index+'rbOptions'"></el-option>
<el-select v-model="search.deviceId" placeholder="请选择" :loading="loading" loading-text="正在加载数据">
<el-option :label="item.deviceName" :value="item.id" v-for="(item,index) in deviceOptions" :key="index+'dbOptions'"></el-option>
</el-select>
</el-form-item>
<!-- <el-form-item label="日报">-->
<!-- <el-select v-model="search.rb" placeholder="请选择" :loading="loading" loading-text="正在加载数据">-->
<!-- <el-option :label="item.name" :value="item.id" v-for="(item,index) in rbOptions" :key="index+'rbOptions'"></el-option>-->
<!-- </el-select>-->
<!-- </el-form-item>-->
<el-form-item label="时间选择">
<el-date-picker
v-model="search.date"
@ -41,7 +41,7 @@
<!-- 汇总列-->
<el-table-column label="汇总">
<el-table-column
prop="time"
prop="dateTime"
label="日期"
width="120">
</el-table-column>
@ -49,53 +49,53 @@
<!--充电量列-->
<el-table-column label="充电量">
<el-table-column
prop="cdlJian"
prop="activePeakKwh"
label="尖">
</el-table-column>
<el-table-column
prop="cdlFeng"
prop="activeHighKwh"
label="峰">
</el-table-column>
<el-table-column
prop="cdlPing"
prop="activeFlatKwh"
label="平">
</el-table-column>
<el-table-column
prop="cdlGu"
prop="activeValleyKwh"
label="谷">
</el-table-column>
<el-table-column
prop="cdlZong"
prop="activeTotalKwh"
label="总">
</el-table-column>
</el-table-column>
<!--充电量列-->
<el-table-column label="放电量">
<el-table-column
prop="fdlJian"
prop="reActivePeakKwh"
label="尖">
</el-table-column>
<el-table-column
prop="fdlFeng"
prop="reActiveHighKwh"
label="峰">
</el-table-column>
<el-table-column
prop="fdlPing"
prop="reActiveFlatKwh"
label="平">
</el-table-column>
<el-table-column
prop="fdlGu"
prop="reActiveValleyKwh"
label="谷">
</el-table-column>
<el-table-column
prop="fdlZong"
prop="reActiveTotalKwh"
label="总">
</el-table-column>
</el-table-column>
<!-- 效率-->
<el-table-column label="效率(%)">
<el-table-column
prop="efficiency">
prop="effect">
</el-table-column>
</el-table-column>
</el-table>
@ -104,8 +104,12 @@
<script>
import getQuerySiteId from "@/mixins/ems/getQuerySiteId";
import { getAmmeterData, getLoadNameList} from '@/api/ems/dzjk'
import {formatDate} from "@/filters/ems";
export default {
name:'DzjkTjbbDbbb',
mixins: [getQuerySiteId],
data() {
return {
loading:false,
@ -115,22 +119,13 @@ export default {
},
},
defaultDate:'',//默认展示的时间
search:{db:'',rb:'',date:''},
dbOptions:[
{name:'电表1',id:1},
{name:'电表2',id:2},
{name:'电表3',id:3},
],
rbOptions:[
{name:'日报1',id:1},
{name:'日报2',id:2},
],
tableData:[
{time:'2016-05',cdlJian:10,cdlFeng:20,cdlPing:100,cdlGu:30,cdlZong:100,fdlJian:20,fdlFeng:100,fdlPing:50,fdlGu:100,fdlZong:200,efficiency:80},
{time:'2016-05',cdlJian:10,cdlFeng:20,cdlPing:100,cdlGu:30,cdlZong:100,fdlJian:20,fdlFeng:100,fdlPing:50,fdlGu:100,fdlZong:200,efficiency:80},
{time:'2016-05',cdlJian:10,cdlFeng:20,cdlPing:100,cdlGu:30,cdlZong:100,fdlJian:20,fdlFeng:100,fdlPing:50,fdlGu:100,fdlZong:200,efficiency:80},
{time:'2016-05',cdlJian:10,cdlFeng:20,cdlPing:100,cdlGu:30,cdlZong:100,fdlJian:20,fdlFeng:100,fdlPing:50,fdlGu:100,fdlZong:200,efficiency:80},
]
search:{deviceId:'',date:''},
deviceOptions:[],
// rbOptions:[
// {name:'日报1',id:1},
// {name:'日报2',id:2},
// ],
tableData:[]
}
},
methods:{
@ -140,21 +135,36 @@ export default {
},
// 重置
onReset(){
this.search={
db:'',rb:'',date:''
}
this.search.date = ''
this.getData()
},
// 获取数据
getData(){
this.loading=false
this.loading=true
getAmmeterData({siteId:this.siteId,deviceId:this.search.deviceId,dateTime:formatDate(this.search.date)}).then(response=>{
this.tableData=response?.data || [];
}).finally(()=> {
this.loading = false
})
},
getDbList(){
return getLoadNameList(this.siteId).then(response=>{
this.deviceOptions=response?.data || [];
this.deviceOptions.length > 0 && (this.search.deviceId = this.deviceOptions[0].id);
})
},
init(){
this.loading = true
this.getDbList().then(()=>{
this.onReset()
})
},
getSummaries(){
}
},
mounted(){
this.getData()
this.defaultDate = new Date()
}
}

8
src/views/ems/dzjk/tjbb/dcdqx/index.vue
View File

@ -3,7 +3,7 @@
<div v-loading="loading">
<div class="select-container">
<el-form :inline="true">
<el-form-item label="PCS">
<el-form-item label="电池堆">
<el-select v-model="pcs" placeholder="请选择" :loading="loading" loading-text="正在加载数据">
<el-option :label="item.deviceName" :value="item.id" v-for="(item,index) in pcsOptions" :key="index+'pcsListOptions'"></el-option>
</el-select>
@ -47,7 +47,7 @@
import * as echarts from 'echarts'
import resize from "@/mixins/ems/resize";
import getQuerySiteId from "@/mixins/ems/getQuerySiteId";
import { getStackData, getPcsNameList} from '@/api/ems/dzjk'
import { getStackData, getStackNameList} from '@/api/ems/dzjk'
import {formatDate} from "@/filters/ems";
export default {
name:'DzjkTjbbDcdqx',
@ -91,8 +91,8 @@ export default {
this.getData()
},
getPcsList(){
return getPcsNameList(this.siteId).then(response => {
const data = response?.data || [];
return getStackNameList(this.siteId).then(response => {
const data = JSON.parse(JSON.stringify(response?.data || []))
this.pcsOptions = data
this.pcs = data.length>0?data[0].id:'';
})

25
src/views/ems/home/DlzbChart.vue
View File

@ -3,7 +3,7 @@
<el-card shadow="always" class="common-card-container common-card-container-body-no-padding">
<div slot="header">
<span class="card-title">电量指标</span>
<el-button style="float: right; padding: 3px 0" type="text" size="small">按年</el-button>
<!-- <el-button style="float: right; padding: 3px 0" type="text" size="small">按年</el-button>-->
</div>
<div style="height: 360px" id="dlzbChart"/>
</el-card>
@ -12,7 +12,6 @@
<style scoped lang="scss"></style>
<script>
import * as echarts from 'echarts'
require('echarts/theme/macarons') // echarts theme
import resize from '@/mixins/ems/resize'
export default {
@ -22,11 +21,6 @@ export default {
chart: null
}
},
mounted() {
this.$nextTick(() => {
this.initChart()
})
},
beforeDestroy() {
if (!this.chart) {
return
@ -35,11 +29,15 @@ export default {
this.chart = null
},
methods: {
initChart() {
this.chart = echarts.init(document.querySelector('#dlzbChart'), 'macarons')
this.setOptions()
initChart(data) {
this.chart = echarts.init(document.querySelector('#dlzbChart'))
this.setOption(data)
},
setOptions() {
setOption(data) {
const source=[['日期','充电量','放电量']]
data.forEach(item => {
source.push([item.dateMonth,item.chargeEnergy,item.disChargeEnergy])
})
this.chart.setOption({
legend: {
left: 'center',
@ -55,7 +53,7 @@ export default {
color:"#333333",
},
xAxis: {
data: ['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月'],
type: 'category',
axisLine: {
lineStyle:{
color: '#333333',
@ -70,10 +68,10 @@ export default {
}
}
},
dataset:{source},
series: [
{
name:'充电量',
data: [80,92,1,34,90,130,320,80,9,91,34,90],
type: 'line',
itemStyle: {
color: '#F86F70',
@ -85,7 +83,6 @@ export default {
}
},{
name:'放电量',
data: [820,932,901,934,1290,1330,1320,820,932,901,934,1290],
type: 'line',
itemStyle: {
color: '#488AFF',

43
src/views/ems/home/GjdjfbChart.vue
View File

@ -11,7 +11,6 @@
<style scoped lang="scss"></style>
<script>
import * as echarts from 'echarts'
require('echarts/theme/macarons') // echarts theme
import resize from '@/mixins/ems/resize'
export default {
@ -21,11 +20,6 @@ export default {
chart: null
}
},
mounted() {
this.$nextTick(() => {
this.initChart()
})
},
beforeDestroy() {
if (!this.chart) {
return
@ -34,11 +28,15 @@ export default {
this.chart = null
},
methods: {
initChart() {
this.chart = echarts.init(document.querySelector('#gjdjfbChart'), 'macarons')
this.setOptions()
initChart(data) {
this.chart = echarts.init(document.querySelector('#gjdjfbChart'))
this.setOption(data)
},
setOptions() {
setOption(data) {
const source=[['告警等级','告警数量','告警占比']]
data.forEach(item => {
source.push([item.level,item.dataNum,item.percent])
})
this.chart.setOption({
color:['#3C81FF','#FFBE29'],
legend: {
@ -55,7 +53,7 @@ export default {
color:"#333333",
},
xAxis: {
data: ['A级','B级','C级','D级','E级','F级'],
type: 'category',
axisLine: {
lineStyle:{
color: '#333333',
@ -79,19 +77,18 @@ export default {
onZero:false
}
}],
dataset:{source},
series: [
{
name:'数据一',
yAxisIndex:0,
data: [80,92,1,34,90,130,320],
type: 'line',
},
{
name:'数据二',
yAxisIndex:1,
data: [89,9,80,4,100,30,30],
type: 'bar',
}
{
name:'告警数量',
yAxisIndex:0,
type: 'line',
},
{
name:'告警占比',
yAxisIndex:1,
type: 'bar',
}
]
})
}

22
src/views/ems/home/GjqsChart.vue
View File

@ -11,7 +11,6 @@
<style scoped lang="scss"></style>
<script>
import * as echarts from 'echarts'
require('echarts/theme/macarons') // echarts theme
import resize from '@/mixins/ems/resize'
export default {
@ -21,11 +20,6 @@ export default {
chart: null
}
},
mounted() {
this.$nextTick(() => {
this.initChart()
})
},
beforeDestroy() {
if (!this.chart) {
return
@ -34,11 +28,15 @@ export default {
this.chart = null
},
methods: {
initChart() {
this.chart = echarts.init(document.querySelector('#gjqsChart'), 'macarons')
this.setOptions()
initChart(data) {
this.chart = echarts.init(document.querySelector('#gjqsChart'))
this.setOption(data)
},
setOptions() {
setOption(data) {
const source=[['日期','告警趋势']]
data.forEach(item => {
source.push([item.dateMonth,item.alarmNum])
})
this.chart.setOption({
color:['#F86F70'],
legend: {
@ -55,7 +53,7 @@ export default {
color:"#333333",
},
xAxis: {
data: ['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月'],
type: 'category',
axisLine: {
lineStyle:{
color: '#333333',
@ -70,10 +68,10 @@ export default {
}
}
},
dataset:{source},
series: [
{
name:'告警趋势',
data: [80,92,1,34,90,130,320,80,9,91,34,90],
type: 'line',
areaStyle: {}
}]

26
src/views/ems/home/SbgjzbChart.vue
View File

@ -11,7 +11,6 @@
<style scoped lang="scss"></style>
<script>
import * as echarts from 'echarts'
require('echarts/theme/macarons') // echarts theme
import resize from '@/mixins/ems/resize'
export default {
@ -21,11 +20,6 @@ export default {
chart: null
}
},
mounted() {
this.$nextTick(() => {
this.initChart()
})
},
beforeDestroy() {
if (!this.chart) {
return
@ -34,11 +28,15 @@ export default {
this.chart = null
},
methods: {
initChart() {
this.chart = echarts.init(document.querySelector('#sbgjzbChart'), 'macarons')
this.setOptions()
initChart(data) {
this.chart = echarts.init(document.querySelector('#sbgjzbChart'))
this.setOption(data)
},
setOptions() {
setOption(data) {
const source= []
data.forEach(item => {
source.push({value: item.alarmNum, name: item.type})
})
this.chart.setOption({
color:['#FFBE29','#3C81FF','#A796FF','#FC6B69','#58F3AA'],
tooltip: {
@ -53,13 +51,7 @@ export default {
name: '设备告警占比',
type: 'pie',
radius: '50%',
data: [
{ value: 1048, name: '数据一' },
{ value: 735, name: '数据二' },
{ value: 580, name: '数据三' },
{ value: 484, name: '数据四' },
{ value: 300, name: '数据五' }
],
data:source,
emphasis: {
itemStyle: {
shadowBlur: 10,

22
src/views/ems/home/XtxlChart.vue
View File

@ -11,7 +11,6 @@
<style scoped lang="scss"></style>
<script>
import * as echarts from 'echarts'
require('echarts/theme/macarons') // echarts theme
import resize from '@/mixins/ems/resize'
export default {
@ -21,11 +20,6 @@ export default {
chart: null
}
},
mounted() {
this.$nextTick(() => {
this.initChart()
})
},
beforeDestroy() {
if (!this.chart) {
return
@ -34,11 +28,15 @@ export default {
this.chart = null
},
methods: {
initChart() {
this.chart = echarts.init(document.querySelector('#xtxlChart'), 'macarons')
this.setOptions()
initChart(data) {
this.chart = echarts.init(document.querySelector('#xtxlChart'))
this.setOption(data)
},
setOptions() {
setOption(data) {
const source=[['日期','系统效率']]
data.forEach(item => {
source.push([item.dateMonth,item.systemEfficiency])
})
this.chart.setOption({
color:['#FFBE01'],
legend: {
@ -55,7 +53,7 @@ export default {
color:"#333333",
},
xAxis: {
data: ['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月'],
type: 'category',
axisLine: {
lineStyle:{
color: '#333333',
@ -70,10 +68,10 @@ export default {
}
}
},
dataset:{source},
series: [
{
name:'系统效率',
data: [80,92,1,34,90,130,320,80,9,91,34,90],
type: 'line',
}]
})

31
src/views/ems/home/index.vue
View File

@ -1,32 +1,29 @@
<template>
<div class="ems-dashboard-editor-container">
<div class="ems-dashboard-editor-container" v-loading="loading">
<zd-info></zd-info>
<div class="ems-content-container ems-content-container-padding">
<div class="content-title">数据概览</div>
<el-row :gutter="32" style="background:#fff;margin:30px 0;">
<el-col :xs="24" :sm="12" :lg="12">
<dlzb-chart/>
<dlzb-chart ref="dlzbchart"/>
</el-col>
<el-col :xs="24" :sm="12" :lg="12">
<xtxl-chart/>
<xtxl-chart ref="xtxlchart"/>
</el-col>
</el-row>
<el-row :gutter="32" style="background:#fff;margin:0;">
<el-col :xs="24" :sm="8" :lg="8">
<gjqs-chart/>
<gjqs-chart ref="gjqsChart"/>
</el-col>
<el-col :xs="24" :sm="8" :lg="8">
<sbgjzb-chart/>
<sbgjzb-chart ref="sbgjzbChart"/>
</el-col>
<el-col :xs="24" :sm="8" :lg="8">
<gjdjfb-chart/>
<gjdjfb-chart ref="gjdjfbChart"/>
</el-col>
</el-row>
</div>
</div>
</template>
@ -37,6 +34,7 @@ import XtxlChart from './XtxlChart.vue'
import GjqsChart from './GjqsChart.vue'
import SbgjzbChart from './SbgjzbChart.vue'
import GjdjfbChart from './GjdjfbChart.vue'
import { dataList } from '@/api/ems/home'
export default {
name: 'Index',
components: {
@ -49,10 +47,25 @@ export default {
},
data() {
return {
loading:false,
}
},
methods: {
},
mounted() {
this.loading = true
dataList().then(response => {
const data = JSON.parse(JSON.stringify(response?.data || {}))
this.$refs.dlzbchart.initChart(data?.elecDataList || [])
this.$refs.xtxlchart.initChart(data?.sysEfficList || [])
this.$refs.gjqsChart.initChart(data?.alarmDataList || [])
this.$refs.sbgjzbChart.initChart(data?.deviceAlarmList || [])
this.$refs.gjdjfbChart.initChart(data?.alarmLevelList || [])
}).finally(() => {
this.loading = false
})
}
}
</script>