|
@@ -1,185 +1,196 @@ |
|
|
<template> |
|
|
<template> |
|
|
<div class="app-container" id='energyReportBox'> |
|
|
|
|
|
|
|
|
|
|
|
<!-- 搜索工作栏 --> |
|
|
|
|
|
<search-bar |
|
|
|
|
|
:formConfigs="formConfig" |
|
|
|
|
|
ref="searchBarForm" |
|
|
|
|
|
:isFold="isFold" |
|
|
|
|
|
@headBtnClick="buttonClick" |
|
|
|
|
|
/> |
|
|
|
|
|
<!-- 列表 --> |
|
|
|
|
|
<base-table |
|
|
|
|
|
:page="queryParams.pageNo" |
|
|
|
|
|
:limit="queryParams.pageSize" |
|
|
|
|
|
:table-props="tableProps" |
|
|
|
|
|
:table-data="list" |
|
|
|
|
|
:max-height="tableH" |
|
|
|
|
|
/> |
|
|
|
|
|
<pagination |
|
|
|
|
|
:page.sync="queryParams.pageNo" |
|
|
|
|
|
:limit.sync="queryParams.pageSize" |
|
|
|
|
|
:total="total" |
|
|
|
|
|
@pagination="getList" |
|
|
|
|
|
/> |
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
<div |
|
|
|
|
|
class="app-container" |
|
|
|
|
|
id="energyReportBox"> |
|
|
|
|
|
<!-- 搜索工作栏 --> |
|
|
|
|
|
<search-bar |
|
|
|
|
|
:formConfigs="formConfig" |
|
|
|
|
|
ref="searchBarForm" |
|
|
|
|
|
:isFold="isFold" |
|
|
|
|
|
@headBtnClick="buttonClick" /> |
|
|
|
|
|
<!-- 列表 --> |
|
|
|
|
|
<base-table |
|
|
|
|
|
:page="queryParams.pageNo" |
|
|
|
|
|
:limit="queryParams.pageSize" |
|
|
|
|
|
:table-props="tableProps" |
|
|
|
|
|
:table-data="list" |
|
|
|
|
|
:max-height="tableH" /> |
|
|
|
|
|
<pagination |
|
|
|
|
|
:page.sync="queryParams.pageNo" |
|
|
|
|
|
:limit.sync="queryParams.pageSize" |
|
|
|
|
|
:total="total" |
|
|
|
|
|
@pagination="getList" /> |
|
|
|
|
|
</div> |
|
|
</template> |
|
|
</template> |
|
|
|
|
|
|
|
|
<script> |
|
|
<script> |
|
|
import { energyReportPageAuto, energyReportPageExportAuto } from "@/api/monitoring/energyReport" |
|
|
|
|
|
import { getEnergyTypeListAll } from "@/api/base/energyType"; |
|
|
|
|
|
import { publicFormatter } from '@/utils/dict' |
|
|
|
|
|
import { parseTime } from '@/utils/ruoyi' |
|
|
|
|
|
|
|
|
import { |
|
|
|
|
|
energyReportPageAuto, |
|
|
|
|
|
energyReportPageExportAuto, |
|
|
|
|
|
} from '@/api/monitoring/energyReport'; |
|
|
|
|
|
import { getEnergyTypeListAll } from '@/api/base/energyType'; |
|
|
|
|
|
import { publicFormatter } from '@/utils/dict'; |
|
|
|
|
|
import { parseTime } from '@/utils/ruoyi'; |
|
|
const tableProps = [ |
|
|
const tableProps = [ |
|
|
{ |
|
|
|
|
|
prop: 'statisticType', |
|
|
|
|
|
label: '统计类型', |
|
|
|
|
|
filter: publicFormatter('statistic_type') |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
prop: 'startTime', |
|
|
|
|
|
label: '开始时间', |
|
|
|
|
|
filter: parseTime, |
|
|
|
|
|
minWidth: 160 |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
prop: 'endTime', |
|
|
|
|
|
label: '结束时间', |
|
|
|
|
|
filter: parseTime, |
|
|
|
|
|
minWidth: 160 |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
prop: 'statisticName', |
|
|
|
|
|
label: '统计方案' |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
prop: 'energyType', |
|
|
|
|
|
label: '能源类型' |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
prop: 'startNum', |
|
|
|
|
|
label: '抄表数(起始)' |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
prop: 'endNum', |
|
|
|
|
|
label: '抄表数(结束)' |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
prop: 'useNum', |
|
|
|
|
|
label: '消耗量' |
|
|
|
|
|
} |
|
|
|
|
|
] |
|
|
|
|
|
|
|
|
{ |
|
|
|
|
|
prop: 'statisticType', |
|
|
|
|
|
label: '统计类型', |
|
|
|
|
|
filter: publicFormatter('statistic_type'), |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
prop: 'startTime', |
|
|
|
|
|
label: '开始时间', |
|
|
|
|
|
filter: parseTime, |
|
|
|
|
|
minWidth: 160, |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
prop: 'endTime', |
|
|
|
|
|
label: '结束时间', |
|
|
|
|
|
filter: parseTime, |
|
|
|
|
|
minWidth: 160, |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
prop: 'statisticName', |
|
|
|
|
|
label: '统计方案', |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
prop: 'energyType', |
|
|
|
|
|
label: '能源类型', |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
prop: 'startNum', |
|
|
|
|
|
label: '抄表数(起始)', |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
prop: 'endNum', |
|
|
|
|
|
label: '抄表数(结束)', |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
prop: 'useNum', |
|
|
|
|
|
label: '消耗量', |
|
|
|
|
|
}, |
|
|
|
|
|
]; |
|
|
export default { |
|
|
export default { |
|
|
name: "EnergyLimit", |
|
|
|
|
|
data() { |
|
|
|
|
|
return { |
|
|
|
|
|
isFold: false, |
|
|
|
|
|
formConfig: [ |
|
|
|
|
|
{ |
|
|
|
|
|
type: 'select', |
|
|
|
|
|
label: '能源类型', |
|
|
|
|
|
selectOptions: [], |
|
|
|
|
|
param: 'energyTypeId', |
|
|
|
|
|
filterable: true |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
type: 'select', |
|
|
|
|
|
label: '统计类型', |
|
|
|
|
|
selectOptions: this.getDictDatas(this.DICT_TYPE.STATISTIC_TYPE), |
|
|
|
|
|
labelField: 'label', |
|
|
|
|
|
valueField: 'value', |
|
|
|
|
|
param: 'statisticType' |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
type: 'datePicker', |
|
|
|
|
|
label: '时间', |
|
|
|
|
|
dateType: 'datetimerange', |
|
|
|
|
|
format: 'yyyy-MM-dd HH:mm:ss', |
|
|
|
|
|
valueFormat: "timestamp", |
|
|
|
|
|
rangeSeparator: '-', |
|
|
|
|
|
startPlaceholder: '开始时间', |
|
|
|
|
|
endPlaceholder: '结束时间', |
|
|
|
|
|
param: 'timeVal', |
|
|
|
|
|
defaultSelect: [], |
|
|
|
|
|
width: 350 |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
type: 'button', |
|
|
|
|
|
btnName: '查询', |
|
|
|
|
|
name: 'search', |
|
|
|
|
|
color: 'primary' |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
type: 'separate' |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
type: this.$auth.hasPermi('monitoring:energy-report:export') ? 'button' : '', |
|
|
|
|
|
btnName: '导出', |
|
|
|
|
|
name: 'add', |
|
|
|
|
|
color: 'primary', |
|
|
|
|
|
plain: true |
|
|
|
|
|
} |
|
|
|
|
|
], |
|
|
|
|
|
tableProps, |
|
|
|
|
|
tableH: this.tableHeight(260), |
|
|
|
|
|
// 总条数 |
|
|
|
|
|
total: 0, |
|
|
|
|
|
// 班次基础信息列表 |
|
|
|
|
|
list: [], |
|
|
|
|
|
// 查询参数 |
|
|
|
|
|
queryParams: { |
|
|
|
|
|
pageNo: 1, |
|
|
|
|
|
pageSize: 20, |
|
|
|
|
|
energyTypeId: null, |
|
|
|
|
|
statisticType: null, |
|
|
|
|
|
startTime: null, |
|
|
|
|
|
endTime: null |
|
|
|
|
|
} |
|
|
|
|
|
}; |
|
|
|
|
|
}, |
|
|
|
|
|
created() { |
|
|
|
|
|
window.addEventListener('resize', () => { |
|
|
|
|
|
this.tableH = this.tableHeight(260) |
|
|
|
|
|
this.isFold = this.searchBarWidth('energyReportBox', 1198) |
|
|
|
|
|
}) |
|
|
|
|
|
this.getList() |
|
|
|
|
|
this.getTypeList() |
|
|
|
|
|
}, |
|
|
|
|
|
mounted() { |
|
|
|
|
|
this.isFold = this.searchBarWidth('energyReportBox', 1198) |
|
|
|
|
|
}, |
|
|
|
|
|
methods: { |
|
|
|
|
|
getTypeList() { |
|
|
|
|
|
getEnergyTypeListAll().then((res) => { |
|
|
|
|
|
this.formConfig[0].selectOptions = res.data || [] |
|
|
|
|
|
// this.energyTypeList = res.data || [] |
|
|
|
|
|
}) |
|
|
|
|
|
}, |
|
|
|
|
|
buttonClick(val) { |
|
|
|
|
|
switch (val.btnName) { |
|
|
|
|
|
case 'search': |
|
|
|
|
|
this.queryParams.pageNo = 1 |
|
|
|
|
|
this.queryParams.energyTypeId = val.energyTypeId |
|
|
|
|
|
this.queryParams.statisticType = val.statisticType |
|
|
|
|
|
this.queryParams.startTime = val.timeVal ? val.timeVal[0] : null |
|
|
|
|
|
this.queryParams.endTime = val.timeVal ? val.timeVal[1] : null |
|
|
|
|
|
this.getList() |
|
|
|
|
|
break |
|
|
|
|
|
default: |
|
|
|
|
|
this.$modal.confirm('是否确认导出').then(() => { |
|
|
|
|
|
return energyReportPageExportAuto({...this.queryParams}); |
|
|
|
|
|
}).then(response => { |
|
|
|
|
|
this.$download.excel(response, '能源统计报表.xls'); |
|
|
|
|
|
}).catch(() => {}) |
|
|
|
|
|
} |
|
|
|
|
|
}, |
|
|
|
|
|
/** 查询列表 */ |
|
|
|
|
|
getList() { |
|
|
|
|
|
energyReportPageAuto(this.queryParams).then(response => { |
|
|
|
|
|
this.list = response.data.list || []; |
|
|
|
|
|
this.total = response.data.total; |
|
|
|
|
|
}); |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
name: 'EnergyLimit', |
|
|
|
|
|
data() { |
|
|
|
|
|
return { |
|
|
|
|
|
isFold: false, |
|
|
|
|
|
formConfig: [ |
|
|
|
|
|
{ |
|
|
|
|
|
type: 'select', |
|
|
|
|
|
label: '能源类型', |
|
|
|
|
|
selectOptions: [], |
|
|
|
|
|
param: 'energyTypeId', |
|
|
|
|
|
filterable: true, |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
type: 'select', |
|
|
|
|
|
label: '统计类型', |
|
|
|
|
|
selectOptions: this.getDictDatas(this.DICT_TYPE.STATISTIC_TYPE), |
|
|
|
|
|
labelField: 'label', |
|
|
|
|
|
valueField: 'value', |
|
|
|
|
|
param: 'statisticType', |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
type: 'datePicker', |
|
|
|
|
|
label: '时间', |
|
|
|
|
|
dateType: 'datetimerange', |
|
|
|
|
|
format: 'yyyy-MM-dd HH:mm:ss', |
|
|
|
|
|
valueFormat: 'timestamp', |
|
|
|
|
|
rangeSeparator: '-', |
|
|
|
|
|
startPlaceholder: '开始时间', |
|
|
|
|
|
endPlaceholder: '结束时间', |
|
|
|
|
|
param: 'timeVal', |
|
|
|
|
|
defaultSelect: [], |
|
|
|
|
|
width: 350, |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
type: 'button', |
|
|
|
|
|
btnName: '查询', |
|
|
|
|
|
name: 'search', |
|
|
|
|
|
color: 'primary', |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
type: 'separate', |
|
|
|
|
|
}, |
|
|
|
|
|
{ |
|
|
|
|
|
type: this.$auth.hasPermi('monitoring:energy-report:export') |
|
|
|
|
|
? 'button' |
|
|
|
|
|
: '', |
|
|
|
|
|
btnName: '导出', |
|
|
|
|
|
name: 'add', |
|
|
|
|
|
color: 'primary', |
|
|
|
|
|
plain: true, |
|
|
|
|
|
}, |
|
|
|
|
|
], |
|
|
|
|
|
tableProps, |
|
|
|
|
|
tableH: this.tableHeight(260), |
|
|
|
|
|
// 总条数 |
|
|
|
|
|
total: 0, |
|
|
|
|
|
// 班次基础信息列表 |
|
|
|
|
|
list: [], |
|
|
|
|
|
// 查询参数 |
|
|
|
|
|
queryParams: { |
|
|
|
|
|
pageNo: 1, |
|
|
|
|
|
pageSize: 20, |
|
|
|
|
|
energyTypeId: null, |
|
|
|
|
|
statisticType: null, |
|
|
|
|
|
startTime: null, |
|
|
|
|
|
endTime: null, |
|
|
|
|
|
}, |
|
|
|
|
|
}; |
|
|
|
|
|
}, |
|
|
|
|
|
created() { |
|
|
|
|
|
window.addEventListener('resize', this._eventListeners); |
|
|
|
|
|
this.getList(); |
|
|
|
|
|
this.getTypeList(); |
|
|
|
|
|
}, |
|
|
|
|
|
mounted() { |
|
|
|
|
|
this.isFold = this.searchBarWidth('energyReportBox', 1198); |
|
|
|
|
|
}, |
|
|
|
|
|
destroyed() { |
|
|
|
|
|
window.removeEventListener('resize', this._eventListeners); |
|
|
|
|
|
}, |
|
|
|
|
|
methods: { |
|
|
|
|
|
_eventListeners() { |
|
|
|
|
|
this.tableH = this.tableHeight(260); |
|
|
|
|
|
this.isFold = this.searchBarWidth('energyReportBox', 1198); |
|
|
|
|
|
}, |
|
|
|
|
|
getTypeList() { |
|
|
|
|
|
getEnergyTypeListAll().then((res) => { |
|
|
|
|
|
this.formConfig[0].selectOptions = res.data || []; |
|
|
|
|
|
// this.energyTypeList = res.data || [] |
|
|
|
|
|
}); |
|
|
|
|
|
}, |
|
|
|
|
|
buttonClick(val) { |
|
|
|
|
|
switch (val.btnName) { |
|
|
|
|
|
case 'search': |
|
|
|
|
|
this.queryParams.pageNo = 1; |
|
|
|
|
|
this.queryParams.energyTypeId = val.energyTypeId; |
|
|
|
|
|
this.queryParams.statisticType = val.statisticType; |
|
|
|
|
|
this.queryParams.startTime = val.timeVal ? val.timeVal[0] : null; |
|
|
|
|
|
this.queryParams.endTime = val.timeVal ? val.timeVal[1] : null; |
|
|
|
|
|
this.getList(); |
|
|
|
|
|
break; |
|
|
|
|
|
default: |
|
|
|
|
|
this.$modal |
|
|
|
|
|
.confirm('是否确认导出') |
|
|
|
|
|
.then(() => { |
|
|
|
|
|
return energyReportPageExportAuto({ ...this.queryParams }); |
|
|
|
|
|
}) |
|
|
|
|
|
.then((response) => { |
|
|
|
|
|
this.$download.excel(response, '能源统计报表.xls'); |
|
|
|
|
|
}) |
|
|
|
|
|
.catch(() => {}); |
|
|
|
|
|
} |
|
|
|
|
|
}, |
|
|
|
|
|
/** 查询列表 */ |
|
|
|
|
|
getList() { |
|
|
|
|
|
energyReportPageAuto(this.queryParams).then((response) => { |
|
|
|
|
|
this.list = response.data.list || []; |
|
|
|
|
|
this.total = response.data.total; |
|
|
|
|
|
}); |
|
|
|
|
|
}, |
|
|
|
|
|
}, |
|
|
}; |
|
|
}; |
|
|
</script> |
|
|
</script> |