From 8821d887a6acdd8882f339a50ad1893c1eed09eb Mon Sep 17 00:00:00 2001 From: zhangzengfei <zhangzengfei@smartai.com> Date: 星期二, 21 十二月 2021 16:57:02 +0800 Subject: [PATCH] 恢复国标池刷底图图标 --- src/pages/gb28181/index/App.vue | 261 +++++++++++++++++++-------------------------------- 1 files changed, 99 insertions(+), 162 deletions(-) diff --git a/src/pages/gb28181/index/App.vue b/src/pages/gb28181/index/App.vue index f1dd8e8..76a50b0 100644 --- a/src/pages/gb28181/index/App.vue +++ b/src/pages/gb28181/index/App.vue @@ -12,13 +12,7 @@ <el-tab-pane label="鍥芥爣ID" name="gb28181"> <div style="width: 775px"> <!-- GB28181璁剧疆 --> - <el-form - :model="gb28181" - :rules="rules" - label-width="130px" - class="alarmSetting" - ref="gb28181" - > + <el-form :model="gb28181" :rules="rules" label-width="130px" class="alarmSetting" ref="gb28181"> <!-- <el-form-item label="鍥介檯鏈嶅姟鍣↖P" prop="ServerIp"> <ip-input :ip="gb28181.ServerIp" @on-blur="gb28181.ServerIp = arguments[0]"></ip-input> </el-form-item>--> @@ -74,11 +68,7 @@ :value="item.id" ></el-option> </el-select> - <el-button - type="text" - style="position: absolute" - v-show="gb28181.idType === 1" - @click="newGBID" + <el-button type="text" style="position: absolute" v-show="gb28181.idType === 1" @click="newGBID" >鐢熸垚ID</el-button > </el-form-item> @@ -97,11 +87,7 @@ </el-form-item> <el-form-item label="鍥芥爣绔彛" prop="GbServerPort"> - <el-input - v-model.number="gb28181.GbServerPort" - placeholder="璇疯緭鍏�" - size="small" - ></el-input> + <el-input v-model.number="gb28181.GbServerPort" placeholder="璇疯緭鍏�" size="small"></el-input> </el-form-item> <el-form-item label="寮�鍚壌鏉�" style="text-align: left"> @@ -118,9 +104,7 @@ </el-form-item> <el-form-item style="float: right"> - <el-button type="primary" @click="submitGB28281" size="small" - >淇濆瓨</el-button - > + <el-button type="primary" @click="submitGB28281" size="small">淇濆瓨</el-button> </el-form-item> </el-form> </div> @@ -136,53 +120,26 @@ :header-cell-style="{ background: '#f8f8f8', color: '#222222', - height: '30px', + height: '30px' }" > - <el-table-column - type="index" - label="搴忓彿" - align="center" - width="50" - ></el-table-column> - <el-table-column - prop="name" - label="鍚嶇О" - align="center" - ></el-table-column> - <el-table-column - prop="publicid" - label="ID" - align="center" - ></el-table-column> - <el-table-column - prop="ip" - label="IP" - align="center" - ></el-table-column> + <el-table-column type="index" label="搴忓彿" align="center" width="50"></el-table-column> + <el-table-column prop="name" label="鍚嶇О" align="center"></el-table-column> + <el-table-column prop="publicid" label="ID" align="center"></el-table-column> + <el-table-column prop="ip" label="IP" align="center"></el-table-column> <el-table-column prop="status" label="鐘舵��" align="center"> <template slot-scope="scope"> - <span - :style="scope.row.alive ? `color:#047d19` : 'color:#f11a1a;'" - >{{ scope.row.alive ? "鍦ㄧ嚎" : "绂荤嚎" }}</span - > + <span :style="scope.row.alive ? `color:#047d19` : 'color:#f11a1a;'">{{ + scope.row.alive ? "鍦ㄧ嚎" : "绂荤嚎" + }}</span> </template> </el-table-column> - <el-table-column - prop="corp" - label="澶囨敞" - align="center" - ></el-table-column> + <el-table-column prop="corp" label="澶囨敞" align="center"></el-table-column> </el-table> </el-tab-pane> <el-tab-pane label="鍥芥爣鎽勫儚鏈�" name="cameras"> <div style="text-align: left"> - <el-button - type="primary" - size="small" - @click="updateCamerasFromVideosvr" - >鍒锋柊</el-button - > + <el-button type="primary" size="small" @click="updateCamerasFromVideosvr">鍒锋柊</el-button> </div> <div class="camera-title"> <b>鍥芥爣鎽勫儚鏈洪厤缃�</b> @@ -200,17 +157,8 @@ /> <div class="base-image" v-loading="TreeDataPool.baseImageLoading"> <span>{{ TreeDataPool.cameraNameForBaseImage }}</span> - <div - class="camera-image" - v-show="TreeDataPool.cameraNameForBaseImage.length" - > - <img - :src=" - 'data:image/png;base64,' + TreeDataPool.gb28181CameraBaseImage - " - width="450px" - alt - /> + <div class="camera-image" v-show="TreeDataPool.cameraNameForBaseImage.length"> + <img :src="'data:image/png;base64,' + TreeDataPool.gb28181CameraBaseImage" width="450px" alt /> </div> </div> <el-divider></el-divider> @@ -221,9 +169,7 @@ / {{ TreeDataPool.gb28181ChildNodeCount }} ) 璺� </span> - <el-button type="primary" size="small" @click="saveChecked" - >淇濆瓨</el-button - > + <el-button type="primary" size="small" @click="saveChecked">淇濆瓨</el-button> </el-tab-pane> </el-tabs> </div> @@ -237,23 +183,23 @@ getGb28181AreaList, newGb28181ID, getAllSubServer, - saveGb28181CamTree, -} from "./api"; + saveGb28181CamTree +} from "./api" -import TreeMenu from "@/components/giantTree/index"; -import { isPort, isIPv4 } from "@/scripts/validate"; -import bus from "@/plugin/bus"; +import TreeMenu from "@/components/giantTree/index" +import { isPort, isIPv4 } from "@/scripts/validate" +import bus from "@/plugin/bus" export default { name: "Gb28181Setting", components: { - TreeMenu, + TreeMenu }, directives: { focus: { - inserted: function (el) { - el.querySelector("input").focus(); - }, - }, + inserted: function(el) { + el.querySelector("input").focus() + } + } }, data() { @@ -268,46 +214,42 @@ idType: 1, treeSettings: { check: { - enable: true, - }, - view: { - showLine: true, - showIcon: true, // default to hide icon - }, + enable: true + } }, rules: { ip: [ { required: true, message: "璇疯緭鍏P鍦板潃", - trigger: "change", + trigger: "change" }, - { validator: isIPv4, trigger: "change" }, + { validator: isIPv4, trigger: "change" } ], ServerIp: [ { required: true, message: "璇疯緭鍏P鍦板潃", - trigger: "change", + trigger: "change" }, - { validator: isIPv4, trigger: "change" }, + { validator: isIPv4, trigger: "change" } ], ServerPort: [ { required: true, message: "璇疯緭鍏ョ鍙�", - trigger: "change", + trigger: "change" }, - { validator: isPort, trigger: "change" }, + { validator: isPort, trigger: "change" } ], GbServerPort: [ { required: true, message: "璇疯緭鍏ョ鍙�", - trigger: "change", + trigger: "change" }, - { validator: isPort, trigger: "change" }, - ], + { validator: isPort, trigger: "change" } + ] }, locationCity: { province: "", @@ -315,97 +257,92 @@ county: "", provinceOptions: [], cityOptions: [], - countyOptions: [], - }, - }; + countyOptions: [] + } + } }, mounted() { - this.TreeDataPool.multiple = true; + this.TreeDataPool.multiple = true // 璁板綍鐩綍鏄惁鎶樺彔 - let foldList = localStorage.getItem("ztree_fold_list"); + let foldList = localStorage.getItem("ztree_fold_list") if (foldList) { - this.TreeDataPool.foldNodeList = JSON.parse(foldList); + this.TreeDataPool.foldNodeList = JSON.parse(foldList) } - this.initGB28181Conf(); + this.initGB28181Conf() }, methods: { hanleTabClick(tab, event) { if (this.activeName == "subordinates") { getAllSubServer().then((rsp) => { if (rsp && rsp.success) { - this.subDevTable = rsp.data; + this.subDevTable = rsp.data } - }); + }) } else if (this.activeName == "cameras") { - this.getCamerasFromVideosvr(); + this.getCamerasFromVideosvr() } }, async getCamerasFromVideosvr() { - this.loading = true; - await this.TreeDataPool.fetchVideosvrCameras(false); - this.loading = false; + this.loading = true + await this.TreeDataPool.fetchVideosvrCameras(false) + this.loading = false }, async updateCamerasFromVideosvr() { - this.loading = true; - await this.TreeDataPool.fetchVideosvrCameras(true); - this.loading = false; + this.loading = true + await this.TreeDataPool.fetchVideosvrCameras(true) + this.loading = false }, saveChecked() { - localStorage.setItem( - "ztree_fold_list", - JSON.stringify(this.TreeDataPool.foldNodeList) - ); + localStorage.setItem("ztree_fold_list", JSON.stringify(this.TreeDataPool.foldNodeList)) if (this.TreeDataPool.gb28181CheckedCount > 500) { this.$message({ type: "warning", - message: "鏈�澶氫粎鏀寔閫夋嫨500璺憚鍍忔満. 璇烽噸鏂伴�夋嫨", - }); + message: "鏈�澶氫粎鏀寔閫夋嫨500璺憚鍍忔満. 璇烽噸鏂伴�夋嫨" + }) - return; + return } - this.loading = true; + this.loading = true - let treeData = this.TreeDataPool.newTreeByChecked( - this.TreeDataPool.activeTreeData - ); + let treeData = this.TreeDataPool.newTreeByChecked(this.TreeDataPool.activeTreeData) saveGb28181CamTree({ checkedMenus: treeData }) .then((rsp) => { if (rsp && rsp.success) { this.$message({ type: "success", - message: "淇濆瓨鎴愬姛", - }); + message: "淇濆瓨鎴愬姛" + }) } - this.loading = false; + this.loading = false }) .catch((err) => { this.$message({ type: "error", - message: "淇濆瓨澶辫触", - }); - this.loading = false; - }); + message: "淇濆瓨澶辫触" + }) + this.loading = false + }) }, initGB28181Conf() { getGB28181Config().then((rsp) => { if (rsp && rsp.success) { - this.gb28181 = rsp.data; + this.gb28181 = rsp.data //this.gb28181.idType = 0; - this.$set(this.gb28181, "idType", 0); - this.$refs["gb28181"].resetFields(); + this.$set(this.gb28181, "idType", 0) + this.$refs["gb28181"].resetFields() } - }); + }) getGb28181AreaList().then((rsp) => { if (rsp && rsp.success) { - this.locationCity.provinceOptions = rsp.data; + this.locationCity.provinceOptions = rsp.data } - }); + }) }, submitGB28281() { this.$refs["gb28181"].validate((valid) => { @@ -414,62 +351,62 @@ if (rsp && rsp.success) { this.$notify({ type: "success", - message: "GB28181璁剧疆淇濆瓨鎴愬姛", - }); + message: "GB28181璁剧疆淇濆瓨鎴愬姛" + }) } - }); + }) } else { - console.log("error submit!!"); - return false; + console.log("error submit!!") + return false } - }); + }) }, changeProvince() { - let pid = this.locationCity.province; + let pid = this.locationCity.province getGb28181AreaList({ parentId: pid }).then((rsp) => { if (rsp && rsp.success) { - this.locationCity.cityOptions = rsp.data; - this.locationCity.city = this.locationCity.cityOptions[0].id; - this.changeCity(); + this.locationCity.cityOptions = rsp.data + this.locationCity.city = this.locationCity.cityOptions[0].id + this.changeCity() } - }); + }) }, changeCity() { - let pid = this.locationCity.city; + let pid = this.locationCity.city getGb28181AreaList({ parentId: pid }).then((rsp) => { if (rsp && rsp.success) { - this.locationCity.countyOptions = rsp.data; - this.locationCity.county = this.locationCity.countyOptions[0].id; + this.locationCity.countyOptions = rsp.data + this.locationCity.county = this.locationCity.countyOptions[0].id } - }); + }) }, newGBID() { - let cCode = this.locationCity.county + ""; + let cCode = this.locationCity.county + "" newGb28181ID({ code: cCode }).then((rsp) => { if (rsp && rsp.success) { - this.gb28181.PublicId = rsp.data; + this.gb28181.PublicId = rsp.data } - }); + }) }, menuOpen() {}, menuClose() {}, toOpenMenuList(e) { - let t = e.clientY - this.$el.offsetTop + 30; - let l = e.clientX - this.$el.offsetLeft; + let t = e.clientY - this.$el.offsetTop + 30 + let l = e.clientX - this.$el.offsetLeft window.parent.postMessage( { source: location.href.split("/")[location.href.split("/").length - 1], trigger: "contextmenu", menuT: t, - menuL: l, + menuL: l }, "*" - ); - return false; - }, - }, -}; + ) + return false + } + } +} </script> <style lang="scss"> .s-system-manage { -- Gitblit v1.8.0