From 6ef2ac92c0d3f79b59b8698274918df830b58b29 Mon Sep 17 00:00:00 2001 From: ZZJ <10913410+zzj2100@user.noreply.gitee.com> Date: 星期四, 28 七月 2022 10:20:24 +0800 Subject: [PATCH] 禅道bug --- src/components/giantTree/zTree/ztree_v3/jquery.ztree.exhide.js | 285 +++++ vue.config.js | 6 src/views/productDetail/components/ConfirmOrder.vue | 8 src/views/equipmentManagement/algorithmDetail/index.vue | 6 src/views/index/components/productLeft.vue | 7 src/components/giantTree/zTree/ztree_v3/jquery.ztree.all.js | 5 src/views/GB28181/components/DevList.vue | 212 ++++ src/views/GB28181/components/Flow.vue | 68 + public/images/register/3.png | 0 src/components/subComponents/ImageShow.vue | 17 public/images/register/1.png | 0 public/images/search/4.png | 0 src/views/personalCenter/components/OrderMng.vue | 2 src/views/productDetail/components/Function.vue | 2 public/images/manageCenter/manage.png | 0 src/views/hashrate/AlgManage/index.vue | 2 src/views/hashrate/HashManage/components/ClusterCard.vue | 8 src/views/GB28181/components/TreeArea.vue | 299 ++++++ src/components/giantTree/zTree/ztree.vue | 283 ++++ src/views/GB28181/GB28181Open.vue | 50 + public/images/manageCenter/manage2.png | 0 src/views/GB28181/components/Banner.vue | 55 + public/images/register/2.png | 0 src/api/Gb28181.ts | 72 + src/views/equipmentManagement/equipmentList/components/FormList.vue | 6 public/images/manageCenter/total.png | 0 src/components/IndexHeader.vue | 9 src/views/trialCenter/components/SdkList.vue | 2 src/components/wasmPlayer/index.vue | 2 src/views/index/components/userCard.vue | 4 src/views/register/components/Steps.vue | 24 src/router/index.js | 12 public/images/register/register.png | 0 src/views/search/components/wasmPlayer/index.vue | 2 src/views/GB28181/components/SettingBox.vue | 115 ++ src/views/hashrate/CameraManage/CameraInfo/index.vue | 6 src/views/login/components/loginForm.vue | 2 src/views/search/components/CardItem.vue | 2 public/images/register/4.png | 0 src/views/GB28181/components/TableArea.vue | 701 ++++++++++++++ src/views/trialCenter/components/commendCard.vue | 8 public/images/trialCenter/product.png | 0 public/images/trialCenter/center.png | 0 src/views/index/components/rightForm.vue | 2 src/views/login/index.vue | 4 public/images/manageCenter/search.png | 0 public/images/search/1.png | 0 public/images/trialCenter/company.png | 0 src/views/index/index.vue | 84 + src/views/hashrate/components/Flow.vue | 8 public/images/product/alipay2.png | 0 src/views/hashrate/HashManage/index.vue | 2 public/images/login/background.png | 0 src/views/personalCenter/components/LeftMenu.vue | 2 src/views/search/components/Flow.vue | 8 src/views/trialCenter/components/SdkItem.vue | 4 src/views/register/registerSuccess/index.vue | 2 public/images/equipmentManagement/add.png.png | 0 public/images/product/alipay.png | 0 src/views/hashrate/CameraManage/CameraRules/components/RuleItem.vue | 2 src/Pool/TreeData.ts | 5 public/images/manageCenter/total2.png | 0 public/images/manageCenter/total4.png | 0 public/images/product/pay2.png | 0 public/images/product/pay.png | 0 src/views/equipmentManagement/equipmentList/components/Content.vue | 8 src/views/GB28181/index.vue | 59 + src/views/productDetail/index.vue | 4 public/images/search/3.png | 0 public/images/trialCenter/time.png | 0 public/index.html | 2 src/views/index/components/banner.vue | 28 src/views/search/components/UploadImg.vue | 2 src/views/hashrate/CameraManage/CameraInfo/components/CameraInfoEditor.vue | 2 public/images/manageCenter/total3.png | 0 src/components/giantTree/index.vue | 11 public/images/trialCenter/user.png | 0 src/views/equipmentManagement/components/Flow.vue | 8 src/views/hashrate/HashManage/components/HashCard.vue | 6 src/views/manageCenter/index.vue | 22 public/images/register/success.png | 0 src/views/hashrate/CameraManage/CameraRules/index.vue | 6 public/images/search/2.png | 0 src/views/GB28181/components/FormArea.vue | 324 ++++++ 84 files changed, 2,696 insertions(+), 191 deletions(-) diff --git a/public/images/equipmentManagement/add.png.png b/public/images/equipmentManagement/add.png.png new file mode 100644 index 0000000..b93aa89 --- /dev/null +++ b/public/images/equipmentManagement/add.png.png Binary files differ diff --git a/public/images/login/background.png b/public/images/login/background.png new file mode 100644 index 0000000..a4e788a --- /dev/null +++ b/public/images/login/background.png Binary files differ diff --git a/public/images/manageCenter/manage.png b/public/images/manageCenter/manage.png new file mode 100644 index 0000000..8d396c0 --- /dev/null +++ b/public/images/manageCenter/manage.png Binary files differ diff --git a/public/images/manageCenter/manage2.png b/public/images/manageCenter/manage2.png new file mode 100644 index 0000000..2d9562b --- /dev/null +++ b/public/images/manageCenter/manage2.png Binary files differ diff --git a/public/images/manageCenter/search.png b/public/images/manageCenter/search.png new file mode 100644 index 0000000..2736e43 --- /dev/null +++ b/public/images/manageCenter/search.png Binary files differ diff --git a/public/images/manageCenter/total.png b/public/images/manageCenter/total.png new file mode 100644 index 0000000..cacbc83 --- /dev/null +++ b/public/images/manageCenter/total.png Binary files differ diff --git a/public/images/manageCenter/total2.png b/public/images/manageCenter/total2.png new file mode 100644 index 0000000..0c49e12 --- /dev/null +++ b/public/images/manageCenter/total2.png Binary files differ diff --git a/public/images/manageCenter/total3.png b/public/images/manageCenter/total3.png new file mode 100644 index 0000000..e3ce3d7 --- /dev/null +++ b/public/images/manageCenter/total3.png Binary files differ diff --git a/public/images/manageCenter/total4.png b/public/images/manageCenter/total4.png new file mode 100644 index 0000000..78470f0 --- /dev/null +++ b/public/images/manageCenter/total4.png Binary files differ diff --git a/public/images/product/alipay.png b/public/images/product/alipay.png new file mode 100644 index 0000000..0e3f924 --- /dev/null +++ b/public/images/product/alipay.png Binary files differ diff --git a/public/images/product/alipay2.png b/public/images/product/alipay2.png new file mode 100644 index 0000000..313284c --- /dev/null +++ b/public/images/product/alipay2.png Binary files differ diff --git a/public/images/product/pay.png b/public/images/product/pay.png new file mode 100644 index 0000000..ed23f95 --- /dev/null +++ b/public/images/product/pay.png Binary files differ diff --git a/public/images/product/pay2.png b/public/images/product/pay2.png new file mode 100644 index 0000000..c456c82 --- /dev/null +++ b/public/images/product/pay2.png Binary files differ diff --git a/public/images/register/1.png b/public/images/register/1.png new file mode 100644 index 0000000..5575170 --- /dev/null +++ b/public/images/register/1.png Binary files differ diff --git a/public/images/register/2.png b/public/images/register/2.png new file mode 100644 index 0000000..09b591c --- /dev/null +++ b/public/images/register/2.png Binary files differ diff --git a/public/images/register/3.png b/public/images/register/3.png new file mode 100644 index 0000000..9713ab9 --- /dev/null +++ b/public/images/register/3.png Binary files differ diff --git a/public/images/register/4.png b/public/images/register/4.png new file mode 100644 index 0000000..85d275d --- /dev/null +++ b/public/images/register/4.png Binary files differ diff --git a/public/images/register/register.png b/public/images/register/register.png new file mode 100644 index 0000000..f03266a --- /dev/null +++ b/public/images/register/register.png Binary files differ diff --git a/public/images/register/success.png b/public/images/register/success.png new file mode 100644 index 0000000..c3fb4d7 --- /dev/null +++ b/public/images/register/success.png Binary files differ diff --git a/public/images/search/1.png b/public/images/search/1.png new file mode 100644 index 0000000..dd2e880 --- /dev/null +++ b/public/images/search/1.png Binary files differ diff --git a/public/images/search/2.png b/public/images/search/2.png new file mode 100644 index 0000000..dc597c1 --- /dev/null +++ b/public/images/search/2.png Binary files differ diff --git a/public/images/search/3.png b/public/images/search/3.png new file mode 100644 index 0000000..6c4607c --- /dev/null +++ b/public/images/search/3.png Binary files differ diff --git a/public/images/search/4.png b/public/images/search/4.png new file mode 100644 index 0000000..969996c --- /dev/null +++ b/public/images/search/4.png Binary files differ diff --git a/public/images/trialCenter/center.png b/public/images/trialCenter/center.png new file mode 100644 index 0000000..7ac4c4e --- /dev/null +++ b/public/images/trialCenter/center.png Binary files differ diff --git a/public/images/trialCenter/company.png b/public/images/trialCenter/company.png new file mode 100644 index 0000000..89faece --- /dev/null +++ b/public/images/trialCenter/company.png Binary files differ diff --git a/public/images/trialCenter/product.png b/public/images/trialCenter/product.png new file mode 100644 index 0000000..3835b75 --- /dev/null +++ b/public/images/trialCenter/product.png Binary files differ diff --git a/public/images/trialCenter/time.png b/public/images/trialCenter/time.png new file mode 100644 index 0000000..d1977d6 --- /dev/null +++ b/public/images/trialCenter/time.png Binary files differ diff --git a/public/images/trialCenter/user.png b/public/images/trialCenter/user.png new file mode 100644 index 0000000..9b77ff9 --- /dev/null +++ b/public/images/trialCenter/user.png Binary files differ diff --git a/public/index.html b/public/index.html index 9239dcc..506eb2c 100644 --- a/public/index.html +++ b/public/index.html @@ -6,7 +6,7 @@ <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width,initial-scale=1.0"> <link rel="icon" href="<%= BASE_URL %>favicon.ico"> - <link rel="stylesheet" href="./fonts/iconfont.css"> + <link rel="stylesheet" href="/fonts/iconfont.css"> <link rel="shortcut icon" type="image/x-icon" href="/favicon.ico"> <title>sass</title> <style> diff --git a/src/Pool/TreeData.ts b/src/Pool/TreeData.ts index 330295e..8b93a3d 100644 --- a/src/Pool/TreeData.ts +++ b/src/Pool/TreeData.ts @@ -498,10 +498,9 @@ this.setDropDisable(this.treeData) this.isFold(this.treeData) - this.activeTreeData = this.treeData - - this.gb28181CheckedCount = 0; + this.gb28181CheckedCount = 0 this.gb28181ChildNodeCount = this.countChildrenNodes(this.treeData) + this.activeTreeData = this.treeData } } diff --git a/src/api/Gb28181.ts b/src/api/Gb28181.ts new file mode 100644 index 0000000..235a523 --- /dev/null +++ b/src/api/Gb28181.ts @@ -0,0 +1,72 @@ +import request from '@/scripts/httpRequest' + +export const getGB28181Config = () => { + return request({ + url: "/data/api-v/sysset/gb28181ConfigShow", + method: "get" + }); +}; + + +export const saveGB28181Config = (query: any) => { + return request({ + url: "/data/api-v/sysset/gb28181ConfEdit", + method: "post", + data: query + }); +}; + +export const getGb28181AreaList = (query: any) => { + return request({ + url: "/data/api-v/gb28181/findAreaByParentId", + method: "get", + params: query + }); +}; + +export const getAllSubServer = (query: any) => { + return request({ + url: "/data/api-v/gb28181/getAllSubServer", + method: "get", + params: query + }); +}; + +export const newGb28181ID = (query: any) => { + return request({ + url: "/data/api-v/gb28181/newGbId", + method: "get", + params: query + }); +}; + +export const getLocalCameraTree = (query: any) => { + return request({ + url: "/data/api-v/area/localmenu", + method: "get", + params: query + }); +}; + +export const getGB28181CameraTree = (query: any) => { + return request({ + url: "/data/api-v/area/gb28181Tree", + method: "get", + params: query + }); +}; + +export const refreshGB28181Tree = () => { + return request({ + url: "/data/api-v/area/gb28181RefreshTree", + method: "post", + }); +}; + +export const saveGb28181CamTree = (query: any) => { + return request({ + url: "/data/api-v/gb28181/saveGb28181CamTree", + method: "post", + data: query + }); +}; diff --git a/src/components/IndexHeader.vue b/src/components/IndexHeader.vue index 72d3d59..ec0e7b0 100644 --- a/src/components/IndexHeader.vue +++ b/src/components/IndexHeader.vue @@ -6,7 +6,7 @@ <router-link to="/"> <img class="logo" src="/images/index/LOGO.png" alt="" /> </router-link> - <div class="title" @click="$router.push('/')">宸ヤ笟鐗╄仈缃戝钩鍙�</div> + <div class="title" @click="$router.push('/')">宸ヤ笟浜掕仈缃戝钩鍙�</div> <div class="label" @click="$router.push('/')">棣栭〉</div> <div class="label">浜戞湇鍔�</div> <div class="label" @click="$router.push('/manageCenter')">绠$悊涓績</div> @@ -49,7 +49,7 @@ <!-- 宸茬櫥褰曟儏鍐� --> <img class="userImg" - src="/images/index/榛樿澶村儚-01.png" + src="/images/index/default.png" alt="" v-if="userInfo" @mouseenter="showUserBox" @@ -118,6 +118,7 @@ <li class="keyItem" v-for="(item, index) in hotKeyArr" :key="index"> {{ item }} </li> + x </ul> </div> @@ -191,7 +192,7 @@ const _this = this; this.UserTimer = setTimeout(() => { _this.isShowUserBox = false; - }, 100); + }, 200); }, logOut() { @@ -434,7 +435,7 @@ .userBox { box-sizing: border-box; position: absolute; - z-index: 3; + z-index: 10; right: 20px; top: 64px; padding: 0 20px; diff --git a/src/components/giantTree/index.vue b/src/components/giantTree/index.vue index 3325c7b..c04cbae 100644 --- a/src/components/giantTree/index.vue +++ b/src/components/giantTree/index.vue @@ -18,6 +18,7 @@ @onExpand="itemExpand" @onCollapse="itemCollapse" @onShowPic="showCameraPic" + :search="search" /> <div class="empty" v-if="!node.length">鏆傛棤鎽勫儚鏈烘暟鎹�,璇锋坊鍔犳憚鍍忔満!</div> <div class="dialog-box-bg" v-show="showDialog" @click="hideDialogBox"></div> @@ -86,6 +87,10 @@ default: function () { return {}; }, + }, + search: { + type: Boolean, + default: false, }, }, data() { @@ -316,8 +321,11 @@ // this.TreeDataPool.updateZTreeCheckNodes([treeNode]); // }, itemCheck(evt, treeId, treeNode) { - this.TreeDataPool.selectedNode = treeNode; + if (treeNode) { + this.TreeDataPool.selectedNode = treeNode; + } this.TreeDataPool.treeType = this.treeName; + // 澶氶�� // this.ztreeObj.checkNode(treeNode, true, false, false); let checkedNodes = this.ztreeObj.getCheckedNodes(true); @@ -328,6 +336,7 @@ // 淇濆瓨涓�浠芥暟鎹� this.TreeDataPool.activeTreeData = this.ztreeObj.getNodes(); + this.$emit("itemChecked", treeNode); }, //灞曞紑 itemExpand(e, id, node) { diff --git a/src/components/giantTree/zTree/ztree.vue b/src/components/giantTree/zTree/ztree.vue index c6a3b0f..8f8637a 100644 --- a/src/components/giantTree/zTree/ztree.vue +++ b/src/components/giantTree/zTree/ztree.vue @@ -1,21 +1,41 @@ <template> - <div class="ztree" :id="ztreeId"></div> + <div> + <div class="searchTree"> + <el-input + placeholder="鎼滅储" + v-model="keyWord" + size="mini" + v-show="search" + > + <i + slot="suffix" + class="el-input__icon el-icon-search" + :id="searchBtnId" + ></i> + </el-input> + </div> + <div class="ztree" :id="ztreeId"></div> + </div> </template> <script> import * as $ from "jquery"; +import { Loading } from "element-ui"; + if (!window.jQuery) { window.jQuery = $; } // require("@ztree/ztree_v3/js/jquery.ztree.all"); require("./ztree_v3/jquery.ztree.all"); +require("./ztree_v3/jquery.ztree.exhide"); export default { props: { showCheckbox: { type: Boolean, default: false }, readonly: { type: Boolean, default: true }, gb28181: { type: Boolean, default: false }, + search: { type: Boolean, default: false }, setting: { type: Object, require: false, @@ -34,8 +54,10 @@ data() { return { ztreeId: "ztree_" + parseInt(Math.random() * 1e10), + searchBtnId: "search_" + parseInt(Math.random() * 1e10), ztreeObj: null, list: [], + loading: false, ztreeSetting: { view: { showLine: true, @@ -59,7 +81,7 @@ }, onClick: (...arg) => { this.$emit("onClick", ...arg); - //this.removeHoverIcon(...arg); + this.removeHoverIcon(...arg); }, onCollapse: (...arg) => { this.$emit("onCollapse", ...arg); @@ -96,6 +118,10 @@ }, }, }, + keyWord: "", + options: { + target: "", + }, }; }, watch: { @@ -113,6 +139,7 @@ Object.assign({}, this.ztreeSetting, this.setting), this.list ); + this.fuzzySearch(this.ztreeObj, this.searchBtnId, false, true); //鍒濆鍖栨ā绯婃悳绱㈡柟娉� this.$emit("onCreated", this.ztreeObj); }); }, @@ -121,6 +148,10 @@ }, showCheckbox: { handler: function () { + let top = $("#" + this.ztreeId) + .parent() + .scrollTop(); + this.ztreeSetting.check.enable = this.showCheckbox; if (this.ztreeObj) { @@ -133,6 +164,9 @@ Object.assign({}, this.ztreeSetting, this.setting), this.list ); + $("#" + this.ztreeId) + .parent() + .scrollTop(top); this.$emit("onCreated", this.ztreeObj); }); }, @@ -147,16 +181,15 @@ // 鏂囦欢澶规柊澧炴寜閽� if ( item && - !item.querySelector(".addIcon") && + !item.querySelector(".el-icon-circle-plus-outline") && treeNode.isParent && !this.readonly && !this.gb28181 ) { - const btn = document.createElement("a"); + const btn = document.createElement("i"); btn.id = `${treeid}_${treeNode.id}_btn`; - btn.classList.add("addIcon"); - btn.classList.add("iconfont"); - btn.title = "鏂板"; + btn.classList.add("el-icon-circle-plus-outline"); + btn.classList.add("primary"); // btn.innerText = '鍒犻櫎'; btn.addEventListener("click", (e) => { e.stopPropagation(); @@ -170,17 +203,16 @@ // 鏂囦欢澶瑰垹闄ゆ寜閽� if ( item && - !item.querySelector(".delIcon") && + !item.querySelector(".el-icon-remove-outline") && treeNode.isParent && !this.readonly && !treeNode.children && !this.gb28181 ) { - const btn = document.createElement("a"); + const btn = document.createElement("i"); btn.id = `${treeid}_${treeNode.id}_btn`; - btn.classList.add("delIcon"); - btn.classList.add("iconfont"); - btn.title = "鍒犻櫎"; + btn.classList.add("el-icon-remove-outline"); + btn.classList.add("danger"); // btn.innerText = '鍒犻櫎'; btn.addEventListener("click", (e) => { e.stopPropagation(); @@ -194,15 +226,14 @@ // 鏂囦欢澶圭紪杈戞寜閽� if ( item && - !item.querySelector(".editIcon") && + !item.querySelector(".el-icon-edit") && treeNode.isParent && !this.readonly ) { - const btn = document.createElement("a"); + const btn = document.createElement("i"); btn.id = `${treeid}_${treeNode.id}_btn`; - btn.classList.add("editIcon"); - btn.classList.add("iconfont"); - btn.title = "缂栬緫"; + btn.classList.add("el-icon-edit"); + btn.classList.add("primary"); // btn.innerText = '鍒犻櫎'; btn.addEventListener("click", (e) => { e.stopPropagation(); @@ -212,19 +243,21 @@ item.appendChild(btn); } + // 娣诲姞鎽勫儚鏈烘寜閽� if ( item && - !item.querySelector(".addCameraIcon") && + !item.querySelector(".iconshishishipin") && treeNode.isParent && !this.readonly && !this.gb28181 ) { - const btn = document.createElement("a"); + const btn = document.createElement("i"); btn.id = `${treeid}_${treeNode.id}_btn`; btn.classList.add("iconfont"); - btn.classList.add("addCameraIcon"); - btn.title = "娣诲姞鎽勫儚鏈�"; + btn.classList.add("iconshishishipin"); + btn.classList.add("primary"); + btn.classList.add("icon-fix"); // btn.innerText = '鍒犻櫎'; btn.addEventListener("click", (e) => { e.stopPropagation(); @@ -238,16 +271,17 @@ // 瀵煎叆鎽勫儚鏈烘寜閽� if ( item && - !item.querySelector(".importIcon") && + !item.querySelector(".icondaoru") && treeNode.isParent && !this.readonly && !this.gb28181 ) { - const btn = document.createElement("a"); + const btn = document.createElement("i"); btn.id = `${treeid}_${treeNode.id}_btn`; btn.classList.add("iconfont"); - btn.classList.add("importIcon"); - btn.title = "瀵煎叆鎽勫儚鏈�"; + btn.classList.add("icondaoru"); + btn.classList.add("primary"); + btn.classList.add("icon-fix"); // btn.innerText = '鍒犻櫎'; btn.addEventListener("click", (e) => { e.stopPropagation(); @@ -261,16 +295,15 @@ // 鏌ョ湅搴曞浘鎸夐挳 if ( item && - !item.querySelector(".icontupian1") && + !item.querySelector(".el-icon-picture") && treeNode.type == "camera" ) { - const btn = document.createElement("a"); + const btn = document.createElement("i"); btn.id = `${treeid}_${treeNode.id}_btn`; btn.classList.add("iconfont"); - btn.classList.add("icontupian1"); + btn.classList.add("el-icon-picture"); btn.classList.add("primary"); btn.classList.add("icon-fix"); - btn.title = "鏌ョ湅搴曞浘"; // btn.innerText = '鍒犻櫎'; btn.addEventListener("click", (e) => { e.stopPropagation(); @@ -287,36 +320,171 @@ removeHoverDom(treeid, treeNode) { const item = document.getElementById(`${treeNode.tId}_a`); if (item) { - let btn = item.querySelector(".addIcon"); + let btn = item.querySelector(".el-icon-circle-plus-outline"); if (btn) { - item.removeChild(item.querySelector(".addIcon")); + item.removeChild(item.querySelector(".el-icon-circle-plus-outline")); } - btn = item.querySelector(".delIcon"); + btn = item.querySelector(".el-icon-remove-outline"); if (btn) { - item.removeChild(item.querySelector(".delIcon")); + item.removeChild(item.querySelector(".el-icon-remove-outline")); } - btn = item.querySelector(".editIcon"); + btn = item.querySelector(".el-icon-edit"); if (btn) { - item.removeChild(item.querySelector(".editIcon")); + item.removeChild(item.querySelector(".el-icon-edit")); } - btn = item.querySelector(".addCameraIcon"); + btn = item.querySelector(".iconshishishipin"); if (btn) { - item.removeChild(item.querySelector(".addCameraIcon")); + item.removeChild(item.querySelector(".iconshishishipin")); } - btn = item.querySelector(".importIcon"); + btn = item.querySelector(".icondaoru"); if (btn) { - item.removeChild(item.querySelector(".importIcon")); + item.removeChild(item.querySelector(".icondaoru")); } - btn = item.querySelector(".icontupian1"); + btn = item.querySelector(".el-icon-picture"); if (btn) { - item.removeChild(item.querySelector(".icontupian1")); + item.removeChild(item.querySelector(".el-icon-picture")); } } + }, + fuzzySearch(zTreeObj, searchField, isHighLight, isExpand) { + const _this = this; + + if (!zTreeObj) { + alert("fail to get ztree object"); + } + var nameKey = zTreeObj.setting.data.key.name; //get the key of the node name + isHighLight = isHighLight === false ? false : true; //default true, only use false to disable highlight + isExpand = isExpand ? true : false; // not to expand in default + zTreeObj.setting.view.nameIsHTML = isHighLight; //allow use html in node name for highlight use + + var metaChar = "[\\[\\]\\\\^\\$\\.\\|\\?\\*\\+\\(\\)]"; //js meta characters + var rexMeta = new RegExp(metaChar, "gi"); //regular expression to match meta characters + + // keywords filter function + function ztreeFilter(zTreeObj, _keywords, callBackFunc) { + if (!_keywords) { + _keywords = ""; //default blank for _keywords + } + + // function to find the matching node + function filterFunc(node) { + if (node && node.oldname && node.oldname.length > 0) { + node[nameKey] = node.oldname; //recover oldname of the node if exist + } + zTreeObj.updateNode(node); //update node to for modifications take effect + if (_keywords.length == 0) { + //return true to show all nodes if the keyword is blank + zTreeObj.showNode(node); + zTreeObj.expandNode(node, isExpand); + return true; + } + //transform node name and keywords to lowercase + if ( + node[nameKey] && + node[nameKey].toLowerCase().indexOf(_keywords.toLowerCase()) != -1 + ) { + if (isHighLight) { + //highlight process + //a new variable 'newKeywords' created to store the keywords information + //keep the parameter '_keywords' as initial and it will be used in next node + //process the meta characters in _keywords thus the RegExp can be correctly used in str.replace + var newKeywords = _keywords.replace(rexMeta, function (matchStr) { + //add escape character before meta characters + return "\\" + matchStr; + }); + node.oldname = node[nameKey]; //store the old name + var rexGlobal = new RegExp(newKeywords, "gi"); //'g' for global,'i' for ignore case + //use replace(RegExp,replacement) since replace(/substr/g,replacement) cannot be used here + node[nameKey] = node.oldname.replace( + rexGlobal, + function (originalText) { + //highlight the matching words in node name + var highLightText = + '<span style="color: whitesmoke;background-color: darkred;">' + + originalText + + "</span>"; + return highLightText; + } + ); + zTreeObj.updateNode(node); //update node for modifications take effect + } + zTreeObj.showNode(node); //show node with matching keywords + return true; //return true and show this node + } + + zTreeObj.hideNode(node); // hide node that not matched + return false; //return false for node not matched + } + + var nodesShow = zTreeObj.getNodesByFilter(filterFunc); //get all nodes that would be shown + processShowNodes(nodesShow, _keywords); //nodes should be reprocessed to show correctly + _this.$emit("onAfterSearch", null); + } + + /** + * reprocess of nodes before showing + */ + function processShowNodes(nodesShow, _keywords) { + if (nodesShow && nodesShow.length > 0) { + //process the ancient nodes if _keywords is not blank + if (_keywords.length > 0) { + $.each(nodesShow, function (n, obj) { + var pathOfOne = obj.getPath(); //get all the ancient nodes including current node + if (pathOfOne && pathOfOne.length > 0) { + //i < pathOfOne.length-1 process every node in path except self + for (var i = 0; i < pathOfOne.length - 1; i++) { + zTreeObj.showNode(pathOfOne[i]); //show node + zTreeObj.expandNode(pathOfOne[i], true); //expand node + } + } + }); + } else { + //show all nodes when _keywords is blank and expand the root nodes + var rootNodes = zTreeObj.getNodesByParam("level", "0"); //get all root nodes + $.each(rootNodes, function (n, obj) { + zTreeObj.expandNode(obj, true); //expand all root nodes + }); + } + } + } + + //listen to change in input element + $("#" + searchField).bind("click", function () { + // _this.options.target = document.querySelector("#" + _this.ztreeId).parentNode.parentNode + // console.log(_this.options.target); + // let loadingInstance = Loading.service(_this.options) + // console.log(_this.keyWord); + // var _keywords = $(this).val(); + $("#" + searchField).removeClass("el-icon-search"); + $("#" + searchField).addClass("el-icon-loading"); + searchNodeLazy(_this.keyWord); //call lazy load + // loadingInstance.close() + setTimeout(() => { + $("#" + searchField).removeClass("el-icon-loading"); + $("#" + searchField).addClass("el-icon-search"); + }, 300); + }); + + var lastKeyword = ""; + // excute lazy load once after input change, the last pending task will be cancled + function searchNodeLazy(_keywords) { + if (lastKeyword === _keywords) { + return; + } + ztreeFilter(zTreeObj, _keywords); //lazy load ztreeFilter function + // $(searchField).focus();//focus input field again after filtering + lastKeyword = _keywords; + } + }, + handleSearch() { + this.loading = true; + searchNodeLazy(this.keyWord); //call lazy load + this.loading = false; }, }, }; @@ -745,4 +913,37 @@ filter: alpha(opacity=0); position: absolute; } + +.iconfont.el-icon-picture.primary.icon-fix { + margin-left: 10px; + margin-right: 10px; + font-size: 16px; + color: #0065ff; +} +</style> + +<style scoped lang="scss"> +.searchTree { + margin: 5px 5px; + display: flex; + justify-content: center; + + .el-input { + margin: 0 auto; + width: 350px; + } + + ::v-deep .el-input__suffix { + right: 0; + width: 50px; + background: skyblue; + color: #fff; + cursor: pointer; + background-color: rgb(61, 104, 255); + } + + .el-icon-search:before { + content: "鎼滅储"; + } +} </style> diff --git a/src/components/giantTree/zTree/ztree_v3/jquery.ztree.all.js b/src/components/giantTree/zTree/ztree_v3/jquery.ztree.all.js index df95111..d060ddb 100644 --- a/src/components/giantTree/zTree/ztree_v3/jquery.ztree.all.js +++ b/src/components/giantTree/zTree/ztree_v3/jquery.ztree.all.js @@ -1823,6 +1823,11 @@ fontClass = "iconjiankongshexiangji"; } else if (node.isAI) { fontClass = "iconfenxishexiangji"; + } else if (node.type === "camera") { + fontClass = "iconjiankongshexiangji"; + if (node.alive == 1) { + fontClass = fontClass + " running"; + } } if (node.isRunning) { diff --git a/src/components/giantTree/zTree/ztree_v3/jquery.ztree.exhide.js b/src/components/giantTree/zTree/ztree_v3/jquery.ztree.exhide.js new file mode 100644 index 0000000..df65b9e --- /dev/null +++ b/src/components/giantTree/zTree/ztree_v3/jquery.ztree.exhide.js @@ -0,0 +1,285 @@ +!(function(e) { + var i = { + view: { + clearOldFirstNode: function(e, i) { + for (var o = i.getNextNode(); o; ) { + if (o.isFirstNode) { + (o.isFirstNode = !1), c.setNodeLineIcos(e, o); + break; + } + if (o.isLastNode) break; + o = o.getNextNode(); + } + }, + clearOldLastNode: function(e, i, o) { + for (var d = i.getPreNode(); d; ) { + if (d.isLastNode) { + (d.isLastNode = !1), o && c.setNodeLineIcos(e, d); + break; + } + if (d.isFirstNode) break; + d = d.getPreNode(); + } + }, + makeDOMNodeMainBefore: function(e, i, o) { + var d = h.isHidden(i, o); + e.push( + "<li ", + d ? "style='display:none;' " : "", + "id='", + o.tId, + "' class='", + n.className.LEVEL, + o.level, + "' tabindex='0' hidefocus='true' treenode>" + ); + }, + showNode: function(e, i, o) { + h.isHidden(e, i, !1), h.initShowForExCheck(e, i), d(i, e).show(); + }, + showNodes: function(e, i, o) { + if (i && 0 != i.length) { + var d, + t, + n = {}; + for (d = 0, t = i.length; d < t; d++) { + var s = i[d]; + if (!n[s.parentTId]) { + var r = s.getParentNode(); + n[s.parentTId] = null === r ? h.getRoot(e) : s.getParentNode(); + } + c.showNode(e, s, o); + } + for (var a in n) { + var N = h.nodeChildren(e, n[a]); + c.setFirstNodeForShow(e, N), c.setLastNodeForShow(e, N); + } + } + }, + hideNode: function(e, i, o) { + h.isHidden(e, i, !0), + (i.isFirstNode = !1), + (i.isLastNode = !1), + h.initHideForExCheck(e, i), + c.cancelPreSelectedNode(e, i), + d(i, e).hide(); + }, + hideNodes: function(e, i, o) { + if (i && 0 != i.length) { + var d, + t, + n = {}; + for (d = 0, t = i.length; d < t; d++) { + var s = i[d]; + if ((s.isFirstNode || s.isLastNode) && !n[s.parentTId]) { + var r = s.getParentNode(); + n[s.parentTId] = null === r ? h.getRoot(e) : s.getParentNode(); + } + c.hideNode(e, s, o); + } + for (var a in n) { + var N = h.nodeChildren(e, n[a]); + c.setFirstNodeForHide(e, N), c.setLastNodeForHide(e, N); + } + } + }, + setFirstNode: function(e, i) { + var o = h.nodeChildren(e, i), + d = h.isHidden(e, o[0], !1); + 0 < o.length && !d + ? (o[0].isFirstNode = !0) + : 0 < o.length && c.setFirstNodeForHide(e, o); + }, + setLastNode: function(e, i) { + var o = h.nodeChildren(e, i), + d = h.isHidden(e, o[0]); + 0 < o.length && !d + ? (o[o.length - 1].isLastNode = !0) + : 0 < o.length && c.setLastNodeForHide(e, o); + }, + setFirstNodeForHide: function(e, i) { + var o, d, t; + for (d = 0, t = i.length; d < t && !(o = i[d]).isFirstNode; d++) { + if (!h.isHidden(e, o) && !o.isFirstNode) { + (o.isFirstNode = !0), c.setNodeLineIcos(e, o); + break; + } + o = null; + } + return o; + }, + setFirstNodeForShow: function(e, i) { + var o, d, t, n, s; + for (d = 0, t = i.length; d < t; d++) { + o = i[d]; + var r = h.isHidden(e, o); + if (!n && !r && o.isFirstNode) { + n = o; + break; + } + if (n || r || o.isFirstNode) { + if (n && o.isFirstNode) { + (o.isFirstNode = !1), (s = o), c.setNodeLineIcos(e, o); + break; + } + o = null; + } else (o.isFirstNode = !0), (n = o), c.setNodeLineIcos(e, o); + } + return { new: n, old: s }; + }, + setLastNodeForHide: function(e, i) { + var o, d; + for (d = i.length - 1; 0 <= d && !(o = i[d]).isLastNode; d--) { + if (!h.isHidden(e, o) && !o.isLastNode) { + (o.isLastNode = !0), c.setNodeLineIcos(e, o); + break; + } + o = null; + } + return o; + }, + setLastNodeForShow: function(e, i) { + var o, d, t, n; + for (d = i.length - 1; 0 <= d; d--) { + o = i[d]; + var s = h.isHidden(e, o); + if (!t && !s && o.isLastNode) { + t = o; + break; + } + if (t || s || o.isLastNode) { + if (t && o.isLastNode) { + (o.isLastNode = !1), (n = o), c.setNodeLineIcos(e, o); + break; + } + o = null; + } else (o.isLastNode = !0), (t = o), c.setNodeLineIcos(e, o); + } + return { new: t, old: n }; + }, + }, + data: { + initHideForExCheck: function(e, i) { + h.isHidden(e, i) && + e.check && + e.check.enable && + (void 0 === i._nocheck && + ((i._nocheck = !!i.nocheck), (i.nocheck = !0)), + (i.check_Child_State = -1), + c.repairParentChkClassWithSelf && + c.repairParentChkClassWithSelf(e, i)); + }, + initShowForExCheck: function(e, i) { + if (!h.isHidden(e, i) && e.check && e.check.enable) { + if ( + (void 0 !== i._nocheck && + ((i.nocheck = i._nocheck), delete i._nocheck), + c.setChkClass) + ) { + var o = d(i, n.id.CHECK, e); + c.setChkClass(e, o, i); + } + c.repairParentChkClassWithSelf && + c.repairParentChkClassWithSelf(e, i); + } + }, + }, + }; + e.extend(!0, e.fn.zTree._z, i); + var o = e.fn.zTree, + t = o._z.tools, + n = o.consts, + c = o._z.view, + h = o._z.data, + d = (o._z.event, t.$); + (h.isHidden = function(e, i, o) { + if (!i) return !1; + var d = e.data.key.isHidden; + return ( + void 0 !== o + ? ("string" == typeof o && (o = t.eqs(o, "true")), + (o = !!o), + (i[d] = o)) + : "string" == typeof i[d] + ? (i[d] = t.eqs(i[d], "true")) + : (i[d] = !!i[d]), + i[d] + ); + }), + h.exSetting({ data: { key: { isHidden: "isHidden" } } }), + h.addInitNode(function(e, i, o, d, t, n, s) { + var r = h.isHidden(e, o); + h.isHidden(e, o, r), h.initHideForExCheck(e, o); + }), + h.addBeforeA(function(e, i, o) {}), + h.addZTreeTools(function(t, n) { + (n.showNodes = function(e, i) { + c.showNodes(t, e, i); + }), + (n.showNode = function(e, i) { + e && c.showNodes(t, [e], i); + }), + (n.hideNodes = function(e, i) { + c.hideNodes(t, e, i); + }), + (n.hideNode = function(e, i) { + e && c.hideNodes(t, [e], i); + }); + var s = n.checkNode; + s && + (n.checkNode = function(e, i, o, d) { + (e && h.isHidden(t, e)) || s.apply(n, arguments); + }); + }); + var a = h.initNode; + h.initNode = function(e, i, o, d, t, n, s) { + var r = (d || h.getRoot(e))[e.data.key.children]; + (h.tmpHideFirstNode = c.setFirstNodeForHide(e, r)), + (h.tmpHideLastNode = c.setLastNodeForHide(e, r)), + s && + (c.setNodeLineIcos(e, h.tmpHideFirstNode), + c.setNodeLineIcos(e, h.tmpHideLastNode)), + (t = h.tmpHideFirstNode === o), + (n = h.tmpHideLastNode === o), + a && a.apply(h, arguments), + s && n && c.clearOldLastNode(e, o, s); + }; + var s = h.makeChkFlag; + s && + (h.makeChkFlag = function(e, i) { + (i && h.isHidden(e, i)) || s.apply(h, arguments); + }); + var r = h.getTreeCheckedNodes; + r && + (h.getTreeCheckedNodes = function(e, i, o, d) { + if (i && 0 < i.length) { + var t = i[0].getParentNode(); + if (t && h.isHidden(e, t)) return []; + } + return r.apply(h, arguments); + }); + var N = h.getTreeChangeCheckedNodes; + N && + (h.getTreeChangeCheckedNodes = function(e, i, o) { + if (i && 0 < i.length) { + var d = i[0].getParentNode(); + if (d && h.isHidden(e, d)) return []; + } + return N.apply(h, arguments); + }); + var l = c.expandCollapseSonNode; + l && + (c.expandCollapseSonNode = function(e, i, o, d, t) { + (i && h.isHidden(e, i)) || l.apply(c, arguments); + }); + var f = c.setSonNodeCheckBox; + f && + (c.setSonNodeCheckBox = function(e, i, o, d) { + (i && h.isHidden(e, i)) || f.apply(c, arguments); + }); + var u = c.repairParentChkClassWithSelf; + u && + (c.repairParentChkClassWithSelf = function(e, i) { + (i && h.isHidden(e, i)) || u.apply(c, arguments); + }); +})(jQuery); diff --git a/src/components/subComponents/ImageShow.vue b/src/components/subComponents/ImageShow.vue index 5aac2f0..3285ef7 100644 --- a/src/components/subComponents/ImageShow.vue +++ b/src/components/subComponents/ImageShow.vue @@ -1,5 +1,5 @@ <template> - <img class="a111" :src="url" alt="" /> + <img class="a111" @error="onError" :src="url" alt="" /> </template> <script> @@ -20,6 +20,21 @@ } }, }, + data() { + return { + errorNum: 0, + }; + }, + methods: { + onError(err) { + console.log(err); + if (this.errorNum > 5) { + return; + } + err.target.src = this.url + "?" + Math.random(); + this.errorNum++; + }, + }, }; </script> diff --git a/src/components/wasmPlayer/index.vue b/src/components/wasmPlayer/index.vue index f9f9f3e..c452673 100644 --- a/src/components/wasmPlayer/index.vue +++ b/src/components/wasmPlayer/index.vue @@ -536,7 +536,7 @@ }); } - let url = "http://" + window.location.host + this.loadUrl; + let url = "/httpImage/" + window.location.host + this.loadUrl; // let url = "http://localhost:8080/httpImage/192.168.20.189:6700/283,2f49bf283ad7?collection=2021-09-28-DSVAD010120190703-video" let name = url.substring(url.lastIndexOf("/") + 1); diff --git a/src/router/index.js b/src/router/index.js index 05fb9d6..986c676 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -75,6 +75,18 @@ import(/* webpackChunkName: "about" */ "../views/search/searchOpen"), }, { + path: "/GB28181Open", + name: "GB28181Open", + component: () => + import(/* webpackChunkName: "about" */ "../views/GB28181/GB28181Open"), + }, + { + path: "/GB28181", + name: "GB28181", + component: () => + import(/* webpackChunkName: "about" */ "../views/GB28181/index"), + }, + { path: "/product", name: "product", component: () => import(/* webpackChunkName: "about" */ "../views/product"), diff --git a/src/views/GB28181/GB28181Open.vue b/src/views/GB28181/GB28181Open.vue new file mode 100644 index 0000000..cc4e2ef --- /dev/null +++ b/src/views/GB28181/GB28181Open.vue @@ -0,0 +1,50 @@ +<template> + <div class="GB28181"> + <IndexHeader></IndexHeader> + <Banner></Banner> + <Flow></Flow> + <Footer></Footer> + </div> +</template> + +<script> +import IndexHeader from "@/components/IndexHeader"; +import Banner from "@/views/GB28181/components/Banner"; +import Flow from "@/views/GB28181/components/Flow"; +import Footer from "@/components/Footer"; + +export default { + components: { + IndexHeader, + Banner, + Flow, + Footer, + }, + created() { + // this.checkpermission(); + }, + methods: { + checkpermission() { + const userInfo = JSON.parse(sessionStorage.getItem("userInfo")); + const val = userInfo.permissions.find((item) => { + return item == "statisticMng"; + }); + if (val) { + this.$router.push("/GB28181"); + } + }, + }, +}; +</script> + +<style lang="scss" scoped> +.IndexHeader { + ::v-deep .header { + position: fixed; + z-index: 2; + top: 0; + right: 0; + left: 0; + } +} +</style> \ No newline at end of file diff --git a/src/views/GB28181/components/Banner.vue b/src/views/GB28181/components/Banner.vue new file mode 100644 index 0000000..7b68487 --- /dev/null +++ b/src/views/GB28181/components/Banner.vue @@ -0,0 +1,55 @@ +<template> + <div class="Banner"> + <div class="heart"> + <div class="title">GB28181閰嶇疆</div> + <div class="des">鏀寔鍥芥爣鏈嶅姟锛屾帴鍏ュ浗鏍囨憚鍍忔満銆�</div> + <div class="button" @click="jump">绔嬪嵆寮�閫�</div> + </div> + </div> +</template> + +<script> +import { enableMenu } from "@/api/user"; + +export default { + methods: { + async jump() { + /* console.log(JSON.parse(sessionStorage.getItem("userInfo")).id); + await enableMenu({ + userId: JSON.parse(sessionStorage.getItem("userInfo")).id, + menuId: "89098e9f-baaa-4a69-9e9b-26444dd69ff6", + }); */ + this.$router.push("/GB28181"); + }, + }, +}; +</script> + +<style scoped lang="scss"> +.Banner { + overflow: hidden; + height: 480px; + background-image: url("/images/hashrate/banner.png"); + color: #fff; + + .title { + margin: 122px 0 10px 0; + font-size: 48px; + } + + .des { + margin-bottom: 82px; + width: 560px; + font-size: 16px; + line-height: 24px; + } + + .button { + width: 160px; + height: 56px; + background: #0065ff; + text-align: center; + line-height: 56px; + } +} +</style> \ No newline at end of file diff --git a/src/views/GB28181/components/DevList.vue b/src/views/GB28181/components/DevList.vue new file mode 100644 index 0000000..ce540b4 --- /dev/null +++ b/src/views/GB28181/components/DevList.vue @@ -0,0 +1,212 @@ +<template> + <div class="DevList"> + <div class="title">GB28181閰嶇疆</div> + <div class="empty" v-if="devList.length === 0"> + <img src="/images/search/1.png" alt="" /> + <div class="des">鎮ㄨ繕鏈坊鍔犻泦缇ゆ垨璁惧锛岃鍦ㄨ澶囩鐞嗕腑娣诲姞</div> + <div class="button add">绔嬪嵆娣诲姞</div> + </div> + <div class="list scroll"> + <div class="devItem" v-for="(item, index) in devList" :key="index"> + <div class="mainInfo"> + <img v-if="item.type == 1" src="/images/hashrate/闆嗙兢.png" alt="" /> + <img v-else src="/images/hashrate/equipment.png" alt="" /> + + <div class="right"> + <div class="name">闆嗙兢123</div> + <div class="ip">192.168.1.1</div> + <div class="number">璁惧鎬婚噺:7</div> + </div> + + <div class="button set" @click="showSettingBox = true">閰嶇疆</div> + </div> + </div> + </div> + + <SettingBox + v-if="showSettingBox" + @close="showSettingBox = false" + ></SettingBox> + </div> +</template> + +<script> +import SettingBox from "@/views/GB28181/components/SettingBox"; + +export default { + components: { + SettingBox, + }, + data() { + return { + devList: [ + { + type: 1, + }, + { + type: 1, + }, + + { + type: 1, + }, + { + type: 1, + }, + { + type: 1, + }, + { + type: 1, + }, + + { + type: 1, + }, + { + type: 1, + }, + { + type: 1, + }, + { + type: 1, + }, + { + type: 1, + }, + { + type: 1, + }, + { + type: 1, + }, + { + type: 1, + }, + { + type: 0, + }, + { + type: 0, + }, + ], + showSettingBox: false, + }; + }, +}; +</script> + +<style lang="scss" scoped > +.DevList { + position: relative; + box-sizing: border-box; + padding: 20px; + width: 1280px; + height: 770px; + background-color: #fff; + margin: 0 auto; + + .title { + margin-bottom: 20px; + height: 20px; + padding-left: 20px; + font-weight: 700; + font-size: 16px; + border-left: 4px solid #0065ff; + } + + .empty { + text-align: center; + + img { + margin-top: 150px; + margin-bottom: 10px; + width: 260px; + } + + .des { + margin-bottom: 30px; + font-size: 14px; + } + + .add { + margin: 0 auto; + width: 112px; + height: 40px; + text-align: center; + line-height: 40px; + color: #fff; + background-color: #0065ff; + } + } + + .list { + display: flex; + flex-wrap: wrap; + overflow-y: auto; + height: 710px; + + .devItem { + position: relative; + margin: 0 15px 20px 0; + width: 295px; + height: 150px; + border: 1px solid #c0c5cc; + border-radius: 5px; + + .mainInfo { + display: flex; + padding: 20px; + + img { + margin-right: 20px; + width: 88px; + } + } + + .right { + .name { + margin-bottom: 6px; + font-size: 16px; + font-weight: 700; + } + + .ip, + .number { + margin-bottom: 2px; + font-size: 12px; + color: #666; + } + } + + .set { + position: absolute; + left: 0; + right: 0; + bottom: 0; + height: 40px; + line-height: 40px; + text-align: center; + border: 1px solid #c0c5cc; + font-size: 16px; + color: #0065ff; + } + + &:nth-child(4n) { + margin-right: 0; + } + + &:hover { + box-shadow: 0px 2px 16px 0px rgba(0, 43, 106, 0.25); + + .set { + color: #fff; + background-color: #0065ff; + border-color: #0065ff; + } + } + } + } +} +</style> \ No newline at end of file diff --git a/src/views/GB28181/components/Flow.vue b/src/views/GB28181/components/Flow.vue new file mode 100644 index 0000000..1718c32 --- /dev/null +++ b/src/views/GB28181/components/Flow.vue @@ -0,0 +1,68 @@ +<template> + <div class="Flow heart"> + <div class="title">绠楀姏绠$悊鐨勪娇鐢ㄦ祦绋�</div> + + <div class="flowList"> + <div class="flowItem" v-for="(item, index) in flowList" :key="index"> + <img :src="item.img" alt="" /> + <div class="flowTitle">{{ item.title }}</div> + </div> + </div> + </div> +</template> + +<script> +export default { + data() { + return { + flowList: [ + { + img: "/images/search/1.png", + title: "寮�閫氱粺璁℃煡璇�", + }, + { img: "/images/search/3.png", title: "鏁版嵁鏌ョ湅" }, + { + img: "/images/search/2.png", + title: "褰曞儚鏌ョ湅", + }, + { + img: "/images/search/4.png", + title: "鏁版嵁瀹炴椂鐩戞帶", + }, + ], + }; + }, +}; +</script> + +<style scoped lang="scss"> +.Flow { + overflow: hidden; + height: 540px; + text-align: center; + + .title { + margin: 60px 0; + font-size: 28px; + color: #3d3d3d; + } + + .flowList { + display: flex; + + .flowItem { + width: 260px; + margin-right: 80px; + + &:last-child { + margin-right: 0; + } + + .flowTitle { + margin-top: 20px; + font-size: 16px; + } + } + } +} +</style> \ No newline at end of file diff --git a/src/views/GB28181/components/FormArea.vue b/src/views/GB28181/components/FormArea.vue new file mode 100644 index 0000000..f7ce4c2 --- /dev/null +++ b/src/views/GB28181/components/FormArea.vue @@ -0,0 +1,324 @@ +<template> + <div class="FormArea"> + <el-form + :model="gb28181" + :rules="rules" + label-position="left" + label-width="90px" + class="alarmSetting" + ref="gb28181" + > + <el-radio-group v-model="gb28181.idType"> + <el-radio :label="0">杈撳叆宸叉湁ID</el-radio> + <el-radio :label="1">鐢熸垚鏂扮殑ID</el-radio> + </el-radio-group> + + <el-form-item class="selectItem" label="鎵�鍦ㄥ湴"> + <el-select + class="h32" + v-model="locationCity.province" + @change="changeProvince" + size="small" + placeholder="璇烽�夋嫨鐪佷唤" + :disabled="gb28181.idType === 0" + > + <el-option + v-for="item in locationCity.provinceOptions" + :key="item.id" + :label="item.name" + size="small" + :value="item.id" + ></el-option> + </el-select> + <el-select + class="ml10 mr10 h32" + v-model="locationCity.city" + :disabled="!locationCity.province" + @change="changeCity" + size="small" + placeholder="璇烽�夋嫨鍩庡競" + > + <el-option + v-for="item in locationCity.cityOptions" + :key="item.id" + :label="item.name" + :value="item.id" + ></el-option> + </el-select> + <el-select + class="h32" + v-model="locationCity.county" + :disabled="!locationCity.city" + size="small" + placeholder="璇烽�夋嫨鍖哄幙" + > + <el-option + v-for="item in locationCity.countyOptions" + :key="item.id" + :label="item.name" + :value="item.id" + ></el-option> + </el-select> + <div class="button" v-show="gb28181.idType === 1" @click="newGBID"> + 鐢熸垚ID + </div> + </el-form-item> + + <el-form-item label="鍥芥爣ID"> + <el-input + class="h32" + v-model="gb28181.PublicId" + placeholder="璇疯緭鍏�" + size="small" + :disabled="gb28181.idType === 1" + ></el-input> + </el-form-item> + + <el-form-item label="鍥芥爣绔彛" prop="GbServerPort"> + <el-input + class="h32" + v-model.number="gb28181.GbServerPort" + placeholder="璇疯緭鍏�" + size="small" + style="width: 200px" + ></el-input> + </el-form-item> + + <el-form-item label="寮�鍚壌鏉�" style="text-align: left"> + <el-switch v-model="gb28181.IsAuth"></el-switch> + </el-form-item> + + <el-form-item label="閴存潈瀵嗙爜"> + <el-input + class="h32" + v-model="gb28181.Password" + placeholder="璇疯緭鍏�" + size="small" + :disabled="!gb28181.IsAuth" + ></el-input> + </el-form-item> + </el-form> + + <div class="btnArea"> + <div class="button cancel" @click="$emit('close')">鍙栨秷</div> + <div class="button submit" @click="submitGB28281">淇濆瓨</div> + </div> + </div> +</template> + +<script> +import { + getGB28181Config, + saveGB28181Config, + getGb28181AreaList, + newGb28181ID, +} from "@/api/Gb28181"; +import { isPort, isIPv4 } from "@/scripts/validate"; + +export default { + created() { + this.initGB28181Conf(); + }, + data() { + return { + gb28181: {}, + rules: { + ip: [ + { + required: true, + message: "璇疯緭鍏P鍦板潃", + trigger: "change", + }, + { validator: isIPv4, trigger: "change" }, + ], + ServerIp: [ + { + required: true, + message: "璇疯緭鍏P鍦板潃", + trigger: "change", + }, + { validator: isIPv4, trigger: "change" }, + ], + ServerPort: [ + { + required: true, + message: "璇疯緭鍏ョ鍙�", + trigger: "change", + }, + { validator: isPort, trigger: "change" }, + ], + GbServerPort: [ + { + required: true, + message: "璇疯緭鍏ョ鍙�", + trigger: "change", + }, + { validator: isPort, trigger: "change" }, + ], + }, + locationCity: { + province: "", + city: "", + county: "", + provinceOptions: [], + cityOptions: [], + countyOptions: [], + }, + }; + }, + methods: { + initGB28181Conf() { + getGB28181Config().then((rsp) => { + if (rsp && rsp.success) { + this.gb28181 = rsp.data; + //this.gb28181.idType = 0; + + this.$set(this.gb28181, "idType", 0); + this.$refs["gb28181"].resetFields(); + } + }); + getGb28181AreaList().then((rsp) => { + if (rsp && rsp.success) { + this.locationCity.provinceOptions = rsp.data; + } + }); + }, + submitGB28281() { + this.$refs["gb28181"].validate((valid) => { + if (valid) { + saveGB28181Config(this.gb28181).then((rsp) => { + if (rsp && rsp.success) { + console.log("1212112"); + this.$notify({ + type: "success", + message: "GB28181璁剧疆淇濆瓨鎴愬姛", + }); + } + }); + } else { + console.log("error submit!!"); + return false; + } + }); + }, + changeProvince() { + 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(); + } + }); + }, + changeCity() { + 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; + } + }); + }, + newGBID() { + let cCode = this.locationCity.county + ""; + newGb28181ID({ code: cCode }).then((rsp) => { + if (rsp && rsp.success) { + this.gb28181.PublicId = rsp.data; + } + }); + }, + }, +}; +</script> + +<style lang="scss" scoped > +.FormArea { + position: relative; + height: 565px; + .el-form { + padding: 20px; + padding-top: 34px; + + .el-form-item { + margin-bottom: 34px; + } + + .h32 { + border-radius: 3px; + + ::v-deep input { + border-radius: 3px; + border-color: #c0c5cc; + } + } + + .el-input { + width: 410px; + } + + .el-radio-group { + margin-bottom: 34px; + + ::v-deep .el-radio__label { + color: #3d3d3d; + } + } + + .selectItem ::v-deep { + .el-form-item__content { + display: flex; + + .el-select { + margin-right: 10px; + width: 200px; + } + + .button { + margin-left: 10px; + line-height: 32px; + color: #0065ff; + } + } + } + } + + .el-form-item.is-required { + ::v-deep .el-form-item__label:before { + display: none; + } + + ::v-deep .el-form-item__label::after { + content: "*"; + color: #f52323; + margin-right: 4px; + } + } + + .btnArea { + position: absolute; + left: 0; + right: 0; + bottom: 0; + padding: 20px 0; + border-top: 1px solid #e9ebee; + display: flex; + justify-content: end; + text-align: center; + + .cancel { + margin-right: 10px; + padding: 6px 16px; + border: 1px solid #0065ff; + color: #0065ff; + } + + .submit { + padding: 6px 16px; + border: 1px solid #0065ff; + color: #fff; + background-color: #0065ff; + } + } +} +</style> \ No newline at end of file diff --git a/src/views/GB28181/components/SettingBox.vue b/src/views/GB28181/components/SettingBox.vue new file mode 100644 index 0000000..0815666 --- /dev/null +++ b/src/views/GB28181/components/SettingBox.vue @@ -0,0 +1,115 @@ +<template> + <div class="SettingBox" :class="{ large: activeTab === 2 }"> + <div class="title">GB28181閰嶇疆</div> + <div class="close iconfont" @click="$emit('close')"></div> + <div class="content"> + <div class="tabs"> + <div + class="tab" + :class="{ active: activeTab === 0 }" + @click="activeTab = 0" + > + 鍥芥爣ID + </div> + <div + class="tab" + :class="{ active: activeTab === 1 }" + @click="activeTab = 1" + > + 鎺ュ叆骞冲彴鍒楄〃 + </div> + <div + class="tab" + :class="{ active: activeTab === 2 }" + @click="activeTab = 2" + > + 鍥芥爣鎽勫儚鏈� + </div> + </div> + + <FormArea @close="$emit('close')" v-if="activeTab === 0"></FormArea> + <TableArea v-if="activeTab === 1"></TableArea> + <TreeArea @close="$emit('close')" v-if="activeTab === 2"></TreeArea> + </div> + </div> +</template> + +<script> +import FormArea from "@/views/GB28181/components/FormArea"; +import TableArea from "@/views/GB28181/components/TableArea"; +import TreeArea from "@/views/GB28181/components/TreeArea"; + +export default { + components: { + FormArea, + TableArea, + TreeArea, + }, + data() { + return { + activeTab: 0, + }; + }, +}; +</script> + +<style lang="scss" scoped> +.SettingBox { + position: fixed; + top: 50%; + left: 50%; + margin-top: -354px; + margin-left: -500px; + width: 1000px; + height: 708px; + background-color: #fff; + box-shadow: 0px 2px 16px 0px rgba(0, 43, 106, 0.25); + z-index: 2; + + &.large { + margin-top: -477px; + margin-left: -719px; + width: 1438px; + height: 953px; + } + + .title { + box-sizing: border-box; + padding: 20px; + height: 64px; + border-bottom: 1px solid #e9ebee; + font-size: 18px; + font-weight: 700; + } + + .close { + position: absolute; + top: 20px; + right: 20px; + font-size: 12px; + color: #666; + cursor: pointer; + } + + .content { + padding: 20px; + + .tabs { + display: flex; + border-bottom: 1px solid #e9ebee; + + .tab { + transform: translateY(1px); + padding: 16px 24px; + cursor: pointer; + border-bottom: 2px solid rgba(255, 255, 255, 0); + + &.active { + border-color: #0065ff; + color: #0065ff; + } + } + } + } +} +</style> \ No newline at end of file diff --git a/src/views/GB28181/components/TableArea.vue b/src/views/GB28181/components/TableArea.vue new file mode 100644 index 0000000..3539206 --- /dev/null +++ b/src/views/GB28181/components/TableArea.vue @@ -0,0 +1,701 @@ +<template> + <div class="TableArea"> + <el-table + :data="subDevTable" + fit + highlight-current-row + style="width: 100%" + height="500" + > + <el-table-column + type="index" + label="搴忓彿" + align="center" + width="80" + ></el-table-column> + <el-table-column + prop="name" + label="鍚嶇О" + show-overflow-tooltip + ></el-table-column> + <el-table-column + prop="publicid" + label="ID" + show-overflow-tooltip + ></el-table-column> + <el-table-column prop="ip" label="IP"></el-table-column> + <el-table-column prop="status" label="鐘舵��" align="center"> + <template slot-scope="scope"> + <span :style="scope.row.alive ? `color:#36B24A` : 'color:#FF4B33;'">{{ + scope.row.alive ? "鍦ㄧ嚎" : "绂荤嚎" + }}</span> + </template> + </el-table-column> + <el-table-column prop="corp" label="澶囨敞"></el-table-column> + </el-table> + </div> +</template> + +<script> +import { getAllSubServer } from "@/api/Gb28181"; + +export default { + created() { + this.getList(); + }, + data() { + return { + subDevTable: [], + }; + }, + methods: { + async getList() { + console.log(12121); + // const res = await getAllSubServer(); + this.subDevTable = [ + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "218.11.13.177", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 15060, + publicid: "34020000002000000001", + username: "", + }, + { + alive: 1, + corp: "", + devmode: "gb28181", + ip: "192.168.5.53", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 5060, + publicid: "34020000001320000001", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "194.5.215.118", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 60783, + publicid: "1278", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "138.199.42.181", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 53998, + publicid: "2376", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "156.146.50.98", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 49420, + publicid: "2924", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "149.34.242.65", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 54724, + publicid: "3775", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "188.240.57.118", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 61962, + publicid: "4423", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "89.37.173.34", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 58343, + publicid: "4877", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "89.187.162.185", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 56095, + publicid: "391", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "62.197.145.4", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 60973, + publicid: "1872", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "45.134.212.244", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 55040, + publicid: "4379", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "194.33.40.115", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 51789, + publicid: "4923", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "91.219.215.52", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 52951, + publicid: "1885", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "185.99.3.103", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 60547, + publicid: "3377", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "213.152.165.107", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 62282, + publicid: "769", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "129.227.219.8", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 53877, + publicid: "1271", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "45.9.249.244", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 57637, + publicid: "3424", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "45.136.155.91", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 55749, + publicid: "2877", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "156.146.50.98", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 49162, + publicid: "2925", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "194.5.215.118", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 50858, + publicid: "1279", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "188.240.57.118", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 61692, + publicid: "4424", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "138.199.42.181", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 58970, + publicid: "2377", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "149.34.242.65", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 54856, + publicid: "3776", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "89.187.162.185", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 52956, + publicid: "392", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "194.33.40.115", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 64302, + publicid: "4924", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "45.134.212.244", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 63807, + publicid: "4380", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "91.219.215.52", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 64985, + publicid: "1886", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "45.9.249.244", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 57372, + publicid: "3425", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "213.152.165.107", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 49539, + publicid: "770", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "45.136.155.91", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 60032, + publicid: "2878", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "156.146.50.98", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 65234, + publicid: "2926", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "188.240.57.118", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 61386, + publicid: "4425", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "194.5.215.118", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 62886, + publicid: "1280", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "149.34.242.65", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 57416, + publicid: "3777", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "194.33.40.115", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 65530, + publicid: "4925", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "89.187.162.185", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 59341, + publicid: "393", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "45.134.212.244", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 49608, + publicid: "4381", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "91.219.215.52", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 62294, + publicid: "1887", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "45.9.249.244", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 57068, + publicid: "3426", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "213.152.165.107", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 61066, + publicid: "771", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "156.146.50.98", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 64946, + publicid: "2927", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "188.240.57.118", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 61133, + publicid: "4426", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "194.5.215.118", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 63212, + publicid: "1281", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "194.33.40.115", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 56324, + publicid: "4926", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "149.34.242.65", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 50517, + publicid: "3778", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "45.134.212.244", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 52108, + publicid: "4382", + username: "", + }, + { + alive: 0, + corp: "", + devmode: "gb28181", + ip: "45.9.249.244", + name: "", + parentid: "11011400011121000001", + passwd: "", + port: 56708, + publicid: "3427", + username: "", + }, + { + alive: 0, + corp: "GBT28181", + devmode: "gb28181", + ip: "192.168.5.56", + name: "Camera 01", + parentid: "11011400011121000001", + passwd: "", + port: 5060, + publicid: "44122500041325000002", + username: "", + }, + ]; + }, + }, +}; +</script> + +<style lang="scss" scoped > +.TableArea { + padding: 30px 0; + .el-table ::v-deep { + background-color: rgb(233, 235, 238); + padding: 1px; + + &::after { + display: none; + } + + td.index .cell { + padding-left: 16px; + padding-right: 4px; + } + + .has-gutter tr th { + background: #f0f3f5; + font-size: 16px; + color: #3d3d3d; + font-weight: 700; + } + + td .cell { + color: #3d3d3d; + } + + tr:hover > td.el-table__cell { + background-color: #fff; + } + + .el-table__row--striped .el-table__cell { + background-color: #f0f5fa !important; + } + tr:hover > td.el-table__cell { + background-color: #fff; + } + + .el-table__row--striped .el-table__cell { + background-color: #f0f5fa !important; + } + + .status { + color: #ff4b33; + + &.green { + color: #36b24a; + } + } + + .option { + margin-right: 10px; + font-size: 24px; + color: rgb(0, 101, 255); + cursor: pointer; + + &.disable { + color: #666; + cursor: default; + } + } + } +} +</style> \ No newline at end of file diff --git a/src/views/GB28181/components/TreeArea.vue b/src/views/GB28181/components/TreeArea.vue new file mode 100644 index 0000000..f9382c7 --- /dev/null +++ b/src/views/GB28181/components/TreeArea.vue @@ -0,0 +1,299 @@ +<template> + <div class="TreeArea"> + <div class="refresh"> + <div class="button" @click="updateCamerasFromVideosvr">鍒锋柊</div> + 鍗曞彴璁惧鏈�澶ф敮鎸侀厤缃�500璺憚鍍忔満锛岄泦缇ゆ渶澶ф敮鎸侀厤缃矾鏁�=闆嗙兢鍐呰澶囨�婚噺*500 + </div> + + <div class="tree-container"> + <div class="tree-box"> + <div class="camera-title"> + <b>鍥芥爣鎽勫儚鏈�</b> + </div> + <tree-menu + ref="ztree" + app="gb28181" + treeName="localTree" + clickType="multiple" + :node="TreeDataPool.treeData" + :height="600" + :setting="treeSettings" + @itemChecked="onItemCheck" + search + style="width: 450px; min-height: 600px" + /> + </div> + + <div class="tree-box"> + <div class="camera-title"> + <b>宸查�夋憚鍍忔満</b> + <span class="des" + >(鏈�澶氬嬀閫�<span class="number">500</span>璺憚鍍忔満)</span + > + </div> + <div class="select-tree-menu" :style="`max-height:${600}px;`"> + <z-tree + :nodes="dstTreeData" + :show-checkbox="false" + :gb28181="true" + search + /> + </div> + </div> + + <div class="base-image" v-loading="TreeDataPool.baseImageLoading"> + <span class="base-title">{{ + TreeDataPool.cameraNameForBaseImage + }}</span> + <div + class="camera-image" + v-show="TreeDataPool.cameraNameForBaseImage.length" + > + <img + :src=" + 'data:image/png;base64,' + TreeDataPool.gb28181CameraBaseImage + " + width="450px" + alt + /> + </div> + </div> + </div> + + <div class="btnArea"> + <div class="button cancel" @click="$emit('close')">鍙栨秷</div> + <div class="button submit" @click="saveChecked">淇濆瓨</div> + </div> + </div> +</template> + +<script> +import { saveGb28181CamTree } from "@/api/Gb28181"; +import TreeMenu from "@/components/giantTree/index"; +import ZTree from "@/components/giantTree/zTree/ztree"; + +export default { + components: { + TreeMenu, + ZTree, + }, + data() { + return { + treeSettings: { + check: { + enable: true, + }, + }, + treeSettingsSelect: { + check: { + enable: false, + }, + }, + dstTreeData: [], + loading: null, + }; + }, + mounted() { + this.TreeDataPool.multiple = true; + // 璁板綍鐩綍鏄惁鎶樺彔 + let foldList = localStorage.getItem("ztree_fold_list"); + if (foldList) { + this.TreeDataPool.foldNodeList = JSON.parse(foldList); + } + this.getCamerasFromVideosvr(); + }, + methods: { + async updateCamerasFromVideosvr() { + this.loading = true; + await this.TreeDataPool.fetchVideosvrCameras(true); + this.loading = false; + }, + async getCamerasFromVideosvr() { + this.loading = this.$loading({ + lock: true, + text: "Loading", + spinner: "el-icon-loading", + background: "rgba(0, 0, 0, 0.7)", + }); + await this.TreeDataPool.fetchVideosvrCameras(false); + this.dstTreeData = this.TreeDataPool.newTreeByChecked( + this.TreeDataPool.treeData + ); + this.loading.close(); + }, + onItemCheck() { + console.log(this.TreeDataPool.activeTreeData); + this.dstTreeData = this.TreeDataPool.newTreeByChecked( + this.TreeDataPool.activeTreeData + ); + }, + saveChecked() { + localStorage.setItem( + "ztree_fold_list", + JSON.stringify(this.TreeDataPool.foldNodeList) + ); + + if (this.TreeDataPool.gb28181CheckedCount > 500) { + this.$message({ + type: "warning", + message: "鏈�澶氫粎鏀寔閫夋嫨500璺憚鍍忔満. 璇烽噸鏂伴�夋嫨", + }); + + return; + } + + this.loading = true; + + let treeData = this.TreeDataPool.newTreeByChecked( + this.TreeDataPool.activeTreeData + ); + + saveGb28181CamTree({ checkedMenus: treeData }) + .then((rsp) => { + if (rsp && rsp.success) { + this.$message({ + type: "success", + message: "淇濆瓨鎴愬姛", + }); + } + this.loading = false; + }) + .catch((err) => { + this.$message({ + type: "error", + message: "淇濆瓨澶辫触", + }); + this.loading = false; + }); + }, + }, +}; +</script> + +<style lang="scss" scoped > +.TreeArea { + position: relative; + height: 780px; + .refresh { + margin-top: 32px; + margin-bottom: 20px; + display: flex; + align-items: center; + font-size: 12px; + color: #666666; + + .button { + margin-right: 10px; + padding: 6px 16px; + border: 1px solid #0065ff; + color: #fff; + background-color: #0065ff; + font-size: 14px; + } + } + + .tree-container { + display: flex; + .tree-box { + width: 450px; + margin: 5px 20px 0px 0px; + border: 1px solid #c0c5cc; + + .camera-title { + text-align: left; + padding: 0px 10px; + margin: 0px 0px; + height: 40px; + background-color: #f0f5fa; + line-height: 40px; + font-size: 14px; + font-weight: 700; + border-bottom: 1px solid #c0c5cc; + + .des { + margin-left: 10px; + color: #666666; + font-size: 12px; + } + + .number { + color: #0065ff; + } + } + } + + .base-image { + width: 450px; + height: 300px; + + .base-title { + text-align: left; + font-size: 14px; + } + + .camera-image { + margin-top: 10px; + background-color: black; + height: 254px; + } + } + .select-tree-menu { + // max-width: 350px; + overflow-x: hidden; + overflow-y: hidden; + margin-bottom: 4px; + } + .select-tree-menu::-webkit-scrollbar { + /*婊氬姩鏉℃暣浣撴牱寮�*/ + width: 4px; /*楂樺鍒嗗埆瀵瑰簲妯珫婊氬姩鏉$殑灏哄*/ + height: 4px; + } + .select-tree-menu::-webkit-scrollbar-thumb { + /*婊氬姩鏉¢噷闈㈠皬鏂瑰潡*/ + border-radius: 5px; + -webkit-box-shadow: inset 0 0 5px rgba(157, 165, 183, 0); + background: rgb(202, 201, 201); + } + .select-tree-menu::-webkit-scrollbar-track { + /*婊氬姩鏉¢噷闈㈣建閬�*/ + -webkit-box-shadow: inset 0 0 5px rgba(157, 165, 183, 0); + border-radius: 0; + background: rgb(235, 234, 234); + } + .select-tree-menu::-webkit-scrollbar-thumb:hover { + background: rgba(0, 0, 0, 0.4); + } + .select-tree-menu:hover { + overflow-x: visible; + overflow-y: auto; + margin-bottom: 0px; + } + } + + .btnArea { + position: absolute; + left: 0; + right: 0; + bottom: 0; + padding: 20px 0; + border-top: 1px solid #e9ebee; + display: flex; + justify-content: end; + text-align: center; + + .cancel { + margin-right: 10px; + padding: 6px 16px; + border: 1px solid #0065ff; + color: #0065ff; + } + + .submit { + padding: 6px 16px; + border: 1px solid #0065ff; + color: #fff; + background-color: #0065ff; + } + } +} +</style> \ No newline at end of file diff --git a/src/views/GB28181/index.vue b/src/views/GB28181/index.vue new file mode 100644 index 0000000..120d3d2 --- /dev/null +++ b/src/views/GB28181/index.vue @@ -0,0 +1,59 @@ +<template> + <div class="GB28181"> + <!-- 椤靛ご --> + <IndexHeader :opacity="false"></IndexHeader> + <!-- 闈㈠寘灞� --> + <div class="heart"> + <el-breadcrumb separator=">"> + <el-breadcrumb-item :to="{ path: '/manageCenter' }" + >绠$悊涓績</el-breadcrumb-item + > + <el-breadcrumb-item>GB28181閰嶇疆</el-breadcrumb-item> + </el-breadcrumb> + </div> + + <!-- 涓昏鍐呭 --> + <DevList></DevList> + + <!-- 椤靛熬 --> + <Footer :isBlack="true"></Footer> + </div> +</template> + +<script> +import IndexHeader from "@/components/IndexHeader"; +import DevList from "@/views/GB28181/components/DevList"; +import Footer from "@/components/Footer"; + +export default { + components: { + IndexHeader, + DevList, + Footer, + }, +}; +</script> + +<style lang="scss" scoped> +.GB28181 { + background-color: rgb(243, 245, 248); + position: relative; + min-height: 100vh; + + .el-breadcrumb { + margin-top: 48px; + margin-bottom: 24px; + + ::v-deep span { + color: #666; + } + } + + .Footer { + position: absolute; + left: 0; + right: 0; + bottom: 0; + } +} +</style> \ No newline at end of file diff --git a/src/views/equipmentManagement/algorithmDetail/index.vue b/src/views/equipmentManagement/algorithmDetail/index.vue index af52910..2f4f5d2 100644 --- a/src/views/equipmentManagement/algorithmDetail/index.vue +++ b/src/views/equipmentManagement/algorithmDetail/index.vue @@ -121,7 +121,7 @@ { label: "绠楁硶鎬绘暟", count: "", - img: "/images/equipmentManagement/绠楁硶.png", + img: "/images/equipmentManagement/sdk.png", }, { label: "搴旂敤鎬绘暟", @@ -132,12 +132,12 @@ { label: "寰呭崌绾х畻娉�", count: "", - img: "/images/equipmentManagement/绠楁硶_鍗囩骇.png", + img: "/images/equipmentManagement/upgrade.png", }, { label: "寰呭崌绾у簲鐢�", count: "", - img: "/images/equipmentManagement/搴旂敤_绾鍗囩骇.png", + img: "/images/equipmentManagement/app_upgrade.png", color: "red", }, ], //搴旂敤淇℃伅 diff --git a/src/views/equipmentManagement/components/Flow.vue b/src/views/equipmentManagement/components/Flow.vue index 0968ece..f42eca6 100644 --- a/src/views/equipmentManagement/components/Flow.vue +++ b/src/views/equipmentManagement/components/Flow.vue @@ -17,15 +17,15 @@ return { flowList: [ { - img: "/images/equipmentManagement/寮�閫氳澶囩鐞�.png", + img: "/images/equipmentManagement/open.png", title: "寮�閫氳澶囩鐞�", }, - { img: "/images/equipmentManagement/娣诲姞璁惧.png", title: "娣诲姞璁惧" }, + { img: "/images/equipmentManagement/add.png", title: "娣诲姞璁惧" }, { - img: "/images/equipmentManagement/璁惧缁存姢+璁剧疆.png", + img: "/images/equipmentManagement/setting.png", title: "璁惧缁存姢+璁剧疆", }, - { img: "/images/equipmentManagement/璁惧鐩戞帶.png", title: "璁惧鐩戞帶" }, + { img: "/images/equipmentManagement/watch.png", title: "璁惧鐩戞帶" }, ], }; }, diff --git a/src/views/equipmentManagement/equipmentList/components/Content.vue b/src/views/equipmentManagement/equipmentList/components/Content.vue index f3ef7b6..e3bde8d 100644 --- a/src/views/equipmentManagement/equipmentList/components/Content.vue +++ b/src/views/equipmentManagement/equipmentList/components/Content.vue @@ -5,14 +5,14 @@ <!-- 鍏ㄥ睆鎸夐挳 --> <img class="zoomOut iconfont" - src="/images/equipmentManagement/鍏ㄥ睆.png" + src="/images/equipmentManagement/full.png" @click="toggleZoom('Full')" v-if="!isFull" /> <!-- 鍙栨秷鍏ㄥ睆鐨勬寜閽� --> <img class="zoomOut iconfont" - src="/images/equipmentManagement/閫�鍑哄叏灞�.png" + src="/images/equipmentManagement/quit.png" @click="toggleZoom('')" v-else /> @@ -117,8 +117,8 @@ let markerContent = "" + `<div class="nodeMarker" id="node${index}}">` + - '<img class="normal" src="/images/equipmentManagement/璁惧榛樿.png">' + - '<img class="selected" src="/images/equipmentManagement/璁惧閫変腑.png">' + + '<img class="normal" src="/images/equipmentManagement/default.png">' + + '<img class="selected" src="/images/equipmentManagement/select.png">' + `<div class="box"> <div class="name">${item.devName}</div> <div class="property">IP鍦板潃: <span class="data">${item.devIp}</span> </div> <div class="property">璁惧浣嶇疆: <span class="data">${item.province}</span></div><div class="property">瀹夎鏃堕棿: <span class="data">${item.installTime}</span></div></div>`; ("</div>"); diff --git a/src/views/equipmentManagement/equipmentList/components/FormList.vue b/src/views/equipmentManagement/equipmentList/components/FormList.vue index dda4626..ba5dcab 100644 --- a/src/views/equipmentManagement/equipmentList/components/FormList.vue +++ b/src/views/equipmentManagement/equipmentList/components/FormList.vue @@ -219,10 +219,7 @@ }, data() { return { - searchTime: [ - this.$moment().format("YYYY-MM-DD 00:00:00"), - this.$moment().format("YYYY-MM-DD HH:mm:ss"), - ], //鎼滅储鏃堕棿 + searchTime: [], //鎼滅储鏃堕棿 page: 1, size: 10, //鍒嗛〉鐩稿叧 inputText: "", //杈撳叆妗嗗唴瀹� @@ -454,7 +451,6 @@ }, }, mounted() { - this.searchTime = this.getDateInit(); this.searchingBtn(); }, }; diff --git a/src/views/hashrate/AlgManage/index.vue b/src/views/hashrate/AlgManage/index.vue index 3053435..1edfacd 100644 --- a/src/views/hashrate/AlgManage/index.vue +++ b/src/views/hashrate/AlgManage/index.vue @@ -73,7 +73,7 @@ class="empty" v-if="item.sdkList && item.sdkList.length === 0 && !dragAlg" > - <img src="/images/hashrate/绠楁硶绠$悊绌洪〉闈�.png" alt="" /> + <img src="/images/hashrate/sdkEmpty.png" alt="" /> <div class="des"> 鏆傛湭瀹夎绠楁硶锛屼粠宸︿晶绠楁硶涓績绠楁硶鍒版澶勶紝鍗冲彲瀹夎 </div> diff --git a/src/views/hashrate/CameraManage/CameraInfo/components/CameraInfoEditor.vue b/src/views/hashrate/CameraManage/CameraInfo/components/CameraInfoEditor.vue index 372097b..3c73e5b 100644 --- a/src/views/hashrate/CameraManage/CameraInfo/components/CameraInfoEditor.vue +++ b/src/views/hashrate/CameraManage/CameraInfo/components/CameraInfoEditor.vue @@ -10,7 +10,7 @@ <div class="sub-task-rules-box"> <div class="task-blank" v-show="groupRules.length == 0"> - <img src="/images/hashrate/鎽勫儚鏈虹┖椤甸潰.png" alt="" /> + <img src="/images/hashrate/c_empty.png" alt="" /> <div class="des">鏆傛棤浼犳劅鍣紝璇烽�夋嫨鏂板</div> </div> <div diff --git a/src/views/hashrate/CameraManage/CameraInfo/index.vue b/src/views/hashrate/CameraManage/CameraInfo/index.vue index e4f2bdd..76926e1 100644 --- a/src/views/hashrate/CameraManage/CameraInfo/index.vue +++ b/src/views/hashrate/CameraManage/CameraInfo/index.vue @@ -146,7 +146,7 @@ <div class="title">绠楀姏淇℃伅</div> <div class="hashrate"> <div class="card"> - <img src="/images/hashrate/瀹炴椂绠楀姏.png" alt="" /> + <img src="/images/hashrate/realTime2.png" alt="" /> <div class="data"> <div class="label">瀹炴椂绠楀姏</div> <div class="number"> @@ -157,7 +157,7 @@ </div> <div class="card"> - <img src="/images/hashrate/杞绠楀姏.png" alt="" /> + <img src="/images/hashrate/polling.png" alt="" /> <div class="data"> <div class="label">杞绠楀姏</div> <div class="number"> @@ -168,7 +168,7 @@ </div> <div class="card"> - <img src="/images/hashrate/鏁版嵁鏍堢畻鍔�.png" alt="" /> + <img src="/images/hashrate/static.png" alt="" /> <div class="data"> <div class="label">鏁版嵁鏍堢畻鍔�</div> <div class="number"> diff --git a/src/views/hashrate/CameraManage/CameraRules/components/RuleItem.vue b/src/views/hashrate/CameraManage/CameraRules/components/RuleItem.vue index f42c334..5134cbc 100644 --- a/src/views/hashrate/CameraManage/CameraRules/components/RuleItem.vue +++ b/src/views/hashrate/CameraManage/CameraRules/components/RuleItem.vue @@ -78,7 +78,7 @@ </template> <div class="empty" @dragover="dragover($event)" @drop="drop" v-else> - <img src="/images/hashrate/鏈厤缃畻娉曠┖椤甸潰.png" alt="" /> + <img src="/images/hashrate/unSdk.png" alt="" /> <div class="des"> 鏆傛湭閰嶇疆绛栫暐锛岀偣鍑讳笂鏂规搷浣滈潰鏉挎寜閽紝浠庢搷浣滈潰鏉挎嫋鍔ㄧ畻娉曞埌姝ゅ锛屽嵆鍙厤缃� </div> diff --git a/src/views/hashrate/CameraManage/CameraRules/index.vue b/src/views/hashrate/CameraManage/CameraRules/index.vue index f951851..4bf132f 100644 --- a/src/views/hashrate/CameraManage/CameraRules/index.vue +++ b/src/views/hashrate/CameraManage/CameraRules/index.vue @@ -159,7 +159,7 @@ </template> <div class="empty" v-else> - <img src="/images/hashrate/鐙珛鍦烘櫙绌洪〉闈�.png" alt="" /> + <img src="/images/hashrate/s_empty.png" alt="" /> <div class="des">鏆傛棤鐙珛鍦烘櫙</div> </div> </div> @@ -204,7 +204,7 @@ class="empty" v-if="linkageRule.length <= 0 && !TreeDataPool.multiple" > - <img src="/images/hashrate/鑱斿姩鍦烘櫙绌洪〉闈�.png" alt="" /> + <img src="/images/hashrate/l_empty.png" alt="" /> <div class="des">鏆傛棤鑱斿姩鍦烘櫙</div> </div> @@ -218,7 +218,7 @@ ></LinkageCameraBox> <div class="empty"> - <img src="/images/hashrate/鑱斿姩鍦烘櫙绌洪〉闈�.png" alt="" /> + <img src="/images/hashrate/l_empty.png" alt="" /> <div class="des">鏆傛棤鑱斿姩鍦烘櫙</div> </div> </div> diff --git a/src/views/hashrate/HashManage/components/ClusterCard.vue b/src/views/hashrate/HashManage/components/ClusterCard.vue index f7ed1fe..02a8764 100644 --- a/src/views/hashrate/HashManage/components/ClusterCard.vue +++ b/src/views/hashrate/HashManage/components/ClusterCard.vue @@ -2,7 +2,7 @@ <div class="ClusterCard"> <div class="cardHeader"> <img v-if="info.type == 1" src="/images/hashrate/闆嗙兢.png" alt="" /> - <img v-else src="/images/hashrate/璁惧.png" alt="" /> + <img v-else src="/images/hashrate/equipment.png" alt="" /> <div class="info"> <div class="name">{{ info.name }}</div> @@ -14,7 +14,7 @@ <div class="cardFooter"> <div class="hashrate"> <div class="label"> - <img src="/images/hashrate/瀹炴椂绠楀姏.png" alt="" /> + <img src="/images/hashrate/realTime2.png" alt="" /> 瀹炴椂绠楀姏 </div> <div class="data"> @@ -25,7 +25,7 @@ <div class="hashrate"> <div class="label"> - <img src="/images/hashrate/杞绠楀姏.png" alt="" /> + <img src="/images/hashrate/polling.png" alt="" /> 杞绠楀姏 </div> <div class="data"> @@ -36,7 +36,7 @@ <div class="hashrate"> <div class="label"> - <img src="/images/hashrate/鏁版嵁鏍堢畻鍔�.png" alt="" /> + <img src="/images/hashrate/static.png" alt="" /> 鏁版嵁鏍堢畻鍔� </div> <div class="data"> diff --git a/src/views/hashrate/HashManage/components/HashCard.vue b/src/views/hashrate/HashManage/components/HashCard.vue index cb0fcd5..5a54f1f 100644 --- a/src/views/hashrate/HashManage/components/HashCard.vue +++ b/src/views/hashrate/HashManage/components/HashCard.vue @@ -1,9 +1,9 @@ <template> <div class="HashCard"> <div class="hashrate"> - <img v-if="type == 0" src="/images/hashrate/杞绠楀姏.png" alt="" /> - <img v-if="type == 1" src="/images/hashrate/瀹炴椂绠楀姏.png" alt="" /> - <img v-if="type == 2" src="/images/hashrate/鏁版嵁鏍堢畻鍔�.png" alt="" /> + <img v-if="type == 0" src="/images/hashrate/polling.png" alt="" /> + <img v-if="type == 1" src="/images/hashrate/realTime2.png" alt="" /> + <img v-if="type == 2" src="/images/hashrate/static.png" alt="" /> <div class="hashrateContent"> <div class="label" v-if="type == 0">杞绠楀姏</div> <div class="label" v-if="type == 1">瀹炴椂绠楀姏</div> diff --git a/src/views/hashrate/HashManage/index.vue b/src/views/hashrate/HashManage/index.vue index c3d84ef..b26e003 100644 --- a/src/views/hashrate/HashManage/index.vue +++ b/src/views/hashrate/HashManage/index.vue @@ -5,7 +5,7 @@ <!-- 鎬荤畻鍔� --> <div class="card"> <div class="hashrate"> - <img src="/images/hashrate/鎬荤畻鍔�.png" alt="" /> + <img src="/images/hashrate/total.png" alt="" /> <div class="hashrateContent"> <div class="label">鎬荤畻鍔�</div> <div class="data"> diff --git a/src/views/hashrate/components/Flow.vue b/src/views/hashrate/components/Flow.vue index 1639223..61e3322 100644 --- a/src/views/hashrate/components/Flow.vue +++ b/src/views/hashrate/components/Flow.vue @@ -17,16 +17,16 @@ return { flowList: [ { - img: "/images/hashrate/1銆佸紑閫氱畻鍔涚鐞�.png", + img: "/images/hashrate/openSdk.png", title: "寮�閫氱畻鍔涚鐞�", }, - { img: "/images/hashrate/2銆佺畻娉曟壒閲忓畨瑁�.png", title: "绠楁硶鎵归噺瀹夎" }, + { img: "/images/hashrate/installSdk.png", title: "绠楁硶鎵归噺瀹夎" }, { - img: "/images/hashrate/3銆佷换鍔″満鏅厤缃�.png", + img: "/images/hashrate/setRule.png", title: "浠诲姟鍦烘櫙閰嶇疆", }, { - img: "/images/hashrate/4銆佽澶囨�ц兘瀹炴椂鐩戞帶.png", + img: "/images/hashrate/realtime.png", title: "璁惧鎬ц兘瀹炴椂鐩戞帶", }, ], diff --git a/src/views/index/components/banner.vue b/src/views/index/components/banner.vue index 2262857..b2c8337 100644 --- a/src/views/index/components/banner.vue +++ b/src/views/index/components/banner.vue @@ -1,12 +1,6 @@ <template> <div class="banner"> - <el-carousel - trigger="click" - height="546px" - :autoplay="false" - arrow="never" - ref="banner" - > + <el-carousel trigger="click" :autoplay="false" arrow="never" ref="banner"> <el-carousel-item v-for="(item, index) in bannerList" :key="index"> <div class="banner_content" @@ -17,7 +11,7 @@ backgroundRepeat: 'no-repeat', }" > - <div class="banner_text" v-html="item.name"></div> + <!-- <div class="banner_text" v-html="item.name"></div> --> </div> <div class="link"></div> </el-carousel-item> @@ -49,7 +43,7 @@ } var reg = /^[0-9]/; if (reg.test(url)) { - result = "http://" + url; + result = "/httpImage/" + url; return result; } @@ -62,17 +56,27 @@ <style lang="scss" scoped> .banner { position: relative; - height: 546px; + height: 28.18vw; + min-height: 369px; width: 100%; min-width: 1280px; z-index: -1; top: -62px; + + .el-carousel ::v-deep { + height: 100%; + + .el-carousel__container { + height: 100%; + } + } + .banner_content { height: 100%; - padding: 183px 0 0 0; - + overflow: hidden; .banner_text { margin: 0 auto; + margin-top: 183px; width: 1280px; color: #fff; } diff --git a/src/views/index/components/productLeft.vue b/src/views/index/components/productLeft.vue index 1f1a4b7..e1c213e 100644 --- a/src/views/index/components/productLeft.vue +++ b/src/views/index/components/productLeft.vue @@ -2,7 +2,7 @@ <div class="productLeft" :style="{ - background: ` url(${data.pic})`, + background: ` url(${pic})`, backgroundSize: '100% 100%', backgroundRepeat: 'no-repeat', }" @@ -31,9 +31,10 @@ created() { var reg = /^[0-9]/; if (reg.test(this.data.pic)) { - this.pic = "http://" + this.data.pic; + this.pic = "/httpImage/" + this.data.pic; + } else { + this.pic = this.data.pic; } - this.pic = this.data.pic; }, data() { return { diff --git a/src/views/index/components/rightForm.vue b/src/views/index/components/rightForm.vue index ae78fe6..0d4744c 100644 --- a/src/views/index/components/rightForm.vue +++ b/src/views/index/components/rightForm.vue @@ -207,7 +207,7 @@ right: -1px; width: 24px; height: 30px; - background: url("/images/index/鎵撴姌鏍囩.png"); + background: url("/images/index/cut.png"); font-size: 12px; line-height: 30px; color: #fff; diff --git a/src/views/index/components/userCard.vue b/src/views/index/components/userCard.vue index 1ac012f..144051e 100644 --- a/src/views/index/components/userCard.vue +++ b/src/views/index/components/userCard.vue @@ -1,7 +1,7 @@ <template> <div class="userCard"> <div class="profile"> - <img src="/images/index/榛樿澶村儚-01.png" alt="" /> + <img src="/images/index/default.png" alt="" /> </div> <div class="notification" v-if="!userInfo"> Hi!璇� @@ -11,7 +11,7 @@ >娉ㄥ唽</span > </div> - <div class="des" v-if="!userInfo">鐧诲綍鍚庢煡鐪嬩釜浜哄伐鍏锋爮</div> + <div class="des" v-if="!userInfo">娆㈣繋鏉ュ埌璐濇�濈宸ヤ笟浜掕仈缃戝钩鍙�</div> <div class="userName" v-else>{{ userInfo.username }}</div> <div class="bottom"> <div class="bottomItem" v-for="(item, index) in userCardArr" :key="index"> diff --git a/src/views/index/index.vue b/src/views/index/index.vue index 2157312..5556fe2 100644 --- a/src/views/index/index.vue +++ b/src/views/index/index.vue @@ -8,18 +8,20 @@ <div class="bannerLink" @click="jump"></div> <!-- 杞挱鍥炬帶鍒跺櫒 --> - <ul class="bannerControl"> - <li - v-for="(item, index) in bannerList" - :key="index" - @click="toggleBanner(index)" - > - <button - class="inner" - :class="{ active: activeBanner == index }" - ></button> - </li> - </ul> + <div class="bannerControl"> + <ul> + <li + v-for="(item, index) in bannerList" + :key="index" + @click="toggleBanner(index)" + > + <button + class="inner" + :class="{ active: activeBanner == index }" + ></button> + </li> + </ul> + </div> <div class="overCard"> <div class="heart"> @@ -39,7 +41,7 @@ :class="{ active: activeCommend === 3 }" @click="selecTab(3)" > - <img src="/images/index/绠楁硶.png" alt="" /> + <img src="/images/index/sdk.png" alt="" /> <div class="label">绠楁硶</div> </div> @@ -48,7 +50,7 @@ :class="{ active: activeCommend === 4 }" @click="selecTab(4)" > - <img src="/images/index/搴旂敤.png" alt="" /> + <img src="/images/index/app.png" alt="" /> <div class="label">搴旂敤</div> </div> </div> @@ -143,19 +145,19 @@ return { commendCardData: [ { - img: "/images/index/鍏ㄦ皯浜戣绠�.png", + img: "/images/index/compute.png", title: "鍏ㄦ皯浜戣绠�", - des: "浜戞湇鍔$壒鎯狅紝闄愭椂3鎶樿捣锛屼綆鑷�659鍏�/3骞�", + des: "浜戞湇鍔$壒鎯狅紝闄愭椂3鎶樿捣", router: "/", }, { - img: "/images/index/鍞墠鍜ㄨ.png", + img: "/images/index/beforeSell.png", title: "鍞墠鍜ㄨ", des: "鑷寸數0315-2233066锛岄鍙栨偍鐨勪笓灞炴潈鐩�", router: "/", }, { - img: "/images/index/璇曠敤涓績.png", + img: "/images/index/trialCenter.png", title: "璇曠敤涓績", des: "绠楁硶鍏嶈垂璇曠敤锛屼负鎮ㄦ彁渚� 0 闂ㄦ瀹炶返鏈轰細", router: "/trialCenter", @@ -170,7 +172,7 @@ { router: "/", typeId: 1, - pic: "/images/index/浜戞湇鍔�.png", + pic: "/images/index/modelbgc2.png", name: "浜戞湇鍔�", desc: "涓�閿喘涔帮紝寮�鍚疉I搴旂敤涔嬫梾", product: { @@ -210,7 +212,7 @@ { router: "/", typeId: 2, - pic: "/images/index/杈圭紭璁$畻璁惧.png", + pic: "/images/index/modelbgc.png", name: "杈圭紭璁$畻璁惧", desc: "涓�绉嶉儴缃插湪杩戝満渚х殑楂樺彲鐢ㄧ殑杞‖涓�浣撲骇鍝侊紝鎻愬崌搴旂敤绋嬪簭鐨勫揩閫熷搷搴旇兘鍔涖�佽妭鐪佸甫瀹芥祦閲忔垚鏈�", @@ -238,7 +240,7 @@ ], }, ], - img: "/images/index/璁惧鍥�.png", + img: "/images/index/equipment.png", }, { name: "杈圭紭璁$畻璁惧2", @@ -263,7 +265,7 @@ ], }, ], - img: "/images/index/璁惧鍥�.png", + img: "/images/index/equipment.png", }, { name: "杈圭紭璁$畻璁惧3", @@ -288,7 +290,7 @@ ], }, ], - img: "/images/index/璁惧鍥�.png", + img: "/images/index/equipment.png", }, { name: "杈圭紭璁$畻璁惧4", @@ -313,7 +315,7 @@ ], }, ], - img: "/images/index/璁惧鍥�.png", + img: "/images/index/equipment.png", }, { name: "杈圭紭璁$畻璁惧5", @@ -338,7 +340,7 @@ ], }, ], - img: "/images/index/璁惧鍥�.png", + img: "/images/index/equipment.png", }, { name: "杈圭紭璁$畻璁惧6", @@ -363,7 +365,7 @@ ], }, ], - img: "/images/index/璁惧鍥�.png", + img: "/images/index/equipment.png", }, ], }, @@ -406,7 +408,9 @@ }, //杞挱鍥捐烦杞繛鎺� jump() { - window.open(this.bannerList[this.activeBanner - 1].url); + if (this.bannerList[this.activeBanner].url) { + window.open(this.bannerList[this.activeBanner].url); + } }, //鑾峰彇鎺ㄨ崘鍒楄〃 async getRecommend() { @@ -449,14 +453,22 @@ .bannerControl { position: absolute; width: 1280px; - height: 24px; + height: calc(28.18vw - 92px); + min-height: 278px; bottom: 80px; - top: 462px; + top: 62px; left: 0; right: 0; transform: none; margin: 0 auto; z-index: 2; + + ul { + position: absolute; + bottom: 0; + right: 0; + left: 0; + } li { display: inline-block; @@ -489,16 +501,24 @@ top: 60px; position: absolute; width: 100%; - height: 410px; + height: calc(28.18vw - 132px); + min-height: 236px; cursor: pointer; + z-index: 3; } .overCard { position: absolute; - top: 394px; + height: calc(28.18vw + 38px); + min-height: 408px; width: 100%; + top: 62px; .heart { + position: absolute; + bottom: 0; + left: 0; + right: 0; display: flex; width: 1280px; margin: 0 auto; @@ -558,7 +578,7 @@ } .product { - background: url("/images/index/鑳屾櫙.png"); + background: url("/images/index/background.png"); overflow: hidden; min-width: 1280px; diff --git a/src/views/login/components/loginForm.vue b/src/views/login/components/loginForm.vue index b334c4b..0c01ae7 100644 --- a/src/views/login/components/loginForm.vue +++ b/src/views/login/components/loginForm.vue @@ -378,7 +378,7 @@ width: 660px; height: 454px; left: 240px; - top: 313px; + top: 25vh; box-sizing: border-box; background-color: #fff; diff --git a/src/views/login/index.vue b/src/views/login/index.vue index e759d6c..1d20482 100644 --- a/src/views/login/index.vue +++ b/src/views/login/index.vue @@ -25,7 +25,7 @@ height: 100%; width: 100%; min-width: 1280px; - background: url("/images/login/鐧诲綍椤�.png"); + background: url("/images/login/background.png"); background-size: 100% 100%; font-size: 14px; @@ -39,7 +39,7 @@ .Footer { position: absolute; - bottom: 0; + top: calc(100% - 100px); width: 100%; } } diff --git a/src/views/manageCenter/index.vue b/src/views/manageCenter/index.vue index 5242a6c..62667e4 100644 --- a/src/views/manageCenter/index.vue +++ b/src/views/manageCenter/index.vue @@ -35,7 +35,7 @@ <div class="upIcon iconfont"> 2</div> </div> - <img src="/images/manageCenter/浠诲姟鎬绘暟.png" alt="" /> + <img src="/images/manageCenter/total2.png" alt="" /> </div> <div class="equipmentCard"> @@ -45,7 +45,7 @@ <div class="upIcon iconfont"> 2</div> </div> - <img src="/images/manageCenter/鎽勫儚鏈烘�绘暟.png" alt="" /> + <img src="/images/manageCenter/total3.png" alt="" /> </div> <div class="equipmentCard"> @@ -55,7 +55,7 @@ <div class="downIcon iconfont"> 2</div> </div> - <img src="/images/manageCenter/绠楁硶鎬绘暟.png" alt="" /> + <img src="/images/manageCenter/total4.png" alt="" /> </div> <div class="equipmentCard"> @@ -65,7 +65,7 @@ <div class="downIcon iconfont"> 2</div> </div> - <img src="/images/manageCenter/浠诲姟鎬绘暟.png" alt="" /> + <img src="/images/manageCenter/total1.png" alt="" /> </div> </div> @@ -269,7 +269,7 @@ productList: [ { name: "璁惧绠$悊", - icon: "/images/manageCenter/璁惧绠$悊.png", + icon: "/images/manageCenter/manage.png", openPath: "/equipmentManagement", path: "/equipmentList", permission: "deviceMng", @@ -277,7 +277,7 @@ { name: "绠楀姏绠$悊", - icon: "/images/manageCenter/绠楀姏绠$悊.png", + icon: "/images/manageCenter/manage2.png", openPath: "/hashrate", path: "/hashrateDetail", permission: "analysisMng", @@ -285,11 +285,19 @@ { name: "缁熻鏌ヨ", - icon: "/images/manageCenter/绠楀姏绠$悊.png", + icon: "/images/manageCenter/search.png", openPath: "/searchOpen", path: "/search", permission: "statisticMng", }, + + /* { + name: "GB28181", + icon: "/images/manageCenter/缁熻鏌ヨ.png", + openPath: "/GB28181Open", + path: "/GB28181Open", + permission: "statisticMng", + }, */ ], timeList: [ { name: "20.103鏈嶅姟鍣�", time: "9澶�12灏忔椂44鍒�39绉�" }, diff --git a/src/views/personalCenter/components/LeftMenu.vue b/src/views/personalCenter/components/LeftMenu.vue index 495d8dc..2477fb0 100644 --- a/src/views/personalCenter/components/LeftMenu.vue +++ b/src/views/personalCenter/components/LeftMenu.vue @@ -1,7 +1,7 @@ <template> <div class="left-menu"> <div class="user-img"> - <img src="/images/hashrate/鐙珛鍦烘櫙绌洪〉闈�.png" alt="" /> + <img src="/images/hashrate/s_empty.png" alt="" /> </div> <div class="user-name">{{ userInfo.username }}</div> diff --git a/src/views/personalCenter/components/OrderMng.vue b/src/views/personalCenter/components/OrderMng.vue index 289ad15..93429a8 100644 --- a/src/views/personalCenter/components/OrderMng.vue +++ b/src/views/personalCenter/components/OrderMng.vue @@ -509,7 +509,7 @@ }, openImg(url) { - window.open("http://" + url); + window.open("/httpImage/" + url); }, async exportList() { diff --git a/src/views/productDetail/components/ConfirmOrder.vue b/src/views/productDetail/components/ConfirmOrder.vue index 3fde954..752336f 100644 --- a/src/views/productDetail/components/ConfirmOrder.vue +++ b/src/views/productDetail/components/ConfirmOrder.vue @@ -76,12 +76,12 @@ @click="checkPayway('offpay')" > <img - src="/images/product/姹囨鐏�.png" + src="/images/product/pay2.png" class="moneyIcon" v-if="this.payWay === 'ali'" alt="" /> - <img class="moneyIcon" src="/images/product/姹囨.png" v-else alt="" /> + <img class="moneyIcon" src="/images/product/pay.png" v-else alt="" /> <span>绾夸笅姹囨</span> </div> <div @@ -90,11 +90,11 @@ @click="checkPayway('ali')" > <img - src="/images/product/鏀粯瀹�.png" + src="/images/product/alipay.png" v-if="this.payWay === 'ali'" alt="" /> - <img src="/images/product/鏀粯瀹濈伆.png" v-else alt="" /> + <img src="/images/product/alipay2.png" v-else alt="" /> </div> </div> diff --git a/src/views/productDetail/components/Function.vue b/src/views/productDetail/components/Function.vue index 58664e3..1ddad73 100644 --- a/src/views/productDetail/components/Function.vue +++ b/src/views/productDetail/components/Function.vue @@ -25,7 +25,7 @@ v-for="(item, index) in advantageArr" :key="index" > - <img src="/images/equipmentManagement/鍏ㄦ皯浜戣绠�.png" alt="" /> + <img src="/images/equipmentManagement/compute.png" alt="" /> <div class="label">{{ item.label }}</div> <div class="des">{{ item.des }}</div> </div> diff --git a/src/views/productDetail/index.vue b/src/views/productDetail/index.vue index 9523177..bdc9586 100644 --- a/src/views/productDetail/index.vue +++ b/src/views/productDetail/index.vue @@ -78,5 +78,9 @@ color: #666; } } + + .heart { + min-height: calc(100vh - 210px); + } } </style> \ No newline at end of file diff --git a/src/views/register/components/Steps.vue b/src/views/register/components/Steps.vue index e50f7db..2c9c1dc 100644 --- a/src/views/register/components/Steps.vue +++ b/src/views/register/components/Steps.vue @@ -1,32 +1,16 @@ <template> <div class="steps"> <div class="left"> - <img - v-if="active == 0" - src="/images/register/娉ㄥ唽_鍩烘湰淇℃伅_閫変腑.png" - alt="" - /> - <img - v-if="active == 1" - src="/images/register/娉ㄥ唽_鍩烘湰淇℃伅-鏈�変腑.png" - alt="" - /> + <img v-if="active == 0" src="/images/register/1.png" alt="" /> + <img v-if="active == 1" src="/images/register/2.png" alt="" /> <div class="label" :class="{ colorLight: active == 1 }">鍩烘湰淇℃伅</div> </div> <div class="middle"></div> <div class="right"> - <img - v-if="active == 0" - src="/images/register/娉ㄥ唽_閫夋嫨绫诲瀷_鏈�変腑.png" - alt="" - /> - <img - v-if="active == 1" - src="/images/register/娉ㄥ唽_閫夋嫨绫诲瀷_閫変腑.png" - alt="" - /> + <img v-if="active == 0" src="/images/register/3.png" alt="" /> + <img v-if="active == 1" src="/images/register/4.png" alt="" /> <div class="label" :class="{ colorLight: active == 0, colorBlue: active == 1 }" diff --git a/src/views/register/registerSuccess/index.vue b/src/views/register/registerSuccess/index.vue index e597d08..df47053 100644 --- a/src/views/register/registerSuccess/index.vue +++ b/src/views/register/registerSuccess/index.vue @@ -61,7 +61,7 @@ height: 100%; width: 100%; min-width: 1280px; - background: url("/images/register/娉ㄥ唽鎴愬姛.png"); + background: url("/images/register/success.png"); background-size: 100% 100%; font-size: 14px; diff --git a/src/views/search/components/CardItem.vue b/src/views/search/components/CardItem.vue index a430955..6f9e32e 100644 --- a/src/views/search/components/CardItem.vue +++ b/src/views/search/components/CardItem.vue @@ -791,7 +791,7 @@ return ""; } return ( - "http://" + url + (url.indexOf("?") >= 0 ? "&" : "?") + "width=160" + "/httpImage/" + url + (url.indexOf("?") >= 0 ? "&" : "?") + "width=160" ); }, }, diff --git a/src/views/search/components/Flow.vue b/src/views/search/components/Flow.vue index 3d82ef5..1718c32 100644 --- a/src/views/search/components/Flow.vue +++ b/src/views/search/components/Flow.vue @@ -17,16 +17,16 @@ return { flowList: [ { - img: "/images/search/寮�閫氱粺璁℃煡璇�.png", + img: "/images/search/1.png", title: "寮�閫氱粺璁℃煡璇�", }, - { img: "/images/search/鏁版嵁鏌ョ湅.png", title: "鏁版嵁鏌ョ湅" }, + { img: "/images/search/3.png", title: "鏁版嵁鏌ョ湅" }, { - img: "/images/search/褰曞儚鏌ョ湅.png", + img: "/images/search/2.png", title: "褰曞儚鏌ョ湅", }, { - img: "/images/search/鏁版嵁瀹炴椂鐩戞帶.png", + img: "/images/search/4.png", title: "鏁版嵁瀹炴椂鐩戞帶", }, ], diff --git a/src/views/search/components/UploadImg.vue b/src/views/search/components/UploadImg.vue index f89927b..b7aea0d 100644 --- a/src/views/search/components/UploadImg.vue +++ b/src/views/search/components/UploadImg.vue @@ -255,7 +255,7 @@ console.log("鍒囧浘杩斿洖锛�", res); if (res.success) { document.querySelector(".el-upload-list").querySelector("img").src = - "http://" + res.data.uploadImage; + "/httpImage/" + res.data.uploadImage; this.resReady = true; this.realSmallPath = res.data.smImage; this.VideoPhotoData.isHaveRealSmallImg = diff --git a/src/views/search/components/wasmPlayer/index.vue b/src/views/search/components/wasmPlayer/index.vue index f56739b..a6a5dbc 100644 --- a/src/views/search/components/wasmPlayer/index.vue +++ b/src/views/search/components/wasmPlayer/index.vue @@ -530,7 +530,7 @@ }); } - let url = "http://" + window.location.host + this.loadUrl; + let url = "/httpImage/" + window.location.host + this.loadUrl; // let url = "http://localhost:8080http://192.168.20.189:6700/283,2f49bf283ad7?collection=2021-09-28-DSVAD010120190703-video" let name = url.substring(url.lastIndexOf("/") + 1); diff --git a/src/views/trialCenter/components/SdkItem.vue b/src/views/trialCenter/components/SdkItem.vue index 54bb1f2..9bda830 100644 --- a/src/views/trialCenter/components/SdkItem.vue +++ b/src/views/trialCenter/components/SdkItem.vue @@ -1,6 +1,6 @@ <template> <div class="SdkItem"> - <div class="icon"> + <div class="imgBox"> <ImageShow :src="sdk.logoUrl" alt="" /> </div> <div class="title">{{ sdk.productName }}</div> @@ -36,7 +36,7 @@ background-color: #fff; text-align: center; position: relative; - .icon img { + .imgBox img { margin-top: 20px; width: 96px; } diff --git a/src/views/trialCenter/components/SdkList.vue b/src/views/trialCenter/components/SdkList.vue index 40fece4..95583fe 100644 --- a/src/views/trialCenter/components/SdkList.vue +++ b/src/views/trialCenter/components/SdkList.vue @@ -28,7 +28,7 @@ .SdkList { overflow: hidden; padding-bottom: 40px; - background: url("/images/trialCenter/璇曠敤涓績.png"); + background: url("/images/trialCenter/center.png"); background-size: cover; .title { diff --git a/src/views/trialCenter/components/commendCard.vue b/src/views/trialCenter/components/commendCard.vue index 95a392b..376e9a7 100644 --- a/src/views/trialCenter/components/commendCard.vue +++ b/src/views/trialCenter/components/commendCard.vue @@ -28,22 +28,22 @@ return { commendCardData: [ { - img: "/images/trialCenter/绱娉ㄥ唽鐢ㄦ埛.png", + img: "/images/trialCenter/user.png", count: "", des: "绱娉ㄥ唽鐢ㄦ埛", }, { - img: "/images/trialCenter/闄愭椂璇曠敤浜у搧.png", + img: "/images/trialCenter/product.png", count: "", des: "闄愭椂璇曠敤浜у搧", }, { - img: "/images/trialCenter/绱鏈嶅姟浼佷笟.png", + img: "/images/trialCenter/company.png", count: "", des: "绱鏈嶅姟浼佷笟", }, { - img: "/images/trialCenter/鍏嶈垂璇曠敤鏃堕暱.png", + img: "/images/trialCenter/time.png", count: "", des: "鍏嶈垂璇曠敤鏃堕暱", }, diff --git a/vue.config.js b/vue.config.js index 46f60da..e533757 100644 --- a/vue.config.js +++ b/vue.config.js @@ -36,6 +36,12 @@ // ws: true, changeOrigin: true, }, + /* + "/api-v": { + target: "http://192.168.20.10:7009", + // ws: true, + changeOrigin: true, + }, */ }, }, }; -- Gitblit v1.8.0