From 6c83f1009ca85f04457004fb98a8960028b5fdc1 Mon Sep 17 00:00:00 2001
From: ali <ali9696@163.com>
Date: 星期二, 11 二月 2025 16:34:16 +0800
Subject: [PATCH] 综合能耗日月年

---
 zhitan-vue/src/assets/styles/ruoyi.scss                                                 |    7 
 zhitan-vue/src/views/comprehensive/monthlyComprehensive/index.vue                       |  241 ++++++++++
 zhitan-vue/src/views/comprehensive/yearComprehensive/index.vue                          |  245 +++++++++++
 zhitan-vue/src/api/comprehensiveStatistics/monthlyComprehensive/monthlyComprehensive.js |   17 
 zhitan-vue/src/views/comprehensive/comps/LineChart.vue                                  |  173 +++++++
 zhitan-vue/src/api/comprehensiveStatistics/processEnergyConsumption.js                  |   19 
 zhitan-vue/src/api/comprehensiveStatistics/comprehensive.js                             |   70 +++
 zhitan-vue/src/api/comprehensiveStatistics/dailyComprehensive/dailyComprehensive.js     |   26 +
 zhitan-vue/src/utils/ruoyi.js                                                           |  207 +++++----
 zhitan-vue/src/views/comprehensive/dailyComprehensive/index.vue                         |  245 +++++++++++
 zhitan-vue/src/api/comprehensiveStatistics/yearComprehensive/yearComprehensive.js       |   17 
 11 files changed, 1,175 insertions(+), 92 deletions(-)

diff --git a/zhitan-vue/src/api/comprehensiveStatistics/comprehensive.js b/zhitan-vue/src/api/comprehensiveStatistics/comprehensive.js
new file mode 100644
index 0000000..bd8dbb5
--- /dev/null
+++ b/zhitan-vue/src/api/comprehensiveStatistics/comprehensive.js
@@ -0,0 +1,70 @@
+import request from '@/utils/request'
+
+//鍏ㄥ巶缁煎悎鑳借�楃粺璁�
+export function getDataList(query) {
+  return request({
+    url: '/statisticalData/comprehensiveStatistics/list',
+    method: 'get',
+    params: query
+  })
+}
+
+//鍏ㄥ巶缁煎悎鑳借�楃粺璁″浘
+export function getlistChart(query) {
+  return request({
+    url: '/statisticalData/comprehensiveStatistics/listChart',
+    method: 'get',
+    params: query
+  })
+}
+export function exportList(query) {
+  return request({
+    url: '/statisticalData/comprehensiveStatistics/export',
+    method: 'get',
+    params: query
+  })
+}
+export function getEnergyList(query) {
+  return request({
+    url: '/statisticalData/comprehensiveStatistics/getList',
+    method: 'get',
+    params: query
+  })
+}
+//閲嶇偣璁惧鑳借�楁帓鍚�
+export function energyList(query) {
+  return request({
+    url: '/statisticalData/comprehensiveStatistics/energyList',
+    method: 'get',
+    params: query
+  })
+}
+//璁惧
+export function getFacilityArchives() {
+  return request({
+    url: '/statisticalData/comprehensiveStatistics/getFacilityArchives',
+    method: 'get'
+  })
+}
+//閲嶇偣璁惧
+export function getPointFacility() {
+  return request({
+    url: '/statisticalData/comprehensiveStatistics/getPointFacility',
+    method: 'get'
+  })
+}
+export function getDeviceList(query) {
+  return request({
+    url: '/statisticalData/comprehensiveStatistics/getDeviceList',
+    method: 'get',
+    params: query
+  })
+}
+//鑾峰彇妯″瀷涓嬬殑鑳芥簮鍝佺
+export function energyDevice(query) {
+  return request({
+    url: '/statisticalData/comprehensiveStatistics/energyDevice',
+    method: 'get',
+    params: query
+  })
+}
diff --git a/zhitan-vue/src/api/comprehensiveStatistics/dailyComprehensive/dailyComprehensive.js b/zhitan-vue/src/api/comprehensiveStatistics/dailyComprehensive/dailyComprehensive.js
new file mode 100644
index 0000000..701aa46
--- /dev/null
+++ b/zhitan-vue/src/api/comprehensiveStatistics/dailyComprehensive/dailyComprehensive.js
@@ -0,0 +1,26 @@
+import request from "@/utils/request"
+
+//鏌ヨ鏃ユ姤琛�
+export function getDataList(query) {
+  return request({
+    url: "/comprehensive/dailyComprehensive/list",
+    method: "get",
+    params: query,
+  })
+}
+export function getlistChart(query) {
+  return request({
+    url: "/comprehensive/dailyComprehensive/listChart",
+    method: "get",
+    params: query,
+  })
+}
+
+// 瀵煎嚭缁煎悎鎶ヨ〃
+export function exportList(query) {
+  return request({
+    url: "/report/dailyReport/export",
+    method: "get",
+    params: query,
+  })
+}
diff --git a/zhitan-vue/src/api/comprehensiveStatistics/monthlyComprehensive/monthlyComprehensive.js b/zhitan-vue/src/api/comprehensiveStatistics/monthlyComprehensive/monthlyComprehensive.js
new file mode 100644
index 0000000..b3a5668
--- /dev/null
+++ b/zhitan-vue/src/api/comprehensiveStatistics/monthlyComprehensive/monthlyComprehensive.js
@@ -0,0 +1,17 @@
+import request from '@/utils/request'
+
+//鏌ヨ鏃ユ姤琛�
+export function getDataList(query) {
+  return request({
+    url: '/comprehensive/monthlyComprehensive/list',
+    method: 'get',
+    params: query
+  })
+}
+export function getlistChart(query) {
+  return request({
+    url: '/comprehensive/monthlyComprehensive/listChart',
+    method: 'get',
+    params: query
+  })
+}
diff --git a/zhitan-vue/src/api/comprehensiveStatistics/processEnergyConsumption.js b/zhitan-vue/src/api/comprehensiveStatistics/processEnergyConsumption.js
new file mode 100644
index 0000000..38858e5
--- /dev/null
+++ b/zhitan-vue/src/api/comprehensiveStatistics/processEnergyConsumption.js
@@ -0,0 +1,19 @@
+import request from '@/utils/request'
+
+//鍏ㄥ巶缁煎悎鑳借�楃粺璁�
+export function getDataList(query) {
+  return request({
+    url: '/statisticalData/processEnergyConsumption/list',
+    method: 'get',
+    params: query
+  })
+}
+
+//鍏ㄥ巶缁煎悎鑳借�楃粺璁″浘
+export function getlistChart(query) {
+  return request({
+    url: '/statisticalData/processEnergyConsumption/listChart',
+    method: 'get',
+    params: query
+  })
+}
diff --git a/zhitan-vue/src/api/comprehensiveStatistics/yearComprehensive/yearComprehensive.js b/zhitan-vue/src/api/comprehensiveStatistics/yearComprehensive/yearComprehensive.js
new file mode 100644
index 0000000..03cb827
--- /dev/null
+++ b/zhitan-vue/src/api/comprehensiveStatistics/yearComprehensive/yearComprehensive.js
@@ -0,0 +1,17 @@
+import request from '@/utils/request'
+
+//鏌ヨ鏃ユ姤琛�
+export function getDataList(query) {
+  return request({
+    url: '/comprehensive/yearComprehensive/list',
+    method: 'get',
+    params: query
+  })
+}
+export function getlistChart(query) {
+  return request({
+    url: '/comprehensive/yearComprehensive/listChart',
+    method: 'get',
+    params: query
+  })
+}
diff --git a/zhitan-vue/src/assets/styles/ruoyi.scss b/zhitan-vue/src/assets/styles/ruoyi.scss
index d83440a..505048c 100644
--- a/zhitan-vue/src/assets/styles/ruoyi.scss
+++ b/zhitan-vue/src/assets/styles/ruoyi.scss
@@ -312,6 +312,10 @@
       // tr:hover > td {
       // 	background-color: #141E4A;
       // }
+
+      .el-table-fixed-column--left {
+        background-color: #110f2e !important;
+      }
     }
   }
 
@@ -858,6 +862,9 @@
       // tr:hover > td {
       // 	background-color: #141E4A;
       // }
+      .el-table-fixed-column--left {
+        background-color: #fff;
+      }
     }
   }
 
diff --git a/zhitan-vue/src/utils/ruoyi.js b/zhitan-vue/src/utils/ruoyi.js
index 4efca08..74f7c30 100644
--- a/zhitan-vue/src/utils/ruoyi.js
+++ b/zhitan-vue/src/utils/ruoyi.js
@@ -1,5 +1,3 @@
-
-
 /**
  * 閫氱敤js鏂规硶灏佽澶勭悊
  * Copyright (c) 2019 ruoyi
@@ -10,17 +8,20 @@
   if (arguments.length === 0 || !time) {
     return null
   }
-  const format = pattern || '{y}-{m}-{d} {h}:{i}:{s}'
+  const format = pattern || "{y}-{m}-{d} {h}:{i}:{s}"
   let date
-  if (typeof time === 'object') {
+  if (typeof time === "object") {
     date = time
   } else {
-    if ((typeof time === 'string') && (/^[0-9]+$/.test(time))) {
+    if (typeof time === "string" && /^[0-9]+$/.test(time)) {
       time = parseInt(time)
-    } else if (typeof time === 'string') {
-      time = time.replace(new RegExp(/-/gm), '/').replace('T', ' ').replace(new RegExp(/\.[\d]{3}/gm), '');
+    } else if (typeof time === "string") {
+      time = time
+        .replace(new RegExp(/-/gm), "/")
+        .replace("T", " ")
+        .replace(new RegExp(/\.[\d]{3}/gm), "")
     }
-    if ((typeof time === 'number') && (time.toString().length === 10)) {
+    if (typeof time === "number" && time.toString().length === 10) {
       time = time * 1000
     }
     date = new Date(time)
@@ -32,14 +33,16 @@
     h: date.getHours(),
     i: date.getMinutes(),
     s: date.getSeconds(),
-    a: date.getDay()
+    a: date.getDay(),
   }
   const time_str = format.replace(/{(y|m|d|h|i|s|a)+}/g, (result, key) => {
     let value = formatObj[key]
     // Note: getDay() returns 0 on Sunday
-    if (key === 'a') { return ['鏃�', '涓�', '浜�', '涓�', '鍥�', '浜�', '鍏�'][value] }
+    if (key === "a") {
+      return ["鏃�", "涓�", "浜�", "涓�", "鍥�", "浜�", "鍏�"][value]
+    }
     if (result.length > 0 && value < 10) {
-      value = '0' + value
+      value = "0" + value
     }
     return value || 0
   })
@@ -49,89 +52,92 @@
 // 琛ㄥ崟閲嶇疆
 export function resetForm(refName) {
   if (this.$refs[refName]) {
-    this.$refs[refName].resetFields();
+    this.$refs[refName].resetFields()
   }
 }
 
 // 娣诲姞鏃ユ湡鑼冨洿
 export function addDateRange(params, dateRange, propName) {
-  let search = params;
-  search.params = typeof (search.params) === 'object' && search.params !== null && !Array.isArray(search.params) ? search.params : {};
-  dateRange = Array.isArray(dateRange) ? dateRange : [];
-  if (typeof (propName) === 'undefined') {
-    search.params['beginTime'] = dateRange[0];
-    search.params['endTime'] = dateRange[1];
+  let search = params
+  search.params =
+    typeof search.params === "object" && search.params !== null && !Array.isArray(search.params) ? search.params : {}
+  dateRange = Array.isArray(dateRange) ? dateRange : []
+  if (typeof propName === "undefined") {
+    search.params["beginTime"] = dateRange[0]
+    search.params["endTime"] = dateRange[1]
   } else {
-    search.params['begin' + propName] = dateRange[0];
-    search.params['end' + propName] = dateRange[1];
+    search.params["begin" + propName] = dateRange[0]
+    search.params["end" + propName] = dateRange[1]
   }
-  return search;
+  return search
 }
 
 // 鍥炴樉鏁版嵁瀛楀吀
 export function selectDictLabel(datas, value) {
   if (value === undefined) {
-    return "";
+    return ""
   }
-  var actions = [];
+  var actions = []
   Object.keys(datas).some((key) => {
-    if (datas[key].value == ('' + value)) {
-      actions.push(datas[key].label);
-      return true;
+    if (datas[key].value == "" + value) {
+      actions.push(datas[key].label)
+      return true
     }
   })
   if (actions.length === 0) {
-    actions.push(value);
+    actions.push(value)
   }
-  return actions.join('');
+  return actions.join("")
 }
 
 // 鍥炴樉鏁版嵁瀛楀吀锛堝瓧绗︿覆鏁扮粍锛�
 export function selectDictLabels(datas, value, separator) {
-  if (value === undefined || value.length ===0) {
-    return "";
+  if (value === undefined || value.length === 0) {
+    return ""
   }
   if (Array.isArray(value)) {
-    value = value.join(",");
+    value = value.join(",")
   }
-  var actions = [];
-  var currentSeparator = undefined === separator ? "," : separator;
-  var temp = value.split(currentSeparator);
+  var actions = []
+  var currentSeparator = undefined === separator ? "," : separator
+  var temp = value.split(currentSeparator)
   Object.keys(value.split(currentSeparator)).some((val) => {
-    var match = false;
+    var match = false
     Object.keys(datas).some((key) => {
-      if (datas[key].value == ('' + temp[val])) {
-        actions.push(datas[key].label + currentSeparator);
-        match = true;
+      if (datas[key].value == "" + temp[val]) {
+        actions.push(datas[key].label + currentSeparator)
+        match = true
       }
     })
     if (!match) {
-      actions.push(temp[val] + currentSeparator);
+      actions.push(temp[val] + currentSeparator)
     }
   })
-  return actions.join('').substring(0, actions.join('').length - 1);
+  return actions.join("").substring(0, actions.join("").length - 1)
 }
 
 // 瀛楃涓叉牸寮忓寲(%s )
 export function sprintf(str) {
-  var args = arguments, flag = true, i = 1;
+  var args = arguments,
+    flag = true,
+    i = 1
   str = str.replace(/%s/g, function () {
-    var arg = args[i++];
-    if (typeof arg === 'undefined') {
-      flag = false;
-      return '';
+    var arg = args[i++]
+    if (typeof arg === "undefined") {
+      flag = false
+      return ""
     }
-    return arg;
-  });
-  return flag ? str : '';
+    return arg
+  })
+  return flag ? str : ""
 }
 
 // 杞崲瀛楃涓诧紝undefined,null绛夎浆鍖栦负""
 export function parseStrEmpty(str) {
   if (!str || str == "undefined" || str == "null") {
-    return "";
+    return ""
   }
-  return str;
+  return str
 }
 
 // 鏁版嵁鍚堝苟
@@ -139,16 +145,16 @@
   for (var p in target) {
     try {
       if (target[p].constructor == Object) {
-        source[p] = mergeRecursive(source[p], target[p]);
+        source[p] = mergeRecursive(source[p], target[p])
       } else {
-        source[p] = target[p];
+        source[p] = target[p]
       }
     } catch (e) {
-      source[p] = target[p];
+      source[p] = target[p]
     }
   }
-  return source;
-};
+  return source
+}
 
 /**
  * 鏋勯�犳爲鍨嬬粨鏋勬暟鎹�
@@ -159,88 +165,105 @@
  */
 export function handleTree(data, id, parentId, children) {
   let config = {
-    id: id || 'id',
-    parentId: parentId || 'parentId',
-    childrenList: children || 'children'
-  };
+    id: id || "id",
+    parentId: parentId || "parentId",
+    childrenList: children || "children",
+  }
 
-  var childrenListMap = {};
-  var nodeIds = {};
-  var tree = [];
+  var childrenListMap = {}
+  var nodeIds = {}
+  var tree = []
 
   for (let d of data) {
-    let parentId = d[config.parentId];
+    let parentId = d[config.parentId]
     if (childrenListMap[parentId] == null) {
-      childrenListMap[parentId] = [];
+      childrenListMap[parentId] = []
     }
-    nodeIds[d[config.id]] = d;
-    childrenListMap[parentId].push(d);
+    nodeIds[d[config.id]] = d
+    childrenListMap[parentId].push(d)
   }
 
   for (let d of data) {
-    let parentId = d[config.parentId];
+    let parentId = d[config.parentId]
     if (nodeIds[parentId] == null) {
-      tree.push(d);
+      tree.push(d)
     }
   }
 
   for (let t of tree) {
-    adaptToChildrenList(t);
+    adaptToChildrenList(t)
   }
 
   function adaptToChildrenList(o) {
     if (childrenListMap[o[config.id]] !== null) {
-      o[config.childrenList] = childrenListMap[o[config.id]];
+      o[config.childrenList] = childrenListMap[o[config.id]]
     }
     if (o[config.childrenList]) {
       for (let c of o[config.childrenList]) {
-        adaptToChildrenList(c);
+        adaptToChildrenList(c)
       }
     }
   }
-  return tree;
+  return tree
 }
 
 /**
-* 鍙傛暟澶勭悊
-* @param {*} params  鍙傛暟
-*/
+ * 鍙傛暟澶勭悊
+ * @param {*} params  鍙傛暟
+ */
 export function tansParams(params) {
-  let result = ''
+  let result = ""
   for (const propName of Object.keys(params)) {
-    const value = params[propName];
-    var part = encodeURIComponent(propName) + "=";
-    if (value !== null && value !== "" && typeof (value) !== "undefined") {
-      if (typeof value === 'object') {
+    const value = params[propName]
+    var part = encodeURIComponent(propName) + "="
+    if (value !== null && value !== "" && typeof value !== "undefined") {
+      if (typeof value === "object") {
         for (const key of Object.keys(value)) {
-          if (value[key] !== null && value[key] !== "" && typeof (value[key]) !== 'undefined') {
-            let params = propName + '[' + key + ']';
-            var subPart = encodeURIComponent(params) + "=";
-            result += subPart + encodeURIComponent(value[key]) + "&";
+          if (value[key] !== null && value[key] !== "" && typeof value[key] !== "undefined") {
+            let params = propName + "[" + key + "]"
+            var subPart = encodeURIComponent(params) + "="
+            result += subPart + encodeURIComponent(value[key]) + "&"
           }
         }
       } else {
-        result += part + encodeURIComponent(value) + "&";
+        result += part + encodeURIComponent(value) + "&"
       }
     }
   }
   return result
 }
 
-
 // 杩斿洖椤圭洰璺緞
 export function getNormalPath(p) {
-  if (p.length === 0 || !p || p == 'undefined') {
+  if (p.length === 0 || !p || p == "undefined") {
     return p
-  };
-  let res = p.replace('//', '/')
-  if (res[res.length - 1] === '/') {
+  }
+  let res = p.replace("//", "/")
+  if (res[res.length - 1] === "/") {
     return res.slice(0, res.length - 1)
   }
-  return res;
+  return res
 }
 
 // 楠岃瘉鏄惁涓篵lob鏍煎紡
 export function blobValidate(data) {
-  return data.type !== 'application/json'
+  return data.type !== "application/json"
+}
+
+// 閫氱敤涓嬭浇鏂规硶
+const baseURL = import.meta.env.VITE_APP_BASE_API
+export function download(fileName) {
+  window.location.href = baseURL + "/common/download?fileName=" + encodeURI(fileName) + "&delete=" + true
+}
+
+// 閫氱敤涓嬭浇鏂规硶 showfileName锛氫笅杞藉悗鐨勬枃浠跺悕绉板甫鎵╁睍鍚�;filePath:瑕佷笅杞芥枃浠剁殑缁濆璺緞,甯︾潃鏂囦欢鍚嶅拰鎵╁睍鍚嶏紱deleteflage涓嬭浇瀹屾垚鍚庢槸鍚﹀垹闄ゆ枃浠�
+export function fileDownload(showfileName, filePath, deleteflage) {
+  window.location.href =
+    baseURL +
+    "/common/downloadAssign?showFileName=" +
+    encodeURI(showfileName) +
+    "&filePath=" +
+    encodeURI(filePath) +
+    "&delete=" +
+    deleteflage
 }
diff --git a/zhitan-vue/src/views/comprehensive/comps/LineChart.vue b/zhitan-vue/src/views/comprehensive/comps/LineChart.vue
new file mode 100644
index 0000000..e9cc744
--- /dev/null
+++ b/zhitan-vue/src/views/comprehensive/comps/LineChart.vue
@@ -0,0 +1,173 @@
+<template>
+  <div class="chart-box">
+    <div id="ChartDom" style="width: 100%; height: 100%"></div>
+  </div>
+</template>
+
+<script setup>
+import * as echarts from "echarts"
+const { proxy } = getCurrentInstance()
+import useSettingsStore from "@/store/modules/settings"
+const settingsStore = useSettingsStore()
+const emit = defineEmits()
+const props = defineProps({
+  chartData: {
+    type: Object,
+    default: () => {},
+  },
+})
+
+watch(
+  () => props.chartData,
+  (val) => {
+    console.log("watch", val)
+    initChart()
+  }
+)
+watch(
+  () => settingsStore.sideTheme,
+  (val) => {
+    initChart()
+  }
+)
+
+function initChart(value) {
+  const chartDom = document.getElementById("ChartDom")
+  if (echarts.getInstanceByDom(chartDom)) {
+    echarts.dispose(chartDom)
+  }
+  const myChart = echarts.init(chartDom)
+  let option = {
+    title: {
+      text: props.chartData.title,
+      left: "40",
+      textStyle: {
+        color: "#2979ff",
+      },
+    },
+    color: ["#2979ff", "#19be6b", "#ff9900", "#fa3534"],
+    tooltip: {
+      trigger: "axis",
+      axisPointer: {
+        type: "shadow",
+      },
+    },
+    legend: {
+      icon: "rect",
+      itemWidth: 14,
+      itemHeight: 10,
+      textStyle: {
+        color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+      },
+    },
+    grid: {
+      top: "40",
+      left: "50",
+      right: "40",
+      bottom: "20",
+      containLabel: true,
+    },
+    xAxis: {
+      type: "category",
+      axisPointer: {
+        type: "shadow",
+      },
+      axisLine: {
+        show: true,
+        lineStyle: {
+          color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+        },
+      },
+      axisTick: {
+        show: false,
+      },
+      splitArea: {
+        show: false,
+      },
+      splitLine: {
+        show: false,
+      },
+      axisLabel: {
+        color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+        fontSize: 14,
+        padding: [5, 0, 0, 0],
+        //   formatter: '{value} ml'
+      },
+      data: props.chartData.xData,
+    },
+    yAxis: [
+      {
+        type: "value",
+        nameTextStyle: {
+          color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+          fontSize: 14,
+          padding: [0, 0, 5, 0],
+        },
+        axisLine: {
+          show: false,
+        },
+        splitLine: {
+          show: true,
+          lineStyle: {
+            type: "dashed",
+            color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+          },
+        },
+        axisTick: {
+          show: false,
+        },
+        splitArea: {
+          show: false,
+        },
+        axisLabel: {
+          color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+          fontSize: 14,
+        },
+      },
+    ],
+    series: [
+      {
+        name: props.chartData.title,
+        type: "bar",
+        barWidth: "16",
+        // tooltip: {
+        //   valueFormatter: function (value) {
+        //     return value + "tce"
+        //   },
+        // },
+        itemStyle: {
+          borderRadius: [15, 15, 0, 0],
+        },
+        data: props.chartData.yData,
+        markPoint: {
+          data: [
+            { type: "max", name: "Max" },
+            { type: "min", name: "Min" },
+          ],
+        },
+      },
+    ],
+  }
+  setTimeout(() => {
+    myChart.setOption(option)
+  }, 200)
+
+  window.addEventListener(
+    "resize",
+    () => {
+      myChart.resize()
+    },
+    { passive: true }
+  )
+}
+</script>
+
+<style lang="scss" scoped>
+.chart-box {
+  width: 100%;
+  height: 400px;
+  border: 1px solid #eaeaea;
+  margin-top: 20px;
+  padding-top: 20px;
+}
+</style>
diff --git a/zhitan-vue/src/views/comprehensive/dailyComprehensive/index.vue b/zhitan-vue/src/views/comprehensive/dailyComprehensive/index.vue
new file mode 100644
index 0000000..a3d5183
--- /dev/null
+++ b/zhitan-vue/src/views/comprehensive/dailyComprehensive/index.vue
@@ -0,0 +1,245 @@
+<template>
+  <div class="page">
+    <div class="form-card">
+      <el-form :model="queryParams" ref="queryRef" :inline="true" label-width="68px">
+        <el-form-item label="鑳芥簮绫诲瀷" prop="energyType">
+          <el-select v-model="queryParams.energyType" placeholder="璇烽�夋嫨鑳芥簮绫诲瀷">
+            <el-option
+              :label="item.enername"
+              :value="item.enersno"
+              v-for="item in energyTypeList"
+              :key="item.enersno"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="缁熻鏃堕棿">
+          <el-date-picker
+            v-model="queryParams.dataTime"
+            type="date"
+            format="YYYY-MM-DD"
+            value-format="YYYY-MM-DD"
+            placeholder="閫夋嫨鏃ユ湡"
+            style="width: 100%"
+            :clearable="false"
+          />
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
+          <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
+        </el-form-item>
+        <!-- <el-form-item>
+          <el-button type="warning" icon="Download" @click="handleExport"> 瀵煎嚭 </el-button>
+        </el-form-item> -->
+      </el-form>
+    </div>
+
+    <div class="table-bg-style">
+      <div class="table-box">
+        <el-table :data="energyList" v-loading="loading" border max-height="380px">
+          <el-table-column fixed prop="indexName" label="鎸囨爣鍚嶇О" width="210px">
+            <template #default="scope">
+              <div style="width: 100%; text-align: left">
+                <el-button
+                  v-if="scope.row.indexId == queryParams.indexId"
+                  icon="search"
+                  circle
+                  @click="selectChange(scope.row)"
+                  style="color: #fff; background: #409eff; margin-right: 8px"
+                ></el-button>
+                <el-button
+                  v-else
+                  icon="search"
+                  circle
+                  @click="selectChange(scope.row)"
+                  style="margin-right: 8px"
+                ></el-button>
+                <el-tooltip
+                  v-if="scope.row.indexName.length > 9"
+                  class="item"
+                  effect="dark"
+                  :content="scope.row.indexName"
+                  placement="top-end"
+                >
+                  <span>
+                    {{ scope.row.indexName.substr(0, 9) + "..." }}
+                  </span>
+                </el-tooltip>
+                <span v-else>{{ scope.row.indexName }}</span>
+              </div>
+            </template>
+          </el-table-column>
+          <el-table-column v-for="index in 24" :key="index" :label="index - 1 + '鏃�'" align="center" min-width="100">
+            <template #default="scope">{{ numFilter(scope.row[`value${index - 1}`]) }}</template>
+          </el-table-column>
+        </el-table>
+
+        <div>
+          <line-chart ref="LineChartRef" :chartData="lineChartData" />
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import {
+  getDataList,
+  getlistChart,
+  exportList,
+} from "@/api/comprehensiveStatistics/dailyComprehensive/dailyComprehensive"
+import { listEnergyTypeList } from "@/api/modelConfiguration/energyType"
+import LineChart from "../comps/LineChart.vue"
+let { proxy } = getCurrentInstance()
+const energyTypeList = ref()
+function getEnergyTypeList() {
+  listEnergyTypeList().then((res) => {
+    energyTypeList.value = res.data
+    // form.value.indexType = alarm_record_category.value[0].value
+    // form.value.energyType = energyTypeList.value[0].enersno
+    getList()
+  })
+}
+getEnergyTypeList()
+function numFilter(value) {
+  // 鎴彇褰撳墠鏁版嵁鍒板皬鏁扮偣鍚庣殑鍑犱綅
+  let realVal = ""
+  if (!isNaN(value) && value !== "" && value !== null) {
+    realVal = parseFloat(value).toFixed(2)
+  } else {
+    realVal = "--"
+  }
+  return realVal
+}
+let loading = ref(false)
+let total = ref(0)
+let queryParams = ref({
+  indexStorageId: "",
+  indexCode: "",
+  pageNum: 1,
+  pageSize: 10,
+  dataTime: "",
+})
+
+const energyList = ref([])
+const lineChartData = ref({})
+function getList() {
+  queryParams.value.indexCode = proxy.$route.query.modelCode
+  getDataList({
+    ...queryParams.value,
+    timeType: "HOUR",
+  }).then((response) => {
+    energyList.value = response.data
+    if (response.data && response.data.length !== 0) {
+      selectChange(response.data[0])
+    }
+  })
+}
+
+const LineChartRef = ref()
+function selectChange(row) {
+  queryParams.value.indexId = row ? row.indexId : undefined
+  queryParams.value.timeType = "HOUR"
+  getlistChart(queryParams.value).then((response) => {
+    let actualData = []
+    let expectedData = []
+    let title = ""
+    response.data.forEach((item) => {
+      expectedData.push(numFilter(item.value))
+      actualData.push(item.timeCode.slice(item.timeCode.length - 2, item.timeCode.length) + "鏃�")
+      title = item.indexName + "(" + (item.unitId || "") + ")"
+    })
+
+    console.log(response)
+    console.log(actualData)
+    console.log(expectedData)
+
+    lineChartData.value = {
+      // xData: [
+      //   "0鏃�",
+      //   "1鏃�",
+      //   "2鏃�",
+      //   "3鏃�",
+      //   "4鏃�",
+      //   "5鏃�",
+      //   "6鏃�",
+      //   "7鏃�",
+      //   "8鏃�",
+      //   "9鏃�",
+      //   "10鏃�",
+      //   "11鏃�",
+      //   "12鏃�",
+      //   "13鏃�",
+      //   "14鏃�",
+      //   "15鏃�",
+      //   "16鏃�",
+      //   "17鏃�",
+      //   "18鏃�",
+      //   "19鏃�",
+      //   "20鏃�",
+      //   "21鏃�",
+      //   "22鏃�",
+      //   "23鏃�",
+      // ],
+      xData: actualData,
+      yData: expectedData,
+      title,
+    }
+    // LineChartRef.value.initChart()
+    // this.lineChartData.actualData = actualData;
+    // this.lineChartData.expectedData = expectedData;
+    // this.lineChartData.title = title;
+    // this.$refs.LineChart.initChart(this.lineChartData);
+    // this.$refs.BarChart.initChart(this.lineChartData);
+  })
+}
+
+function getTime() {
+  var date = new Date()
+  var year = date.getFullYear()
+  var month = date.getMonth() + 1
+  var date = date.getDate()
+  month = month < 10 ? "0" + month : month
+  date = date < 10 ? "0" + date : date
+  queryParams.value.dataTime = year + "-" + month + "-" + date
+}
+getTime()
+
+// 瀵煎嚭鎸夐挳鎿嶄綔
+function handleExport() {
+  exportList(queryParams.value).then((response) => {
+    console.log(response)
+    // download(response.msg);
+  })
+}
+
+function handleQuery() {
+  queryParams.value.pageNum = 1
+  getList()
+}
+
+function resetQuery() {
+  queryParams.value = {
+    limitName: "",
+    pageNum: 1,
+    pageSize: 10,
+    dataTime: null,
+  }
+  getTime()
+  getList()
+}
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/styles/page.scss";
+
+.header-box {
+  :deep .el-form-item__content {
+    color: #fff;
+    font-size: 16px;
+  }
+}
+
+:deep .el-table--fit {
+  border-bottom: 1px solid #eaeaea;
+}
+</style>
diff --git a/zhitan-vue/src/views/comprehensive/monthlyComprehensive/index.vue b/zhitan-vue/src/views/comprehensive/monthlyComprehensive/index.vue
new file mode 100644
index 0000000..c63c0fe
--- /dev/null
+++ b/zhitan-vue/src/views/comprehensive/monthlyComprehensive/index.vue
@@ -0,0 +1,241 @@
+<template>
+  <div class="page">
+    <div class="form-card">
+      <el-form :model="queryParams" ref="queryRef" :inline="true" label-width="68px">
+        <el-form-item label="鑳芥簮绫诲瀷" prop="energyType">
+          <el-select v-model="queryParams.energyType" placeholder="璇烽�夋嫨鑳芥簮绫诲瀷">
+            <el-option
+              :label="item.enername"
+              :value="item.enersno"
+              v-for="item in energyTypeList"
+              :key="item.enersno"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="缁熻鏃堕棿">
+          <el-date-picker
+            style="width: 100%"
+            v-model="queryParams.dataTime"
+            type="month"
+            :clearable="false"
+            value-format="yyyy-MM"
+            placeholder="閫夋嫨鏃ユ湡"
+          >
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
+          <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
+        </el-form-item>
+        <!-- <el-form-item>
+          <el-button type="warning" icon="Download" @click="handleExport"> 瀵煎嚭 </el-button>
+        </el-form-item> -->
+      </el-form>
+    </div>
+
+    <div class="table-bg-style">
+      <div class="table-box">
+        <el-table :data="energyList" v-loading="loading" border max-height="380px">
+          <el-table-column fixed prop="indexName" label="鎸囨爣鍚嶇О" width="210px">
+            <template #default="scope">
+              <div style="width: 100%; text-align: left">
+                <el-button
+                  v-if="scope.row.indexId == queryParams.indexId"
+                  icon="search"
+                  circle
+                  @click="selectChange(scope.row)"
+                  style="color: #fff; background: #409eff; margin-right: 8px"
+                ></el-button>
+                <el-button
+                  v-else
+                  icon="search"
+                  circle
+                  @click="selectChange(scope.row)"
+                  style="margin-right: 8px"
+                ></el-button>
+                <el-tooltip
+                  v-if="scope.row.indexName.length > 9"
+                  class="item"
+                  effect="dark"
+                  :content="scope.row.indexName"
+                  placement="top-end"
+                >
+                  <span>
+                    {{ scope.row.indexName.substr(0, 9) + "..." }}
+                  </span>
+                </el-tooltip>
+                <span v-else>{{ scope.row.indexName }}</span>
+              </div>
+            </template>
+          </el-table-column>
+          <el-table-column v-for="index in 31" :key="index" :label="index + '鏃�'" align="center" min-width="100">
+            <template #default="scope">{{ numFilter(scope.row[`value${index - 1}`]) }}</template>
+          </el-table-column>
+        </el-table>
+
+        <div>
+          <line-chart ref="LineChartRef" :chartData="lineChartData" />
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { getDataList, getlistChart } from "@/api/comprehensiveStatistics/monthlyComprehensive/monthlyComprehensive"
+import { listEnergyTypeList } from "@/api/modelConfiguration/energyType"
+import LineChart from "../comps/LineChart.vue"
+let { proxy } = getCurrentInstance()
+const energyTypeList = ref()
+function getEnergyTypeList() {
+  listEnergyTypeList().then((res) => {
+    energyTypeList.value = res.data
+    // form.value.indexType = alarm_record_category.value[0].value
+    // form.value.energyType = energyTypeList.value[0].enersno
+    getList()
+  })
+}
+getEnergyTypeList()
+function numFilter(value) {
+  // 鎴彇褰撳墠鏁版嵁鍒板皬鏁扮偣鍚庣殑鍑犱綅
+  let realVal = ""
+  if (!isNaN(value) && value !== "" && value !== null) {
+    realVal = parseFloat(value).toFixed(2)
+  } else {
+    realVal = "--"
+  }
+  return realVal
+}
+let loading = ref(false)
+let total = ref(0)
+let queryParams = ref({
+  indexStorageId: "",
+  indexCode: "",
+  pageNum: 1,
+  pageSize: 10,
+  dataTime: "",
+  timeType: "DAY",
+})
+
+const energyList = ref([])
+const lineChartData = ref({})
+function getList() {
+  queryParams.value.indexCode = proxy.$route.query.modelCode
+  getDataList({
+    ...queryParams.value,
+  }).then((response) => {
+    energyList.value = response.data.tabledata
+    if (energyList.value && energyList.value.length !== 0) {
+      selectChange(energyList.value[0])
+    }
+  })
+}
+
+const LineChartRef = ref()
+function selectChange(row) {
+  queryParams.value.indexId = row ? row.indexId : undefined
+  getlistChart(queryParams.value).then((response) => {
+    let actualData = []
+    let expectedData = []
+    let title = ""
+    response.data.forEach((item) => {
+      expectedData.push(numFilter(item.value))
+      actualData.push(item.timeCode.slice(item.timeCode.length - 2, item.timeCode.length) + "鏃�")
+      title = item.indexName + "(" + (item.unitId || "") + ")"
+    })
+
+    console.log(response)
+    console.log(actualData)
+    console.log(expectedData)
+
+    lineChartData.value = {
+      // xData: [
+      //   "0鏃�",
+      //   "1鏃�",
+      //   "2鏃�",
+      //   "3鏃�",
+      //   "4鏃�",
+      //   "5鏃�",
+      //   "6鏃�",
+      //   "7鏃�",
+      //   "8鏃�",
+      //   "9鏃�",
+      //   "10鏃�",
+      //   "11鏃�",
+      //   "12鏃�",
+      //   "13鏃�",
+      //   "14鏃�",
+      //   "15鏃�",
+      //   "16鏃�",
+      //   "17鏃�",
+      //   "18鏃�",
+      //   "19鏃�",
+      //   "20鏃�",
+      //   "21鏃�",
+      //   "22鏃�",
+      //   "23鏃�",
+      // ],
+      xData: actualData,
+      yData: expectedData,
+      title,
+    }
+    // LineChartRef.value.initChart()
+    // this.lineChartData.actualData = actualData;
+    // this.lineChartData.expectedData = expectedData;
+    // this.lineChartData.title = title;
+    // this.$refs.LineChart.initChart(this.lineChartData);
+    // this.$refs.BarChart.initChart(this.lineChartData);
+  })
+}
+
+function getTime() {
+  var date = new Date()
+  var year = date.getFullYear()
+  var month = date.getMonth() + 1
+  var date = date.getDate()
+  month = month < 10 ? "0" + month : month
+  date = date < 10 ? "0" + date : date
+  queryParams.value.dataTime = year + "-" + month
+}
+getTime()
+
+// 瀵煎嚭鎸夐挳鎿嶄綔
+function handleExport() {
+  exportList(queryParams.value).then((response) => {
+    console.log(response)
+    // download(response.msg);
+  })
+}
+
+function handleQuery() {
+  queryParams.value.pageNum = 1
+  getList()
+}
+
+function resetQuery() {
+  queryParams.value = {
+    limitName: "",
+    pageNum: 1,
+    pageSize: 10,
+    dataTime: null,
+    timeType: "DAY",
+  }
+  getTime()
+  getList()
+}
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/styles/page.scss";
+
+.header-box {
+  :deep .el-form-item__content {
+    color: #fff;
+    font-size: 16px;
+  }
+}
+
+:deep .el-table--fit {
+  border-bottom: 1px solid #eaeaea;
+}
+</style>
diff --git a/zhitan-vue/src/views/comprehensive/yearComprehensive/index.vue b/zhitan-vue/src/views/comprehensive/yearComprehensive/index.vue
new file mode 100644
index 0000000..494e37a
--- /dev/null
+++ b/zhitan-vue/src/views/comprehensive/yearComprehensive/index.vue
@@ -0,0 +1,245 @@
+<template>
+  <div class="page">
+    <div class="form-card">
+      <el-form :model="queryParams" ref="queryRef" :inline="true" label-width="68px">
+        <el-form-item label="鑳芥簮绫诲瀷" prop="energyType">
+          <el-select v-model="queryParams.energyType" placeholder="璇烽�夋嫨鑳芥簮绫诲瀷">
+            <el-option
+              :label="item.enername"
+              :value="item.enersno"
+              v-for="item in energyTypeList"
+              :key="item.enersno"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="缁熻鏃堕棿">
+          <el-date-picker
+            style="width: 100%"
+            v-model="queryParams.dataTime"
+            type="year"
+            :clearable="false"
+            value-format="YYYY"
+            placeholder="閫夋嫨鏃ユ湡"
+          >
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
+          <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
+        </el-form-item>
+        <!-- <el-form-item>
+          <el-button type="warning" icon="Download" @click="handleExport"> 瀵煎嚭 </el-button>
+        </el-form-item> -->
+      </el-form>
+    </div>
+
+    <div class="table-bg-style">
+      <div class="table-box">
+        <el-table :data="energyList" v-loading="loading" border max-height="380px">
+          <el-table-column fixed prop="indexName" label="鎸囨爣鍚嶇О" width="210px">
+            <template #default="scope">
+              <div style="width: 100%; text-align: left">
+                <el-button
+                  v-if="scope.row.indexId == queryParams.indexId"
+                  icon="search"
+                  circle
+                  @click="selectChange(scope.row)"
+                  style="color: #fff; background: #409eff; margin-right: 8px"
+                ></el-button>
+                <el-button
+                  v-else
+                  icon="search"
+                  circle
+                  @click="selectChange(scope.row)"
+                  style="margin-right: 8px"
+                ></el-button>
+                <el-tooltip
+                  v-if="scope.row.indexName.length > 9"
+                  class="item"
+                  effect="dark"
+                  :content="scope.row.indexName"
+                  placement="top-end"
+                >
+                  <span>
+                    {{ scope.row.indexName.substr(0, 9) + "..." }}
+                  </span>
+                </el-tooltip>
+                <span v-else>{{ scope.row.indexName }}</span>
+              </div>
+            </template>
+          </el-table-column>
+          <el-table-column v-for="index in 12" :key="index" :label="index + '鏈�'" align="center" min-width="100">
+            <template #default="scope">{{ numFilter(scope.row[`value${index - 1}`]) }}</template>
+          </el-table-column>
+        </el-table>
+
+        <div>
+          <line-chart ref="LineChartRef" :chartData="lineChartData" />
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { getDataList, getlistChart } from "@/api/comprehensiveStatistics/yearComprehensive/yearComprehensive"
+import { listEnergyTypeList } from "@/api/modelConfiguration/energyType"
+import LineChart from "../comps/LineChart.vue"
+let { proxy } = getCurrentInstance()
+const energyTypeList = ref()
+function getEnergyTypeList() {
+  listEnergyTypeList().then((res) => {
+    energyTypeList.value = res.data
+    // form.value.indexType = alarm_record_category.value[0].value
+    // form.value.energyType = energyTypeList.value[0].enersno
+    getList()
+  })
+}
+getEnergyTypeList()
+function numFilter(value) {
+  // 鎴彇褰撳墠鏁版嵁鍒板皬鏁扮偣鍚庣殑鍑犱綅
+  let realVal = ""
+  if (!isNaN(value) && value !== "" && value !== null) {
+    realVal = parseFloat(value).toFixed(2)
+  } else {
+    realVal = "--"
+  }
+  return realVal
+}
+let loading = ref(false)
+let queryParams = ref({
+  indexStorageId: "",
+  indexCode: "",
+  pageNum: 1,
+  pageSize: 10,
+  dataTime: "2025-01-0",
+  timeType: "MONTH",
+})
+
+const energyList = ref([])
+const lineChartData = ref({})
+function getList() {
+  queryParams.value.indexCode = proxy.$route.query.modelCode
+  getDataList({
+    ...queryParams.value,
+    dataTime: queryParams.value.dataTime ? queryParams.value.dataTime + "-01" : "",
+  }).then((response) => {
+    energyList.value = response.data
+    if (response.data && response.data.length !== 0) {
+      selectChange(response.data[0])
+    }
+  })
+}
+
+const LineChartRef = ref()
+function selectChange(row) {
+  queryParams.value.indexId = row ? row.indexId : undefined
+  getlistChart({
+    ...queryParams.value,
+    dataTime: queryParams.value.dataTime ? queryParams.value.dataTime + "-01" : "",
+  }).then((response) => {
+    let actualData = []
+    let expectedData = []
+    let title = ""
+    response.data.forEach((item) => {
+      expectedData.push(numFilter(item.value))
+      actualData.push(item.timeCode.slice(item.timeCode.length - 2, item.timeCode.length) + "鏃�")
+      title = item.indexName + "(" + (item.unitId || "") + ")"
+    })
+
+    console.log(response)
+    console.log(actualData)
+    console.log(expectedData)
+
+    lineChartData.value = {
+      // xData: [
+      //   "0鏃�",
+      //   "1鏃�",
+      //   "2鏃�",
+      //   "3鏃�",
+      //   "4鏃�",
+      //   "5鏃�",
+      //   "6鏃�",
+      //   "7鏃�",
+      //   "8鏃�",
+      //   "9鏃�",
+      //   "10鏃�",
+      //   "11鏃�",
+      //   "12鏃�",
+      //   "13鏃�",
+      //   "14鏃�",
+      //   "15鏃�",
+      //   "16鏃�",
+      //   "17鏃�",
+      //   "18鏃�",
+      //   "19鏃�",
+      //   "20鏃�",
+      //   "21鏃�",
+      //   "22鏃�",
+      //   "23鏃�",
+      // ],
+      xData: actualData,
+      yData: expectedData,
+      title,
+    }
+    // LineChartRef.value.initChart()
+    // this.lineChartData.actualData = actualData;
+    // this.lineChartData.expectedData = expectedData;
+    // this.lineChartData.title = title;
+    // this.$refs.LineChart.initChart(this.lineChartData);
+    // this.$refs.BarChart.initChart(this.lineChartData);
+  })
+}
+
+function getTime() {
+  var date = new Date()
+  var year = date.getFullYear()
+  var month = date.getMonth() + 1
+  var date = date.getDate()
+  month = month < 10 ? "0" + month : month
+  date = date < 10 ? "0" + date : date
+  queryParams.value.dataTime = year + ""
+}
+
+// 瀵煎嚭鎸夐挳鎿嶄綔
+function handleExport() {
+  exportList(queryParams.value).then((response) => {
+    console.log(response)
+    // download(response.msg);
+  })
+}
+
+function handleQuery() {
+  queryParams.value.pageNum = 1
+  getList()
+}
+
+function resetQuery() {
+  queryParams.value = {
+    limitName: "",
+    pageNum: 1,
+    pageSize: 10,
+    dataTime: null,
+    timeType: "MONTH",
+  }
+  getTime()
+  getList()
+}
+
+getTime()
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/styles/page.scss";
+
+.header-box {
+  :deep .el-form-item__content {
+    color: #fff;
+    font-size: 16px;
+  }
+}
+
+:deep .el-table--fit {
+  border-bottom: 1px solid #eaeaea;
+}
+</style>

--
Gitblit v1.9.3