能源分析

package.json

@@ -74,6 +74,7 @@
     "vue-video-player": "^5.0.2",
     "vuedraggable": "2.24.3",
     "vuex": "3.6.2",
+    "xlsx": "^0.18.5",
     "xml-js": "1.6.11"
   },
   "devDependencies": {

src/api/analysis/energyAnalysis.js

@@ -0,0 +1,37 @@
+import request from '@/utils/request'
+
+// 获取走势分析数据
+export function getEnergyTrend(data) {
+  return request({
+    url: '/analysis/energy-analysis/getTrend',
+    method: 'post',
+    data: data
+  })
+}
+
+// 获取对比分析数据
+export function getCompare(data) {
+  return request({
+    url: '/analysis/energy-analysis/getCompare',
+    method: 'post',
+    data: data
+  })
+}
+
+// 获取同比分析数据(1:季度,2:月;3:日)
+export function getYoy(data) {
+  return request({
+    url: '/analysis/energy-analysis/getYoy',
+    method: 'post',
+    data: data
+  })
+}
+
+// 获取环比分析数据(1:月,2:周,3:日)
+export function getQoq(data) {
+  return request({
+    url: '/analysis/energy-analysis/getChain',
+    method: 'post',
+    data: data
+  })
+}

src/api/monitoring/energyReport.js

@@ -23,7 +23,8 @@ export function energyReportPageExport(data) {
   return request({
     url: '/monitoring/energy-report/export',
     method: 'post',
-    data: data
+    data: data,
+    responseType: 'blob'
   })
 }
 
@@ -32,6 +33,7 @@ export function energyReportPageExportAuto(data) {
   return request({
     url: '/monitoring/energy-report/exportAuto',
     method: 'post',
-    data: data
+    data: data,
+    responseType: 'blob'
   })
 }

src/utils/chartMixins/resize.js

@@ -0,0 +1,64 @@
+import { debounce } from '@/utils/debounce'
+
+export default {
+  data() {
+    return {
+      $_sidebarElm: null,
+      $_resizeHandler: null
+    }
+  },
+  mounted() {
+    this.$_resizeHandler = debounce(() => {
+      if (this.chart) {
+        this.chart.resize()
+      }
+    }, 100)
+    this.$_initResizeEvent()
+    this.$_initSidebarResizeEvent()
+  },
+  beforeDestroy() {
+    this.$_destroyResizeEvent()
+    this.$_destroySidebarResizeEvent()
+  },
+  // to fixed bug when cached by keep-alive
+  // https://github.com/PanJiaChen/vue-element-admin/issues/2116
+  activated() {
+    this.$_initResizeEvent()
+    this.$_initSidebarResizeEvent()
+  },
+  deactivated() {
+    this.$_destroyResizeEvent()
+    this.$_destroySidebarResizeEvent()
+  },
+  methods: {
+    // use $_ for mixins properties
+    // https://vuejs.org/v2/style-guide/index.html#Private-property-names-essential
+    $_initResizeEvent() {
+      window.addEventListener('resize', this.$_resizeHandler)
+    },
+    $_destroyResizeEvent() {
+      window.removeEventListener('resize', this.$_resizeHandler)
+    },
+    $_sidebarResizeHandler(e) {
+      if (e.propertyName === 'width') {
+        this.$_resizeHandler()
+      }
+    },
+    $_initSidebarResizeEvent() {
+      this.$_sidebarElm =
+        document.getElementsByClassName('sidebar-container')[0]
+      this.$_sidebarElm &&
+        this.$_sidebarElm.addEventListener(
+          'transitionend',
+          this.$_sidebarResizeHandler
+        )
+    },
+    $_destroySidebarResizeEvent() {
+      this.$_sidebarElm &&
+        this.$_sidebarElm.removeEventListener(
+          'transitionend',
+          this.$_sidebarResizeHandler
+        )
+    }
+  }
+}

src/utils/debounce.js

@@ -0,0 +1,40 @@
+/**
+ * @param {Function} func
+ * @param {number} wait
+ * @param {boolean} immediate
+ * @return {*}
+ */
+export function debounce(func, wait, immediate) {
+  let timeout, args, context, timestamp, result
+
+  const later = function () {
+    // 据上一次触发时间间隔
+    const last = +new Date() - timestamp
+
+    // 上次被包装函数被调用时间间隔 last 小于设定时间间隔 wait
+    if (last < wait && last > 0) {
+      timeout = setTimeout(later, wait - last)
+    } else {
+      timeout = null
+      // 如果设定为immediate===true，因为开始边界已经调用过了此处无需调用
+      if (!immediate) {
+        result = func.apply(context, args)
+        if (!timeout) context = args = null
+      }
+    }
+  }
+
+  return function (...args) {
+    context = this
+    timestamp = +new Date()
+    const callNow = immediate && !timeout
+    // 如果延时不存在，重新设定延时
+    if (!timeout) timeout = setTimeout(later, wait)
+    if (callNow) {
+      result = func.apply(context, args)
+      context = args = null
+    }
+
+    return result
+  }
+}

src/utils/dict.js

@@ -91,7 +91,8 @@ export const DICT_TYPE = {
   ENERGY_UNIT: 'energy_unit',
   MONITOR_INDEX_TYPE: 'monitor_index_type',
   OBJECT_TYPE: 'object_type',
-  STATISTIC_TYPE: 'statistic_type'
+  STATISTIC_TYPE: 'statistic_type',
+  TIME_DIM: 'time_dim'
 }
 
 /**

src/views/energy/analysis/contrastAnalysis/components/barChart.vue

@@ -0,0 +1,77 @@
+<template>
+  <div 
+    id="analysischartBar"
+    style="width: 100%"
+    :style="{ height: chartHeight + 'px' }"
+  ></div>
+</template>
+<script>
+import * as echarts from 'echarts'
+import resize from '@/utils/chartMixins/resize'
+export default {
+  name: "BarChart",
+  mixins: [resize],
+  data() {
+    return {
+      chartDom: '',
+      chart: '',
+      chartHeight: this.tableHeight(214) - 70
+    }
+  },
+  props: {
+    chartData: {
+      type: Array,
+      required: true,
+      default: () => {
+        return []
+      }
+    }
+  },
+  watch: {
+    chartData: function () {
+      this.getChart()
+    }
+  },
+  mounted() {
+    window.addEventListener('resize', () => {
+      this.chartHeight = this.tableHeight(214) - 70
+    })
+  },
+  methods: {
+    getChart() {
+      if (
+        this.chart !== null &&
+        this.chart !== '' &&
+        this.chart !== undefined
+      ) {
+        this.chart.dispose() // 页面多次刷新会出现警告，Dom已经初始化了一个实例，这是销毁实例
+      }
+      this.chartDom = document.getElementById('analysischartBar')
+      this.chart = echarts.init(this.chartDom)
+      let xData = []
+      let yData = []
+      for (let i = 0; i < this.chartData.length; i++) {
+        xData.push(this.chartData[i].time)
+        yData.push(this.chartData[i].useNum)
+      }
+      var option = {
+        xAxis: {
+          type: 'category',
+          data: xData
+        },
+        yAxis: {
+          type: 'value'
+        },
+        series: [
+          {
+            data: yData,
+            type: 'bar'
+          }
+        ]
+      };
+
+      option && this.chart.setOption(option);
+    }
+  }
+}
+</script>

src/views/energy/analysis/contrastAnalysis/components/lineChart.vue

@@ -0,0 +1,78 @@
+<template>
+  <div 
+    id="analysischartLine"
+    style="width: 100%"
+    :style="{ height: chartHeight + 'px' }"
+  ></div>
+</template>
+<script>
+import * as echarts from 'echarts'
+import resize from '@/utils/chartMixins/resize'
+export default {
+  name: "LineChart",
+  mixins: [resize],
+  data() {
+    return {
+      chartDom: '',
+      chart: '',
+      chartHeight: this.tableHeight(214) - 70
+    }
+  },
+  props: {
+    chartData: {
+      type: Array,
+      required: true,
+      default: () => {
+        return []
+      }
+    }
+  },
+  watch: {
+    chartData: function () {
+      this.getChart()
+    }
+  },
+  mounted() {
+    window.addEventListener('resize', () => {
+      this.chartHeight = this.tableHeight(214) - 70
+    })
+  },
+  methods: {
+    getChart() {
+      if (
+        this.chart !== null &&
+        this.chart !== '' &&
+        this.chart !== undefined
+      ) {
+        this.chart.dispose() // 页面多次刷新会出现警告，Dom已经初始化了一个实例，这是销毁实例
+      }
+      this.chartDom = document.getElementById('analysischartLine')
+      this.chart = echarts.init(this.chartDom)
+      let xData = []
+      let yData = []
+      for (let i = 0; i < this.chartData.length; i++) {
+        xData.push(this.chartData[i].time)
+        yData.push(this.chartData[i].useNum)
+      }
+
+      var option = {
+        xAxis: {
+          type: 'category',
+          data: xData
+        },
+        yAxis: {
+          type: 'value'
+        },
+        series: [
+          {
+            data: yData,
+            type: 'line'
+          }
+        ]
+      };
+
+      option && this.chart.setOption(option);
+    }
+  }
+}
+</script>

src/views/energy/analysis/contrastAnalysis/components/searchArea.vue

@@ -0,0 +1,363 @@
+<template>
+  <el-form :inline="true" class="demo-form-inline">
+    <el-form-item label="能源类型">
+      <el-select v-model="queryParams.energyTypeId" placeholder="请选择" style="width: 100px;">
+        <el-option
+          v-for="item in energyTypeList"
+          :key="item.id"
+          :label="item.name"
+          :value="item.id">
+        </el-option>
+      </el-select>
+    </el-form-item>
+    <el-form-item label="时间维度">
+      <el-select v-model="queryParams.timeDim" placeholder="请选择" style="width: 80px;">
+        <el-option
+          v-for="item in getDictDatas(this.DICT_TYPE.TIME_DIM)"
+          :key="item.value"
+          :label="item.label"
+          :value="item.value">
+        </el-option>
+      </el-select>
+    </el-form-item>
+    <el-form-item label="时间范围">
+      <div v-show="queryParams.timeDim === '1'">
+        <el-date-picker
+          v-model="timeValue"
+          type="datetimerange"
+          range-separator="至"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+          format="yyyy-MM-dd HH:mm"
+          value-format="timestamp"
+          :picker-options="pickerOptions"
+          popper-class="noneMinute"
+          @change="timeSelect"
+          >
+        </el-date-picker>
+      </div>
+      <div v-show="queryParams.timeDim === '2'">
+        <el-date-picker
+          v-model="dateValue"
+          type="daterange"
+          range-separator="至"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+          value-format="timestamp"
+          :picker-options="pickerOptions"
+          @change="timeSelect"
+          >
+        </el-date-picker>
+      </div>
+      <div v-show="queryParams.timeDim === '3'">
+        <el-date-picker
+          v-model="weekValue1"
+          type="week"
+          format="yyyy 第 WW 周"
+          style='width:150px;'
+          :picker-options="pickerOptionsWeek"
+          @change="startWeek"
+          placeholder="选择周">
+        </el-date-picker>-
+        <el-date-picker
+          v-model="weekValue2"
+          type="week"
+          format="yyyy 第 WW 周"
+          :picker-options="pickerOptionsWeek"
+          style='width:150px;'
+          @change="endWeek"
+          placeholder="选择周">
+        </el-date-picker>
+      </div>
+      <div v-show="queryParams.timeDim === '4'">
+        <el-date-picker
+          v-model="monthValue"
+          type="monthrange"
+          range-separator="至"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+          value-format="timestamp"
+          :picker-options="pickerOptions"
+          @change="timeSelect"
+          >
+        </el-date-picker>
+      </div>
+      <div v-show="queryParams.timeDim === '5'">
+        <el-date-picker
+          style='width:100px;'
+          v-model="yearValue1"
+          type="year"
+          :picker-options="pickerOptions"
+          value-format="timestamp"
+          placeholder="选择年"
+          @change="startYear"
+        >
+        </el-date-picker>-
+        <el-date-picker
+          style='width:100px;'
+          v-model="yearValue2"
+          type="year"
+          :picker-options="pickerOptions"
+          value-format="timestamp"
+          placeholder="选择年"
+          @change="endYear"
+        >
+        </el-date-picker>
+      </div>
+    </el-form-item>
+    <el-form-item label="对象维度">
+      <el-select v-model="queryParams.objType" placeholder="请选择" style="width: 80px;" @change="selectObjs">
+        <el-option
+          v-for="item in getDictDatas(this.DICT_TYPE.OBJECT_TYPE)"
+          :key="item.value"
+          :label="item.label"
+          :value="item.value">
+        </el-option>
+      </el-select>
+    </el-form-item>
+    <el-form-item label="对象选择">
+      <el-select v-model="queryParams.objIds" placeholder="请选择" multiple style="width: 80px;">
+        <el-option
+          v-for="item in objectList"
+          :key="item.value"
+          :label="item.label"
+          :value="item.value">
+        </el-option>
+      </el-select>
+    </el-form-item>
+    <el-form-item>
+      <el-button type="primary" @click="search">查询</el-button>
+    </el-form-item>
+  </el-form>
+</template>
+<script>
+import { getEnergyTypeListAll } from "@/api/base/energyType"
+import moment from 'moment'
+export default {
+  name: 'searchArea',
+  data() {
+    return {
+      // 查询参数
+      queryParams: {
+        energyTypeId: null,
+        objIds: [],
+        objType: '',
+        timeDim: null,
+        startTime: null,
+        endTime: null
+      },
+      timeValue: [],// 最大7天只能整点
+      dateValue: [],// 最大30天
+      weekValue1: null,//最多24周
+      weekValue2: null,
+      monthValue: [],//最多24月
+      yearValue1: null,//最多10年
+      yearValue2: null,
+      energyTypeList: [],
+      objectList: [],
+      pickerOptions: {
+        disabledDate(date) {
+          return date.getTime() > Date.now()
+        }
+      },
+      pickerOptionsWeek: {
+        disabledDate(time) {
+          let day = Date.now()
+          let limitTime = moment(day).day(-1)
+          return time.getTime() > new Date(limitTime).getTime()
+        }
+      }
+    }
+  },
+  mounted() {
+    this.getTypeList()
+    this.queryParams.timeDim = this.getDictDatas(this.DICT_TYPE.TIME_DIM)[0].value // 默认时
+  },
+  methods: {
+    getTypeList() {
+      getEnergyTypeListAll().then((res) => {
+        this.energyTypeList = res.data || []
+      })
+    },
+    // 范围选择器
+    timeSelect() {
+      switch (this.queryParams.timeDim) {
+        case '1':
+          if (this.timeValue[1] - this.timeValue[0] > 7*24*3600000) {
+            this.$modal.msgError('最大时间范围为7天，请重新选择')
+            this.timeValue = []
+          }
+          break
+        case '2':
+          if (this.dateValue[1] - this.dateValue[0] > 29*24*3600000) {
+            this.$modal.msgError('最大时间范围为30天，请重新选择') // 自动选择默认是0:00:00要求是23:59:59
+            this.dateValue = []
+          }
+          break
+        case '4':
+          if (this.monthValue[1] - this.monthValue[0] > 729*24*3600000) {
+            this.$modal.msgError('最大时间范围为24个月，请重新选择')// 同理上面
+            this.monthValue = []
+          }
+          break
+          default:
+      }
+    },
+    // 年选择器
+    startYear() {
+      if (this.yearValue2 && this.yearValue2 < this.yearValue1) {
+        this.$modal.msgError('开始时间不能晚于结束时间，请重新选择')
+        this.yearValue1 = null
+        return false
+      }
+      if (this.yearValue1 && this.yearValue2) {
+        if (this.yearValue2 - this.yearValue1 > 10*365*24*3600000) {
+          this.$modal.msgError('最大时间范围为10年，请重新选择')
+          this.yearValue1 = null
+          return false
+        }
+      }
+    },
+    endYear() {
+      if (this.yearValue2 && this.yearValue2 < this.yearValue1) {
+        this.$modal.msgError('结束时间不能早于开始时间，请重新选择')
+        this.yearValue2 = null
+        return false
+      }
+      if (this.yearValue1 && this.yearValue2) {
+        if (this.yearValue2 - this.yearValue1 > 10*365*24*3600000) {
+          this.$modal.msgError('最大时间范围为10年，请重新选择')
+          this.yearValue2 = null
+          return false
+        }
+      }
+    },
+    // 周选择器
+    startWeek() {
+      if (this.weekValue1 && this.weekValue2) {
+        let a = new Date(this.weekValue1).getTime()
+        let b = new Date(this.weekValue2).getTime()
+        if (a > b) {
+          this.$modal.msgError('开始时间不能晚于结束时间，请重新选择')
+          this.weekValue1 = null
+          return false
+        }
+        if (b - a > 167*24*3600000) {
+          this.$modal.msgError('最大时间范围为24周，请重新选择')
+          this.weekValue1 = null
+          return false
+        }
+      }
+    },
+    endWeek() {
+      if (this.weekValue1 && this.weekValue2) {
+        let a = new Date(this.weekValue1).getTime()
+        let b = new Date(this.weekValue2).getTime()
+        if (a > b) {
+          this.$modal.msgError('结束时间不能早于开始时间，请重新选择')
+          this.weekValue2 = null
+          return false
+        }
+        if (b - a > 167*24*3600000) {
+          this.$modal.msgError('最大时间范围为24周，请重新选择')
+          this.weekValue2 = null
+          return false
+        }
+      }
+    },
+    // 对象维度
+    selectObjs(val) {
+      console.log(val)
+    },
+    // 查询
+    search() {
+      if (!this.queryParams.energyTypeId) {
+        this.$modal.msgError('请选择能源类型')
+        return false
+      }
+      if (!this.queryParams.timeDim) {
+        this.$modal.msgError('请选择时间维度')
+        return false
+      }
+      switch (this.queryParams.timeDim) {
+        case '1':
+          if (this.timeValue.length > 0) {
+            this.queryParams.startTime = this.timeValue[0]
+            this.queryParams.endTime = this.timeValue[1] // 不用转
+          } else {
+            this.$modal.msgError('时间范围不能为空')
+            return false
+          }
+          break
+        case '2':
+          if (this.dateValue.length > 0) {
+            this.queryParams.startTime = this.dateValue[0]
+            this.queryParams.endTime = this.dateValue[1] + 86399000 // 转为23:59:59
+          } else {
+            this.$modal.msgError('日范围不能为空')
+            return false
+          }
+          break
+        case '3':
+          if (this.weekValue1 && this.weekValue2) {
+            let a = moment(this.weekValue1).day(0).format('YYYY-MM-DD') + ' 00:00:00'
+            let b = moment(this.weekValue2).day(6).format('YYYY-MM-DD') + ' 23:59:59'
+            this.queryParams.startTime = new Date(a).getTime()
+            this.queryParams.endTime = new Date(b).getTime()
+          } else {
+            this.$modal.msgError('周范围不能为空')
+            return false
+          }
+          break
+        case '4':// 转为本月最后一天的最后一秒
+          if (this.monthValue.length > 0) {
+            this.queryParams.startTime = this.monthValue[0]
+            this.queryParams.endTime = this.transformTime(this.monthValue[1])
+          } else {
+            this.$modal.msgError('月范围不能为空')
+            return false
+          }
+          break
+        default://本年最后一天
+          if (this.yearValue1 && this.yearValue2) {
+            if (this.yearValue2 < this.yearValue1) {
+              this.$modal.msgError('结束时间不能早于开始时间')
+              return false
+            } else {
+              this.queryParams.startTime = this.yearValue1
+              this.queryParams.endTime = this.transformYear(this.yearValue2)
+            }
+          } else {
+            this.$modal.msgError('年范围不能为空')
+            return false
+          }
+      }
+      this.queryParams.startTime = this.queryParams.startTime + ''
+      this.queryParams.endTime = this.queryParams.endTime + ''
+      this.$emit('submit', this.queryParams)
+    },
+    transformTime(timeStamp) {// 本月最后一天
+      let year = moment(timeStamp).format('YYYY')
+      let month = moment(timeStamp).format('MM')
+      let newData = moment(new Date(year,month,0)).format('YYYY-MM-DD') + ' 23:59:59'
+      let value = new Date(newData).getTime()
+      return value
+    },
+    transformYear(timeStamp) {// 本年最后一天
+      let year = moment(timeStamp).format('YYYY')
+      let newData = year+'-12-31 23:59:59'
+      let value = new Date(newData).getTime()
+      return value
+    }
+  }
+}
+</script>
+<style>
+/* 时间整点 */
+.noneMinute .el-time-spinner__wrapper {
+  width: 100%;
+}
+.noneMinute .el-scrollbar:nth-of-type(2) {
+  display: none;
+}
+</style>

src/views/energy/analysis/contrastAnalysis/index.vue

@@ -0,0 +1,64 @@
+<template>
+  <div class="app-container">
+    <!-- 搜索工作栏 -->
+    <search-area @submit="getList"/>
+    <el-tabs v-model="activeName" @tab-click="switchChart">
+      <el-tab-pane label="柱状图" name="bar">
+        <bar-chart ref="contrastBarChart" :chartData="chartData" />
+      </el-tab-pane>
+      <el-tab-pane label="折线图" name="line">
+        <line-chart ref="contrastLineChart" :chartData="chartData"/>
+      </el-tab-pane>
+    </el-tabs>
+  </div>
+</template>
+<script>
+import { getEnergyTrend } from "@/api/analysis/energyAnalysis"
+import SearchArea from "./components/searchArea"
+import BarChart from "./components/barChart"
+import LineChart from "./components/lineChart"
+// import moment from 'moment'
+export default {
+  name: 'ContrastAnalysis',
+  components: { SearchArea, BarChart, LineChart },
+  data() {
+    return {
+      activeName: 'bar',
+      chartData: []
+    }
+  },
+  mounted() {},
+  methods: {
+    getList(params) {
+      getEnergyTrend({ ...params }).then((res) => {
+        if (res.code === 0) {
+          this.chartData = res.data
+        } else {
+          this.chartData = []
+        }
+      })
+      // getEnergyTrend({
+      //   energyTypeId: "1681183397517406210",
+      //   objId: "1679031282510532610",
+      //   timeDim: "2",
+      //   startTime: "1690732800000",
+      //   endTime: "1690992000000"
+      // }).then((res) => {
+      //   console.log(res)
+      //   this.chartData = res.data
+      // })
+    },
+    switchChart() {
+      if (this.activeName === 'bar') {
+        this.$nextTick((res) => {
+          this.$refs.analysisBarChart.getChart()
+        })
+      } else {
+        this.$nextTick((res) => {
+          this.$refs.analysisLineChart.getChart()
+        })
+      }
+    }
+  }
+}
+</script>

src/views/energy/analysis/qoqAnalysis/components/lineChart.vue

@@ -0,0 +1,109 @@
+<template>
+  <div 
+    id="analysischartLine"
+    style="width: 100%"
+    :style="{ height: chartHeight + 'px' }"
+  ></div>
+</template>
+<script>
+import * as echarts from 'echarts'
+import resize from '@/utils/chartMixins/resize'
+export default {
+  name: "LineChart",
+  mixins: [resize],
+  data() {
+    return {
+      chartDom: '',
+      chart: '',
+      chartHeight: this.tableHeight(350)
+    }
+  },
+  props: {
+    chartData: {
+      type: Array,
+      required: true,
+      default: () => {
+        return []
+      }
+    }
+  },
+  watch: {
+    chartData: function () {
+      this.getChart()
+    }
+  },
+  mounted() {
+    window.addEventListener('resize', () => {
+      this.chartHeight = this.tableHeight(350)
+    })
+  },
+  methods: {
+    getChart() {
+      if (
+        this.chart !== null &&
+        this.chart !== '' &&
+        this.chart !== undefined
+      ) {
+        this.chart.dispose() // 页面多次刷新会出现警告，Dom已经初始化了一个实例，这是销毁实例
+      }
+      this.chartDom = document.getElementById('analysischartLine')
+      this.chart = echarts.init(this.chartDom)
+      if (this.chartData.length === 0) {
+        return false
+      }
+      let arr = this.chartData[0].type // [水，电，煤]
+      let keys = Object.keys(this.chartData[0])
+      let yData = [
+        {
+          name: '本期',
+          type: 'bar',
+          data: []
+        },
+        {
+          name: '上期',
+          type: 'bar',
+          data: []
+        }
+      ]
+      for (let j = 0; j < arr.length; j++) {
+        for (let k = 0; k < keys.length; k++) {
+          if (keys[k].indexOf(arr[j]+'_上期') > -1) {
+            yData[1].data.push(this.chartData[0][keys[k]])
+          }
+          if (keys[k].indexOf(arr[j]+'_能源消耗') > -1) {
+            yData[0].data.push(this.chartData[0][keys[k]])
+          }
+        }
+      }
+      var option = {
+        // title: {
+        //   text: 'World Population'
+        // },
+        tooltip: {
+          trigger: 'axis',
+          axisPointer: {
+            type: 'shadow'
+          }
+        },
+        legend: {},
+        grid: {
+          left: '3%',
+          right: '4%',
+          bottom: '3%',
+          containLabel: true
+        },
+        yAxis: {
+          type: 'value',
+          boundaryGap: [0, 0.01]
+        },
+        xAxis: {
+          type: 'category',
+          data: arr
+        },
+        series: yData
+      }
+      option && this.chart.setOption(option);
+    }
+  }
+}
+</script>

src/views/energy/analysis/qoqAnalysis/components/searchArea.vue

@@ -0,0 +1,181 @@
+<template>
+  <el-form :inline="true" class="demo-form-inline">
+    <el-form-item label="对象选择">
+      <el-cascader
+        v-model="objArr"
+        :options="objList"
+        :props="{ checkStrictly: true, value: 'id', label: 'name' }"
+        popper-class="cascaderParent"
+        clearable></el-cascader>
+    </el-form-item>
+    <el-form-item label="时间维度">
+      <el-select v-model="queryParams.type" placeholder="请选择" style="width: 80px;">
+        <el-option
+          v-for="item in timeType"
+          :key="item.id"
+          :label="item.name"
+          :value="item.id"
+          :clearable="false">
+        </el-option>
+      </el-select>
+    </el-form-item>
+    <el-form-item label="时间">
+      <div v-show="queryParams.type === 1">
+        <el-date-picker
+          v-model="monthValue"
+          type="month"
+          :picker-options="pickerOptions"
+          @change="selectTime"
+          :clearable="false"
+          placeholder="选择月">
+        </el-date-picker>
+      </div>
+      <div v-show="queryParams.type === 2">
+        <el-date-picker
+          v-model="weekValue"
+          type="week"
+          format="yyyy 第 WW 周"
+          :picker-options="pickerOptionsWeek"
+          @change="selectTime"
+          :clearable="false"
+          placeholder="选择周">
+        </el-date-picker>
+      </div>
+      <div v-show="queryParams.type === 3">
+        <el-date-picker
+          v-model="dateValue"
+          type="date"
+          :picker-options="pickerOptions"
+          @change="selectTime"
+          :clearable="false"
+          placeholder="选择日">
+        </el-date-picker>
+      </div>
+    </el-form-item>
+    <el-form-item>
+      <el-button type="primary" @click="search">查询</el-button>
+    </el-form-item>
+    <el-form-item>
+      <span class="separateStyle"></span>
+    </el-form-item>
+    <el-form-item>
+      <el-button type="primary" @click="exportData" plain>导出</el-button>
+    </el-form-item>
+  </el-form>
+</template>
+<script>
+import { getTree } from '@/api/base/factory'
+import moment from 'moment'
+export default {
+  name: 'searchArea',
+  data() {
+    return {
+      // 查询参数
+      queryParams: {
+        type: 1,
+        searchTime: null,
+        objId: null
+      },
+      timeType: [
+        {id: 1, name: '月'},
+        {id: 2, name: '周'},
+        {id: 3, name: '日'}
+      ],
+      monthValue: '',
+      weekValue: '',
+      dateValue: '',
+      objArr: [],
+      objList: [],
+      pickerOptions: {
+        disabledDate(date) {
+          return date.getTime() > Date.now()
+        }
+      },
+      pickerOptionsWeek: {
+        disabledDate(time) {
+          let day = Date.now()
+          let limitTime = moment(day).day(-1)
+          return time.getTime() > new Date(limitTime).getTime()
+        }
+      }
+    }
+  },
+  mounted() {
+    this.getObjTree()
+  },
+  methods: {
+    getObjTree() {
+      getTree().then(res => {
+        this.objList = res.data || []
+      })
+    },
+    selectTime() {
+      switch (this.queryParams.type) {
+        case 1:
+          this.queryParams.searchTime = this.monthValue
+          break;
+        case 2:
+          this.queryParams.searchTime = this.weekValue
+          break;
+        default:
+          this.queryParams.searchTime = this.dateValue
+      }
+    },
+    // 查询
+    search() {
+      if (!this.objArr.length === 0) {
+        this.$modal.msgError('请选择对象')
+        return false
+      } else {
+        this.queryParams.objId = this.objArr[this.objArr.length-1]
+      }
+      if (!this.queryParams.type) {
+        this.$modal.msgError('请选择时间维度')
+        return false
+      }
+      if (!this.queryParams.searchTime) {
+        this.$modal.msgError('请选择时间')
+        return false
+      }
+      switch (this.queryParams.type) {
+        case 1:
+          this.queryParams.searchTime = this.transformTime(this.monthValue)
+          break;
+        case 2:
+          let value = moment(this.weekValue).day(6).format('YYYY-MM-DD') + ' 23:59:59'
+          this.queryParams.searchTime = new Date(value).getTime()
+          break;
+        default:
+           let value2 = moment(this.dateValue).format('YYYY-MM-DD') + ' 23:59:59'
+           this.queryParams.searchTime = new Date(value2).getTime()
+      }
+      this.$emit('submit', this.queryParams)
+    },
+    exportData() {
+      this.$emit('exportD')
+    },
+    transformTime(timeStamp) {// 本月最后一天
+      let year = moment(timeStamp).format('YYYY')
+      let month = moment(timeStamp).format('MM')
+      let newData = moment(new Date(year,month,0)).format('YYYY-MM-DD') + ' 23:59:59'
+      let value = new Date(newData).getTime()
+      return value
+    }
+  }
+}
+</script>
+<style>
+/* 级联选择器 */
+.cascaderParent .el-cascader-panel .el-scrollbar:first-child .el-radio {
+  display: none;
+}
+</style>
+<style scoped>
+.separateStyle {
+  display: inline-block;
+  width: 1px;
+  height: 24px;
+  background: #E8E8E8;
+  vertical-align: middle;
+}
+</style>

src/views/energy/analysis/qoqAnalysis/index.vue

@@ -0,0 +1,109 @@
+<template>
+  <div class="app-container">
+    <!-- 搜索工作栏 -->
+    <search-area @submit="getList" @exportD="exportData"/>
+    <!-- 表格 -->
+    <base-table
+      :table-props="tableProps"
+      :table-data="list"
+      class="qoq-out-table"
+    />
+    <div style='width: 100%;height: 300px;padding-top: 30px;'>
+      <line-chart ref="analysisLineChart" :chartData="chartData"/>
+    </div>
+  </div>
+</template>
+<script>
+import { getQoq } from "@/api/analysis/energyAnalysis"
+import SearchArea from "./components/searchArea"
+import LineChart from "./components/lineChart"
+import FileSaver from "file-saver"
+import * as XLSX from 'xlsx/xlsx.mjs'
+export default {
+  name: 'QoqAnalysis',
+  components: { SearchArea, LineChart },
+  data() {
+    return {
+      chartData: [],
+      tableProps: [],
+      list: []
+    }
+  },
+  methods: {
+    getList(params) {
+      getQoq({ ...params }).then((res) => {
+        if (res.code === 0 && res.data) {
+          this.getTableList(res.data)
+        } else {
+          this.chartData = []
+          this.list = []
+        }
+      })
+    },
+    getTableList(arr) {
+      let data = arr.data
+      let nameData = arr.nameData
+      let tempX = []
+      data[0].data.map((item) => {
+        let obj = {}
+        obj.prop = item.dynamicName
+        obj.label = item.dynamicName
+        obj.id = item.id
+        obj.children = []
+        tempX.push(obj)
+      })
+      for (let i = 0; i < nameData.length; i++) {
+        for (let j = 0; j < tempX.length; j++) {
+          if (tempX[j].id === nameData[i].parentId) {
+            let obj = {}
+            obj.prop = tempX[j].prop + '_' + nameData[i].name
+            obj.label = nameData[i].name
+            tempX[j].children.push(obj)
+          }
+        }
+      }
+      this.tableProps = [{prop: 'time',label: '时间'}].concat(tempX)
+      // 数据
+      this.list = []
+      for (let k = 0; k < data.length; k++) {
+        let obj = {}
+        obj.time = data[k].time
+        let arr1 = data[k].data
+        obj.type = []
+        for (let q = 0; q < arr1.length; q++) {
+          let name = arr1[q].dynamicName
+          obj.type.push(name)
+          let arr2 = arr1[q].children
+          for (let p = 0; p < arr2.length; p++) {
+            let prop = name + '_' + arr2[p].dynamicName
+            obj[prop] = arr2[p].dynamicValue
+          }
+        }
+        this.list.push(obj)
+      }
+      this.chartData = this.list
+    },
+    exportData() {
+      if (this.list.length > 0) {
+        var wb = XLSX.utils.table_to_book(document.querySelector(".qoq-out-table"))
+        var wbout = XLSX.write(wb, {
+            bookType: "xlsx",
+            bookSST: true,
+            type: "array"
+        })
+        try {
+            FileSaver.saveAs(
+            new Blob([wbout], { type: "application/octet-stream" }),
+            "环比分析.xlsx"
+            )
+        } catch (e) {
+            if (typeof console !== "undefined") console.log(e, wbout);
+        }
+        return wbout
+      } else {
+        this.$modal.msgWarning("暂无数据导出")
+      }
+    }
+  }
+}
+</script>

src/views/energy/analysis/trendAnalysis/components/barChart.vue

@@ -0,0 +1,77 @@
+<template>
+  <div 
+    id="analysischartBar"
+    style="width: 100%"
+    :style="{ height: chartHeight + 'px' }"
+  ></div>
+</template>
+<script>
+import * as echarts from 'echarts'
+import resize from '@/utils/chartMixins/resize'
+export default {
+  name: "BarChart",
+  mixins: [resize],
+  data() {
+    return {
+      chartDom: '',
+      chart: '',
+      chartHeight: this.tableHeight(214) - 70
+    }
+  },
+  props: {
+    chartData: {
+      type: Array,
+      required: true,
+      default: () => {
+        return []
+      }
+    }
+  },
+  watch: {
+    chartData: function () {
+      this.getChart()
+    }
+  },
+  mounted() {
+    window.addEventListener('resize', () => {
+      this.chartHeight = this.tableHeight(214) - 70
+    })
+  },
+  methods: {
+    getChart() {
+      if (
+        this.chart !== null &&
+        this.chart !== '' &&
+        this.chart !== undefined
+      ) {
+        this.chart.dispose() // 页面多次刷新会出现警告，Dom已经初始化了一个实例，这是销毁实例
+      }
+      this.chartDom = document.getElementById('analysischartBar')
+      this.chart = echarts.init(this.chartDom)
+      let xData = []
+      let yData = []
+      for (let i = 0; i < this.chartData.length; i++) {
+        xData.push(this.chartData[i].time)
+        yData.push(this.chartData[i].useNum)
+      }
+      var option = {
+        xAxis: {
+          type: 'category',
+          data: xData
+        },
+        yAxis: {
+          type: 'value'
+        },
+        series: [
+          {
+            data: yData,
+            type: 'bar'
+          }
+        ]
+      };
+
+      option && this.chart.setOption(option);
+    }
+  }
+}
+</script>

src/views/energy/analysis/trendAnalysis/components/lineChart.vue

@@ -0,0 +1,78 @@
+<template>
+  <div 
+    id="analysischartLine"
+    style="width: 100%"
+    :style="{ height: chartHeight + 'px' }"
+  ></div>
+</template>
+<script>
+import * as echarts from 'echarts'
+import resize from '@/utils/chartMixins/resize'
+export default {
+  name: "LineChart",
+  mixins: [resize],
+  data() {
+    return {
+      chartDom: '',
+      chart: '',
+      chartHeight: this.tableHeight(214) - 70
+    }
+  },
+  props: {
+    chartData: {
+      type: Array,
+      required: true,
+      default: () => {
+        return []
+      }
+    }
+  },
+  watch: {
+    chartData: function () {
+      this.getChart()
+    }
+  },
+  mounted() {
+    window.addEventListener('resize', () => {
+      this.chartHeight = this.tableHeight(214) - 70
+    })
+  },
+  methods: {
+    getChart() {
+      if (
+        this.chart !== null &&
+        this.chart !== '' &&
+        this.chart !== undefined
+      ) {
+        this.chart.dispose() // 页面多次刷新会出现警告，Dom已经初始化了一个实例，这是销毁实例
+      }
+      this.chartDom = document.getElementById('analysischartLine')
+      this.chart = echarts.init(this.chartDom)
+      let xData = []
+      let yData = []
+      for (let i = 0; i < this.chartData.length; i++) {
+        xData.push(this.chartData[i].time)
+        yData.push(this.chartData[i].useNum)
+      }
+
+      var option = {
+        xAxis: {
+          type: 'category',
+          data: xData
+        },
+        yAxis: {
+          type: 'value'
+        },
+        series: [
+          {
+            data: yData,
+            type: 'line'
+          }
+        ]
+      };
+
+      option && this.chart.setOption(option);
+    }
+  }
+}
+</script>

src/views/energy/analysis/trendAnalysis/components/searchArea.vue

@@ -0,0 +1,364 @@
+<template>
+  <el-form :inline="true" class="demo-form-inline">
+    <el-form-item label="能源类型">
+      <el-select v-model="queryParams.energyTypeId" placeholder="请选择" style="width: 100px;">
+        <el-option
+          v-for="item in energyTypeList"
+          :key="item.id"
+          :label="item.name"
+          :value="item.id">
+        </el-option>
+      </el-select>
+    </el-form-item>
+    <el-form-item label="对象选择">
+      <el-cascader
+        v-model="objArr"
+        :options="objList"
+        :props="{ checkStrictly: true, value: 'id', label: 'name' }"
+        popper-class="cascaderParent"
+        clearable></el-cascader>
+    </el-form-item>
+    <el-form-item label="时间维度">
+      <el-select v-model="queryParams.timeDim" placeholder="请选择" style="width: 80px;">
+        <el-option
+          v-for="item in getDictDatas(this.DICT_TYPE.TIME_DIM)"
+          :key="item.value"
+          :label="item.label"
+          :value="item.value">
+        </el-option>
+      </el-select>
+    </el-form-item>
+    <el-form-item label="时间范围">
+      <div v-show="queryParams.timeDim === '1'">
+        <el-date-picker
+          v-model="timeValue"
+          type="datetimerange"
+          range-separator="至"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+          format="yyyy-MM-dd HH:mm"
+          value-format="timestamp"
+          :picker-options="pickerOptions"
+          popper-class="noneMinute"
+          @change="timeSelect"
+          >
+        </el-date-picker>
+      </div>
+      <div v-show="queryParams.timeDim === '2'">
+        <el-date-picker
+          v-model="dateValue"
+          type="daterange"
+          range-separator="至"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+          value-format="timestamp"
+          :picker-options="pickerOptions"
+          @change="timeSelect"
+          >
+        </el-date-picker>
+      </div>
+      <div v-show="queryParams.timeDim === '3'">
+        <el-date-picker
+          v-model="weekValue1"
+          type="week"
+          format="yyyy 第 WW 周"
+          style='width:150px;'
+          :picker-options="pickerOptionsWeek"
+          @change="startWeek"
+          placeholder="选择周">
+        </el-date-picker>-
+        <el-date-picker
+          v-model="weekValue2"
+          type="week"
+          format="yyyy 第 WW 周"
+          :picker-options="pickerOptionsWeek"
+          style='width:150px;'
+          @change="endWeek"
+          placeholder="选择周">
+        </el-date-picker>
+      </div>
+      <div v-show="queryParams.timeDim === '4'">
+        <el-date-picker
+          v-model="monthValue"
+          type="monthrange"
+          range-separator="至"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+          value-format="timestamp"
+          :picker-options="pickerOptions"
+          @change="timeSelect"
+          >
+        </el-date-picker>
+      </div>
+      <div v-show="queryParams.timeDim === '5'">
+        <el-date-picker
+          style='width:100px;'
+          v-model="yearValue1"
+          type="year"
+          :picker-options="pickerOptions"
+          value-format="timestamp"
+          placeholder="选择年"
+          @change="startYear"
+        >
+        </el-date-picker>-
+        <el-date-picker
+          style='width:100px;'
+          v-model="yearValue2"
+          type="year"
+          :picker-options="pickerOptions"
+          value-format="timestamp"
+          placeholder="选择年"
+          @change="endYear"
+        >
+        </el-date-picker>
+      </div>
+    </el-form-item>
+    <el-form-item>
+      <el-button type="primary" @click="search">查询</el-button>
+    </el-form-item>
+  </el-form>
+</template>
+<script>
+import { getEnergyTypeListAll } from "@/api/base/energyType"
+import { getTree } from '@/api/base/factory'
+import moment from 'moment'
+export default {
+  name: 'searchArea',
+  data() {
+    return {
+      // 查询参数
+      queryParams: {
+        energyTypeId: null,
+        objId: null,
+        timeDim: null,
+        startTime: null,
+        endTime: null
+      },
+      objArr: [],
+      timeValue: [],// 最大7天只能整点
+      dateValue: [],// 最大30天
+      weekValue1: null,//最多24周
+      weekValue2: null,
+      monthValue: [],//最多24月
+      yearValue1: null,//最多10年
+      yearValue2: null,
+      energyTypeList: [],
+      objList: [],
+      pickerOptions: {
+        disabledDate(date) {
+          return date.getTime() > Date.now()
+        }
+      },
+      pickerOptionsWeek: {
+        disabledDate(time) {
+          let day = Date.now()
+          let limitTime = moment(day).day(-1)
+          return time.getTime() > new Date(limitTime).getTime()
+        }
+      }
+    }
+  },
+  mounted() {
+    this.getTypeList()
+    this.getObjTree()
+    this.queryParams.timeDim = this.getDictDatas(this.DICT_TYPE.TIME_DIM)[0].value // 默认时
+  },
+  methods: {
+    getTypeList() {
+      getEnergyTypeListAll().then((res) => {
+        this.energyTypeList = res.data || []
+      })
+    },
+    getObjTree() {
+      getTree().then(res => {
+        this.objList = res.data || []
+      })
+    },
+    // 范围选择器
+    timeSelect() {
+      switch (this.queryParams.timeDim) {
+        case '1':
+          if (this.timeValue[1] - this.timeValue[0] > 7*24*3600000) {
+            this.$modal.msgError('最大时间范围为7天，请重新选择')
+            this.timeValue = []
+          }
+          break
+        case '2':
+          if (this.dateValue[1] - this.dateValue[0] > 29*24*3600000) {
+            this.$modal.msgError('最大时间范围为30天，请重新选择') // 自动选择默认是0:00:00要求是23:59:59
+            this.dateValue = []
+          }
+          break
+        case '4':
+          if (this.monthValue[1] - this.monthValue[0] > 729*24*3600000) {
+            this.$modal.msgError('最大时间范围为24个月，请重新选择')// 同理上面
+            this.monthValue = []
+          }
+          break
+          default:
+      }
+    },
+    // 年选择器
+    startYear() {
+      if (this.yearValue2 && this.yearValue2 < this.yearValue1) {
+        this.$modal.msgError('开始时间不能晚于结束时间，请重新选择')
+        this.yearValue1 = null
+        return false
+      }
+      if (this.yearValue1 && this.yearValue2) {
+        if (this.yearValue2 - this.yearValue1 > 10*365*24*3600000) {
+          this.$modal.msgError('最大时间范围为10年，请重新选择')
+          this.yearValue1 = null
+          return false
+        }
+      }
+    },
+    endYear() {
+      if (this.yearValue2 && this.yearValue2 < this.yearValue1) {
+        this.$modal.msgError('结束时间不能早于开始时间，请重新选择')
+        this.yearValue2 = null
+        return false
+      }
+      if (this.yearValue1 && this.yearValue2) {
+        if (this.yearValue2 - this.yearValue1 > 10*365*24*3600000) {
+          this.$modal.msgError('最大时间范围为10年，请重新选择')
+          this.yearValue2 = null
+          return false
+        }
+      }
+    },
+    // 周选择器
+    startWeek() {
+      if (this.weekValue1 && this.weekValue2) {
+        let a = new Date(this.weekValue1).getTime()
+        let b = new Date(this.weekValue2).getTime()
+        if (a > b) {
+          this.$modal.msgError('开始时间不能晚于结束时间，请重新选择')
+          this.weekValue1 = null
+          return false
+        }
+        if (b - a > 167*24*3600000) {
+          this.$modal.msgError('最大时间范围为24周，请重新选择')
+          this.weekValue1 = null
+          return false
+        }
+      }
+    },
+    endWeek() {
+      if (this.weekValue1 && this.weekValue2) {
+        let a = new Date(this.weekValue1).getTime()
+        let b = new Date(this.weekValue2).getTime()
+        if (a > b) {
+          this.$modal.msgError('结束时间不能早于开始时间，请重新选择')
+          this.weekValue2 = null
+          return false
+        }
+        if (b - a > 167*24*3600000) {
+          this.$modal.msgError('最大时间范围为24周，请重新选择')
+          this.weekValue2 = null
+          return false
+        }
+      }
+    },
+    // 查询
+    search() {
+      if (!this.queryParams.energyTypeId) {
+        this.$modal.msgError('请选择能源类型')
+        return false
+      }
+      if (!this.objArr.length === 0) {
+        this.$modal.msgError('请选择对象')
+        return false
+      } else {
+        this.queryParams.objId = this.objArr[this.objArr.length-1]
+      }
+      if (!this.queryParams.timeDim) {
+        this.$modal.msgError('请选择时间维度')
+        return false
+      }
+      switch (this.queryParams.timeDim) {
+        case '1':
+          if (this.timeValue.length > 0) {
+            this.queryParams.startTime = this.timeValue[0]
+            this.queryParams.endTime = this.timeValue[1] // 不用转
+          } else {
+            this.$modal.msgError('时间范围不能为空')
+            return false
+          }
+          break
+        case '2':
+          if (this.dateValue.length > 0) {
+            this.queryParams.startTime = this.dateValue[0]
+            this.queryParams.endTime = this.dateValue[1] + 86399000 // 转为23:59:59
+          } else {
+            this.$modal.msgError('日范围不能为空')
+            return false
+          }
+          break
+        case '3':
+          if (this.weekValue1 && this.weekValue2) {
+            let a = moment(this.weekValue1).day(0).format('YYYY-MM-DD') + ' 00:00:00'
+            let b = moment(this.weekValue2).day(6).format('YYYY-MM-DD') + ' 23:59:59'
+            this.queryParams.startTime = new Date(a).getTime()
+            this.queryParams.endTime = new Date(b).getTime()
+          } else {
+            this.$modal.msgError('周范围不能为空')
+            return false
+          }
+          break
+        case '4':// 转为本月最后一天的最后一秒
+          if (this.monthValue.length > 0) {
+            this.queryParams.startTime = this.monthValue[0]
+            this.queryParams.endTime = this.transformTime(this.monthValue[1])
+          } else {
+            this.$modal.msgError('月范围不能为空')
+            return false
+          }
+          break
+        default://本年最后一天
+          if (this.yearValue1 && this.yearValue2) {
+            if (this.yearValue2 < this.yearValue1) {
+              this.$modal.msgError('结束时间不能早于开始时间')
+              return false
+            } else {
+              this.queryParams.startTime = this.yearValue1
+              this.queryParams.endTime = this.transformYear(this.yearValue2)
+            }
+          } else {
+            this.$modal.msgError('年范围不能为空')
+            return false
+          }
+      }
+      this.queryParams.startTime = this.queryParams.startTime + ''
+      this.queryParams.endTime = this.queryParams.endTime + ''
+      this.$emit('submit', this.queryParams)
+    },
+    transformTime(timeStamp) {// 本月最后一天
+      let year = moment(timeStamp).format('YYYY')
+      let month = moment(timeStamp).format('MM')
+      let newData = moment(new Date(year,month,0)).format('YYYY-MM-DD') + ' 23:59:59'
+      let value = new Date(newData).getTime()
+      return value
+    },
+    transformYear(timeStamp) {// 本年最后一天
+      let year = moment(timeStamp).format('YYYY')
+      let newData = year+'-12-31 23:59:59'
+      let value = new Date(newData).getTime()
+      return value
+    }
+  }
+}
+</script>
+<style>
+/* 级联选择器 */
+.cascaderParent .el-cascader-panel .el-scrollbar:first-child .el-radio {
+  display: none;
+}
+/* 时间整点 */
+.noneMinute .el-time-spinner__wrapper {
+  width: 100%;
+}
+.noneMinute .el-scrollbar:nth-of-type(2) {
+  display: none;
+}
+</style>

src/views/energy/analysis/trendAnalysis/index.vue

@@ -0,0 +1,64 @@
+<template>
+  <div class="app-container">
+    <!-- 搜索工作栏 -->
+    <search-area @submit="getList"/>
+    <el-tabs v-model="activeName" @tab-click="switchChart">
+      <el-tab-pane label="柱状图" name="bar">
+        <bar-chart ref="analysisBarChart" :chartData="chartData" />
+      </el-tab-pane>
+      <el-tab-pane label="折线图" name="line">
+        <line-chart ref="analysisLineChart" :chartData="chartData"/>
+      </el-tab-pane>
+    </el-tabs>
+  </div>
+</template>
+<script>
+import { getEnergyTrend } from "@/api/analysis/energyAnalysis"
+import SearchArea from "./components/searchArea"
+import BarChart from "./components/barChart"
+import LineChart from "./components/lineChart"
+// import moment from 'moment'
+export default {
+  name: 'TrendAnalysis',
+  components: { SearchArea, BarChart, LineChart },
+  data() {
+    return {
+      activeName: 'bar',
+      chartData: []
+    }
+  },
+  mounted() {},
+  methods: {
+    getList(params) {
+      getEnergyTrend({ ...params }).then((res) => {
+        if (res.code === 0) {
+          this.chartData = res.data
+        } else {
+          this.chartData = []
+        }
+      })
+      // getEnergyTrend({
+      //   energyTypeId: "1681183397517406210",
+      //   objId: "1679031282510532610",
+      //   timeDim: "2",
+      //   startTime: "1690732800000",
+      //   endTime: "1690992000000"
+      // }).then((res) => {
+      //   console.log(res)
+      //   this.chartData = res.data
+      // })
+    },
+    switchChart() {
+      if (this.activeName === 'bar') {
+        this.$nextTick((res) => {
+          this.$refs.analysisBarChart.getChart()
+        })
+      } else {
+        this.$nextTick((res) => {
+          this.$refs.analysisLineChart.getChart()
+        })
+      }
+    }
+  }
+}
+</script>

src/views/energy/analysis/yoyAnalysis/components/lineChart.vue

@@ -0,0 +1,104 @@
+<template>
+  <div 
+    id="analysischartLine"
+    style="width: 100%;height: 100%;"
+  ></div>
+</template>
+<script>
+import * as echarts from 'echarts'
+import resize from '@/utils/chartMixins/resize'
+export default {
+  name: "LineChart",
+  mixins: [resize],
+  data() {
+    return {
+      chartDom: '',
+      chart: '',
+      chartHeight: this.tableHeight(214) - 70
+    }
+  },
+  props: {
+    chartData: {
+      type: Array,
+      required: true,
+      default: () => {
+        return []
+      }
+    }
+  },
+  watch: {
+    chartData: function () {
+      this.getChart()
+    }
+  },
+  mounted() {
+    window.addEventListener('resize', () => {
+      this.chartHeight = this.tableHeight(214) - 70
+    })
+  },
+  methods: {
+    getChart() {
+      if (
+        this.chart !== null &&
+        this.chart !== '' &&
+        this.chart !== undefined
+      ) {
+        this.chart.dispose() // 页面多次刷新会出现警告，Dom已经初始化了一个实例，这是销毁实例
+      }
+      this.chartDom = document.getElementById('analysischartLine')
+      this.chart = echarts.init(this.chartDom)
+      if (this.chartData.length === 0) {
+        return false
+      }
+      let xData = []
+      let arr = this.chartData[0].type
+      let keys = Object.keys(this.chartData[0])
+      let yData = []
+      for (let j = 0; j < arr.length; j++) {
+        for (let k = 0; k < keys.length; k++) {
+          if (keys[k].indexOf(arr[j]+'_上年同期') > -1 || keys[k].indexOf(arr[j]+'_能源消耗') > -1) {
+            let obj = {
+              name: '',
+              type: 'line',
+              stack: 'Total',
+              data: []
+            }
+            obj.name = keys[k]
+            yData.push(obj)
+          }
+        }
+      }
+      for (let i = 0; i < this.chartData.length; i++) {
+        xData.push(this.chartData[i].time)
+        for (let p = 0; p < yData.length; p++) {
+          yData[p].data.push(this.chartData[i][ yData[p].name])
+        }
+      }
+      var option = {
+        legend: {
+          data: keys
+        },
+        tooltip: {
+          trigger: 'axis'
+        },
+        grid: {
+          left: '3%',
+          right: '4%',
+          bottom: '3%',
+          containLabel: true
+        },
+        xAxis: {
+          type: 'category',
+          data: xData
+        },
+        yAxis: {
+          type: 'value'
+        },
+        series: yData
+      };
+
+      option && this.chart.setOption(option);
+    }
+  }
+}
+</script>

src/views/energy/analysis/yoyAnalysis/components/searchArea.vue

@@ -0,0 +1,156 @@
+<template>
+  <el-form :inline="true" class="demo-form-inline">
+    <el-form-item label="对象选择">
+      <el-cascader
+        v-model="objArr"
+        :options="objList"
+        :props="{ checkStrictly: true, value: 'id', label: 'name' }"
+        popper-class="cascaderParent"
+        clearable></el-cascader>
+    </el-form-item>
+    <el-form-item label="时间维度">
+      <el-select v-model="queryParams.type" placeholder="请选择" style="width: 80px;">
+        <el-option
+          v-for="item in timeType"
+          :key="item.id"
+          :label="item.name"
+          :value="item.id"
+          :clearable="false">
+        </el-option>
+      </el-select>
+    </el-form-item>
+    <el-form-item label="时间">
+      <div v-show="queryParams.type === 1 || queryParams.type === 2">
+        <el-date-picker
+          v-model="yearValue"
+          type="year"
+          :picker-options="pickerOptions"
+          @change="selectTime"
+          :clearable="false"
+          placeholder="选择年">
+        </el-date-picker>
+      </div>
+      <div v-show="queryParams.type === 3">
+        <el-date-picker
+          v-model="yearMonth"
+          type="month"
+          :picker-options="pickerOptions"
+          @change="selectTime"
+          :clearable="false"
+          placeholder="选择月">
+        </el-date-picker>
+      </div>
+    </el-form-item>
+    <el-form-item>
+      <el-button type="primary" @click="search">查询</el-button>
+    </el-form-item>
+    <el-form-item>
+      <span class="separateStyle"></span>
+    </el-form-item>
+    <el-form-item>
+      <el-button type="primary" @click="exportData" plain>导出</el-button>
+    </el-form-item>
+  </el-form>
+</template>
+<script>
+import { getTree } from '@/api/base/factory'
+import moment from 'moment'
+export default {
+  name: 'searchArea',
+  data() {
+    return {
+      // 查询参数
+      queryParams: {
+        type: 1, // 1季度2月3日
+        searchTime: null,
+        objId: null
+      },
+      timeType: [
+        {id: 1, name: '季度'},
+        {id: 2, name: '月'},
+        {id: 3, name: '日'}
+      ],
+      yearValue: '',
+      yearMonth: '',
+      objArr: [],
+      objList: [],
+      pickerOptions: {
+        disabledDate(date) {
+          return date.getTime() > Date.now()
+        }
+      }
+    }
+  },
+  mounted() {
+    this.getObjTree()
+  },
+  methods: {
+    getObjTree() {
+      getTree().then(res => {
+        this.objList = res.data || []
+      })
+    },
+    selectTime() {
+      if (this.queryParams.type === 3) {
+        this.queryParams.searchTime = this.yearMonth
+      } else {
+        this.queryParams.searchTime = this.yearValue
+      }
+    },
+    // 查询
+    search() {
+      if (!this.objArr.length === 0) {
+        this.$modal.msgError('请选择对象')
+        return false
+      } else {
+        this.queryParams.objId = this.objArr[this.objArr.length-1]
+      }
+      if (!this.queryParams.type) {
+        this.$modal.msgError('请选择时间维度')
+        return false
+      }
+      if (!this.queryParams.searchTime) {
+        this.$modal.msgError('请选择时间')
+        return false
+      }
+      if (this.queryParams.type === 3) {
+        this.queryParams.searchTime = this.transformTime(this.yearMonth) + ''
+      } else {
+        this.queryParams.searchTime = this.transformYear(this.yearValue) + ''
+      }
+      this.$emit('submit', this.queryParams)
+    },
+    exportData() {
+      this.$emit('exportD')
+    },
+    transformTime(timeStamp) {// 本月最后一天
+      let year = moment(timeStamp).format('YYYY')
+      let month = moment(timeStamp).format('MM')
+      let newData = moment(new Date(year,month,0)).format('YYYY-MM-DD') + ' 23:59:59'
+      let value = new Date(newData).getTime()
+      return value
+    },
+    transformYear(timeStamp) {// 本年最后一天
+      let year = moment(timeStamp).format('YYYY')
+      let newData = year+'-12-31 23:59:59'
+      let value = new Date(newData).getTime()
+      return value
+    }
+  }
+}
+</script>
+<style>
+/* 级联选择器 */
+.cascaderParent .el-cascader-panel .el-scrollbar:first-child .el-radio {
+  display: none;
+}
+</style>
+<style scoped>
+.separateStyle {
+  display: inline-block;
+  width: 1px;
+  height: 24px;
+  background: #E8E8E8;
+  vertical-align: middle;
+}
+</style>

src/views/energy/analysis/yoyAnalysis/index.vue

@@ -0,0 +1,116 @@
+<template>
+  <div class="app-container">
+    <!-- 搜索工作栏 -->
+    <search-area @submit="getList" @exportD="exportData"/>
+    <div style='width: 100%;height: 300px;'>
+      <line-chart ref="analysisLineChart" :chartData="chartData"/>
+    </div>
+    <!-- 表格 -->
+    <base-table
+      :table-props="tableProps"
+      :table-data="list"
+      :max-height="tableH"
+      class="yoy-out-table"
+    />
+  </div>
+</template>
+<script>
+import { getYoy } from "@/api/analysis/energyAnalysis"
+import SearchArea from "./components/searchArea"
+import LineChart from "./components/lineChart"
+import FileSaver from "file-saver"
+import * as XLSX from 'xlsx/xlsx.mjs'
+export default {
+  name: 'YoyAnalysis',
+  components: { SearchArea, LineChart },
+  data() {
+    return {
+      chartData: [],
+      tableProps: [],
+      list: [],
+      tableH: this.tableHeight(500)
+    }
+  },
+  mounted() {
+    window.addEventListener('resize', () => {
+      this.tableH = this.tableHeight(500)
+    })
+  },
+  methods: {
+    getList(params) {
+      getYoy({ ...params }).then((res) => {
+        if (res.code === 0 && res.data) {
+          this.getTableList(res.data)
+        } else {
+          this.chartData = []
+          this.list = []
+        }
+      })
+    },
+    getTableList(arr) {
+      let data = arr.data
+      let nameData = arr.nameData
+      let tempX = []
+      data[0].data.map((item) => {
+        let obj = {}
+        obj.prop = item.dynamicName
+        obj.label = item.dynamicName
+        obj.id = item.id
+        obj.children = []
+        tempX.push(obj)
+      })
+      for (let i = 0; i < nameData.length; i++) {
+        for (let j = 0; j < tempX.length; j++) {
+          if (tempX[j].id === nameData[i].parentId) {
+            let obj = {}
+            obj.prop = tempX[j].prop + '_' + nameData[i].name
+            obj.label = nameData[i].name
+            tempX[j].children.push(obj)
+          }
+        }
+      }
+      this.tableProps = [{prop: 'time',label: '时间'}].concat(tempX)
+      // 数据
+      this.list = []
+      for (let k = 0; k < data.length; k++) {
+        let obj = {}
+        obj.time = data[k].time
+        let arr1 = data[k].data
+        obj.type = []
+        for (let q = 0; q < arr1.length; q++) {
+          let name = arr1[q].dynamicName
+          obj.type.push(name)
+          let arr2 = arr1[q].children
+          for (let p = 0; p < arr2.length; p++) {
+            let prop = name + '_' + arr2[p].dynamicName
+            obj[prop] = arr2[p].dynamicValue
+          }
+        }
+        this.list.push(obj)
+      }
+      this.chartData = this.list
+    },
+    exportData() {
+      if (this.list.length > 0) {
+        var wb = XLSX.utils.table_to_book(document.querySelector(".yoy-out-table"))
+        var wbout = XLSX.write(wb, {
+            bookType: "xlsx",
+            bookSST: true,
+            type: "array"
+        })
+        try {
+            FileSaver.saveAs(
+            new Blob([wbout], { type: "application/octet-stream" }),
+            "同比分析.xlsx"
+            )
+        } catch (e) {
+            if (typeof console !== "undefined") console.log(e, wbout);
+        }
+        return wbout
+      } else {
+        this.$modal.msgWarning("暂无数据导出")
+      }
+    }
+  }
+}
+</script>

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

@@ -50,7 +50,7 @@ import { getEnergyPlcConnectPage, deleteEnergyPlcConnect } from "@/api/base/ener
 // import { publicFormatter } from '@/utils/dict'
 import { getTree } from '@/api/base/factory'
 import { getEnergyTypeListAll } from '@/api/base/energyType'
-import EnergyPlcConnectAdd from './components/energyPlcConnectAdd.vue'
+import EnergyPlcConnectAdd from './components/energyPlcConnectAdd'
 import EnergyPlcParam from './components/energyPlcParam'
 const tableProps = [
   {
@@ -61,6 +61,10 @@ const tableProps = [
     prop: 'objCode',
     label: '对象编码'
   },
+  {
+    prop: 'remark',
+    label: '对象备注'
+  },
   {
     prop: 'plcTableName', 
     label: '关联表名'
@@ -76,10 +80,6 @@ const tableProps = [
   {
     prop: 'varNum',
     label: '绑定参数数量'
-  },
-  {
-    prop: 'remark',
-    label: '备注'
   }
 ]
 export default {

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

@@ -137,6 +137,7 @@ export default {
           this.$modal.confirm('是否确认导出').then(() => {
               return exportEnergyQuantityRealtimeExcel({...this.queryParams});
             }).then(response => {
+              console.log(response)
               this.$download.excel(response, '能源抄表.xls');
             }).catch(() => {})
       }

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

@@ -27,12 +27,12 @@
       </el-select>
     </el-form-item>
     <el-form-item label="监控详细参数" prop="plcParamId" v-if="form.type === 2">
-      <el-select v-model="form.plcParamId" placeholder="请选择" style="width: 100%;">
+      <el-select v-model="form.plcParamId" placeholder="请选择" style="width: 100%;" @change="selectDetail">
         <el-option
-          v-for="item in getDictDatas(DICT_TYPE.ENERGY_UNIT)"
+          v-for="item in detailList"
-          :key="item.value"
+          :key="item.id"
-          :label="item.label"
+          :label="item.name"
-          :value="item.value">
+          :value="item.id">
         </el-option>
       </el-select>
     </el-form-item>
@@ -52,7 +52,7 @@
   </el-form>
 </template>
 <script>
-import { getEnergyLimit, updateEnergyLimit, createEnergyLimit } from '@/api/monitoring/energyLimit'
+import { getEnergyLimit, updateEnergyLimit, createEnergyLimit, getEnergyParamList } from '@/api/monitoring/energyLimit'
 export default {
   name: 'energyLimitAdd',
   props: {
@@ -73,6 +73,8 @@ export default {
       form: {
         id: '',
         objectId: '',
+        objectType: '',
+        energyTypeId: '',
         type: '',
         plcParamId: '',
         limitType: '',
@@ -84,7 +86,8 @@ export default {
         objectId: [{ required: true, message: '对象不能为空', trigger: 'change' }],
         energyTypeId: [{ required: true, message: '能源类型不能为空', trigger: 'change' }],
         type: [{ required: true, message: '监控模式不能为空', trigger: 'change' }]
-      }
+      },
+      detailList: []
     }
   },
   methods: {
@@ -95,10 +98,12 @@ export default {
         getEnergyLimit( id ).then((res) => {
           if (res.code === 0) {
             this.form = res.data
+            this.form.plcParamId = res.data.plcParamId || ''
             this.form.limitType = this.form.limitType + ''
-            console.log(this.objList)
             this.objIds = this.changeDetSelect(this.form.objectId, this.objList)
-            console.log(this.objIds)
+            if (this.form.type === 2) {
+              this.getDetailList()
+            }
           }
         })
       } else {
@@ -106,8 +111,25 @@ export default {
         this.form.id = ''
       }
     },
-    typeChange() {
+    // 监控详细参数
+    getDetailList() {
+      getEnergyParamList({
+        objId: this.form.objectId,
+        energyTypeId: this.form.energyTypeId
+      }).then((res) => {
+        if (res.code === 0) {
+          this.detailList = res.data
+        } else {
+          this.detailList = []
+        }
+      })
+    },
+    typeChange(val) {
+      console.log(this.form)
       this.form.plcParamId = ''
+      if (val === 2) {
+        this.getDetailList()
+      }
     },
     // 递归处理分类回显问题
     changeDetSelect(key, treeData) {
@@ -137,9 +159,16 @@ export default {
       this.form.objectId = val[val.length-1]
       this.form.objectType = val.length-1
     },
+    selectDetail() {
+      this.$forceUpdate()
+    },
     submitForm() {
       this.$refs['form'].validate((valid) => {
         if (valid) {
+          if (this.form.type === 2 && !this.form.plcParamId) {
+            this.$modal.msgError("监控模式为详细时，详细参数为必填");
+            return false
+          }
           // this.form.limitType = Number(this.form.limitType)
           if (this.isEdit) {
             // 编辑
@@ -164,6 +193,8 @@ export default {
     },
     formClear() {
       this.$refs.form.resetFields()
+      this.objIds = ''
+      this.detailList = []
       this.isEdit = false
     }
   }

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

@@ -231,7 +231,7 @@ export default {
     },
     /** 删除按钮操作 */
     handleDelete(row) {
-      this.$modal.confirm('是否确认删除监控参数为"' + row.plcParamName + '"的数据项?').then(function() {
+      this.$modal.confirm('是否确认删除监控对象为"' + row.objName + '"的数据项?').then(function() {
           return deleteEnergyLimit(row.id);
         }).then(() => {
           this.queryParams.pageNo = 1;

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

@@ -25,11 +25,10 @@
 </template>
 
 <script>
-import { energyReportPageAuto, energyReportPageExportAuto } from "@/api/monitoring/energyReport";
+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'
+import { parseTime } from '@/utils/ruoyi'
 const tableProps = [
   {
     prop: 'statisticType',
@@ -70,7 +69,7 @@ const tableProps = [
   }
 ]
 export default {
-  name: "EnergyReportSearch",
+  name: "EnergyLimit",
   data() {
     return {
       formConfig: [
@@ -78,7 +77,8 @@ export default {
           type: 'select',
           label: '能源类型',
           selectOptions: [],
-          param: 'energyTypeId'
+          param: 'energyTypeId',
+          filterable: true
         },
         {
           type: 'select',
@@ -93,7 +93,7 @@ export default {
           label: '时间',
           dateType: 'datetimerange',
           format: 'yyyy-MM-dd HH:mm:ss',
-          valueFormat: "yyyy-MM-ddTHH:mm:ss",
+          valueFormat: "timestamp",
           rangeSeparator: '-',
           startPlaceholder: '开始时间',
           endPlaceholder: '结束时间',
@@ -111,7 +111,7 @@ export default {
           type: 'separate'
         },
         {
-          type: this.$auth.hasPermi('monitoring:energy-limit:create') ? 'button' : '',
+          type: this.$auth.hasPermi('monitoring:energy-report:export') ? 'button' : '',
           btnName: '导出',
           name: 'add',
           color: 'primary',
@@ -129,23 +129,17 @@ export default {
         pageNo: 1,
         pageSize: 20,
         energyTypeId: null,
+        statisticType: null,
         startTime: null,
-        endTime: 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.getList()
     this.getTypeList()
   },
   methods: {
@@ -158,33 +152,25 @@ export default {
     buttonClick(val) {
       switch (val.btnName) {
         case 'search':
-          this.queryParams.pageNo = 1;
+          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.startTime = val.timeVal ? val.timeVal[0] : null
-          this.queryParams.endTime = val.timeVal ? val.timeVal[1] : nul
+          this.queryParams.endTime = val.timeVal ? val.timeVal[1] : null
           this.getList()
           break
         default:
-          this.addOrEditTitle = '新增'
+          this.$modal.confirm('是否确认导出').then(() => {
-          this.centervisible = true
+              return energyReportPageExportAuto({...this.queryParams});
-          this.$nextTick(() => {
+            }).then(response => {
-            this.$refs.energyLimit.init()
+              this.$download.excel(response, '能源统计报表.xls');
-          })
+            }).catch(() => {})
       }
     },
     /** 查询列表 */
     getList() {
-      energyReportPageAuto({...this.queryParams}).then(response => {
+      energyReportPageAuto(this.queryParams).then(response => {
-        let arr = response.data.list || [];
+        this.list = 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;
       });
     }

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

@@ -26,7 +26,7 @@
 
 <script>
 import { energyReportPage, energyReportPageExport } from "@/api/monitoring/energyReport";
-// import { publicFormatter } from '@/utils/dict'
+import { getEnergyTypeListAll } from "@/api/base/energyType"
 const tableProps = [
   {
     prop: 'statisticName',
@@ -59,18 +59,26 @@ export default {
           label: '统计方案',
           param: 'statisticName'
         },
+        {
+          type: 'select',
+          label: '能源类型',
+          selectOptions: [],
+          param: 'energyTypeId',
+          filterable: true
+        },
         {
           type: 'datePicker',
-          label: '时间',
+          label: '时间(必填)',
           dateType: 'datetimerange',
           format: 'yyyy-MM-dd HH:mm:ss',
-          valueFormat: "yyyy-MM-ddTHH:mm:ss",
+          valueFormat: "timestamp",
           rangeSeparator: '-',
           startPlaceholder: '开始时间',
           endPlaceholder: '结束时间',
           param: 'timeVal',
           defaultSelect: [],
-          width: 350
+          width: 350,
+          clearable: false
         },
         {
           type: 'button',
@@ -82,7 +90,7 @@ export default {
           type: 'separate'
         },
         {
-          type: this.$auth.hasPermi('monitoring:energy-limit:create') ? 'button' : '',
+          type: this.$auth.hasPermi('monitoring:energy-report-search:export') ? 'button' : '',
           btnName: '导出',
           name: 'add',
           color: 'primary',
@@ -103,65 +111,49 @@ export default {
         startTime: null,
         endTime: null
       },
-      energyTypeList: [],
+      energyTypeList: []
-      typeList: [
-        {label: '合并', value: '1'},
-        {label: '详细', value: '2'}
-      ],
-      objList: []
     };
   },
   created() {
     window.addEventListener('resize', () => {
       this.tableH = this.tableHeight(260)
     })
-    this.getList();
+    this.formConfig[2].defaultSelect = [Date.now() - 7*24*3600000, Date.now()]
+    this.queryParams.startTime = this.formConfig[2].defaultSelect[0]
+    this.queryParams.endTime = this.formConfig[2].defaultSelect[1]
+    this.getList()
+    this.getTypeList()
   },
   methods: {
+    getTypeList() {
+      getEnergyTypeListAll().then((res) => {
+        this.formConfig[1].selectOptions = res.data || []
+      })
+    },
     buttonClick(val) {
       switch (val.btnName) {
         case 'search':
-          this.queryParams.pageNo = 1;
+          this.queryParams.pageNo = 1
           this.queryParams.statisticName = val.statisticName
-          this.queryParams.startTime = val.timeVal ? val.timeVal[0] : nul
+          this.queryParams.energyTypeId = val.energyTypeId
-          this.queryParams.endTime = val.timeVal ? val.timeVal[1] : nul
+          this.queryParams.startTime = val.timeVal ? val.timeVal[0] : null
+          this.queryParams.endTime = val.timeVal ? val.timeVal[1] : null
           this.getList()
           break
         default:
-          this.addOrEditTitle = '新增'
+          this.$modal.confirm('是否确认导出').then(() => {
-          this.centervisible = true
+                return energyReportPageExport({...this.queryParams});
-          this.$nextTick(() => {
+              }).then(response => {
-            this.$refs.energyLimit.init()
+                this.$download.excel(response, '能源统计查询报表.xls');
-          })
+              }).catch(() => {})
       }
     },
     /** 查询列表 */
     getList() {
       energyReportPage({...this.queryParams}).then(response => {
-        let arr = response.data.list || [];
+        this.list = 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)
-      }
     }
   }
 };

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

@@ -53,6 +53,10 @@ const tableProps = [
     prop: 'objName',
     label: '所属对象'
   },
+  {
+    prop: 'objRemark',
+    label: '对象备注'
+  },
   {
     prop: 'paramName',
     label: '参数名称'

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

@@ -40,6 +40,10 @@ const tableProps = [
     prop: 'objName',
     label: '所属对象'
   },
+  {
+    prop: 'objRemark',
+    label: '对象备注'
+  },
   {
     prop: 'paramName',
     label: '参数名称'

src/views/group/base/groupTeam/index.vue

@@ -87,14 +87,14 @@ export default {
       formConfig: [
         {
           type: 'input',
-          label: '班次名称',
+          label: '班组名称',
-          placeholder: '班次名称',
+          placeholder: '班组名称',
           param: 'name'
         },
         {
           type: 'input',
-          label: '班次编码',
+          label: '班组编码',
-          placeholder: '班次编码',
+          placeholder: '班组编码',
           param: 'code'
         },
         {