电表报表
This commit is contained in:
@ -151,19 +151,26 @@ export function batteryAveTemp(siteId) {
|
|||||||
method: 'get'
|
method: 'get'
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
// 功率曲线
|
||||||
|
export function getPowerData({siteId,deviceId,startDate,endDate,dataType}) {
|
||||||
|
return request({
|
||||||
|
url: `/ems/statsReport/getPowerData?siteId=${siteId}&deviceId=${deviceId}&startDate=${startDate}&endDate=${endDate}&dataType=${dataType}`,
|
||||||
|
method: 'get'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
//电表列表
|
//电表列表
|
||||||
export function getLoadNameList(siteId) {
|
export function getLoadNameList(siteId) {
|
||||||
return request({
|
return request({
|
||||||
url: `/ems/statsReport/getLoadNameList/batteryAveTemp?siteId=${siteId}`,
|
url: `/ems/statsReport/getLoadNameList?siteId=${siteId}`,
|
||||||
method: 'get'
|
method: 'get'
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
// 电表报表
|
// 电表报表
|
||||||
export function getAmmeterData({siteId,deviceId,dateTime}) {
|
export function getAmmeterData({siteId,deviceId,dateTime}) {
|
||||||
return request({
|
return request({
|
||||||
url: `/ems/statsReport/getAmmeterData??siteId=${siteId}&deviceId=${deviceId}&dateTime=${dateTime}`,
|
url: `/ems/statsReport/getAmmeterData?siteId=${siteId}&deviceId=${deviceId}&dateTime=${dateTime}`,
|
||||||
method: 'get'
|
method: 'get'
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -1,10 +1,10 @@
|
|||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div style="width:100%">
|
<div style="width:100%" v-loading="loading">
|
||||||
<!-- 搜索栏-->
|
<!-- 搜索栏-->
|
||||||
<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" placeholder="请选择" :loading="loading" loading-text="正在加载数据">
|
<el-select v-model="search.deviceId" placeholder="请选择" loading-text="正在加载数据">
|
||||||
<el-option :label="item.deviceName" :value="item.id" v-for="(item,index) in deviceOptions" :key="index+'dbOptions'"></el-option>
|
<el-option :label="item.deviceName" :value="item.id" v-for="(item,index) in deviceOptions" :key="index+'dbOptions'"></el-option>
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
@ -33,17 +33,16 @@
|
|||||||
class="common-table"
|
class="common-table"
|
||||||
:data="tableData"
|
:data="tableData"
|
||||||
stripe
|
stripe
|
||||||
max-height="500"
|
|
||||||
show-summary
|
|
||||||
sum-text="汇总"
|
|
||||||
style="width: 100%;margin-top:25px;">
|
style="width: 100%;margin-top:25px;">
|
||||||
<!-- todo汇总数据 :summary-method="getSummaries"-->
|
|
||||||
<!-- 汇总列-->
|
<!-- 汇总列-->
|
||||||
<el-table-column label="汇总">
|
<el-table-column label="汇总">
|
||||||
<el-table-column
|
<el-table-column
|
||||||
prop="dateTime"
|
prop="dataTime"
|
||||||
label="日期"
|
label="日期"
|
||||||
width="120">
|
width="120">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span>{{scope.row.dataTime}}{{scope.row.dataTime === '汇总' ? '' : ':00'}}</span>
|
||||||
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<!--充电量列-->
|
<!--充电量列-->
|
||||||
@ -140,6 +139,7 @@ export default {
|
|||||||
},
|
},
|
||||||
// 获取数据
|
// 获取数据
|
||||||
getData(){
|
getData(){
|
||||||
|
if(!this.search.deviceId) return
|
||||||
this.loading=true
|
this.loading=true
|
||||||
getAmmeterData({siteId:this.siteId,deviceId:this.search.deviceId,dateTime:formatDate(this.search.date)}).then(response=>{
|
getAmmeterData({siteId:this.siteId,deviceId:this.search.deviceId,dateTime:formatDate(this.search.date)}).then(response=>{
|
||||||
this.tableData=response?.data || [];
|
this.tableData=response?.data || [];
|
||||||
@ -155,13 +155,18 @@ export default {
|
|||||||
},
|
},
|
||||||
init(){
|
init(){
|
||||||
this.loading = true
|
this.loading = true
|
||||||
|
this.deviceOptions = []
|
||||||
|
this.search.deviceId=''
|
||||||
|
this.search.date=''
|
||||||
|
this.tableData=[]
|
||||||
this.getDbList().then(()=>{
|
this.getDbList().then(()=>{
|
||||||
|
if(this.search.deviceId){
|
||||||
this.onReset()
|
this.onReset()
|
||||||
|
}else{
|
||||||
|
this.loading = false
|
||||||
|
}
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
getSummaries(){
|
|
||||||
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
|
|
||||||
mounted(){
|
mounted(){
|
||||||
|
|||||||
@ -98,10 +98,11 @@ export default {
|
|||||||
})
|
})
|
||||||
},
|
},
|
||||||
getData(){
|
getData(){
|
||||||
this.loading=true;
|
|
||||||
const {siteId,pcs,activeBtn}=this;
|
const {siteId,pcs,activeBtn}=this;
|
||||||
const [start='',end='']=(this.dateRange || [])
|
const [start='',end='']=(this.dateRange || [])
|
||||||
|
if(!pcs) return
|
||||||
//接口调用完成之后 设置图表、结束loading
|
//接口调用完成之后 设置图表、结束loading
|
||||||
|
this.loading=true;
|
||||||
getStackData({siteId,deviceId:pcs,startTime:formatDate(start),endTime:formatDate(end),dataType:activeBtn}).then(response => {
|
getStackData({siteId,deviceId:pcs,startTime:formatDate(start),endTime:formatDate(end),dataType:activeBtn}).then(response => {
|
||||||
this.setOption(response?.data || [])
|
this.setOption(response?.data || [])
|
||||||
}).finally(()=>{this.loading=false;})
|
}).finally(()=>{this.loading=false;})
|
||||||
@ -152,9 +153,15 @@ export default {
|
|||||||
},
|
},
|
||||||
init(){
|
init(){
|
||||||
this.loading = true
|
this.loading = true
|
||||||
|
this.pcs=''
|
||||||
|
this.pcsOptions=[]
|
||||||
this.initChart()
|
this.initChart()
|
||||||
this.getPcsList().then(()=>{
|
this.getPcsList().then(()=>{
|
||||||
|
if(this.pcs){
|
||||||
this.onReset()
|
this.onReset()
|
||||||
|
}else{
|
||||||
|
this.loading = false
|
||||||
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|||||||
@ -151,9 +151,10 @@ export default {
|
|||||||
},
|
},
|
||||||
//表格数据
|
//表格数据
|
||||||
async getTableData(){
|
async getTableData(){
|
||||||
this.loading=true;
|
|
||||||
const {stackId,clusterId,date} =this.search
|
const {stackId,clusterId,date} =this.search
|
||||||
const {siteId,pageNum,pageSize}=this
|
const {siteId,pageNum,pageSize}=this
|
||||||
|
if(!stackId) return
|
||||||
|
this.loading=true;
|
||||||
await getClusterData({dateTime:formatDate(date),stackId,clusterId,siteId,pageNum,pageSize}).then(response => {
|
await getClusterData({dateTime:formatDate(date),stackId,clusterId,siteId,pageNum,pageSize}).then(response => {
|
||||||
this.tableData=response?.rows || [];
|
this.tableData=response?.rows || [];
|
||||||
this.totalSize = response?.total || 0
|
this.totalSize = response?.total || 0
|
||||||
@ -177,10 +178,19 @@ export default {
|
|||||||
}).finally(() => {this.clusterloading =false})
|
}).finally(() => {this.clusterloading =false})
|
||||||
},
|
},
|
||||||
async init(){
|
async init(){
|
||||||
|
this.loading = true
|
||||||
|
this.search={stackId:'',clusterId:'',date:''}
|
||||||
|
this.stackOptions=[]//{id:'',deviceName:''}
|
||||||
|
this.clusterOptions=[]//{id:'',deviceName:''}
|
||||||
|
this.tableData=[]
|
||||||
// 只有页面初次加载或切换站点的时候调用电池堆列表,其他情况不需要
|
// 只有页面初次加载或切换站点的时候调用电池堆列表,其他情况不需要
|
||||||
await this.getStackList()
|
await this.getStackList()
|
||||||
|
if(this.search.stackId){
|
||||||
await this.getClusterList()
|
await this.getClusterList()
|
||||||
await this.onReset()
|
await this.onReset()
|
||||||
|
}else{
|
||||||
|
this.loading = false
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|||||||
@ -8,6 +8,11 @@
|
|||||||
<!-- <el-option :label="item.name" :value="item.id" v-for="(item,index) in wdOptions" :key="index+'sblxOptions'"></el-option>-->
|
<!-- <el-option :label="item.name" :value="item.id" v-for="(item,index) in wdOptions" :key="index+'sblxOptions'"></el-option>-->
|
||||||
<!-- </el-select>-->
|
<!-- </el-select>-->
|
||||||
<!-- </el-form-item>-->
|
<!-- </el-form-item>-->
|
||||||
|
<el-form-item label="PCS">
|
||||||
|
<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>
|
||||||
|
</el-form-item>
|
||||||
<el-form-item label="时间选择">
|
<el-form-item label="时间选择">
|
||||||
<el-date-picker
|
<el-date-picker
|
||||||
v-model="dateRange"
|
v-model="dateRange"
|
||||||
@ -46,9 +51,12 @@
|
|||||||
<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 getQuerySiteId from "@/mixins/ems/getQuerySiteId";
|
||||||
|
import {getPcsNameList, getPowerData} from "@/api/ems/dzjk";
|
||||||
|
import {formatDate} from "@/filters/ems";
|
||||||
export default {
|
export default {
|
||||||
name:'DzjkTjbbGlqx',
|
name:'DzjkTjbbGlqx',
|
||||||
mixins: [resize],
|
mixins: [resize,getQuerySiteId],
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
pickerOptions:{
|
pickerOptions:{
|
||||||
@ -59,18 +67,14 @@ export default {
|
|||||||
defaultDateRange:[],//默认展示的时间
|
defaultDateRange:[],//默认展示的时间
|
||||||
dateRange:[],
|
dateRange:[],
|
||||||
loading:false,
|
loading:false,
|
||||||
// todo delete
|
pcs:'',
|
||||||
// wd:'',
|
pcsOptions: [],
|
||||||
// wdOptions: [
|
activeBtn:'1',
|
||||||
// {name:'网点一',id:1},
|
|
||||||
// {name:'网点二',id:2},
|
|
||||||
// ],
|
|
||||||
activeBtn:'dwgl',
|
|
||||||
btnList:[
|
btnList:[
|
||||||
{name:'电网功率',id:'dwgl'},
|
{name:'电网功率',id:'1',attr:'gridPower'},
|
||||||
{name:'负载功率',id:'fzgl'},
|
{name:'负载功率',id:'2',attr:'loadPower'},
|
||||||
{name:'储能功率',id:'cngl'},
|
{name:'储能功率',id:'3',attr:'storagePower'},
|
||||||
{name:'光伏功率',id:'gfgl'},
|
{name:'光伏功率',id:'4',attr:'pvPower'},
|
||||||
],
|
],
|
||||||
|
|
||||||
}
|
}
|
||||||
@ -80,6 +84,7 @@ export default {
|
|||||||
if(id !== this.activeBtn){
|
if(id !== this.activeBtn){
|
||||||
console.log('点击了不同的菜单,更新数据')
|
console.log('点击了不同的菜单,更新数据')
|
||||||
this.activeBtn=id;
|
this.activeBtn=id;
|
||||||
|
this.getData()
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
// 搜索
|
// 搜索
|
||||||
@ -91,15 +96,29 @@ export default {
|
|||||||
this.dateRange=[]
|
this.dateRange=[]
|
||||||
this.getData()
|
this.getData()
|
||||||
},
|
},
|
||||||
getData(){
|
getPcsList(){
|
||||||
this.loading=true;
|
return getPcsNameList(this.siteId).then(response => {
|
||||||
this.chart.showLoading()
|
const data = response?.data || [];
|
||||||
//接口调用完成之后 设置图表、结束loading
|
this.pcsOptions = data
|
||||||
this.setOption()
|
this.pcs = data.length>0?data[0].id:'';
|
||||||
this.loading=false;
|
})
|
||||||
this.chart.hideLoading()
|
|
||||||
},
|
},
|
||||||
setOption() {
|
getData(){
|
||||||
|
const {siteId,pcs,activeBtn}=this;
|
||||||
|
const [start='',end='']=(this.dateRange || [])
|
||||||
|
if(!pcs) return
|
||||||
|
//接口调用完成之后 设置图表、结束loading
|
||||||
|
this.loading=true;
|
||||||
|
getPowerData({siteId,deviceId:pcs,startDate:formatDate(start),endDate:formatDate(end),dataType:activeBtn}).then(response => {
|
||||||
|
this.setOption(response?.data || [])
|
||||||
|
}).finally(()=>{this.loading=false;})
|
||||||
|
},
|
||||||
|
setOption(data) {
|
||||||
|
const {name,attr} =this.btnList.find(item=>item.id===this.activeBtn)
|
||||||
|
const source = [['日期',name]]
|
||||||
|
data.forEach((item,index)=>{
|
||||||
|
source.push([item.statisDate,item[attr]])
|
||||||
|
})
|
||||||
this.chart.setOption({
|
this.chart.setOption({
|
||||||
color:['#FFBD00','#3C81FF'],
|
color:['#FFBD00','#3C81FF'],
|
||||||
legend: {
|
legend: {
|
||||||
@ -116,35 +135,41 @@ export default {
|
|||||||
color:"#333333",
|
color:"#333333",
|
||||||
},
|
},
|
||||||
xAxis: {
|
xAxis: {
|
||||||
data: ['01','02','03','04','05','06','07','08','09','10','11','12','13','14','15','16','17','18','19','20','21','22','23','24'],
|
type: 'category',
|
||||||
},
|
},
|
||||||
yAxis: {
|
yAxis: {
|
||||||
type: 'value',
|
type: 'value',
|
||||||
},
|
},
|
||||||
|
dataset:{source},
|
||||||
series: [
|
series: [
|
||||||
{
|
{
|
||||||
name:this.btnList.find(item=>item.id===this.activeBtn).name,
|
name,
|
||||||
data: [80,92,1,34,90,130,320,80,9,91,34,90,80,92,1,34,90,130,320,80,9,91,34,90],
|
|
||||||
type: 'scatter',
|
type: 'scatter',
|
||||||
}
|
}
|
||||||
// ,{
|
|
||||||
// name:'实时电池平均SOC',
|
|
||||||
// data: [820,932,901,934,1290,1330,1320,820,932,901,934,1290],
|
|
||||||
// type: 'scatter',
|
|
||||||
// }
|
|
||||||
]
|
]
|
||||||
})
|
},true)
|
||||||
},
|
},
|
||||||
initChart() {
|
initChart() {
|
||||||
this.chart = echarts.init(document.querySelector('#glqxEchart'));
|
this.chart = echarts.init(document.querySelector('#glqxEchart'));
|
||||||
|
},
|
||||||
|
init(){
|
||||||
|
this.loading = true
|
||||||
|
this.pcs=''
|
||||||
|
this.pcsOptions=[]
|
||||||
|
this.initChart()
|
||||||
|
this.getPcsList().then(()=>{
|
||||||
|
if(this.pcs){
|
||||||
|
this.onReset()
|
||||||
|
}else{
|
||||||
|
this.loading = false
|
||||||
|
}
|
||||||
|
})
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
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];
|
||||||
this.initChart()
|
|
||||||
this.getData()
|
|
||||||
},
|
},
|
||||||
beforeDestroy() {
|
beforeDestroy() {
|
||||||
if (!this.chart) {
|
if (!this.chart) {
|
||||||
|
|||||||
@ -101,9 +101,10 @@ export default {
|
|||||||
})
|
})
|
||||||
},
|
},
|
||||||
getData(){
|
getData(){
|
||||||
this.loading=true;
|
|
||||||
const {siteId,pcs,activeBtn}=this;
|
const {siteId,pcs,activeBtn}=this;
|
||||||
const [start='',end='']=(this.dateRange || [])
|
const [start='',end='']=(this.dateRange || [])
|
||||||
|
if(!pcs) return
|
||||||
|
this.loading=true;
|
||||||
//接口调用完成之后 设置图表、结束loading
|
//接口调用完成之后 设置图表、结束loading
|
||||||
getPCSData({siteId,deviceId:pcs,startTime:formatDate(start),endTime:formatDate(end),dataType:activeBtn}).then(response => {
|
getPCSData({siteId,deviceId:pcs,startTime:formatDate(start),endTime:formatDate(end),dataType:activeBtn}).then(response => {
|
||||||
this.setOption(response?.data || [])
|
this.setOption(response?.data || [])
|
||||||
@ -156,9 +157,17 @@ export default {
|
|||||||
},
|
},
|
||||||
init(){
|
init(){
|
||||||
this.loading = true
|
this.loading = true
|
||||||
|
this.pcs=''
|
||||||
|
this.pcsOptions=[]
|
||||||
|
this.dateRange =[]
|
||||||
this.initChart()
|
this.initChart()
|
||||||
this.getPcsList().then(()=>{
|
this.getPcsList().then(()=>{
|
||||||
|
if(this.pcs){
|
||||||
this.onReset()
|
this.onReset()
|
||||||
|
}else{
|
||||||
|
this.loading=false;
|
||||||
|
}
|
||||||
|
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|||||||
Reference in New Issue
Block a user