flx: 提交视频监控 默认播放不了

This commit is contained in:
X_Rian 2024-09-26 16:48:18 +08:00
parent 625db9ed3f
commit 829d3f1ad2

View File

@ -15,12 +15,15 @@
}" }"
node-key="id" node-key="id"
@node-click="checkVideo" @node-click="checkVideo"
empty-text="" empty-text
> >
<template #default="{ node, data }"> <template #default="{ node, data }">
<span class="custom-tree-node"> <span class="custom-tree-node">
<img v-if="data.deviceType == 2 && data.videoId" src="@/assets/images/icon-video-blue.png" /> <img v-if="data.deviceType == 2 && data.videoId" src="@/assets/images/icon-video-blue.png" />
<img v-else-if="data.deviceType != 2 && data.videoId" src="@/assets/images/icon-video-blue.png" /> <img
v-else-if="data.deviceType != 2 && data.videoId"
src="@/assets/images/icon-video-blue.png"
/>
<span :title="data.name">{{ data.name }}</span> <span :title="data.name">{{ data.name }}</span>
</span> </span>
</template> </template>
@ -38,10 +41,10 @@
</div> </div>
<div class="status">{{ item.deviceState == 1 ? "在线" : "离线" }}</div> <div class="status">{{ item.deviceState == 1 ? "在线" : "离线" }}</div>
</div> </div>
</div> --> </div>-->
</el-scrollbar> </el-scrollbar>
<div class="notoDta" v-if="shipinList.length == 0"> <div class="notoDta" v-if="shipinList.length == 0">
<img src="@/assets/images/noData.png" alt="" /> <img src="@/assets/images/noData.png" alt />
<p>暂无数据</p> <p>暂无数据</p>
</div> </div>
</Card> </Card>
@ -54,16 +57,20 @@
<div class="safe-helmet">智能安全帽</div> <div class="safe-helmet">智能安全帽</div>
</div> </div>
<!-- 萤石云播放 --> <!-- 萤石云播放 -->
<div ref="playWndBox" style="width: 100%; height: 100%; margin: 0 5% 2% 5%" v-if="videoType === 1"> <div
ref="playWndBox"
style="width: 100%; height: 100%; margin: 0 5% 2% 5%"
v-if="videoType === 1"
>
<ysyPlayAndPlayback :ref="'ysy'" :ysyParams="ysyParams"></ysyPlayAndPlayback> <ysyPlayAndPlayback :ref="'ysy'" :ysyParams="ysyParams"></ysyPlayAndPlayback>
</div> </div>
<!-- 播放海康 --> <!-- 播放海康 -->
<div ref="playWndBox" style="width: 100%; height: 100%; margin: 0 2% 0% 1%" > <div ref="playWndBox" style="width: 100%; height: 100%; margin: 0 2% 0% 1%">
<div id="playWnd" class="playWnd" style="width: 100%; height: 100%"></div> <div id="playWnd" class="playWnd" style="width: 100%; height: 100%"></div>
<!-- :style="{ <!-- :style="{
height: playWndHeight + 'px', height: playWndHeight + 'px',
width: playWndWidth + 'xp' width: playWndWidth + 'xp'
}" --> }"-->
</div> </div>
</Card> </Card>
</div> </div>
@ -152,6 +159,8 @@ let objData = ref({
// //
const checkVideo = async (item: any) => { const checkVideo = async (item: any) => {
// //
console.log("item", item);
if (item.serialNumber) { if (item.serialNumber) {
ysyParams.value = item; ysyParams.value = item;
cameraIndexCode.value = item.serialNumber; cameraIndexCode.value = item.serialNumber;
@ -170,13 +179,20 @@ const getVideoList = async () => {
// all=1 // all=1
}); });
shipinList.value = res.result.videoList; shipinList.value = res.result.videoList;
if (res.result.videoList[0].list) { if (res.result.videoList[0].list) {
console.log("111");
if (!res.result.videoList[0].list[0]?.outip) { if (!res.result.videoList[0].list[0]?.outip) {
console.log("111-111");
objData.value.appkey = res.result.videoList[0].list[0].appId; objData.value.appkey = res.result.videoList[0].list[0].appId;
objData.value.ip = res.result.videoList[0].list[0].account; objData.value.ip = res.result.videoList[0].list[0].account;
objData.value.secret = res.result.videoList[0].list[0].appSecret; objData.value.secret = res.result.videoList[0].list[0].appSecret;
objData.value.port = +res.result.videoList[0].list[0].password; objData.value.port = +res.result.videoList[0].list[0].password;
} else { } else {
console.log("111-222");
objData.value.appkey = res.result.videoList[0].list[0].appId; objData.value.appkey = res.result.videoList[0].list[0].appId;
objData.value.ip = res.result.videoList[0].list[0].outip; objData.value.ip = res.result.videoList[0].list[0].outip;
objData.value.secret = res.result.videoList[0].list[0].appSecret; objData.value.secret = res.result.videoList[0].list[0].appSecret;
@ -186,6 +202,11 @@ const getVideoList = async () => {
cameraIndexCode.value = res.result.videoList[0].list[0].serialNumber; cameraIndexCode.value = res.result.videoList[0].list[0].serialNumber;
// firstVideoId.value = res.result.videoList[0].serialNumber; // firstVideoId.value = res.result.videoList[0].serialNumber;
// previewVideo(res.result.videoList[0].list[0].serialNumber); // previewVideo(res.result.videoList[0].list[0].serialNumber);
console.log("res.result.videoList[0].list[0].outport", res.result.videoList[0].list[0].appId);
console.log("res.result.videoList[0].list[0].outport", res.result.videoList[0].list[0].outip);
console.log("res.result.videoList[0].list[0].outport", res.result.videoList[0].list[0].outport);
console.log("res.result.videoList[0].list[0].outport", res.result.videoList[0].list[0].outport);
console.log(objData.value); console.log(objData.value);
console.log("视频列表", res); console.log("视频列表", res);
ysyParams.value = res.result.videoList[0].list[0]; ysyParams.value = res.result.videoList[0].list[0];
@ -198,16 +219,42 @@ const getVideoList = async () => {
oWebControl.JS_Disconnect(); oWebControl.JS_Disconnect();
} }
} else { } else {
console.log("222");
if (!res.result.videoList[0].list[0]?.outip) { if (!res.result.videoList[0].list[0]?.outip) {
if (res.result.videoList[0].appId) {
objData.value.appkey = res.result.videoList[0].appId; objData.value.appkey = res.result.videoList[0].appId;
objData.value.ip = res.result.videoList[0].account; objData.value.ip = res.result.videoList[0].account;
objData.value.secret = res.result.videoList[0].appSecret; objData.value.secret = res.result.videoList[0].appSecret;
objData.value.port = +res.result.videoList[0].password; objData.value.port = +res.result.videoList[0].password;
console.log("222-111");
console.log("res.result.videoList[0].appId", res.result.videoList[0].appId);
console.log("res.result.videoList[0].appId", res.result.videoList[0].account);
console.log("res.result.videoList[0].appId", res.result.videoList[0].appSecret);
console.log("res.result.videoList[0].appId", +res.result.videoList[0].password);
} else {
console.log("222-111 - 没有list");
objData.value.appkey = res.result.videoList[1].list[0].appId || res.result.videoList[2].list[0].appId;
objData.value.ip = res.result.videoList[1].list[0].account || res.result.videoList[2].list[0].account;
objData.value.secret = res.result.videoList[1].list[0].appSecret || res.result.videoList[2].list[0].appSecret;
objData.value.port = +res.result.videoList[1].list[0].password || +res.result.videoList[2].list[0].password;
console.log("res.result.videoList[0].appId", res.result.videoList[1].list[0].appId);
console.log("res.result.videoList[0].appId", res.result.videoList[1].list[0].account);
console.log("res.result.videoList[0].appId", res.result.videoList[1].list[0].appSecret);
console.log("res.result.videoList[0].appId", +res.result.videoList[1].list[0].password);
}
} else { } else {
objData.value.appkey = res.result.videoList[0].appId; objData.value.appkey = res.result.videoList[0].appId;
objData.value.ip = res.result.videoList[0].outip; objData.value.ip = res.result.videoList[0].outip;
objData.value.secret = res.result.videoList[0].appSecret; objData.value.secret = res.result.videoList[0].appSecret;
objData.value.port = +res.result.videoList[0].outport; objData.value.port = +res.result.videoList[0].outport;
console.log("222-222");
console.log("res.result.videoList[0].list[0].outport", res.result.videoList[0].list[0].appId);
console.log("res.result.videoList[0].list[0].outport", res.result.videoList[0].list[0].outip);
console.log("res.result.videoList[0].list[0].outport", res.result.videoList[0].list[0].outport);
console.log("res.result.videoList[0].list[0].outport", res.result.videoList[0].list[0].outport);
} }
cameraIndexCode.value = res.result.videoList[0].serialNumber; cameraIndexCode.value = res.result.videoList[0].serialNumber;
@ -304,7 +351,7 @@ onMounted(async () => {
const tagDomObj = document.querySelector(".videoPlayerBig .content"); const tagDomObj = document.querySelector(".videoPlayerBig .content");
const htmlFontSize = getComputedStyle(window.document.documentElement)["font-size"]; const htmlFontSize = getComputedStyle(window.document.documentElement)["font-size"];
const htmlFontSizeNumber = +htmlFontSize.slice(0, htmlFontSize.indexOf("px")); const htmlFontSizeNumber = +htmlFontSize.slice(0, htmlFontSize.indexOf("px"));
console.log(htmlFontSizeNumber,tagDomObj?.clientWidth, tagDomObj?.clientHeight / 12); console.log(htmlFontSizeNumber, tagDomObj?.clientWidth, tagDomObj?.clientHeight / 12);
// playWndHeight.value = tagDomObj?.clientHeight / 1.2; // playWndHeight.value = tagDomObj?.clientHeight / 1.2;
// playWndWidth.value = tagDomObj?.clientWidth / 1.2; // playWndWidth.value = tagDomObj?.clientWidth / 1.2;
playWndHeight.value = tagDomObj?.clientHeight / 1.05; playWndHeight.value = tagDomObj?.clientHeight / 1.05;