修改直播

.env.production

@@ -1,4 +1,4 @@
 ENV = 'production'
 
-VUE_APP_BASE_API = 'http://36.133.205.221:81'
+VUE_APP_BASE_API = 'https://lcny-api.peidikeji.cn'
 

package.json

@@ -72,7 +72,9 @@
     "core-js": "^3.6.5",
     "flv.js": "^1.6.2",
     "flyio": "^0.6.2",
+    "hls.js": "^1.4.12",
     "lodash-es": "^4.17.21",
+    "mui-player": "^1.8.1",
     "portal-vue": "^2.1.7",
     "node-sass": "^6.0.1",
     "sass-loader": "^13.3.2",

src/App.vue

@@ -664,4 +664,15 @@ uni-page-body {
     pointer-events: none;
   }
 }
+
+.right-part {
+  .full-switch {
+    display: none;
+  }
+}
+.left-part{
+  .live-mode{
+    display: none;
+  }
+}
 </style>

src/components/live-video/index.vue

@@ -0,0 +1,94 @@
+<template>
+  <view class="h-full w-full">
+    <div ref="muiPlayer" style="width: 100%; height: 100%"></div>
+  </view>
+</template>
+<script>
+import 'mui-player/dist/mui-player.min.css'
+import MuiPlayer from 'mui-player'
+import Flv from 'flv.js'
+import Hls from 'hls.js'
+export default {
+  props: {
+    url: {
+      type: String,
+      default: null,
+    },
+    type: {
+      type: String,
+    },
+  },
+  mounted() {
+    this.videoPlayer()
+  },
+  methods: {
+    videoPlayer() {
+      let parse = {}
+      if (this.type == 'm3u8') {
+        parse = {
+          type: 'hls',
+          loader: Hls,
+          config: {
+            debug: false,
+          },
+        }
+      } else {
+        parse = {
+          type: 'flv',
+          loader: Flv,
+          config: {
+            debug: false,
+          },
+        }
+      }
+      this.mp = new MuiPlayer({
+        container: this.$refs.muiPlayer,
+        live: true,
+        src: this.url,
+        autoplay: true,
+        muted: true,
+        parse: parse,
+        pageHead:false,
+        videoAttribute: [
+          {
+            attrKey: 'webkit-playsinline',
+            attrValue: 'webkit-playsinline',
+          },
+          {
+            attrKey: 'playsinline',
+            attrValue: 'playsinline',
+          },
+          {
+            attrKey: 'x5-video-player-type',
+            attrValue: 'h5-page',
+          },
+        ],
+        custom: {
+          footerControls: [
+            {
+              style: {},
+            },
+          ],
+        },
+      })
+      this.$nextTick(() => {
+        this.mp.on('ready', (event) => {
+          let _video = this.mp.video()
+          _video.play()
+          _video.addEventListener('play', (e) => {
+            //播放事件
+            this.$emit('onPlayFn')
+          })
+          _video.addEventListener('ended', (e) => {
+            //播放完成事件
+            this.$emit('onEndedFn')
+          })
+        })
+      })
+    },
+  },
+}
+</script>
+<style lang="scss">
+
+</style>

src/components/video-flv-h5/video-flv-h5.vue

@@ -49,7 +49,8 @@ export default {
 		player.x5VideoPlayerType='h5-page'
 		player.x5VideoPlayerFullscreen="false"
 		player.autoplay= true // 以上均为 video标签的属性配置
-		player.style = 'width: 100%;height:100%';
+    // player.poster = 'https://img.yzcdn.cn/vant/cat.jpeg'
+		player.style = 'width: 100%;height:100%;object-fit:cover;';
         let videoElement = this.$refs.myPlayer;
 		
 		// console.log(videoElement,'videoPlayer=========')

src/components/video-m3u8-h5/video-m3u8-h5.vue

@@ -32,12 +32,15 @@ export default {
     initVideo() {
       let video = document.createElement('video')
       video.id = this.id
-      video.style = 'width: 100%; height: 100%;'
+      video.style = 'width: 100%; height: 100%;object-fit:cover;'
       video.controls = true
       video.preload = 'auto'
+      video.setAttribute('x5-playsinline', 'true')
+      video.setAttribute('x-webkit-airplay', 'allow')
       video.setAttribute('playsinline', true) //IOS微信浏览器支持小窗内播放
       video.setAttribute('webkit-playsinline', true) //这个bai属性是ios 10中设置可以让视频在小du窗内播放，也就是不是全zhi屏播放的video标签的一个属性
       video.setAttribute('x5-video-player-type', 'h5') //安卓 声明启用同层H5播放器 可以在video上面加东西
+      // video.setAttribute('poster', 'https://img.yzcdn.cn/vant/cat.jpeg')
       let source = document.createElement('source')
       source.src = this.url
       video.appendChild(source)

src/pages/basics/components/basics-edit.vue

@@ -10,6 +10,9 @@
             <u-form-item label="外部链接">
               <u-switch v-model="form.is_blank"></u-switch>
             </u-form-item>
+            <u-form-item label="重点">
+              <u-switch v-model="form.extends.priority"></u-switch>
+            </u-form-item>
             <u-form-item label="外部链接" v-if="form.is_blank">
               <u-input v-model="form.blank_url" placeholder="请输入"></u-input>
             </u-form-item>
@@ -155,6 +158,7 @@ export default {
         description: '',
         address_lng: '',
         address_lat: '',
+        extends:{}
       },
     }
   },

src/pages/index/monitor.vue

@@ -138,8 +138,10 @@
         <view class="video_li" v-for="(video, index) in videoList" :key="index">
           <view class="video_cd">
             <!-- #ifdef H5 -->
-						<videoM3u8H5 v-if="video.video_type=='m3u8'" :url="video.video_url" :id="`m_${index}_refsM3u8`"></videoM3u8H5>
+            <!-- {{ video.video_url }} -->
-            <video-flv-h5 v-else :url="video.video_url"></video-flv-h5>
+            <LiveVideo :url="video.video_url" :type="video.video_type"></LiveVideo>
+						<!-- <videoM3u8H5 v-if="video.video_type=='m3u8'" :url="video.video_url" :id="`m_${index}_refsM3u8`"></videoM3u8H5>
+            <video-flv-h5 v-else :url="video.video_url"></video-flv-h5> -->
             <!-- #endif -->
           </view>
           <view class="bottom-box">
@@ -166,8 +168,9 @@
         >
           <view class="video_cd">
             <!-- #ifdef H5 -->
-						<videoM3u8H5  v-if="video.video_type=='m3u8'" :url="video.video_url"  :id="`m_${index}_refsM3u82`" ></videoM3u8H5>
+            <LiveVideo :url="video.video_url" :type="video.video_type"></LiveVideo>
-            <video-flv-h5 v-else :url="video.video_url"></video-flv-h5>
+						<!-- <videoM3u8H5  v-if="video.video_type=='m3u8'" :url="video.video_url"  :id="`m_${index}_refsM3u82`" ></videoM3u8H5>
+            <video-flv-h5 v-else :url="video.video_url"></video-flv-h5> -->
             <!-- #endif -->
           </view>
           <view class="bottom-box">
@@ -200,10 +203,11 @@
 <script>
 import videoFlvH5 from '@/components/video-flv-h5/video-flv-h5.vue'
 import videoM3u8H5 from '@/components/video-m3u8-h5/video-m3u8-h5.vue'
+import LiveVideo from '@/components/live-video/index.vue'
 import Request from '@/api/luch-request/index.js'
 const http = new Request()
 export default {
-  components: { videoFlvH5,videoM3u8H5 },
+  components: { videoFlvH5,videoM3u8H5 ,LiveVideo},
   data() {
     return {
       list: [

src/pages/index/soil-monitoring.vue

@@ -71,6 +71,7 @@
 					</view>
 				</view>
 			</view>
+			<template v-if="loadingType!=0">
 			<!-- 电导率 -->
 			<view class="chart_section">
 			  <view class="top_box">
@@ -82,6 +83,7 @@
 				</view>
 			  <view class="cart_box">
 				  <qiun-data-charts 
+					v-if="loadingType!=0"
 					type="area"
 					:loadingType="loadingType"
 					:opts="opts"
@@ -100,6 +102,7 @@
 				</view>
 			  <view class="cart_box">
 				  <qiun-data-charts 
+					v-if="loadingType!=0"
 					:loadingType="loadingType"
 					type="area"
 					:opts="opts"
@@ -118,6 +121,7 @@
 				</view>
 			  <view class="cart_box">
 				  <qiun-data-charts 
+					v-if="loadingType!=0"
 					:loadingType="loadingType"
 					type="area"
 					:opts="optsc"
@@ -136,6 +140,7 @@
 				</view>
 			  <view class="cart_box">
 				  <qiun-data-charts 
+					v-if="loadingType!=0"
 					:loadingType="loadingType"
 					type="area"
 					:opts="opts"
@@ -154,6 +159,7 @@
 				</view>
 			  <view class="cart_box">
 				  <qiun-data-charts 
+					v-if="loadingType!=0"
 					:loadingType="loadingType"
 					type="area"
 					:opts="opts"
@@ -172,6 +178,7 @@
 				</view>
 			  <view class="cart_box">
 				  <qiun-data-charts 
+					v-if="loadingType!=0"
 					:loadingType="loadingType"
 					type="area"
 					:opts="opts"
@@ -179,6 +186,7 @@
 				  />
 			  </view>
 			</view>
+		</template>
 		</view>
 		<!-- 设置预警值 -->
 		<u-popup v-model="warningShow" border-radius="28" width="94%" height="70%"

src/pages/index/water-quality.vue

@@ -69,6 +69,7 @@
 					</view>
 				</view>
 			</view>
+			<template v-if="loadingType!=0">
 			<!-- 氯 -->
 			<view class="chart_section">
 			  <view class="top_box">
@@ -178,6 +179,7 @@
 				  />
 			  </view>
 			</view>
+		</template>
 		</view>
 		<!-- 设置预警值 -->
 		<u-popup v-model="warningShow" border-radius="28" width="94%" height="70%"

yarn.lock

@@ -5899,6 +5899,11 @@ highlight.js@^10.7.1:
   resolved "https://registry.npmmirror.com/highlight.js/-/highlight.js-10.7.3.tgz"
   integrity sha512-tzcUFauisWKNHaRkN4Wjl/ZA07gENAjFl3J/c480dprkGTg5EQstgaNFqBfUqCq54kZRIEcreTsAgF/m2quD7A==
 
+hls.js@^1.4.12:
+  version "1.4.12"
+  resolved "https://registry.yarnpkg.com/hls.js/-/hls.js-1.4.12.tgz#2022daa29d10c662387d80a5297f8330f8ef5ee2"
+  integrity sha512-1RBpx2VihibzE3WE9kGoVCtrhhDWTzydzElk/kyRbEOLnb1WIE+3ZabM/L8BqKFTCL3pUy4QzhXgD1Q6Igr1JA==
+
 hmac-drbg@^1.0.1:
   version "1.0.1"
   resolved "https://registry.npmmirror.com/hmac-drbg/-/hmac-drbg-1.0.1.tgz"
@@ -8049,6 +8054,11 @@ ms@2.1.3:
   resolved "https://registry.npmmirror.com/ms/-/ms-2.1.3.tgz"
   integrity sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==
 
+mui-player@^1.8.1:
+  version "1.8.1"
+  resolved "https://registry.yarnpkg.com/mui-player/-/mui-player-1.8.1.tgz#3c0405eefeee46bfcd9535165bd022bb871bf8dd"
+  integrity sha512-5o0SnSyVImxT9XUO6jCMmcJ+ZyAEJeFvdeZDHHPNS/LdwhzWX4yQPNgx8nzRbcUJ749xpqEQ6uVddiexLyvvqg==
+
 multicast-dns-service-types@^1.1.0:
   version "1.1.0"
   resolved "https://registry.npmmirror.com/multicast-dns-service-types/-/multicast-dns-service-types-1.1.0.tgz"
@@ -8131,7 +8141,7 @@ negotiator@0.6.3:
   resolved "https://registry.npmmirror.com/negotiator/-/negotiator-0.6.3.tgz"
   integrity sha512-+EUsqGPLsM+j/zdChZjsnX51g4XrHFOIXwfnCVPGlQk/k5giakcKsuxCObBRu6DSm9opw/O6slWbJdghQM4bBg==
 
-neo-async@^2.5.0, neo-async@^2.6.0, neo-async@^2.6.1:
+neo-async@^2.5.0, neo-async@^2.6.0, neo-async@^2.6.1, neo-async@^2.6.2:
   version "2.6.2"
   resolved "https://registry.npmmirror.com/neo-async/-/neo-async-2.6.2.tgz"
   integrity sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==
@@ -9922,6 +9932,13 @@ sane@^4.0.3:
     minimist "^1.1.1"
     walker "~1.0.5"
 
+sass-loader@^13.3.2:
+  version "13.3.2"
+  resolved "https://registry.yarnpkg.com/sass-loader/-/sass-loader-13.3.2.tgz#460022de27aec772480f03de17f5ba88fa7e18c6"
+  integrity sha512-CQbKl57kdEv+KDLquhC+gE3pXt74LEAzm+tzywcA0/aHZuub8wTErbjAoNI57rPUWRYRNC5WUnNl8eGJNbDdwg==
+  dependencies:
+    neo-async "^2.6.2"
+
 sass@^1.43.4:
   version "1.66.1"
   resolved "https://registry.npmmirror.com/sass/-/sass-1.66.1.tgz"