4.3

src/views/hotel/components/video-box.vue

@@ -2,8 +2,10 @@
   <div class="video-box">
 	  <div v-if="videoLog == 1" class="video-wrapper">
 	    <div class="video-list">
+			<div class="empty-box" v-if="videoList.length==0&&cond">
+						未接入
+			</div>
 	      <div
-		  v-if="videoList?.length"
 	        class="video-item"
 	        v-for="(item, index) in videoList"
 	        :key="index"
@@ -37,10 +39,7 @@
 	          </p>
 	        </div>
 	      </div>
-		  <div class="empty-box" v-else> 
+		 
-		  未接入
-		  <!-- <el-empty :image="emptyIco" description="暂无数据" /> -->
-		  </div>
 	    </div>
 	    <div class="pagination">
 	      <el-pagination
@@ -146,6 +145,7 @@
 	const LEFT = 'LEFT' // 左转
 	const RIGHT = 'RIGHT' // 右转
 	const STOP = 'STOP' // 停止操作
+	let cond = ref(false)
 	let ACTION = '0'
 	let hlsRefs = []
 	let hlsRef = null
@@ -170,6 +170,7 @@
 	    params.pageNum = 1
 	    videoList.value = []
 	    total.value = 0
+		cond.value = false
 	    getRegionsList()
 	  })
 	}
@@ -230,15 +231,18 @@
 	}
 	//获取酒店视频列表
 	const getRegionsList = async()=>{
+		clearHlsRefs()
 		videoLog.value = 1
 		try {
 		    if (loading.value) return
 			let res = await getRegionsListApi({...params})
 		    if (res.data.length > 0) {
 			   videoList.value = res.data
+			   cond.value = true
 			   total.value = res.total
 			   console.log(videoList.value,'酒店视频列表')
 			   nextTick(() => {
+				   if(!videoList.value.length) return false
 			     videoList.value.forEach(async (x, index) => {
 			       const video = document.getElementById(`monitorVideo${index}`)
 			       const hls = new Hls({
@@ -255,6 +259,8 @@
 			     })
 			   })
 		    } else {
+				videoList.value = []
+				cond.value = true
 			  if (timer) clearInterval(timer)
 			}
 			loading.value = false