From d8fcf4c20cd4638a3def6227a71ea2c81fbc0885 Mon Sep 17 00:00:00 2001
From: hanbaoshan <hanbaoshan@aiotlink.com>
Date: 星期五, 23 十月 2020 17:23:15 +0800
Subject: [PATCH] 标注静态交互

---
 src/components/LeftNav.vue |  125 +++++++++++++++++++++++++++++++++++++----
 1 files changed, 113 insertions(+), 12 deletions(-)

diff --git a/src/components/LeftNav.vue b/src/components/LeftNav.vue
index 2ef7e0d..421a4e1 100644
--- a/src/components/LeftNav.vue
+++ b/src/components/LeftNav.vue
@@ -118,7 +118,7 @@
             </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>
 
@@ -126,7 +126,8 @@
               <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>
@@ -150,6 +151,61 @@
               </el-menu-item-group>
             </el-submenu>
           </el-menu>
+        </el-tab-pane>
+        <el-tab-pane
+          label="闆嗙兢"
+          name="cluster"
+          :style="`height:${height - 56}px;`"
+          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="鏁版嵁鏍�"
@@ -260,6 +316,7 @@
 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 +344,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 +401,7 @@
       dataStack: "videoMonitor:dataStack",
       activeIndexVideo: "",
       buttonAuthority: sessionStorage.getItem("buttonAuthoritys") || [],
+      installedApps: sessionStorage.getItem("apps") || [],
       loginName: JSON.parse(sessionStorage.getItem("userInfo")).username || "鐢ㄦ埛鍚�",
       searchTypeOptions: [
         {
@@ -368,10 +447,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 +463,17 @@
       this.DataStackPool.fetchFiles();
 
     }
+    if (this.showCluster) {
+      this.TreeDataPool.treeActiveName = "cluster"
+      this.TreeDataPool.fetchClusterTree();
+      findCluster().then(res => {
+        if (res.success) {
+          debugger
+          this.clusterName = res.data.clusterName;
+        }
+
+      })
+    }
   },
   methods: {
     searchAreaData() {
@@ -388,6 +481,9 @@
     },
     searchDataStack() {
       this.DataStackPool.fetchFiles();
+    },
+    searchClusterData() {
+      this.TreeDataPool.fetchClusterTree();
     },
     lockSwitch() {
       this.TreeDataPool.readonly = !this.TreeDataPool.readonly;
@@ -559,11 +655,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 +669,10 @@
                 message: "鎿嶄綔瀹屾垚, 瀵煎叆鎴愬姛:" + succeed + "涓� 澶辫触:" + failed + "涓�"
               })
               _this.TreeDataPool.fetchTreeData();
-            }).catch(e=>{
+            }).catch(e => {
               console.log(e)
             });
-            
+
           }
         } catch (e) {
           this.menuLoading = false
@@ -623,8 +719,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 +848,7 @@
     .search-input {
       padding-top: 8px;
       padding-bottom: 12px;
+      text-align: left;
       .dev-tree-close {
         width: 10%;
         margin-left: 10px;
@@ -866,4 +964,7 @@
     color: #606266;
   }
 }
+.flex-box {
+  display: flex;
+}
 </style>
\ No newline at end of file

--
Gitblit v1.8.0