能源监控

src/api/base/energyQuantityRealtime.js

@@ -44,11 +44,11 @@ export function getEnergyQuantityRealtimePage(data) {
 }
 
 // 导出后端统计 能源抄表 实时 Excel
-export function exportEnergyQuantityRealtimeExcel(query) {
+export function exportEnergyQuantityRealtimeExcel(data) {
   return request({
     url: '/base/energy-quantity-realtime/export-excel',
-    method: 'get',
+    method: 'post',
-    params: query,
+    data: data,
     responseType: 'blob'
   })
 }

src/api/base/factory.js

@@ -0,0 +1,8 @@
+import request from '@/utils/request'
+// 获得工厂产线工段设备树形结构
+export function getTree() {
+  return request({
+    url: '/base/factory/getTree',
+    method: 'get'
+  })
+}

src/api/monitoring/energyOverlimitLog.js

@@ -0,0 +1,54 @@
+import request from '@/utils/request'
+
+// 创建能源超限记录
+export function createEnergyOverlimitLog(data) {
+  return request({
+    url: '/monitoring/energy-overlimit-log/create',
+    method: 'post',
+    data: data
+  })
+}
+
+// 更新能源超限记录
+export function updateEnergyOverlimitLog(data) {
+  return request({
+    url: '/monitoring/energy-overlimit-log/update',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除能源超限记录
+export function deleteEnergyOverlimitLog(id) {
+  return request({
+    url: '/monitoring/energy-overlimit-log/delete?id=' + id,
+    method: 'delete'
+  })
+}
+
+// 获得能源超限记录
+export function getEnergyOverlimitLog(id) {
+  return request({
+    url: '/monitoring/energy-overlimit-log/get?id=' + id,
+    method: 'get'
+  })
+}
+
+// 获得能源超限记录分页
+export function getEnergyOverlimitLogPage(data) {
+  return request({
+    url: '/monitoring/energy-overlimit-log/page',
+    method: 'post',
+    data: data
+  })
+}
+
+// 导出能源超限记录 Excel
+export function exportEnergyOverlimitLogExcel(query) {
+  return request({
+    url: '/monitoring/energy-overlimit-log/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}

src/api/monitoring/energyReport.js

@@ -0,0 +1,37 @@
+import request from '@/utils/request'
+
+// 获得能耗统计查询分页
+export function energyReportPage(data) {
+  return request({
+    url: '/monitoring/energy-report/page',
+    method: 'post',
+    data: data
+  })
+}
+
+// 获得能耗统计报表分页
+export function energyReportPageAuto(data) {
+  return request({
+    url: '/monitoring/energy-report/pageAuto',
+    method: 'post',
+    data: data
+  })
+}
+
+// 导出能耗统计查询
+export function energyReportPageExport(data) {
+  return request({
+    url: '/monitoring/energy-report/export',
+    method: 'post',
+    data: data
+  })
+}
+
+// 导出能耗统计报表
+export function energyReportPageExportAuto(data) {
+  return request({
+    url: '/monitoring/energy-report/exportAuto',
+    method: 'post',
+    data: data
+  })
+}

src/api/monitoring/energyStatistics.js

@@ -0,0 +1,62 @@
+import request from '@/utils/request'
+
+// 创建能源统计主
+export function createEnergyStatistics(data) {
+  return request({
+    url: '/monitoring/energy-statistics/create',
+    method: 'post',
+    data: data
+  })
+}
+
+// 更新能源统计主
+export function updateEnergyStatistics(data) {
+  return request({
+    url: '/monitoring/energy-statistics/update',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除能源统计主
+export function deleteEnergyStatistics(id) {
+  return request({
+    url: '/monitoring/energy-statistics/delete?id=' + id,
+    method: 'delete'
+  })
+}
+
+// 获得能源统计主
+export function getEnergyStatistics(id) {
+  return request({
+    url: '/monitoring/energy-statistics/get?id=' + id,
+    method: 'get'
+  })
+}
+
+// 获得能源统计主分页
+export function getEnergyStatisticsPage(data) {
+  return request({
+    url: '/monitoring/energy-statistics/page',
+    method: 'post',
+    data: data
+  })
+}
+
+// 导出能源统计主 Excel
+export function exportEnergyStatisticsExcel(query) {
+  return request({
+    url: '/monitoring/energy-statistics/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}
+
+// 获取编码
+export function getCode() {
+  return request({
+    url: '/monitoring/energy-statistics/getCode',
+    method: 'get'
+  })
+}

src/api/monitoring/energyStatisticsDet.js

@@ -0,0 +1,72 @@
+import request from '@/utils/request'
+
+// 创建能源统计详细表
+export function createEnergyStatisticsDet(data) {
+  return request({
+    url: '/monitoring/energy-statistics-det/create',
+    method: 'post',
+    data: data
+  })
+}
+
+// 更新能源统计详细表
+export function updateEnergyStatisticsDet(data) {
+  return request({
+    url: '/monitoring/energy-statistics-det/update',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除能源统计详细表
+export function deleteEnergyStatisticsDet(id) {
+  return request({
+    url: '/monitoring/energy-statistics-det/delete?id=' + id,
+    method: 'delete'
+  })
+}
+
+// 获得能源统计详细表
+export function getEnergyStatisticsDet(id) {
+  return request({
+    url: '/monitoring/energy-statistics-det/get?id=' + id,
+    method: 'get'
+  })
+}
+
+// 获得能源统计详细表分页
+export function getEnergyStatisticsDetPage(data) {
+  return request({
+    url: '/monitoring/energy-statistics-det/page',
+    method: 'post',
+    data: data
+  })
+}
+
+// 导出能源统计详细表 Excel
+export function exportEnergyStatisticsDetExcel(query) {
+  return request({
+    url: '/monitoring/energy-statistics-det/export-excel',
+    method: 'get',
+    params: query,
+    responseType: 'blob'
+  })
+}
+
+// 获得 新增参数关联 分页
+export function addParamPage(data) {
+  return request({
+    url: '/monitoring/energy-statistics-det/addParamPage',
+    method: 'post',
+    data: data
+  })
+}
+
+// 删除（批量）
+export function deleteMany(data) {
+  return request({
+    url: '/monitoring/energy-statistics-det/deleteMany',
+    method: 'post',
+    data: data
+  })
+}

src/utils/dict.js

@@ -88,7 +88,10 @@ export const DICT_TYPE = {
   PRODUCT_TYPE: 'product_type',
 
   // ============== ENERGY - 能源模块 =============
-  ENERGY_UNIT: 'energy_unit'
+  ENERGY_UNIT: 'energy_unit',
+  MONITOR_INDEX_TYPE: 'monitor_index_type',
+  OBJECT_TYPE: 'object_type',
+  STATISTIC_TYPE: 'statistic_type'
 }
 
 /**

src/views/energy/base/energyPlcConnect/components/energyPlcConnectAdd.vue

@@ -1,24 +1,28 @@
 <template>
   <el-form ref="form" :rules="rules" label-width="100px" :model="form">
-    <el-row>
+    <el-form-item label="关联表名" prop="plcId">
-      <el-col :span="12">
+      <el-select v-model="form.plcId" placeholder="请选择" style="width: 100%;">
-        <el-form-item label="关联表名" prop="plcId">
+        <el-option
-          <el-select v-model="form.plcId" placeholder="请选择" style="width: 100%;">
+          v-for="item in plcList"
-            <el-option
+          :key="item.id"
-              v-for="item in plcList"
+          :label="item.plcTableName"
-              :key="item.id"
+          :value="item.id">
-              :label="item.plcTableName"
+        </el-option>
-              :value="item.id">
+      </el-select>
-            </el-option>
+    </el-form-item>
-          </el-select>
+    <el-form-item label="对象" prop="bindObjectId">
-        </el-form-item>
+      <el-cascader
-      </el-col>
+        style='width: 100%;'
-      <el-col :span="12">
+        v-model="objIds"
-        <el-form-item label="对象" prop="code">
+        :options="objList"
-          <el-input v-model="form.code"></el-input>
+        :props="{ checkStrictly: true, value: 'id', label: 'name' }"
-        </el-form-item>
+        popper-class="cascaderParent"
-      </el-col>
+        @change="selectObj"
-    </el-row>
+        clearable></el-cascader>
+    </el-form-item>
+    <el-form-item label="对象备注" prop="remark">
+      <el-input v-model="form.remark"/>
+    </el-form-item>
   </el-form>
 </template>
 <script>
@@ -26,20 +30,27 @@ import { getEnergyPlcConnect, updateEnergyPlcConnect, createEnergyPlcConnect } f
 import { getEnergyPlcAll } from '@/api/base/energyPlc'
 export default {
   name: 'EnergyPlcConnectAdd',
+  props: {
+    objList: {
+      type: Array,
+      default: () => []
+    },
+  },
   data() {
     return {
       form: {
         id: '',
         plcId: '',
         bindObjectId: '',
-        bindObjectType: ''
+        bindObjectType: '',
+        remark: ''
       },
+      objIds: [],// 回显数组
       plcList: [],
       isEdit: false, //是否是编辑
       rules: {
-        plcTableName: [{ required: true, message: '关联表名不能为空', trigger: 'blur' }],
+        plcId: [{ required: true, message: '关联表名不能为空', trigger: 'change' }],
-        code: [{ required: true, message: '关联表编码不能为空', trigger: 'blur' }],
+        bindObjectId: [{ required: true, message: '对象不能为空', trigger: 'change' }]
-        name: [{ required: true, message: '标识名称不能为空', trigger: 'blur' }]
       }
     }
   },
@@ -54,7 +65,7 @@ export default {
         getEnergyPlcConnect( id ).then((res) => {
           if (res.code === 0) {
             this.form = res.data
-            this.form.collection = this.form.collection === 0 ? false : true
+            this.objIds = this.changeDetSelect(this.form.bindObjectId, this.objList)
           }
         })
       } else {
@@ -62,10 +73,37 @@ export default {
         this.form.id = ''
       }
     },
+    // 递归处理分类回显问题
+    changeDetSelect(key, treeData) {
+      let arr = [] // 递归时操作的数组
+      let returnArr = [] // 存放结果的数组
+      let depth = 0 // 定义全局层级
+      // 定义递归函数
+      function childrenEach(childrendData, depthN) {
+        for (var j = 0; j < childrendData.length; j++) {
+          depth = depthN
+          arr[depthN] = childrendData[j].id
+          if (childrendData[j].id == key) {
+            returnArr = arr.slice(0, depthN + 1)
+            break
+          } else {
+            if (childrendData[j].children) {
+              depth++
+              childrenEach(childrendData[j].children, depth)
+            }
+          }
+        }
+        return returnArr
+      }
+      return childrenEach(treeData, depth)
+    },
+    selectObj(val) {
+      this.form.bindObjectId = val[val.length-1]
+      this.form.bindObjectType = val.length-1
+    },
     submitForm() {
       this.$refs['form'].validate((valid) => {
         if (valid) {
-          this.form.collection = this.form.collection === false ? 0 : 1
           if (this.isEdit) {
             // 编辑
             updateEnergyPlcConnect({...this.form}).then((res) => {
@@ -88,9 +126,19 @@ export default {
       })
     },
     formClear() {
-      this.$refs.form.resetFields()
+      this.form.id = ''
+      this.form.plcId = ''
+      this.form.bindObjectId = ''
+      this.form.bindObjectType = ''
+      this.form.remark = ''
+      this.objIds = []
       this.isEdit = false
     }
   }
 }
 </script>
+<style>
+.cascaderParent .el-cascader-panel .el-scrollbar:first-child .el-radio {
+  display: none;
+}
+</style>

src/views/energy/base/energyPlcConnect/components/energyPlcParam.vue

@@ -7,9 +7,9 @@
             <el-input v-model="plcTableName" size='small' readonly></el-input>
           </el-form-item>
           <el-form-item label="对象">
-            <el-input v-model="bindObjectType" size='small' readonly></el-input>
+            <el-input v-model="objName" size='small' readonly></el-input>
           </el-form-item>
-          <el-form-item v-if="showBtn&&this.$auth.hasPermi('base:energy-plc-param:create')">
+          <el-form-item v-if="showBtn">
             <el-button type="success" size='small' plain @click="addNew">新增</el-button>
           </el-form-item>
         </el-form>
@@ -105,7 +105,7 @@ export default {
         connectId: null
       },
       plcTableName: '',
-      bindObjectType: '',
+      objName: '',
       // 弹出层标题
       addOrEditTitle: "",
       // 是否显示弹出层
@@ -128,7 +128,7 @@ export default {
       this.visible = true
       this.queryParams.connectId = data.id
       this.plcTableName = data.plcTableName
-      this.bindObjectType = data.bindObjectType
+      this.objName = data.objName
       this.getList()
       if (title === 'view') {
         this.showBtn = false
@@ -136,19 +136,15 @@ export default {
       } else {
         this.showBtn = true
         this.tableBtn = [
-          this.$auth.hasPermi('base:energy-plc-param:update')
+          {
-            ? {
+            type: 'edit',
-                type: 'edit',
+            btnName: '编辑'
-                btnName: '编辑'
+          },
-              }
+          {
-            : undefined,
+            type: 'delete',
-          this.$auth.hasPermi('base:energy-plc-param:delete')
+            btnName: '删除'
-            ? {
+          }
-                type: 'delete',
+        ]
-                btnName: '删除'
-              }
-            : undefined
-        ].filter((v) => v)
       }
     },
     getList() {

src/views/energy/base/energyPlcConnect/components/energyPlcParamView.vue

@@ -1,127 +0,0 @@
-<template>
-  <div>
-    <el-drawer title="参数绑定" :visible.sync="visible" size="70%">
-      <div class="box">
-        <el-form :inline="true">
-          <el-form-item label="关联表名">
-            <el-input v-model="plcTableName" size='small' readonly></el-input>
-          </el-form-item>
-          <el-form-item label="对象">
-            <el-input v-model="bindObjectType" size='small' readonly></el-input>
-          </el-form-item>
-        </el-form>
-        <base-table
-          :page="queryParams.pageNo"
-          :limit="queryParams.pageSize"
-          :table-props="tableProps"
-          :table-data="tableData"
-          :max-height="tableH"
-        />
-        <pagination
-          :page.sync="queryParams.pageNo"
-          :limit.sync="queryParams.pageSize"
-          :total="total"
-          @pagination="getList"
-        />
-      </div>
-    </el-drawer>
-  </div>
-</template>
-<script>
-import { getEnergyPlcParamPage } from '@/api/base/energyPlcParam'
-import { publicFormatter } from '@/utils/dict'
-const tableProps = [
-  {
-    prop: 'typeId',
-    label: '能源类型'
-  },
-  {
-    prop: 'plcParamName',
-    label: '参数列名'
-  },
-  {
-    prop: 'name',
-    label: '参数名称'
-  },
-  {
-    prop: 'unit',
-    label: '单位',
-    filter: publicFormatter('energy_unit')
-  },
-  {
-    prop: 'collection',
-    label: '是否采集'
-  },
-  {
-    prop: 'description',
-    label: '描述'
-  }
-]
-const tableBtn = [
-  {
-    type: 'edit',
-    btnName: '编辑'
-  },
-  {
-    type: 'delete',
-    btnName: '删除'
-  }
-]
-export default {
-  name: 'EnergyPlcParamView',
-  data() {
-    return {
-      visible: false,
-      tableProps,
-      tableData: [],
-      tableBtn,
-      tableH: this.tableHeight(115),
-      total: 0,
-      queryParams: {
-        pageNo: 1,
-        pageSize: 30,
-        connectId: null
-      },
-      plcTableName: '',
-      bindObjectType: '',
-      collectionList: [
-        {value: 0,label: '否'},
-        {value: 1,label: '是'}
-      ]
-    }
-  },
-  created() {
-    window.addEventListener('resize', () => {
-      this.tableH = this.tableHeight(115)
-    })
-  },
-  methods: {
-    init(data) {
-      this.visible = true
-      this.queryParams.connectId = data.id
-      this.plcTableName = data.plcTableName
-      this.bindObjectType = data.bindObjectType
-      this.getList()
-    },
-    getList() {
-      getEnergyPlcParamPage({...this.queryParams}).then((res) => {
-        let arr = res.data.list || [];
-        arr&&arr.map(item => {
-          this.collectionList.map(i => {
-            if (item.collection === i.value) {
-              item.collection = i.label
-            }
-          })
-        })
-        this.tableData = arr
-        this.total = res.data.total;
-      })
-    }
-  }
-}
-</script>
-<style lang="scss" scoped>
-.box {
-  padding: 0 32px;
-}
-</style>

src/views/energy/base/energyPlcConnect/index.vue

@@ -38,7 +38,7 @@
       @confirm="handleConfirm"
       :before-close="handleCancel"
     >
-      <energy-plc-connect-add ref="energyPlcConnect" @successSubmit="successSubmit" />
+      <energy-plc-connect-add ref="energyPlcConnect" :objList="objList" @successSubmit="successSubmit" />
     </base-dialog>
     <!-- 参数绑定/查看 -->
     <energy-plc-param v-if="paramVisible" ref="plcParam" @closeDrawer="closeDrawer" :energyTypeList="energyTypeList"></energy-plc-param>
@@ -48,16 +48,17 @@
 <script>
 import { getEnergyPlcConnectPage, deleteEnergyPlcConnect } from "@/api/base/energyPlcConnect";
 // import { publicFormatter } from '@/utils/dict'
+import { getTree } from '@/api/base/factory'
 import { getEnergyTypeListAll } from '@/api/base/energyType'
 import EnergyPlcConnectAdd from './components/energyPlcConnectAdd.vue'
-import EnergyPlcParam from './components/energyPlcParam.vue'
+import EnergyPlcParam from './components/energyPlcParam'
 const tableProps = [
   {
-    prop: 'bindObjectType',
+    prop: 'objName',
     label: '对象'
   },
   {
-    prop: 'bindObjectId',
+    prop: 'objCode',
     label: '对象编码'
   },
   {
@@ -75,6 +76,10 @@ const tableProps = [
   {
     prop: 'varNum',
     label: '绑定参数数量'
+  },
+  {
+    prop: 'remark',
+    label: '备注'
   }
 ]
 export default {
@@ -147,7 +152,8 @@ export default {
         name: null
       },
       paramVisible: false,
-      energyTypeList: []
+      energyTypeList: [],
+      objList: []
     };
   },
   created() {
@@ -159,6 +165,8 @@ export default {
   mounted() {
     // 获取能源列表
     this.getEnergyTypeList()
+    // 获取对象树形结构
+    this.getObjTree()
   },
   methods: {
     buttonClick(val) {
@@ -224,7 +232,7 @@ export default {
     },
     /** 删除按钮操作 */
     handleDelete(row) {
-      this.$modal.confirm('是否确认删除关联表名为"' + row.name + '"的数据项?').then(function() {
+      this.$modal.confirm('是否确认删除对象为"' + row.objName + '"的数据项?').then(function() {
           return deleteEnergyPlcConnect(row.id);
         }).then(() => {
           this.queryParams.pageNo = 1;
@@ -239,6 +247,11 @@ export default {
       getEnergyTypeListAll().then((res) => {
         this.energyTypeList = res.data || []
       })
+    },
+    getObjTree() {
+      getTree().then(res => {
+        this.objList = res.data || []
+      })
     }
   }
 };

src/views/energy/base/energyQuantityRealtime/index.vue

@@ -25,16 +25,20 @@
 </template>
 
 <script>
-import { getEnergyQuantityRealtimePage } from "@/api/base/energyQuantityRealtime";
+import { getEnergyQuantityRealtimePage, exportEnergyQuantityRealtimeExcel } from "@/api/base/energyQuantityRealtime";
 import { getEnergyTypeListAll } from "@/api/base/energyType";
 // import { publicFormatter } from '@/utils/dict'
 const tableProps = [
   {
-    prop: 'bindObjectName',
+    prop: 'objName',
     label: '统计对象'
   },
   {
-    prop: 'bindObjectType',
+    prop: 'objRemark',
+    label: '对象备注'
+  },
+  {
+    prop: 'energyTypeName',
     label: '能源类型'
   },
   {
@@ -108,7 +112,8 @@ export default {
         energyTypeId: '',
         startTime: null,
         endTime: null
-      }
+      },
+      energyTypeList: []
     };
   },
   created() {
@@ -120,30 +125,33 @@ export default {
   },
   methods: {
     buttonClick(val) {
-      console.log(val)
+      this.queryParams.pageNo = 1;
+      this.queryParams.energyTypeId = val.energyTypeId
+      this.queryParams.startTime = val.timeVal ? val.timeVal[0] : null
+      this.queryParams.endTime = val.timeVal ? val.timeVal[1] : null
       switch (val.btnName) {
         case 'search':
-          this.queryParams.pageNo = 1;
-          this.queryParams.energyTypeId = val.energyTypeId
-          this.queryParams.startTime = val.timeVal ? val.timeVal[0] : null
-          this.queryParams.endTime = val.timeVal ? val.timeVal[1] : null
           this.getList()
           break
         default:
-          console.log('导出')
+          this.$modal.confirm('是否确认导出').then(() => {
+              return exportEnergyQuantityRealtimeExcel({...this.queryParams});
+            }).then(response => {
+              this.$download.excel(response, '能源抄表.xls');
+            }).catch(() => {})
       }
     },
     /** 查询列表 */
     getList() {
       getEnergyQuantityRealtimePage(this.queryParams).then(response => {
-        this.list = response.data.list || [];
+        this.list = response.data.list || []
         this.total = response.data.total;
       });
     },
     getTypeList() {
       getEnergyTypeListAll().then((res) => {
-        console.log(res)
         this.formConfig[0].selectOptions = res.data || []
+        this.energyTypeList = res.data || []
       })
     }
   }

src/views/energy/monitoring/energyLimit/components/energyLimitAdd.vue

@@ -1,7 +1,14 @@
 <template>
   <el-form ref="form" :rules="rules" label-width="100px" :model="form">
     <el-form-item label="监控对象" prop="objectId">
-      <el-input v-model="form.objectId"></el-input>
+      <el-cascader
+        style='width: 100%;'
+        v-model="objIds"
+        :options="objList"
+        :props="{ checkStrictly: true, value: 'id', label: 'name' }"
+        popper-class="cascaderParent"
+        @change="selectObj"
+        clearable></el-cascader>
     </el-form-item>
     <el-form-item label="能源类型" prop="energyTypeId">
       <el-select v-model="form.energyTypeId" placeholder="请选择" style="width: 100%;">
@@ -15,11 +22,11 @@
     </el-form-item>
     <el-form-item label="监控模式" prop="type">
       <el-select v-model="form.type" placeholder="请选择" style="width: 100%;" @change="typeChange">
-        <el-option label="合并" value= "1" ></el-option>
+        <el-option label="合并" :value= "1" ></el-option>
-        <el-option label="详细" value= "2" ></el-option>
+        <el-option label="详细" :value= "2" ></el-option>
       </el-select>
     </el-form-item>
-    <el-form-item label="监控详细参数" prop="plcParamId" v-if="form.type === '2'">
+    <el-form-item label="监控详细参数" prop="plcParamId" v-if="form.type === 2">
       <el-select v-model="form.plcParamId" placeholder="请选择" style="width: 100%;">
         <el-option
           v-for="item in getDictDatas(DICT_TYPE.ENERGY_UNIT)"
@@ -29,13 +36,23 @@
         </el-option>
       </el-select>
     </el-form-item>
-    <el-form-item label="消耗量阈值" prop="code">
+    <el-form-item label="指标类型" prop="limitType">
-      <el-input v-model="form.code"></el-input>
+      <el-select v-model="form.limitType" placeholder="请选择" style="width: 100%;">
+        <el-option
+          v-for="item in getDictDatas(DICT_TYPE.MONITOR_INDEX_TYPE)"
+          :key="item.value"
+          :label="item.label"
+          :value="item.value">
+        </el-option>
+      </el-select>
+    </el-form-item>
+    <el-form-item label="消耗量阈值" prop="limitValue">
+      <el-input v-model="form.limitValue"></el-input>
     </el-form-item>
   </el-form>
 </template>
 <script>
-import { getEnergyParamList, getEnergyType, updateEnergyType, createEnergyType } from '@/api/monitoring/energyLimit'
+import { getEnergyLimit, updateEnergyLimit, createEnergyLimit } from '@/api/monitoring/energyLimit'
 export default {
   name: 'energyLimitAdd',
   props: {
@@ -45,35 +62,43 @@ export default {
       default: () => {
         return []
       }
+    },
+    objList: {
+      type: Array,
+      default: () => []
     }
   },
   data() {
     return {
       form: {
         id: '',
-        name: '',
+        objectId: '',
-        code: '',
+        type: '',
-        nuit: '',
+        plcParamId: '',
-        pricingMethod: 1,
+        limitType: '',
-        leaderName: ''
+        limitValue: ''
       },
+      objIds: [],// 回显数组
       isEdit: false, //是否是编辑
       rules: {
-        name: [{ required: true, message: '能源类型不能为空', trigger: 'blur' }]
+        objectId: [{ required: true, message: '对象不能为空', trigger: 'change' }],
+        energyTypeId: [{ required: true, message: '能源类型不能为空', trigger: 'change' }],
+        type: [{ required: true, message: '监控模式不能为空', trigger: 'change' }]
       }
     }
   },
   methods: {
     init(id) {
-      // getEnergyParamList().then((res) => {
-      //   console.log(res)
-      // })
       if (id) {
         this.isEdit = true
         this.form.id = id
-        getEnergyType( id ).then((res) => {
+        getEnergyLimit( id ).then((res) => {
           if (res.code === 0) {
             this.form = res.data
+            this.form.limitType = this.form.limitType + ''
+            console.log(this.objList)
+            this.objIds = this.changeDetSelect(this.form.objectId, this.objList)
+            console.log(this.objIds)
           }
         })
       } else {
@@ -82,77 +107,50 @@ export default {
       }
     },
     typeChange() {
-      // if (this.form.type === '2') {
+      this.form.plcParamId = ''
-
+    },
-      // } else  {
+    // 递归处理分类回显问题
-
+    changeDetSelect(key, treeData) {
-      // }
+      let arr = [] // 递归时操作的数组
+      let returnArr = [] // 存放结果的数组
+      let depth = 0 // 定义全局层级
+      // 定义递归函数
+      function childrenEach(childrendData, depthN) {
+        for (var j = 0; j < childrendData.length; j++) {
+          depth = depthN
+          arr[depthN] = childrendData[j].id
+          if (childrendData[j].id == key) {
+            returnArr = arr.slice(0, depthN + 1)
+            break
+          } else {
+            if (childrendData[j].children) {
+              depth++
+              childrenEach(childrendData[j].children, depth)
+            }
+          }
+        }
+        return returnArr
+      }
+      return childrenEach(treeData, depth)
+    },
+    selectObj(val) {
+      this.form.objectId = val[val.length-1]
+      this.form.objectType = val.length-1
     },
     submitForm() {
       this.$refs['form'].validate((valid) => {
         if (valid) {
-          switch(this.form.pricingMethod) {
+          // this.form.limitType = Number(this.form.limitType)
-            case 0:// 时间段
-              if (this.tableData1.length === 0) {
-                this.$modal.msgError('时间段表格数据不能为空')
-                return false
-              } else {
-                this.tableData1.map(item => {
-                  if (item.price <= 0) {
-                    this.$modal.msgError('单价有误请检查，请检查')
-                    return false
-                  }
-                })
-              }
-              break;
-            case 1:// 使用量
-              if (this.tableData2.length === 0) {
-                this.$modal.msgError('使用量表格数据不能为空')
-                return false
-              } else {
-                this.tableData1.map(item => {
-                  if (item.price <= 0) {
-                    this.$modal.msgError('单价有误请检查，请检查')
-                    return false
-                  }
-                })
-              }
-              break;
-            default:// 固定单价
-              if (!this.form.singlePrice) {
-                this.$modal.msgError('单价有误请检查1，请检查')
-                  return false
-              }
-          }
           if (this.isEdit) {
             // 编辑
-            updateEnergyType({
+            updateEnergyLimit({...this.form}).then((res) => {
-              id: this.form.id,
-              code: this.form.code,
-              name: this.form.name,
-              unit: this.form.unit,
-              pricingMethod: this.form.pricingMethod,
-              description: this.form.description,
-              singlePrice: this.form.pricingMethod === 2 ? this.form.singlePrice : '',
-              segPriceList: this.form.pricingMethod === 0 ? this.tableData1: [],
-              usedPriceList: this.form.pricingMethod === 1 ? this.tableData2: []
-            }).then((res) => {
               if (res.code === 0) {
                 this.$modal.msgSuccess("操作成功");
                 this.$emit('successSubmit')
               }
             })
           } else {
-            createEnergyType({
+            createEnergyLimit({...this.form}).then((res) => {
-              code: this.form.code,
-              name: this.form.name,
-              unit: this.form.unit,
-              pricingMethod: this.form.pricingMethod,
-              description: this.form.description,
-              singlePrice: this.form.pricingMethod === 2 ? this.form.singlePrice : '',
-              segPriceList: this.form.pricingMethod === 0 ? this.tableData1: [],
-              usedPriceList: this.form.pricingMethod === 1 ? this.tableData2: []
-            }).then((res) => {
               if (res.code === 0) {
                 this.$modal.msgSuccess("操作成功");
                 this.$emit('successSubmit')
@@ -171,3 +169,8 @@ export default {
   }
 }
 </script>
+<style>
+.cascaderParent .el-cascader-panel .el-scrollbar:first-child .el-radio {
+  display: none;
+}
+</style>

src/views/energy/monitoring/energyLimit/index.vue

@@ -38,7 +38,7 @@
       @confirm="handleConfirm"
       :before-close="handleCancel"
     >
-      <energy-limit-add ref="energyLimit" @successSubmit="successSubmit" :energyTypeList="energyTypeList"/>
+      <energy-limit-add ref="energyLimit" @successSubmit="successSubmit" :energyTypeList="energyTypeList" :objList="objList"/>
     </base-dialog>
   </div>
 </template>
@@ -46,13 +46,19 @@
 <script>
 import { getEnergyLimitPage, deleteEnergyLimit } from "@/api/monitoring/energyLimit";
 import { getEnergyTypeListAll } from "@/api/base/energyType";
-// import { publicFormatter } from '@/utils/dict'
+import { getTree } from '@/api/base/factory'
+import { publicFormatter } from '@/utils/dict'
 import EnergyLimitAdd from './components/energyLimitAdd'
 const tableProps = [
   {
-    prop: 'objectId',
+    prop: 'objName',
     label: '监控对象'
   },
+  {
+    prop: 'objectType',
+    label: '对象备注',
+    filter: publicFormatter('object_type')
+  },
   {
     prop: 'energyType',
     label: '能源类型'
@@ -60,7 +66,6 @@ const tableProps = [
   {
     prop: 'type',
     label: '监控模式'
-    // filter: publicFormatter('energy_unit')
   },
   {
     prop: 'plcParamName',
@@ -68,7 +73,8 @@ const tableProps = [
   },
   {
     prop: 'limitType',
-    label: '指标类型'
+    label: '指标类型',
+    filter: publicFormatter('monitor_index_type')
   },
   {
     prop: 'limitValue',
@@ -88,9 +94,11 @@ export default {
           param: 'energyTypeId'
         },
         {
-          type: 'input',
+          type: 'select',
           label: '指标类型',
-          placeholder: '指标类型',
+          selectOptions: this.getDictDatas(this.DICT_TYPE.MONITOR_INDEX_TYPE),
+          labelField: 'label',
+          valueField: 'value',
           param: 'limitType'
         },
         {
@@ -103,7 +111,7 @@ export default {
           type: 'separate'
         },
         {
-          type: this.$auth.hasPermi('base:energy-type:create') ? 'button' : '',
+          type: this.$auth.hasPermi('monitoring:energy-limit:create') ? 'button' : '',
           btnName: '新增',
           name: 'add',
           color: 'success',
@@ -112,13 +120,13 @@ export default {
       ],
       tableProps,
       tableBtn: [
-        this.$auth.hasPermi('base:energy-type:update')
+        this.$auth.hasPermi('monitoring:energy-limit:update')
           ? {
               type: 'edit',
               btnName: '编辑'
             }
           : undefined,
-        this.$auth.hasPermi('base:energy-type:delete')
+        this.$auth.hasPermi('monitoring:energy-limit:delete')
           ? {
               type: 'delete',
               btnName: '删除'
@@ -141,7 +149,12 @@ export default {
         energyTypeId: null,
         limitType: null
       },
-      energyTypeList: []
+      energyTypeList: [],
+      typeList: [
+        {label: '合并', value: '1'},
+        {label: '详细', value: '2'}
+      ],
+      objList: []
     };
   },
   created() {
@@ -150,6 +163,8 @@ export default {
     })
     this.getList();
     this.getTypeList()
+    // 获取对象树形结构
+    this.getObjTree()
   },
   methods: {
     getTypeList() {
@@ -178,6 +193,13 @@ export default {
     getList() {
       getEnergyLimitPage(this.queryParams).then(response => {
         let arr = response.data.list || [];
+        arr&&arr.map(item => {
+          this.typeList.map(i => {
+            if (item.type === i.value) {
+              item.type = i.label
+            }
+          })
+        })
         this.list = arr
         this.total = response.data.total;
       });
@@ -209,13 +231,18 @@ export default {
     },
     /** 删除按钮操作 */
     handleDelete(row) {
-      this.$modal.confirm('是否确认删除能源类型为"' + row.name + '"的数据项?').then(function() {
+      this.$modal.confirm('是否确认删除监控参数为"' + row.plcParamName + '"的数据项?').then(function() {
           return deleteEnergyLimit(row.id);
         }).then(() => {
           this.queryParams.pageNo = 1;
           this.getList();
           this.$modal.msgSuccess("删除成功");
         }).catch(() => {});
+    },
+    getObjTree() {
+      getTree().then(res => {
+        this.objList = res.data || []
+      })
     }
   }
 };

src/views/energy/monitoring/energyLimit/index1.vue

@@ -1,296 +0,0 @@
-<template>
-  <div class="app-container">
-
-    <!-- 搜索工作栏 -->
-    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item label="需要监控对象的id " prop="objectId">
-        <el-input v-model="queryParams.objectId" placeholder="请输入需要监控对象的id " clearable @keyup.enter.native="handleQuery"/>
-      </el-form-item>
-      <el-form-item label="需要监控的对象类型 1.产线 2.工段 3.设备" prop="objectType">
-        <el-select v-model="queryParams.objectType" placeholder="请选择需要监控的对象类型 1.产线 2.工段 3.设备" clearable size="small">
-          <el-option label="请选择字典生成" value="" />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="需要监控的能源类型id" prop="energyTypeId">
-        <el-input v-model="queryParams.energyTypeId" placeholder="请输入需要监控的能源类型id" clearable @keyup.enter.native="handleQuery"/>
-      </el-form-item>
-      <el-form-item label="监控模式 1.合并 2.详细" prop="type">
-        <el-select v-model="queryParams.type" placeholder="请选择监控模式 1.合并 2.详细" clearable size="small">
-          <el-option label="请选择字典生成" value="" />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="需要监控的详细参数id 可以为空" prop="plcParamId">
-        <el-input v-model="queryParams.plcParamId" placeholder="请输入需要监控的详细参数id 可以为空" clearable @keyup.enter.native="handleQuery"/>
-      </el-form-item>
-      <el-form-item label="限制类型 1.日 2.月" prop="limitType">
-        <el-select v-model="queryParams.limitType" placeholder="请选择限制类型 1.日 2.月" clearable size="small">
-          <el-option label="请选择字典生成" value="" />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="限制量 阈值" prop="limitValue">
-        <el-input v-model="queryParams.limitValue" placeholder="请输入限制量 阈值" clearable @keyup.enter.native="handleQuery"/>
-      </el-form-item>
-      <el-form-item label="备注" prop="remark">
-        <el-input v-model="queryParams.remark" placeholder="请输入备注" clearable @keyup.enter.native="handleQuery"/>
-      </el-form-item>
-      <el-form-item label="版本号" prop="version">
-        <el-input v-model="queryParams.version" placeholder="请输入版本号" clearable @keyup.enter.native="handleQuery"/>
-      </el-form-item>
-      <el-form-item label="创建时间" prop="createTime">
-        <el-date-picker v-model="queryParams.createTime" style="width: 240px" value-format="yyyy-MM-dd HH:mm:ss" type="daterange"
-                        range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" :default-time="['00:00:00', '23:59:59']" />
-      </el-form-item>
-      <el-form-item>
-        <el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
-        <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
-      </el-form-item>
-    </el-form>
-
-    <!-- 操作工具栏 -->
-    <el-row :gutter="10" class="mb8">
-      <el-col :span="1.5">
-        <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
-                   v-hasPermi="['monitoring:energy-limit:create']">新增</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport" :loading="exportLoading"
-                   v-hasPermi="['monitoring:energy-limit:export']">导出</el-button>
-      </el-col>
-      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
-    </el-row>
-
-    <!-- 列表 -->
-    <el-table v-loading="loading" :data="list">
-      <el-table-column label="id" align="center" prop="id" />
-      <el-table-column label="需要监控对象的id " align="center" prop="objectId" />
-      <el-table-column label="需要监控的对象类型 1.产线 2.工段 3.设备" align="center" prop="objectType" />
-      <el-table-column label="需要监控的能源类型id" align="center" prop="energyTypeId" />
-      <el-table-column label="监控模式 1.合并 2.详细" align="center" prop="type" />
-      <el-table-column label="需要监控的详细参数id 可以为空" align="center" prop="plcParamId" />
-      <el-table-column label="限制类型 1.日 2.月" align="center" prop="limitType" />
-      <el-table-column label="限制量 阈值" align="center" prop="limitValue" />
-      <el-table-column label="备注" align="center" prop="remark" />
-      <el-table-column label="版本号" align="center" prop="version" />
-      <el-table-column label="创建时间" align="center" prop="createTime" width="180">
-        <template v-slot="scope">
-          <span>{{ parseTime(scope.row.createTime) }}</span>
-        </template>
-      </el-table-column>
-      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
-        <template v-slot="scope">
-          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
-                     v-hasPermi="['monitoring:energy-limit:update']">修改</el-button>
-          <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
-                     v-hasPermi="['monitoring:energy-limit:delete']">删除</el-button>
-        </template>
-      </el-table-column>
-    </el-table>
-    <!-- 分页组件 -->
-    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
-                @pagination="getList"/>
-
-    <!-- 对话框(添加 / 修改) -->
-    <el-dialog :title="title" :visible.sync="open" width="500px" v-dialogDrag append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
-        <el-form-item label="需要监控对象的id " prop="objectId">
-          <el-input v-model="form.objectId" placeholder="请输入需要监控对象的id " />
-        </el-form-item>
-        <el-form-item label="需要监控的对象类型 1.产线 2.工段 3.设备" prop="objectType">
-          <el-select v-model="form.objectType" placeholder="请选择需要监控的对象类型 1.产线 2.工段 3.设备">
-            <el-option label="请选择字典生成" value="" />
-          </el-select>
-        </el-form-item>
-        <el-form-item label="需要监控的能源类型id" prop="energyTypeId">
-          <el-input v-model="form.energyTypeId" placeholder="请输入需要监控的能源类型id" />
-        </el-form-item>
-        <el-form-item label="监控模式 1.合并 2.详细" prop="type">
-          <el-select v-model="form.type" placeholder="请选择监控模式 1.合并 2.详细">
-            <el-option label="请选择字典生成" value="" />
-          </el-select>
-        </el-form-item>
-        <el-form-item label="需要监控的详细参数id 可以为空" prop="plcParamId">
-          <el-input v-model="form.plcParamId" placeholder="请输入需要监控的详细参数id 可以为空" />
-        </el-form-item>
-        <el-form-item label="限制类型 1.日 2.月" prop="limitType">
-          <el-select v-model="form.limitType" placeholder="请选择限制类型 1.日 2.月">
-            <el-option label="请选择字典生成" value="" />
-          </el-select>
-        </el-form-item>
-        <el-form-item label="限制量 阈值" prop="limitValue">
-          <el-input v-model="form.limitValue" placeholder="请输入限制量 阈值" />
-        </el-form-item>
-        <el-form-item label="备注" prop="remark">
-          <el-input v-model="form.remark" placeholder="请输入备注" />
-        </el-form-item>
-        <el-form-item label="版本号" prop="version">
-          <el-input v-model="form.version" placeholder="请输入版本号" />
-        </el-form-item>
-      </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="submitForm">确 定</el-button>
-        <el-button @click="cancel">取 消</el-button>
-      </div>
-    </el-dialog>
-  </div>
-</template>
-
-<script>
-import { createEnergyLimit, updateEnergyLimit, deleteEnergyLimit, getEnergyLimit, getEnergyLimitPage, exportEnergyLimitExcel } from "@/api/monitoring/energyLimit";
-
-export default {
-  name: "EnergyLimit",
-  components: {
-  },
-  data() {
-    return {
-      // 遮罩层
-      loading: true,
-      // 导出遮罩层
-      exportLoading: false,
-      // 显示搜索条件
-      showSearch: true,
-      // 总条数
-      total: 0,
-      // 能源监控配置列表
-      list: [],
-      // 弹出层标题
-      title: "",
-      // 是否显示弹出层
-      open: false,
-      // 查询参数
-      queryParams: {
-        pageNo: 1,
-        pageSize: 10,
-        objectId: null,
-        objectType: null,
-        energyTypeId: null,
-        type: null,
-        plcParamId: null,
-        limitType: null,
-        limitValue: null,
-        remark: null,
-        version: null,
-        createTime: [],
-      },
-      // 表单参数
-      form: {},
-      // 表单校验
-      rules: {
-        objectId: [{ required: true, message: "需要监控对象的id 不能为空", trigger: "blur" }],
-        objectType: [{ required: true, message: "需要监控的对象类型 1.产线 2.工段 3.设备不能为空", trigger: "change" }],
-        energyTypeId: [{ required: true, message: "需要监控的能源类型id不能为空", trigger: "blur" }],
-        type: [{ required: true, message: "监控模式 1.合并 2.详细不能为空", trigger: "change" }],
-      }
-    };
-  },
-  created() {
-    this.getList();
-  },
-  methods: {
-    /** 查询列表 */
-    getList() {
-      this.loading = true;
-      // 执行查询
-      getEnergyLimitPage(this.queryParams).then(response => {
-        this.list = response.data.list;
-        this.total = response.data.total;
-        this.loading = false;
-      });
-    },
-    /** 取消按钮 */
-    cancel() {
-      this.open = false;
-      this.reset();
-    },
-    /** 表单重置 */
-    reset() {
-      this.form = {
-        id: undefined,
-        objectId: undefined,
-        objectType: undefined,
-        energyTypeId: undefined,
-        type: undefined,
-        plcParamId: undefined,
-        limitType: undefined,
-        limitValue: undefined,
-        remark: undefined,
-        version: undefined,
-      };
-      this.resetForm("form");
-    },
-    /** 搜索按钮操作 */
-    handleQuery() {
-      this.queryParams.pageNo = 1;
-      this.getList();
-    },
-    /** 重置按钮操作 */
-    resetQuery() {
-      this.resetForm("queryForm");
-      this.handleQuery();
-    },
-    /** 新增按钮操作 */
-    handleAdd() {
-      this.reset();
-      this.open = true;
-      this.title = "添加能源监控配置";
-    },
-    /** 修改按钮操作 */
-    handleUpdate(row) {
-      this.reset();
-      const id = row.id;
-      getEnergyLimit(id).then(response => {
-        this.form = response.data;
-        this.open = true;
-        this.title = "修改能源监控配置";
-      });
-    },
-    /** 提交按钮 */
-    submitForm() {
-      this.$refs["form"].validate(valid => {
-        if (!valid) {
-          return;
-        }
-        // 修改的提交
-        if (this.form.id != null) {
-          updateEnergyLimit(this.form).then(response => {
-            this.$modal.msgSuccess("修改成功");
-            this.open = false;
-            this.getList();
-          });
-          return;
-        }
-        // 添加的提交
-        createEnergyLimit(this.form).then(response => {
-          this.$modal.msgSuccess("新增成功");
-          this.open = false;
-          this.getList();
-        });
-      });
-    },
-    /** 删除按钮操作 */
-    handleDelete(row) {
-      const id = row.id;
-      this.$modal.confirm('是否确认删除能源监控配置编号为"' + id + '"的数据项?').then(function() {
-          return deleteEnergyLimit(id);
-        }).then(() => {
-          this.getList();
-          this.$modal.msgSuccess("删除成功");
-        }).catch(() => {});
-    },
-    /** 导出按钮操作 */
-    handleExport() {
-      // 处理查询参数
-      let params = {...this.queryParams};
-      params.pageNo = undefined;
-      params.pageSize = undefined;
-      this.$modal.confirm('是否确认导出所有能源监控配置数据项?').then(() => {
-          this.exportLoading = true;
-          return exportEnergyLimitExcel(params);
-        }).then(response => {
-          this.$download.excel(response, '能源监控配置.xls');
-          this.exportLoading = false;
-        }).catch(() => {});
-    }
-  }
-};
-</script>

src/views/energy/monitoring/energyOverlimitLog/index.vue

@@ -0,0 +1,152 @@
+<template>
+  <div class="app-container">
+
+    <!-- 搜索工作栏 -->
+    <search-bar
+      :formConfigs="formConfig"
+      ref="searchBarForm"
+      @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>
+
+<script>
+import { getEnergyOverlimitLogPage } from "@/api/monitoring/energyOverlimitLog";
+import { getEnergyTypeListAll } from "@/api/base/energyType";
+import { publicFormatter } from '@/utils/dict'
+const tableProps = [
+  {
+    prop: 'objName',
+    label: '监控对象'
+  },
+  {
+    prop: 'objRemark',
+    label: '对象备注'
+  },
+  {
+    prop: 'energyType',
+    label: '能源类型'
+  },
+  {
+    prop: 'type',
+    label: '监控模式'
+  },
+  {
+    prop: 'plcParamId',
+    label: '监控参数'
+  },
+  {
+    prop: 'limitType',
+    label: '指标类型',
+    filter: publicFormatter('monitor_index_type')
+  },
+  {
+    prop: 'realityValue',
+    label: '实际值'
+  },
+  {
+    prop: 'limitValue',
+    label: '阈值'
+  },
+  {
+    prop: 'overValue',
+    label: '超出值'
+  }
+]
+export default {
+  name: "EnergyOverlimitLog",
+  data() {
+    return {
+      formConfig: [
+        {
+          type: 'select',
+          label: '能源类型',
+          selectOptions: [],
+          param: 'energyTypeId'
+        },
+        {
+          type: 'select',
+          label: '指标类型',
+          selectOptions: this.getDictDatas(this.DICT_TYPE.MONITOR_INDEX_TYPE),
+          labelField: 'label',
+          valueField: 'value',
+          param: 'indexType'
+        },
+        {
+          type: 'button',
+          btnName: '查询',
+          name: 'search',
+          color: 'primary'
+        }
+      ],
+      tableProps,
+      tableH: this.tableHeight(260),
+      // 总条数
+      total: 0,
+      // 班次基础信息列表
+      list: [],
+      // 查询参数
+      queryParams: {
+        pageNo: 1,
+        pageSize: 20,
+        energyTypeId: '',
+        indexType: ''
+      },
+      typeList: [
+        {id: 1, name: '合并'},
+        {id: 2, name: '详细'}
+      ]
+    };
+  },
+  created() {
+    window.addEventListener('resize', () => {
+      this.tableH = this.tableHeight(260)
+    })
+    this.getList();
+    this.getTypeList()
+  },
+  methods: {
+    buttonClick(val) {
+      this.queryParams.pageNo = 1;
+      this.queryParams.energyTypeId = val.energyTypeId
+      this.queryParams.indexType = val.indexType
+      this.getList()
+    },
+    /** 查询列表 */
+    getList() {
+      getEnergyOverlimitLogPage(this.queryParams).then(response => {
+        let arr = response.data.list || [];
+        arr&&arr.map((item) => {
+          this.typeList.map((i) => {
+            if (item.type === i.id) {
+              item.type = i.name
+            }
+          })
+        })
+        this.list = arr
+        this.total = response.data.total;
+      });
+    },
+    getTypeList() {
+      getEnergyTypeListAll().then((res) => {
+        console.log(res)
+        this.formConfig[0].selectOptions = res.data || []
+      })
+    }
+  }
+};
+</script>

src/views/energy/monitoring/energyReport/index.vue

@@ -0,0 +1,193 @@
+<template>
+  <div class="app-container">
+
+    <!-- 搜索工作栏 -->
+    <search-bar
+      :formConfigs="formConfig"
+      ref="searchBarForm"
+      @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>
+
+<script>
+import { energyReportPageAuto, energyReportPageExportAuto } from "@/api/monitoring/energyReport";
+import { parseTime } from '@/utils/ruoyi'
+import { getEnergyTypeListAll } from "@/api/base/energyType";
+// import { getTree } from '@/api/base/factory'
+import { publicFormatter } from '@/utils/dict'
+const tableProps = [
+  {
+    prop: 'statisticType',
+    label: '统计类型',
+    filter: publicFormatter('statistic_type')
+  },
+  {
+    prop: 'startTime',
+    label: '开始时间',
+    filter: parseTime,
+    minWidth: 150
+  },
+  {
+    prop: 'endTime',
+    label: '结束时间',
+    filter: parseTime,
+    minWidth: 150
+  },
+  {
+    prop: 'statisticName',
+    label: '统计方案'
+  },
+  {
+    prop: 'energyType',
+    label: '能源类型'
+  },
+  {
+    prop: 'startNum',
+    label: '抄表数(起始)'
+  },
+  {
+    prop: 'endNum',
+    label: '抄表数(结束)'
+  },
+  {
+    prop: 'useNum',
+    label: '消耗量'
+  }
+]
+export default {
+  name: "EnergyReportSearch",
+  data() {
+    return {
+      formConfig: [
+        {
+          type: 'select',
+          label: '能源类型',
+          selectOptions: [],
+          param: 'energyTypeId'
+        },
+        {
+          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: "yyyy-MM-ddTHH:mm:ss",
+          rangeSeparator: '-',
+          startPlaceholder: '开始时间',
+          endPlaceholder: '结束时间',
+          param: 'timeVal',
+          defaultSelect: [],
+          width: 350
+        },
+        {
+          type: 'button',
+          btnName: '查询',
+          name: 'search',
+          color: 'primary'
+        },
+        {
+          type: 'separate'
+        },
+        {
+          type: this.$auth.hasPermi('monitoring:energy-limit:create') ? 'button' : '',
+          btnName: '导出',
+          name: 'add',
+          color: 'primary',
+          plain: true
+        }
+      ],
+      tableProps,
+      tableH: this.tableHeight(260),
+      // 总条数
+      total: 0,
+      // 班次基础信息列表
+      list: [],
+      // 查询参数
+      queryParams: {
+        pageNo: 1,
+        pageSize: 20,
+        energyTypeId: null,
+        startTime: null,
+        endTime: null,
+        statisticType: null
+      },
+      energyTypeList: [],
+      typeList: [
+        {label: '合并', value: '1'},
+        {label: '详细', value: '2'}
+      ],
+      objList: []
+    };
+  },
+  created() {
+    window.addEventListener('resize', () => {
+      this.tableH = this.tableHeight(260)
+    })
+    this.getList();
+    this.getTypeList()
+  },
+  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] : nul
+          this.queryParams.endTime = val.timeVal ? val.timeVal[1] : nul
+          this.getList()
+          break
+        default:
+          this.addOrEditTitle = '新增'
+          this.centervisible = true
+          this.$nextTick(() => {
+            this.$refs.energyLimit.init()
+          })
+      }
+    },
+    /** 查询列表 */
+    getList() {
+      energyReportPageAuto({...this.queryParams}).then(response => {
+        let arr = response.data.list || [];
+        // arr&&arr.map(item => {
+        //   this.typeList.map(i => {
+        //     if (item.type === i.value) {
+        //       item.type = i.label
+        //     }
+        //   })
+        // })
+        this.list = arr
+        this.total = response.data.total;
+      });
+    }
+  }
+};
+</script>

src/views/energy/monitoring/energyReportSearch/index.vue

@@ -0,0 +1,168 @@
+<template>
+  <div class="app-container">
+
+    <!-- 搜索工作栏 -->
+    <search-bar
+      :formConfigs="formConfig"
+      ref="searchBarForm"
+      @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>
+
+<script>
+import { energyReportPage, energyReportPageExport } from "@/api/monitoring/energyReport";
+// import { publicFormatter } from '@/utils/dict'
+const tableProps = [
+  {
+    prop: 'statisticName',
+    label: '统计方案'
+  },
+  {
+    prop: 'energyType',
+    label: '能源类型'
+  },
+  {
+    prop: 'startNum',
+    label: '抄表数(起始)'
+  },
+  {
+    prop: 'endNum',
+    label: '抄表数(结束)'
+  },
+  {
+    prop: 'useNum',
+    label: '消耗量'
+  }
+]
+export default {
+  name: "EnergyReportSearch",
+  data() {
+    return {
+      formConfig: [
+        {
+          type: 'input',
+          label: '统计方案',
+          param: 'statisticName'
+        },
+        {
+          type: 'datePicker',
+          label: '时间',
+          dateType: 'datetimerange',
+          format: 'yyyy-MM-dd HH:mm:ss',
+          valueFormat: "yyyy-MM-ddTHH:mm:ss",
+          rangeSeparator: '-',
+          startPlaceholder: '开始时间',
+          endPlaceholder: '结束时间',
+          param: 'timeVal',
+          defaultSelect: [],
+          width: 350
+        },
+        {
+          type: 'button',
+          btnName: '查询',
+          name: 'search',
+          color: 'primary'
+        },
+        {
+          type: 'separate'
+        },
+        {
+          type: this.$auth.hasPermi('monitoring:energy-limit:create') ? 'button' : '',
+          btnName: '导出',
+          name: 'add',
+          color: 'primary',
+          plain: true
+        }
+      ],
+      tableProps,
+      tableH: this.tableHeight(260),
+      // 总条数
+      total: 0,
+      // 班次基础信息列表
+      list: [],
+      // 查询参数
+      queryParams: {
+        pageNo: 1,
+        pageSize: 20,
+        statisticName: null,
+        startTime: null,
+        endTime: null
+      },
+      energyTypeList: [],
+      typeList: [
+        {label: '合并', value: '1'},
+        {label: '详细', value: '2'}
+      ],
+      objList: []
+    };
+  },
+  created() {
+    window.addEventListener('resize', () => {
+      this.tableH = this.tableHeight(260)
+    })
+    this.getList();
+  },
+  methods: {
+    buttonClick(val) {
+      switch (val.btnName) {
+        case 'search':
+          this.queryParams.pageNo = 1;
+          this.queryParams.statisticName = val.statisticName
+          this.queryParams.startTime = val.timeVal ? val.timeVal[0] : nul
+          this.queryParams.endTime = val.timeVal ? val.timeVal[1] : nul
+          this.getList()
+          break
+        default:
+          this.addOrEditTitle = '新增'
+          this.centervisible = true
+          this.$nextTick(() => {
+            this.$refs.energyLimit.init()
+          })
+      }
+    },
+    /** 查询列表 */
+    getList() {
+      energyReportPage({...this.queryParams}).then(response => {
+        let arr = response.data.list || [];
+        // arr&&arr.map(item => {
+        //   this.typeList.map(i => {
+        //     if (item.type === i.value) {
+        //       item.type = i.label
+        //     }
+        //   })
+        // })
+        this.list = arr
+        this.total = response.data.total;
+      });
+    },
+    handleClick(val) {
+      switch (val.type) {
+        case 'edit':
+          this.addOrEditTitle = '编辑'
+          this.$nextTick(() => {
+            this.$refs.energyLimit.init(val.data.id)
+          })
+          this.centervisible = true
+          break
+        default:
+        this.handleDelete(val.data)
+      }
+    }
+  }
+};
+</script>

src/views/energy/monitoring/energyStatistics/components/energyStatisticsAdd.vue

@@ -0,0 +1,128 @@
+<template>
+  <el-form ref="form" :rules="rules" label-width="100px" :model="form">
+    <el-row>
+      <el-col :span="12">
+        <el-form-item label="方案名称" prop="name">
+          <el-input v-model="form.name"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="12">
+        <el-form-item label="方案编码" prop="code">
+          <el-input v-model="form.code" disabled></el-input>
+        </el-form-item>
+      </el-col>
+    </el-row>
+    <el-row>
+      <el-col :span="12">
+        <el-form-item label="统计类型" prop="type">
+          <el-select v-model="form.type" placeholder="请选择" style="width: 100%;">
+            <el-option
+              v-for="item in getDictDatas(DICT_TYPE.STATISTIC_TYPE)"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value">
+            </el-option>
+          </el-select>
+        </el-form-item>
+      </el-col>
+      <el-col :span="12">
+        <el-form-item label="能源类型" prop="energyTypeId">
+          <el-select v-model="form.energyTypeId" placeholder="请选择" style="width: 100%;">
+            <el-option
+              v-for="item in energyListType"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id">
+            </el-option>
+          </el-select>
+        </el-form-item>
+      </el-col>
+    </el-row>
+    <el-row>
+      <el-col :span="12">
+        <el-form-item label="备注" prop="remark">
+          <el-input v-model="form.remark"></el-input>
+        </el-form-item>
+      </el-col>
+    </el-row>
+  </el-form>
+</template>
+<script>
+import { getCode, createEnergyStatistics, updateEnergyStatistics, getEnergyStatistics } from "@/api/monitoring/energyStatistics";
+import { getEnergyTypeListAll } from '@/api/base/energyType'
+import { number } from 'echarts';
+export default {
+  name: 'EnergyStatisticsAdd',
+  data() {
+    return {
+      form: {
+        id: '',
+        name: '',
+        code: '',
+        type: '',
+        energyTypeId: ''
+      },
+      plcList: [],
+      objList: [],
+      isEdit: false, //是否是编辑
+      rules: {
+        name: [{ required: true, message: '方案名称不能为空', trigger: 'blur' }],
+        type: [{ required: true, message: '统计类型不能为空', trigger: 'change' }],
+        energyTypeId: [{ required: true, message: '能源类型不能为空', trigger: 'change' }]
+      },
+      energyListType: [],
+    }
+  },
+  methods: {
+    init(id) {
+      getEnergyTypeListAll().then((res) => {
+        this.energyListType = res.data || []
+      })
+      if (id) {
+        this.isEdit = true
+        this.form.id = id
+        getEnergyStatistics( id ).then((res) => {
+          if (res.code === 0) {
+            this.form = res.data
+            this.form.type = this.form.type + ''
+          }
+        })
+      } else {
+        getCode().then((res) => {
+          this.form.code = res.data
+        })
+        this.isEdit = false
+        this.form.id = ''
+      }
+    },
+    submitForm() {
+      this.$refs['form'].validate((valid) => {
+        if (valid) {
+          if (this.isEdit) {
+            // 编辑
+            updateEnergyStatistics({...this.form}).then((res) => {
+              if (res.code === 0) {
+                this.$modal.msgSuccess("操作成功");
+                this.$emit('successSubmit')
+              }
+            })
+          } else {
+            createEnergyStatistics({...this.form}).then((res) => {
+              if (res.code === 0) {
+                this.$modal.msgSuccess("操作成功");
+                this.$emit('successSubmit')
+              }
+            })
+          }
+        } else {
+          return false
+        }
+      })
+    },
+    formClear() {
+      this.$refs.form.resetFields()
+      this.isEdit = false
+    }
+  }
+}
+</script>

src/views/energy/monitoring/energyStatistics/components/energyStatisticsDet.vue

@@ -0,0 +1,223 @@
+<template>
+  <div>
+    <el-drawer title="参数绑定" :visible.sync="visible" size="70%" @close='closeD'>
+      <div class="box">
+        <el-form :inline="true">
+          <el-form-item label="方案名称">
+            <el-input v-model="name" size='small' readonly></el-input>
+          </el-form-item>
+          <el-form-item label="能源类型">
+            <el-input v-model="energyType" size='small' readonly></el-input>
+          </el-form-item>
+          <el-form-item>
+            <el-button type="success" size='small' v-if="showBtn" plain @click="addNew">新增</el-button>
+            <el-button type="danger" size='small' v-if="showBtn" plain @click="deleteAll">批量删除</el-button>
+          </el-form-item>
+        </el-form>
+        <base-table
+          :page="queryParams.pageNo"
+          :limit="queryParams.pageSize"
+          :table-props="tableProps"
+          :table-data="tableData"
+          :max-height="tableH"
+          :selectWidth="55"
+          @selection-change="selectChange"
+        >
+          <method-btn
+            v-if="tableBtn.length"
+            slot="handleBtn"
+            :width="80"
+            label="操作"
+            :method-list="tableBtn"
+            @clickBtn="handleClick"
+          />
+        </base-table>
+        <pagination
+          :page.sync="queryParams.pageNo"
+          :limit.sync="queryParams.pageSize"
+          :total="total"
+          @pagination="getList"
+        />
+      </div>
+    </el-drawer>
+    <!-- 新增 -->
+    <energy-statistics-det-add ref="energyStatistics" @closeDet="closeDet" />
+  </div>
+</template>
+<script>
+import { getEnergyStatisticsDetPage, deleteEnergyStatisticsDet, deleteMany } from '@/api/monitoring/energyStatisticsDet'
+import EnergyStatisticsDetAdd from './energyStatisticsDetAdd'
+import { publicFormatter } from '@/utils/dict'
+const tableProps = [
+  {
+    prop: 'objName',
+    label: '所属对象'
+  },
+  {
+    prop: 'paramName',
+    label: '参数名称'
+  },
+  {
+    prop: 'unit',
+    label: '单位',
+    filter: publicFormatter('energy_unit')
+  },
+  {
+    prop: 'desc',
+    label: '描述'
+  }
+]
+export default {
+  name: 'EnergyStatisticsDet',
+  props: {
+    energyTypeList: {
+      type: Array,
+      required: true,
+      default: () => {
+        return []
+      }
+    }
+  },
+  data() {
+    return {
+      visible: false,
+      tableProps,
+      tableData: [],
+      tableBtn: [],
+      tableH: this.tableHeight(115),
+      total: 0,
+      queryParams: {
+        pageNo: 1,
+        pageSize: 30,
+        statisticsId: null
+      },
+      name: '',
+      energyType: '',
+      energyTypeId: '',
+      // 弹出层标题
+      addOrEditTitle: "",
+      // 是否显示弹出层
+      centervisible: false,
+      collectionList: [
+        {value: 0,label: '否'},
+        {value: 1,label: '是'}
+      ],
+      showBtn: true,
+      selectedList: []
+    }
+  },
+  components: { EnergyStatisticsDetAdd },
+  created() {
+    window.addEventListener('resize', () => {
+      this.tableH = this.tableHeight(115)
+    })
+  },
+  methods: {
+    init(data,title) {
+      this.visible = true
+      this.queryParams.statisticsId = data.id
+      this.name = data.name
+      this.energyType = data.energyType
+      this.energyTypeId = data.energyTypeId
+      this.getList()
+      if (title === 'view') {
+        this.showBtn = false
+        this.tableBtn = []
+      } else {
+        this.showBtn = true
+        this.tableBtn = [
+          {
+            type: 'delete',
+            btnName: '删除'
+          }
+        ]
+      }
+    },
+    getList() {
+      console.log(this.queryParams)
+      getEnergyStatisticsDetPage({...this.queryParams}).then((res) => {
+        let arr = res.data.list || []
+        arr&&arr.map(item => {
+          this.collectionList.map(i => {
+            if (item.collection === i.value) {
+              item.collection = i.label
+            }
+          })
+          this.energyTypeList.map(j => {
+            if (item.typeId === j.id) {
+              item.typeId = j.name
+            }
+          })
+        })
+        this.tableData = arr
+        this.total = res.data.total;
+      })
+    },
+    // 新增
+    addNew() {
+      this.$nextTick(() => {
+        this.$refs.energyStatistics.init({'statisticsId': this.queryParams.statisticsId, energyTypeId:this.energyTypeId})
+      })
+    },
+    selectChange(val) {
+      console.log(val)
+      this.selectedList = val
+    },
+    // 批量删除
+    deleteAll() {
+      let arr = []
+      if (this.selectedList.length === 0) {
+        this.$modal.msgWarning("请选勾选数据")
+        return false
+      } else {
+        this.selectedList.map((item) => {
+          arr.push(item.id)
+        })
+      }
+      this.$modal.confirm('是否确认删除所有勾选的数据项?').then(function() {
+          return deleteMany(arr);
+        }).then(() => {
+          this.queryParams.pageNo = 1
+          this.getList()
+          this.$modal.msgSuccess("删除成功")
+        }).catch(() => {})
+    },
+    handleCancel() {
+      this.$refs.energyStatistics.formClear()
+      this.centervisible = false
+      this.addOrEditTitle = ''
+    },
+    handleConfirm() {
+      this.$refs.energyStatistics.submitForm()
+    },
+    successSubmit() {
+      this.handleCancel()
+      this.getList()
+    },
+    handleClick(val) {
+      this.handleDelete(val.data)
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      this.$modal.confirm('是否确认删除参数列名为"' + row.paramName + '"的数据项?').then(function() {
+          return deleteEnergyStatisticsDet(row.id);
+        }).then(() => {
+          this.queryParams.pageNo = 1
+          this.getList()
+          this.$modal.msgSuccess("删除成功")
+        }).catch(() => {})
+    },
+    closeD() {
+      this.$emit('closeDrawer')
+    },
+    closeDet() {  // 关闭新增框
+      this.getList()
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.box {
+  padding: 0 32px;
+}
+</style>

src/views/energy/monitoring/energyStatistics/components/energyStatisticsDetAdd.vue

@@ -0,0 +1,174 @@
+<template>
+  <el-drawer
+    title="新增"
+    :visible.sync="centervisible"
+    size="60%"
+    @close='closeA'>
+    <div class="box">
+      <!-- 搜索工作栏 -->
+      <search-bar
+        :formConfigs="formConfig"
+        ref="searchBarForm"
+        :removeBlue='true'
+        @headBtnClick="buttonClick"
+      />
+      <!-- 列表 -->
+      <base-table
+        :page="queryParams.pageNo"
+        :limit="queryParams.pageSize"
+        :table-props="tableProps"
+        :table-data="list"
+        :max-height="tableH"
+        :selectWidth="55"
+        @selection-change="selectChange"
+      >
+      </base-table>
+      <pagination
+        :page.sync="queryParams.pageNo"
+        :limit.sync="queryParams.pageSize"
+        :total="total"
+        @pagination="getList"
+      />
+    </div>
+  </el-drawer>
+</template>
+<script>
+import { addParamPage, createEnergyStatisticsDet } from '@/api/monitoring/energyStatisticsDet'
+import { publicFormatter } from '@/utils/dict'
+const tableProps = [
+  {
+    prop: 'objName',
+    label: '所属对象'
+  },
+  {
+    prop: 'paramName',
+    label: '参数名称'
+  },
+  {
+    prop: 'unit',
+    label: '单位',
+    filter: publicFormatter('energy_unit')
+  },
+  {
+    prop: 'desc',
+    label: '描述'
+  }
+]
+export default {
+  name: 'EnergyStatisticsDetAdd',
+  data() {
+    return {
+      centervisible: false,
+      formConfig: [
+        {
+          type: 'select',
+          label: '对象类型',
+          selectOptions: this.getDictDatas(this.DICT_TYPE.OBJECT_TYPE),
+          labelField: 'label',
+          valueField: 'value',
+          param: 'objType'
+        },
+        {
+          type: 'input',
+          label: '参数名称',
+          placeholder: '方案名称',
+          param: 'paramName'
+        },
+        {
+          type: 'button',
+          btnName: '查询',
+          name: 'search',
+          color: 'primary'
+        },
+        {
+          type: 'separate'
+        },
+        {
+          type: 'button',
+          btnName: '关联',
+          name: 'add',
+          color: 'primary',
+          plain: true
+        }
+      ],
+      queryParams: {
+        pageNo: 1,
+        pageSize: 20,
+        energyTypeId: null,
+        statisticId: null,
+        paramName: '',
+        objType: ''
+      },
+      tableProps,
+      list: [],
+      total: 0,
+      tableH: this.tableHeight(260),
+      selectedList: []
+    }
+  },
+  methods: {
+    init(param) {
+      this.queryParams.statisticId = param.statisticsId
+      this.queryParams.energyTypeId = param.energyTypeId
+      window.addEventListener('resize', () => {
+        this.tableH = this.tableHeight(260)
+      })
+      this.centervisible = true
+      this.getList()
+    },
+    getList() {
+      addParamPage({...this.queryParams}).then((res) => {
+        this.list = res.data.list || []
+        this.total = res.data.total
+      })
+    },
+    buttonClick(val) {
+      switch (val.btnName) {
+        case 'search':
+          this.queryParams.pageNo = 1;
+          this.queryParams.objType = val.objType
+          this.queryParams.paramName = val.paramName
+          this.getList()
+          break
+        default:
+          // 关联
+          this.connectParam()
+      }
+    },
+    // 选中数据
+    selectChange(val) {
+      this.selectedList = val
+    },
+    // 关联
+    connectParam() {
+      let param = {
+        statisticsId: this.queryParams.statisticId,
+        plcParamIds: []
+      }
+      if (this.selectedList.length === 0) {
+        this.$modal.msgWarning("请选勾选数据")
+        return false
+      } else {
+        this.selectedList.map((item) => {
+          param.plcParamIds.push(item.id)
+        })
+      }
+      createEnergyStatisticsDet({...param}).then((res) => {
+        if (res.code === 0) {
+          this.$modal.msgSuccess("操作成功");
+          this.queryParams.pageNo = 1;
+          this.getList()
+        }
+      })
+    },
+    closeA() {
+      this.$emit('closeDet')
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.box {
+  padding: 0 32px;
+}
+</style>

src/views/energy/monitoring/energyStatistics/index.vue

@@ -0,0 +1,245 @@
+<template>
+  <div class="app-container">
+
+    <!-- 搜索工作栏 -->
+    <search-bar
+      :formConfigs="formConfig"
+      ref="searchBarForm"
+      @headBtnClick="buttonClick"
+    />
+    <!-- 列表 -->
+    <base-table
+      :page="queryParams.pageNo"
+      :limit="queryParams.pageSize"
+      :table-props="tableProps"
+      :table-data="list"
+      :max-height="tableH"
+    >
+      <method-btn
+        v-if="tableBtn.length"
+        slot="handleBtn"
+        :width="160"
+        label="操作"
+        :method-list="tableBtn"
+        @clickBtn="handleClick"
+      />
+    </base-table>
+    <pagination
+      :page.sync="queryParams.pageNo"
+      :limit.sync="queryParams.pageSize"
+      :total="total"
+      @pagination="getList"
+    />
+    <!-- 新增 -->
+    <base-dialog
+      :dialogTitle="addOrEditTitle"
+      :dialogVisible="centervisible"
+      @cancel="handleCancel"
+      @confirm="handleConfirm"
+      :before-close="handleCancel"
+    >
+      <energy-statistics-add ref="energyStatistics" @successSubmit="successSubmit" />
+    </base-dialog>
+    <!-- 参数绑定/查看 -->
+    <energy-statistics-det ref="plcParam" @closeDrawer="closeDrawer" :energyTypeList="energyTypeList"></energy-statistics-det>
+  </div>
+</template>
+
+<script>
+import { getEnergyStatisticsPage, deleteEnergyStatistics } from "@/api/monitoring/energyStatistics";
+import { publicFormatter } from '@/utils/dict'
+import { getEnergyTypeListAll } from '@/api/base/energyType'
+import EnergyStatisticsAdd from './components/energyStatisticsAdd'
+import EnergyStatisticsDet from './components/energyStatisticsDet'
+const tableProps = [
+  {
+    prop: 'name',
+    label: '方案名称'
+  },
+  {
+    prop: 'code',
+    label: '方案编码',
+    minWidth: 120,
+    showOverflowtooltip: true
+  },
+  {
+    prop: 'type', 
+    label: '统计类型',
+    filter: publicFormatter('statistic_type')
+  },
+  {
+    prop: 'energyType',
+    label: '能源类型'
+  },
+  {
+    prop: 'paramNum',
+    label: '统计参数数量'
+  },
+  {
+    prop: 'remark',
+    label: '备注'
+  }
+]
+export default {
+  name: "energyStatistics",
+  components: { EnergyStatisticsAdd, EnergyStatisticsDet },
+  data() {
+    return {
+      formConfig: [
+        {
+          type: 'input',
+          label: '方案名称',
+          placeholder: '方案名称',
+          param: 'name'
+        },
+        {
+          type: 'button',
+          btnName: '查询',
+          name: 'search',
+          color: 'primary'
+        },
+        {
+          type: 'separate'
+        },
+        {
+          type: this.$auth.hasPermi('monitoring:energy-statistics:create') ? 'button' : '',
+          btnName: '新增',
+          name: 'add',
+          color: 'success',
+          plain: true
+        }
+      ],
+      tableProps,
+      tableBtn: [
+        this.$auth.hasPermi('monitoring:energy-statistics:update')
+          ? {
+              type: 'edit',
+              btnName: '编辑'
+            }
+          : undefined,
+        {
+          type: 'view',
+          btnName: '查看'
+        },
+        this.$auth.hasPermi('monitoring:energy-statistics:bind')
+        ? {
+            type: 'connect',
+            btnName: '绑定'
+          }
+        : undefined,
+        this.$auth.hasPermi('monitoring:energy-statistics:delete')
+          ? {
+              type: 'delete',
+              btnName: '删除'
+            }
+          : undefined
+      ].filter((v) => v),
+      tableH: this.tableHeight(260),
+      // 总条数
+      total: 0,
+      // 班次基础信息列表
+      list: [],
+      // 弹出层标题
+      addOrEditTitle: "",
+      // 是否显示弹出层
+      centervisible: false,
+      // 查询参数
+      queryParams: {
+        pageNo: 1,
+        pageSize: 20,
+        name: null
+      },
+      energyTypeList: []
+    };
+  },
+  created() {
+    window.addEventListener('resize', () => {
+      this.tableH = this.tableHeight(260)
+    })
+    this.getList();
+  },
+  mounted() {
+    // 获取能源列表
+    this.getEnergyTypeList()
+  },
+  methods: {
+    buttonClick(val) {
+      switch (val.btnName) {
+        case 'search':
+          this.queryParams.pageNo = 1;
+          this.queryParams.name = val.name
+          this.getList()
+          break
+        default:
+          this.addOrEditTitle = '新增'
+          this.centervisible = true
+          this.$nextTick(() => {
+            this.$refs.energyStatistics.init()
+          })
+      }
+    },
+    /** 查询列表 */
+    getList() {
+      getEnergyStatisticsPage(this.queryParams).then(response => {
+        let arr = response.data.list || [];
+        this.list = arr
+        this.total = response.data.total;
+      });
+    },
+    handleClick(val) {
+      console.log(val)
+      switch (val.type) {
+        case 'edit':
+          this.addOrEditTitle = '编辑'
+          this.$nextTick(() => {
+            this.$refs.energyStatistics.init(val.data.id)
+          })
+          this.centervisible = true
+          break
+        case 'delete':
+          this.handleDelete(val.data)
+          break
+        case 'view':
+          this.$nextTick(() => {
+            this.$refs.plcParam.init(val.data, 'view')
+          })
+          break
+        default:
+          this.$nextTick(() => {
+            this.$refs.plcParam.init(val.data, 'connect')
+          })
+      }
+    },
+    handleCancel() {
+      this.$refs.energyStatistics.formClear()
+      this.centervisible = false
+      this.addOrEditTitle = ''
+    },
+    handleConfirm() {
+      this.$refs.energyStatistics.submitForm()
+    },
+    successSubmit() {
+      this.handleCancel()
+      this.getList()
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      this.$modal.confirm('是否确认删除方案名称为"' + row.name + '"的数据项?').then(function() {
+          return deleteEnergyStatistics(row.id);
+        }).then(() => {
+          this.queryParams.pageNo = 1;
+          this.getList();
+          this.$modal.msgSuccess("删除成功");
+        }).catch(() => {});
+    },
+    closeDrawer() {
+      this.getList()
+    },
+    getEnergyTypeList() {
+      getEnergyTypeListAll().then((res) => {
+        this.energyTypeList = res.data || []
+      })
+    }
+  }
+};
+</script>