yinq
/
XMXS-OS-UI
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

change - add能源预览

Browse Source
main
yinq 5 months ago
parent b739cca197
commit 312fdff7ff
2 changed files with 90 additions and 70 deletions
Show Stats Download Patch File Download Diff File

3
package.json
Unescape Escape View File

@ -59,7 +59,8 @@
"vue-meta": "2.4.0",
"vue-router": "3.4.9",
"vuedraggable": "2.24.3",
"vuex": "3.6.0"
"vuex": "3.6.0",
"xlsx": "^0.17.0"
},
"devDependencies": {
"@vue/cli-plugin-babel": "4.4.6",

131
src/views/ems/report/energyStatisticalReport/index.vue
Unescape Escape View File

@ -30,9 +30,21 @@
<el-col :span="19" :xs="24">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch"
label-width="100px">
label-width="100px"
>
<el-form-item label="能源类型" prop="energyType">
<el-select v-model="queryParams.energyType" style="width: 100px" placeholder="请选择能源类型">
<el-option
v-for="item in energyTypeList"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="日期类型" prop="dateType">
<el-select v-model="queryParams.dateType" placeholder="请选择日期类型">
<el-select v-model="queryParams.dateType" style="width: 100px" placeholder="请选择日期类型">
<el-option
v-for="item in dateTypeList"
:key="item.dateTypeCode"
@ -41,21 +53,21 @@
></el-option>
</el-select>
</el-form-item>
<el-form-item label="采集日期">
<el-form-item label="采集时间">
<el-date-picker
v-model="daterangeCollectTime"
style="width: 240px"
value-format="yyyy-MM-dd"
type="daterange"
style="width: 340px"
value-format="yyyy-MM-dd HH:mm:ss"
type="datetimerange"
range-separator="-"
start-placeholder="开始日期"
end-placeholder="结束日期"
start-placeholder="开始时间"
end-placeholder="结束时间"
></el-date-picker>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
<!-- <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>-->
</el-form-item>
</el-form>
@ -79,8 +91,8 @@
<el-table-column label="统计单元编号" align="center" prop="workUnitCode" v-if="columns[1].visible"/>
<el-table-column label="统计单元名称" align="center" prop="workUnitName" v-if="columns[2].visible"/>
<el-table-column label="耗量(kwh)" align="center" prop="expend" v-if="columns[3].visible"/>
<el-table-column label="开始日期" align="center" prop="beginTime" v-if="columns[4].visible" />
<el-table-column label="结束日期" align="center" prop="endTime" v-if="columns[5].visible" />
<el-table-column label="开始时间" align="center" prop="beginTime" v-if="columns[4].visible"/>
<el-table-column label="结束时间" align="center" prop="endTime" v-if="columns[5].visible"/>
<el-table-column label="仪表值(kwh)" align="center" prop="instrumentValue" v-if="columns[6].visible"/>
</el-table>
@ -99,13 +111,13 @@
<script>
import { getWorkUnitTrees } from '@/api/ems/base/baseWorkUnit'
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import Treeselect from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import { energyStatisticalReportList } from '@//api/ems/report/reportPort.js'
import { parseTime } from '@//utils/ruoyi'
export default {
name: "EnergyStatisticalReport",
name: 'EnergyStatisticalReport',
components: {
Treeselect
}, data() {
@ -129,103 +141,110 @@ export default {
monitorWorkUnitList: [],
daterangeCollectTime: [],
// 弹出层标题
title: "",
title: '',
// 是否显示弹出层
open: false,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
energyType: '2',
monitorCode: null,
workUnitCode: null,
monitorStatus: null,
monitorType: null,
dateType: 10,
dateType: 10
},
// 表单参数
form: {},
workUnitProps: {
children: "children",
label: "label"
children: 'children',
label: 'label'
},
dateTypeList: [
{ dateTypeCode: 19, dateTypeName: '时' },
{ dateTypeCode: 10, dateTypeName: '日' },
{ dateTypeCode: 7, dateTypeName: '月' },
{dateTypeCode: 4, dateTypeName: '年'},
{ dateTypeCode: 4, dateTypeName: '年' }
],
columns: [
{ key: 0, label: `主键标识`, visible: false },
{ key: 1, label: `统计单元编号`, visible: true },
{ key: 2, label: `统计单元名称`, visible: true },
{ key: 3, label: `耗量(kwh)`, visible: true },
{key: 4, label: `开始日期`, visible: true},
{key: 5, label: `结束日期`, visible: true},
{ key: 4, label: `开始时间`, visible: true },
{ key: 5, label: `结束时间`, visible: true },
{ key: 6, label: `仪表值(kwh)`, visible: true }
],
// 能源类型选项
energyTypeList: [
{ value: '2', label: '电' },
// { value: '3', label: '水' },
// { value: '4', label: '蒸汽' }
]
};
}
},
created() {
const nowDate = parseTime(new Date(), '{y}-{m}-{d}')
this.daterangeCollectTime[0] = nowDate
this.daterangeCollectTime[1] = nowDate
this.getList();
this.getWorkUnitTrees();
this.daterangeCollectTime[0] = nowDate + ' 00:00:00'
this.daterangeCollectTime[1] = nowDate + ' 23:59:59'
this.getList()
this.getWorkUnitTrees()
},
watch: {
// 根据名称筛选部门树
workUnitName(val) {
this.$refs.tree.filter(val);
this.$refs.tree.filter(val)
}
},
methods: {
/** 转换统计单元信息数据结构 */
workUnitOptionsNormalizer(node) {
if (node.children && !node.children.length) {
delete node.children;
delete node.children
}
return {
id2: node.workUnitCode,
label2: node.workUnitName,
children2: node.children
};
}
},
/** 查询计量设备下拉树结构 */
getWorkUnitTrees() {
getWorkUnitTrees().then(response => {
this.workUnitOptions = [];
this.workUnitOptions = JSON.parse(JSON.stringify(response.data).replaceAll('id','id2').replaceAll('code','id'));
});
this.workUnitOptions = []
this.workUnitOptions = JSON.parse(JSON.stringify(response.data).replaceAll('id', 'id2').replaceAll('code', 'id'))
})
},
// 筛选节点
filterNode(value, data) {
if (!value) return true;
return data.label.indexOf(value) !== -1;
if (!value) return true
return data.label.indexOf(value) !== -1
},
// 节点单击事件
handleNodeClick(data) {
this.queryParams.workUnitCode = data.id;
this.handleQuery();
this.queryParams.workUnitCode = data.id
this.handleQuery()
},
/** 查询统计计量信息列表 */
getList() {
this.loading = true;
this.queryParams.beginCollectTime = null;
this.queryParams.endCollectTime = null;
this.loading = true
this.queryParams.beginCollectTime = null
this.queryParams.endCollectTime = null
if (this.daterangeCollectTime != null && this.daterangeCollectTime !== '') {
this.queryParams.beginCollectTime = this.daterangeCollectTime[0];
this.queryParams.endCollectTime = this.daterangeCollectTime[1];
this.queryParams.beginCollectTime = this.daterangeCollectTime[0]
this.queryParams.endCollectTime = this.daterangeCollectTime[1]
}
energyStatisticalReportList(this.queryParams).then(response => {
this.monitorWorkUnitList = response.rows;
this.total = response.total;
this.loading = false;
});
this.monitorWorkUnitList = response.rows
this.total = response.total
this.loading = false
})
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
this.open = false
this.reset()
},
// 表单重置
reset() {
@ -236,20 +255,20 @@ export default {
monitorCode: null,
workUnitCode: null,
monitorStatus: 0,
monitorType: 1,
};
this.resetForm("form");
monitorType: 1
}
this.resetForm('form')
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
this.queryParams.pageNum = 1
this.getList()
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.queryParams.workUnitCode = null;
this.handleQuery();
this.resetForm('queryForm')
this.queryParams.workUnitCode = null
this.handleQuery()
},
// 多选框选中数据
handleSelectionChange(selection) {
@ -264,5 +283,5 @@ export default {
}, `统计能耗报表_${new Date().getTime()}.xlsx`)
}
}
};
}
</script>

Write Preview
Loading…
Cancel
Save