From 929cf4c7be11bfd1e134d0cb0d7cbbe94772ebdf Mon Sep 17 00:00:00 2001
From: zhangzengfei <zhangzengfei@iotlink.com>
Date: 星期一, 07 九月 2020 15:35:14 +0800
Subject: [PATCH] 摄像机树增加导入功能

---
 src/components/treeMenu/index.vue                |   23 ++-
 src/scripts/httpRequest.ts                       |   17 --
 package.json                                     |    3 
 src/components/LeftNav.vue                       |  142 ++++++++++++++++++++---
 src/pages/cameraAccess/components/CameraInfo.vue |  148 +----------------------
 src/Pool/dataStack.ts                            |   12 +
 6 files changed, 161 insertions(+), 184 deletions(-)

diff --git a/package.json b/package.json
index 1c891e3..10c41ff 100644
--- a/package.json
+++ b/package.json
@@ -30,7 +30,8 @@
     "vue-js-toggle-button": "^1.3.3",
     "vue-photo-preview": "^1.1.3",
     "vue-qrcode-component": "^2.1.1",
-    "vuex": "^3.5.1"
+    "vuex": "^3.5.1",
+    "xlsx": "^0.16.6"
   },
   "devDependencies": {
     "@vue/cli-plugin-babel": "^3.10.0",
diff --git a/src/Pool/dataStack.ts b/src/Pool/dataStack.ts
index 1a7becf..ddcc64f 100644
--- a/src/Pool/dataStack.ts
+++ b/src/Pool/dataStack.ts
@@ -41,7 +41,17 @@
   public async fetchFiles() {
     const rsp: any = await getDataStackDirs({ name: this.searchInput, type: this.searchType, page: 1, size: 100 });
     if (rsp && rsp.success) {
-      this.dirs = rsp.data.dataList;
+      this.dirs = rsp.data.dataList.sort(function (obj1: any, obj2: any) {
+        var val1 = obj1.name;
+        var val2 = obj2.name;
+        if (val1 < val2) {
+          return -1;
+        } else if (val1 > val2) {
+          return 1;
+        } else {
+          return 0;
+        }
+      });
     }
   }
 
diff --git a/src/components/LeftNav.vue b/src/components/LeftNav.vue
index cf99eea..fc28117 100644
--- a/src/components/LeftNav.vue
+++ b/src/components/LeftNav.vue
@@ -4,6 +4,7 @@
       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">
@@ -75,6 +76,16 @@
               </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>
+
             <!-- 鏍戞搷浣滈攣 -->
             <div class="tree-edit tree-lock" v-show="showLock">
               <button @click="lockSwitch">
@@ -101,6 +112,7 @@
                   :node="TreeDataPool.treeData"
                   :height="height"
                   @addDevice="addCamera"
+                  @import="importCameras"
                 />
               </el-menu-item-group>
             </el-submenu>
@@ -213,6 +225,20 @@
           <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>
@@ -225,10 +251,15 @@
   updateStatus
 } from "@/api/localVedio";
 
+import {
+  createCamera,
+} from "@/api/camera";
+
 import bus from "@/plugin/bus"
 import TreeMenu from "@/components/treeMenu/index";
 import LocalVedioList from '@/components/subComponents/LocalVedioList';
 import FileUpload from '@/components/subComponents/FileUpload/index';
+import XLSX from 'xlsx'
 
 export default {
   components: {
@@ -335,27 +366,11 @@
       ],
       timeout: null,
       fileUploadBox: false,
-      loadingGBTree: false
+      loadingGBTree: false,
+      importAreaId: "",
+      menuLoading: false
     };
   },
-  // 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() {
     if (this.showCam) {
       this.TreeDataPool.treeActiveName = "camera"
@@ -507,6 +522,91 @@
     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;
+
+            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);
+
+              createCamera(camera).then(rsp => {
+                if (rsp && rsp.success) {
+                  succeed++;
+                } else {
+                  failed++;
+                }
+              }).catch(err => {
+                failed++;
+              })
+            }
+
+            let _this = this
+            setTimeout(() => {
+              this.menuLoading = false;
+              _this.$message({
+                type: "success",
+                message: "鎿嶄綔瀹屾垚, 瀵煎叆鎴愬姛:" + succeed + "涓� 澶辫触:" + failed + "涓�"
+              })
+              _this.TreeDataPool.fetchTreeData();
+            }, 2000)
+          }
+        } 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>
@@ -736,6 +836,10 @@
 .camera-add {
   left: 128px;
 }
+
+.import-btn {
+  left: 156px;
+}
 .tree-font {
   font-family: PingFangSC-Medium;
   font-size: 14px;
diff --git a/src/components/treeMenu/index.vue b/src/components/treeMenu/index.vue
index bd8a7a7..7665569 100644
--- a/src/components/treeMenu/index.vue
+++ b/src/components/treeMenu/index.vue
@@ -97,6 +97,15 @@
                 ></span>
               </button>
             </el-tooltip>
+
+            <el-tooltip content="瀵煎叆璁惧" placement="bottom" popper-class="atooltip">
+              <button @click="importCameras(_.model.id)">
+                <span
+                  class="iconfont icondaoru"
+                  style="font-size:17px; margin-left:9px; position:relative; top:2px;"
+                ></span>
+              </button>
+            </el-tooltip>
           </div>
         </div>
       </template>
@@ -156,16 +165,10 @@
       hoverNodeId: "",
       itemClickEvents: {
         dblclick: (VNode, item, e) => {
-          console.log('dblclick',item);
-          console.log('dblclick',this.TreeDataPool.videoArr);
-          console.log(this.app)
-          // if (item.type !== "4" || this.app !== "Video") {
-          //   return;
-          // }
           if (item.type !== "4" || this.app !== "Camera") {
             return;
           }
-          console.log('activeForceChoose',this.TreeDataPool.activeForceChoose)
+          // console.log('activeForceChoose', this.TreeDataPool.activeForceChoose)
           this.TreeDataPool.activeVideoId = item.id;
           let videoArr = this.TreeDataPool.videoArr;
           let nullVideoIndex = "";
@@ -175,7 +178,6 @@
             this.TreeDataPool.activeVideoIndex !== "" &&
             this.TreeDataPool.activeVideoIndex <= videoArr.length - 1
           ) {
-            console.log('setVideoArr')
             this.TreeDataPool.setVideoArr(this.TreeDataPool.activeVideoIndex, undefined, this);
             this.$nextTick(() => {
               this.TreeDataPool.setVideoArr(
@@ -257,6 +259,9 @@
     addCamera(node) {
       this.$emit("addDevice", node);
     },
+    importCameras(node) {
+      this.$emit("import", node);
+    },
     addNode(event, node) {
       this.dialogForm = {
         text: "",
@@ -316,7 +321,7 @@
       this.showDialog = true;
     },
     itemClick(node, item, e) {
-      console.log('jsTree index.vue',item)
+      // console.log('jsTree index.vue', item)
       this.TreeDataPool.selectedNode = item;
       this.TreeDataPool.updateSelectedNodes();
       this.TreeDataPool.treeType = this.treeName;
diff --git a/src/pages/cameraAccess/components/CameraInfo.vue b/src/pages/cameraAccess/components/CameraInfo.vue
index 83ef28a..24b9f41 100644
--- a/src/pages/cameraAccess/components/CameraInfo.vue
+++ b/src/pages/cameraAccess/components/CameraInfo.vue
@@ -207,25 +207,6 @@
       eventAudio: new Audio(),
       soundPath: '',
       form: {
-        latitude: 0,
-        rtsp: "",
-        longitude: 0,
-        name: "",
-        addr: "",
-        alias: "",
-        areaid: "",
-        brand: "",
-        id: "",
-        ip: "",
-        reserved: "",
-        run_type: 0,
-        isAI: false,
-        username: "",
-        password: "",
-        cameraType: 0,
-        resolution: "",
-        voiceId: "",
-        voiceEnable: false
       },
       // 璁板綍娣诲姞鐘舵��
       isAdd: false,
@@ -321,7 +302,7 @@
       if (node.type === "4") {
         getCameraInfo(node.id).then(res => {
           if (res.success) {
-            console.log(res, '鑾峰彇鎽勫儚鏈轰俊鎭�')
+            // console.log(res, '鑾峰彇鎽勫儚鏈轰俊鎭�')
             if (res.data.resolutions) {
               let list = res.data.resolutions.map(i => {
                 let obj = {}
@@ -353,20 +334,22 @@
     // 淇濆瓨
     onSubmit(formName) {
       let list = this.$refs.cameraEditor.getResult()
-      console.log(list, "sensor")
+      // console.log(list, "sensor")
       // id涓虹┖锛屾柊澧炴憚鍍忔満
       this.$refs[formName].validate(async valid => {
         if (valid) {
           const isRequire = this.verifyRequrie();
           if (!isRequire) return false;
+
+          this.form.latitude = Number.isNaN(parseFloat(this.form.latitude)) ? 0 : parseFloat(this.form.latitude);
+          this.form.longitude = Number.isNaN(parseFloat(this.form.longitude)) ? 0 : parseFloat(this.form.longitude);
+          this.form.sensors = list
+          this.form.resolution_width = Number(this.form.resolution.split("*")[0])
+          this.form.resolution_height = Number(this.form.resolution.split("*")[1])
+
           // 鏇存柊
           if (this.form.id !== "") {
             this.form.areaid = this.TreeDataPool.getParent(this.form.id, this.isGb28182);
-            this.form.latitude = Number.isNaN(parseFloat(this.form.latitude)) ? 0 : parseFloat(this.form.latitude);
-            this.form.longitude = Number.isNaN(parseFloat(this.form.longitude)) ? 0 : parseFloat(this.form.longitude);
-            this.form.sensors = list
-            this.form.resolution_width = Number(this.form.resolution.split("*")[0])
-            this.form.resolution_height = Number(this.form.resolution.split("*")[1])
             updateCameraInfo(this.form).then(rsp => {
               if (rsp.success) {
                 this.$notify({
@@ -384,26 +367,7 @@
             });
           } else {
             this.form.areaid = this.addParentId;
-            this.form.sensors = list
-            const { ...json } = this.form;
-            createCamera({
-              latitude: parseFloat(json.latitude),
-              rtsp: this.form.rtsp,
-              longitude: parseFloat(json.longitude),
-              name: this.form.name,
-              addr: this.form.addr,
-              areaid: this.form.areaid,
-              brand: this.form.brand,
-              id: this.form.id,
-              ip: this.form.ip,
-              port: parseFloat(json.port),
-              reserved: this.form.reserved,
-              run_type: this.form.isAI ? this.form.run_type : -1,
-              username: this.form.username,
-              password: this.form.password,
-              areaId: this.form.areaId,
-              sensors: this.form.sensors
-            }).then(rsp => {
+            createCamera(this.form).then(rsp => {
               if (rsp.success) {
                 this.$notify({
                   type: "success",
@@ -494,7 +458,7 @@
         id: "",
         ip: "",
         reserved: "",
-        run_type: 0,
+        run_type: -1,
         isAI: false,
         username: "",
         password: "",
@@ -508,96 +472,6 @@
       this.isAdd = true;
       this.addParentId = node;
       this.initFormData();
-    },
-    //瀹炴椂銆佽疆璇㈠垏鎹�
-    changePoll(row) {
-      // console.log(row,'瀹炴椂銆佽疆璇㈠垏鎹�',this.form,this.PollData.RealTimeSum)
-      //鍒ゆ柇鏄柊澧炶繕鏄洿鏂�
-      if (this.form.id && this.form.id !== undefined) {
-        if (this.PollData.RealTimeSum < 16) {
-          if (row.value) {
-            this.form.run_type = 1
-          } else {
-            this.form.run_type = 0
-          }
-          changeRunType({ camera_ids: [this.form.id], run_type: this.form.run_type }).then(
-            rsp => {
-              if (rsp && rsp.success) {
-                this.$notify({
-                  type: "success",
-                  message: "閰嶇疆鎴愬姛"
-                });
-              } else {
-                this.$notify({
-                  type: "error",
-                  message: "閰嶇疆澶辫触"
-                });
-              }
-            }
-          );
-        } else {
-          if (this.form.run_type === 1) {
-            this.form.run_type = 0
-            changeRunType({ camera_ids: [this.form.id], run_type: this.form.run_type }).then(
-              rsp => {
-                if (rsp && rsp.success) {
-                  this.$notify({
-                    type: "success",
-                    message: "閰嶇疆鎴愬姛"
-                  });
-                } else {
-                  this.$notify({
-                    type: "error",
-                    message: "閰嶇疆澶辫触"
-                  });
-                }
-              }
-            );
-          }
-          this.$nextTick(() => {
-            this.$set(this.form, 'run_type', 0)
-          })
-          // this.$notify({
-          //   type: 'warning',
-          //   message: '瀹炴椂澶勭悊璺暟宸茶揪鏈�澶у鐞嗚矾鏁帮紒'
-          // })
-        }
-        this.TreeDataPool.fetchTreeData();
-        this.PollData.statisticTaskInfo();
-      }
-    },
-    //鏄惁杩涜瑙嗛鍒嗘瀽澶勭悊
-    pollEnable(row) {
-      // console.log(row,'瀹炴椂銆佽疆璇㈠垏鎹�')
-      if (row) {
-        if (this.PollData.RealTimeSum < 16) {
-          this.form.run_type = 1
-        } else {
-          this.form.run_type = 0
-        }
-      } else {
-        this.form.run_type = -1
-      }
-      if (this.form.id && this.form.id !== undefined) {
-        changeRunType({ camera_ids: [this.form.id], run_type: this.form.run_type }).then(
-          rsp => {
-            if (rsp && rsp.success) {
-              this.$notify({
-                type: "success",
-                message: "閰嶇疆鎴愬姛"
-              });
-            } else {
-              this.$notify({
-                type: "error",
-                message: "閰嶇疆澶辫触"
-              });
-            }
-            this.selectCamera(this.TreeDataPool.selectedNode)
-          }
-        );
-      }
-      this.TreeDataPool.fetchTreeData();
-      this.PollData.statisticTaskInfo();
     }
   }
 };
diff --git a/src/scripts/httpRequest.ts b/src/scripts/httpRequest.ts
index 846a592..a4f3cb4 100644
--- a/src/scripts/httpRequest.ts
+++ b/src/scripts/httpRequest.ts
@@ -154,23 +154,6 @@
           errJson.message = `杩炴帴鍑洪敊(${error.response.status})!`
       }
 
-      if (errJson.status >= 400 && errJson.status < 500) {
-        // 璺宠浆閿欒椤甸潰
-        // router.push({
-        //   path: "/error",
-        //   query: errJson
-        // });
-      } else {
-        // 鏈嶅姟鍣ㄩ敊璇��鍑虹郴缁燂紝寮圭獥鎻愮ず
-        // Message({
-        //   showClose: true,
-        //   message: errJson.message,
-        //   type: "error"
-        // });
-        // router.push({
-        //   path: "/login"
-        // });
-      }
     } else {
       errJson.message = '杩炴帴鏈嶅姟鍣ㄥけ璐�!'
       Notification({

--
Gitblit v1.8.0