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