对接脱硫系统首页、实时监控、能效分析

2、优化备件库寸管理，设备类型id没有替换从字典获取；
3、优化用户管理，左边树形结构点击；

.env.development

@@ -7,9 +7,9 @@ ENV = 'development'
 # 开发环境
 # VUE_APP_BASE_API = '/dev-api'
 # 后台
-# VUE_APP_BASE_API = 'http://192.168.1.222:8080'
-# 海湾酒店-云端
-VUE_APP_BASE_API = 'http://106.55.173.225:8090'
+VUE_APP_BASE_API = 'http://192.168.1.222:8080'
+# 梅州云端
+# VUE_APP_BASE_API = 'http://106.55.173.225:8091'
 
 # 路由懒加载
 VUE_CLI_BABEL_TRANSPILE_MODULES = true

.env.production

@@ -7,4 +7,4 @@ ENV = 'production'
 # 生产环境
 # VUE_APP_BASE_API = '/prod-api'
 # 后台
-VUE_APP_BASE_API = 'http://106.55.173.225:8090'
+VUE_APP_BASE_API = 'http://106.55.173.225:8091'

package.json

@@ -59,7 +59,8 @@
     "vue-meta": "2.4.0",
     "vue-router": "3.4.9",
     "vuedraggable": "2.24.3",
-    "vuex": "3.6.0"
+    "vuex": "3.6.0",
+    "xlsx": "^0.18.5"
   },
   "devDependencies": {
     "@vue/cli-plugin-babel": "4.4.6",
@@ -72,6 +73,7 @@
     "connect": "3.6.6",
     "eslint": "7.15.0",
     "eslint-plugin-vue": "7.2.0",
+    "html-webpack-plugin": "^5.6.3",
     "lint-staged": "10.5.3",
     "runjs": "4.4.2",
     "sass": "1.32.13",

src/App.vue

@@ -7,18 +7,37 @@
 
 <script>
 import ThemePicker from "@/components/ThemePicker";
+import { exitFullscreen, isFullscreen } from "@/utils/fullscreen";
 
 export default {
   name: "App",
   components: { ThemePicker },
   metaInfo() {
     return {
-      title: this.$store.state.settings.dynamicTitle && this.$store.state.settings.title,
-      titleTemplate: title => {
-        return title ? `${title} - ${process.env.VUE_APP_TITLE}` : process.env.VUE_APP_TITLE
+      title:
+        this.$store.state.settings.dynamicTitle &&
+        this.$store.state.settings.title,
+      titleTemplate: (title) => {
+        return title
+          ? `${title} - ${process.env.VUE_APP_TITLE}`
+          : process.env.VUE_APP_TITLE;
+      },
+    };
+  },
+  mounted() {
+    // 监听键盘事件，当用户按 Esc 键时退出全屏
+    window.addEventListener("keydown", this.handleKeyDown);
+  },
+  beforeDestroy() {
+    window.removeEventListener("keydown", this.handleKeyDown);
+  },
+  methods: {
+    handleKeyDown(event) {
+      if (event.key === "Escape" && isFullscreen()) {
+        exitFullscreen();
       }
-    }
-  }
+    },
+  },
 };
 </script>
 <style scoped>

src/api/boiler/boilerRunReport.js

@@ -0,0 +1,27 @@
+import request from "@/utils/request";
+
+// 查询运行记录
+export function boilerSysList(data) {
+  return request({
+    url: "/reportSteam/list",
+    method: "post",
+    data,
+  });
+}
+// 编辑运行记录
+export function boilerSysEdit(data) {
+  return request({
+    url: "/reportSteam/edit",
+    method: "put",
+    data,
+  });
+}
+// 导出
+export function boilerSysExport(data) {
+  return request({
+    url: "/reportSteam/export",
+    method: "post",
+    data,
+    responseType: "blob",
+  });
+}

src/api/boiler/heatingPump.js

@@ -0,0 +1,27 @@
+import request from "@/utils/request";
+
+// 采暖泵列表
+export function heatPumpList(query) {
+  return request({
+    url: "/device/heatPump/list",
+    method: "get",
+    params: query,
+  });
+}
+// 采暖泵在线情况
+export function heatPumpOnlineList(query) {
+  return request({
+    url: "/device/heatPump/online",
+    method: "get",
+    params: query,
+  });
+}
+// 采暖泵报警列表
+export function heatPumpAlarmList(query) {
+  return request({
+    url: "/device/heatPump/alarmList",
+    method: "get",
+    params: query,
+  });
+}
+

src/api/boiler/heatingRunPeport.js

@@ -0,0 +1,27 @@
+import request from "@/utils/request";
+
+// 查询运行记录
+export function boilerSysList(data) {
+  return request({
+    url: "/reportHeating/list",
+    method: "post",
+    data,
+  });
+}
+// 编辑运行记录
+export function boilerSysEdit(data) {
+  return request({
+    url: "/reportHeating/edit",
+    method: "put",
+    data,
+  });
+}
+// 导出
+export function boilerSysExport(data) {
+  return request({
+    url: "/reportHeating/export",
+    method: "post",
+    data,
+    responseType: "blob",
+  });
+}

src/api/boiler/hotwaterBoiler.js

@@ -0,0 +1,10 @@
+import request from "@/utils/request";
+
+// 热水锅炉设备参数列表
+export function hotWaterBoiler(query) {
+  return request({
+    url: "/device/hotWaterBoiler/list",
+    method: "get",
+    params: query,
+  });
+}

src/api/boiler/steamBoiler.js

@@ -0,0 +1,10 @@
+import request from "@/utils/request";
+
+// 蒸汽锅炉设备参数列表
+export function steamBoilerBoiler(query) {
+  return request({
+    url: "/device/steamBoiler/list",
+    method: "get",
+    params: query,
+  });
+}

src/api/centerairC/hostRunReport.js

@@ -0,0 +1,27 @@
+import request from "@/utils/request";
+
+// 查询运行记录
+export function reportSysList(data) {
+  return request({
+    url: "/reportSys/list",
+    method: "post",
+    data,
+  });
+}
+// 编辑运行记录
+export function reportSysEdit(data) {
+  return request({
+    url: "/reportSys/edit",
+    method: "put",
+    data,
+  });
+}
+// 导出
+export function reportSysExport(data) {
+  return request({
+    url: "/reportSys/export",
+    method: "post",
+    data,
+      responseType: 'blob',
+  });
+}

src/api/comprehensiveEnergy/hotPumpLog.js

@@ -1,27 +1,27 @@
 import request from "@/utils/request";
 
 export const hotWaterList = (data) => {
-    return request({
-        url: "/reportHotWater/list",
-        method: "post",
-        data: data,
-    });
+  return request({
+    url: "/reportHotWater/list",
+    method: "post",
+    data: data,
+  });
 };
 
 // 导出
 export const hotWaterExport = (data) => {
-    return request({
-        url: "/reportHotWater/export",
-        method: "post",
-        data,
-        responseType: "blob",
-    });
+  return request({
+    url: "/reportHotWater/export",
+    method: "post",
+    data,
+    responseType: "blob",
+  });
 };
 // 修改
 export const hotWaterEdit = (data) => {
-    return request({
-        url: "/reportHotWater/edit",
-        method: "put",
-        data: data,
-    });
+  return request({
+    url: "/reportHotWater/edit",
+    method: "put",
+    data: data,
+  });
 };

src/api/comprehensiveEnergy/meterRecord.js

@@ -1,19 +1,19 @@
 import request from "@/utils/request";
 
 export const meterReadingsList = (data) => {
-    return request({
-        url: "/reportMeterReadings/list",
-        method: "post",
-        data: data,
-    });
+  return request({
+    url: "/reportMeterReadings/list",
+    method: "post",
+    data: data,
+  });
 };
 
 // 导出
 export const meterReadingsExport = (data) => {
-    return request({
-        url: "/reportMeterReadings/export",
-        method: "post",
-        data,
-        responseType: "blob",
-    });
+  return request({
+    url: "/reportMeterReadings/export",
+    method: "post",
+    data,
+    responseType: "blob",
+  });
 };

src/api/comprehensiveEnergy/systemEnergy.js

@@ -1,9 +1,9 @@
 import request from "@/utils/request";
 
 export const compreReport = (data) => {
-    return request({
-        url: "/compre/report",
-        method: "post",
-        data,
-    });
+  return request({
+    url: "/compre/report",
+    method: "post",
+    data,
+  });
 };

src/api/desulfurization/energyAnalysis.js

@@ -0,0 +1,10 @@
+import request from "@/utils/request";
+
+// so2浓度与小苏打用量
+export function fgdScrEnergy(data) {
+  return request({
+    url: '/fgdScr/energy/sys/query',
+    method: 'post',
+    data: data
+  })
+}

src/api/hotWater/profitAnalysis.js

@@ -1,18 +0,0 @@
-import request from "@/utils/request";
-
-// 顶部
-export function waternErgySum(query) {
-  return request({
-    url: "/hot_water_revenue/energySum",
-    method: "get",
-    params: query,
-  });
-}
-// 数据列表
-export function waterRevenueQuery(query) {
-  return request({
-    url: "/hot_water_revenue/query",
-    method: "get",
-    params: query,
-  });
-}

src/assets/icons/svg/boilerSys.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1757379307805" class="icon" viewBox="0 0 1335 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1517" xmlns:xlink="http://www.w3.org/1999/xlink" width="260.7421875" height="200"><path d="M1233.548986 825.047188V692.461449C1293.801739 651.456928 1335.652174 562.176 1335.652174 458.722319c0-137.676058-73.935768-250.078609-167.179131-257.335652v-0.415537l-165.917681-25.822608V115.533913h-56.750376v50.665739L810.889275 139.664696V75.790841h-60.697971v54.494608L514.285449 87.010319V0h-66.337391v76.636754l-105.768812-16.458203v0.296811c60.549565 8.221681 103.231072 167.045565 96.048232 359.780174-7.182841 192.734609-61.677449 347.863188-122.672232 351.573334l87.188406-2.849392v40.158609l-159.016811 8.102956v66.841971l370.554434-30.660637 1.409855 25.555478-195.628521 13.341681 23.240348 11.353044v113.975652l861.792463-106.733449v-84.027363l-34.934724-4.541217-36.61171 2.700985z m-553.360696-32.218898v-34.489507l160.975768-6.678261v32.085333l-160.975768 9.082435zM528.517565 204.503188l27.870609-13.623652v-0.845913l1.409855 0.148406 0.430377-0.148406v0.281971l147.737971 23.552v295.787594l-145.91258-4.11084-31.551072 3.546898V204.503188z m-53.099594 600.791189l8.310725-39.179131 125.19513-4.11084 2.122203 36.478145-135.642899 6.826666z m204.770319 38.882319l269.148753-24.976696v-40.870957l-43.52742 2.270609 4.927073-31.22458 231.824695-14.766376 15.909102 93.822145-478.133797 42.859594-0.148406-27.098899z m-406.854493-73.579595c-56.008348-2.122203-97.458087-133.179362-99.980985-302.955594l-35.008928-2.700985c-21.563362 8.934029-17.066667 54.895304-17.066667 54.895304H0c0-138.150957 105.160348-144.814377 105.160348-144.814377l70.848927 1.27629c12.184116-180.134957 65.402435-319.280232 123.785276-316.994782 62.033623 2.404174 106.421797 163.528348 99.135072 359.973101-7.271884 196.429913-63.562203 353.740058-125.595826 351.321043zM250.227014 320.853333c-11.620174 0-21.696928 22.973217-26.742724 56.869102l30.942609 0.712348-0.281971 92.620058-30.245102-1.27629c4.897391 32.204058 14.988986 54.168116 26.327188 54.168116 16.384 0 29.681159-45.516058 29.68116-101.539247 0-56.023188-13.297159-101.554087-29.68116-101.554087z" fill="" p-id="1518"></path></svg>

src/assets/icons/svg/denitrification.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1777360300715" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6462" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M1007.2 133.6c-5.2 4.2-6.5 8.3-6.1 14.7 1.1 16-2.9 30.4-16.9 40.1-7 4.8-14.8 7-23.2 8.1-12.6 1.8-25.3 1.1-37.6-2-20.6-5.5-39.1-21.6-37-50.1l-0.6-0.1-0.5 0.2c-6.5 16.3-21.9 24.5-41.5 21.9-9.3-1-18.3-3.3-27-6.8-3.6-1.5-6.3-1-9.5 1.5-12.9 10.1-27 17.7-43.5 20.1-8.2 1.2-16.6 0.1-24.3-3.2-1.8-0.7-3.2-1.8-4.2 1.1-5.5 15.1-17.1 24.4-30.7 31.2-4.9 2.4-6.4 5.1-6 10.5 0.7 7.7-0.2 15.4-4.6 22.3-1.4 2.3-3.3 4.3-5.7 5.6-6.7 3.7-8.8 2.7-9.8-4.8-3.4-24.6-4.4-49.2 1.4-73.6 2.6-10.9 7.1-21 15.8-28.5 2.1-1.8 2.6-3.9 3.1-6.5 2.8-16.7 8.4-32.4 19.6-45.4 17-19.6 39.2-26.4 64.1-25.2 6.9 0.3 10.9-1 14.9-7.1 18.8-28.5 49.5-40 82.3-31.5 4.5 1.4 9.4 0.9 13.6-1.3 15.3-7.6 31.4-12.8 48.6-13.8 33.3-1.8 55.7 12.5 68.9 43.4 5.4 12.7 8.3 26.3 11.8 39.5 4.4 16.2-2.9 29.7-15.4 39.7zM736.3 276.4c-0.2 94.5-0.1 189-0.3 283.4 0 4.9 1.1 7.6 5.9 9.9 34.1 16.4 68 33.4 102.1 50 4.2 2.1 5.4 4.4 5.4 9-0.1 125.9-0.1 251.8 0 377.7 0 5.1-1 6.6-6.3 6.6-278.9-0.1-557.8-0.1-836.7 0-5.2 0-6.4-1.3-6.4-6.5 0.1-243.4 0.1-486.8 0-730.2 0-5.6 1.4-6.9 6.8-6.9 40 0.2 80 0.1 120 0 3.7 0 7.4 0.9 10.7 2.6 147.1 72.5 294.2 144.9 441.4 217.3 1.8 0.9 3.7 1.7 6.5 3v-7.9c0-94.1 0.1-188.1-0.2-282.2 0-6.3 1.8-7.6 7.6-7.4 14.5 0.4 29 0.3 43.5 0 4.3-0.1 5.6 1 5.6 5.5-0.2 20.7 0.1 41.5-0.2 62.2-0.1 5.4 1 7.1 6.7 7 26.9-0.4 53.9 0 80.8-0.3 5.5 0.1 7.1 1.3 7.1 7.2z m-566 370.9c0-5.4-1.6-6.4-6.6-6.4-20.9 0.3-41.8 0.3-62.8 0-5-0.1-6.6 1-6.5 6.4 0.2 47.5 0.1 95.1 0.1 142.6s0.1 95.1-0.1 142.6c0 5.1 1.4 6.2 6.2 6.1 21.1-0.3 42.2-0.3 63.4 0 4.7 0 6.3-0.9 6.3-6.1-0.2-95-0.2-190.1 0-285.2z m107.2-6.3c-21.1 0.2-42.2 0.3-63.4 0-5.1-0.1-6.6 1.1-6.5 6.4 0.2 47.3 0.1 94.7 0.1 142 0 47.8 0 95.5-0.1 143.2 0 4.4 0.6 6.2 5.6 6.1 21.5-0.3 43.1-0.2 64.6 0 4.3 0 5.6-1 5.6-5.5-0.1-95.5-0.1-191 0-286.5 0.1-5-1.5-5.8-5.9-5.7z m119.2 5.1c0-4.3-1.3-5.1-5.3-5.1-21.3 0.2-42.7 0.3-64-0.1-5.9-0.1-6.6 1.9-6.6 7.1 0.2 47.3 0.1 94.7 0.1 142s0.1 94.7-0.2 142c0 5.8 1.6 6.9 6.9 6.8 21.1-0.3 42.3-0.2 63.4 0 4.2 0 5.6-0.9 5.6-5.5 0-95.8 0-191.5 0.1-287.2z" p-id="6463"></path></svg>

src/assets/icons/svg/desulfurization.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1777360269810" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4784" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M480 418.88H246.08A84.8 84.8 0 0 1 160 337.28v-160A84.8 84.8 0 0 1 246.08 96H771.2a84.8 84.8 0 0 1 87.36 81.6v160a84.8 84.8 0 0 1-87.36 81.6z m29.44-54.72h262.4a27.84 27.84 0 0 0 29.12-26.88v-160a27.84 27.84 0 0 0-29.12-26.88H246.08a27.84 27.84 0 0 0-29.12 26.88v160a27.84 27.84 0 0 0 29.12 26.88z m104-32l-80-83.2a32 32 0 0 0-40.64 0l-92.8 82.88a32 32 0 0 1-40.96 0L277.44 243.84a17.28 17.28 0 0 1 5.76-27.52 32 32 0 0 1 36.8 4.8l42.56 44.8a32 32 0 0 0 40.96 0l91.52-84.48a32 32 0 0 1 40.96 0l77.44 80.64a32 32 0 0 0 41.6 0l44.8-46.72A32 32 0 0 1 736 212.8a16.64 16.64 0 0 1 5.76 27.2l-86.08 90.56a32 32 0 0 1-42.88 0.32z m132.16 449.28h43.52v73.6H745.6z m0-88.96h43.52V768H745.6z m0 206.08H704V928h86.72v-59.2H745.6z m-221.44 0H672V928h-147.84z m-178.24 0h148.48V928h-148.48z m-72.96-29.76H229.44V928h86.72v-29.44H272.96z m-43.52-87.36h43.52v73.6H229.44z m0-88.96h43.52V768H229.44z m653.76-24l-93.44-74.88v-89.28h101.76c20.48 0 36.8-25.92 36.8-40V480c0-13.76-16.64-40.96-36.8-40.96H132.48c-20.48 0-36.8 11.84-36.8 25.92V480c0 13.76 16.64 24.96 36.8 24.96h96v88.64l-89.6 75.2c-7.68 5.44-1.92 14.08 8.96 14.08H272V505.6h100.48v353.92c0 5.76 6.4 9.92 14.4 9.92s14.72-4.48 14.72-9.92v-24.64h212.48v24.64c0 5.76 6.72 9.92 14.4 9.92s14.72-4.48 14.72-9.92v-355.2h102.08v178.24h128c12.16 0 17.28-8.64 9.92-14.08z" p-id="4785"></path></svg>

src/assets/icons/svg/elect.svg

@@ -1 +0,0 @@
-<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1778635796144" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="9277" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M799.256365 357.474588c-6.383475-12.76695-12.76695-19.150424-25.533899-19.150425h-191.504243L760.955516 38.300849c6.383475-12.76695 6.383475-31.917374-12.766949-38.300849H467.315677c-12.76695 0-25.533899 6.383475-25.5339 19.150424l-204.271193 510.677983c-6.383475 12.76695 0 31.917374 12.76695 38.300848h140.436445l-153.203395 414.925861c-6.383475 12.76695 0 31.917374 19.150425 38.300849 12.76695 6.383475 25.533899 0 31.917374-6.383475l510.677982-625.580528c0-12.76695 6.383475-25.533899 0-31.917374z" p-id="9278"></path></svg>

src/assets/icons/svg/heatingPump.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1757380960233" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3007" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M428.8 704h153.6c236.8-134.4 57.6-339.2 25.6-358.4 12.8 25.6 12.8 64-6.4 76.8-38.4-128-121.6-160-121.6-160 12.8 70.4-38.4 147.2-83.2 204.8 0-25.6-6.4-44.8-19.2-70.4-6.4 44.8-44.8 89.6-51.2 140.8-19.2 64 6.4 115.2 102.4 166.4z m0 0" fill="" p-id="3008"></path><path d="M1024 76.8H512c-57.6 0-115.2 12.8-166.4 32-51.2 25.6-102.4 57.6-140.8 96-38.4 38.4-70.4 83.2-96 140.8-19.2 51.2-32 108.8-32 166.4 0 57.6 12.8 115.2 32 166.4 6.4 19.2 12.8 32 25.6 51.2H0v217.6h512c57.6 0 115.2-12.8 166.4-32s96-51.2 140.8-96c38.4-38.4 70.4-83.2 96-140.8 25.6-51.2 32-108.8 32-166.4 0-76.8-19.2-153.6-57.6-217.6H1024V76.8M460.8 896H51.2v-115.2h185.6c-12.8-12.8-32-32-44.8-51.2-38.4-64-64-134.4-64-217.6 0-211.2 172.8-384 384-384h460.8v115.2h-179.2l32 38.4C870.4 352 896 428.8 896 512c0 211.2-172.8 384-384 384h-51.2z m0 0" fill="" p-id="3009"></path></svg>

src/assets/icons/svg/hz-icon.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1758105515572" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7076" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M480.256 16.384C219.648 16.384 8.192 227.84 8.192 488.448c0 260.608 211.456 472.064 472.064 472.064 260.608 0 472.064-211.456 472.064-472.064 0.512-260.608-210.944-472.064-472.064-472.064z m0 881.664c-225.792 0-409.088-183.296-409.088-409.088 0-225.792 183.296-409.088 409.088-409.088 225.792 0 409.088 183.296 409.088 409.088 0.512 225.792-182.784 409.088-409.088 409.088z" p-id="7077"></path><path d="M203.264 281.088h50.688v160.256h199.68V281.088h50.688v383.488h-50.688V484.864h-199.68v179.712h-50.688V281.088zM562.176 625.664l160.768-199.68h-152.576v-40.448H778.24v40.448l-158.72 198.144h165.888l-7.68 40.448h-215.552v-38.912z" p-id="7078"></path></svg>

src/assets/icons/svg/income.svg

@@ -1 +0,0 @@
-<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1778635839438" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="12219" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M851.564767 353.359585c-21.222798-21.222798-46.690155-46.690155-72.157513-67.912953 42.445596-21.222798 72.157513-63.668394 72.157513-110.358549 0-67.912953-67.912953-127.336788-148.559586-127.336788-16.978238 0-33.956477 4.24456-50.934715 8.48912-4.24456 0-8.489119 4.24456-12.733678 4.244559l-25.467358-25.467357c-55.179275-46.690155-127.336788-46.690155-182.516062 0-8.489119 12.733679-16.978238 25.467358-25.467358 33.956476-4.24456 0-8.489119-4.24456-12.733678-4.244559-16.978238-8.489119-33.956477-12.733679-50.934715-12.733679-80.646632 0-148.559585 55.179275-148.559586 127.336787 4.24456 38.201036 21.222798 76.402073 55.179275 97.624871C223.369948 298.180311 197.902591 323.647668 172.435233 344.870466c-80.646632 84.891192-118.847668 174.026943-118.847668 267.407254 0 246.184456 178.271503 407.47772 454.167875 407.47772 110.358549 0 207.98342-25.467358 284.385493-67.912953 118.847668-67.912953 178.271503-182.516062 178.271502-339.564767 0-84.891192-42.445596-174.026943-118.847668-258.918135zM304.01658 344.870466c8.489119-4.24456 16.978238-12.733679 21.222798-16.978238l8.489119-4.24456c21.222798-12.733679 29.711917-33.956477 29.711918-50.934715 0-16.978238-8.489119-33.956477-25.467358-42.445595L320.994819 217.533679c-25.467358-4.24456-38.201036-21.222798-38.201037-38.201037 0-21.222798 25.467358-42.445596 63.668394-42.445595 8.489119 0 12.733679 0 21.222798 4.244559 4.24456 0 4.24456 0 4.24456 4.24456l4.244559 4.244559c29.711917 16.978238 72.157513 4.24456 97.624871-21.222798l4.244559-4.244559c0-4.24456 8.489119-8.489119 12.733679-16.978238 21.222798-21.222798 46.690155-21.222798 67.912953 0 8.489119 8.489119 12.733679 12.733679 12.733679 16.978238l4.24456 4.244559c21.222798 25.467358 63.668394 33.956477 97.62487 16.978239l4.24456-4.24456s4.24456 0 4.244559-4.244559c8.489119-4.24456 12.733679-4.24456 21.222798-4.24456 38.201036 0 63.668394 21.222798 63.668394 42.445596 0 16.978238-16.978238 29.711917-38.201036 38.201036H724.227979c-8.489119 4.24456-12.733679 4.24456-12.733678 4.24456-25.467358 8.489119-42.445596 25.467358-46.690156 46.690155-4.24456 21.222798 8.489119 42.445596 25.467358 55.179275l8.489119 4.244559c8.489119 4.24456 12.733679 8.489119 21.222798 16.978239 25.467358 21.222798 46.690155 38.201036 67.912953 63.668394 63.668394 67.912953 97.62487 135.825907 97.624871 203.73886 0 267.407254-203.73886 322.586528-377.765804 322.586528-178.271503 0-369.276684-84.891192-369.276684-322.586528 0-72.157513 33.956477-144.315026 97.624871-212.22798 21.222798-12.733679 42.445596-33.956477 67.912953-50.934715z" fill="" p-id="12220"></path><path d="M384.663212 633.500518c-21.222798 0-38.201036 16.978238-38.201036 38.201036s16.978238 38.201036 38.201036 38.201037h84.891192v76.402072c0 16.978238 16.978238 33.956477 38.201036 33.956477s38.201036-12.733679 38.201037-33.956477v-76.402072h89.135751c21.222798 0 38.201036-16.978238 38.201036-38.201037s-16.978238-38.201036-38.201036-38.201036h-89.135751v-21.222798h89.135751c21.222798 0 38.201036-16.978238 38.201036-38.201036s-16.978238-38.201036-38.201036-38.201036h-72.157513l72.157513-76.402073c12.733679-12.733679 12.733679-38.201036 0-55.179274-12.733679-12.733679-38.201036-12.733679-50.934715 0L512 480.696373l-72.157513-76.402072c-12.733679-12.733679-38.201036-12.733679-50.934715 0-12.733679 12.733679-12.733679 38.201036 0 55.179274l72.157513 76.402073H384.663212c-21.222798 0-38.201036 16.978238-38.201036 38.201036s16.978238 38.201036 38.201036 38.201036h84.891192v21.222798H384.663212z" fill="" p-id="12221"></path></svg>

src/assets/icons/svg/meterRecord.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1761011231553" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2521" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M925.425633 514.798111a38.910648 38.910648 0 0 0-25.59911-9.727662 38.398666 38.398666 0 0 0-28.415013 12.543564l-138.747178 153.594662a62.973812 62.973812 0 0 0-62.973812 62.973812 38.398666 38.398666 0 0 0 0 5.631804l-28.926995 31.742897a38.398666 38.398666 0 0 0 56.830026 51.198221l24.319155-26.879066a69.373589 69.373589 0 0 0 10.239644 0 62.973812 62.973812 0 0 0 63.229802-63.229802A66.045705 66.045705 0 0 0 793.590215 716.775092l106.74829-117.243926a214.008563 214.008563 0 1 1-167.674173-80.893189 38.398666 38.398666 0 0 0 0-76.797331 291.061886 291.061886 0 1 0 192.50531 72.701474z" p-id="2522"></path><path d="M365.317097 732.902532a367.859217 367.859217 0 0 1 367.603226-367.603226 112.124104 112.124104 0 0 1 38.398666 6.655769v-207.352795a38.398666 38.398666 0 0 0-38.398666-38.398666H455.681957V63.997776A63.997776 63.997776 0 0 0 391.684181 0H64.015567A63.997776 63.997776 0 0 0 0.017791 63.997776v921.567976A38.398666 38.398666 0 0 0 38.416457 1023.964417h470.51165a366.835252 366.835252 0 0 1-143.61101-291.061885zM293.639588 793.572423H167.179982a38.398666 38.398666 0 0 1 0-76.797331h126.459606a38.398666 38.398666 0 0 1 0 76.797331z m0-255.991104H167.179982a38.398666 38.398666 0 0 1 0-76.797331h126.459606a38.398666 38.398666 0 0 1 0 76.797331z m0-255.991104H167.179982a38.398666 38.398666 0 0 1 0-76.797332h126.459606a38.398666 38.398666 0 0 1 0 76.797332z" p-id="2523"></path></svg>

src/assets/icons/svg/unit.svg

@@ -1 +0,0 @@
-<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1778635879182" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="13234" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M156.381564 593.519095h28.67242a103.005669 103.005669 0 0 1 103.005669 103.005669v206.047179a103.005669 103.005669 0 0 1-103.005669 103.005669h-28.67242a103.005669 103.005669 0 0 1-103.005669-103.005669v-206.047179a103.005669 103.005669 0 0 1 103.005669-103.005669z m334.033694-84.798682h28.67242a103.005669 103.005669 0 0 1 103.005669 103.005669v309.052847a103.005669 103.005669 0 0 1-103.005669 103.005669h-28.67242a103.005669 103.005669 0 0 1-103.005669-103.005669v-309.017007a103.005669 103.005669 0 0 1 102.969828-103.005669z m333.997853-211.960865h28.67242a103.005669 103.005669 0 0 1 103.005669 103.005669v515.100026a103.005669 103.005669 0 0 1-102.826466 103.005669h-28.672421a103.005669 103.005669 0 0 1-103.184871-103.005669V399.765217a103.005669 103.005669 0 0 1 103.005669-103.005669z m-39.030332-204.900282L723.557873 20.859186 970.499091 0l-55.015206 241.63682-63.151005-72.648744-313.712116 256.976564a49.639127 49.639127 0 0 1-75.265103-13.081791L392.176379 291.741874l-257.048246 203.574182a49.531606 49.531606 0 0 1-70.713356-8.064118 52.327167 52.327167 0 0 1 7.884915-72.433701l301.956424-240.131518a49.639127 49.639127 0 0 1 74.584133 13.691081L519.23104 308.228516l266.151739-216.476772z" fill="" p-id="13235"></path></svg>

src/assets/icons/svg/water.svg

@@ -1 +0,0 @@
-<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1778635748668" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5697" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M512 1024C295.2192 1024 119.466667 846.848 119.466667 628.394667 119.466667 482.645333 250.299733 273.2032 512 0 773.700267 273.237333 904.533333 482.679467 904.533333 628.394667 904.533333 846.848 728.7808 1024 512 1024z m-287.675733-340.923733a337.134933 337.134933 0 0 0 213.060266 238.6944 34.577067 34.577067 0 0 0 44.270934-21.162667 34.986667 34.986667 0 0 0-20.992-44.612267 267.502933 267.502933 0 0 1-168.96-189.269333 34.6112 34.6112 0 1 0-67.3792 16.384z" fill="" p-id="5698"></path></svg>

src/assets/styles/bigScreen.scss

@@ -679,10 +679,6 @@
   .el-card__header {
     padding: 0.14rem 0.15rem 0.07rem !important;
     min-height: 0.4rem !important;
-  }
-  .el-form-item__error {
-    font-size: 0.12rem !important;
-    padding-top: 0.04rem !important;
 }
 }
 @media (min-width: 2000px) {

src/assets/styles/element-ui.scss

@@ -1430,7 +1430,7 @@
   min-width: 50px !important;
   z-index: 0;
 }
-.el-input__suffix{
+.el-input__suffix {
   z-index: 10;
 }
 .el-cascader__tags {
@@ -1452,7 +1452,7 @@
 .el-table__expand-icon{
   color: #fff !important;
 }
-.el-tag {
+.el-tag.el-tag--danger {
   font-weight: bold !important;
 }
 .el-tag.el-tag--success{

src/assets/styles/index.scss

@@ -775,3 +775,10 @@ table th {
     }
   }
 }
+/* 手机端样式 */
+@media (min-width: 0px) and (max-width: 990px) {
+  .app-main {
+    height: 100% !important;
+    overflow-y: hidden !important;
+  }
+}

src/assets/styles/sidebar.scss

@@ -116,7 +116,7 @@
     }
 
     & .nest-menu .el-submenu > .el-submenu__title,
-    & .el-submenu .el-menu-item {
+    & .nest-menu .el-menu-item {
       min-width: var(--base-sidebar-width) !important;
       padding: 0 35px !important;
 
@@ -124,6 +124,9 @@
         background-color: rgba(0, 0, 0, 0.06) !important;
       }
     }
+    & .nest-menu .el-menu > .nest-menu .el-menu-item {
+      padding: 0 55px !important;
+    }
 
     & .theme-dark .nest-menu .el-submenu > .el-submenu__title,
     & .theme-dark .el-submenu .el-menu-item {
@@ -328,18 +331,21 @@
       }
     }
   }
-  .hideSidebar .fixed-header{
+  .hideSidebar .fixed-header {
     width: calc(100% - 0.54rem) !important;
   }
   .el-submenu__title {
     font-size: 0.14rem !important;
     height: 0.56rem !important;
     line-height: 0.56rem !important;
-    font-size:0.14rem !important;
+    font-size: 0.14rem !important;
     padding: 0 0.2rem !important;
   }
   #app .sidebar-container .nest-menu .el-submenu > .el-submenu__title,
-  #app .sidebar-container .el-submenu .el-menu-item {
+  #app .sidebar-container .nest-menu .el-menu-item {
     padding: 0 0.35rem !important;
   }
+  #app .sidebar-container .nest-menu .el-menu > .nest-menu .el-menu-item {
+    padding: 0 0.55rem !important;
+  }
 }

src/permission.js

@@ -1,63 +1,87 @@
-import router from './router'
-import store from './store'
-import { Message } from 'element-ui'
-import NProgress from 'nprogress'
-import 'nprogress/nprogress.css'
-import { getToken } from '@/utils/auth'
-import { isPathMatch } from '@/utils/validate'
-import { isRelogin } from '@/utils/request'
+import router from "./router";
+import store from "./store";
+import { Message } from "element-ui";
+import NProgress from "nprogress";
+import "nprogress/nprogress.css";
+import { getToken } from "@/utils/auth";
+import { isPathMatch } from "@/utils/validate";
+import { isRelogin } from "@/utils/request";
+import {
+  isFullscreenSupported,
+  requestFullscreen,
+  isFullscreen,
+} from "@/utils/fullscreen";
+NProgress.configure({ showSpinner: false });
 
-NProgress.configure({ showSpinner: false })
-
-const whiteList = ['/login', '/register']
+const whiteList = ["/login", "/register"];
 
 const isWhiteList = (path) => {
-  return whiteList.some(pattern => isPathMatch(pattern, path))
-}
+  return whiteList.some((pattern) => isPathMatch(pattern, path));
+};
+
+let userManuallyExitedFullscreen = false;
+
+// 监听全屏状态变化事件
+document.addEventListener("fullscreenchange", () => {
+  if (!isFullscreen()) {
+    userManuallyExitedFullscreen = true;
+  }
+});
 
 router.beforeEach((to, from, next) => {
-  NProgress.start()
+  NProgress.start();
   if (getToken()) {
-    to.meta.title && store.dispatch('settings/setTitle', to.meta.title)
+    to.meta.title && store.dispatch("settings/setTitle", to.meta.title);
     /* has token*/
-    if (to.path === '/login') {
-      next({ path: '/' })
-      NProgress.done()
+    if (to.path === "/login") {
+      next({ path: "/" });
+      NProgress.done();
     } else if (isWhiteList(to.path)) {
-      next()
+      if (isFullscreenSupported() && !userManuallyExitedFullscreen) {
+        const element = document.documentElement;
+        requestFullscreen(element);
+      }
+      next();
     } else {
       if (store.getters.roles.length === 0) {
-        isRelogin.show = true
+        isRelogin.show = true;
         // 判断当前用户是否已拉取完user_info信息
-        store.dispatch('GetInfo').then(() => {
-          isRelogin.show = false
-          store.dispatch('GenerateRoutes').then(accessRoutes => {
-            // 根据roles权限生成可访问的路由表
-            router.addRoutes(accessRoutes) // 动态添加可访问路由表
-            next({ ...to, replace: true }) // hack方法 确保addRoutes已完成
-          })
-        }).catch(err => {
-            store.dispatch('LogOut').then(() => {
-              Message.error(err)
-              next({ path: '/' })
-            })
+        store
+          .dispatch("GetInfo")
+          .then(() => {
+            isRelogin.show = false;
+            store.dispatch("GenerateRoutes").then((accessRoutes) => {
+              // 根据roles权限生成可访问的路由表
+              router.addRoutes(accessRoutes); // 动态添加可访问路由表
+              next({ ...to, replace: true }); // hack方法 确保addRoutes已完成
+            });
           })
+          .catch((err) => {
+            store.dispatch("LogOut").then(() => {
+              Message.error(err);
+              next({ path: "/" });
+            });
+          });
       } else {
-        next()
+        if (isFullscreenSupported() && !userManuallyExitedFullscreen) {
+          const element = document.documentElement;
+          requestFullscreen(element);
+        }
+        next();
       }
     }
   } else {
     // 没有token
     if (isWhiteList(to.path)) {
       // 在免登录白名单，直接进入
-      next()
+      next();
     } else {
-      next(`/login?redirect=${encodeURIComponent(to.fullPath)}`) // 否则全部重定向到登录页
-      NProgress.done()
+      next(`/login?redirect=${encodeURIComponent(to.fullPath)}`); // 否则全部重定向到登录页
+      NProgress.done();
     }
   }
-})
+});
 
 router.afterEach(() => {
-  NProgress.done()
-})
+  NProgress.done();
+});

src/router/index.js

@@ -96,14 +96,6 @@ export const constantRoutes = [
       component: () => import("@/views/bigScreen/bigScreen"),
       meta: { title: "大屏总览", icon: "screen" },
     },
-    // 轮播监测
-    {
-       path: '/path/to/monitor/:page?',
-      name:"monitor",
-      hidden: true,
-      component: () => import("@/views/components/monitor/index"),
-      meta: { title: "系统监测", icon: "monitor" },
-    },
 ];
 
 // 动态路由，基于用户权限动态去加载

src/store/modules/permission.js

@@ -55,6 +55,14 @@ const permission = {
             // );
             // 定义要添加的多个路由对象数组
             const additionalRoutes = [
+              {
+                path: "/monitorCenter",
+                name: "monitorCenter",
+                hidden: true,
+                component: () =>
+                  import("@/views/centerairC/sysMonitor/monitorCenter"),
+                meta: { title: "系统监测", icon: "screen" },
+              },
               {
                 path: "/hostDetails",
                 name: "hostDetails",
@@ -83,6 +91,90 @@ const permission = {
             // console.log("不满足条件");
           }
 
+          // 风柜
+          const result2 = sidebarRoutes.find(
+            (item) => item.name === "AircAndWindc"
+          );
+          if (result2) {
+            // 定义要添加的多个路由对象数组
+            const additionalRoutes2 = [
+              {
+                path: "/asSysMonitorDetails",
+                name: "asSysMonitorDetails",
+                hidden: true,
+                component: () =>
+                  import(
+                    "@/views/aircAndWindc/awSysMonitor/asSysMonitorDetails"
+                  ),
+                meta: { title: "系统监控", icon: "screen" },
+              },
+              // 可以继续添加更多路由对象
+            ];
+            // 循环添加额外的路由对象到各路由数组
+            additionalRoutes2.forEach((route) => {
+              sidebarRoutes.push(route);
+              rewriteRoutes.push(route);
+              asyncRoutes.push(route);
+            });
+          } else {
+            // console.log("不满足条件");
+          }
+
+          // 锅炉
+          const result3 = sidebarRoutes.find(
+            (item) => item.name === "BoilerSys"
+          );
+          if (result3) {
+            // 定义要添加的多个路由对象数组
+            const additionalRoutes3 = [
+              {
+                path: "/boilerMonitorDetails",
+                name: "boilerMonitorDetails",
+                hidden: true,
+                component: () =>
+                  import(
+                    "@/views/boilerSys/boilerMonitor/boilerMonitorDetails"
+                  ),
+                meta: { title: "锅炉监控", icon: "screen" },
+              },
+              {
+                path: "/hotWaterBoilerDetails",
+                name: "hotWaterBoilerDetails",
+                hidden: true,
+                component: () =>
+                  import(
+                    "@/views/boilerSys/hotWaterBoiler/hotWaterBoilerDetails"
+                  ),
+                meta: { title: "热水锅炉监控", icon: "screen" },
+              },
+              {
+                path: "/heatingPumpDetails",
+                name: "heatingPumpDetails",
+                hidden: true,
+                component: () =>
+                  import("@/views/boilerSys/heatingPump/heatingPumpDetails"),
+                meta: { title: "采暖泵监控", icon: "screen" },
+              },
+              {
+                path: "/steamHeatingDetails",
+                name: "steamHeatingDetails",
+                hidden: true,
+                component: () =>
+                  import("@/views/boilerSys/steamHeating/steamHeatingDetails"),
+                meta: { title: "蒸汽采暖运行监控", icon: "screen" },
+              },
+              // 可以继续添加更多路由对象
+            ];
+            // 循环添加额外的路由对象到各路由数组
+            additionalRoutes3.forEach((route) => {
+              sidebarRoutes.push(route);
+              rewriteRoutes.push(route);
+              asyncRoutes.push(route);
+            });
+          } else {
+            // console.log("不满足条件");
+          }
+
           // 热水
           const result4 = sidebarRoutes.find(
             (item) => item.name === "HotWater"
@@ -110,6 +202,56 @@ const permission = {
             // console.log("不满足条件");
           }
 
+          // 温度监测
+          const result5 = sidebarRoutes.find((item) => item.name === "TemSys");
+          if (result5) {
+            // 定义要添加的多个路由对象数组
+            const additionalRoutes5 = [
+              {
+                path: "/temMonitorDeatils",
+                name: "temMonitorDeatils",
+                hidden: true,
+                component: () =>
+                  import("@/views/temSys/temMonitor/temMonitorDeatils"),
+                meta: { title: "温度监测", icon: "screen" },
+              },
+            ];
+            // 循环添加额外的路由对象到各路由数组
+            additionalRoutes5.forEach((route) => {
+              sidebarRoutes.push(route);
+              rewriteRoutes.push(route);
+              asyncRoutes.push(route);
+            });
+          } else {
+            // console.log("不满足条件");
+          }
+
+          // 脱硫系统
+          const result6 = sidebarRoutes.find((item) => item.name === "Desulfurization");
+          if (result6) {
+            // 定义要添加的多个路由对象数组
+            const additionalRoutes6 = [
+              {
+                path: "/desMonitorCenter",
+                name: "desMonitorCenter",
+                hidden: true,
+                component: () =>
+                  import("@/views/desulfurization/desMonitor/desMonitorCenter"),
+                meta: { title: "实时监测", icon: "screen" },
+              },
+            ];
+            // 循环添加额外的路由对象到各路由数组
+            additionalRoutes6.forEach((route) => {
+              sidebarRoutes.push(route);
+              rewriteRoutes.push(route);
+              asyncRoutes.push(route);
+            });
+          } else {
+            // console.log("不满足条件");
+          }
+
+
+
           commit("SET_ROUTES", rewriteRoutes);
           commit("SET_SIDEBAR_ROUTERS", constantRoutes.concat(sidebarRoutes));
           commit("SET_DEFAULT_ROUTES", sidebarRoutes);

src/utils/fullscreen.js

@@ -0,0 +1,53 @@
+// 检查浏览器是否支持全屏 API
+function isFullscreenSupported() {
+  return (
+    document.fullscreenEnabled ||
+    document.webkitFullscreenEnabled ||
+    document.mozFullScreenEnabled ||
+    document.msFullscreenEnabled
+  );
+}
+
+// 进入全屏模式
+function requestFullscreen(element) {
+  if (element.requestFullscreen) {
+    element.requestFullscreen();
+  } else if (element.webkitRequestFullscreen) {
+    element.webkitRequestFullscreen();
+  } else if (element.mozRequestFullScreen) {
+    element.mozRequestFullScreen();
+  } else if (element.msRequestFullscreen) {
+    element.msRequestFullscreen();
+  }
+}
+
+// 退出全屏模式
+function exitFullscreen() {
+  if (document.exitFullscreen) {
+    document.exitFullscreen();
+  } else if (document.webkitExitFullscreen) {
+    document.webkitExitFullscreen();
+  } else if (document.mozCancelFullScreen) {
+    document.mozCancelFullScreen();
+  } else if (document.msExitFullscreen) {
+    document.msExitFullscreen();
+  }
+}
+
+// 检查当前是否处于全屏状态
+function isFullscreen() {
+  return (
+    document.fullscreenElement ||
+    document.webkitFullscreenElement ||
+    document.mozFullScreenElement ||
+    document.msFullscreenElement
+  );
+}
+
+
+export {
+  isFullscreenSupported,
+  requestFullscreen,
+  exitFullscreen,
+  isFullscreen,
+};

src/utils/request.js

@@ -17,7 +17,7 @@ const service = axios.create({
   // axios中请求配置有baseURL选项，表示请求URL公共部分
   baseURL: process.env.VUE_APP_BASE_API,
   // 超时
-  timeout: 10000
+  timeout: 15000
 })
 
 // request拦截器

src/views/aircAndWindc/awSysMonitor/asSysMonitorDetails.vue

@@ -0,0 +1,721 @@
+<template>
+  <div class="monitor">
+    <div class="monitor-top">
+      <img
+        class="title-left"
+        src="../../../assets/images/title-left.png"
+        alt=""
+      />
+      <img
+        class="title-center"
+        src="../../../assets/images/title-center.png"
+        alt=""
+        @click="goSys"
+      />
+      <img
+        class="title-right"
+        src="../../../assets/images/title-right.png"
+        alt=""
+      />
+      <div class="sys-title" @click="goSys">空调风柜监控系统</div>
+      <!-- logo -->
+      <img src="../../../assets/images/logo-3.png" class="sys-logo" alt="" />
+      <div class="nowTime">{{ formattedDate }}</div>
+      <div class="monitor-time">已监测时长:{{ dayData }}天</div>
+      <img
+        class="icon_warning"
+        src="../../../assets/images/warning.png"
+        title="报警记录"
+        @click="goWarning"
+        v-if="isShowWarning"
+        alt=""
+      />
+      <img
+        class="icon_home"
+        src="../../../assets/images/icon_home.png"
+        title="首页"
+        @click="goSys"
+        alt=""
+      />
+      <img
+        class="back-icon"
+        src="../../../assets/images/back-icon.png"
+        title="返回"
+        @click="goBack"
+        alt=""
+      />
+    </div>
+    <div class="app-container">
+      <div class="left-tree">
+        <!-- 为 el-tree 设置一个固定的高度和滚动条 -->
+        <div class="tree-div">
+          <el-tree
+            ref="tree"
+            :data="treeData"
+            node-key="id"
+            :default-expand-all="false"
+            :default-expanded-keys="expandedKeys"
+            :auto-expand-parent="true"
+            icon-class="none"
+            @node-expand="handleNodeExpand"
+            @node-collapse="handleNodeCollapse"
+            :highlight-current="true"
+            @node-click="handleNodeClick"
+          >
+            <template #default="{ node }">
+              <span class="custom-tree-node">
+                <!-- 根据节点状态动态设置图标类名 -->
+                <div class="tree-left">
+                  <i :class="getIconClass(node)" class="custom-tree-icon"></i>
+                  <span class="tree-label">{{ node.label }}</span>
+                </div>
+              </span>
+            </template>
+          </el-tree>
+        </div>
+      </div>
+      <damper-monitor
+        :currentId="currentId"
+        :currentName="currentName"
+        ref="damperMonitorRef"
+        v-if="isShowdamper"
+      ></damper-monitor>
+      <normal-monitor
+        :currentId="currentId"
+        :currentName="currentName"
+        ref="normalMonitorRef"
+        v-else
+      ></normal-monitor>
+    </div>
+  </div>
+</template>
+
+<script>
+import { runTime } from "@/api/centerairC/sysMonitor";
+import { alarmRecordList } from "@/api/alarm/alarmRecord";
+import { getDay } from "@/utils/datetime";
+import { spaceTree } from "@/api/region";
+import damperMonitor from "./components/damperMonitor.vue";
+import normalMonitor from "./components/normalMonitor.vue";
+export default {
+  components: { damperMonitor, normalMonitor },
+  name: "asSysMonitorDetails",
+  data() {
+    return {
+      currentDate: new Date(),
+      nowTimer: null,
+      isShowWarning: false, //是否有报警
+      dayData: "", //监测天数
+      treeData: [],
+      defaultProps: {
+        children: "children",
+        label: "label",
+      },
+      deviceList: [],
+      expandedKeys: [],
+      currentId: "", //当前选中高亮的id
+      currentName: "", //当前选中的名称
+      currentLevel: "", //当前节点的层级
+      currentParentId: "", //当前节点的上级的id
+
+      backwaterObj: {}, //回水温度
+      airValveObj: {}, //风阀调节
+      airValveBackObj: {}, //风阀反馈
+      waterValveObj: {}, //水阀调节
+      startControlObj: {}, //启停控制
+      runStatusObj: {}, //运行状态
+      airSupplyObj: {}, //送风温度
+      pressureObj: {}, //压差
+      automaticObj: {}, //手自动状态
+      backAirObj: {}, //回风温度
+      faultAlarmObj: {}, //故障报警
+      waterSupplyObj: {}, //供水温度
+
+      tableData: [], //系统状态表格数据
+      temValue: "℃", //回风温度
+      valvePercent: "%", //阀比例
+      runStatus: false, //运行状态
+      autoStatus: false, //手自动状态
+      startStatus: false, //启停控制
+      frequency: "v",
+      isOpenTimeSwitch: false,
+      delayList: [],
+      currentWeekday: "",
+
+      isShowdamper: false,
+    };
+  },
+  computed: {
+    formattedDate() {
+      const year = this.currentDate.getFullYear();
+      const month = String(this.currentDate.getMonth() + 1).padStart(2, "0");
+      const day = String(this.currentDate.getDate()).padStart(2, "0");
+      const hours = String(this.currentDate.getHours()).padStart(2, "0");
+      const minutes = String(this.currentDate.getMinutes()).padStart(2, "0");
+      const seconds = String(this.currentDate.getSeconds()).padStart(2, "0");
+      const weekDays = [
+        "星期日",
+        "星期一",
+        "星期二",
+        "星期三",
+        "星期四",
+        "星期五",
+        "星期六",
+      ];
+      const weekDay = weekDays[this.currentDate.getDay()];
+      return `${year}年${month}月${day}日 ${hours}:${minutes}:${seconds} ${weekDay}`;
+    },
+  },
+  watch: {
+    temValue(newVal) {
+      let valueWithoutTem = newVal.replace(/℃/g, "");
+      if (valueWithoutTem === "") {
+        this.temValue = "℃";
+      } else {
+        this.temValue = valueWithoutTem + "℃";
+      }
+    },
+    valvePercent(newVal) {
+      // 去除输入值中的 %
+      let valueWithoutPercent = newVal.replace(/%/g, "");
+      // 如果输入值为空，保持 %
+      if (valueWithoutPercent === "") {
+        this.temValue = "%";
+      } else {
+        // 否则在输入值后面添加 %
+        this.temValue = valueWithoutPercent + "%";
+      }
+    },
+    frequency(newVal) {
+      let valueWithoutFrequency = newVal.replace(/v/g, "");
+      if (valueWithoutFrequency === "") {
+        this.temValue = "v";
+      } else {
+        this.temValue = valueWithoutFrequency + "v";
+      }
+    },
+  },
+  created() {
+    const weekdays = [
+      "星期日",
+      "星期一",
+      "星期二",
+      "星期三",
+      "星期四",
+      "星期五",
+      "星期六",
+    ];
+    const date = new Date();
+    const dayIndex = date.getDay();
+    this.currentWeekday = weekdays[dayIndex];
+    console.log("今天是星期几", this.currentWeekday);
+  },
+  mounted() {
+    this.requestFullscreen();
+    // 首次进入页面时执行
+    this.getSysBuild();
+    this.getAlarnStatus();
+    this.getDayData();
+    // 每秒更新一次时间
+    this.nowTimer = setInterval(() => {
+      this.currentDate = new Date();
+    }, 1000);
+  },
+  beforeDestroy() {
+    // 组件销毁前清除定时器
+    if (this.nowTimer) {
+      clearInterval(this.nowTimer);
+    }
+  },
+  methods: {
+    // 全屏操作
+    requestFullscreen() {
+      const element = document.documentElement;
+      console.log("全屏了吗");
+      if (element.requestFullscreen) {
+        element.requestFullscreen();
+      } else if (element.mozRequestFullScreen) {
+        // Firefox
+        element.mozRequestFullScreen();
+      } else if (element.webkitRequestFullscreen) {
+        // Chrome, Safari and Opera
+        element.webkitRequestFullscreen();
+      } else if (element.msRequestFullscreen) {
+        // IE/Edge
+        element.msRequestFullscreen();
+      }
+    },
+    // 退出全屏
+    exitFullscreen() {
+      if (document.exitFullscreen) {
+        document.exitFullscreen();
+      } else if (document.mozCancelFullScreen) {
+        // Firefox
+        document.mozCancelFullScreen();
+      } else if (document.webkitExitFullscreen) {
+        // Chrome, Safari and Opera
+        document.webkitExitFullscreen();
+      } else if (document.msExitFullscreen) {
+        // IE/Edge
+        document.msExitFullscreen();
+      }
+    },
+    // 进入系统首页
+    goSys() {
+      // this.exitFullscreen();
+      this.$router.push("/");
+    },
+    // 返回上一页
+    goBack() {
+      window.history.go(-2);
+    },
+    // 监测天数
+    getDayData() {
+      runTime().then((res) => {
+        if (res.code == 200) {
+          this.dayData = res.data.runTime;
+        }
+      });
+    },
+    // 报警列表
+    getAlarnStatus() {
+      let data = {
+        pageNum: 1,
+        pageSize: 10,
+        status: "0",
+      };
+      let timeArr = [getDay(0), getDay(0)];
+      alarmRecordList(this.addDateRange(data, timeArr)).then((res) => {
+        if (res.code == 200 && res.rows.length > 0) {
+          this.isShowWarning = true;
+        } else {
+          this.isShowWarning = false;
+        }
+      });
+    },
+    goWarning() {
+      // this.exitFullscreen();
+      this.$router.push("/alarm/alarmRecord");
+    },
+    // 判断对象是否有效（不为空且不为 undefined）
+    isObjectValid(obj) {
+      return obj && Object.keys(obj).length > 0;
+    },
+    getSysBuild() {
+      spaceTree().then((res) => {
+        if (res.code == 200) {
+          // 只需要保留热水的系统
+          console.log("楼栋返回值", res);
+          let newRes = { ...res };
+
+          if (newRes.data && newRes.data[0] && newRes.data[0].children) {
+            newRes.data[0].children = newRes.data[0].children.filter((item) => {
+              // 假设子项有一个 label属性，用于检查是否包含 "热水"
+              return item.label && item.label.includes("空调风柜");
+            });
+          }
+          // 指定要保留的最大层级（从 1 开始计数），这里假设指定为第 5 级
+          const targetLevel = 5;
+          // 从 data[0] 开始处理，当前层级为 1
+          if (newRes.data[0]) {
+            this.removeChildrenAfterLevel(newRes.data[0], 1, targetLevel);
+          }
+          console.log("筛选后的新结果", newRes);
+          this.treeData = newRes.data;
+          this.$nextTick(() => {
+            // 默认展开节点
+            this.getExpandedKeys(this.treeData, 1);
+            if (this.treeData.length > 0) {
+              // 找到最后一层的第一个子节点
+              const lastLevelFirstChild = this.findLastLevelFirstChild(
+                this.treeData[0]
+              );
+              // this.$refs.tree.setCurrentKey(
+              //   this.treeData[0].children[0].children[0].children[0].id
+              // );
+              // 设置当前选中的节点,默认高亮
+              this.$refs.tree.setCurrentKey(lastLevelFirstChild.id);
+              // 更新当前节点的信息
+              this.currentId = lastLevelFirstChild.id;
+              this.currentLevel = lastLevelFirstChild.level;
+              this.currentName = lastLevelFirstChild.label;
+              console.log("当前选中节点ID", this.currentId);
+              console.log("当前选中节点层级", this.currentLevel);
+              console.log("当前选中节点名称", this.currentName);
+              //  传给子组件,触发子组件getWindList()
+              if (
+                this.currentName.includes("新风阀") ||
+                this.currentName.includes("AHU")
+              ) {
+                this.isShowdamper = true;
+                this.$nextTick(() => {
+                  this.$refs.damperMonitorRef.getWindList();
+                });
+              } else {
+                this.isShowdamper = false;
+                this.$nextTick(() => {
+                  this.$refs.normalMonitorRef.getWindList();
+                });
+              }
+            }
+          });
+        }
+      });
+    },
+    // 递归函数，用于去除指定层级往后的 children 数据
+    removeChildrenAfterLevel(obj, currentLevel, targetLevel) {
+      if (currentLevel >= targetLevel) {
+        // 当达到指定层级时，将 children 属性置为空数组
+        obj.children = [];
+        return;
+      }
+      if (obj.children && obj.children.length > 0) {
+        // 若存在 children 数组，则递归处理每个子项
+        for (let i = 0; i < obj.children.length; i++) {
+          this.removeChildrenAfterLevel(
+            obj.children[i],
+            currentLevel + 1,
+            targetLevel
+          );
+        }
+      }
+    },
+    // 递归函数，找到最后一层的第一个子节点
+    findLastLevelFirstChild(node, level = 1) {
+      if (!node.children || node.children.length === 0) {
+        return {
+          id: node.id,
+          level,
+          label: node.label,
+        };
+      }
+      return this.findLastLevelFirstChild(node.children[0], level + 1);
+    },
+    // 默认只展示一二级菜单
+    getExpandedKeys(nodes, level) {
+      nodes.forEach((node) => {
+        if (level <= this.currentId + 4) {
+          this.expandedKeys.push(node.id);
+        }
+        if (node.children) {
+          this.getExpandedKeys(node.children, level + 1);
+        }
+      });
+    },
+    // 更换图标
+    getIconClass(node) {
+      // console.log("当前图标的节点内容", node);
+      if (node.level === 5) {
+        // 5级菜单时的图标
+        if (node.expanded) {
+          return "el-icon-document-opened"; // 5级菜单展开时的图标类名
+        }
+        return "el-icon-document"; // 5级菜单收缩时的图标类名
+      }
+      if (node.expanded) {
+        return "el-icon-folder-opened"; // 非5级菜单展开时的图标类名
+      }
+      return "el-icon-folder-add"; // 非5级菜单收缩时的图标类名
+    },
+    handleNodeExpand(node) {
+      // 节点展开时触发
+    },
+    handleNodeCollapse(node) {
+      // 节点收缩时触发
+    },
+    // 点击当前节点，保存节点内容
+    handleNodeClick(node, data) {
+      console.log("点击的当前节点", node, data);
+      if (data.level !== 5) {
+        console.log("不是第5层000");
+        // 设置当前选中的节点,默认高亮
+        this.$refs.tree.setCurrentKey(this.currentId);
+        console.log("当前选中节点ID", this.currentId);
+        console.log("当前选中节点层级", this.currentLevel);
+        console.log("当前选中节点名称", this.currentName);
+      } else {
+        console.log("第5层111");
+        this.currentId = node.id;
+        this.currentLevel = data.level;
+        this.currentName = node.label;
+        // 设置当前选中的节点,默认高亮
+        this.$refs.tree.setCurrentKey(this.currentId);
+        console.log("当前选中节点ID", this.currentId);
+        console.log("当前选中节点层级", this.currentLevel);
+        console.log("当前选中节点名称", this.currentName);
+        // 传给子组件,触发子组件getWindList()
+        if (
+          this.currentName.includes("新风阀") ||
+          this.currentName.includes("AHU")
+        ) {
+          this.isShowdamper = true;
+          this.$nextTick(() => {
+            this.$refs.damperMonitorRef.getWindList();
+          });
+        } else {
+          this.isShowdamper = false;
+          this.$nextTick(() => {
+            this.$refs.normalMonitorRef.getWindList();
+          });
+        }
+      }
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.monitor {
+  width: 100%;
+  min-height: 100vh;
+  background-color: black;
+  color: #fff;
+  .monitor-top {
+    width: 100%;
+    display: flex;
+    flex-direction: row;
+    align-items: flex-start;
+    justify-content: space-between;
+    flex-wrap: nowrap;
+    padding: 0.1rem 0.2rem;
+    position: relative;
+    .title-left {
+      width: 3.41rem;
+      height: 0.8rem;
+    }
+    .title-center {
+      width: 9.46rem;
+      height: 0.8rem;
+    }
+    .title-right {
+      width: 5.04rem;
+      height: 0.78rem;
+    }
+    .sys-title {
+      position: absolute;
+      top: 40%;
+      left: 50%;
+      transform: translate(-50%, -50%);
+      font-size: 0.28rem;
+      color: #ffffff;
+      font-weight: bold;
+      z-index: 100;
+      cursor: pointer;
+    }
+    .nowTime {
+      position: absolute;
+      top: 0.37rem;
+      right: 0.6rem;
+      font-size: 0.18rem;
+      color: #ffffff;
+      font-weight: bold;
+      z-index: 100;
+    }
+    .sys-logo {
+      width: 1.8rem;
+      height: 0.5rem;
+      position: absolute;
+      top: 0.26rem;
+      left: 0.8rem;
+      z-index: 10;
+    }
+    .monitor-time {
+      position: absolute;
+      top: 0.44rem;
+      left: 4.2rem;
+      z-index: 10;
+      font-size: 0.18rem;
+      color: #ffffff;
+      font-weight: bold;
+    }
+    .icon_warning {
+      position: absolute;
+      top: 0.39rem;
+      right: 4.4rem;
+      z-index: 10;
+      width: 0.35rem;
+      height: 0.32rem;
+      margin: 0 0.25rem 0 0.27rem;
+      cursor: pointer;
+      /* 添加闪烁动画 */
+      animation: blink 1s infinite;
+    }
+    @keyframes blink {
+      100% {
+        opacity: 1;
+      }
+      50% {
+        opacity: 0;
+      }
+    }
+    .icon_home {
+      position: absolute;
+      top: 0.39rem;
+      right: 4rem;
+      z-index: 10;
+      width: 0.35rem;
+      height: 0.32rem;
+      margin: 0 0.2rem 0 0.27rem;
+      cursor: pointer;
+    }
+    .back-icon {
+      position: absolute;
+      top: 0.39rem;
+      right: 3.7rem;
+      z-index: 10;
+      width: 0.35rem;
+      height: 0.32rem;
+      cursor: pointer;
+    }
+  }
+}
+.app-container {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: stretch;
+  height: 100%;
+  padding: 0.3rem 0.2rem 0 0.35rem;
+  width: 100%;
+  .left-tree {
+    width: 256px;
+    padding: 15px 10px 10px 10px;
+    border: 1px solid #004b8c;
+    .tree-div {
+      height: 7rem;
+      overflow-y: auto;
+    }
+    .status {
+      display: flex;
+      flex-direction: row;
+      justify-content: space-between;
+      flex-wrap: wrap;
+      margin-top: 20px;
+      .status-li {
+        width: 50%;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+        margin-bottom: 15px;
+      }
+      .status1,
+      .status2,
+      .status3,
+      .status4 {
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        margin-bottom: 5px;
+      }
+      .status1::before {
+        content: "";
+        width: 10px;
+        height: 10px;
+        border-radius: 50%;
+        background-color: #00d2ff;
+        margin-right: 5px;
+      }
+      .status2::before {
+        content: "";
+        width: 10px;
+        height: 10px;
+        border-radius: 50%;
+        background-color: #ff2f2f;
+        margin-right: 5px;
+      }
+      .status3::before {
+        content: "";
+        width: 10px;
+        height: 10px;
+        border-radius: 50%;
+        background-color: #ff9908;
+        margin-right: 5px;
+      }
+      .status4::before {
+        content: "";
+        width: 10px;
+        height: 10px;
+        border-radius: 50%;
+        background-color: #7398c7;
+        margin-right: 5px;
+      }
+    }
+  }
+  .right-monitor {
+    width: calc(100% - 280px);
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-start;
+  }
+}
+.tree-container {
+  height: 300px; /* 设置固定高度 */
+  overflow-y: auto; /* 启用垂直滚动条 */
+}
+// 滚动条
+:-webkit-scrollbar {
+  width: 10px; /* 滚动条宽度 */
+}
+
+::-webkit-scrollbar-track {
+  background: transparent !important; /* 滚动条轨道背景色 */
+}
+.custom-tree-node {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  font-size: 14px;
+  padding-right: 8px;
+  .tree-left {
+    .custom-tree-icon {
+      margin-right: 5px;
+    }
+  }
+}
+.highlight {
+  background-color: #003863 !important; /* 定义高亮的背景颜色 */
+  color: #ffffff !important;
+  font-weight: bold;
+}
+// 手机端样式
+@media (min-width: 0px) and (max-width: 990px) {
+  .app-container {
+    padding: 0rem 0.2rem 0 0.35rem !important;
+  }
+  .app-container .left-tree {
+    width: 200px !important;
+    min-height: 340px !important;
+    padding: 0.15rem 0 !important;
+  }
+  .app-container .tree-div {
+    height: 300px !important;
+    width: 100%;
+    overflow-x: hidden !important;
+  }
+  .app-container .right-monitor {
+    width: calc(100% - 210px) !important;
+  }
+  .custom-tree-node {
+    font-size: 12px !important;
+  }
+}
+</style>
+<style scoped>
+/* 自定义高亮颜色 */
+.left-tree
+  >>> .el-tree--highlight-current
+  .el-tree-node.is-current
+  > .el-tree-node__content {
+  background-color: #285b9e !important;
+  /* color: #f56c6c;  */
+  color: #25f1f8;
+}
+/* 手机端样式 */
+@media (min-width: 0px) and (max-width: 990px) {
+  .left-tree >>> .el-tree-node__content > .el-tree-node__expand-icon {
+    padding: 3px !important;
+  }
+}
+</style>