From 649a012bd1f445afd51e3aad8e137d43c36434e0 Mon Sep 17 00:00:00 2001 From: zhangzengfei <zhangzengfei@smartai.com> Date: 星期五, 05 八月 2022 11:48:21 +0800 Subject: [PATCH] 检索导出添加组织字段 --- src/views/hashrate/CameraManage/CameraInfo/index.vue | 438 +++++++++++++++++++++--------------------------------- 1 files changed, 169 insertions(+), 269 deletions(-) diff --git a/src/views/hashrate/CameraManage/CameraInfo/index.vue b/src/views/hashrate/CameraManage/CameraInfo/index.vue index 793881c..65c9bee 100644 --- a/src/views/hashrate/CameraManage/CameraInfo/index.vue +++ b/src/views/hashrate/CameraManage/CameraInfo/index.vue @@ -3,30 +3,14 @@ <div class="cameraHeader"> <div class="title">鎽勫儚鏈轰俊鎭�</div> - <el-form - class="addForm" - ref="addForm" - :model="form" - :rules="rules" - label-width="88px" - label-position="left" - > + <el-form class="addForm" ref="addForm" :model="form" :rules="rules" label-width="88px" label-position="left"> <div class="row"> <el-form-item label="RTSP鍦板潃" prop="rtsp"> - <el-input - v-model="form.rtsp" - placeholder="rtsp://" - :disabled="isDisabled" - size="small" - ></el-input> + <el-input v-model="form.rtsp" placeholder="rtsp://" :disabled="isDisabled" size="small"></el-input> </el-form-item> <el-form-item label="澶勭悊鍒嗚鲸鐜�"> - <el-select - v-model="form.resolution" - placeholder="鏈満鍒嗚鲸鐜�" - size="small" - > + <el-select v-model="form.resolution" placeholder="鏈満鍒嗚鲸鐜�" size="small"> <el-option v-for="item in resolutionList" :key="item.value" @@ -39,39 +23,19 @@ <div class="row"> <el-form-item label="璁惧鍚嶇О" prop="name"> - <el-input - v-model="form.name" - placeholder="璇疯緭鍏ヨ澶囧悕绉�" - :disabled="isDisabled" - size="small" - ></el-input> + <el-input v-model="form.name" placeholder="璇疯緭鍏ヨ澶囧悕绉�" :disabled="isDisabled" size="small"></el-input> </el-form-item> <el-form-item label="鍧愭爣" class="position"> <label slot="label">鍧愭爣</label> - <el-input - v-model="form.latitude" - placeholder="缁忓害" - :disabled="isDisabled" - size="small" - ></el-input> - <el-input - v-model="form.longitude" - placeholder="绾害" - :disabled="isDisabled" - size="small" - ></el-input> + <el-input v-model="form.latitude" placeholder="缁忓害" :disabled="isDisabled" size="small"></el-input> + <el-input v-model="form.longitude" placeholder="绾害" :disabled="isDisabled" size="small"></el-input> </el-form-item> </div> <div class="row"> <el-form-item label="璁惧鍦板潃" prop="addr"> - <el-input - v-model="form.addr" - placeholder="璇疯緭鍏ュ湴鍧�鎻忚堪" - :disabled="isDisabled" - size="small" - ></el-input> + <el-input v-model="form.addr" placeholder="璇疯緭鍏ュ湴鍧�鎻忚堪" :disabled="isDisabled" size="small"></el-input> </el-form-item> <el-form-item label="浜嬩欢澹伴煶"> @@ -83,11 +47,7 @@ <div class="row"> <el-form-item label="璁惧鍒悕" prop="alias" v-show="isGb28182"> - <el-input - v-model="form.alias" - placeholder="璇疯緭鍏ヨ澶囧埆鍚�" - size="small" - ></el-input> + <el-input v-model="form.alias" placeholder="璇疯緭鍏ヨ澶囧埆鍚�" size="small"></el-input> </el-form-item> </div> @@ -110,11 +70,7 @@ </div> --> <!-- 娣诲姞浼犳劅鍣� --> - <CameraInfoEditor - ref="cameraEditor" - :Carmeras="form" - :sensors="sensors" - ></CameraInfoEditor> + <CameraInfoEditor ref="cameraEditor" :Carmeras="form" :sensors="sensors"></CameraInfoEditor> <div class="btns"> <el-button @@ -126,12 +82,7 @@ class="delBtn" >鍒犻櫎鎽勫儚鏈�</el-button > - <el-button - size="small" - type="primary" - @click="onSubmit('addForm')" - :disabled="conDisabled" - class="saveBtn" + <el-button size="small" type="primary" @click="onSubmit('addForm')" :disabled="conDisabled" class="saveBtn" >淇濆瓨</el-button > </div> @@ -179,21 +130,12 @@ </div> </div> - <sysinfo - :stroke="24" - v-if="PollData.barCharts && PollData.barCharts.length !== 0" - /> + <sysinfo :stroke="24" v-if="PollData.barCharts && PollData.barCharts.length !== 0" /> </div> <div class="camera"> <div class="connect"> - <el-button - size="small" - type="primary" - @click="cameraConnet" - :disabled="conDisabled" - >杩炴帴娴嬭瘯</el-button - > + <el-button size="small" type="primary" @click="cameraConnet" :disabled="conDisabled">杩炴帴娴嬭瘯</el-button> </div> <div class="video"> @@ -204,19 +146,9 @@ :rtspUrl="videoItem.rtsp" :isRunning="false" :showArea="false" - :videoUrl="ip" - v-if=" - videoItem !== '' && - videoItem !== undefined && - videoItem !== null && - visibilityState - " + v-if="videoItem !== '' && videoItem !== undefined && videoItem !== null && visibilityState" ></wasm-player> - <video - v-else - poster="/images/hashrate/video-poster.png" - preload="none" - ></video> + <video v-else poster="/images/hashrate/video-poster.png" preload="none"></video> </div> </div> </div> @@ -224,35 +156,30 @@ </template> <script> -import { - createCamera, - updateCameraInfo, - getCameraInfo, - delCamera, -} from "@/api/camera"; -import { getSoundList } from "@/api/event"; +import { createCamera, updateCameraInfo, getCameraInfo, delCamera } from "@/api/camera" +import { getSoundList } from "@/api/event" -import WasmPlayer from "@/components/wasmPlayer"; -import CameraInfoEditor from "./components/CameraInfoEditor"; -import Sysinfo from "@/components/subComponents/SystemInfo"; +import WasmPlayer from "@/components/wasmPlayer" +import CameraInfoEditor from "./components/CameraInfoEditor" +import Sysinfo from "@/components/subComponents/SystemInfo" export default { name: "CameraInfo", components: { WasmPlayer, CameraInfoEditor, - Sysinfo, + Sysinfo }, props: { cameraList: { default: () => { - return []; + return [] }, - type: Array, - }, + type: Array + } }, created() { - document.querySelector("html").style["min-width"] = "1280px"; + document.querySelector("html").style["min-width"] = "1280px" }, data() { return { @@ -262,21 +189,14 @@ togglePlay: true, eventAudio: new Audio(), soundPath: "", - ip: "", form: {}, // 璁板綍娣诲姞鐘舵�� isAdd: false, addParentId: "", rules: { - name: [ - { required: true, message: "璁惧鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }, - ], - rtsp: [ - { required: true, message: "RTSP鍦板潃涓嶈兘涓虹┖", trigger: "blur" }, - ], - addr: [ - { required: true, message: "璁惧鍦板潃涓嶈兘涓虹┖", trigger: "blur" }, - ], + name: [{ required: true, message: "璁惧鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }], + rtsp: [{ required: true, message: "RTSP鍦板潃涓嶈兘涓虹┖", trigger: "blur" }], + addr: [{ required: true, message: "璁惧鍦板潃涓嶈兘涓虹┖", trigger: "blur" }] }, resolutionList: [], //浼犳劅鍣ㄥ垪琛� @@ -285,262 +205,247 @@ clusterList: [ { label: "闆嗙兢1", - value: 0, + value: 0 }, { label: "闆嗙兢2", - value: 1, - }, - ], - }; + value: 1 + } + ] + } }, computed: { isSelected() { - return this.TreeDataPool.selectedNode.type !== "4"; + return this.TreeDataPool.selectedNode.type !== "4" }, isGb28182() { - return this.TreeDataPool.selectedNode.cameraType === 1; + return this.TreeDataPool.selectedNode.cameraType === 1 }, isDisabled() { if (this.isGb28182) { - return true; + return true } - return this.isAdd ? false : this.TreeDataPool.selectedNode.type !== "4"; + return this.isAdd ? false : this.TreeDataPool.selectedNode.type !== "4" }, conDisabled() { - return this.isAdd ? false : this.TreeDataPool.selectedNode.type !== "4"; - }, + return this.isAdd ? false : this.TreeDataPool.selectedNode.type !== "4" + } }, mounted() { - this.initFormData(); + this.initFormData() document.addEventListener("visibilitychange", () => { - this.visibilitychange(); - }); - this.getSounds(); + this.visibilitychange() + }) + this.getSounds() this.eventAudio.addEventListener("ended", () => { - this.togglePlay = true; - }); + this.togglePlay = true + }) }, methods: { getSounds() { getSoundList() .then((res) => { if (res.success) { - this.soundList = res.data.voices; + this.soundList = res.data.voices } }) - .catch((e) => console.log(e)); + .catch((e) => console.log(e)) }, selSound(sound) { - this.soundPath = sound.path; - this.form.voiceId = sound.id; - this.togglePlay = true; - this.eventAudio.pause(); + this.soundPath = sound.path + this.form.voiceId = sound.id + this.togglePlay = true + this.eventAudio.pause() // this.eventAudio. }, togglePlayer() { if (!this.soundPath) { this.$notify({ type: "info", - message: "璇峰厛閫夋嫨涓�涓0闊�!", - }); - return false; + message: "璇峰厛閫夋嫨涓�涓0闊�!" + }) + return false } - this.eventAudio.src = this.soundPath; + this.eventAudio.src = this.soundPath if (this.togglePlay) { - this.eventAudio.play(); - this.togglePlay = false; + this.eventAudio.play() + this.togglePlay = false } else { - this.eventAudio.pause(); - this.togglePlay = true; + this.eventAudio.pause() + this.togglePlay = true } // this.togglePlay = !this.togglePlay }, visibilitychange() { switch (document.visibilityState) { case "hidden": - this.visibilityState = false; - break; + this.visibilityState = false + break case "visible": - this.visibilityState = true; - break; + this.visibilityState = true + break } }, selectCamera(node) { - this.isAdd = false; - this.videoItem = null; - this.$refs.addForm.resetFields(); - this.voice = null; + this.isAdd = false + this.videoItem = null + this.$refs.addForm.resetFields() + this.voice = null if (node.type === "4") { getCameraInfo(node.id).then((res) => { if (res.success) { - this.ip = "ws://" + res.data.ip + ":7009/ws"; - if (res.data.resolutions) { let list = res.data.resolutions.map((i) => { - let obj = {}; + let obj = {} if (i.width == 0 && i.height == 0) { - obj.label = "鏈満鍒嗚鲸鐜�"; - obj.value = "0*0"; + obj.label = "鏈満鍒嗚鲸鐜�" + obj.value = "0*0" } else { - obj.label = i.width + "*" + i.height; - obj.value = i.width + "*" + i.height; + obj.label = i.width + "*" + i.height + obj.value = i.width + "*" + i.height } - return obj; - }); - this.resolutionList = list; - this.sensors = res.data.sensors; + return obj + }) + this.resolutionList = list + this.sensors = res.data.sensors } this.$nextTick(() => { - this.initFormData(); - Object.assign(this.form, res.data); + this.initFormData() + Object.assign(this.form, res.data) this.soundList.forEach((element) => { if (this.form.voiceId == element.id) { - this.voice = element; + this.voice = element } - }); + }) if (this.form.run_type !== -1) { - this.form.isAI = true; + this.form.isAI = true } else { - this.form.isAI = false; + this.form.isAI = false } - this.form.resolution = - this.form.resolution_width + "*" + this.form.resolution_height; - }); + this.form.resolution = this.form.resolution_width + "*" + this.form.resolution_height + }) } - }); + }) } }, // 淇濆瓨 onSubmit(formName) { - let list = this.$refs.cameraEditor.getResult(); + let list = this.$refs.cameraEditor.getResult() this.$refs[formName].validate(async (valid) => { if (valid) { - const isRequire = this.verifyRequrie(); - if (!isRequire) return false; + 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; + 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 - ); - console.log(this.TreeDataPool.selectedNode); + this.form.areaid = this.TreeDataPool.getParent(this.form.id, this.isGb28182) + console.log(this.TreeDataPool.selectedNode) let tem = { camera: this.form, - sensors: this.form.sensors, - }; - tem.camera.clusterId = sessionStorage.getItem("clusterId"); - tem.camera.devId = sessionStorage.getItem("devId"); - delete tem.camera.sensors; + sensors: this.form.sensors + } + tem.camera.clusterId = sessionStorage.getItem("clusterId") + tem.camera.devId = sessionStorage.getItem("devId") + delete tem.camera.sensors updateCameraInfo(tem) .then((rsp) => { if (rsp.success) { this.$notify({ type: "success", - message: "鎽勫儚鏈轰俊鎭慨鏀规垚鍔燂紒", - }); - this.TreeDataPool.fetchTreeData(); - console.log(this.TreeDataPool.selectedNode); + 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); + 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.selectCamera(this.TreeDataPool.selectedNode) this.$notify({ type: "error", - message: "鎽勫儚鏈轰俊鎭慨鏀瑰け璐ワ紒", - }); + message: "鎽勫儚鏈轰俊鎭慨鏀瑰け璐ワ紒" + }) } }) - .catch((err) => {}); + .catch((err) => {}) } else { - this.form.areaid = this.addParentId; + this.form.areaid = this.addParentId let tem = { camera: this.form, - sensors: this.form.sensors, - }; - tem.camera.clusterId = sessionStorage.getItem("clusterId"); - tem.camera.devId = sessionStorage.getItem("devId"); - tem.camera.parentUserId = ""; - tem.camera.enable = false; - delete tem.camera.sensors; + sensors: this.form.sensors + } + tem.camera.clusterId = sessionStorage.getItem("clusterId") + tem.camera.devId = sessionStorage.getItem("devId") + tem.camera.parentUserId = "" + tem.camera.enable = false + delete tem.camera.sensors createCamera(tem) .then((rsp) => { if (rsp.success) { this.$notify({ type: "success", - message: "鎽勫儚鏈烘坊鍔犳垚鍔燂紒", - }); - this.TreeDataPool.selectedNode = rsp.data.camera; - this.TreeDataPool.fetchTreeData(); + message: "鎽勫儚鏈烘坊鍔犳垚鍔燂紒" + }) + this.TreeDataPool.selectedNode = rsp.data.camera + this.TreeDataPool.fetchTreeData() // 鍚庣杩斿洖缁撴灉涓�0锛屾煡璇㈠悗涓�4 - this.TreeDataPool.selectedNode.type = "4"; - this.selectCamera(this.TreeDataPool.selectedNode); + this.TreeDataPool.selectedNode.type = "4" + this.selectCamera(this.TreeDataPool.selectedNode) } else { this.$notify({ type: "error", - message: "鎽勫儚鏈烘坊鍔犲け璐ワ紒", - }); + message: "鎽勫儚鏈烘坊鍔犲け璐ワ紒" + }) } }) .catch((err) => { this.$notify({ type: "error", - message: err.msg, - }); - }); + message: err.msg + }) + }) } } - }); + }) }, // 杩炴帴娴嬭瘯 cameraConnet() { - this.videoItem = null; + this.videoItem = null this.$nextTick(() => { this.videoItem = { name: this.form.name, rtsp: this.form.rtsp, id: this.form.id, isRunning: this.form.run_enable, - cameraType: this.form.type, - }; + cameraType: this.form.type + } - console.log(this.videoItem); - }); + console.log(this.videoItem) + }) }, // * 楠岃瘉蹇呴�夐」 verifyRequrie() { if (this.isGb28182) { - return true; + return true } // const rtspReg = /^(rtsp:\/\/)([a-zA-Z0-9_]+):([a-zA-Z0-9_]+)@(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?):([0-9]|[1-9]\d{1,3}|[1-5]\d{4}|6[0-4]\d{4}|65[0-4]\d{2}|655[0-2]\d|6553[0-5])(\/)([a-zA-Z0-9_/]+)$/; // !rtspReg.test(this.form.rtsp @@ -548,47 +453,47 @@ if (this.form.rtsp === "") { this.$notify({ type: "warning", - message: "璇疯緭鍏ユ纭殑rtsp鍦板潃", - }); - return false; + message: "璇疯緭鍏ユ纭殑rtsp鍦板潃" + }) + return false } - return true; + return true }, // 鍒犻櫎鎽勫儚鏈� deleteCamera() { this.$confirm("鏄惁鍒犻櫎姝ゆ憚鍍忔満锛�", { center: true, cancelButtonClass: "comfirm-class-cancle", - confirmButtonClass: "comfirm-class-sure", + confirmButtonClass: "comfirm-class-sure" }).then(() => { if (!this.form.id) { this.$notify({ type: "warning", - message: "灏氭湭娣诲姞鎽勫儚鏈�", - }); - return; + message: "灏氭湭娣诲姞鎽勫儚鏈�" + }) + return } delCamera({ id: this.form.id, clusterId: this.TreeDataPool.clusterId, - devId: this.TreeDataPool.devId, + devId: this.TreeDataPool.devId }).then((res) => { if (res.success) { - this.initFormData(); + this.initFormData() this.$notify({ type: "success", - message: "鍒犻櫎鎴愬姛锛�", - }); - this.TreeDataPool.fetchTreeData(); - this.TreeDataPool.selectedNode = {}; + message: "鍒犻櫎鎴愬姛锛�" + }) + this.TreeDataPool.fetchTreeData() + this.TreeDataPool.selectedNode = {} } else { this.$notify({ type: "error", - message: "鍒犻櫎澶辫触锛�", - }); + message: "鍒犻櫎澶辫触锛�" + }) } - }); - }); + }) + }) }, // 娓呯┖杈撳叆妗� initFormData() { @@ -610,33 +515,32 @@ password: "", resolution: "", voiceId: "", - voiceEnable: false, - }; + voiceEnable: false + } }, // 娣诲姞璁惧 addDevice(node) { - this.isAdd = true; - this.addParentId = node; + this.isAdd = true + this.addParentId = node this.resolutionList = [ { label: "鏈満鍒嗚鲸鐜�", - value: "0*0", + value: "0*0" }, { label: "1920*1080", - value: "1920*1080", + value: "1920*1080" }, { label: "2688*1520", - value: "2688*1520", - }, - ]; - this.initFormData(); - }, - }, -}; + value: "2688*1520" + } + ] + this.initFormData() + } + } +} </script> - <style lang="scss" scoped> .CameraInfo { @@ -708,11 +612,7 @@ flex: 1; border-radius: 15px; .el-progress-bar__inner { - background: linear-gradient( - 270deg, - #0065ff 0%, - rgba(0, 101, 255, 0.25) 100% - ); + background: linear-gradient(270deg, #0065ff 0%, rgba(0, 101, 255, 0.25) 100%); } .el-progress-bar__outer { @@ -892,4 +792,4 @@ } } } -</style> \ No newline at end of file +</style> -- Gitblit v1.8.0