From 1e1e5f612f252d66b0d0386cf52873bb1f3f7d7b Mon Sep 17 00:00:00 2001 From: haoxuan <haoxuan> Date: 星期五, 01 九月 2023 16:10:37 +0800 Subject: [PATCH] 系统维护+系统监控器+调试工具的app 增加 --- src/components/LeftNav.vue | 155 ++++++++++++++++++++++++++++++++++++++++++--------- 1 files changed, 128 insertions(+), 27 deletions(-) diff --git a/src/components/LeftNav.vue b/src/components/LeftNav.vue index 2ef7e0d..e63e984 100644 --- a/src/components/LeftNav.vue +++ b/src/components/LeftNav.vue @@ -118,18 +118,19 @@ </el-submenu> <el-submenu index="1"> <template slot="title"> - <i class="iconfont iconGBx"></i> + <i class="iconfont iconGBx" style="margin-left:-4px;"></i> <b class="tree-font">GB28181</b> </template> <!-- 鍥芥爣鍒锋柊鍥炬爣 --> - <div class="tree-edit gb-refresh" v-show="!TreeDataPool.gbReadonly"> + <!-- <div class="tree-edit gb-refresh" v-show="!TreeDataPool.gbReadonly"> <el-tooltip content="鍒锋柊" placement="top" popper-class="atooltip"> <button @click="refreshGB"> - <i class="el-icon-refresh" style="font-size:16px"></i> + <i v-if="loadingGBTree" class="el-icon-loading" style="font-size:16px"></i> + <i v-else class="el-icon-refresh" style="font-size:16px"></i> </button> </el-tooltip> - </div> + </div>--> <div class="tree-edit gb-lock" v-show="showLock"> <button @click="gbLockSwitch"> <i v-if="TreeDataPool.gbReadonly" class="el-icon-lock" style="font-size:16px"></i> @@ -152,11 +153,61 @@ </el-menu> </el-tab-pane> <el-tab-pane - label="鏁版嵁鏍�" - name="dataStack" + label="闆嗙兢" + name="cluster" :style="`height:${height - 56}px;`" - v-if="showDataStack" + v-if="showCluster" > + <div class="local-vedio-area"> + <!-- 鎼滅储 --> + <div class="navTopSelect"> + <div class="search-input flex-box"> + <el-select + v-model="TreeDataPool.searchCamType" + placeholder="璇烽�夋嫨" + @change="searchClusterData" + > + <el-option + v-for="item in searchTypeOptions" + :key="item.value" + :label="item.label" + :value="item.value" + ></el-option> + </el-select> + <span style="display: inline-block;padding: 0px 3px;"></span> + <el-input + v-model="TreeDataPool.searchInput" + placeholder="鎼滅储" + clearable + @input="querySearchAsync('cluster')" + > + <i + class="el-icon-search el-input__icon" + style="color:#DCDFE6" + slot="prefix" + @click="searchClusterData" + ></i> + </el-input> + </div> + </div> + <div class="top-menu" style="margin:0 0 10px;text-align:left;"> + <span class="iconfont iconjiqun" style="font-size:20px;"></span> + <span style="font-size:14px; margin-left: 5px;font-weight: 600;">{{clusterName}}</span> + </div> + <div class="cluster-list"> + <tree-menu + ref="tree" + :app="appName" + :treeName="'localTree'" + :node="TreeDataPool.clusterData" + :height="height" + @addDevice="addCamera" + @import="importCameras" + /> + </div> + </div> + </el-tab-pane> + <el-tab-pane label="鏁版嵁鏍�" name="dataStack" v-if="showDataStack"> <div class="local-vedio-area"> <!-- 鎼滅储 --> <div class="search-input"> @@ -182,7 +233,7 @@ size="small" clearable @input="querySearchAsync('dir')" - :style="'width:103px;'" + :style="'width:148px;'" > <i class="el-icon-search el-input__icon" @@ -256,10 +307,12 @@ } from "@/api/camera"; import bus from "@/plugin/bus" -import TreeMenu from "@/components/treeMenu/index"; +// import TreeMenu from "@/components/treeMenu/index"; +import TreeMenu from "@/components/giantTree/index"; import LocalVedioList from '@/components/subComponents/LocalVedioList'; import FileUpload from '@/components/subComponents/FileUpload/index'; import XLSX from 'xlsx' +import { findCluster } from "@/api/clusterManage"; export default { components: { @@ -287,10 +340,31 @@ return true; }, showCam() { - return this.appName === "Camera" || this.appName === "Search"; + return this.appName === "Camera" || this.appName === 'Cluster' || (this.appName === "Search" && (this.buttonAuthority.indexOf("search:camera") >= 0 || this.isAdmin)); }, + showCluster() { + return this.appName === "Cluster"; + }, + // 鏁版嵁鏍堥厤缃繀椤绘樉绀恒�� 妫�绱㈤�氳繃鏉冮檺鎺у埗鏄剧ず, 鏈畨瑁呮暟鎹爤涔熶笉鏄剧ず showDataStack() { - return this.appName === "DataStack" || this.appName === "Search"; + if (this.appName === "DataStack") { + return true; + } + + if (this.appName === "Search") { + // 鏈畨瑁呮暟鎹爤閰嶇疆 + if (this.installedApps.indexOf("dataStack") >= 0) { + if (this.isAdmin) { + return true; + } + + if (this.buttonAuthority.indexOf("search:stack") >= 0) { + return true; + } + } + } + + return false; }, showLock() { return this.edit; @@ -323,6 +397,7 @@ dataStack: "videoMonitor:dataStack", activeIndexVideo: "", buttonAuthority: sessionStorage.getItem("buttonAuthoritys") || [], + installedApps: sessionStorage.getItem("apps") || [], loginName: JSON.parse(sessionStorage.getItem("userInfo")).username || "鐢ㄦ埛鍚�", searchTypeOptions: [ { @@ -368,10 +443,13 @@ fileUploadBox: false, loadingGBTree: false, importAreaId: "", - menuLoading: false + menuLoading: false, + clusterName: '' }; }, created() { + console.log(this.appName) + console.log(this.showCam) if (this.showCam) { this.TreeDataPool.treeActiveName = "camera" this.TreeDataPool.fetchTreeData(); @@ -381,6 +459,16 @@ this.DataStackPool.fetchFiles(); } + if (this.showCluster) { + this.TreeDataPool.treeActiveName = "cluster" + this.TreeDataPool.fetchClusterTree(); + findCluster().then(res => { + if (res.success) { + this.clusterName = res.data.clusterName; + } + + }) + } }, methods: { searchAreaData() { @@ -388,6 +476,9 @@ }, searchDataStack() { this.DataStackPool.fetchFiles(); + }, + searchClusterData() { + this.TreeDataPool.fetchClusterTree(); }, lockSwitch() { this.TreeDataPool.readonly = !this.TreeDataPool.readonly; @@ -436,6 +527,9 @@ this.timeout = setTimeout(() => { if (type === "camera") { this.TreeDataPool.fetchTreeData(); + } + if (type === "cluster") { + this.TreeDataPool.fetchClusterTree(); } if (type === "dir") { this.DataStackPool.fetchFiles(); @@ -559,11 +653,11 @@ promiseArr.push(createCamera(camera)); } let _this = this; - Promise.allSettled(promiseArr).then(res=>{ - res.forEach(item=>{ - if(item.status === 'fulfilled'){ + Promise.allSettled(promiseArr).then(res => { + res.forEach(item => { + if (item.status === 'fulfilled') { succeed++; - }else{ + } else { failed++; } }); @@ -573,10 +667,10 @@ message: "鎿嶄綔瀹屾垚, 瀵煎叆鎴愬姛:" + succeed + "涓� 澶辫触:" + failed + "涓�" }) _this.TreeDataPool.fetchTreeData(); - }).catch(e=>{ + }).catch(e => { console.log(e) }); - + } } catch (e) { this.menuLoading = false @@ -623,8 +717,9 @@ border: none; box-shadow: none; .el-tabs__header { + display: none; border-bottom: none; - margin: 0 0 15px; + //margin: 0 0 15px; } .el-tabs__content { padding: 0; @@ -751,6 +846,7 @@ .search-input { padding-top: 8px; padding-bottom: 12px; + text-align: left; .dev-tree-close { width: 10%; margin-left: 10px; @@ -771,15 +867,17 @@ } .dev-vedio-list { padding: 0 15px; - max-height: 740px; + box-sizing: border-box; + height: calc(100vh - 80px); + //max-height: 740px; overflow-x: hidden; overflow-y: auto; - @media screen and (max-height: 720px) { - max-height: 580px; - } - @media screen and (min-height: 900px) { - max-height: 740px; - } + // @media screen and (max-height: 720px) { + // max-height: 580px; + // } + // @media screen and (min-height: 900px) { + // max-height: 740px; + // } } .dev-vedio-list::-webkit-scrollbar { /*婊氬姩鏉℃暣浣撴牱寮�*/ @@ -799,7 +897,7 @@ } .tree-edit { - z-index: 1; + z-index: 2; font-size: 16px; position: absolute; top: 56px; @@ -866,4 +964,7 @@ color: #606266; } } +.flex-box { + display: flex; +} </style> \ No newline at end of file -- Gitblit v1.8.0