✨ feat: 数据统计-对比分析添加日维度统计功能

2024-12-13 21:54:11 +08:00 · 2024-12-13 21:54:11 +08:00 · 9bd6e4317e
parent d654c3f376
commit 9bd6e4317e
6 changed files with 89 additions and 10 deletions
--- a/RuoYi-Vue-Oracle/src/main/java/com/ruoyi/project/oil/controller/OilStatisticsController.java
+++ b/RuoYi-Vue-Oracle/src/main/java/com/ruoyi/project/oil/controller/OilStatisticsController.java
@ -59,10 +59,21 @@ public class OilStatisticsController extends BaseController {
    }

    @GetMapping("/getAvgDsByDeptIdsAndDate")
-    public AjaxResult getAvgDsByDeptIdsAndDate(@RequestParam("ids") List<Long> ids, @RequestParam("startDate") String startDate, @RequestParam("endDate") String endDate) {
+    public AjaxResult getAvgDsByDeptIdsAndDate(
+            @RequestParam("ids") List<Long> ids,
+            @RequestParam("startDate") String startDate,
+            @RequestParam("endDate") String endDate,
+            @RequestParam("isDaily") boolean isDaily
+
+    ) {
        Map<Long, Object> resultMap = new HashMap<>();
        for (Long id : ids) {
-            List<Map<String, Object>> result = thDeviceReportMonthService.selectAvgDsByDeptIdAndDate(id, startDate, endDate);
+            List<Map<String, Object>> result;
+            if (isDaily) {
+                result = oilThDeviceReportService.selectAvgDsByDateRange(id, startDate, endDate);
+            } else {
+                result = thDeviceReportMonthService.selectAvgDsByDeptIdAndDate(id, startDate, endDate);
+            }
            resultMap.put(id, result);
        }
        return success(resultMap);
--- a/RuoYi-Vue-Oracle/src/main/java/com/ruoyi/project/oil/mapper/ThDeviceReportMapper.java
+++ b/RuoYi-Vue-Oracle/src/main/java/com/ruoyi/project/oil/mapper/ThDeviceReportMapper.java
@ -83,4 +83,7 @@ public interface ThDeviceReportMapper {

    @MapKey("sn")
    List<Map<String, Object>> selectOverLimitCountByYearAndDeptId(@Param("deptId") Long deptId, @Param("year") String year);
+
+    @MapKey("day")
+    List<Map<String, Object>> selectAvgDsByDateRange(@Param("deptId") Long deptId, @Param("beginDate") String beginDate, @Param("endDate") String endDate);
 }
--- a/RuoYi-Vue-Oracle/src/main/java/com/ruoyi/project/oil/service/IOilThDeviceReportService.java
+++ b/RuoYi-Vue-Oracle/src/main/java/com/ruoyi/project/oil/service/IOilThDeviceReportService.java
@ -17,4 +17,6 @@ public interface IOilThDeviceReportService {
    List<Map<String, Object>> selectAlarmCountByDeptIdAndDateRangeDesc(Long deptId, String beginDate, String endDate);

    List<Map<String, Object>> selectOverLimitCountByYearAndDeptId(Long deptId, String year);
+
+    List<Map<String, Object>> selectAvgDsByDateRange(Long deptId, String beginDate, String endDate);
 }
--- a/RuoYi-Vue-Oracle/src/main/java/com/ruoyi/project/oil/service/impl/OilThDeviceReportService.java
+++ b/RuoYi-Vue-Oracle/src/main/java/com/ruoyi/project/oil/service/impl/OilThDeviceReportService.java
@ -51,4 +51,9 @@ public class OilThDeviceReportService  implements IOilThDeviceReportService {
        return camelCaseMapListKey(thDeviceReportMapper.selectOverLimitCountByYearAndDeptId(deptId, year));
    }

+    @Override
+    public List<Map<String, Object>> selectAvgDsByDateRange(Long deptId, String beginDate, String endDate) {
+        return camelCaseMapListKey(thDeviceReportMapper.selectAvgDsByDateRange(deptId, beginDate, endDate));
+    }
+
 }
--- a/RuoYi-Vue-Oracle/src/main/resources/mybatis/oil/ThDeviceReportMapper.xml
+++ b/RuoYi-Vue-Oracle/src/main/resources/mybatis/oil/ThDeviceReportMapper.xml
@ -271,4 +271,20 @@
    GROUP BY d.sn, td.address, p.dept_name, pp.dept_name, ppp.dept_name
    ORDER BY p.dept_name, pp.dept_name, ppp.dept_name, d.sn
 </select>
+
+    <select id="selectAvgDsByDateRange" parameterType="map" resultType="map">
+        SELECT TO_CHAR(d.report_time, 'YYYY-MM-DD') AS day,
+               ROUND(AVG(TO_NUMBER(d.ds)), 8)       AS avg_value
+        FROM th_device_report d
+        WHERE d.sn IN (SELECT d.sn
+                       FROM th_device d
+                                LEFT JOIN sys_dept p ON d.dept_id = p.dept_id
+                       WHERE d.dept_id IN (SELECT dept_id
+                                           FROM sys_dept START WITH dept_id = #{deptId}
+                                               CONNECT BY PRIOR dept_id = parent_id))
+          AND TRUNC(d.REPORT_TIME) &gt;= TO_DATE(#{beginDate}, 'YYYY-MM-DD')
+          AND TRUNC(d.REPORT_TIME) &lt;= TO_DATE(#{endDate}, 'YYYY-MM-DD')
+        GROUP BY TO_CHAR(d.report_time, 'YYYY-MM-DD')
+        ORDER BY day
+    </select>
 </mapper>
--- a/ruoyi-ui/src/views/dataStatistics/comparison/index.vue
+++ b/ruoyi-ui/src/views/dataStatistics/comparison/index.vue
@ -11,9 +11,9 @@
      <el-col :span="6">
        <el-date-picker
          v-model="dateTimeRange"
-          type="monthrange"
-          format="yyyy-MM"
-          value-format="yyyy-MM"
+          :type="isDaily ? 'daterange' : 'monthrange'"
+          :format="isDaily ? 'yyyy-MM-dd' : 'yyyy-MM'"
+          :value-format="isDaily ? 'yyyy-MM-dd' : 'yyyy-MM'"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
@ -21,6 +21,9 @@
        >
        </el-date-picker>
      </el-col>
+      <div class="switch-wrapper">
+        <el-checkbox v-model="isDaily">日维度</el-checkbox>
+      </div>
    </el-row>

    <el-row :gutter="10" class="chart-wrapper">
@ -49,12 +52,22 @@ export default {
        id: "comparisonChart",
        Xdata: [],
        Ydata: [],
-        option: {},
+        option: {
+          tooltip: {
+            trigger: "axis",
+            formatter: function (params) {
+              return `${params[0].name}<br />${params
+                .map((item) => `${item.marker} ${item.seriesName}: ${item.value} mg/m³`)
+                .join("<br />")}`;
+            },
+          },
+        },
        series: {
          data: [],
        },
      },
      queryDebounce: null,
+      isDaily: false,
    };
  },
  mounted() {
@ -66,6 +79,22 @@ export default {
    ];
    this.queryDebounce = debounce(this.query, 100);
  },
+  watch: {
+    isDaily: function (value) {
+      if (value) {
+        this.dateTimeRange = [
+          moment().startOf("month").format("YYYY-MM-DD"),
+          moment().format("YYYY-MM-DD"),
+        ];
+      } else {
+        this.dateTimeRange = [
+          moment().startOf("month").format("YYYY-MM"),
+          moment().format("YYYY-MM"),
+        ];
+      }
+      this.queryDebounce();
+    },
+  },
  methods: {
    handleDateTimeChange() {
      this.queryDebounce();
@ -89,6 +118,7 @@ export default {
          ids: this.deptIds.join(","),
          startDate: this.dateTimeRange[0],
          endDate: this.dateTimeRange[1],
+          isDaily: this.isDaily,
        })
      );

@ -102,15 +132,19 @@ export default {
        return;
      }
      const { data } = res;
+      const that = this;
      // 按照 month 正确排序
-       function sortDataByMonth(data) {
+      function sortDataByMonth(data) {
        // 遍历对象的每个键
        for (const key in data) {
          if (data.hasOwnProperty(key)) {
            // 对每个键对应的数组进行排序
            data[key].sort((a, b) => {
              // 比较 month 属性
-              return new Date(a.month) - new Date(b.month);
+              // return new Date(a.month) - new Date(b.month);
+              return that.isDaily
+                ? new Date(a.day) - new Date(b.day)
+                : new Date(a.month) - new Date(b.month);
            });
          }
        }
@ -120,12 +154,15 @@ export default {

      this.chartData.series.data = Object.keys(sortedData).map((key) => {
        return {
-          name: this.deptList.find((item) => item.deptId === parseInt(key))?.deptName,
+          name: this.deptList.find((item) => item.deptId === parseInt(key))
+            ?.deptName,
          type: "line",
          data: data[key].map((item) => item.avgValue.toFixed(2)),
        };
      });
-      this.chartData.Xdata = data[Object.keys(data)[0]].map((item) => item.month);
+      this.chartData.Xdata = data[Object.keys(data)[0]].map((item) =>
+        that.isDaily ? item.day : item.month
+      );
    },
  },
 };
@ -139,4 +176,9 @@ export default {
    margin-top: 20px;
  }
 }
+.switch-wrapper {
+  height: 36px;
+  display: flex;
+  align-items: center;
+}
 </style>