huangchengfa/test
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 不要的东西

Browse Source
This commit is contained in:
huangchengfa 2025-03-30 23:17:18 +08:00
parent a1c3d98421
commit 2c01275459
4 changed files with 17 additions and 650 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/layout/components/Header.vue
View File

@ -2,7 +2,7 @@
<header v-if="headerShow">
<div class="left">
<div class="logo flex just-center align-center">
<img :src="getImgUrl('indexImages/yc_logo.png')" style="height: 44px;width: 369px;" />
<!-- <img :src="getImgUrl('indexImages/yc_logo.png')" style="height: 44px;width: 369px;" /> -->
</div>
<div class="center"></div>
</div>

45
src/views/dutyBook/home/workbench.vue
View File

@ -1,22 +1,6 @@
<template>
<div class="workbench" :class="{'isItFullScreen': isItFullScreen }">
<div class="largeScreenTitle">
<img class="largeScreenTitleImg" src="../../../assets/largeScreen/系统标题%20(1).png" alt="加载失败">
<div class="headInformation">
<div>
<img src="../../../assets/largeScreen/日期.png" alt="">
<span>2025-3-12:23:33</span>
<img src="../../../assets/largeScreen/icon／通用／天气.png" alt="">
<span>晴天 32</span>
</div>
<div class="titleImg">
<img src="../../../assets/largeScreen/XXXXXX工业园管理平台.png" alt="">
</div>
<div class="fullScreen">
<img @click="enterFullscreen()" src="../../../assets/largeScreen/Vector.png" alt="">
</div>
</div>
</div>
<div class="layoutContainer">
<div class="theLeft">
<div class="theLeftItem">
@ -49,8 +33,8 @@
<div class="theLeftItemTitle">设备状态</div>
<div class="theLeftItemContent eventStatistics">
<div class="eventStatisticsItem" v-for="index of 6" :key="index">
<img v-if="index <= 3" src="../../../assets/largeScreen/未处理报警数.png" alt="">
<img v-else src="../../../assets/largeScreen/已处理报警数.png" alt="">
<!-- <img v-if="index <= 3" src="../../../assets/largeScreen/未处理报警数.png" alt=""> -->
<!-- <img v-else src="../../../assets/largeScreen/已处理报警数.png" alt=""> -->
<div>
<p>65</p>
<span>未处理报警数</span>
@ -89,11 +73,11 @@
<div class="hazardStatisticsTitle">
<div>
<p>发现隐患： 14</p>
<img src="../../../assets/largeScreen/标注.png" alt="">
<!-- <img src="../../../assets/largeScreen/标注.png" alt=""> -->
</div>
<div>
<p>处理隐患： 28</p>
<img src="../../../assets/largeScreen/标注.png" alt="">
<!-- <img src="../../../assets/largeScreen/标注.png" alt=""> -->
</div>
</div>
<div class="hiddenDangerMap" id="hiddenDangerMap"></div>
@ -169,7 +153,7 @@
<span>800</span>
个
</p>
<img src="../../../assets/largeScreen/火灾报警.png" alt="">
<!-- <img src="../../../assets/largeScreen/火灾报警.png" alt=""> -->
<p>火灾报警</p>
</div>
<div class="eventStatisticsStaticItem">
@ -177,7 +161,7 @@
<span>800</span>
个
</p>
<img src="../../../assets/largeScreen/火灾报警.png" alt="">
<!-- <img src="../../../assets/largeScreen/火灾报警.png" alt=""> -->
<p>电气报警</p>
</div>
<div class="eventStatisticsStaticItem">
@ -185,7 +169,7 @@
<span>800</span>
个
</p>
<img src="../../../assets/largeScreen/消防给水.png" alt="">
<!-- <img src="../../../assets/largeScreen/消防给水.png" alt=""> -->
<p>消防给水</p>
</div>
<div class="eventStatisticsStaticItem">
@ -193,7 +177,7 @@
<span>800</span>
个
</p>
<img src="../../../assets/largeScreen/气体灭火.png" alt="">
<!-- <img src="../../../assets/largeScreen/气体灭火.png" alt=""> -->
<p>气体灭火</p>
</div>
<div class="eventStatisticsStaticItem">
@ -201,7 +185,7 @@
<span>800</span>
个
</p>
<img src="../../../assets/largeScreen/消火栓.png" alt="">
<!-- <img src="../../../assets/largeScreen/消火栓.png" alt=""> -->
<p>消火栓</p>
</div>
<div class="eventStatisticsStaticItem">
@ -209,7 +193,7 @@
<span>800</span>
个
</p>
<img src="../../../assets/largeScreen/消防电源.png" alt="">
<!-- <img src="../../../assets/largeScreen/消防电源.png" alt=""> -->
<p>消防电源</p>
</div>
</div>
@ -245,7 +229,7 @@
<div class="theLeftItemContent">
<div class="theLeftItemContent eventStatistics" id="emergencyResources">
<div class="eventStatisticsItem" v-for="index of 6" :key="index">
<img src="../../../assets/largeScreen/救援队伍.png" alt="">
<!-- <img src="../../../assets/largeScreen/救援队伍.png" alt=""> -->
<div>
<p>65</p>
<span>救援队伍</span>
@ -885,7 +869,6 @@ window.onresize = () => {
//height: calc(100vh - 140px);
//color: #333;
//background: #95ee0f;
background-image: url("../../../assets/largeScreen/大背景.png");
background-size: 100% 100%;
@ -984,7 +967,6 @@ window.onresize = () => {
height: 100%;
.warningPeriodAnalysisItemTitle {
background-image: url("../../../assets/largeScreen/时段背景.png");
background-size: 100% 100%;
height: 28px;
line-height: 28px;
@ -1068,7 +1050,6 @@ window.onresize = () => {
.theLeftItemTitle {
height: 24px;
line-height: 24px;
background-image: url("../../../assets/largeScreen/小标题-设备状态‘.png");
background-size: 100% 100%;
padding-left: 20px;
color: #A9F0FF;
@ -1232,7 +1213,6 @@ window.onresize = () => {
.theLeftItemContent {
height: calc(236px - 26px);
width: 100%;
background-image: url("../../../assets/largeScreen/告警时段分析.png");
background-size: 100% 100%;
}
@ -1271,7 +1251,6 @@ window.onresize = () => {
.systemScoreRightItem {
width: calc((100% - 10px) / 2);
background-image: url("../../../assets/largeScreen/事件统计框.png");
background-size: 100% 100%;
text-align: center;
padding: 10px 0;

4
src/views/login/index.vue
View File

@ -1,7 +1,7 @@
<template>
<div class="login">
<div class="logo">
<img :src="getImgUrl('indexImages/yc_logo.png')" />
<!-- <img :src="getImgUrl('indexImages/yc_logo.png')" /> -->
</div>
<h1>六盘水烟草商业安全管理系统</h1>
<div class="aqbybox">
@ -281,7 +281,7 @@ onUnmounted(() => {
}
}
.input {
::v-deep .input {
display: block;
background: rgba(255, 255, 255, 0.2);
border: 1px solid rgba(255, 255, 255, 0.2);

616
src/views/lps/yjsb/videoPlay/index.vue
View File

@ -1,617 +1,5 @@
<template>
<MOSTY.FromPage :title="props.editObj.title" @closeDialog="closePost">
<template #content>
<div class="main">
<div class="left">
<div class="headerMessage">摄像头列表</div>
<div class="name" :class="cameraSelection === index ? 'clickLayout' : null"
@click.prevent="selectTheCameraPreview(item.sbbh, index)" v-for="(item, index) in cameraList"
:key="index">
<span>{{ (index + 1) + "、" + item.name }}</span>
</div>
<div class="actionSheet">
<div class="headerMessage">摄像头画面操作</div>
<div :class="cameraGraphicsOperationsIndex === index ? 'clickLayout name' : 'name'"
v-for="(item, index) in graphicOperation" :key="index"
@click="cameraScreenOperation(index)">
<span>{{ item }}</span>
</div>
<div class="headerMessage">视频布局</div>
<div class="name nameItem" :class="clickLayout === index ? 'clickLayout' : null"
v-for="(item, index) in videoLayout" :key="index"
@click="switchingLayout(index)">
<span>{{ item.name }}</span>
</div>
</div>
</div>
<div class="center">
<div v-for="index in splitScreenCount"
:id="index === 1 ? 'center_item' : null"
:class="cameraIndex === index - 1 ? 'active_video video_item' : 'video_item'"
:style="{'width' : `${100/(clickLayout+1)}%`, 'height': `${100/(clickLayout+1)}%`}"
:key="index">
<div :class="cameraIndex !== index -1 ? 'empty' : '' " v-if=" cameraIndex !== index -1 ">
<el-empty :image-size="40" />
</div>
<video v-else controls
:style="{ 'width': initialMonitoringOfContainersWidth, 'height': initialMonitoringOfContainersHeight,'objectFit': 'cover' }"
:id='"videoElement" + (index-1)'></video>
</div>
</div>
<div class="right">
<el-collapse v-model="activeNames" :accordion="true" @change="handleChange">
<el-collapse-item title="镜头控制" name="1">
<div class="lensContainer">
<div v-for="(item, index) of lensSetup" class="name nameItem">
<el-icon @mousedown="startTheCameraOperation(index, 0)" @mouseup="endOfCameraControl()">
<Minus />
</el-icon>
<span>{{ item }}</span>
<el-icon @mousedown="startTheCameraOperation(index, 1)" @mouseup="endOfCameraControl()">
<Plus />
</el-icon>
</div>
</div>
</el-collapse-item>
<el-collapse-item title="方向控制" name="2">
<div class="controller">
<div v-for="btn in directionButton"
:key="btn.key"
:class="[btn.value!==9?'sector':'',btn.key]"
:title="btn.label"
@mousedown="handleRegulate(btn, 0)" @mouseup="handleRegulate(btn, 1)">
<el-icon>
<CaretLeft />
</el-icon>
</div>
</div>
</el-collapse-item>
<el-collapse-item title="功能控制" name="3">
<div class="lensContainer">
<div v-for="item of functionalControl" class="name nameItem">
<span>{{ item }}</span>
</div>
</div>
</el-collapse-item>
<el-collapse-item title="预制点" name="4">
<div style="text-align: right">
<el-button size="small" @click="createPrefabricatedPoints()">创建</el-button>
</div>
<el-table size="small" :data="listOfPreFabricatedCameraPoints" style="width: 100%">
<el-table-column prop="presetPointName" label="名称" />
<el-table-column label="操作">
<template #default="scope">
<el-icon style="margin-right: 10px" @click="cameraPositioning(scope.row)">
<Position />
</el-icon>
<el-icon @click="cameraPrefabricationPointModification(scope.row)" color="#0cba80"
style="margin-right: 10px">
<EditPen />
</el-icon>
<el-icon @click="cameraPreFabricatedPointDeletion(scope.row)" color="red">
<Delete />
</el-icon>
</template>
</el-table-column>
</el-table>
</el-collapse-item>
<el-collapse-item title="巡航线" name="5">
<div style="text-align: right">
<el-button size="small" @click="openTheCreateCruiseLineWindow(ruleFormRef)">创建</el-button>
</div>
<el-table :data="cameraCruisingHeartList" style="width: 100%">
<el-table-column prop="cruiseName" label="巡航线名称" width="180" />
<el-table-column prop="address" label="操作">
<template #default="scope">
<el-icon color="red" @click="deleteCameraCruiseLine(scope.row.channelId)">
<Delete />
</el-icon>
</template>
</el-table-column>
</el-table>
</el-collapse-item>
</el-collapse>
</div>
</div>
</template>
<template #footer>
<el-button @click="closepost">
<el-icon>
<DocumentDelete />
</el-icon>
关闭
</el-button>
</template>
</MOSTY.FromPage>
<el-dialog v-model="cameraHistoryWindow" title="视频抓图历史列表" width="70%">
<el-form :model="cameraHistoryWindowForm" label-width="auto" style="max-width: 600px">
<el-form-item label="开始时间">
<el-date-picker value-format="x" v-model="cameraHistoryWindowForm.startDate" type="datetime"
placeholder="请选择开始时间" />
</el-form-item>
<el-form-item label="结束时间" style="margin-left: 20px">
<el-date-picker value-format="x" v-model="cameraHistoryWindowForm.endDate" type="datetime"
placeholder="请选择结束时间" />
</el-form-item>
</el-form>
<div class="demo-image__preview" style="min-height: 300px">
<el-image v-for="item of cameraHistoryWindowImgList" style="width: 100px; height: 100px" :src="item"
:zoom-rate="1.2" :max-scale="2" :min-scale="0.2"
:preview-src-list="cameraHistoryWindowImgList" show-progress :initial-index="4" fit="cover" />
</div>
<el-pagination v-model:current-page="cameraHistoryWindowForm.currentPage4"
v-model:page-size="cameraHistoryWindowForm.pageSize"
:page-sizes="[10, 20, 50, 100]"
layout="total, sizes, prev, pager, next, jumper"
:total="cameraHistoryWindowForm.total"
@size-change="handleSizeChange"
@current-change="handleCurrentChange" />
</el-dialog>
<el-dialog v-model="cruiseLineWindow" title="创建巡航线" width="60%">
<el-form ref="ruleFormRef" :rules="rules" status-icon
:model="patrolRouteFormObject" :hide-required-asterisk="true">
<el-row>
<el-col :span="12">
<el-form-item label="巡航线名称" :label-width="120" prop="cruiseName" :required="true">
<el-input v-model="patrolRouteFormObject.cruiseName" placeholder="巡航线名称" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="预制点选择" :label-width="120">
<span class="cruiseLine_item" v-for="(item, index) of listOfPreFabricatedCameraPoints"
:key="index" @click="selectPrefabricatedPoints(item)">{{ item["cruiseName"] }}</span>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="设置预制点" :label-width="120">
<div v-for="(item, index) of patrolRouteFormObject.prePointList" class="prefabricatedPointLabels"
:key="index">
<div class="cruiseLine_item_container">
<span class="cruiseLine_item">{{ item["cruiseName"] }}</span>
<el-icon class="del_icon" color="#d0cbcb" @click="deletePrefabricatedPoints(index)">
<CloseBold />
</el-icon>
</div>
<el-icon v-if="index < patrolRouteFormObject.prePointList.length -1 ">
<Right />
</el-icon>
</div>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button @click="cruiseLineWindow = false">取消</el-button>
<el-button type="primary" @click="creationOfPatrolRoutes(ruleFormRef)">确认</el-button>
</div>
</template>
</el-dialog>
<el-dialog v-model="editCruiseLine" title="编辑预制点">
<el-form ref="ruleFormRef" :rules="rules" label-width="120px" class="demo-ruleForm">
<el-form-item label="预制点" prop="name">
<el-input />
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button @click="cruiseLineWindow = false">取消</el-button>
<el-button type="primary" @click="creationOfPatrolRoutes(ruleFormRef)">确认</el-button>
</div>
</template>
</el-dialog>
<div>22</div>
</template>
<style lang="scss" scoped>
@import "./style/index";
</style>
<script setup>
import { ref, getCurrentInstance, onMounted, nextTick, reactive } from "vue"
import * as MOSTY from "@/components/MyComponents/index"
import { ElMessage, ElMessageBox } from "element-plus"
import { getApi, postApi } from "@/api/tobAcco_api.js"
import "viewerjs/dist/viewer.css"
import { api as viewerApi } from "v-viewer"
const props = defineProps({
editObj: {
type: Object,
default: {}
}
})
const { proxy } = getCurrentInstance()
const emit = defineEmits(["saveSuccess", "update:modelValue"])
const lensSetup = ref(["变倍", "变焦", "光圈"])
const graphicOperation = ref(["抓图", "查询历史抓图", "截图视频"])
const functionalControl = ref(["灯光", "两刷", "红外"])
const activeNames = ref(["5"])
const splitScreenCount = ref(16)
const rules = reactive({ cruiseName: [{ required: true, message: "巡航线不能为空", trigger: "blur" }] })
const cameraList = ref([])
const videoLayout = ref([
{ name: "1X1", num: 1 },
{ name: "2X2", num: 2 },
{ name: "3X3", num: 3 },
{ name: "4X4", num: 4 }
])
const directionButton = reactive([
{ label: "上", key: "up", value: 1 },
{ label: "右上", key: "up-right", value: 7 },
{ label: "右", key: "right", value: 4 },
{ label: "右下", key: "down-right", value: 8 },
{ label: "下", key: "down", value: 2 },
{ label: "左下", key: "down-left", value: 6 },
{ label: "左", key: "left", value: 3 },
{ label: "左上", key: "up-left", value: 5 },
{ label: "中心", key: "center", value: 9 }]
)
let initialMonitoringOfContainersWidth = ref("")
let initialMonitoringOfContainersHeight = ref("")
let cameraIndex = ref(0)
let clickLayout = ref(3)
let cameraInformation = reactive({})
let cameraSelection = ref(0)
let cameraGraphicsOperationsIndex = ref("")
let editCruiseLine = ref(false)
let cameraHistoryWindow = ref(false)
let cameraHistoryWindowImgList = ref([])
let cameraCruisingHeartList = ref([])
let cameraControlObjects = reactive({ step: 4 })
let cameraDirectionControl = reactive({ stepX: 4, stepY: 4 })
let ruleFormRef = ref()
let listOfPreFabricatedCameraPoints = ref([])
let cruiseLineWindow = ref(false)
let patrolRouteFormObject = reactive({
cruiseName: "",
prePointList: []
})
let cameraHistoryWindowForm = reactive({
startDate: "",
endDate: "",
pageSize: 20,
currentPage4: 1,
total: 0
})
let hls = null
let channel_id = ""
onMounted(() => {
// 查询摄像头列表
getCameraList()
xInitializeCameraContainer()
})
/**
* 摄像头方向控制
* @param btn
* @param type
*/
const handleRegulate = async (btn, type) => {
cameraDirectionControl.command = !type ? 1 : 0
cameraDirectionControl.direct = btn.value
let data = await postApi(cameraDirectionControl, "/mosty-lps/daSdk/operateDirect")
}
/**
* 删除巡航路线
* @param item_id
*/
const deleteCameraCruiseLine = async (item_id) => {
let data = await postApi({ channelId: item_id }, "/mosty-lps/daSdk/deleteCruise")
}
/**
* 镜头控制
*/
const cameraOperations = async () => {
let data = await postApi(cameraControlObjects, "/mosty-lps/daSdk/operateCamera")
}
/**
* 摄像头定位
* @param data
*/
const cameraPositioning = (data) => {
}
/**
* 摄像头预设点修改
* @param data
*/
const cameraPrefabricationPointModification = (data) => {
}
/**
* \摄像头预设点删除
* @param data
*/
const cameraPreFabricatedPointDeletion = (data) => {
}
/**
* 创建预设点
*/
const createPrefabricatedPoints = () => {
ElMessageBox.prompt("输入预制点名称", "预制点创建", {
confirmButtonText: "确认",
cancelButtonText: "取消",
inputPattern: /\S/,
inputErrorMessage: "预制点名称不能为空"
})
.then(({ value }) => {
let data = {
presetPointCode: generateUniqueCode(listOfPreFabricatedCameraPoints.value),
operateType: 3,
presetPointName: value
}
cameraPreFabricationPointSetting(data)
})
.catch(() => ElMessage.info("取消创建"))
}
/**
* 开启创建巡航线窗口
* @param formEl
*/
const openTheCreateCruiseLineWindow = async (formEl) => {
cruiseLineWindow.value = true
if (patrolRouteFormObject.prePointList.length) patrolRouteFormObject.prePointList = []
await nextTick(() => {
if (!formEl) return
formEl.resetFields()
})
}
/**
* 选择预设点形成巡航线
* @param item
*/
const selectPrefabricatedPoints = (item) => patrolRouteFormObject.prePointList.push(item)
/**
* 删除巡航线中的预设点
* @param index
*/
const deletePrefabricatedPoints = (index) => patrolRouteFormObject.prePointList.splice(index, 1)
/**
* 生成唯一编码
* @param presetArray
* @returns {string}
*/
function generateUniqueCode(presetArray) {
const existingCodes = new Set(presetArray.map(item => item.presetPointCode))
let code
do {
const num = Math.floor(Math.random() * 256) + 1
code = num.toString().padStart(3, "0")
if (existingCodes.size >= 256) throw new Error("所有可能的编码都已被占用")
} while (existingCodes.has(code))
return code
}
/**
* 设置功能预制点
* @param data
*/
const cameraPreFabricationPointSetting = async (data) => {
await postApi({ ...data, channelId: channel_id }, "/mosty-lps/daSdk/operatePresetPoint")
ElMessage.success("创建成功")
await obtainPreFabricatedCameraPointsList(channel_id)
}
/**
* 创建巡航路线
* @param formEl
* @returns {Promise<void>}
*/
const creationOfPatrolRoutes = async (formEl) => {
if (!formEl) return
await formEl.validate(async (valid, fields) => {
if (valid) {
let response = await postApi({ ...patrolRouteFormObject, channelId: channel_id }, "/mosty-lps/daSdk/saveCruise")
console.log("submit!")
return
}
ElMessage.error("必填项校验不通过")
})
}
/**
* 获取巡航线
* @param itemId
*/
const obtainCruiseLine = async (itemId) => {
let data = await postApi({ channelId: itemId }, `/mosty-lps/daSdk/getCruises`)
if (data instanceof Array) cameraCruisingHeartList.value = data
console.log("巡航线", data)
}
/**
* 开始控制镜头
* @param index
* @param mark
*/
const startTheCameraOperation = (index, mark) => {
let operationType = new Map([[0, "1"], [1, "2"], [2, "3"]])
cameraControlObjects.operateType = operationType.get(index)
cameraControlObjects.direct = !mark ? 2 : 1
cameraControlObjects.command = 1
cameraOperations()
}
/**
* 结束控制镜头
*/
const endOfCameraControl = () => {
cameraControlObjects.command = 0
cameraOperations()
}
/**
* 图形画面操作
* @param index
*/
const cameraScreenOperation = (index) => {
cameraGraphicsOperationsIndex.value = index
let cameraOperationsList = new Map([
[0, captureImage],
[1, historicalSearchMap]
])
cameraOperationsList.get(index)()
}
/**
* 查询历史抓图
*/
const historicalSearchMap = async () => {
if (!cameraHistoryWindowForm.startDate.length && !cameraHistoryWindowForm.endDate.length) {
const timestamp = (timestamp = 0) => {
const now = new Date()
const midnightTomorrow = new Date(now.getFullYear(), now.getMonth(), now.getDate() + timestamp)
return midnightTomorrow.getTime() / 1000
}
cameraHistoryWindowForm.startDate = timestamp()
cameraHistoryWindowForm.endDate = timestamp(1)
}
let data = await postApi({
...cameraHistoryWindowForm,
channelId: [cameraHistoryWindowForm.channelId],
deviceCode: [cameraInformation.deviceCode]
}, `/mosty-lps/daSdk/getHistoryCapturePic`)
if (data instanceof Object) {
let imgList = []
data.records.forEach(item => imgList.push(item["capturePictureFront"]))
cameraHistoryWindow.value = true
cameraHistoryWindowImgList.value = imgList
cameraHistoryWindowForm.total = data.total
}
console.log("抓取历史记录", data)
}
/**
*
* @param value
*/
const handleSizeChange = (value) => cameraHistoryWindowForm.pageSize = value
/**
*
*/
const handleCurrentChange = () => historicalSearchMap()
/**
* 布局切换
* @param index
*/
const switchingLayout = (index) => {
clickLayout.value = index
nextTick(() => xInitializeCameraContainer())
}
/**
* 图像抓图
*/
const captureImage = async () => {
let response = await postApi(cameraInformation, "/mosty-lps/daSdk/capturePic")
if (response !== null) viewerApi({ images: [response] })
}
/**
* 查询摄像头列表
*/
const getCameraList = async () => {
cameraList.value = await getApi({}, `/mosty-jcgl/aqsbssZb/getList?zbid=${props.editObj.id}`)
await nextTick(() => initialCameraEquipment(cameraList.value[0]["sbbh"], "videoElement0"))
}
/**
* 选择左边的摄像头
* @param channelId
* @param index
* @returns {Promise<void>}
*/
const selectTheCameraPreview = async (channelId, index) => {
cameraSelection.value = index
cameraIndex.value = index
await initialCameraEquipment(channelId, "videoElement" + index)
}
/**
* 初始化视频容器
*/
const xInitializeCameraContainer = () => {
let element = document.getElementById("center_item")
initialMonitoringOfContainersWidth.value = element.clientWidth + "px"
initialMonitoringOfContainersHeight.value = element.clientHeight + "px"
}
/**
* 获取预置点
* @param id
*/
const obtainPreFabricatedCameraPointsList = async (item_id) => {
let data = await postApi({ channelId: item_id }, "/mosty-lps/daSdk/getPresetPoints")
if (data instanceof Array) listOfPreFabricatedCameraPoints.value = data
console.log("获取预制点", data)
}
/**
* 初始化摄像头设备
* @param channelId
* @param domId
*/
const initialCameraEquipment = async (channelId, domId) => {
cameraInformation.devChannel = channelId.slice(channelId.length - 1)
cameraInformation.deviceCode = props.editObj.sbbh
cameraHistoryWindowForm.channelId = channelId
cameraControlObjects.channelId = channelId
cameraDirectionControl.channelId = channelId
channel_id = channelId
if (hls !== null) hls.destroy()
const videoElement = document.getElementById(domId)
//调用Hls.isSupported()检查浏览器是否支持MSE
let data = await postApi({ channelId, "streamType": 1, type: "hls" }, "/mosty-lps/daSdk/realtime")
// 获取当前摄像头的预制点
await obtainCruiseLine(channelId)
await obtainPreFabricatedCameraPointsList(channelId)
if (proxy?.$Hls.isSupported()) {
hls = new Hls()
hls.attachMedia(videoElement)
hls.on(Hls.Events.MEDIA_ATTACHED, async () => {
hls.loadSource(data)
hls.on(Hls.Events.MANIFEST_PARSED, () => videoElement.play())
})
return
} else if (videoElement.canPlayType("application/vnd.apple.mpegurl")) {
// 如果支持原生播放
videoElement.src = data
videoElement.addEventListenter("canplay", () => videoElement.play())
return
}
ElMessage.error("当前环境不支持初始化")
}
function closePost() {
if (props.editObj.saveBtnShow) {
proxy.$modal.confirm("离开会丢失页面中修改的内容，确认离开吗？").then(() => {
emit("changePage", "Main")
})
} else {
emit("changePage", "Main")
}
}
const handleChange = (val) => {
console.log(val)
}
</script>
</script>