| | |
| | | </el-col> |
| | | <el-col :span="9" :offset="1"> |
| | | <el-form-item label="坐标" style="width:100%;"> |
| | | <label slot="label"> 坐标</label> |
| | | <label slot="label">坐标</label> |
| | | <el-col :span="11"> |
| | | <el-input |
| | | v-model="form.latitude" |
| | |
| | | </el-col> |
| | | <el-col :span="9" :offset="1"> |
| | | <el-form-item label="设备地址" style="width:100%" prop="addr"> |
| | | <el-input v-model="form.addr" placeholder="请输入地址描述" :disabled="!form.rtsp" size="small"></el-input> |
| | | <el-input v-model="form.addr" placeholder="请输入地址描述" :disabled="isDisabled" size="small"></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="9" :offset="1" style="padding-left: 11px;"> |
| | | <el-col :span="9" :offset="1"> |
| | | <el-form-item label="事件声音"> |
| | | <div class="flex-wrap" style="margin-left:-10px"> |
| | | <el-switch v-model="form.voiceEnable" active-color="#409eff" :width="50"></el-switch> |
| | | <el-select |
| | | v-model="form.voiceId" |
| | | <div class="flex-wrap" style="margin-top: 10px;"> |
| | | <el-switch v-model="form.voiceEnable" :width="50"></el-switch> |
| | | <!-- 屏蔽声音选择,调整到场景 --> |
| | | <!-- <el-select |
| | | v-model="voice" |
| | | placeholder="选择声音" |
| | | size="small" |
| | | value-key="id" |
| | |
| | | :value="item" |
| | | ></el-option> |
| | | </el-select> |
| | | <span class="player-btn" @click="togglePlayer"> |
| | | <span class="player-btn" @click="togglePlayer" style="cursor:pointer;"> |
| | | <i |
| | | v-if="togglePlay" |
| | | class="el-icon-video-play" |
| | | style="font-size:26px; vertical-align:middle; color:#409eff" |
| | | ></i> |
| | | </span> |
| | | <i |
| | | v-else |
| | | class="el-icon-video-pause" |
| | | style="font-size:26px; vertical-align:middle; color:#409eff" |
| | | ></i> |
| | | </span>--> |
| | | </div> |
| | | </el-form-item> |
| | | </el-col> |
| | |
| | | <el-button size="small" type="primary" @click="cameraConnet" :disabled="conDisabled">连接测试</el-button> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row style="padding-top: 15px"> |
| | | <el-row style="padding: 15px 0"> |
| | | <el-col :span="12"> |
| | | <camera-player |
| | | :cameraName="videoItem.name" |
| | |
| | | :isRunning="false" |
| | | v-if="videoItem !== '' && videoItem !== undefined && videoItem !== null && visibilityState" |
| | | ></camera-player> |
| | | <video v-else poster="../../../assets/baseimg_cameara.png" preload="none"></video> |
| | | <video v-else poster="/images/cameraAccess/video-poster.png" preload="none"></video> |
| | | </el-col> |
| | | |
| | | <!-- 系统运行信息 --> |
| | |
| | | <li style="width:100%"> |
| | | <info-card |
| | | style="width:100%;min-width: 440px" |
| | | :realtime="PollData.RealTimeSum" |
| | | :realtime="PollData.RealTimeValidCount" |
| | | :polling="PollData.PollValidCount" |
| | | :dataStack="PollData.stackChannelCount" |
| | | ></info-card> |
| | |
| | | </template> |
| | | <script> |
| | | import { |
| | | checkCameraConnet, |
| | | createCamera, |
| | | updateCameraInfo, |
| | | getCameraInfo, |
| | |
| | | eventAudio: new Audio(), |
| | | soundPath: '', |
| | | form: { |
| | | latitude: 0, |
| | | rtsp: "", |
| | | longitude: 0, |
| | | name: "", |
| | | addr: "", |
| | | alias: "", |
| | | areaid: "", |
| | | brand: "", |
| | | id: "", |
| | | ip: "", |
| | | reserved: "", |
| | | run_type: 0, |
| | | isAI: false, |
| | | username: "", |
| | | password: "", |
| | | cameraType: 0, |
| | | resolution: "", |
| | | voiceId: "", |
| | | voiceEnable: true |
| | | }, |
| | | // 记录添加状态 |
| | | isAdd: false, |
| | |
| | | }, |
| | | resolutionList: [], |
| | | //传感器列表 |
| | | sensors: [] |
| | | sensors: [], |
| | | voice: null |
| | | }; |
| | | }, |
| | | computed: { |
| | |
| | | this.visibilitychange(); |
| | | }); |
| | | this.getSounds(); |
| | | |
| | | this.eventAudio.addEventListener("ended", () => { |
| | | this.togglePlay = true |
| | | }) |
| | | }, |
| | | methods: { |
| | | getSounds() { |
| | |
| | | }, |
| | | selSound(sound) { |
| | | this.soundPath = sound.path; |
| | | this.form.voiceId = sound.id |
| | | this.form.voiceId = sound.id; |
| | | this.togglePlay = true; |
| | | this.eventAudio.pause() |
| | | // this.eventAudio. |
| | | }, |
| | | togglePlayer() { |
| | | if (!this.soundPath) { |
| | |
| | | return false; |
| | | } |
| | | this.eventAudio.src = this.soundPath; |
| | | |
| | | if (this.togglePlay) { |
| | | this.eventAudio.play(); |
| | | this.togglePlay = false |
| | | } else { |
| | | this.eventAudio.pause() |
| | | this.togglePlay = true |
| | | } |
| | | this.togglePlay = !this.togglePlay |
| | | // this.togglePlay = !this.togglePlay |
| | | }, |
| | | visibilitychange() { |
| | | switch (document.visibilityState) { |
| | |
| | | this.isAdd = false; |
| | | this.videoItem = null; |
| | | this.$refs.addForm.resetFields(); |
| | | this.voice = null; |
| | | |
| | | // this.initFormData(); |
| | | // this.$refs.addForm.clearValidate(); |
| | | if (node.type === "4") { |
| | | getCameraInfo(node.id).then(res => { |
| | | if (res.success) { |
| | | console.log(res, '获取摄像机信息') |
| | | // console.log(res, '获取摄像机信息') |
| | | if (res.data.resolutions) { |
| | | let list = res.data.resolutions.map(i => { |
| | | let obj = {} |
| | |
| | | this.sensors = res.data.sensors |
| | | } |
| | | this.$nextTick(() => { |
| | | this.initFormData() |
| | | Object.assign(this.form, res.data) |
| | | |
| | | this.soundList.forEach(element => { |
| | | if (this.form.voiceId == element.id) { |
| | | this.voice = element |
| | | } |
| | | }) |
| | | |
| | | if (this.form.run_type !== -1) { |
| | | this.form.isAI = true |
| | | } else { |
| | |
| | | // 保存 |
| | | onSubmit(formName) { |
| | | let list = this.$refs.cameraEditor.getResult() |
| | | console.log(list, "sensor") |
| | | // console.log(list, "sensor") |
| | | // id为空,新增摄像机 |
| | | |
| | | // if (this.form.voiceEnable && this.form.voiceId === "") { |
| | | // this.$notify({ |
| | | // type: "error", |
| | | // message: "请选择一个事件声音" |
| | | // }); |
| | | |
| | | // return; |
| | | // } |
| | | |
| | | this.$refs[formName].validate(async valid => { |
| | | if (valid) { |
| | | const isRequire = this.verifyRequrie(); |
| | | if (!isRequire) return false; |
| | | |
| | | this.form.latitude = Number.isNaN(parseFloat(this.form.latitude)) ? 0 : parseFloat(this.form.latitude); |
| | | this.form.longitude = Number.isNaN(parseFloat(this.form.longitude)) ? 0 : parseFloat(this.form.longitude); |
| | | this.form.sensors = list |
| | | this.form.resolution_width = Number(this.form.resolution.split("*")[0]) |
| | | this.form.resolution_height = Number(this.form.resolution.split("*")[1]) |
| | | let _this = this; |
| | | // 更新 |
| | | if (this.form.id !== "") { |
| | | this.form.areaid = this.TreeDataPool.getParent(this.form.id, this.isGb28182); |
| | | this.form.latitude = Number.isNaN(parseFloat(this.form.latitude)) ? 0 : parseFloat(this.form.latitude); |
| | | this.form.longitude = Number.isNaN(parseFloat(this.form.longitude)) ? 0 : parseFloat(this.form.longitude); |
| | | this.form.sensors = list |
| | | this.form.resolution_width = Number(this.form.resolution.split("*")[0]) |
| | | this.form.resolution_height = Number(this.form.resolution.split("*")[1]) |
| | | console.log(this.TreeDataPool.selectedNode) |
| | | updateCameraInfo(this.form).then(rsp => { |
| | | if (rsp.success) { |
| | | this.$notify({ |
| | |
| | | message: "摄像机信息修改成功!" |
| | | }); |
| | | this.TreeDataPool.fetchTreeData(); |
| | | console.log(this.TreeDataPool.selectedNode) |
| | | //_this.$root.$children[0].$refs['leftTree'].$refs.tree.ztreeObj.checkNode(_this.TreeDataPool.selectedNode, true, false, false); |
| | | //选中修改后的节点 |
| | | let {evt,treeId} = _this.$root.$children[0].$refs['leftTree'].$refs.tree; |
| | | console.log(evt,treeId) |
| | | // this.$nextTick(()=>{ |
| | | //_this.$root.$children[0].$refs['leftTree'].$refs.tree.handleCreated() |
| | | // }) |
| | | |
| | | } else { |
| | | this.selectCamera(this.TreeDataPool.selectedNode); |
| | | this.$notify({ |
| | |
| | | message: "摄像机信息修改失败!" |
| | | }); |
| | | } |
| | | }).catch(err => { |
| | | this.$notify({ |
| | | type: "error", |
| | | message: err.data |
| | | }); |
| | | }); |
| | | } else { |
| | | this.form.areaid = this.addParentId; |
| | | this.form.sensors = list |
| | | const { ...json } = this.form; |
| | | createCamera({ |
| | | latitude: parseFloat(json.latitude), |
| | | rtsp: this.form.rtsp, |
| | | longitude: parseFloat(json.longitude), |
| | | name: this.form.name, |
| | | addr: this.form.addr, |
| | | areaid: this.form.areaid, |
| | | brand: this.form.brand, |
| | | id: this.form.id, |
| | | ip: this.form.ip, |
| | | port: parseFloat(json.port), |
| | | reserved: this.form.reserved, |
| | | run_type: this.form.isAI ? this.form.run_type : -1, |
| | | username: this.form.username, |
| | | password: this.form.password, |
| | | areaId: this.form.areaId, |
| | | sensors: this.form.sensors |
| | | }).then(rsp => { |
| | | createCamera(this.form).then(rsp => { |
| | | if (rsp.success) { |
| | | this.$notify({ |
| | | type: "success", |
| | |
| | | id: "", |
| | | ip: "", |
| | | reserved: "", |
| | | run_type: 0, |
| | | run_type: -1, |
| | | isAI: false, |
| | | username: "", |
| | | password: "", |
| | | resolution: "", |
| | | voiceId: "", |
| | | voiceEnable: true |
| | | voiceEnable: false |
| | | }; |
| | | }, |
| | | // 添加设备 |
| | |
| | | this.isAdd = true; |
| | | this.addParentId = node; |
| | | this.initFormData(); |
| | | }, |
| | | //实时、轮询切换 |
| | | changePoll(row) { |
| | | // console.log(row,'实时、轮询切换',this.form,this.PollData.RealTimeSum) |
| | | //判断是新增还是更新 |
| | | if (this.form.id && this.form.id !== undefined) { |
| | | if (this.PollData.RealTimeSum < 16) { |
| | | if (row.value) { |
| | | this.form.run_type = 1 |
| | | } else { |
| | | this.form.run_type = 0 |
| | | } |
| | | changeRunType({ camera_ids: [this.form.id], run_type: this.form.run_type }).then( |
| | | rsp => { |
| | | if (rsp && rsp.success) { |
| | | this.$notify({ |
| | | type: "success", |
| | | message: "配置成功" |
| | | }); |
| | | } else { |
| | | this.$notify({ |
| | | type: "error", |
| | | message: "配置失败" |
| | | }); |
| | | } |
| | | } |
| | | ); |
| | | } else { |
| | | if (this.form.run_type === 1) { |
| | | this.form.run_type = 0 |
| | | changeRunType({ camera_ids: [this.form.id], run_type: this.form.run_type }).then( |
| | | rsp => { |
| | | if (rsp && rsp.success) { |
| | | this.$notify({ |
| | | type: "success", |
| | | message: "配置成功" |
| | | }); |
| | | } else { |
| | | this.$notify({ |
| | | type: "error", |
| | | message: "配置失败" |
| | | }); |
| | | } |
| | | } |
| | | ); |
| | | } |
| | | this.$nextTick(() => { |
| | | this.$set(this.form, 'run_type', 0) |
| | | }) |
| | | // this.$notify({ |
| | | // type: 'warning', |
| | | // message: '实时处理路数已达最大处理路数!' |
| | | // }) |
| | | } |
| | | this.TreeDataPool.fetchTreeData(); |
| | | this.PollData.statisticTaskInfo(); |
| | | } |
| | | }, |
| | | //是否进行视频分析处理 |
| | | pollEnable(row) { |
| | | // console.log(row,'实时、轮询切换') |
| | | if (row) { |
| | | if (this.PollData.RealTimeSum < 16) { |
| | | this.form.run_type = 1 |
| | | } else { |
| | | this.form.run_type = 0 |
| | | } |
| | | } else { |
| | | this.form.run_type = -1 |
| | | } |
| | | if (this.form.id && this.form.id !== undefined) { |
| | | changeRunType({ camera_ids: [this.form.id], run_type: this.form.run_type }).then( |
| | | rsp => { |
| | | if (rsp && rsp.success) { |
| | | this.$notify({ |
| | | type: "success", |
| | | message: "配置成功" |
| | | }); |
| | | } else { |
| | | this.$notify({ |
| | | type: "error", |
| | | message: "配置失败" |
| | | }); |
| | | } |
| | | this.selectCamera(this.TreeDataPool.selectedNode) |
| | | } |
| | | ); |
| | | } |
| | | this.TreeDataPool.fetchTreeData(); |
| | | this.PollData.statisticTaskInfo(); |
| | | } |
| | | } |
| | | }; |
| | |
| | | <style lang="scss"> |
| | | .camera-info { |
| | | width: 100%; |
| | | height: 100%; |
| | | margin-left: 20px; |
| | | overflow: auto; |
| | | |
| | | margin: 20px 0 20px 20px; |
| | | |
| | | .ai-select { |
| | | text-align: left; |
| | | } |