flx:视频监控新增码流切换
This commit is contained in:
parent
6244057a64
commit
5cccb8fe3f
BIN
src/assets/images/iscImage/codestream1.png
Normal file
BIN
src/assets/images/iscImage/codestream1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
BIN
src/assets/images/iscImage/codestream2.png
Normal file
BIN
src/assets/images/iscImage/codestream2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
@ -19,6 +19,18 @@
|
|||||||
<div class="controls-bottom">
|
<div class="controls-bottom">
|
||||||
<div></div>
|
<div></div>
|
||||||
<div>
|
<div>
|
||||||
|
<el-tooltip
|
||||||
|
class="item"
|
||||||
|
effect="dark"
|
||||||
|
:content="`${devH5List[i - 1] && devH5List[i - 1].defaultStreamTypeCut ? '主' : '子'}码流`"
|
||||||
|
placement="top"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="bgImage codestream"
|
||||||
|
:class="{ codestream_active: devH5List[i - 1] && devH5List[i - 1].defaultStreamTypeCut }"
|
||||||
|
@click="isCodeStream(i)"
|
||||||
|
></div>
|
||||||
|
</el-tooltip>
|
||||||
<el-tooltip
|
<el-tooltip
|
||||||
class="item"
|
class="item"
|
||||||
effect="dark"
|
effect="dark"
|
||||||
@ -160,6 +172,7 @@ export default {
|
|||||||
const row = {
|
const row = {
|
||||||
...item,
|
...item,
|
||||||
eIndex: this.iWndIndex,
|
eIndex: this.iWndIndex,
|
||||||
|
defaultStreamTypeCut: item.defaultStreamType,
|
||||||
};
|
};
|
||||||
if (this.numCount == 1) {
|
if (this.numCount == 1) {
|
||||||
this.play(row, this.iWndIndex);
|
this.play(row, this.iWndIndex);
|
||||||
@ -178,13 +191,14 @@ export default {
|
|||||||
{
|
{
|
||||||
...item,
|
...item,
|
||||||
eIndex: index,
|
eIndex: index,
|
||||||
|
defaultStreamTypeCut: index > 3 ? 0 : item.defaultStreamType
|
||||||
},
|
},
|
||||||
index
|
index
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
if (a.length > 1) {
|
if (a.length > 1) {
|
||||||
this.devH5List = a.map((item, index) => ({ ...item, eIndex: index }));
|
this.devH5List = a.map((item, index) => ({ ...item, eIndex: index, defaultStreamTypeCut: index > 3 ? 0 : item.defaultStreamType }));
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
randomNumber: {
|
randomNumber: {
|
||||||
@ -226,6 +240,7 @@ export default {
|
|||||||
this.devH5List = this.devList.map((item, index) => ({
|
this.devH5List = this.devList.map((item, index) => ({
|
||||||
...item,
|
...item,
|
||||||
eIndex: index,
|
eIndex: index,
|
||||||
|
defaultStreamTypeCut: index > 3 ? 0 : item.defaultStreamType
|
||||||
}));
|
}));
|
||||||
console.log("我进来了", this.devList);
|
console.log("我进来了", this.devList);
|
||||||
// 页面加载初始化`
|
// 页面加载初始化`
|
||||||
@ -248,12 +263,18 @@ export default {
|
|||||||
this.devH5List = dataList.map((item, index) => ({
|
this.devH5List = dataList.map((item, index) => ({
|
||||||
...item,
|
...item,
|
||||||
eIndex: index,
|
eIndex: index,
|
||||||
|
defaultStreamTypeCut: index > 3 ? 0 : item.defaultStreamType
|
||||||
}));
|
}));
|
||||||
this.devH5List.forEach((item) => {
|
this.devH5List.forEach((item) => {
|
||||||
this.play(item,item.eIndex);
|
this.play(item,item.eIndex);
|
||||||
})
|
})
|
||||||
console.log("dataList", dataList, this.pageNo);
|
console.log("dataList", dataList, this.pageNo);
|
||||||
},
|
},
|
||||||
|
isCodeStream(i){
|
||||||
|
console.log("isCodeStream", this.devH5List[i]);
|
||||||
|
this.devH5List[i - 1].defaultStreamTypeCut = this.devH5List[i - 1].defaultStreamTypeCut == 1 ? 0 : 1;
|
||||||
|
this.play(this.devH5List[i - 1], i - 1);
|
||||||
|
},
|
||||||
// 关闭所有视频
|
// 关闭所有视频
|
||||||
stopAllPlay() {
|
stopAllPlay() {
|
||||||
// 调用播放器API停止所有实时播放
|
// 调用播放器API停止所有实时播放
|
||||||
@ -641,11 +662,14 @@ export default {
|
|||||||
let tempCode = row.serialNumber;
|
let tempCode = row.serialNumber;
|
||||||
const param = {
|
const param = {
|
||||||
cameraIndexCode: tempCode,
|
cameraIndexCode: tempCode,
|
||||||
streamType: row.defaultStreamType && row.eIndex < 4 ? row.defaultStreamType : "",
|
streamType: row.defaultStreamType && row.eIndex < 4 ? (row.defaultStreamType == 1 ? "" : 2) : "",
|
||||||
type: window.location.protocol.includes("https") ? "wss" : "ws",
|
type: window.location.protocol.includes("https") ? "wss" : "ws",
|
||||||
transmode: 1,
|
transmode: 1,
|
||||||
itemId: row.itemId,
|
itemId: row.itemId,
|
||||||
};
|
};
|
||||||
|
if(row.defaultStreamTypeCut == 0) {
|
||||||
|
param.streamType = 2;
|
||||||
|
}
|
||||||
// 这里
|
// 这里
|
||||||
return getVideoItemInfoApi(param);
|
return getVideoItemInfoApi(param);
|
||||||
},
|
},
|
||||||
@ -919,6 +943,12 @@ export default {
|
|||||||
height: 20px;
|
height: 20px;
|
||||||
background-image: url("~@/assets/images/iscImage/transcribe.png");
|
background-image: url("~@/assets/images/iscImage/transcribe.png");
|
||||||
}
|
}
|
||||||
|
.codestream {
|
||||||
|
background-image: url("~@/assets/images/iscImage/codestream2.png");
|
||||||
|
}
|
||||||
|
.codestream_active {
|
||||||
|
background-image: url("~@/assets/images/iscImage/codestream1.png");
|
||||||
|
}
|
||||||
.talkback {
|
.talkback {
|
||||||
background-image: url("~@/assets/images/iscImage/talkback.png");
|
background-image: url("~@/assets/images/iscImage/talkback.png");
|
||||||
}
|
}
|
||||||
|
|||||||
@ -37,7 +37,7 @@
|
|||||||
:isIframe="isIframe"
|
:isIframe="isIframe"
|
||||||
:devList="devList"
|
:devList="devList"
|
||||||
:devListAll="devListAll"
|
:devListAll="devListAll"
|
||||||
v-if="!isWindows() && $store.state.forceH5Play == 0"
|
v-if="isWindows() && $store.state.forceH5Play == 0"
|
||||||
:class="{
|
:class="{
|
||||||
isDockingToWoer: isDockingToWoer,
|
isDockingToWoer: isDockingToWoer,
|
||||||
isLongguangIframe: isIframe,
|
isLongguangIframe: isIframe,
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user