微调

src/components/dockerCont/live-content-dock-jg.vue

@@ -1157,84 +1157,6 @@ defineExpose({
 		z-index: 10;
 	}
 }
-// .fullscreen-container {
-// 	position: fixed;
-// 	top: 0;
-// 	left: 0;
-// 	right: 0;
-// 	bottom: 0;
-// 	display: flex;
-// 	justify-content: center;
-// 	align-items: center;
-// 	z-index: 999999;
-// 	width: 100%;
-//     height: 100%;
-// 	.content {
-// 		width: 100%;
-// 		// height: 871px;
-// 		height: 100%;
-// 		/* src\pages\page-web\daping\img\弹窗.png */
-// 		// background: url(img/icon/bgData.png) no-repeat;
-// 		background-size: cover;
-// 		position: relative;
-// 		// padding: 30px 24px 0;
-// 		.content-top {
-// 			display: flex;
-// 			justify-content: end;
-// 			margin-bottom: 10px;
-// 			> .top-right {
-// 				width: 755px;
-// 				padding-left: 240px;
-// 				display: flex;
-// 				justify-content: space-between;
-// 				align-items: flex-start;
-// 				> .btn-list {
-// 					display: inline-flex;
-// 					color: #fff;
-// 					> .btn {
-// 						width: 90px;
-// 						font-size: 16px;
-// 						margin: 0 10px;
-// 						border: 1px solid #d3d3d3;
-// 						padding: 4px 12px;
-// 						border-radius: 12px;
-// 						text-align: center;
-// 						text-wrap: nowrap;
-// 						&:hover {
-// 							cursor: pointer;
-// 						}
-// 					}
-// 					> .btnActive {
-// 						background-color: #1890ff;
-// 						border: 1px solid #1890ff;
-// 					}
-// 				}
-// 				> .close {
-// 					font-size: 26px;
-// 					color: #fff;
-// 					&:hover {
-// 						cursor: pointer;
-// 					}
-// 				}
-// 			}
-// 		}
-// 		> .player-content {
-// 			width: 100%;
-// 			height: 100%;
-// 			display: flex;
-// 			align-items: center;
-// 			justify-content: center;
-// 			overflow: hidden;
-// 			> .player {
-// 				width: 100%;
-// 				height: 100%;
-// 				display: flex;
-// 				align-items: center;
-// 				justify-content: center;
-// 			}
-// 		}
-// 	}
-// }
 
 .fullscreen-container {
 	position: fixed;
@@ -1245,7 +1167,7 @@ defineExpose({
 	display: flex;
 	justify-content: center;
 	align-items: center;
-	z-index: 999;
+	z-index: 9999;
 	background-color: rgba(0, 0, 0, 0.5);
 	pointer-events: auto;
 	&:fullscreen {

src/components/dockerCont/live-content-jg-wrc.vue

@@ -16,12 +16,12 @@
 				<a-spin size="large" v-if="loading" />
 				<!-- <div id="player" v-else></div> -->
 				<div class="player" :id="'player_' + sn" v-else>
-					<jessibuca 
+					<stream-player
-						ref="jessibucaVideo" 
+						ref="jessibucaVideo"
-						style="width: 100%; height: 100%" 
+						style="width: 100%; height: 100%"
 						:videoUrl="flvUrl"
 						:showQu="false"
-					></jessibuca>
+					></stream-player>
 				</div>
 			</div>
 		</div>
@@ -35,7 +35,7 @@ import { message } from 'ant-design-vue';
 import jswebrtc from '/@/vendors/jswebrtc.js';
 import FlvExtend from 'flv-extend';
 import { useUserAuthor } from '/@/hooks/use-g-author';
-import jessibuca from './live/jessibuca.vue';
+import streamPlayer from './live/stream-player.vue';
 import { getAiLive } from '/@/api/daping';
 const { getAiAuthor } = useUserAuthor();
 interface Props {
@@ -289,7 +289,8 @@ const createRtmpVideo = async (url: string) => {
 	// 将video加入到 dom中
 	// remotePlay?.appendChild(link);
 	await nextTick(async () => {
-		await rtmpVideoData(url, 'player_'+props.sn);
+		flvUrl.value = url;
+		await jessibucaVideo.value?.play?.(url);
 	});
 };
 let videoPalyer = null;
@@ -429,16 +430,15 @@ watch(
 	}
 );
 onMounted(() => {
-
 	// console.log('ckckckckk----',props)
 	// onloadCamera();
 	createRtmpVideo(props.flvUrl)
 });
 const emit = defineEmits(['close']);
 const closeVideo = () => {
-	if (!videoPalyer) return;
-	videoPalyer.close();
 	videoPalyer = null;
+	flvUrl.value = '';
+	jessibucaVideo.value?.destroy?.();
 };
 const closeMoadl = () => {
 	closeVideo();

src/components/dockerCont/live/jessibuca.vue

@@ -349,6 +349,11 @@ const pause = () => {
 };
 </script>
 <style lang="scss" scoped>
+#jessibuca {
+  width: 100%;
+  height: 100%;
+}
+
 .buttons-box {
   width: 100%;
   height: 28px;

src/components/dockerCont/live/stream-player.vue

@@ -3,6 +3,7 @@
     <jessibuca
       v-show="!isWebrtcMode"
       ref="flvPlayerRef"
+      style="width: 100%; height: 100%;"
       :currentVedioDatas="currentVedioDatas"
       :videoUrl="videoUrl"
       :error="error"
@@ -393,7 +394,7 @@ defineExpose({
   height: 100%;
   display: block;
   background-color: #000;
-  object-fit: fill;
+  object-fit:cover;
 }
 
 .buttons-box-right {