|
|
@@ -46,13 +46,13 @@
|
|
|
<el-button
|
|
|
size="small"
|
|
|
type="primary"
|
|
|
- @click="getWaterTimeTotalList(1)"
|
|
|
+ @click="getWaterTimeFlowDetailEchart(1)"
|
|
|
>导出汇总</el-button>
|
|
|
|
|
|
<el-button
|
|
|
size="small"
|
|
|
type="primary"
|
|
|
- @click="getWaterTimeFlowDetailList(1)"
|
|
|
+ @click="getWaterTimeFlowDetailEchart(2)"
|
|
|
>导出详情</el-button>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -112,6 +112,9 @@ import comMixins from '@/views/mixins/comMixins'
|
|
|
import { getWaterTimeTotal, getWaterTimeFlowDetail } from '@/api/DMA/workbench'
|
|
|
import { queryDevice, queryAlarmManageList } from "@/api/shiYuan/scada";
|
|
|
import { getDmaLevel, getYearReportForm, exportReportForm } from '@/api/DMA/zoningManage'
|
|
|
+
|
|
|
+const elementResizeDetectorMaker = require('element-resize-detector')
|
|
|
+
|
|
|
export default {
|
|
|
name: 'minuteWaterReport',
|
|
|
components: { TableItem },
|
|
|
@@ -216,6 +219,8 @@ export default {
|
|
|
detailTable: [], // table表格数据
|
|
|
activeName: 'first',
|
|
|
tempDeviceCode: '', //临时数据
|
|
|
+
|
|
|
+ chartReady: {}
|
|
|
}
|
|
|
},
|
|
|
watch: {
|
|
|
@@ -223,14 +228,17 @@ export default {
|
|
|
},
|
|
|
created() {
|
|
|
this.initDate()
|
|
|
- this.getWaterTimeTotalList()
|
|
|
- this.getWaterTimeFlowDetailEchart()
|
|
|
- this.getWaterTimeFlowDetailList()
|
|
|
+ this.reportQuery()
|
|
|
},
|
|
|
mounted() {
|
|
|
this.getDeviceList()
|
|
|
- // this.getData()
|
|
|
- // this.loadChartLine({})
|
|
|
+
|
|
|
+ const erd = elementResizeDetectorMaker()
|
|
|
+ erd.listenTo(this.$refs.chartLine, function(element) {
|
|
|
+ that.$nextTick(function() {
|
|
|
+ that.chartReady.resize()
|
|
|
+ })
|
|
|
+ })
|
|
|
},
|
|
|
destroyed() {
|
|
|
this.clearPageInfo()
|
|
|
@@ -240,15 +248,21 @@ export default {
|
|
|
* @description 初始化时间
|
|
|
*/
|
|
|
initDate(){
|
|
|
- this.querySearch.startDate = this.getCurrentDay()
|
|
|
- this.querySearch.endDate = this.getCurrentDay()
|
|
|
+ this.querySearch.startDate = this.getDiffDay(1)
|
|
|
+ this.querySearch.endDate = this.getDiffDay(1)
|
|
|
|
|
|
this.querySearch.startHour = this.getCurrentDay()+" 00:00:00"
|
|
|
this.querySearch.endHour = this.getCurrentDay()+" 23:59:59"
|
|
|
},
|
|
|
|
|
|
handleClick(tab, event) {
|
|
|
+ const that = this
|
|
|
console.log(tab, event);
|
|
|
+ if (tab.name === 'first') {
|
|
|
+ that.$nextTick(() => {
|
|
|
+ that.chartReady.resize()
|
|
|
+ })
|
|
|
+ }
|
|
|
},
|
|
|
|
|
|
/* --------------------- 界面操作 ----------------*/
|
|
|
@@ -307,7 +321,7 @@ export default {
|
|
|
/**
|
|
|
* @description 获取分水用时列表合计统计
|
|
|
*/
|
|
|
- getWaterTimeTotalList(isexport){
|
|
|
+ getWaterTimeTotalList(){
|
|
|
const that = this
|
|
|
let searchParams = {
|
|
|
startDate:'',
|
|
|
@@ -316,23 +330,18 @@ export default {
|
|
|
endTime:'',
|
|
|
code:'',
|
|
|
}
|
|
|
- if (that.querySearch.startDate == '' || that.querySearch.endDate == '') {
|
|
|
- that.$message.info('请选择开始日期和结束日期')
|
|
|
- return
|
|
|
- }else{
|
|
|
+ if (that.querySearch.startDate != '' && that.querySearch.endDate != '') {
|
|
|
searchParams.startDate = that.querySearch.startDate
|
|
|
searchParams.endDate = that.querySearch.endDate
|
|
|
}
|
|
|
- if (that.querySearch.startHour == '' || that.querySearch.endHour == '') {
|
|
|
- that.$message.info('请选择开始时间和结束时间')
|
|
|
- return
|
|
|
- }else{
|
|
|
+ if (that.querySearch.startTime != '' && that.querySearch.endTime != '') {
|
|
|
searchParams.startTime = that.querySearch.startHour.split(" ")[1]
|
|
|
searchParams.endTime = that.querySearch.endHour.split(" ")[1]
|
|
|
}
|
|
|
if(that.querySearch.deviceId.length>0){
|
|
|
searchParams.code = that.querySearch.deviceId.toString()
|
|
|
}
|
|
|
+
|
|
|
that.totalTable = []
|
|
|
getWaterTimeTotal(searchParams).then(res=>{
|
|
|
console.log("getWaterTimeTotal："+ JSON.stringify(res))
|
|
|
@@ -351,12 +360,13 @@ export default {
|
|
|
}).catch((err) => {
|
|
|
console.log("getWaterTimeTotal："+err)
|
|
|
});
|
|
|
+
|
|
|
},
|
|
|
|
|
|
/**
|
|
|
* @description 获取分水用时列表详情 -> 图表
|
|
|
*/
|
|
|
- getWaterTimeFlowDetailEchart(){
|
|
|
+ getWaterTimeFlowDetailEchart(isexport){
|
|
|
const that = this
|
|
|
let searchParams = {
|
|
|
startDate:'',
|
|
|
@@ -391,57 +401,73 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
- getWaterTimeFlowDetail(searchParams).then(res=>{
|
|
|
- console.log("getWaterTimeFlowDetail："+ JSON.stringify(res))
|
|
|
- if(res.code == 1){
|
|
|
- const _result = res.result
|
|
|
- // that.detailTable = _result
|
|
|
- //拼接Ecahrt图形
|
|
|
- let data = {
|
|
|
- dataAry:[],
|
|
|
- seriesAry:[]
|
|
|
- }
|
|
|
-
|
|
|
- _result.forEach((item,index)=>{
|
|
|
- let deviceCode = item.deviceCode || ''
|
|
|
- let deviceName = item.deviceName || ''
|
|
|
- let seriesItem = {
|
|
|
- name: deviceName,
|
|
|
- data: [],
|
|
|
- type: 'line',
|
|
|
- symbolSize: 10,
|
|
|
- symbol: 'rect',
|
|
|
- stack: 'Total',
|
|
|
- smooth: true
|
|
|
+ if(isexport){
|
|
|
+ Object.assign(searchParams, {export:isexport+""})
|
|
|
+ if(isexport == '1'){ //统计
|
|
|
+ Object.assign(searchParams, {isTotal:isexport+""})
|
|
|
+ }
|
|
|
+ getWaterTimeFlowDetail(searchParams,searchParams.export).then((res) => {
|
|
|
+ console.log(res)
|
|
|
+ const blob = URL.createObjectURL(new Blob([res], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' }))
|
|
|
+ const a = document.createElement('a')
|
|
|
+ a.href = blob
|
|
|
+ a.download = isexport=='1'? '分时用水汇总报表.xlsx': '分时用水详情报表.xlsx'
|
|
|
+ a.click()
|
|
|
+ })
|
|
|
+ }else{
|
|
|
+ //查询
|
|
|
+ getWaterTimeFlowDetail(searchParams).then(res=>{
|
|
|
+ console.log("getWaterTimeFlowDetail："+ JSON.stringify(res))
|
|
|
+ if(res.code == 1){
|
|
|
+ const _result = res.result
|
|
|
+ // that.detailTable = _result
|
|
|
+ //拼接Ecahrt图形
|
|
|
+ let data = {
|
|
|
+ dataAry:[],
|
|
|
+ seriesAry:[]
|
|
|
}
|
|
|
- item.flowDetailVoList.forEach((itemDetail,indexDetail)=>{
|
|
|
- if(index==0){
|
|
|
- data.dataAry.push(itemDetail.time)
|
|
|
+
|
|
|
+ _result.forEach((item,index)=>{
|
|
|
+ let deviceCode = item.deviceCode || ''
|
|
|
+ let deviceName = item.deviceName || ''
|
|
|
+ let seriesItem = {
|
|
|
+ name: deviceName,
|
|
|
+ data: [],
|
|
|
+ type: 'line',
|
|
|
+ symbolSize: 10,
|
|
|
+ symbol: 'rect',
|
|
|
+ stack: 'Total',
|
|
|
+ smooth: true
|
|
|
}
|
|
|
- seriesItem.data.push(itemDetail.flow)
|
|
|
+ item.flowDetailVoList.forEach((itemDetail,indexDetail)=>{
|
|
|
+ if(index==0){
|
|
|
+ data.dataAry.push(itemDetail.time)
|
|
|
+ }
|
|
|
+ seriesItem.data.push(itemDetail.differenceValue)
|
|
|
+ })
|
|
|
+ data.seriesAry.push(seriesItem)
|
|
|
})
|
|
|
- data.seriesAry.push(seriesItem)
|
|
|
- })
|
|
|
-
|
|
|
- if(data.dataAry.length>0){
|
|
|
- that.loadChartLine(data)
|
|
|
+
|
|
|
+ if(data.dataAry.length>0){
|
|
|
+ that.loadChartLine(data)
|
|
|
+ }else{
|
|
|
+ that.drawNull(that.$refs.chartLine);
|
|
|
+ }
|
|
|
}else{
|
|
|
that.drawNull(that.$refs.chartLine);
|
|
|
+ console.log("getWaterTimeFlowDetail："+res.Message)
|
|
|
}
|
|
|
- }else{
|
|
|
+ }).catch((err) => {
|
|
|
that.drawNull(that.$refs.chartLine);
|
|
|
- console.log("getWaterTimeFlowDetail："+res.Message)
|
|
|
- }
|
|
|
- }).catch((err) => {
|
|
|
- that.drawNull(that.$refs.chartLine);
|
|
|
- console.log("getWaterTimeFlowDetail："+err)
|
|
|
- });
|
|
|
+ console.log("getWaterTimeFlowDetail："+err)
|
|
|
+ });
|
|
|
+ }
|
|
|
},
|
|
|
|
|
|
/**
|
|
|
* @description 获取分水用时列表详情 -> 列表
|
|
|
*/
|
|
|
- getWaterTimeFlowDetailList(isexport){
|
|
|
+ getWaterTimeFlowDetailList(){
|
|
|
const that = this
|
|
|
let searchParams = {
|
|
|
flag:'1',
|
|
|
@@ -469,48 +495,35 @@ export default {
|
|
|
searchParams.code = searchParams.code.substring(0,searchParams.code.length-1)
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
Object.assign(searchParams, that.pageInfo)
|
|
|
- if(isexport){
|
|
|
- Object.assign(searchParams, {export:isexport+""})
|
|
|
- getWaterTimeFlowDetail(searchParams,searchParams.export).then((res) => {
|
|
|
- console.log(res)
|
|
|
- const blob = URL.createObjectURL(new Blob([res], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' }))
|
|
|
- const a = document.createElement('a')
|
|
|
- a.href = blob
|
|
|
- a.download = '分时用水报表.xlsx'
|
|
|
- a.click()
|
|
|
- })
|
|
|
- }else{
|
|
|
- //查询
|
|
|
- getWaterTimeFlowDetail(searchParams).then(res=>{
|
|
|
- console.log("getWaterTimeFlowDetail："+ JSON.stringify(res))
|
|
|
- if(res.code == 1){
|
|
|
- const _result = res.result.records
|
|
|
- // that.detailTable = _result
|
|
|
- that.detailTable = []
|
|
|
- that.pageInfo.tableTotal = res.result.total
|
|
|
+ getWaterTimeFlowDetail(searchParams).then(res=>{
|
|
|
+ console.log("getWaterTimeFlowDetail："+ JSON.stringify(res))
|
|
|
+ if(res.code == 1){
|
|
|
+ const _result = res.result.records
|
|
|
+ // that.detailTable = _result
|
|
|
+ that.detailTable = []
|
|
|
+ that.pageInfo.tableTotal = res.result.total
|
|
|
|
|
|
- _result.forEach((item,index)=>{
|
|
|
- let deviceCode = item.deviceCode || ''
|
|
|
- let deviceName = item.deviceName || ''
|
|
|
+ _result.forEach((item,index)=>{
|
|
|
+ let deviceCode = item.deviceCode || ''
|
|
|
+ let deviceName = item.deviceName || ''
|
|
|
|
|
|
- item.flowDetailVoList.forEach((itemDetail,indexDetail)=>{
|
|
|
- that.detailTable.push({
|
|
|
- deviceCode: deviceCode,
|
|
|
- deviceName: deviceName,
|
|
|
- flow: itemDetail.flow,
|
|
|
- time: itemDetail.time
|
|
|
- })
|
|
|
+ item.flowDetailVoList.forEach((itemDetail,indexDetail)=>{
|
|
|
+ that.detailTable.push({
|
|
|
+ deviceCode: deviceCode,
|
|
|
+ deviceName: deviceName,
|
|
|
+ flow: itemDetail.differenceValue,
|
|
|
+ time: itemDetail.time
|
|
|
})
|
|
|
})
|
|
|
- }else{
|
|
|
- console.log("getWaterTimeFlowDetail："+res.Message)
|
|
|
- }
|
|
|
- }).catch((err) => {
|
|
|
- console.log("getWaterTimeFlowDetail："+err)
|
|
|
- });
|
|
|
- }
|
|
|
-
|
|
|
+ })
|
|
|
+ }else{
|
|
|
+ console.log("getWaterTimeFlowDetail："+res.Message)
|
|
|
+ }
|
|
|
+ }).catch((err) => {
|
|
|
+ console.log("getWaterTimeFlowDetail："+err)
|
|
|
+ });
|
|
|
},
|
|
|
|
|
|
/**
|
|
|
@@ -519,90 +532,32 @@ export default {
|
|
|
reportQuery() {
|
|
|
this.pageInfo.current = 1
|
|
|
console.log(this.querySearch)
|
|
|
- // this.getData()
|
|
|
this.tempDeviceCode = ""
|
|
|
- //分时用水列表合计
|
|
|
- this.getWaterTimeTotalList()
|
|
|
- this.getWaterTimeFlowDetailEchart()
|
|
|
- this.getWaterTimeFlowDetailList()
|
|
|
- },
|
|
|
|
|
|
- /**
|
|
|
- * @description 年度综合报表 导出
|
|
|
- */
|
|
|
- exportReport() {
|
|
|
- const that = this
|
|
|
- const searchParams = {
|
|
|
- export: '1', // 1导出
|
|
|
- startDate:'',
|
|
|
- endDate:'',
|
|
|
- code:'',
|
|
|
- }
|
|
|
- if (that.querySearch.startDate != '' && that.querySearch.endDate != '') {
|
|
|
- // searchParams.startDate = that.querySearch.startDate+' 00:00:00'
|
|
|
- // searchParams.endDate = that.querySearch.endDate+' 23:59:59'
|
|
|
- searchParams.startDate = that.querySearch.startDate
|
|
|
- searchParams.endDate = that.querySearch.endDate
|
|
|
- }
|
|
|
- if(!that.strIsNull(that.tempDeviceCode)){
|
|
|
- searchParams.code = that.tempDeviceCode
|
|
|
- }else{
|
|
|
- if(that.querySearch.deviceId.length>0){
|
|
|
-
|
|
|
- that.querySearch.deviceId.forEach((item,index)=>{
|
|
|
- searchParams.code += item+".LJL,"
|
|
|
- })
|
|
|
- if(searchParams.code.length>0){
|
|
|
- searchParams.code = searchParams.code.substring(0,searchParams.code.length-1)
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- console.log('query参数：' + JSON.stringify(searchParams))
|
|
|
- getWaterTimeFlowDetail(searchParams,searchParams.export).then((res) => {
|
|
|
- console.log(res)
|
|
|
- const blob = URL.createObjectURL(new Blob([res], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' }))
|
|
|
- const a = document.createElement('a')
|
|
|
- a.href = blob
|
|
|
- a.download = '分时用水报表.xlsx'
|
|
|
- a.click()
|
|
|
- })
|
|
|
- },
|
|
|
-
|
|
|
- /**
|
|
|
- * @description 查询年度综合报表
|
|
|
- */
|
|
|
- getData() {
|
|
|
- var that = this
|
|
|
- const query = that.pageInfo
|
|
|
- const params = {
|
|
|
- startDate: that.querySearch.startDate,
|
|
|
- endDate: that.querySearch.endDate,
|
|
|
- deviceIds: that.querySearch.deviceList.toString(),
|
|
|
+ if (this.strIsNull(this.querySearch.startDate) ||
|
|
|
+ this.strIsNull(this.querySearch.endDate))
|
|
|
+ {
|
|
|
+ this.$message.error('请选择开始日期和结束日期')
|
|
|
+ return
|
|
|
}
|
|
|
- if (!((!params.startDate && !params.endDate) || (params.startDate && params.endDate))) {
|
|
|
- this.$message.info('时间段请选择完整！')
|
|
|
+ if (this.strIsNull(this.querySearch.startHour) ||
|
|
|
+ this.strIsNull(this.querySearch.endHour))
|
|
|
+ {
|
|
|
+ this.$message.error('请选择开始时间和结束时间')
|
|
|
return
|
|
|
}
|
|
|
- Object.assign(query, params)
|
|
|
- console.log('query参数：' + JSON.stringify(query))
|
|
|
- that.detailTable = []
|
|
|
- getYearReportForm(query).then((res) => {
|
|
|
- if (res.code !== 1) {
|
|
|
- that.$message.error('获取信息出错!')
|
|
|
- return
|
|
|
- }
|
|
|
- // 数据总数
|
|
|
- that.pageInfo.tableTotal = res.result.total
|
|
|
- that.detailTable = res.result.records
|
|
|
- })
|
|
|
+ //分时用水列表合计
|
|
|
+ this.getWaterTimeTotalList()
|
|
|
+ this.getWaterTimeFlowDetailEchart()
|
|
|
+ this.getWaterTimeFlowDetailList()
|
|
|
},
|
|
|
|
|
|
/**
|
|
|
* @description 产销差 - 曲线
|
|
|
*/
|
|
|
- loadChartLine(data) {
|
|
|
+ loadChartLine(data) {
|
|
|
const that = this
|
|
|
- const chartReady = that.$echarts.init(that.$refs.chartLine)
|
|
|
+ that.chartReady = that.$echarts.init(that.$refs.chartLine)
|
|
|
const options = {
|
|
|
tooltip: {
|
|
|
trigger: 'axis'
|
|
|
@@ -631,6 +586,7 @@ export default {
|
|
|
},
|
|
|
yAxis: {
|
|
|
type: 'value',
|
|
|
+ name: '单位：m³',
|
|
|
},
|
|
|
series: data.seriesAry
|
|
|
// [
|
|
|
@@ -652,12 +608,12 @@ export default {
|
|
|
// ]
|
|
|
};
|
|
|
|
|
|
- chartReady.setOption(options, true)
|
|
|
+ that.chartReady.setOption(options, true)
|
|
|
|
|
|
// 自定义缩放
|
|
|
window.addEventListener('resize', () => {
|
|
|
- if (chartReady) {
|
|
|
- chartReady.resize()
|
|
|
+ if (that.chartReady) {
|
|
|
+ that.chartReady.resize()
|
|
|
}
|
|
|
})
|
|
|
},
|
tengmingxue