|
|
|
@ -11,7 +11,7 @@
|
|
|
|
highlight-current
|
|
|
|
highlight-current
|
|
|
|
class="camera-tree"
|
|
|
|
class="camera-tree"
|
|
|
|
/>
|
|
|
|
/>
|
|
|
|
<ptz :cameraId="cameraId" />
|
|
|
|
<ptz @childTriggerParent="reVideo" v-if="cameraId" :cameraId="cameraId" />
|
|
|
|
</el-col>
|
|
|
|
</el-col>
|
|
|
|
<el-col :span="19">
|
|
|
|
<el-col :span="19">
|
|
|
|
<div class="container">
|
|
|
|
<div class="container">
|
|
|
|
@ -38,11 +38,12 @@
|
|
|
|
@click="clickCameraFun((rowIndex-1)*topNum +colIndex)"
|
|
|
|
@click="clickCameraFun((rowIndex-1)*topNum +colIndex)"
|
|
|
|
>
|
|
|
|
>
|
|
|
|
|
|
|
|
|
|
|
|
<div v-if="((rowIndex-1)*topNum +colIndex)==cameraIndex" class="floating-text"><Icon :size="15" icon="ep:circle-close"
|
|
|
|
<div v-if="((rowIndex-1)*topNum +colIndex)==cameraIndex" class="floating-text">
|
|
|
|
/></div>
|
|
|
|
<Icon :size="15" icon="ep:circle-close" @click="deleteCameraFun((rowIndex-1)*topNum +colIndex)"/>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<Camera v-if="getCameraId((rowIndex - 1) * topNum + colIndex)!== 0"
|
|
|
|
<Camera v-if="getCameraId((rowIndex - 1) * topNum + colIndex)!== 0"
|
|
|
|
:cameraId="getCameraId((rowIndex-1)*topNum +colIndex)" :ptzShow="false" />
|
|
|
|
:cameraId="getCameraId((rowIndex-1)*topNum +colIndex)" :ref="'camera'+((rowIndex-1)*topNum +colIndex)" :ptzShow="false" />
|
|
|
|
</el-col>
|
|
|
|
</el-col>
|
|
|
|
</el-row>
|
|
|
|
</el-row>
|
|
|
|
</el-col>
|
|
|
|
</el-col>
|
|
|
|
@ -53,10 +54,9 @@
|
|
|
|
<script setup lang="ts">
|
|
|
|
<script setup lang="ts">
|
|
|
|
import Camera from '@/components/camera/camera.vue'
|
|
|
|
import Camera from '@/components/camera/camera.vue'
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
import { ref } from 'vue';
|
|
|
|
import ptz from '@/components/camera/ptzNotFlow.vue'
|
|
|
|
import ptz from '@/components/camera/ptzNotFlow.vue'
|
|
|
|
import { CameraApi, CameraVO } from '@/api/logistics/camera'
|
|
|
|
import { CameraApi, CameraVO } from '@/api/logistics/camera'
|
|
|
|
import { el, ta } from 'element-plus/es/locale'
|
|
|
|
|
|
|
|
import { flatMap } from 'lodash-es'
|
|
|
|
|
|
|
|
/** 相机 列表 */
|
|
|
|
/** 相机 列表 */
|
|
|
|
defineOptions({ name: 'Camera' })
|
|
|
|
defineOptions({ name: 'Camera' })
|
|
|
|
|
|
|
|
|
|
|
|
@ -69,8 +69,22 @@ const topNum = ref(2) // 默认值
|
|
|
|
const cameraIndex = ref()
|
|
|
|
const cameraIndex = ref()
|
|
|
|
// 用户是否选择视频
|
|
|
|
// 用户是否选择视频
|
|
|
|
const clickCamera = ref(false)
|
|
|
|
const clickCamera = ref(false)
|
|
|
|
|
|
|
|
const refs = {};
|
|
|
|
|
|
|
|
// const refs = reactive({});
|
|
|
|
const CameraMap = ref<Map<number, number | undefined>>()
|
|
|
|
const CameraMap = ref<Map<number, number | undefined>>()
|
|
|
|
|
|
|
|
const reVideo = async (cameraId: number) => {
|
|
|
|
|
|
|
|
if (CameraMap.value) {
|
|
|
|
|
|
|
|
for (const [index, id] of CameraMap.value.entries()) {
|
|
|
|
|
|
|
|
if (id === cameraId) {
|
|
|
|
|
|
|
|
console.log("刷新摄像头 index:", index);
|
|
|
|
|
|
|
|
const cameraRef = refs[`camera${index}`];
|
|
|
|
|
|
|
|
if (cameraRef && cameraRef.startVideo) {
|
|
|
|
|
|
|
|
cameraRef.startVideo();
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
/** 查询列表 */
|
|
|
|
/** 查询列表 */
|
|
|
|
const getTree = async () => {
|
|
|
|
const getTree = async () => {
|
|
|
|
try {
|
|
|
|
try {
|
|
|
|
@ -80,6 +94,15 @@ const getTree = async () => {
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
const selectedNodeId = ref<string | null>(null)
|
|
|
|
const selectedNodeId = ref<string | null>(null)
|
|
|
|
|
|
|
|
// 关闭视频
|
|
|
|
|
|
|
|
const deleteCameraFun = (index)=>{
|
|
|
|
|
|
|
|
console.log("删除摄像头 index:",index );
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
clickCamera.value = true
|
|
|
|
|
|
|
|
CameraMap.value?.delete(index)
|
|
|
|
|
|
|
|
cameraIndex.value = index
|
|
|
|
|
|
|
|
cameraId.value = null
|
|
|
|
|
|
|
|
}
|
|
|
|
// 点击视频墙的一部分
|
|
|
|
// 点击视频墙的一部分
|
|
|
|
const clickCameraFun = (index)=>{
|
|
|
|
const clickCameraFun = (index)=>{
|
|
|
|
|
|
|
|
|
|
|
|
@ -97,6 +120,7 @@ const handleNodeClick = (data: any) => {
|
|
|
|
if (data.id != null) {
|
|
|
|
if (data.id != null) {
|
|
|
|
// 如果用户点击了视频节点,则修改该视频节点
|
|
|
|
// 如果用户点击了视频节点,则修改该视频节点
|
|
|
|
if(clickCamera.value){
|
|
|
|
if(clickCamera.value){
|
|
|
|
|
|
|
|
deleteCameraFun(cameraIndex.value)
|
|
|
|
CameraMap.value?.set(cameraIndex.value, data.id)
|
|
|
|
CameraMap.value?.set(cameraIndex.value, data.id)
|
|
|
|
}else{
|
|
|
|
}else{
|
|
|
|
// 用户未选择视频节点,找到第一个空闲位置设置 cameraId
|
|
|
|
// 用户未选择视频节点,找到第一个空闲位置设置 cameraId
|
|
|
|
|