|
@@ -22,23 +22,38 @@
|
|
|
</el-col>
|
|
|
<el-col :span="20" :xs="24">
|
|
|
<div class="container-block">
|
|
|
+ <el-form size="small" :inline="true" label-width="68px">
|
|
|
+ <el-form-item label="地块">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span>{{ selectedLabel }}</span>
|
|
|
+ </template>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ <div class="container-block">
|
|
|
<div class="ctl-container">
|
|
|
- <el-date-picker v-model="dateRange" type="datetimerange" @change="getList"
|
|
|
- value-format="yyyy-MM-dd hh:mm:ss" :picker-options="pickerOptions" range-separator="至"
|
|
|
- start-placeholder="开始日期" end-placeholder="结束日期" align="right"
|
|
|
+ <el-select v-model="objCode" placeholder="选择设施" @visible-change="handleObjSelectClick" @change="getList">
|
|
|
+ <el-option v-for="item in objOptions"
|
|
|
+ :label="item.facsName"
|
|
|
+ :value="item.facsCode"
|
|
|
+ :key="item.facsCode"
|
|
|
+ />
|
|
|
+
|
|
|
+ </el-select>
|
|
|
+ <el-date-picker v-model="dateRange" type="datetimerange" @change="getList" :picker-options="pickerOptions"
|
|
|
+ value-format="yyyy-MM-dd hh:mm:ss" range-separator="至" start-placeholder="开始日期"
|
|
|
+ end-placeholder="结束日期"
|
|
|
+ align="right"
|
|
|
>
|
|
|
</el-date-picker>
|
|
|
</div>
|
|
|
- <el-row :gutter="10" class="mb8">
|
|
|
- <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
|
|
- </el-row>
|
|
|
|
|
|
- <el-table v-loading="loading" :data="hList" @selection-change="handleSelectionChange">
|
|
|
- <el-table-column type="selection" width="55" align="center"/>
|
|
|
- <el-table-column label="园区" align="center" prop="areaShortName"/>
|
|
|
- <el-table-column label="设施" align="center" prop="facsName"/>
|
|
|
- <el-table-column label="设施类型" align="center" prop="facsCategory"/>
|
|
|
- <el-table-column label="设施子类" align="center" prop="facsSubCategory"/>
|
|
|
+ <el-table v-loading="loading" :data="hList">
|
|
|
+ <el-table-column label="设施" align="center" prop="objName">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span>{{ scope.row.objName }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>>
|
|
|
<el-table-column label="日期" align="center" prop="date" width="180">
|
|
|
<template slot-scope="scope">
|
|
|
<span>{{ parseTime(scope.row.date, '{y}-{m}-{d}') }}</span>
|
|
@@ -60,9 +75,7 @@
|
|
|
:limit.sync="queryParams.pageSize"
|
|
|
@pagination="getList"
|
|
|
/>
|
|
|
-
|
|
|
</div>
|
|
|
-
|
|
|
</el-col>
|
|
|
</el-tab-pane>
|
|
|
</el-tabs>
|
|
@@ -70,15 +83,16 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import { listH } from '@/api/mgr/elecUseH'
|
|
|
+import { listHSum } from '@/api/mgr/elecUseH'
|
|
|
import { getFacsCategorygetByCode } from '@/api/basecfg/emsfacs'
|
|
|
import { areaWithFacsCategoryAsTree } from '@/api/basecfg/area'
|
|
|
+import { listAllFacs } from '@/api/basecfg/emsfacs'
|
|
|
import dayjs from 'dayjs'
|
|
|
import { DateTool } from '@/utils/DateTool'
|
|
|
import BaseChart from '@/components/BaseChart/index.vue'
|
|
|
import Block from '@/components/Block/block.vue'
|
|
|
-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'
|
|
|
|
|
|
export default {
|
|
|
name: 'H',
|
|
@@ -108,16 +122,19 @@ export default {
|
|
|
title: '',
|
|
|
// 是否显示弹出层
|
|
|
open: false,
|
|
|
- facsCategory: 'Z',
|
|
|
- facsSubCategory: '',
|
|
|
+ facsCategory: undefined,
|
|
|
+ facsSubCategory: undefined,
|
|
|
// 区域名称
|
|
|
areaName: undefined,
|
|
|
+ selectedLabel: '全部',
|
|
|
defaultProps: {
|
|
|
- children: "children",
|
|
|
- label: "label"
|
|
|
+ children: 'children',
|
|
|
+ label: 'label'
|
|
|
},
|
|
|
areaOptions: [],
|
|
|
facsCategoryOptions: [],
|
|
|
+ objOptions: [],
|
|
|
+ objCode: undefined,
|
|
|
dateRange: [dayjs().format(DateTool.DateFormat.YYYY_MM_DD_00_00_00), dayjs().format(DateTool.DateFormat.YYYY_MM_DD_23_59_59)],
|
|
|
pickerOptions: {
|
|
|
shortcuts: [
|
|
@@ -153,31 +170,21 @@ export default {
|
|
|
pageNum: 1,
|
|
|
pageSize: 10,
|
|
|
areaCode: null,
|
|
|
- facsCode: null,
|
|
|
+ objType: 1,
|
|
|
+ objCode: null,
|
|
|
+ facsCategory: 'Z',
|
|
|
+ facsSubCategory: null,
|
|
|
date: null,
|
|
|
time: null,
|
|
|
timeIndex: null
|
|
|
},
|
|
|
+ queryObjParams: {
|
|
|
+ refArea: null,
|
|
|
+ facsCategory: null,
|
|
|
+ subCategory: null
|
|
|
+ },
|
|
|
// 表单参数
|
|
|
form: {},
|
|
|
- // 表单校验
|
|
|
- rules: {
|
|
|
- areaCode: [
|
|
|
- { required: true, message: '园区代码不能为空', trigger: 'blur' }
|
|
|
- ],
|
|
|
- facsCode: [
|
|
|
- { required: true, message: '设施代码不能为空', trigger: 'blur' }
|
|
|
- ],
|
|
|
- date: [
|
|
|
- { required: true, message: '日期 yyyy-MM-dd不能为空', trigger: 'blur' }
|
|
|
- ],
|
|
|
- time: [
|
|
|
- { required: true, message: '时间 HH:mm不能为空', trigger: 'blur' }
|
|
|
- ],
|
|
|
- timeIndex: [
|
|
|
- { required: true, message: '时间序列不能为空', trigger: 'blur' }
|
|
|
- ]
|
|
|
- }
|
|
|
}
|
|
|
},
|
|
|
watch: {
|
|
@@ -187,7 +194,9 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
|
- this.getFacsCategory('Z')
|
|
|
+ this.facsCategory = 'Z'
|
|
|
+ this.facsSubCategory = ''
|
|
|
+ this.getFacsCategory(this.facsCategory)
|
|
|
this.getAreaTree(this.facsCategory, this.facsSubCategory)
|
|
|
this.getList()
|
|
|
},
|
|
@@ -195,7 +204,8 @@ export default {
|
|
|
/** 查询用能计量-小时列表 */
|
|
|
getList() {
|
|
|
this.loading = true
|
|
|
- listH(this.queryParams).then(response => {
|
|
|
+ this.queryParams.objCode = this.objCode
|
|
|
+ listHSum(this.queryParams).then(response => {
|
|
|
this.hList = response.rows
|
|
|
this.total = response.total
|
|
|
this.loading = false
|
|
@@ -215,34 +225,38 @@ export default {
|
|
|
}]
|
|
|
})
|
|
|
},
|
|
|
- tabClick() {
|
|
|
+ async getFacsObj(areaCode, category, subCategory) {
|
|
|
+ if (areaCode !== null) {
|
|
|
+ this.queryObjParams.refArea = areaCode
|
|
|
+ }
|
|
|
+ this.queryObjParams.facsCategory = category
|
|
|
+ this.queryObjParams.subCategory = subCategory
|
|
|
|
|
|
+ listAllFacs(this.queryObjParams).then(response => {
|
|
|
+ this.objOptions = response.data
|
|
|
+ })
|
|
|
},
|
|
|
- // 取消按钮
|
|
|
- cancel() {
|
|
|
- this.open = false
|
|
|
+ tabClick() {
|
|
|
this.reset()
|
|
|
- },
|
|
|
- // 表单重置
|
|
|
- reset() {
|
|
|
- this.form = {
|
|
|
- id: null,
|
|
|
- areaCode: null,
|
|
|
- facsCode: null,
|
|
|
- facsCategory: null,
|
|
|
- facsSubCategory: null,
|
|
|
- date: null,
|
|
|
- time: null,
|
|
|
- timeIndex: null,
|
|
|
- elecQuantity: null
|
|
|
+ if (this.activeName !== 'summery') {
|
|
|
+ this.dateRange = [dayjs().format(DateTool.DateFormat.YYYY_MM_DD_00_00_00), dayjs().format(DateTool.DateFormat.YYYY_MM_DD_23_59_59)]
|
|
|
+ this.queryParams.facsCategory = this.facsCategory
|
|
|
+ this.queryParams.facsSubCategory = this.activeName
|
|
|
+ this.queryParams.pageNum = 1
|
|
|
+ this.selectedLabel = '全部'
|
|
|
+ this.getList()
|
|
|
+ } else {
|
|
|
+
|
|
|
}
|
|
|
- this.resetForm('form')
|
|
|
},
|
|
|
/** 搜索按钮操作 */
|
|
|
handleQuery() {
|
|
|
this.queryParams.pageNum = 1
|
|
|
this.getList()
|
|
|
},
|
|
|
+ handleObjSelectClick() {
|
|
|
+ this.getFacsObj(this.queryParams.areaCode, this.facsCategory, this.activeName)
|
|
|
+ },
|
|
|
// 筛选节点
|
|
|
filterNode(value, data) {
|
|
|
if (!value) return true
|
|
@@ -252,13 +266,16 @@ export default {
|
|
|
handleNodeClick(data) {
|
|
|
this.queryParams.areaCode = data.id
|
|
|
this.selectedLabel = data.label
|
|
|
+ this.objCode = null
|
|
|
this.handleQuery()
|
|
|
},
|
|
|
- // 多选框选中数据
|
|
|
- handleSelectionChange(selection) {
|
|
|
- this.ids = selection.map(item => item.id)
|
|
|
- this.single = selection.length !== 1
|
|
|
- this.multiple = !selection.length
|
|
|
+ reset() {
|
|
|
+ this.objCode = null
|
|
|
+ this.queryParams.areaCode = null
|
|
|
+ this.queryParams.facsCategory = 'Z'
|
|
|
+ this.queryParams.facsSubCategory = null
|
|
|
+ this.queryParams.objCode = null
|
|
|
+ this.objOptions = []
|
|
|
}
|
|
|
}
|
|
|
}
|