add:银洞大屏

src/api/tyler/hjjc.js

@@ -46,7 +46,15 @@ export function getDeviceStatus(query) {
 // 查询近7日报警信息
 export function getRecentSevDaysAlarms(query) {
   return request({
-    url: "/business/screen/env/recentSevDaysAlarms",
+    url: "/business/screen/env/videoMonitoringList",
+    method: "get",
+    params: query,
+  });
+}
+// 查询设备状态分析
+export function getDeviceStatusNum(query) {
+  return request({
+    url: "/business/screen/env/deviceStatusNum",
     method: "get",
     params: query,
   });

src/api/tyler/tfxt.js

@@ -9,19 +9,22 @@ export function kongyajiQuery(query) {
     data: query
   })
 }
-//空压机数据
+//风扇数据
 export function fenshanQuery(query) {
   return request({
-    url: '/business/screen/fan/dianjiQuery',
+    url: '/business/screen/fan/fengjiQuery',
     method: 'get',
     data: query
   })
 }
-export function peakEditDra(query) {
+
+// 编辑风扇状态
+export function editFengjiStatus(data) {
   return request({
-    url: '/business/peak/add',
+    url: '/business/screen/dev/addDeviceStatus',
     method: 'post',
-    data: query
+    data
   })
 }
 
+

src/views/Screen/index.vue

 <template>
   <div>
-    <home
-      v-if="showMenu === 0"
-      style="position: absolute; top: 0; left: 0; right: 0; bottom: 0"
-    ></home>
-
     <v-scale-screen
       ref="scale-screen"
       width="1920"
       height="1080"
       :fullScreen="true"
     >
+      <home
+        v-if="showMenu === 0"
+        style="position: absolute; top: 0; left: 0; right: 0; bottom: 0"
+      ></home>
       <psxt
         v-if="showMenu === 3"
         style="position: absolute; top: 0; left: 0; right: 0; bottom: 0"
@@ -36,10 +35,10 @@
         v-if="showMenu === 2"
         style="position: absolute; top: 0; left: 0; right: 0; bottom: 0"
       ></hjjc>
-      <div class="container">
+      <div class="container" style="pointer-events: none">
         <!-- 头部 -->
-        <div class="header por"></div>
-        <div class="sub-header">
+        <div class="header por" style="pointer-events: auto"></div>
+        <div class="sub-header" style="pointer-events: auto">
           <div class="sub-header-left">
             <div
               class="sub-item"
@@ -204,7 +203,6 @@ export default {
   // background-color: #08152a;
   position: relative;
   font-family: "fangsong";
-  pointer-events: none;
   color: #fff;
 }
 /* 头部标题 */
@@ -217,6 +215,7 @@ export default {
   margin: 0 auto;
 }
 .sub-header {
+  pointer-events: auto; // 新增这行
   display: flex;
   justify-content: space-between;
   padding: 0 30px;
@@ -279,6 +278,7 @@ export default {
   align-items: center;
   font-size: 16px;
   color: #11e0ff;
+  pointer-events: auto; // 新增这行
   span {
     cursor: pointer;
     text-indent: 1em;
@@ -330,6 +330,7 @@ export default {
   }
 }
 ::v-deep .screen-box {
-  pointer-events: none;
+  pointer-events: auto !important; // 修改这行
+  transform-style: preserve-3d; // 新增这行
 }
 </style>

src/views/Screen/items/hjjc.vue

@@ -11,7 +11,6 @@
               ref="sssjControl"
               :data="tableData1"
               :class-option="classOption"
-              @mousewheel.native="handleScroll"
               class="warp"
             >
               <ul class="item">
@@ -100,7 +99,7 @@
               <div class="chart_bg"></div>
               <div id="EchartsPieLeft" class="chart_box"></div>
               <div class="chart_number">
-                <span>42个</span>
+                <span>{{ deviceStatusNum.total }}个</span>
                 <br />
                 <span>总数</span>
               </div>
@@ -117,7 +116,7 @@
               <div class="chart_bg_right"></div>
               <div id="EchartsPieRight" class="chart_box"></div>
               <div class="chart_number_right">
-                <span>42个</span>
+                <span>{{ deviceStatusNum.cameraTotal }}个</span>
                 <br />
                 <span>总数</span>
               </div>
@@ -183,7 +182,7 @@ import {
   getDeviceStatus,
   getDeviceData,
   getRcData,
-  getRecentSevDaysAlarms,
+  getDeviceStatusNum,
 } from "@/api/tyler/hjjc";
 import ScrollTable from "@/components/Tyler/ScrollTable.vue";
 import screenfull from "screenfull";
@@ -289,6 +288,12 @@ export default {
       ],
       //highCharts配置
       highChartsOption: {},
+      deviceStatusNum: {
+        //设备总数
+        total: 0,
+        //摄像头总数
+        cameraTotal: 0,
+      },
     };
   },
   mounted() {
@@ -307,11 +312,12 @@ export default {
     });
     getDeviceStatus().then((res) => {
       // this.equipmentList = res.data;
-      this.equipmentList = [
+
+      let dataXY = [
         {
           name: "三中码头门",
           x: "50",
-          y: "436",
+          y: "406",
           isWarning: 0,
           monitorPositionList: [
             {
@@ -329,7 +335,7 @@ export default {
         {
           name: "二中空压机房",
           x: "258",
-          y: "335",
+          y: "299",
           isWarning: 0,
           monitorPositionList: [
             {
@@ -346,8 +352,8 @@ export default {
         },
         {
           name: "东风井",
-          x: "816",
-          y: "176",
+          x: "856",
+          y: "136",
           isWarning: 0,
           monitorPositionList: [
             {
@@ -365,7 +371,7 @@ export default {
         {
           name: "二中避险硐室",
           x: "75",
-          y: "318",
+          y: "288",
           isWarning: 0,
           monitorPositionList: [
             {
@@ -383,7 +389,7 @@ export default {
         {
           name: "一中避险硐室",
           x: "85",
-          y: "193",
+          y: "153",
           isWarning: 0,
           monitorPositionList: [
             {
@@ -401,7 +407,7 @@ export default {
         {
           name: "五中避险硐室",
           x: "102",
-          y: "687",
+          y: "677",
           isWarning: 0,
           monitorPositionList: [
             {
@@ -419,7 +425,7 @@ export default {
         {
           name: "四中避险硐室",
           x: "96",
-          y: "561",
+          y: "541",
           isWarning: 0,
           monitorPositionList: [
             {
@@ -437,7 +443,7 @@ export default {
         {
           name: "四中车场",
           x: "53",
-          y: "557",
+          y: "527",
           isWarning: 0,
           monitorPositionList: [
             {
@@ -450,7 +456,7 @@ export default {
         {
           name: "一中主运输巷",
           x: "185",
-          y: "204",
+          y: "164",
           isWarning: 0,
           monitorPositionList: [
             {
@@ -468,7 +474,7 @@ export default {
         {
           name: "二中主运输巷",
           x: "187",
-          y: "331",
+          y: "296",
           isWarning: 0,
           monitorPositionList: [
             {
@@ -491,7 +497,7 @@ export default {
         {
           name: "二中中运输巷",
           x: "316",
-          y: "338",
+          y: "303",
           isWarning: 0,
           monitorPositionList: [
             {
@@ -504,7 +510,7 @@ export default {
         {
           name: "三中避险硐室",
           x: "93",
-          y: "441",
+          y: "411",
           isWarning: 0,
           monitorPositionList: [
             {
@@ -535,7 +541,7 @@ export default {
         {
           name: "一中风机",
           x: "145",
-          y: "199",
+          y: "159",
           isWarning: 0,
           monitorPositionList: [
             {
@@ -553,7 +559,7 @@ export default {
         {
           name: "一中西采区",
           x: "341",
-          y: "222",
+          y: "192",
           isWarning: 0,
           monitorPositionList: [
             {
@@ -581,7 +587,7 @@ export default {
         {
           name: "三中运输巷",
           x: "518",
-          y: "474",
+          y: "439",
           isWarning: 0,
           monitorPositionList: [
             {
@@ -632,7 +638,7 @@ export default {
         {
           name: "四中运输巷",
           x: "206",
-          y: "584",
+          y: "559",
           isWarning: 0,
           monitorPositionList: [
             {
@@ -660,7 +666,7 @@ export default {
         {
           name: "五中运输巷",
           x: "166",
-          y: "707",
+          y: "697",
           isWarning: 0,
           monitorPositionList: [
             {
@@ -688,7 +694,7 @@ export default {
         {
           name: "一中运输巷",
           x: "367",
-          y: "208",
+          y: "168",
           isWarning: 0,
           monitorPositionList: [
             {
@@ -701,7 +707,7 @@ export default {
         {
           name: "二中西采区",
           x: "237",
-          y: "369",
+          y: "339",
           isWarning: 0,
           monitorPositionList: [
             {
@@ -724,7 +730,7 @@ export default {
         {
           name: "二中运输巷",
           x: "415",
-          y: "341",
+          y: "311",
           isWarning: 0,
           monitorPositionList: [
             {
@@ -735,20 +741,41 @@ export default {
           ],
         },
       ];
+      if (res.data && res.data.length) {
+        // 使用接口数据为基础，合并本地坐标数据
+        this.equipmentList = res.data.map((apiItem) => {
+          // 在dataXY中查找同名设备
+          const localItem = dataXY.find((xy) => xy.name === apiItem.name);
+          // 合并坐标数据，保留接口返回的其他字段
+          return {
+            ...apiItem,
+            x: localItem ? localItem.x : 0, // 默认值处理
+            y: localItem ? localItem.y : 0,
+            monitorPositionList: apiItem.monitorPositionList || [],
+          };
         });
-    getRecentSevDaysAlarms().then((res) => {
-      //数据空
+      } else {
+        // 降级方案：使用本地数据
+      }
     });
     //初始化获取左侧环境监测实施数据
     getRealData().then((res) => {
       this.tableData1 = res.data;
     });
     //初始化highCharts
-    this.getHighChartsData();
+    getDeviceStatusNum().then((res) => {
+      if (res.code == 200) {
+        this.deviceStatusNum = {
+          total: res.data[0].online + res.data[0].offline,
+          cameraTotal: res.data[1].online + res.data[1].offline,
+        };
+        this.getHighChartsData(res.data);
+      }
+    });
   },
   created() {},
   methods: {
-    getHighChartsData() {
+    getHighChartsData(value = []) {
       this.highChartsOption = {
         chart: {
           type: "pie", //饼图
@@ -803,8 +830,16 @@ export default {
             name: "设备统计",
             showInLegend: true,
             data: [
-              { name: "正常设备", y: 80, color: "RGBA(37, 160, 238, 1)" }, // 高数据部分
-              { name: "异常设备", y: 20, color: "RGBA(252, 183, 62, 1)" }, // 低数据部分
+              {
+                name: "正常设备",
+                y: value[0].online,
+                color: "RGBA(37, 160, 238, 1)",
+              }, // 高数据部分
+              {
+                name: "异常设备",
+                y: value[0].offline,
+                color: "RGBA(252, 183, 62, 1)",
+              }, // 低数据部分
             ],
             startAngle: 0, //起始角度,
             label: {
@@ -829,8 +864,8 @@ export default {
 
       Highcharts.chart("EchartsPieLeft", this.highChartsOption);
       this.highChartsOption.series[0].data = [
-        { name: "在线", y: 40, color: "#02CD9B" }, // 高数据部分
-        { name: "离线", y: 1, color: "RGBA(252, 183, 62, 1)" }, // 低数据部分
+        { name: "在线", y: value[1].online, color: "#02CD9B" }, // 高数据部分
+        { name: "离线", y: value[1].offline, color: "RGBA(252, 183, 62, 1)" }, // 低数据部分
       ];
       Highcharts.chart("EchartsPieRight", this.highChartsOption);
     },
@@ -1188,9 +1223,8 @@ export default {
   watch: {
     tableData1: {
       handler() {
-        // 数据更改时也要加
         this.$nextTick(() => {
-          this.$refs.vueSeamlessScroll.reset();
+          this.$refs.sssjControl && this.$refs.sssjControl.reset(); // 添加存在性判断
         });
       },
       immediate: true,
@@ -1451,8 +1485,11 @@ export default {
   width: calc(100% - 920px);
   background: url("~@/assets/images/screen/bg3.png") no-repeat center;
   background-size: contain;
+  background-position-y: 10px;
   text-align: center;
   position: relative;
+  pointer-events: auto;
+  z-index: 999;
   .dot {
     width: 42px;
     height: 70px;

src/views/Screen/items/home.vue

 <template>
-  <div class="app-container home">
+  <div class="home">
     <div id="cesiumContainer"></div>
   </div>
 </template>
@@ -71,13 +71,14 @@ export default {
       this.viewer.cesiumWidget.creditContainer.style.display = "none";
 
       // 加载3D Tileset
-      Cesium.Cesium3DTileset.fromUrl(
-        "http://localhost:80/terra_b3dms_yd/tileset.json",
-        {
-          maximumScreenSpaceError: 1,
-          pickable: true,
-        }
-      )
+      Cesium.Cesium3DTileset.fromUrl("/terra_b3dms_yd/tileset.json", {
+        maximumScreenSpaceError: 8, // 从默认16改为8（值越小越清晰）
+        maximumMemoryUsage: 1024, // 增加内存限制到1024MB
+        skipLevelOfDetail: false, // 禁用LOD跳过
+        preferLeaves: true, // 优先加载叶子节点
+        skipScreenSpaceErrorFactor: 16, // 降低跳过系数
+        loadSiblings: true, // 加载相邻节点
+      })
         .then((tileset) => {
           this.tileset = tileset; // 存储tileset供后续使用
           this.viewer.scene.primitives.add(tileset);
@@ -214,9 +215,26 @@ export default {
 .home {
   width: 100%;
   height: 100%;
+  padding-top: 0px;
+  pointer-events: auto;
   #cesiumContainer {
     width: 100%;
     height: 100%;
+    pointer-events: auto;
+    position: relative;
+    z-index: 0 !important; // 强制设置基础层级
+    transform: translateZ(0); // 创建独立层叠上下文
   }
 }
+// 新增强制穿透样式
+::v-deep .cesium-widget canvas {
+  pointer-events: auto !important;
+  position: relative;
+  z-index: 0;
+}
+
+// 移除Cesium默认事件拦截
+::v-deep .cesium-widget-credits {
+  display: none !important;
+}
 </style>

src/views/Screen/items/psxt.vue

@@ -70,11 +70,12 @@
                       : 'dwr'
                   "
                 >
-                  <p>电机电流：{{ item.motorCurrent }}A</p>
-                  <p>电机轴承温度：{{ item.motorBearingTemp }}℃</p>
-                  <p>水泵轴承温度：{{ item.pumpBearingTemp }}℃</p>
-                  <p>水泵流量：{{ item.pumpFlow }}</p>
-                  <p>排水管路压力：{{ item.drainagePressure }}</p>
+                  <p>水泵前温：{{ item.pumpFrontTemp | decimalFilter }}℃</p>
+                  <p>水泵后温：{{ item.pumpRearTemp | decimalFilter }}℃</p>
+                  <p>电机前温：{{ item.motorFrontTemp | decimalFilter }}℃</p>
+                  <p>电机后温：{{ item.motorRearTemp | decimalFilter }}℃</p>
+                  <p>出水压力：{{ item.outletPressure | decimalFilter }}Mpa</p>
+                  <p>吸水负压：{{ item.inletVacuum | decimalFilter }}Mpa</p>
                 </div>
               </div>
               <p>
@@ -137,9 +138,7 @@ export default {
   created() {
     this.initPumpList();
   },
-  mounted() {
-    this.startWaterAnimation();
-  },
+  mounted() {},
   methods: {
     initPumpList() {
       getDraData().then((res) => {
@@ -155,6 +154,8 @@ export default {
     },
     // 水泵开启按钮
     openWaterPump(item, status) {
+      console.log("我点击了");
+
       this.upWindowShow = true;
       // this.submitPumpPassword(pumpId, this.password, 0);
       this.pumpId = item.pumpId;
@@ -190,6 +191,11 @@ export default {
     },
   },
   filters: {
+    decimalFilter(value) {
+      return value === null || typeof value === "undefined"
+        ? "--"
+        : Number(value).toFixed(2);
+    },
     // 水池显示数据过滤
     sumpFilter(item, key) {
       // 优化过滤逻辑
@@ -201,6 +207,7 @@ export default {
 
 <style scoped lang="scss">
 .home {
+  pointer-events: auto; // 新增这行
   width: 100%;
   height: 100%;
   background: url("~@/assets/images/screen/psxt/bg.png") no-repeat center;
@@ -215,6 +222,7 @@ export default {
     background-size: 100% 100%;
     position: relative;
     .center-title-box {
+      z-index: 888;
       width: 200px;
       height: 100%;
       margin: auto;
@@ -279,7 +287,9 @@ export default {
       height: 200px;
       // background: #ffffff;
       .H36 {
-        height: 36px;
+        pointer-events: auto; // 新增这行
+        position: relative; // 新增层级控制
+        z-index: 999;
         .button {
           width: 86px;
           height: 36px;
@@ -334,7 +344,7 @@ export default {
             position: relative;
             .tip-box {
               width: 192px;
-              height: 136px;
+              height: 156px;
               background: #0a1e36;
               border: 2px solid #00deff;
               padding: 7px 13px 15px 10px;
@@ -379,7 +389,7 @@ export default {
           }
           .tip-box {
             width: 192px;
-            height: 136px;
+            height: 156px;
             background: #0a1e36;
             border: 2px solid #00deff;
             padding: 7px 13px 15px 10px;

src/views/Screen/items/rydw.vue

@@ -191,7 +191,7 @@
                 class="custom-item custom-item2"
               >
                 <span class="custom-item-content custom-item-content2">{{
-                  item.serialNumber
+                  index + 1
                 }}</span>
                 <span class="custom-item-content custom-item-content2">{{
                   item.name
@@ -201,11 +201,11 @@
                 >
                   <div
                     class="progress"
-                    :style="{ width: progressWidth(item.frequency) }"
+                    :style="{ width: progressWidth(item.value) }"
                   ></div>
                 </div>
                 <span class="custom-item-content custom-item-content2">{{
-                  item.frequency
+                  item.value
                 }}</span>
               </li>
             </ul>
@@ -350,28 +350,7 @@ export default {
           lastTime: "2025-01-10 14:21:31",
         },
       ],
-      recentSevDaysAlarmsData: [
-        {
-          serialNumber: "1",
-          name: "张三",
-          frequency: "45",
-        },
-        {
-          serialNumber: "1",
-          name: "张三",
-          frequency: "32",
-        },
-        {
-          serialNumber: "1",
-          name: "张三",
-          frequency: "31",
-        },
-        {
-          serialNumber: "1",
-          name: "张三",
-          frequency: "29",
-        },
-      ],
+      recentSevDaysAlarmsData: [],
       subStaStatus: [],
       realTimeDistributionData: [],
       subStaStatusData: [{ num: 0 }, { num: 0 }, { num: 0 }],
@@ -449,14 +428,17 @@ export default {
     getMonthlyRankings() {
       monthlyRankings().then((res) => {
         if (res.code !== 200) return;
-        this.recentSevDaysAlarmsData = res.data;
+        this.recentSevDaysAlarmsData = res.data.sort(
+          (a, b) => b.value - a.value
+        );
+        //获取的re.data格式为[{name：张三,value：54}]这样。需要根据value排序，然后value大的在前
       });
     },
     //控制进度条宽度
     progressWidth(frequency) {
       //最大值从recentSevDaysAlarmsData中获取，且保证位数为0
       const maxFrequencyData = this.recentSevDaysAlarmsData.reduce(
-        (max, item) => Math.max(max, Math.ceil(item.frequency / 10) * 10),
+        (max, item) => Math.max(max, Math.ceil(item.value / 10) * 10),
         0
       );
       const width = (frequency / maxFrequencyData) * 100 + "%";

src/views/Screen/items/tsj.vue

@@ -171,7 +171,7 @@ export default {
       // 动画控制
       animationId: null,
       timer: null,
-
+      source: null, // 新增取消令牌源
       // 位置信息
       currentPos: null,
       targetPos: null,
@@ -211,7 +211,10 @@ export default {
   },
   beforeDestroy() {
     this.clearAnimation();
+    if (this.timer) {
       clearInterval(this.timer);
+      this.timer = null; // 新增清理引用
+    }
   },
   mounted() {
     this.initPositions();
@@ -226,7 +229,7 @@ export default {
 
     // 计算当前位置
     calculatePosition(type) {
-      if (!POSITIONS.length) return { top: "450px", left: "413px" };
+      if (!POSITIONS.length) return { top: "450px", left: "428px" };
 
       const currentDepth = Number(this.zgposition) || 0;
 
@@ -238,7 +241,7 @@ export default {
 
       return {
         top: `${position[type] || POSITIONS[0][type]}px`, // 添加默认值
-        left: type === "glposy" ? "413px" : "365px",
+        left: type === "glposy" ? "428px" : "365px",
       };
     },
 
@@ -310,6 +313,7 @@ export default {
     startAutoUpdate() {
       this.clearAnimation();
       this.getdata();
+
       this.timer = setInterval(this.getdata, 30000);
     },
 
@@ -633,7 +637,7 @@ export default {
         transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
       }
       .dianti-box {
-        width: 78px;
+        width: 46px;
         height: 78px;
         background: url("~@/assets/images/screen/tsj/bg3.png") no-repeat center;
         background-size: 100% 100%;