1

src/components/AF-exhibition/footer/index.vue

@@ -13,15 +13,16 @@
     <el-col>
       <!-- <img src="../../../assets/image-af/test1.png" alt="" class="videoBox"> -->
       
-    <video id="myVideo" class="video-js videoBox" controls preload="auto" data-setup='{}' style='width: 100%;height: 100%'>
-        <source id="source" src="http://172.16.120.243:10008/record/test/20210730/out.m3u8" type="application/x-mpegURL"/>
-    </video>
+      <video id="myVideo" class="video-js videoBox" controls preload="auto" data-setup='{}' style='width: 100%;height: 100%' v-if="resList[0]">
+          <source id="source" :src="resList[0] && resList[0].url || ''" type="application/x-mpegURL"/>
+      </video>
+      <img src="../../../assets/image-af/red.png" alt="" class="redImage" v-else>
     </el-col>
     <el-col>
-      <video id="myVideo2" class="video-js videoBox" controls preload="auto" data-setup='{}' style='width: 100%;height: 100%'>
-          <source id="source" src="http://172.16.120.243:10008/record/test/20210730/out.m3u8" type="application/x-mpegURL"/>
+      <video id="myVideo2" class="video-js videoBox" controls preload="auto" data-setup='{}' style='width: 100%;height: 100%' v-if="resList[1]">
+          <source id="source" :src="resList[1] && resList[1].url || ''" type="application/x-mpegURL"/>
       </video>
-      <img src="../../../assets/image-af/red.png" alt="" class="redImage">
+      <img src="../../../assets/image-af/red.png" alt="" class="redImage" v-else>
     </el-col>
   </el-row>
 </template>
@@ -35,30 +36,46 @@ export default {
   data(){
     return{
       myVideo:null,
-      myVideo2:null
+      myVideo2:null,
+      resList:[]
     }
   },
   mounted(){
-    this.videoPlay()
+    this.getData()
   },
   methods:{
     videoPlay(){
       // videojs 简单使用
-      this.myVideo = videojs('myVideo', {
-          bigPlayButton: false,
-          textTrackDisplay: false,
-          posterImage: false,
-          errorDisplay: false,
-      })
-      this.myVideo.play()// 视频播放
-      // videojs 简单使用
-      this.myVideo2 = videojs('myVideo2', {
-          bigPlayButton: false,
-          textTrackDisplay: false,
-          posterImage: false,
-          errorDisplay: false,
-      })
-      this.myVideo2.play()// 视频播放
+      if(this.resList[0]){
+        this.myVideo = videojs('myVideo', {
+            bigPlayButton: false,
+            textTrackDisplay: false,
+            posterImage: false,
+            errorDisplay: false,
+        })
+        console.log(this.myVideo)
+        this.myVideo.play()// 视频播放
+      }
+      if(this.resList[1]){
+        this.myVideo2 = videojs('myVideo2', {
+            bigPlayButton: false,
+            textTrackDisplay: false,
+            posterImage: false,
+            errorDisplay: false,
+        })
+        this.myVideo2.play()// 视频播放
+      }
+    },
+     async getData(){
+      let res = await this.$axios.get('/AFTop/querySystemUrl?'+this.$qs.stringify({
+        type: 1
+      }))
+      if(res.success){
+        this.resList = res.data.slice(0,2)
+        this.$nextTick(()=>{
+          this.videoPlay()
+        })
+      }
     }
   }
 }

src/components/AF-exhibition/header-view/index.vue

@@ -6,9 +6,9 @@
       <el-col class="weather">
         <!-- <img v-if="weatherObj.weather_pic" :src="weatherObj.weather_pic || ''" alt="" /> -->
         <!-- <span v-if="weatherObj.weather">{{ weatherObj.weather }} {{ weatherObj.temperature }}℃</span> -->
-        <img src="../../../assets/image/header-AF.png" alt="" />
+         <img :src="$store.state.weaterRes.weather_pic || ''" alt="" />
       </el-col>
-      <el-col>多云 23℃</el-col>
+     <el-col>{{$store.state.weaterRes.weather || ''}}   {{$store.state.weaterRes.temperature || ''}}℃</el-col>
     </el-row>
     <el-row class="headerCenterBox">永天科技-智能物联网设备</el-row>
     <el-row class="headerRowBox">

src/components/SD-school/header-view/index.vue

@@ -13,7 +13,7 @@
       <el-col>PM2.5<span>{{$store.state.weaterRes.aqiDetail && $store.state.weaterRes.aqiDetail.pm2_5 || ''}}</span></el-col>
     </el-row>
     <el-row class="headerCenterBox">山东IOT物联网平台</el-row>
-    <el-row class="headerRowBox">
+    <el-row class="headerRowBox"> 
       <el-col>空气质量：{{$store.state.weaterRes.aqi || ''}}</el-col>
       <el-col>相对湿度：{{$store.state.weaterRes.sd || ''}}</el-col>
     </el-row>

src/plugins/axios.js

@@ -5,7 +5,7 @@ import axios from "axios";
 
 // Full config:  https://github.com/axios/axios#request-config
 // axios.defaults.baseURL = 'http://120.55.70.156:80/api';
-axios.defaults.baseURL = 'http://121.40.217.77:8082';
+axios.defaults.baseURL = 'http://172.16.120.92:8089';
 // axios.defaults.baseURL = process.env.baseURL || process.env.apiUrl || 'http://120.55.70.156:80/api';
 // axios.defaults.headers.common['Authorization'] = AUTH_TOKEN;
 // axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';

src/store/index.js

@@ -6,8 +6,8 @@ Vue.use(Vuex)
 export default new Vuex.Store({
     state: {
         windowWidth: 1920 + 1080,
-        typeFire: 1,
-        wsUrl: '172.16.120.92:8084',
+        typeFire: 0,
+        wsUrl: '121.40.217.77:8082',
         weaterRes: {}
     },
     mutations: {