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

统计报表优化

Browse Source
This commit is contained in:
白菜
2026-01-28 21:34:58 +08:00
parent ac1d1ae154
commit 814103c881
5 changed files with 378 additions and 302 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1,4 +1,3 @@
<template> <template>
<div style="width:100%" v-loading="loading"> <div style="width:100%" v-loading="loading">
<!-- 搜索栏--> <!-- 搜索栏-->
@ -22,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
@ -29,7 +31,7 @@
: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"
@ -37,7 +39,7 @@
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"
@ -93,7 +95,7 @@
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"
@ -120,74 +122,84 @@
<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;
} }
} }

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

@ -6,7 +6,7 @@
> >
<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">
@ -16,7 +16,8 @@
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;
@ -142,7 +144,7 @@ export default {
}, },
legend: { legend: {
left: "center", left: "center",
bottom: "15", top: "10",
}, },
tooltip: { tooltip: {
trigger: "axis", trigger: "axis",
@ -160,10 +162,25 @@ export default {
yAxis: { yAxis: {
type: "value", type: "value",
}, },
dataset: { source }, dataZoom: [
{
type: "inside",
start: 0,
end: 100,
},
{
start: 0,
end: 100,
},
],
dataset: {source},
series: source[0].slice(1).map((item) => { series: source[0].slice(1).map((item) => {
return { return {
type: "line", type: "line",
smooth: true,
areaStyle: {
opacity: 0.7,
},
}; };
}), }),
}, },
@ -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);
}); });
}, },
}, },

51
src/views/ems/dzjk/tjbb/glqx/index.vue
View File

@ -8,7 +8,6 @@
<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>
@ -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,19 +46,11 @@ 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),
@ -90,7 +81,7 @@ export default {
}, },
legend: { legend: {
left: "center", left: "center",
bottom: "15", top: "10",
}, },
tooltip: { tooltip: {
trigger: "axis", trigger: "axis",
@ -108,19 +99,46 @@ export default {
yAxis: { yAxis: {
type: "value", type: "value",
}, },
dataset: { source }, dataset: {source},
dataZoom: [
{
type: "inside",
start: 0,
end: 100,
},
{
start: 0,
end: 100,
},
],
series: [ series: [
{ {
type: "line", type: "line",
smooth: true,
areaStyle: {
opacity: 0.7,
},
}, },
{ {
type: "line", type: "line",
smooth: true,
areaStyle: {
opacity: 0.7,
},
}, },
{ {
type: "line", type: "line",
smooth: true,
areaStyle: {
opacity: 0.7,
},
}, },
{ {
type: "line", type: "line",
smooth: true,
areaStyle: {
opacity: 0.7,
},
}, },
], ],
}, },
@ -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();
}); });

35
src/views/ems/dzjk/tjbb/pcsqx/index.vue
View File

@ -6,7 +6,7 @@
> >
<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">
@ -16,7 +16,8 @@
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
@ -158,7 +160,7 @@ export default {
}, },
legend: { legend: {
left: "center", left: "center",
bottom: "15", top: "10",
}, },
tooltip: { tooltip: {
trigger: "axis", trigger: "axis",
@ -176,10 +178,25 @@ export default {
yAxis: { yAxis: {
type: "value", type: "value",
}, },
dataset: { source }, dataZoom: [
{
type: "inside",
start: 0,
end: 100,
},
{
start: 0,
end: 100,
},
],
dataset: {source},
series: source[0].slice(1).map((item) => { series: source[0].slice(1).map((item) => {
return { return {
type: "line", type: "line",
smooth: true,
areaStyle: {
opacity: 0.7,
},
}; };
}), }),
}, },
@ -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);
}); });
}, },
}, },

13
src/views/ems/dzjk/tjbb/sybb/index.vue
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开始搜索