+ 首页接口联调

ems-ui-cloud/src/api/device/elecMeterH.js

@@ -116,6 +116,13 @@ export function qryElecMeterByDate(date) {
   })
 }
 
+export function qryElecMeterByYear(date) {
+  return request({
+    url: `/ems/elecMeterH/sum/date/byYear/${date}`,
+    method: 'get'
+  })
+}
+
 export function qryTimeIndexElecMeterByDay(date, timeIndex) {
   return request({
     url: `/ems/elecMeterH/sum/timeIndex/byDate/${date}/${timeIndex}`,
@@ -151,3 +158,10 @@ export function qryDateWaterMeterByDate(date) {
   })
 }
 
+export function qryDateWaterMeterByYear(date) {
+  return request({
+    url: `/ems/waterMeterH/sum/date/byYear/${date}`,
+    method: 'get',
+  })
+}
+

ems-ui-cloud/src/utils/DateTool.js

@@ -14,6 +14,7 @@ export const DateTool = {
     YYYYMMDDHHmmss: 'YYYYMMDDHHmmss',
     YYYY_MM_DD_00_00_00: 'YYYY-MM-DD 00:00:00',
     YYYY_MM_DD_23_59_59: 'YYYY-MM-DD 23:59:59',
+    MM_DD: 'MM-DD',
   },
   /**
    * 获取当天时间刻度
@@ -47,6 +48,16 @@ export const DateTool = {
     }
     return dates;
   },
+
+  getMonthOfRange: function (start, end, format = this.DateFormat.YYYY_MM) {
+    const dates = [];
+    let current = dayjs(start);
+    while (current.isSameOrBefore(end)) {
+      dates.push(current.format(format));
+      current = current.add(1, 'month');
+    }
+    return dates;
+  },
   get24Time: function (timeSplit = 5) {
     const now = dayjs();
     let zero = dayjs().subtract(1, 'day').startOf('hour').add(1, 'hour');
@@ -80,6 +91,9 @@ export const DateTool = {
   lastYear: (format = DateTool.DateFormat.YYYY) => {
     return dayjs().subtract(1, 'year').format(format);
   },
+  lastYearMonthStart: () => {
+    return dayjs().subtract(1, 'year').format(`${DateTool.DateFormat.YYYY_MM}-01`);
+  },
   thisYear: (format = DateTool.DateFormat.YYYY) => {
     return dayjs().format(format);
   },

ems-ui-cloud/src/views/index.vue

@@ -76,7 +76,11 @@
 import BaseChart from '@/components/BaseChart'
 import SubTitle from '@/components/SubTitle/index.vue'
 import {
+  qryDateElecMeterByDate,
+  qryDateWaterMeterByDate,
+  qryDateWaterMeterByYear,
   qryElecMeterByDate,
+  qryElecMeterByYear,
   qryTimeIndexElecMeterByDay,
   qryTimeIndexWaterMeterByDay,
   qryWaterMeterByDate
@@ -175,7 +179,7 @@ const dtCostConst = {
     axisLabel: {
       interval: 0,
       // color: '#c1cadf',
-      fontSize: '15',
+      fontSize: '10',
     }
   }],
   yAxis: [{
@@ -275,13 +279,13 @@ export default {
         {
           name: '月', value: '3',
           date: () => {
-            return DateTool.now(DateTool.DateFormat.YYYY_MM)
+            return DateTool.lastMonth(DateTool.DateFormat.YYYY_MM_DD)
           }
         },
         {
           name: '年', value: '4',
           date: () => {
-            return DateTool.now(DateTool.DateFormat.YYYY)
+            return DateTool.lastYearMonthStart()
           }
         },
       ],
@@ -325,8 +329,54 @@ export default {
         const {data: timeWaterIndex} = await qryTimeIndexWaterMeterByDay(day, timeIndex)
         options.xAxis[0].data = _24Time;
         _24Time.map((item, index) => {
-          options.series[0].data.push(timeWaterIndex[index] ? timeWaterIndex[index].waterQuantity : 0)
-          options.series[1].data.push(timeElecIndex[index] ? timeElecIndex[index].elecQuantity : 0)
+          options.series[0].data.push(timeWaterIndex[index] ? this.decimalFormat(timeWaterIndex[index].useWaterCost) : 0)
+          options.series[1].data.push(timeElecIndex[index] ? this.decimalFormat(timeElecIndex[index].useElecCost) : 0)
+        })
+        options.xAxis[0].axisLabel.formatter = function (value) {
+          // 按空格分割字符串并换行显示
+          return value.split(' ').join('\n');
+        }
+        this.dtCost = options
+        return
+      }
+
+      if (item.value === '3') {
+        const day = item.date()
+        const days = DateTool.getDayOfRange(day, DateTool.now(), DateTool.DateFormat.MM_DD);
+        const {data: timeElecIndex} = await qryDateElecMeterByDate(day)
+        const {data: timeWaterIndex} = await qryDateWaterMeterByDate(day)
+        options.xAxis[0].data = days;
+        days.map((item, index) => {
+          options.series[0].data.push(timeWaterIndex[index] ? this.decimalFormat(timeWaterIndex[index].useWaterCost) : 0)
+          options.series[1].data.push(timeElecIndex[index] ? this.decimalFormat(timeElecIndex[index].useElecCost) : 0)
+        })
+        options.xAxis[0].axisLabel.formatter = function (value) {
+          // 按空格分割字符串并换行显示
+          return value.split(' ').join('\n');
+        }
+        this.dtCost = options
+        return
+      }
+
+      if (item.value === '4') {
+        const day = item.date()
+        const days = DateTool.getMonthOfRange(day, DateTool.now(), DateTool.DateFormat.YYYY_MM);
+        const {data: timeElecIndex} = await qryElecMeterByYear(day)
+        const {data: timeWaterIndex} = await qryDateWaterMeterByYear(day)
+        options.xAxis[0].data = days;
+        const indexMap = {
+          elec:{},
+          water:{}
+        }
+        timeElecIndex.map((item, index) => {
+          indexMap.elec[item.startRecTime] = item.useElecCost
+        })
+        timeWaterIndex.map((item, index) => {
+          indexMap.water[item.startRecTime] = item.useWaterCost
+        })
+        days.map((item, index) => {
+          options.series[0].data.push(indexMap.water[item] ? this.decimalFormat(indexMap.water[item]) : 0)
+          options.series[1].data.push(indexMap.elec[item] ? this.decimalFormat(indexMap.elec[item]) : 0)
         })
         options.xAxis[0].axisLabel.formatter = function (value) {
           // 按空格分割字符串并换行显示