3d模型图替换/环境大屏修改/3d配置修改

public/webA/index.js

@@ -1706,12 +1706,12 @@ function setAlertValue(MathineID,wendu,sidu){
 //设置温湿度: setAlertValue("DAK_MO_OAO_001",4,5)
 
 // 设置是否显示
-function setYangGanCanshow(MathineID, canshow){
-  var theName = yangans.get(MathineID);
-  if(theName.indexOf("yangan") >= 0){
-    scene.getTransformNodeByName(theName).canshow = canshow;
-  }
-}
+// function setYangGanCanshow(MathineID, canshow){
+//   var theName = yangans.get(MathineID);
+//   if(theName.indexOf("yangan") >= 0){
+//     scene.getTransformNodeByName(theName).canshow = canshow;
+//   }
+// }
 
 
 //功能：档案柜标点点击

public/webB/index.js

@@ -234,6 +234,8 @@ BABYLON.DefaultLoadingScreen.prototype.hideLoadingUI = function () {
   yangan05.name = "yangan05"
   yangan05.nameID = "ZLS_MO_OAO_001"
 
+  yangan05.canshow = true;
+
   yangan05.wendu = 0;
   yangan05.sidu = 0;
 

public/webC/index.js

@@ -70,7 +70,8 @@ BABYLON.DefaultLoadingScreen.prototype.hideLoadingUI = function () {
   var yangan06 = scene.getTransformNodeByName("yangan_5");
   yangan06.name = "yangan06"
   yangan06.nameID = "YLS_MO_OAO_001"
-
+  
+  yangan06.canshow = true;
   yangan06.wendu = 0;
   yangan06.sidu = 0;
 

public/webD/index.html

@@ -856,6 +856,7 @@
   <script src="./js/babylonjs.loaders.min.js"></script>
   <script src="./js/babylon.gui.min.js"></script>
   <script src="./js/draco_wasm_wrapper_gltf.js"></script>
+  <script src="./js/draco_decoder_gltf.wasm"></script>
 	<script src="./index.js"></script>
 
 </body>

public/webD/index.js

@@ -17,7 +17,9 @@ var showdd = 50;
 BABYLON.DefaultLoadingScreen.prototype.displayLoadingUI = function () {
   if (document.getElementById("customLoadingScreenDiv")) {
     document.getElementById("customLoadingScreenDiv").style.display = "initial";
-    return;
+     // 给vue页面传值，加载完成之前
+     parent.getIframeLoading("true")
+     return;
   }
   this._loadingDiv = document.createElement("div");
   //this._loadingDiv.style.height = '1750px';
@@ -474,6 +476,8 @@ BABYLON.DefaultLoadingScreen.prototype.hideLoadingUI = function () {
   //var v2 = scene.getTransformNodeByName("后门01");
   //v2.setParent( scene.getTransformNodeByName("档案柜03"),true);
   //v2.position = new BABYLON.Vector3(v2.position.x,-122.479,v2.position.z);
+  // 给vue页面传值，加载完成之后
+  parent.getIframeLoading("false")
 }
 
 // createScene function that creates and return the scene

public/webE/index.html

@@ -856,6 +856,7 @@
   <script src="./js/babylonjs.loaders.min.js"></script>
   <script src="./js/babylon.gui.min.js"></script>
   <script src="./js/draco_wasm_wrapper_gltf.js"></script>
+  <script src="./js/draco_decoder_gltf.wasm"></script>
 	<script src="./index.js"></script>
 </body>
 

public/webE/index.js

@@ -17,6 +17,8 @@ var showdd = 50;
 BABYLON.DefaultLoadingScreen.prototype.displayLoadingUI = function () {
   if (document.getElementById("customLoadingScreenDiv")) {
     document.getElementById("customLoadingScreenDiv").style.display = "initial";
+    // 给vue页面传值，加载完成之前
+    parent.getIframeLoading("true")
     return;
   }
   this._loadingDiv = document.createElement("div");
@@ -37,7 +39,7 @@ BABYLON.DefaultLoadingScreen.prototype.displayLoadingUI = function () {
   this._resizeLoadingUI();
   window.addEventListener("resize", this._resizeLoadingUI);
   document.body.appendChild(this._loadingDiv);
-};
+}
 
 var movebyName = function (nodeName) {
   var x = scene.getTransformNodeByName(nodeName);
@@ -477,6 +479,8 @@ BABYLON.DefaultLoadingScreen.prototype.hideLoadingUI = function () {
   //var v2 = scene.getTransformNodeByName("后门01");
   //v2.setParent( scene.getTransformNodeByName("档案柜03"),true);
   //v2.position = new BABYLON.Vector3(v2.position.x,-122.479,v2.position.z);
+    // 给vue页面传值，加载完成之后
+    parent.getIframeLoading("false")
 }
 
 // createScene function that creates and return the scene

public/webTotal7/index.html

@@ -861,6 +861,7 @@
 	<script src="./js/babylonjs.loaders.min.js"></script>
 	<script src="./js/babylon.gui.min.js"></script>
 	<script src="./js/draco_wasm_wrapper_gltf.js"></script>
+	<script src="./js/draco_decoder_gltf.wasm"></script>
 	<script src="./index.js"></script>
 
 </body>

src/views/environmentalScreen/index.vue

@@ -9,34 +9,92 @@
           <span class="left-bottom-line" />
           <h3><i class="iconfont icon-kongqizhiliangshuju" />档案库空气质量数据</h3>
           <ul class="screen-env-list">
-            <li v-show="topDisplayData.DAK_DIV_TOP_003.show" :class="{ 'li-warn': topDisplayData.DAK_DIV_TOP_003.curstatus > 0 }">
+            <li v-show="(bannerIndex === 0 || bannerIndex === 1 || bannerIndex === 2 || bannerIndex === 3) && topDisplayData.DAK_DIV_TOP_003.show" :class="{ 'li-warn': topDisplayData.DAK_DIV_TOP_003.curstatus > 0 }">
               <svg-icon icon-class="co2" class-name="msg-list-svg" />
               <div class="msg-txt">
                 <span class="msg-list-num">{{ topDisplayData.DAK_DIV_TOP_003.curValue }}</span>
                 <p class="msg-list-unit">CO2 {{ topDisplayData.DAK_DIV_TOP_003.unit }}</p>
               </div>
             </li>
-            <li v-show="topDisplayData.DAK_DIV_TOP_004.show" :class="{ 'li-warn': topDisplayData.DAK_DIV_TOP_004.curstatus > 0 }">
+            <li v-show="(bannerIndex === 0 || bannerIndex === 1 || bannerIndex === 2 || bannerIndex === 3) && topDisplayData.DAK_DIV_TOP_004.show" :class="{ 'li-warn': topDisplayData.DAK_DIV_TOP_004.curstatus > 0 }">
               <svg-icon icon-class="voc" class-name="msg-list-svg" />
               <div class="msg-txt">
                 <span class="msg-list-num">{{ topDisplayData.DAK_DIV_TOP_004.curValue }}</span>
                 <p class="msg-list-unit">VOC {{ topDisplayData.DAK_DIV_TOP_004.unit }}</p>
               </div>
             </li>
-            <li v-show="topDisplayData.DAK_DIV_TOP_005.show" :class="{ 'li-warn': topDisplayData.DAK_DIV_TOP_005.curstatus > 0 }" class="msg-pm">
+            <li v-show="(bannerIndex === 0 || bannerIndex === 1 || bannerIndex === 2 || bannerIndex === 3) && topDisplayData.DAK_DIV_TOP_005.show" :class="{ 'li-warn': topDisplayData.DAK_DIV_TOP_005.curstatus > 0 }" class="msg-pm">
               <svg-icon icon-class="pm25" class-name="msg-list-svg" />
               <div class="msg-txt">
                 <span class="msg-list-num">{{ topDisplayData.DAK_DIV_TOP_005.curValue }}</span>
                 <p class="msg-list-unit">PM2.5 {{ topDisplayData.DAK_DIV_TOP_005.unit }}</p>
               </div>
             </li>
-            <li v-show="topDisplayData.DAK_DIV_TOP_006.show" :class="{ 'li-warn': topDisplayData.DAK_DIV_TOP_006.curstatus > 0 }" class="msg-pm">
+            <li v-show="(bannerIndex === 0 || bannerIndex === 1 || bannerIndex === 2 || bannerIndex === 3) && topDisplayData.DAK_DIV_TOP_006.show" :class="{ 'li-warn': topDisplayData.DAK_DIV_TOP_006.curstatus > 0 }" class="msg-pm">
               <svg-icon icon-class="pm10" class-name="msg-list-svg" />
               <div class="msg-txt">
                 <span class="msg-list-num">{{ topDisplayData.DAK_DIV_TOP_006.curValue }}</span>
                 <p class="msg-list-unit">PM10 {{ topDisplayData.DAK_DIV_TOP_006.unit }}</p>
               </div>
             </li>
+            <!-- 7F 现行文件室 / 信息技术室 -->
+            <li v-show="(bannerIndex === 4 || bannerIndex === 5) && topDisplayData.DXW_DIV_TOP_003.show" :class="{ 'li-warn': topDisplayData.DXW_DIV_TOP_003.curstatus > 0 }">
+              <svg-icon icon-class="co2" class-name="msg-list-svg" />
+              <div class="msg-txt">
+                <span class="msg-list-num">{{ topDisplayData.DXW_DIV_TOP_003.curValue }}</span>
+                <p class="msg-list-unit">CO2 {{ topDisplayData.DXW_DIV_TOP_003.unit }}</p>
+              </div>
+            </li>
+            <li v-show="(bannerIndex === 4 || bannerIndex === 5) && topDisplayData.DXW_DIV_TOP_004.show" :class="{ 'li-warn': topDisplayData.DXW_DIV_TOP_004.curstatus > 0 }">
+              <svg-icon icon-class="voc" class-name="msg-list-svg" />
+              <div class="msg-txt">
+                <span class="msg-list-num">{{ topDisplayData.DXW_DIV_TOP_004.curValue }}</span>
+                <p class="msg-list-unit">VOC {{ topDisplayData.DXW_DIV_TOP_004.unit }}</p>
+              </div>
+            </li>
+            <li v-show="(bannerIndex === 4 || bannerIndex === 5) && topDisplayData.DXW_DIV_TOP_005.show" :class="{ 'li-warn': topDisplayData.DXW_DIV_TOP_005.curstatus > 0 }" class="msg-pm">
+              <svg-icon icon-class="pm25" class-name="msg-list-svg" />
+              <div class="msg-txt">
+                <span class="msg-list-num">{{ topDisplayData.DXW_DIV_TOP_005.curValue }}</span>
+                <p class="msg-list-unit">PM2.5 {{ topDisplayData.DXW_DIV_TOP_005.unit }}</p>
+              </div>
+            </li>
+            <li v-show="(bannerIndex === 4 || bannerIndex === 5) && topDisplayData.DXW_DIV_TOP_006.show" :class="{ 'li-warn': topDisplayData.DXW_DIV_TOP_006.curstatus > 0 }" class="msg-pm">
+              <svg-icon icon-class="pm10" class-name="msg-list-svg" />
+              <div class="msg-txt">
+                <span class="msg-list-num">{{ topDisplayData.DXW_DIV_TOP_006.curValue }}</span>
+                <p class="msg-list-unit">PM10 {{ topDisplayData.DXW_DIV_TOP_006.unit }}</p>
+              </div>
+            </li>
+            <!-- 7F 待销文件室 -->
+            <li v-show="bannerIndex === 6 && topDisplayData.XXW_DIV_TOP_003.show" :class="{ 'li-warn': topDisplayData.XXW_DIV_TOP_003.curstatus > 0 }">
+              <svg-icon icon-class="co2" class-name="msg-list-svg" />
+              <div class="msg-txt">
+                <span class="msg-list-num">{{ topDisplayData.XXW_DIV_TOP_003.curValue }}</span>
+                <p class="msg-list-unit">CO2 {{ topDisplayData.XXW_DIV_TOP_003.unit }}</p>
+              </div>
+            </li>
+            <li v-show="bannerIndex === 6 && topDisplayData.XXW_DIV_TOP_004.show" :class="{ 'li-warn': topDisplayData.XXW_DIV_TOP_004.curstatus > 0 }">
+              <svg-icon icon-class="voc" class-name="msg-list-svg" />
+              <div class="msg-txt">
+                <span class="msg-list-num">{{ topDisplayData.XXW_DIV_TOP_004.curValue }}</span>
+                <p class="msg-list-unit">VOC {{ topDisplayData.XXW_DIV_TOP_004.unit }}</p>
+              </div>
+            </li>
+            <li v-show="bannerIndex === 6 && topDisplayData.XXW_DIV_TOP_005.show" :class="{ 'li-warn': topDisplayData.XXW_DIV_TOP_005.curstatus > 0 }" class="msg-pm">
+              <svg-icon icon-class="pm25" class-name="msg-list-svg" />
+              <div class="msg-txt">
+                <span class="msg-list-num">{{ topDisplayData.XXW_DIV_TOP_005.curValue }}</span>
+                <p class="msg-list-unit">PM2.5 {{ topDisplayData.XXW_DIV_TOP_005.unit }}</p>
+              </div>
+            </li>
+            <li v-show="bannerIndex === 6 && topDisplayData.XXW_DIV_TOP_006.show" :class="{ 'li-warn': topDisplayData.XXW_DIV_TOP_006.curstatus > 0 }" class="msg-pm">
+              <svg-icon icon-class="pm10" class-name="msg-list-svg" />
+              <div class="msg-txt">
+                <span class="msg-list-num">{{ topDisplayData.XXW_DIV_TOP_006.curValue }}</span>
+                <p class="msg-list-unit">PM10 {{ topDisplayData.XXW_DIV_TOP_006.unit }}</p>
+              </div>
+            </li>
           </ul>
         </div>
         <div class="env-item container-wrap">
@@ -68,120 +126,66 @@
             </ul>
           </div>
         </div>
-        <!-- <div class="env-item container-wrap">
-          <span class="right-top-line" />
-          <span class="left-bottom-line" />
-          <h3><i class="iconfont icon-menjinjilu" />门禁记录</h3>
-          <el-table
-            ref="table"
-            style="min-width: 100%;"
-            height="calc(100% - 38px)"
-            :data="tableData"
-            class="warehose-el-table"
-            :row-class-name="rowBgColor"
-          >
-            <el-table-column prop="time" label="时间" align="center" min-width="60" />
-            <el-table-column prop="warehouse" label="库房" align="center" min-width="60" />
-            <el-table-column prop="name" label="档案名称" align="center" :show-overflow-tooltip="true" min-width="85" />
-          </el-table>
-        </div> -->
         <!-- 门禁记录 -->
         <security-door :height="'calc(100% - 38px)'" />
       </div>
       <div class="env-main-middle">
         <div class="env-3d">
-
-          <el-carousel indicator-position="outside" height="450px" arrow="never" :interval="5000" style="padding-top: 100px;">
+          <div class="banner-top-name">{{ bannerRoomName }}</div>
+          <el-carousel ref="carousel" indicator-position="outside" height="450px" arrow="never" :interval="8000" style="padding-top: 100px;" @change="handleChange">
             <el-carousel-item v-for="item in 7" :key="item">
               <img :src="require(`../../assets/images/largeScreen/screen${ item }.png`)" alt="">
             </el-carousel-item>
           </el-carousel>
           <!-- <iframe id="myIframe" ref="myIframe" name="iframeMap" class="iframe_box" src="/webA/index.html" frameborder="0" scrolling="no" /> -->
           <ul class="screen-env-list">
-            <li v-show="topDisplayData.DAK_DIV_TOP_001.show" :class="{ 'li-warn': topDisplayData.DAK_DIV_TOP_001.curstatus > 0 }">
+            <li v-show="(bannerIndex === 0 || bannerIndex === 1 || bannerIndex === 2 || bannerIndex === 3) && topDisplayData.DAK_DIV_TOP_001.show" :class="{ 'li-warn': topDisplayData.DAK_DIV_TOP_001.curstatus > 0 }">
               <svg-icon icon-class="temperature" class-name="msg-list-svg" />
               <div class="msg-txt">
                 <span class="msg-list-num">{{ topDisplayData.DAK_DIV_TOP_001.curValue }}</span>
                 <p class="msg-list-unit">温度 {{ topDisplayData.DAK_DIV_TOP_001.unit }}</p>
               </div>
             </li>
-            <li v-show="topDisplayData.DAK_DIV_TOP_002.show" :class="{ 'li-warn': topDisplayData.DAK_DIV_TOP_002.curstatus > 0 }">
+            <li v-show="(bannerIndex === 0 || bannerIndex === 1 || bannerIndex === 2 || bannerIndex === 3)&& topDisplayData.DAK_DIV_TOP_002.show" :class="{ 'li-warn': topDisplayData.DAK_DIV_TOP_002.curstatus > 0 }">
               <svg-icon icon-class="shidu" class-name="msg-list-svg" />
               <div class="msg-txt">
                 <span class="msg-list-num">{{ topDisplayData.DAK_DIV_TOP_002.curValue }}</span>
                 <p class="msg-list-unit">湿度 {{ topDisplayData.DAK_DIV_TOP_002.unit }}</p>
               </div>
             </li>
-          </ul>
-        </div>
-        <!-- <div class="env-item container-wrap  device-container">
-          <span class="right-top-line" />
-          <span class="left-bottom-line" />
-          <h3><i class="iconfont icon-shebeizhuangtai" />设备状态</h3>
-          <div class="state-list">
-            <span>正常</span>
-            <span>报警</span>
-          </div>
-          <ul class="env-device-list">
-            <li class="device-warn">
-              <div class="env-device-img">
-                <img src="~@/assets/images/largeScreen/device-1.png" alt="">
-              </div>
-              <div class="env-device-text">
-                <p>密集架</p>
-                <span />
-              </div>
-            </li>
-            <li>
-              <div class="env-device-img">
-                <img src="~@/assets/images/largeScreen/device-2.png" alt="">
-              </div>
-              <div class="env-device-text">
-                <p>回转柜</p>
-                <span />
-              </div>
-            </li>
-            <li>
-              <div class="env-device-img">
-                <img src="~@/assets/images/largeScreen/device-3.png" alt="">
-              </div>
-              <div class="env-device-text">
-                <p>空调</p>
-                <span />
+            <!-- 7F 现行文件室 / 信息技术室 -->
+            <li v-show="(bannerIndex === 4 || bannerIndex === 5) && topDisplayData.XXW_DIV_TOP_001.show" :class="{ 'li-warn': topDisplayData.XXW_DIV_TOP_001.curstatus > 0 }">
+              <svg-icon icon-class="temperature" class-name="msg-list-svg" />
+              <div class="msg-txt">
+                <span class="msg-list-num">{{ topDisplayData.XXW_DIV_TOP_001.curValue }}</span>
+                <p class="msg-list-unit">温度 {{ topDisplayData.XXW_DIV_TOP_001.unit }}</p>
               </div>
             </li>
-            <li>
-              <div class="env-device-img">
-                <img src="~@/assets/images/largeScreen/device-4.png" alt="">
-              </div>
-              <div class="env-device-text">
-                <p>通道门</p>
-                <span />
+            <li v-show="(bannerIndex === 4 || bannerIndex === 5) && topDisplayData.XXW_DIV_TOP_002.show" :class="{ 'li-warn': topDisplayData.XXW_DIV_TOP_002.curstatus > 0 }">
+              <svg-icon icon-class="shidu" class-name="msg-list-svg" />
+              <div class="msg-txt">
+                <span class="msg-list-num">{{ topDisplayData.XXW_DIV_TOP_002.curValue }}</span>
+                <p class="msg-list-unit">湿度 {{ topDisplayData.XXW_DIV_TOP_002.unit }}</p>
               </div>
             </li>
-            <li>
-              <div class="env-device-img">
-                <img src="~@/assets/images/largeScreen/device-5.png" alt="">
-              </div>
-              <div class="env-device-text">
-                <p>漏水传感器</p>
-                <span />
+            <!-- 7F 待销文件室 -->
+            <li v-show="bannerIndex === 6 && topDisplayData.DXW_DIV_TOP_001.show" :class="{ 'li-warn': topDisplayData.DXW_DIV_TOP_001.curstatus > 0 }">
+              <svg-icon icon-class="temperature" class-name="msg-list-svg" />
+              <div class="msg-txt">
+                <span class="msg-list-num">{{ topDisplayData.DXW_DIV_TOP_001.curValue }}</span>
+                <p class="msg-list-unit">温度 {{ topDisplayData.DXW_DIV_TOP_001.unit }}</p>
               </div>
             </li>
-            <li>
-              <div class="env-device-img">
-                <img src="~@/assets/images/largeScreen/device-6.png" alt="">
-              </div>
-              <div class="env-device-text">
-                <p>温湿度传感器</p>
-                <span />
+            <li v-show="bannerIndex === 6 && topDisplayData.DXW_DIV_TOP_002.show" :class="{ 'li-warn': topDisplayData.DXW_DIV_TOP_002.curstatus > 0 }">
+              <svg-icon icon-class="shidu" class-name="msg-list-svg" />
+              <div class="msg-txt">
+                <span class="msg-list-num">{{ topDisplayData.DXW_DIV_TOP_002.curValue }}</span>
+                <p class="msg-list-unit">湿度 {{ topDisplayData.DXW_DIV_TOP_002.unit }}</p>
               </div>
             </li>
           </ul>
-        </div> -->
+        </div>
         <div class="middle-bottom">
-          <!-- <span class="right-top-line" />
-          <span class="left-bottom-line" /> -->
           <div class="container-wrap middle-bottom-l">
             <span class="right-top-line" />
             <span class="left-bottom-line" />
@@ -341,6 +345,8 @@ export default {
   mixins: [statisticsCrud],
   data() {
     return {
+      bannerRoomName: '5F 全景图',
+      bannerIndex: 0,
       nowDate: '',
       timer: null,
       className: ['readRoomContainer', 'collateRoomContainer'],
@@ -386,6 +392,80 @@ export default {
           curValue: '',
           unit: '',
           curstatus: 0
+        },
+        // 7F 现行文件室 / 信息技术室
+        DXW_DIV_TOP_001: {
+          show: false,
+          curValue: '',
+          unit: '',
+          curstatus: 0
+        },
+        DXW_DIV_TOP_002: {
+          show: false,
+          curValue: '',
+          unit: '',
+          curstatus: 0
+        },
+        DXW_DIV_TOP_003: {
+          show: false,
+          curValue: '',
+          unit: '',
+          curstatus: 0
+        },
+        DXW_DIV_TOP_004: {
+          show: false,
+          curValue: '',
+          unit: '',
+          curstatus: 0
+        },
+        DXW_DIV_TOP_005: {
+          show: false,
+          curValue: '',
+          unit: '',
+          curstatus: 0
+        },
+        DXW_DIV_TOP_006: {
+          show: false,
+          curValue: '',
+          unit: '',
+          curstatus: 0
+        },
+        // 7F 待销文件室
+        XXW_DIV_TOP_001: {
+          show: false,
+          curValue: '',
+          unit: '',
+          curstatus: 0
+        },
+        XXW_DIV_TOP_002: {
+          show: false,
+          curValue: '',
+          unit: '',
+          curstatus: 0
+        },
+        XXW_DIV_TOP_003: {
+          show: false,
+          curValue: '',
+          unit: '',
+          curstatus: 0
+        },
+        XXW_DIV_TOP_004: {
+          show: false,
+          curValue: '',
+          unit: '',
+          curstatus: 0
+        },
+        XXW_DIV_TOP_005: {
+          show: false,
+          curValue: '',
+          unit: '',
+          curstatus: 0
+        },
+        XXW_DIV_TOP_006: {
+          show: false,
+          curValue: '',
+          unit: '',
+          curstatus: 0
         }
       },
       waterLeakage: {
@@ -427,7 +507,9 @@ export default {
         }
       }
     })
+    console.log('allDeviceIds', this.allDeviceIds)
     this.displayConfigData = this.allDisplayConfigData.filter((item) => { return item.isDisplay && item.bindState && item.deviceInfo && (item.divPosition.includes('OAO') || item.divPosition.includes('TOP') || item.divPosition.includes('LS')) })
+    console.log('displayConfigData', this.displayConfigData)
     await this.getRealTimeData()
     this.getDayYearBorrowNum()
     this.handleLeftTableNum()
@@ -444,8 +526,8 @@ export default {
     this.dataTimer = setInterval(async() => {
       _this.getDayYearBorrowNum()
       _this.handleLeftTableNum()
-      await _this.getRealTimeData()
-      _this.handleAQI()
+      // await _this.getRealTimeData()
+      // _this.handleAQI()
     }, 1000 * 30)
     // 每隔一分钟刷新档案借阅和档案类型的数据
     this.echartsTimer = setInterval(() => {
@@ -454,6 +536,8 @@ export default {
       _this.getBorrowerNumSta()
       _this.getArchivesTypeStatistics()
     }, this.refreshtime)
+
+    this.$refs.carousel.$on('change', this.handleChange)
   },
   beforeDestroy() {
     if (this.timer) {
@@ -464,6 +548,67 @@ export default {
     }
   },
   methods: {
+    async handleChange(index) {
+      this.bannerIndex = index
+      if (index === 0) {
+        this.bannerRoomName = '5F 全景图'
+        this.roomId = 'D6490DA3D4261E8C26D0E3'
+        await this.changeRoomGetDeivce()
+      } else if (index === 1) {
+        this.bannerRoomName = '5F 档案库'
+        this.roomId = 'D6490DA3D4261E8C26D0E3'
+      } else if (index === 2) {
+        this.bannerRoomName = '5F 整理室'
+        this.roomId = 'D6490DA3D4261E8C26D0E3'
+      } else if (index === 3) {
+        this.bannerRoomName = '5F 阅览室'
+        this.roomId = 'D6490DA3D4261E8C26D0E3'
+      } else if (index === 4) {
+        this.bannerRoomName = '7F 全景图'
+        this.roomId = '1B2DADD8499058954C0CAC'
+        await this.changeRoomGetDeivce()
+      } else if (index === 5) {
+        this.bannerRoomName = '7F 现行文件室 / 信息技术室'
+        this.roomId = '1B2DADD8499058954C0CAC'
+        await this.changeRoomGetDeivce()
+      } else if (index === 6) {
+        this.bannerRoomName = '7F 待销文件室'
+        this.roomId = 'D4C395BFB0A2E7C96C65A0'
+        await this.changeRoomGetDeivce()
+      }
+    },
+    async changeRoomGetDeivce() {
+      this.allDeviceIds = []
+      this.allDisplayConfigData = await displayConfigApi.list({ storeroomId: this.roomId })
+      console.log('allDisplayConfigData2', this.allDisplayConfigData)
+      if (this.bannerIndex === 4 || this.bannerIndex === 5 || this.bannerIndex === 6) {
+        this.allDisplayConfigData.forEach(element => {
+          if (element.isDisplay && element.bindState && element.deviceInfo && (element.divPosition.includes('OAO') || element.divPosition.includes('TOP'))) {
+            this.allDeviceIds.push(element.deviceInfo.deviceId)
+            if (!this.url) {
+              this.url = 'http://' + element.deviceInfo.deviceIp + ':' + element.deviceInfo.devicePort
+            }
+          }
+        })
+        console.log('allDeviceIds2', this.allDeviceIds)
+        this.displayConfigData = this.allDisplayConfigData.filter((item) => { return item.isDisplay && item.bindState && item.deviceInfo && (item.divPosition.includes('OAO') || item.divPosition.includes('TOP')) })
+        console.log('displayConfigData2', this.displayConfigData)
+      } else {
+        this.allDisplayConfigData.forEach(element => {
+          if (element.isDisplay && element.bindState && element.deviceInfo && (element.divPosition.includes('OAO') || element.divPosition.includes('TOP') || element.divPosition.includes('LS'))) {
+            this.allDeviceIds.push(element.deviceInfo.deviceId)
+            if (!this.url) {
+              this.url = 'http://' + element.deviceInfo.deviceIp + ':' + element.deviceInfo.devicePort
+            }
+          }
+        })
+        console.log('allDeviceIds1', this.allDeviceIds)
+        this.displayConfigData = this.allDisplayConfigData.filter((item) => { return item.isDisplay && item.bindState && item.deviceInfo && (item.divPosition.includes('OAO') || item.divPosition.includes('TOP') || item.divPosition.includes('LS')) })
+        console.log('displayConfigData', this.displayConfigData)
+      }
+      await this.getRealTimeData()
+      this.handleAQI()
+    },
     // 加载完成状态传值
     getIframeLoading(value) {
       // console.log(`我是iframe传过来的参数：${value}`)
@@ -1020,4 +1165,17 @@ export default {
     }
   }
 }
+.banner-top-name{
+  position: absolute;
+  left: 0;
+  top: 0;
+  padding: 0 15px;
+  height: 34px;
+  line-height: 32px;
+  font-size: 18px;
+  color: #fff;
+  background-color: #113d72;
+  border: 1px solid #339cff;
+  border-radius: 4px;
+}
 </style>

src/views/storeManage/warehouse3DConfig/index.vue

@@ -199,10 +199,10 @@ export default {
           deviceTypeId = this.cameraTypeId
         } else if (this.form.divPosition.includes('TOP')) {
           deviceTypeId = this.airEquipmentTypeId
-        } else if (this.form.divPosition.includes('LS')) {
-          deviceTypeId = this.waterSensorTypeId
-        } else {
+        } else if (this.form.divPosition.includes('OAO')) {
           deviceTypeId = this.temperaSensorTypeId
+        } else {
+          deviceTypeId = this.waterSensorTypeId
         }
         // 获取设备选项
         crudDevice.getDeviceList({ storeroomId: this.room, deviceTypeId: deviceTypeId }).then((data) => {