From a3f357e8a60443b74b64c7479113c68eb35ce1f5 Mon Sep 17 00:00:00 2001
From: ZZJ <10913410+zzj2100@user.noreply.gitee.com>
Date: 星期五, 15 七月 2022 19:44:57 +0800
Subject: [PATCH] 控制轮询

---
 src/components/LeftNav.vue |  497 +++++++++++++++++++++++++++++++++++++++---------------
 1 files changed, 359 insertions(+), 138 deletions(-)

diff --git a/src/components/LeftNav.vue b/src/components/LeftNav.vue
index 711a98d..0ba92c5 100644
--- a/src/components/LeftNav.vue
+++ b/src/components/LeftNav.vue
@@ -2,17 +2,26 @@
   <transition name="slideLeft">
     <div
       class="left-tree-box"
-      :style="`height:${height}px;animation-duration: 0.7s`"
       v-show="TreeDataPool.showTreeBox"
+      v-loading="menuLoading"
     >
-      <el-tabs v-model="TreeDataPool.treeActiveName" type="border-card" @tab-click="handleClick">
-        <el-tab-pane label="鎽勫儚鏈�" name="camera" :style="`height:${height - 56}px;`" v-if="showCam">
+      <el-tabs
+        v-model="TreeDataPool.treeActiveName"
+        type="border-card"
+        @tab-click="handleClick"
+      >
+        <el-tab-pane
+          label="鎽勫儚鏈�"
+          name="camera"
+          :style="`height:${height - 56}px;`"
+          v-if="showCam"
+        >
           <el-menu
             :default-openeds="openeds"
             background-color="#fff"
             text-color="#303133"
             active-text-color="#409EFF"
-            style="height: 100%;"
+            style="height: 100%"
             class="el-menu-vertical-demo"
             unique-opened
             @open="menuOpen"
@@ -31,7 +40,7 @@
                   :value="item.value"
                 ></el-option>
               </el-select>
-              <span style="display: inline-block;padding: 0px 3px;"></span>
+              <span style="display: inline-block; padding: 0px 3px"></span>
               <el-input
                 v-model="TreeDataPool.searchInput"
                 placeholder="鎼滅储"
@@ -40,7 +49,7 @@
               >
                 <i
                   class="el-icon-search el-input__icon"
-                  style="color:#DCDFE6"
+                  style="color: #dcdfe6"
                   slot="prefix"
                   @click="searchAreaData"
                 ></i>
@@ -53,12 +62,15 @@
                     @click="closeTree"
                   ></i>
                 </el-tooltip>
-              </div> -->
+              </div>-->
             </li>
 
-            <!-- 娣诲姞鍖哄煙鍥炬爣 -->
             <div class="tree-edit area-add" v-show="!TreeDataPool.readonly">
-              <el-tooltip content="娣诲姞鍖哄煙" placement="bottom" popper-class="atooltip">
+              <el-tooltip
+                content="娣诲姞鍖哄煙"
+                placement="bottom"
+                popper-class="atooltip"
+              >
                 <button @click="addNode($event)">
                   <i class="iconfont iconhebingxingzhuang"></i>
                 </button>
@@ -67,10 +79,34 @@
 
             <!-- 娣诲姞璁惧鍥炬爣 -->
             <div class="tree-edit camera-add" v-show="!TreeDataPool.readonly">
-              <el-tooltip content="娣诲姞璁惧" placement="bottom" popper-class="atooltip">
+              <el-tooltip
+                content="娣诲姞璁惧"
+                placement="bottom"
+                popper-class="atooltip"
+              >
                 <button @click="addCamera('0')">
                   <!-- <i class="el-icon-video-camera"></i> -->
-                  <span class="iconfont iconshishishipin" style="font-size:14px;"></span>
+                  <span
+                    class="iconfont iconshishishipin"
+                    style="font-size: 14px"
+                  ></span>
+                </button>
+              </el-tooltip>
+            </div>
+
+            <!-- 瀵煎叆璁惧 -->
+            <div class="tree-edit import-btn" v-show="!TreeDataPool.readonly">
+              <el-tooltip
+                content="瀵煎叆璁惧"
+                placement="bottom"
+                popper-class="atooltip"
+              >
+                <button @click="importCameras('0')">
+                  <!-- <i class="el-icon-video-camera"></i> -->
+                  <span
+                    class="iconfont icondaoru"
+                    style="font-size: 16px"
+                  ></span>
                 </button>
               </el-tooltip>
             </div>
@@ -89,7 +125,7 @@
                 <!-- <i class="iconfont iconjiankongshexiangji"></i> -->
                 <span
                   class="iconfont iconjiankongshexiangji"
-                  style="padding-right:10px;font-size:13px;"
+                  style="padding-right: 10px; font-size: 13px"
                 ></span>
                 <b class="tree-font">鎽勫儚鏈�</b>
               </template>
@@ -101,27 +137,33 @@
                   :node="TreeDataPool.treeData"
                   :height="height"
                   @addDevice="addCamera"
+                  @import="importCameras"
                 />
               </el-menu-item-group>
             </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>
-                  <i v-else class="el-icon-unlock" style="font-size:16px"></i>
+                  <i
+                    v-if="TreeDataPool.gbReadonly"
+                    class="el-icon-lock"
+                    style="font-size: 16px"
+                  ></i>
+                  <i v-else class="el-icon-unlock" style="font-size: 16px"></i>
                 </button>
               </div>
               <el-menu-item-group class="item-group">
@@ -140,20 +182,73 @@
           </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">
-              <span style="display: inline-block;padding: 0px 3px;"></span>
+              <!-- <span style="display: inline-block;padding: 0px 3px;"></span> -->
               <el-select
                 v-model="DataStackPool.searchType"
                 placeholder="璇烽�夋嫨"
                 size="small"
-                style="width: 134px;height: 34px;margin-left: 10px;"
+                style="width: 134px; height: 34px; margin-left: 10px"
                 @change="searchDataStack"
               >
                 <el-option
@@ -163,18 +258,18 @@
                   :value="item.value"
                 ></el-option>
               </el-select>
-              <span style="display: inline-block;padding: 0px 3px;"></span>
+              <span style="display: inline-block; padding: 0px 3px"></span>
               <el-input
                 v-model="DataStackPool.searchInput"
                 placeholder="璇疯緭鍏�"
                 size="small"
                 clearable
                 @input="querySearchAsync('dir')"
-                :style="'width:103px;'"
+                :style="'width:148px;'"
               >
                 <i
                   class="el-icon-search el-input__icon"
-                  style="color:black"
+                  style="color: black"
                   slot="prefix"
                   @click="searchDataStack"
                 ></i>
@@ -186,14 +281,18 @@
                   style="color: #3D68E1;line-height: 22px;font-size: 27px;"
                   @click="closeTree"
                 ></i>
-              </div> -->
+              </div>-->
             </div>
 
             <!-- 鏈湴瑙嗛婧愬垪琛� -->
             <div class="dev-vedio-list">
               <!-- 娣诲姞鏂囦欢澶瑰浘鏍� -->
               <div class="tree-edit area-add" v-show="!DataStackPool.readonly">
-                <el-tooltip content="娣诲姞鏂囦欢澶�" placement="bottom" popper-class="atooltip">
+                <el-tooltip
+                  content="娣诲姞鏂囦欢澶�"
+                  placement="bottom"
+                  popper-class="atooltip"
+                >
                   <button @click="addDir($event)">
                     <i class="iconfont iconhebingxingzhuang"></i>
                   </button>
@@ -207,12 +306,28 @@
                   <i v-else class="el-icon-unlock"></i>
                 </button>
               </div>
-              <LocalVedioList :dataList="TreeDataPool.localVedioList"></LocalVedioList>
+              <LocalVedioList
+                :dataList="TreeDataPool.localVedioList"
+              ></LocalVedioList>
             </div>
           </div>
-          <file-upload v-show="fileUploadBox" @close="fileUploadBox= false" />
+          <file-upload v-show="fileUploadBox" @close="fileUploadBox = false" />
         </el-tab-pane>
       </el-tabs>
+
+      <!-- 瀵煎叆璁惧缁勪欢 浜嬩欢瑙﹀彂 -->
+      <el-upload
+        class="upload-btn"
+        action="https://jsonplaceholder.typicode.com/posts/"
+        accept=".xlsx"
+        :on-exceed="exceed"
+        :limit="10"
+        :on-remove="remove"
+        :http-request="uploadFile"
+        :show-file-list="false"
+      >
+        <button ref="import-btn" v-show="false"></button>
+      </el-upload>
     </div>
   </transition>
 </template>
@@ -222,32 +337,38 @@
   show,
   changeEnable,
   deleteLocalFile,
-  updateStatus
+  updateStatus,
 } from "@/api/localVedio";
 
-import TreeMenu from "@/components/treeMenu/index";
-import LocalVedioList from '@/components/subComponents/LocalVedioList';
-import FileUpload from '@/components/subComponents/FileUpload/index';
+import { createCamera } from "@/api/camera";
+
+import bus from "@/plugin/bus";
+// 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: {
     TreeMenu,
     LocalVedioList,
-    FileUpload
+    FileUpload,
   },
   props: {
     appName: {
       type: String,
-      default: "Video"
+      default: "Video",
     },
     edit: {
       type: Boolean,
-      default: false
+      default: false,
     },
     height: {
       type: Number,
-      default: 0
-    }
+      default: 0,
+    },
   },
 
   computed: {
@@ -255,10 +376,36 @@
       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;
@@ -283,87 +430,58 @@
         return loginName === "superadmin" || loginName === "basic";
       }
       return false;
-    }
+    },
   },
   data() {
     return {
-      cameraAuth: "videoMonitor:camera",
       dataStack: "videoMonitor:dataStack",
-      activeIndexVideo: "",
       buttonAuthority: sessionStorage.getItem("buttonAuthoritys") || [],
-      loginName: JSON.parse(sessionStorage.getItem("userInfo")).username || "鐢ㄦ埛鍚�",
+      installedApps: sessionStorage.getItem("apps") || [],
+      loginName:
+        JSON.parse(sessionStorage.getItem("userInfo")).username || "鐢ㄦ埛鍚�",
       searchTypeOptions: [
         {
           value: 0,
-          label: "鍏ㄩ儴鎽勫儚鏈�"
+          label: "鍏ㄩ儴鎽勫儚鏈�",
         },
         {
           value: 1,
-          label: "鍒嗘瀽鎽勫儚鏈�"
+          label: "鍒嗘瀽鎽勫儚鏈�",
         },
         {
           value: 2,
-          label: "鐩戞帶鎽勫儚鏈�"
+          label: "鐩戞帶鎽勫儚鏈�",
         },
         {
           value: 3,
-          label: "鑱斿姩鎽勫儚鏈�"
-        }
-      ],
-      searchTypeLocalVideo: [
-        {
-          value: 0,
-          label: "鍏ㄩ儴"
+          label: "鑱斿姩鎽勫儚鏈�",
         },
-        {
-          value: 1,
-          label: "澶勭悊瀹屾垚"
-        },
-        {
-          value: 2,
-          label: "澶勭悊涓�"
-        },
-        {
-          value: 3,
-          label: "鏈厤瑙勫垯"
-        },
-        {
-          value: 4,
-          label: "鏈紑鍚�"
-        }
       ],
       timeout: null,
       fileUploadBox: false,
-      loadingGBTree: false
+      loadingGBTree: false,
+      importAreaId: "",
+      menuLoading: false,
+      clusterName: "",
     };
   },
-  // watch: {
-  //   $route(to, from) {
-  //     switch (to.name) {
-  //       case "Searching":
-  //         this.cameraAuth = "videoSearch:camera"
-  //         this.dataStack = "videoSearch:dataStack"
-  //         break
-  //       case "VideoManage":
-  //         this.cameraAuth = "VIDEOCAMERA:camera"
-  //         this.dataStack = "VIDEOCAMERA:dataStack"
-  //         break
-  //       default:
-  //         this.cameraAuth = "videoMonitor:camera"
-  //         this.dataStack = "videoMonitor:dataStack"
-  //     }
-  //     // console.log("璺敱鍙樺寲锛�", to, from)
-  //   }
-  // },
   created() {
+    console.log("---------");
     if (this.showCam) {
-      this.TreeDataPool.treeActiveName = "camera"
+      this.TreeDataPool.treeActiveName = "camera";
       this.TreeDataPool.fetchTreeData();
-
     } else {
-      this.TreeDataPool.treeActiveName = "dataStack"
+      this.TreeDataPool.treeActiveName = "dataStack";
       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: {
@@ -373,9 +491,11 @@
     searchDataStack() {
       this.DataStackPool.fetchFiles();
     },
+    searchClusterData() {
+      this.TreeDataPool.fetchClusterTree();
+    },
     lockSwitch() {
       this.TreeDataPool.readonly = !this.TreeDataPool.readonly;
-      console.log(this.TreeDataPool.readonly)
     },
     gbLockSwitch() {
       this.TreeDataPool.gbReadonly = !this.TreeDataPool.gbReadonly;
@@ -385,16 +505,16 @@
     },
     closeTree() {
       this.TreeDataPool.showTreeBox = false;
-      // bus.$emit('refreshCompareImg')
+      bus.$emit("refreshCompareImg");
     },
     addNode(event) {
       this.$refs.tree.addNode(event, { id: 0 });
     },
     addCamera(node) {
-      // bus.$emit("addCameraOnTree", node);
+      bus.$emit("addCameraOnTree", node);
     },
     addDir(node) {
-      // bus.$emit("addDirOnTree", node);
+      bus.$emit("addDirOnTree", node);
     },
     menuOpen(index) {
       this.TreeDataPool.openeds[index] = true;
@@ -422,48 +542,51 @@
         if (type === "camera") {
           this.TreeDataPool.fetchTreeData();
         }
+        if (type === "cluster") {
+          this.TreeDataPool.fetchClusterTree();
+        }
         if (type === "dir") {
           this.DataStackPool.fetchFiles();
         }
       }, 500);
     },
     handleClick(event) {
-      if (event.name == 'dataStack') {
+      if (event.name == "dataStack") {
         this.DataStackPool.fetchFiles();
         this.DataStackPool.clean();
         this.TreeDataPool.clean();
       }
-      this.TreeDataPool.treeActiveName = event.name
-      console.log("褰撳墠婵�娲籲ame锛�", this.TreeDataPool.treeActiveName)
+      this.TreeDataPool.treeActiveName = event.name;
+      console.log("褰撳墠婵�娲籲ame锛�", this.TreeDataPool.treeActiveName);
     },
     async changeEnable() {
       if (this.PollData.localVideo === 0) {
         this.$notify({
           title: "澶辫触",
           type: "warning",
-          message: "寮�鍚湰鍦版暟鎹棰戝垎鏋愬鐞嗭紝闇�鍏堜负鏈湴鏁版嵁鎵嬪姩璁剧疆绠楀姏璧勬簮锛�"
-        })
+          message: "寮�鍚湰鍦版暟鎹棰戝垎鏋愬鐞嗭紝闇�鍏堜负鏈湴鏁版嵁鎵嬪姩璁剧疆绠楀姏璧勬簮锛�",
+        });
         return false;
       }
       let res = await changeEnable({
-        enable: this.TreeDataPool.vedioAnaliyseSwitch
-      })
+        enable: this.TreeDataPool.vedioAnaliyseSwitch,
+      });
       if (res && res.success) {
-        console.log(res, '鍒囨崲鏈湴鏂囦欢鍒嗘瀽寮�鍏�')
+        console.log(res, "鍒囨崲鏈湴鏂囦欢鍒嗘瀽寮�鍏�");
       }
     },
     getCheckedFiles() {
-      let list1 = this.TreeDataPool.localVedioList.filter(i => {
-        return i.checkStatus
-      })
-      return list1
+      let list1 = this.TreeDataPool.localVedioList.filter((i) => {
+        return i.checkStatus;
+      });
+      return list1;
     },
     async stopVedio(status) {
       // let list1 = this.getCheckedFiles();
       if (this.TreeDataPool.checkedLocalVedio.length == 0) {
         this.$notify({
           type: "warning",
-          message: "璇峰厛閫夋嫨闇�瑕佸仠姝㈢殑瑙嗛锛�"
+          message: "璇峰厛閫夋嫨闇�瑕佸仠姝㈢殑瑙嗛锛�",
         });
         // this.$notify({
         //   type:"info",
@@ -472,41 +595,133 @@
         return false;
       }
       let res = await updateStatus({
-        ids: this.TreeDataPool.checkedLocalVedio.map(i => {
-          return i.id
+        ids: this.TreeDataPool.checkedLocalVedio.map((i) => {
+          return i.id;
         }),
-        status: status
-      })
+        status: status,
+      });
       if (res && res.success) {
-        console.log(res, '寮�鍚殏鍋滃弬鏁�')
+        console.log(res, "寮�鍚殏鍋滃弬鏁�");
       }
     },
     async deleteLocalFiles() {
       let list1 = this.getCheckedFiles();
-      console.log(list1, '宸插嬀閫夌殑瑙嗛')
+      console.log(list1, "宸插嬀閫夌殑瑙嗛");
       if (list1.length == 0) {
-        return false
+        return false;
       }
       let res = await deleteLocalFile({
-        ids: list1.map(i => { return i.id })
-      })
+        ids: list1.map((i) => {
+          return i.id;
+        }),
+      });
       if (res && res.success) {
         this.$notify({
-          type: 'success',
-          message: '鍒犻櫎鎴愬姛锛侊紒'
-        })
+          type: "success",
+          message: "鍒犻櫎鎴愬姛锛侊紒",
+        });
       } else {
         this.$notify({
           type: "error",
-          message: "鍒犻櫎澶辫触锛�"
-        })
+          message: "鍒犻櫎澶辫触锛�",
+        });
       }
     },
 
     refrash(current, pageSize) {
       this.TreeDataPool.localCurrentPage = current;
     },
-  }
+
+    importCameras(area) {
+      this.importAreaId = area;
+      this.$refs["import-btn"].click();
+    },
+
+    async uploadFile(params) {
+      const _file = params.file;
+      const fileReader = new FileReader();
+      fileReader.onload = (ev) => {
+        this.menuLoading = true;
+        try {
+          const data = ev.target.result;
+          const workbook = XLSX.read(data, {
+            type: "binary",
+          });
+
+          for (let sheet in workbook.Sheets) {
+            //寰幆璇诲彇姣忎釜鏂囦欢
+            const sheetArray = XLSX.utils.sheet_to_json(workbook.Sheets[sheet]);
+            //鑻ュ綋鍓峴heet娌℃湁鏁版嵁锛屽垯continue
+            if (sheetArray.length == 0) {
+              continue;
+            }
+
+            let succeed = 0;
+            let failed = 0;
+            let promiseArr = [];
+            for (let item in sheetArray) {
+              let camera = this.newCamera();
+              camera.areaid = this.importAreaId;
+              camera.name = String(sheetArray[item].name);
+              camera.rtsp = String(sheetArray[item].rtsp);
+              camera.addr = String(sheetArray[item].addr);
+
+              promiseArr.push(createCamera(camera));
+            }
+            let _this = this;
+            Promise.allSettled(promiseArr)
+              .then((res) => {
+                res.forEach((item) => {
+                  if (item.status === "fulfilled") {
+                    succeed++;
+                  } else {
+                    failed++;
+                  }
+                });
+                _this.menuLoading = false;
+                _this.$message({
+                  type: "success",
+                  message:
+                    "鎿嶄綔瀹屾垚, 瀵煎叆鎴愬姛:" +
+                    succeed +
+                    "涓� 澶辫触:" +
+                    failed +
+                    "涓�",
+                });
+                _this.TreeDataPool.fetchTreeData();
+              })
+              .catch((e) => {
+                console.log(e);
+              });
+          }
+        } catch (e) {
+          this.menuLoading = false;
+          this.$message.warning("鏂囦欢绫诲瀷涓嶆纭紒");
+        }
+      };
+      fileReader.readAsBinaryString(_file);
+    },
+    exceed() {
+      this.$message.error("鏈�澶氬彧鑳戒笂浼�1涓獂ls鏂囦欢");
+    },
+    //鍒犻櫎鏂囦欢
+    remove() {},
+    newCamera() {
+      return {
+        latitude: 0,
+        rtsp: "",
+        longitude: 0,
+        name: "",
+        addr: "",
+        areaid: "",
+        reserved: "",
+        run_type: -1,
+        username: "",
+        password: "",
+        sensors: [],
+      };
+    },
+  },
 };
 </script>
 
@@ -514,15 +729,17 @@
 .left-tree-box {
   float: left;
   width: 100%;
-  .el-tabs__nav-prev,.el-tabs__nav-next{
+  .el-tabs__nav-prev,
+  .el-tabs__nav-next {
     display: none;
   }
   .el-tabs--border-card {
     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;
@@ -649,6 +866,7 @@
     .search-input {
       padding-top: 8px;
       padding-bottom: 12px;
+      text-align: left;
       .dev-tree-close {
         width: 10%;
         margin-left: 10px;
@@ -669,15 +887,11 @@
     }
     .dev-vedio-list {
       padding: 0 15px;
-      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;
-      }
+      box-sizing: border-box;
+      // height: calc(100vh - 80px);
+      //max-height: 740px;
+      // overflow-x: hidden;
+      overflow: auto;
     }
     .dev-vedio-list::-webkit-scrollbar {
       /*婊氬姩鏉℃暣浣撴牱寮�*/
@@ -697,7 +911,7 @@
 }
 
 .tree-edit {
-  z-index: 1;
+  z-index: 2;
   font-size: 16px;
   position: absolute;
   top: 56px;
@@ -734,6 +948,10 @@
 .camera-add {
   left: 128px;
 }
+
+.import-btn {
+  left: 156px;
+}
 .tree-font {
   font-family: PingFangSC-Medium;
   font-size: 14px;
@@ -760,4 +978,7 @@
     color: #606266;
   }
 }
+.flex-box {
+  display: flex;
+}
 </style>
\ No newline at end of file

--
Gitblit v1.8.0