Skip to content

V
video-monitoring
Commit 35f66cf5 authored by 罗林杰's avatar 罗林杰
Browse files
Options

Merge remote-tracking branch 'origin/master'

parents 4e9420d0 4acdde51
Hide whitespace changes
Inline Side-by-side
Showing with 48 additions and 30 deletions
src/api/system/video.js
View file @ 35f66cf5
......@@ -53,3 +53,11 @@ export function getHistoryStream(deviceSerial,accessToken,startTime,endTime) {
})
}
// 查看全部的设备信息
export function getHistoryCreams() {
return request({
url: '/hikvision/getAllYsCameras',
method: 'get'
})
}
src/components/TopNav/index.vue
View file @ 35f66cf5
<template>
<el-menu
:default-active="currentIndex ? '/monitoring/video' : currentIndex"
:default-active="currentIndex"
mode="horizontal"
active-text-color="#ffd04b"
@select="handleSelect"
......
src/views/history/index.vue
View file @ 35f66cf5
......@@ -40,10 +40,7 @@
placeholder="请输入监控点名称"
clearable
>
<el-option value="01" label="Camera 01">Camera 01</el-option>
<el-option value="02" label="Camera 02">Camera 02</el-option>
<el-option value="03" label="Camera 03">Camera 03</el-option>
<el-option value="04" label="Camera 04">Camera 04</el-option>
<el-option v-for="(item,index) in deviceNameList " :key = index :value="item" :label="item">{{ item }}</el-option>
</el-select>
</el-form-item>
......@@ -249,12 +246,15 @@ import {
updateHistable,
} from "@/api/system/histable";
import { parseTime } from "../../utils/ruoyi";
import { getHistoryCreams } from "@/api/system/video"
export default {
name: "Histable",
dicts: ["history_state"],
data() {
return {
// 设备名称列表
deviceNameList: [],
carryRowCode: {
id: "",
monitoringName: "",
......@@ -308,6 +308,15 @@ export default {
return (this.currentPage - 1) * this.total;
},
},
mounted() {
getHistoryCreams().then(res => {
if(res.code == 200) {
this.deviceNameList = res.data
} else {
this.$message.error("获取设备列表失败")
}
})
},
methods: {
handleSizeChange(val) {
......
src/views/video/detail.vue
View file @ 35f66cf5
<template>
<div style="background-color: #D4D9E5">
<div class="hello-ezuikit-js" style="padding:20px 30px;display: flex;background-color: white;margin: 20px 30px">
<div class="hello-ezuikit-js" style="padding:20px 30px;display: flex;margin: 20px 10px">
<div id="video-container-out" :style="{width: '100%', height: '83vh', backgroundColor: '#424246', marginRight: '30px' ,boxShadow: '#2b2f3a 0px 0px 20px'}" @dblclick="handleDoubleClick">
<div id="video-container" style="width: 100%; height: 78vh" @click="abv" >
</div>
......@@ -161,7 +161,7 @@ export default {
// simple - 极简版; pcLive-pc直播；pcRec-pc回放； mobileLive-移动端直播；mobileRec-移动端回放;security - 安防版;voice-语音版;
template: 'simple', //模板
plugin: ['talk'], // 加载插件，talk-对讲
width: 1770,
width: 1830,
height: 750,
})
},
......
src/views/video/index.vue
View file @ 35f66cf5
<template>
<div style="background-color: #D4D9E5">
<div class="hello-ezuikit-js" style="padding:20px 30px;display: flex">
<div id="video-container-out" :style="{width: 910 + 'px', height: 435 + 'px', backgroundColor: '#424246', marginRight: '30px' ,boxShadow: '#2b2f3a 0px 0px 20px'}" @dblclick="handleDoubleClick(0)">
<div id="video-container" style="width: 910px; height: 400px" @click="abv" >
<div class="hello-ezuikit-js" style="padding:13px 30px;display: flex">
<div id="video-container-out" :style="{width: 910 + 'px', height: 415 + 'px', backgroundColor: '#424246', marginRight: '30px' ,boxShadow: '#2b2f3a 0px 0px 20px'}" @dblclick="handleDoubleClick(0)">
<div id="video-container" style="width: 910px; height: 380px" @click="abv" >
</div>
<div style="display: flex;">
<el-button icon="el-icon-full-screen" style="border: transparent;background-color: transparent;font-size: large" plain
......@@ -16,8 +16,8 @@
@click="capturePicture"></el-button>
</div>
</div>
<div id="video-container-out" style="width: 910px; height: 435px;background-color: #424246" @dblclick="handleDoubleClick(1)">
<div id="video-container1" style="width: 910px; height: 400px">
<div id="video-container-out" style="width: 910px; height: 415px;background-color: #424246;boxShadow: #2b2f3a 0px 0px 20px" @dblclick="handleDoubleClick(1)">
<div id="video-container1" style="width: 910px; height: 380px">
</div>
<div style="display: flex;">
<el-button icon="el-icon-full-screen" style="border: transparent;background-color: transparent;font-size: large" plain
......@@ -32,11 +32,11 @@
</div>
</div>
<div class="hello-ezuikit-js" style="padding:20px 30px;display: flex">
<div id="video-container-out" style="width: 910px; height: 435px;background-color: #424246;margin-right: 30px" @dblclick="handleDoubleClick(2)">
<div id="video-container2" style="width: 910px; height: 400px">
<div class="hello-ezuikit-js" style="padding:10px 30px;display: flex">
<div id="video-container-out" style="width: 910px; height: 415px;background-color: #424246;margin-right: 30px;boxShadow: #2b2f3a 0px 0px 20px" @dblclick="handleDoubleClick(2)">
<div id="video-container2" style="width: 910px; height: 380px">
</div>
<div style="display: flex;justify-content: space-between">
<div style="display: flex;">
<el-button icon="el-icon-full-screen" style="border: transparent;background-color: transparent;font-size: large" plain
@click="fulScreen2"></el-button>
<el-button v-if="recordButton2" icon="el-icon-video-camera" style="border: transparent;background-color: transparent;font-size: large" plain
......@@ -47,10 +47,10 @@
@click="capturePicture2"></el-button>
</div>
</div>
<div id="video-container-out" style="width: 910px; height: 435px;background-color: #424246" @dblclick="handleDoubleClick(3)">
<div id="video-container3" style="width: 910px; height: 400px">
<div id="video-container-out" style="width: 910px; height: 415px;background-color: #424246;boxShadow: #2b2f3a 0px 0px 20px" @dblclick="handleDoubleClick(3)">
<div id="video-container3" style="width: 910px; height: 380px">
</div>
<div style="display: flex;justify-content: space-between">
<div style="display: flex;">
<el-button icon="el-icon-full-screen" style="border: transparent;background-color: transparent;font-size: large" plain
@click="fulScreen"></el-button>
<el-button v-if="recordButton3" icon="el-icon-video-camera" style="border: transparent;background-color: transparent;font-size: large" plain
......@@ -159,7 +159,7 @@ export default {
if (res.data.code == 200){
//成功
this.getInit(this.accessToken,res.data.data.url)
this.getInit1(this.accessToken,res.data.data.url)
// this.getInit1(this.accessToken,res.data.data.url)
// this.getInit2(this.accessToken,res.data.data.url)
// this.getInit3(this.accessToken,res.data.data.url)
} else {
......@@ -185,17 +185,18 @@ export default {
console.info('视频流是5',res)
})
} else if(this.deviceList.length == 4) {
getStream(this.deviceList[0],this.accessToken).then(res => {
console.info('视频流是6',res)
this.getInit(this.accessToken,res.data.data.url)
})
getStream(this.deviceList[1],this.accessToken).then(res => {
console.info('视频流是7',res)
this.getInit1(this.accessToken,res.data.data.url)
})
getStream(this.deviceList[2],this.accessToken).then(res => {
console.info('视频流是8',res)
this.getInit2(this.accessToken,res.data.data.url)
})
getStream(this.deviceList[3],this.accessToken).then(res => {
console.info('视频流是9',res)
this.getInit3(this.accessToken,res.data.data.url)
})
} else {
this.$message.error("设备超出请联系管理员进行扩充")
......@@ -208,12 +209,12 @@ export default {
this.player = new EZUIKit.EZUIKitPlayer({
id: 'video-container', // 视频容器ID
accessToken: token,
url: 'ezopen://open.ys7.com/AW5687499/1.hd.local.rec?begin=20240805100000&end=20240805235959',
url: videoUrl,
// simple - 极简版; pcLive-pc直播；pcRec-pc回放； mobileLive-移动端直播；mobileRec-移动端回放;security - 安防版;voice-语音版;
template: 'simple', //模板
plugin: ['talk'], // 加载插件，talk-对讲
width: 910,
height: 400,
height: 380,
})
},
getInit1(token,videoUrl){
......@@ -226,7 +227,7 @@ export default {
template: 'simple', //模板
plugin: ['talk'], // 加载插件，talk-对讲
width: 910,
height: 400,
height: 380,
})
},
getInit2(token,videoUrl){
......@@ -239,7 +240,7 @@ export default {
template: 'simple', //模板
plugin: ['talk'], // 加载插件，talk-对讲
width: 910,
height: 400,
height: 380,
})
},
getInit3(token,videoUrl){
......@@ -251,8 +252,8 @@ export default {
// simple - 极简版; pcLive-pc直播；pcRec-pc回放； mobileLive-移动端直播；mobileRec-移动端回放;security - 安防版;voice-语音版;
template: 'simple', //模板
plugin: ['talk'], // 加载插件，talk-对讲
width: this.containerWidth,
height: this.containerHeight - 35,
width: 910,
height: 380,
})
},
fulScreen() {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment