src/views/page/largeScreen.vue

@@ -23,7 +23,7 @@
           <span>大数据平台</span>
         </div>
         <div class="item item_act" @click="toBackPage">
-          <img src="../../assets/img/nav2.png" alt="">
+          <img src="../../assets/img/nav5.png" alt="">
           <span>控制器</span>
         </div>
         <div class="item item_act" v-show="false">
@@ -138,7 +138,8 @@
                     <div :class="current == index
                       ? 'swiper-slide swiper-slide2'
                       : 'swiper-slide swiper-slide1'
-                      " v-for="(item, index) in dataList" :key="index" :style="styleItem" @click="getCurrent(index,item)">
+                      " v-for="(item, index) in dataList" :key="index" :style="styleItem"
+                      @click="getCurrent(index, item)">
                       {{ item.greenhouseName + '温室' }}
                     </div>
                   </div>
@@ -174,23 +175,33 @@
               <div class="i_content">
                 <div class="i_content_item">
                   <span>1#风机</span>
-                  <span :style="fanStatus.status[0] == 1 ? '':'color:#86C2FF;'">{{ fanStatus.status[0] == 1 ? '打开' : '关闭' }}</span>
+                  <span :style="fanStatus.status[0] == 1 ? '' : 'color:#86C2FF;'">{{ fanStatus.status[0] == 1 ? '打开' :
+                    '关闭'
+                  }}</span>
                   <span class="line"></span>
                   <span>2#风机</span>
-                  <span :style="fanStatus.status[1] == 1 ? '':'color:#86C2FF;'">{{ fanStatus.status[1] == 1 ? '打开' : '关闭' }}</span>
+                  <span :style="fanStatus.status[1] == 1 ? '' : 'color:#86C2FF;'">{{ fanStatus.status[1] == 1 ? '打开' :
+                    '关闭'
+                  }}</span>
                 </div>
                 <div class="line1"></div>
                 <div class="i_content_item">
                   <span>3#风机</span>
-                  <span :style="fanStatus.status[2] == 1 ? '':'color:#86C2FF;'">{{ fanStatus.status[2] == 1 ? '打开' : '关闭' }}</span>
+                  <span :style="fanStatus.status[2] == 1 ? '' : 'color:#86C2FF;'">{{ fanStatus.status[2] == 1 ? '打开' :
+                    '关闭'
+                  }}</span>
                   <span class="line"></span>
                   <span>4#风机</span>
-                  <span :style="fanStatus.status[3] == 1 ? '':'color:#86C2FF;'">{{ fanStatus.status[3] == 1 ? '打开' : '关闭' }}</span>
+                  <span :style="fanStatus.status[3] == 1 ? '' : 'color:#86C2FF;'">{{ fanStatus.status[3] == 1 ? '打开' :
+                    '关闭'
+                  }}</span>
                 </div>
                 <div class="line1"></div>
                 <div class="i_content_item" style="width:50%">
                   <span>5#风机</span>
-                  <span :style="fanStatus.status[4] == 1 ? '':'color:#86C2FF;'">{{ fanStatus.status[4] == 1 ? '打开' : '关闭' }}</span>
+                  <span :style="fanStatus.status[4] == 1 ? '' : 'color:#86C2FF;'">{{ fanStatus.status[4] == 1 ? '打开' :
+                    '关闭'
+                  }}</span>
                   <span class="line"></span>
                 </div>
               </div>
@@ -662,28 +673,13 @@ export default {
     }
   },
   mounted() {
-    new Swiper(".middle_disasterWarningAnalysis", {
-      slidesPerView: 4,
-      spaceBetween: 10,
-      navigation: {
-        nextEl: ".right_button",
-        prevEl: ".left_button",
-      },
-    });
 
-    new Swiper(".mySwiper_video", {
-      loop: true,
-      navigation: {
-        nextEl: ".swiper-button-next_video",
-        prevEl: ".swiper-button-prev_video",
-      },
-    });
+
+
 
     this.drag_boxHandler()
 
-    // this.timer_ = setTimeout(() => {
-    //   this.$router.push({ path: '/largeScreen1' }) 
-    // }, 6000);
+
 
 
     this.login()
@@ -694,8 +690,9 @@ export default {
       this.getNowTime()
     }, 1000)
   },
-  destroyed() {
-    this.timer_ = null
+  beforeDestroy() {
+    clearInterval(this.timer_) && this.timer_
+    // this.timer_ = null
   },
   methods: {
     // 根据用户id查询对应的设备大数据信息
@@ -703,6 +700,17 @@ export default {
       this.api.Bigdata_getAllControl(userid).then(res => {
         // console.log('根据用户id查询对应的设备大数据信息', res);
         this.dataList = res.data.data
+        setTimeout(() => {
+          new Swiper(".middle_disasterWarningAnalysis", {
+            slidesPerView: 4,
+            spaceBetween: 10,
+            navigation: {
+              nextEl: ".right_button",
+              prevEl: ".left_button",
+            },
+          });
+        }, 100);
+
         if (res.status === 200) {
           res.data.data.forEach(el => {
             // this.get_weather_echart_data(el.deviceId)
@@ -823,6 +831,20 @@ export default {
 
             this.getVideoData(item.cameraSerialNumber, item.cameraChannelNumber, index)
             // this.getVideoData("L18357958", "5")
+            setTimeout(() => {
+              new Swiper(".mySwiper_video", {
+                // loop: true,
+                autoplay: true,
+                autoplay: {
+                  disableOnInteraction: false,
+                  delay: 3000
+                },
+                navigation: {
+                  nextEl: ".swiper-button-next_video",
+                  prevEl: ".swiper-button-prev_video",
+                },
+              });
+            }, 100);
           }
         })
         // console.log(this.get_sel_eqbyid_list);
@@ -914,6 +936,10 @@ export default {
       let userInfo = JSON.parse(localStorage.getItem('userInfo'));
       this.dataInit(userInfo.userid)
       this.get_sel_eqbyid(userInfo.userid)
+
+      this.timer_ = setTimeout(() => {
+        this.$router.push({ path: '/largeScreen1' })
+      }, 30000);
     },
 
     createVideoNew(accessToken, url, index) {
@@ -965,7 +991,7 @@ export default {
       this.$router.push({ path: '/realTime' });
     },
 
-    getCurrent(index,item) {
+    getCurrent(index, item) {
       this.current = index;
       // console.log(item,'00000000000000');
       this.get_readControl_getState(item.deviceId)

src/views/page/largeScreen1.vue

@@ -185,7 +185,7 @@ export default {
       left_: 2,
 
       popContentList: [],
-      popContentCurrent: 5,
+      popContentCurrent: 0,
 
       typeList: [{
         label: '无意义的传感器',
@@ -546,11 +546,6 @@ export default {
   mounted() {
     this.drag_boxHandler()
 
-    // this.timer1 = setTimeout(() => {
-    //   this.$router.push({ path: '/largeScreen' })
-    // }, 20000);
-
-
 
     // this.timer = setInterval(() => {
     //   this.dialogVisible = !this.dialogVisible
@@ -562,13 +557,16 @@ export default {
       this.popContentCurrent++
       if (this.popContentCurrent > 5) {
         this.popContentCurrent = 0
+        this.$router.push({ path: '/largeScreen' })
       }
     }, 3000)
   },
-  destroyed() {
-    this.timer = null;
-    this.timer1 = null;
-    this.timer2 = null
+  beforeDestroy() {
+    // clearInterval(this.timer1) && this.timer1
+    clearInterval(this.timer2) && this.timer2
+    // this.timer = null;
+    // this.timer1 = null;
+    // this.timer2 = null
   },
   methods: {
     // 根据用户id查询对应的设备大数据信息
@@ -603,27 +601,27 @@ export default {
       if (name == '二号') {
         // this.top_ = 1;
         // this.left_ = 6.2
-        return 'top:1rem;left:8rem'
+        return 'top:1rem;left:6.2rem'
       } else if (name == '一号') {
         // this.top_ = 3.5;
         // this.left_ = 3.8
-        return 'top:3.5rem;left:4.8rem'
+        return 'top:3.5rem;left:3.8rem'
       } else if (name == '3号') {
         // this.top_ = 2;
         // this.left_ = 9
-        return 'top:2rem;left:11.5rem'
+        return 'top:2rem;left:9rem'
       } else if (name == '4号') {
         // this.top_ = 2;
         // this.left_ = 9.3
-        return 'top:2rem;left:14rem'
+        return 'top:2rem;left:9.3rem'
       } else if (name == '5') {
         // this.top_ = 3.5;
         // this.left_ = 6.5
-        return 'top:6.5rem;left:10.5rem'
+        return 'top:3.5rem;left:6.5rem'
       } else if (name == '6') {
         // this.top_ = 0.8;
         // this.left_ = 7.2
-        return 'top:0.8rem;left:11rem'
+        return 'top:0.8rem;left:7.2rem'
       }
     },