From 1e4a3f702623a46bcd53dbc96e235d51e0edb155 Mon Sep 17 00:00:00 2001
From: zhangzengfei <zhangzengfei@smartai.com>
Date: 星期五, 05 八月 2022 04:13:02 +0800
Subject: [PATCH] 管理中心添加分析

---
 src/api/es.ts                            |   70 +
 src/views/manageCenter/index.vue         | 1064 +++++++++++---------------
 src/package.json                         |    5 
 src/views/login/components/loginForm.vue |  215 ++---
 src/views/search/Searching.vue           |  654 +++++++---------
 src/Pool/VideoPhotoData.ts               |  247 +++---
 src/main.ts                              |   57 
 7 files changed, 1,065 insertions(+), 1,247 deletions(-)

diff --git a/src/Pool/VideoPhotoData.ts b/src/Pool/VideoPhotoData.ts
index 08ad20c..f6f7cab 100644
--- a/src/Pool/VideoPhotoData.ts
+++ b/src/Pool/VideoPhotoData.ts
@@ -6,69 +6,69 @@
   findPersonByPic,
   findPerson,
   addToBase
-} from "@/api/search";
+} from "@/api/search"
 export default class VideoPhotoData {
-  public searchFrom: string = 'search';
-  public preCards: Array<object> = [];
-  public cards: Array<object> = [];
-  public persons: Array<object> = [];
+  public searchFrom: string = "search"
+  public preCards: Array<object> = []
+  public cards: Array<object> = []
+  public persons: Array<object> = []
   public activeName: string = "pic"
-  public page: number = 1;
-  public size: number;
-  public pageSizeOption: Array<number>;
-  public alarmlevel: Array<object>;
-  public dictionary: object = {};
-  public monitorLevel: Array<object> = [];
-  public queryAlarmlevel: Array<string> = [];
-  public inputValue: string;
-  public searchTime: Array<string>;
-  public showType: string;
-  public tabs: Array<object>;
-  public blackList: Array<object> = [];
-  public selectBlacks: Array<object> = [];
-  public whiteList: Array<object> = [];
-  public selectWhites: Array<object> = [];
-  public queryTabs: Array<string> = [];
-  public compareTabs: Array<string> = [];
-  public tasks: Array<object>;
-  public queryTasks: Array<string> = [];
-  public treeNodes: Array<string>;
-  public total: number = 0;
-  public tabsForUploadImg: Array<object> = [];
-  public picUrl: string = "";
-  public threshold: number = 60;
-  public activeCard: number | string = "";
-  public uploadImg: any = "";
-  public captureId: string = "";
-  public compareNum: string = "";
-  public compTargetId: string = "";
-  public compTargetType: string = "1";
-  public rightSectionDisplay: boolean = false;
-  public scrollContainDom: any = '';
-  public uploadDiaplay: boolean = false;
-  public uploadType: boolean = false;
+  public page: number = 1
+  public size: number
+  public pageSizeOption: Array<number>
+  public alarmlevel: Array<object>
+  public dictionary: object = {}
+  public monitorLevel: Array<object> = []
+  public queryAlarmlevel: Array<string> = []
+  public inputValue: string
+  public searchTime: Array<string>
+  public showType: string
+  public tabs: Array<object>
+  public blackList: Array<object> = []
+  public selectBlacks: Array<object> = []
+  public whiteList: Array<object> = []
+  public selectWhites: Array<object> = []
+  public queryTabs: Array<string> = []
+  public compareTabs: Array<string> = []
+  public tasks: Array<object>
+  public queryTasks: Array<string> = []
+  public treeNodes: Array<string>
+  public total: number = 0
+  public tabsForUploadImg: Array<object> = []
+  public picUrl: string = ""
+  public threshold: number = 60
+  public activeCard: number | string = ""
+  public uploadImg: any = ""
+  public captureId: string = ""
+  public compareNum: string = ""
+  public compTargetId: string = ""
+  public compTargetType: string = "1"
+  public rightSectionDisplay: boolean = false
+  public scrollContainDom: any = ""
+  public uploadDiaplay: boolean = false
+  public uploadType: boolean = false
 
   constructor() {
-    this.cards = [];
-    this.size = 60;
-    this.pageSizeOption = [30, 60, 120]
-    this.alarmlevel = [];
-    this.inputValue = "";
-    this.searchTime = [];
-    this.showType = "search";
-    this.tabs = [];
-    this.tasks = [];
-    this.treeNodes = [];
+    this.cards = []
+    this.size = 60
+    this.pageSizeOption = [30, 60, 120, 1200]
+    this.alarmlevel = []
+    this.inputValue = ""
+    this.searchTime = []
+    this.showType = "search"
+    this.tabs = []
+    this.tasks = []
+    this.treeNodes = []
   }
 
   clearStatus() {
     //this.cards = [];
-    this.page = 1;
-    this.size = 60;
+    this.page = 1
+    this.size = 60
     this.pageSizeOption = [30, 60, 120]
-    this.alarmlevel = [];
-    this.inputValue = "";
-    this.showType = "search";
+    this.alarmlevel = []
+    this.inputValue = ""
+    this.showType = "search"
   }
 
   async querySearchList() {
@@ -85,34 +85,33 @@
       treeNodes: this.treeNodes,
       dataSource: "camera"
     }
-    if (this.searchFrom == 'cluster') {
+    if (this.searchFrom == "cluster") {
       param.isAll = true
     }
-    const rsp: any = await getSearchList(param);
+    const rsp: any = await getSearchList(param)
     if (rsp && rsp.success) {
       this.cards.length = 0 // 娓呬袱娆★紝绗竴娆℃槸涓轰簡鐐瑰畬涔嬪悗涓嶄細鍑虹幇涔嬪墠鏁版嵁鐨勬畫褰憋紝杩欐鏄负浜嗛槻姝㈠洜涓哄紓姝ラ棶棰樹袱娆¤姹備細鍑虹幇鍙屽�嶆暟鎹殑闂
       this.preCards.length = 0
       if (rsp.data.datalist) {
-        rsp.data.datalist.forEach(element => {
+        rsp.data.datalist.forEach((element) => {
+          if (element.activeObject.targetInfo && element.activeObject.targetInfo.length === 0) {
+            element.activeObject.targetInfo = null
+          }
 
-    if(element.activeObject.targetInfo&&element.activeObject.targetInfo.length === 0) {
-      element.activeObject.targetInfo = null
-    }
-    
-    if(element.list[0].targetInfo&&element.list[0].targetInfo.length === 0) {
-      element.list[0].targetInfo = null
-    }
+          if (element.list[0].targetInfo && element.list[0].targetInfo.length === 0) {
+            element.list[0].targetInfo = null
+          }
 
           element.ownerPage = this.page
-          this.cards.push(element as any);
+          this.cards.push(element as any)
           // 鍙厑璁告瘡涓猚ard娓叉煋涓�寮犲浘鐗�
           // var obj = {activeObject: element.activeObject,ownerPage: element.ownerPage,list: [],length: element.list.length}
           // obj.list.push(element.activeObject)
           // this.preCards.push(obj)
-        });
+        })
       }
       //console.log("cards鐨勬暟閲�",this.cards)
-      this.total = rsp.data.total;
+      this.total = rsp.data.total
     }
   }
 
@@ -131,17 +130,17 @@
       threshold: this.threshold,
       isAll: this.searchFrom == "cluster" ? true : false
     }
-    const rsp: any = await findPersonByPic(param);
+    const rsp: any = await findPersonByPic(param)
     if (rsp && rsp.success) {
-      rsp.data.totalList.forEach(element => {
+      rsp.data.totalList.forEach((element) => {
         var obj = {
-          activeObject: (element as any),
+          activeObject: element as any,
           list: []
         }
         element.ownerPage = this.page
-        obj.list.push((element as any))
+        obj.list.push(element as any)
         this.cards.push(obj)
-      });
+      })
       // console.log("浠ュ浘鎼滃浘鏌ュ洖鏉ョ殑浜�",this.persons)
       this.total = rsp.data.total
       this.compareNum = rsp.data.compareNum
@@ -181,20 +180,20 @@
         compTargetId: this.compTargetId,
         compTargetType: compType,
         databases: this.compareTabs,
-        threshold: this.threshold,
+        threshold: this.threshold
       }
     }
-    const rsp: any = await findPersonByPic(param);
+    const rsp: any = await findPersonByPic(param)
     if (rsp && rsp.success) {
-      rsp.data.totalList.forEach(element => {
+      rsp.data.totalList.forEach((element) => {
         var obj = {
-          activeObject: (element as any),
+          activeObject: element as any,
           list: []
         }
         element.ownerPage = this.page
-        obj.list.push((element as any))
+        obj.list.push(element as any)
         this.cards.push(obj)
-      });
+      })
       this.total = rsp.data.total
       this.compareNum = rsp.data.compareNum
     }
@@ -215,65 +214,73 @@
       threshold: this.threshold,
       isAll: this.searchFrom == "cluster" ? true : false
     }
-    const rsp: any = await findPerson(param);
+    const rsp: any = await findPerson(param)
     if (rsp && rsp.success) {
-      rsp.data.totalList.forEach(element => {
+      rsp.data.totalList.forEach((element) => {
         var obj = {
-          activeObject: (element as any),
+          activeObject: element as any,
           list: []
         }
         element.ownerPage = this.page
-        obj.list.push((element as any))
+        obj.list.push(element as any)
         this.cards.push(obj)
-      });
+      })
       this.total = rsp.data.total
       // console.log("findPersonByPage---", this.total, this.persons)
     }
   }
   async queryTagList() {
-    const rsp: any = await getTagList({});
+    const rsp: any = await getTagList({})
     this.tabsForUploadImg.splice(0, this.tabsForUploadImg.length)
     if (rsp && rsp.success) {
-      var arr1 = new Array
-      arr1 = rsp.data&&rsp.data.tags.filter(i => {
-        if (i.status === 1) {
-          i.title = i.title + '(宸插垹闄�)'
-          return i
-        }
-      });
-      this.tabs = rsp.data&&rsp.data.tags.filter(function (i) {
-        if (i.status !== 1) {
-          return i
-        }
-      })
+      var arr1 = new Array()
+      arr1 =
+        rsp.data &&
+        rsp.data.tags.filter((i) => {
+          if (i.status === 1) {
+            i.title = i.title + "(宸插垹闄�)"
+            return i
+          }
+        })
+      this.tabs =
+        rsp.data &&
+        rsp.data.tags.filter(function(i) {
+          if (i.status !== 1) {
+            return i
+          }
+        })
       this.tabs.push(...arr1)
-      this.tabsForUploadImg.push({ key: "esData", title: "鎶撴媿搴�" });
-      rsp.data.tags.forEach(element => {
-        this.tabsForUploadImg.push(element as any);
-      });
+      this.tabsForUploadImg.push({ key: "esData", title: "鎶撴媿搴�" })
+      rsp.data.tags.forEach((element) => {
+        this.tabsForUploadImg.push(element as any)
+      })
       // 鏀剧疆榛戠櫧鍚嶅崟 0涓虹櫧鍚嶅崟
       this.blackList.length = 0
       this.whiteList.length = 0
       var josn = JSON.stringify(rsp)
       var resp = JSON.parse(josn)
-      resp.data.tags.forEach(i => {
-        if (i.status === 0 && i.bwType === "0") { //鐧藉悕鍗�
-          if (i.analyServerId === "") { //鍚屾搴�
-            i.title = i.title + '(鍚屾搴�)'
+      resp.data.tags.forEach((i) => {
+        if (i.status === 0 && i.bwType === "0") {
+          //鐧藉悕鍗�
+          if (i.analyServerId === "") {
+            //鍚屾搴�
+            i.title = i.title + "(鍚屾搴�)"
             this.whiteList.push(i)
           } else {
             this.whiteList.push(i)
           }
         }
-        if (i.status === 0 && i.bwType === "1") { //榛戝悕鍗�
-          if (i.analyServerId === "") { //鍚屾搴�
-            i.title = i.title + '(鍚屾搴�)'
+        if (i.status === 0 && i.bwType === "1") {
+          //榛戝悕鍗�
+          if (i.analyServerId === "") {
+            //鍚屾搴�
+            i.title = i.title + "(鍚屾搴�)"
             this.blackList.push(i)
           } else {
             this.blackList.push(i)
           }
         }
-      });
+      })
     } else {
       // this.$notify({
       //   title: "澶辫触",
@@ -284,36 +291,36 @@
   }
 
   async queryTaskList() {
-    let params: any = {};
-    if (this.searchFrom == 'cluster') {
+    let params: any = {}
+    if (this.searchFrom == "cluster") {
       params.isPlatform = 1
     }
     console.log(params)
-    const rsp: any = await getTaskList(params);
+    const rsp: any = await getTaskList(params)
     if (rsp && rsp.success) {
       // this.tasks.splice(0, this.tasks.length)
       // rsp.data.forEach(element => {
       //   this.tasks.push((element as any).task);
       // });
-      let taskNames = [];
-      this.tasks = [];
+      let taskNames = []
+      this.tasks = []
       rsp.data.aggs.forEach((d: any) => {
         if (taskNames.indexOf(d.name) < 0) {
-          taskNames.push(d.name);
+          taskNames.push(d.name)
           this.tasks.push(d)
         } else {
-          let repeatOne = this.tasks.find((one: any) => one.name == d.name);
-          repeatOne['id'] += `,${d.id}`;
-          repeatOne['isDelete'] = repeatOne['isDelete'] && d.isDelete
+          let repeatOne = this.tasks.find((one: any) => one.name == d.name)
+          repeatOne["id"] += `,${d.id}`
+          repeatOne["isDelete"] = repeatOne["isDelete"] && d.isDelete
         }
-      });
+      })
     }
   }
 
   async queryDictionary() {
-    const rsp: any = await getAlarmLevel({});
+    const rsp: any = await getAlarmLevel({})
     if (rsp && rsp.success) {
-      this.dictionary = rsp.data;
+      this.dictionary = rsp.data
       // console.log("瀛楀吀鏄細", this.dictionary)
 
       //this.dictionary['ALARMLEVEL'].unshift({ name: '鎾ら槻', value: "-1" })
diff --git a/src/api/es.ts b/src/api/es.ts
index d087a4d..f80f325 100644
--- a/src/api/es.ts
+++ b/src/api/es.ts
@@ -1,22 +1,82 @@
-import request from "@/scripts/httpRequest";
+import request from "@/scripts/httpRequest"
+
+/*杈撳叆    
+
+    repeated string taskNames = 1;      //鍦烘櫙鍚嶇О闆嗗悎 
+    repeated string treeNodes = 2;      //鎽勫儚鏈篿d闆嗗悎
+    repeated string searchTime = 3;     //鏃堕棿
+    string alarmLevel = 5;              //鎶ヨ绾у埆
+
+{
+    "taskNames": [
+        "鍦烘櫙澶氱畻娉�",
+        "鍦烘櫙1"
+    ],
+    "treeNodes": [
+        "29aeffc7-d51a-447b-ae30-5916690f40e4"
+    ],
+    "searchTime": [
+        "2022-07-28 00:00:00",
+        "2022-08-03 23:59:59"
+    ],
+    "alarmLevel": "涓�绾�"
+}
+
+浠ヤ笂"taskNames"锛�"treeNodes"锛�"alarmLevel"閫夋嫨鍏ㄩ儴锛堥〉闈腑閫夋嫨鍏ㄩ儴锛夌洿鎺ヤ紶绌烘垨涓嶄紶锛屾棩鏈熶负鏁扮粍锛岀涓�涓负寮�濮嬫椂闂达紝绗簩涓负缁撴潫鏃堕棿銆�
+
+杈撳嚭涓篵ase64
+
+{
+    "code": 200,
+    "data": {
+        "warningRate": "eyJidWNrZXRzIjpbeyJkb2NfY291bnQiOjQsImtleSI6M30seyJkb2NfY291bnQiOjMsImtleSI6Mn0seyJkb2NfY291bnQiOjEsImtleSI6MX1dLCJ0b3RhbCI6MzI1N30=",
+        "warningTable": "W3siZG9jX2NvdW50Ijo4MDEsImtleSI6MTY1OTM5ODQwMDAwMCwia2V5X2FzX3N0cmluZyI6IjIwMjItMDgtMDIifSx7ImRvY19jb3VudCI6MjQ1Niwia2V5IjoxNjU5NDg0ODAwMDAwLCJrZXlfYXNfc3RyaW5nIjoiMjAyMi0wOC0wMyJ9XQ==",
+        "warningStatics": "W3siZG9jX2NvdW50IjozLCJrZXkiOjE2NTk0ODQ4MDAwMDAsImtleV9hc19zdHJpbmciOiIyMDIyLTA4LTAzIn1d",
+        "warningChartRate": "W3siZG9jX2NvdW50IjozMjM4LCJrZXkiOiLlnLrmma/lpJrnrpfms5UifSx7ImRvY19jb3VudCI6MTksImtleSI6IuWcuuaZrzEifV0="
+    },
+    "msg": "璇锋眰澶勭悊鎴愬姛",
+    "success": true
+}
+
+    bytes warningRate = 1;         //鎺掓煡鐜囷紝鏁存敼鐜囷紝澶勭悊鐜� 鎵�闇�鏁版嵁 key 1=璇姤鏁版嵁,2=宸叉暣鏀�,3=鏈暣鏀� doc_count=鏁伴噺 total=鎬婚噺 
+    bytes warningTable = 2;        //鍛婅鏁伴噺瓒嬪娍鎵�闇�鏁版嵁 "key_as_string" 鎸夋棩鏈熲�樺ぉ鈥欏垎妗�   doc_count鈥滄暟閲忊��
+    bytes warningStatics = 3;      //鏁存敼鏁伴噺缁熻鎵�闇�鏁版嵁 "key_as_string" 鎸夋棩鏈熲�樺ぉ鈥欏垎妗�   doc_count鈥滄暟閲忊��
+    bytes warningChartRate = 4;    //鍛婅绫诲瀷鍗犳瘮鎵�闇�鏁版嵁 
+
+"warningRate": {"buckets":[{"doc_count":4,"key":3},{"doc_count":3,"key":2},{"doc_count":1,"key":1}],"total":3257}                                                                            
+//key 1=璇姤鏁版嵁,2=宸叉暣鏀�,3=鏈暣鏀� doc_count=鏁伴噺 total=鎬婚噺  
+
+"warningTable": [{"doc_count":801,"key":1659398400000,"key_as_string":"2022-08-02"},{"doc_count":2456,"key":1659484800000,"key_as_string":"2022-08-03"}]     
+//"key_as_string" 鎸夋棩鏈熲�樺ぉ鈥欏垎妗�   doc_count鈥滄暟閲忊��
+
+"warningStatics": [{"doc_count":3,"key":1659484800000,"key_as_string":"2022-08-03"} 							  //"key_as_string" 鎸夋棩鏈熲�樺ぉ鈥欏垎妗�   doc_count鈥滄暟閲忊��
+
+"warningChartRate": [{"doc_count":3238,"key":"鍦烘櫙澶氱畻娉�"},{"doc_count":19,"key":"鍦烘櫙1"}]						//key=鎶ヨ绫诲瀷   doc_count鈥滄暟閲忊�� */
+export const analysisReport = (data: any) => {
+  return request({
+    url: "/cloud/api-s/es/analysisReport",
+    method: "post",
+    data
+  })
+}
 
 export const findTagList = () => {
   return request({
     url: "/data/api-v/es/tagList",
     method: "post"
-  });
-};
+  })
+}
 
 export const findBaseByRuleEditor = () => {
   return request({
-    url: '/data/api-v/dbtable/findAllDbTablesByCurServer',
+    url: "/data/api-v/dbtable/findAllDbTablesByCurServer",
     method: "get"
   })
 }
 
 export const getCameraFaceData = (data: any) => {
   return request({
-    url: '/data/api-v/customer/behavior',
+    url: "/data/api-v/customer/behavior",
     method: "post",
     data
   })
diff --git a/src/main.ts b/src/main.ts
index 5f1a66d..886fb18 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,41 +1,40 @@
-import Vue from "vue";
-import App from "./App.vue";
-import router from "./router";
-import store from "./store";
-import "./plugins/element.js";
-import moment from "moment"; //瀵煎叆鏂囦欢
-import Mixin from "./mixins";
-import numeral from 'numeral';
-import preview from "vue-photo-preview";
-import "vue-photo-preview/dist/skin.css";
-  import * as VueWindow from "@hscmap/vue-window";
+import Vue from "vue"
+import App from "./App.vue"
+import router from "./router"
+import store from "./store"
+import "./plugins/element.js"
+import moment from "moment" //瀵煎叆鏂囦欢
+import Mixin from "./mixins"
+import numeral from "numeral"
+import preview from "vue-photo-preview"
+import "vue-photo-preview/dist/skin.css"
+import * as VueWindow from "@hscmap/vue-window"
 
-import VueAwesomeSwiper from "vue-awesome-swiper";
-import ToggleButton from 'vue-js-toggle-button';
-import {ImageShow,PwInput} from './scripts/component.js'
+import VueAwesomeSwiper from "vue-awesome-swiper"
+import ToggleButton from "vue-js-toggle-button"
+import { ImageShow, PwInput } from "./scripts/component.js"
 
-import "swiper/dist/css/swiper.css";
-import './assets/css/element-variables.scss'
-import 'vue2-animate/dist/vue2-animate.min.css'
+import "swiper/dist/css/swiper.css"
+import "./assets/css/element-variables.scss"
+import "vue2-animate/dist/vue2-animate.min.css"
 
+import JsonExcel from "vue-json-excel"
 
-
-Vue.prototype.$moment = moment; //璧嬪�间娇鐢�
-Vue.prototype.numeral = numeral;
-Vue.config.productionTip = false;
-Vue.mixin(Mixin);
-Vue.use(preview);
-  Vue.use(VueWindow);
-Vue.use(VueAwesomeSwiper as any);
+Vue.prototype.$moment = moment //璧嬪�间娇鐢�
+Vue.prototype.numeral = numeral
+Vue.config.productionTip = false
+Vue.mixin(Mixin)
+Vue.use(preview)
+Vue.use(VueWindow)
+Vue.use(VueAwesomeSwiper as any)
 Vue.use(ToggleButton)
 Vue.use(ImageShow)
 Vue.use(PwInput)
 
-
-
+Vue.component("downloadExcel", JsonExcel)
 
 export default Vue.prototype.bus = new Vue({
   router,
   store,
-  render: (h) => h(App),
-}).$mount("#app");
+  render: (h) => h(App)
+}).$mount("#app")
diff --git a/src/package.json b/src/package.json
new file mode 100644
index 0000000..7a80288
--- /dev/null
+++ b/src/package.json
@@ -0,0 +1,5 @@
+{
+  "dependencies": {
+    "js-base64": "^3.7.2"
+  }
+}
diff --git a/src/views/login/components/loginForm.vue b/src/views/login/components/loginForm.vue
index ca53a63..a4b4e5a 100644
--- a/src/views/login/components/loginForm.vue
+++ b/src/views/login/components/loginForm.vue
@@ -11,10 +11,7 @@
             class="demo-ruleForm"
           >
             <el-form-item prop="loginName">
-              <el-input
-                v-model.trim="user.loginName"
-                placeholder="璇疯緭鍏ユ墜鏈哄彿 / 鐢ㄦ埛鍚�"
-              >
+              <el-input v-model.trim="user.loginName" placeholder="璇疯緭鍏ユ墜鏈哄彿 / 鐢ㄦ埛鍚�">
                 <i slot="prefix" class="iconfont">&#xe603;</i>
               </el-input>
             </el-form-item>
@@ -42,9 +39,7 @@
               <el-link class="cursor-register" target="_blank">
                 <router-link to="/Register">娉ㄥ唽</router-link>
               </el-link>
-              <el-link class="cursor-pointer" type="primary" @click="forget"
-                >蹇樿瀵嗙爜</el-link
-              >
+              <el-link class="cursor-pointer" type="primary" @click="forget">蹇樿瀵嗙爜</el-link>
             </div>
           </el-form>
         </el-tab-pane>
@@ -72,12 +67,9 @@
               >
                 <i slot="prefix" class="iconfont icon-yanzhengma"></i>
               </el-input>
-              <el-button
-                class="code-btn"
-                :disabled="codeDisabled"
-                @click="getCode('phoneLogin')"
-                >{{ codeMsg }}</el-button
-              >
+              <el-button class="code-btn" :disabled="codeDisabled" @click="getCode('phoneLogin')">{{
+                codeMsg
+              }}</el-button>
             </el-form-item>
             <el-form-item>
               <el-button
@@ -92,9 +84,7 @@
               <el-link class="cursor-register" target="_blank">
                 <router-link to="/Register">娉ㄥ唽</router-link>
               </el-link>
-              <el-link class="cursor-pointer" type="primary" @click="forget"
-                >蹇樿瀵嗙爜</el-link
-              >
+              <el-link class="cursor-pointer" type="primary" @click="forget">蹇樿瀵嗙爜</el-link>
             </div>
           </el-form>
         </el-tab-pane>
@@ -104,18 +94,13 @@
 </template>
 
 <script>
-import {
-  tologin,
-  getLoginUserData,
-  makeVerifyCode,
-  getMenuPermission,
-} from "@/api/login";
-import { isPhone } from "@/scripts/validate";
+import { tologin, getLoginUserData, makeVerifyCode, getMenuPermission } from "@/api/login"
+import { isPhone } from "@/scripts/validate"
 
 export default {
   name: "login-pgae",
   metaInfo: {
-    title: "鐧诲綍椤�",
+    title: "鐧诲綍椤�"
   },
   data: () => ({
     activeName: "first",
@@ -130,32 +115,28 @@
     user: {
       loginName: "",
       password: "",
-      rememberMe: false,
+      rememberMe: false
     },
     phone: {
       phoneNum: "",
-      verifyCode: "",
+      verifyCode: ""
     },
     nullRule: {},
     userRules: {
-      loginName: [
-        { required: true, message: "璇疯緭鍏ョ敤鎴峰悕", trigger: "change" },
-      ],
-      password: [{ required: true, message: "璇疯緭鍏ュ瘑鐮�", trigger: "change" }],
+      loginName: [{ required: true, message: "璇疯緭鍏ョ敤鎴峰悕", trigger: "change" }],
+      password: [{ required: true, message: "璇疯緭鍏ュ瘑鐮�", trigger: "change" }]
     },
     phoneCodeRule: {
       phoneNum: [{ validator: isPhone, trigger: "change" }],
-      verifyCode: [
-        { required: true, message: "璇疯緭鍏ラ獙璇佺爜", trigger: "change" },
-      ],
+      verifyCode: [{ required: true, message: "璇疯緭鍏ラ獙璇佺爜", trigger: "change" }]
     },
     loading: "",
-    vLoading: false,
+    vLoading: false
   }),
 
   methods: {
     phoneLogin() {
-      this.nullRule = this.phoneCodeRule;
+      this.nullRule = this.phoneCodeRule
       this.$nextTick(() => {
         this.$refs["phoneLogin"].validate((valid) => {
           if (valid) {
@@ -163,23 +144,23 @@
               //       lock: true,
               text: "Loading",
               spinner: "el-icon-loading",
-              background: "rgba(0, 0, 0, 0.7)",
-            });
+              background: "rgba(0, 0, 0, 0.7)"
+            })
             let param = {
               phoneNum: this.phone.phoneNum,
-              verifyCode: this.phone.verifyCode,
-            };
-            this.testLogin(param);
+              verifyCode: this.phone.verifyCode
+            }
+            this.testLogin(param)
             // return false
           } else {
-            this.nullRule = {};
+            this.nullRule = {}
           }
-        });
-        this.nullRule = {};
-      });
+        })
+        this.nullRule = {}
+      })
     },
     userLogin() {
-      this.nullRule = this.userRules;
+      this.nullRule = this.userRules
       this.$nextTick(() => {
         this.$refs["userLogin"].validate((valid) => {
           if (valid) {
@@ -187,32 +168,32 @@
               //     lock: true,
               text: "Loading",
               spinner: "el-icon-loading",
-              background: "rgba(0, 0, 0, 0.7)",
-            });
+              background: "rgba(0, 0, 0, 0.7)"
+            })
             let param = {
               username: this.user.loginName,
-              password: this.user.password,
-            };
-            this.testLogin(param);
+              password: this.user.password
+            }
+            this.testLogin(param)
             // return false
           } else {
-            this.nullRule = {};
+            this.nullRule = {}
           }
-        });
-        this.nullRule = {};
-      });
+        })
+        this.nullRule = {}
+      })
     },
     getValidStr() {
       if (this.countdown > 0 && this.countdown <= 60) {
-        this.countdown--;
+        this.countdown--
         if (this.countdown !== 0) {
-          this.codeMsg = `${this.countdown}s`;
+          this.codeMsg = `${this.countdown}s`
         } else {
-          clearInterval(this.timer);
-          this.codeMsg = "鑾峰彇楠岃瘉鐮�";
-          this.countdown = 60;
-          this.timer = null;
-          this.codeDisabled = false;
+          clearInterval(this.timer)
+          this.codeMsg = "鑾峰彇楠岃瘉鐮�"
+          this.countdown = 60
+          this.timer = null
+          this.codeDisabled = false
         }
       }
     },
@@ -233,86 +214,82 @@
 
       this.$refs[formName].validateField("phoneNum", (res) => {
         if (res) {
-          document.querySelector(".phoneNum .el-input__inner").focus();
+          document.querySelector(".phoneNum .el-input__inner").focus()
         }
         if (!this.timer && !res) {
-          this.codeDisabled = true;
-          this.getValidStr();
-          this.timer = setInterval(this.getValidStr, 1000);
+          this.codeDisabled = true
+          this.getValidStr()
+          this.timer = setInterval(this.getValidStr, 1000)
           makeVerifyCode({ phoneNum: this.phone.phoneNum, type: 0 })
             .then(() => {
-              this.gotCode = true;
+              this.gotCode = true
             })
             .catch((err) => {
-              console.log(this.$refs[formName].fields);
-              this.$refs[formName].fields[0].validateState = "error";
+              console.log(this.$refs[formName].fields)
+              this.$refs[formName].fields[0].validateState = "error"
               setTimeout(() => {
                 if (document.querySelector(".el-form-item__error")) {
                   document.querySelector(".el-form-item__error").innerHTML =
-                    '<span class="iconfont error">&#xe600;</span>鎵嬫満鍙锋湭娉ㄥ唽,鎮ㄥ彲浠�<span class="colorBlue toRegister">鍘绘敞鍐�</span>';
+                    '<span class="iconfont error">&#xe600;</span>鎵嬫満鍙锋湭娉ㄥ唽,鎮ㄥ彲浠�<span class="colorBlue toRegister">鍘绘敞鍐�</span>'
                   this.$nextTick(() => {
-                    document
-                      .querySelector(".toRegister")
-                      .addEventListener("click", () => {
-                        this.$router.push("/register");
-                      });
-                  });
+                    document.querySelector(".toRegister").addEventListener("click", () => {
+                      this.$router.push("/register")
+                    })
+                  })
                 } else {
-                  this.$refs[formName].fields[0].validateMessage = err.data.msg;
+                  this.$refs[formName].fields[0].validateMessage = err.data.msg
                 }
-                document.querySelector(".phoneNum .el-input__inner").focus();
-              }, 100);
-            });
+                document.querySelector(".phoneNum .el-input__inner").focus()
+              }, 100)
+            })
         }
-      });
+      })
     },
     async testLogin(param) {
       tologin(param)
         .then((res) => {
-          const data = res.data;
+          const data = res.data
           const loginedInfo = {
             access_token: data.token_type + " " + data.access_token,
-            refresh_token: data.refresh_token,
-          };
-          sessionStorage.setItem("expires_in", data.expires_in);
-          sessionStorage.setItem("loginedInfo", JSON.stringify(loginedInfo));
+            refresh_token: data.refresh_token
+          }
+          sessionStorage.setItem("expires_in", data.expires_in)
+          sessionStorage.setItem("loginedInfo", JSON.stringify(loginedInfo))
 
           getMenuPermission().then((rep) => {
-            data.userInfo.permissions = rep.data.permissions;
-            sessionStorage.setItem("userInfo", JSON.stringify(data.userInfo));
-            this.$router.push("/");
-          });
-          this.loading.close();
+            data.userInfo.permissions = rep.data.permissions
+            sessionStorage.setItem("userInfo", JSON.stringify(data.userInfo))
+            this.$router.push("/manageCenter")
+          })
+          this.loading.close()
         })
         .catch((err) => {
-          this.loading.close();
+          this.loading.close()
 
           if (err.data && err.data.msg == "楠岃瘉鐮佹湁璇�") {
-            this.$refs["phoneLogin"].fields[1].validateState = "error";
+            this.$refs["phoneLogin"].fields[1].validateState = "error"
 
             setTimeout(() => {
               if (document.querySelector(".el-form-item__error")) {
                 document.querySelector(".el-form-item__error").innerHTML =
-                  '<span class="iconfont error">&#xe600;</span>楠岃瘉鐮佷笉姝g‘锛岃閲嶆柊杈撳叆';
+                  '<span class="iconfont error">&#xe600;</span>楠岃瘉鐮佷笉姝g‘锛岃閲嶆柊杈撳叆'
               } else {
-                this.$refs["phoneLogin"].fields[1].validateMessage =
-                  err.data.msg;
+                this.$refs["phoneLogin"].fields[1].validateMessage = err.data.msg
               }
-              document.querySelector(".phoneNum .el-input__inner").focus();
-            }, 100);
+              document.querySelector(".phoneNum .el-input__inner").focus()
+            }, 100)
           } else if (err.data.msg == "鐢ㄦ埛鍚嶆垨瀵嗙爜鏈夎") {
-            this.$refs["userLogin"].fields[1].validateState = "error";
+            this.$refs["userLogin"].fields[1].validateState = "error"
 
             setTimeout(() => {
               if (document.querySelector(".el-form-item__error")) {
                 document.querySelector(".el-form-item__error").innerHTML =
-                  '<span class="iconfont error">&#xe600;</span>鐢ㄦ埛鍚嶆垨瀵嗙爜鏈夎';
+                  '<span class="iconfont error">&#xe600;</span>鐢ㄦ埛鍚嶆垨瀵嗙爜鏈夎'
               } else {
-                this.$refs["userLogin"].fields[1].validateMessage =
-                  err.data.msg;
+                this.$refs["userLogin"].fields[1].validateMessage = err.data.msg
               }
-              document.querySelector(".phoneNum .el-input__inner").focus();
-            }, 100);
+              document.querySelector(".phoneNum .el-input__inner").focus()
+            }, 100)
           }
 
           //   this.$notify({
@@ -323,29 +300,29 @@
           //     offset: 57,
           //   });
           // this.$refs.pwd.focus();
-        });
+        })
       // this.loading = false
     },
     forget() {
       this.$router.push({
         path: "/Register",
         query: {
-          isReset: true,
-        },
-      });
+          isReset: true
+        }
+      })
     },
     async getLoginUserData() {
-      let json = await getLoginUserData();
+      let json = await getLoginUserData()
       if (!json.error) {
         // this.loading.close()
-        sessionStorage.setItem("userInfo", JSON.stringify(json));
+        sessionStorage.setItem("userInfo", JSON.stringify(json))
         this.$notify({
           title: "鎻愮ず",
           type: "success",
           message: "鐧诲綍鎴愬姛锛�",
           duration: 2500,
-          offset: 57,
-        });
+          offset: 57
+        })
         /* 鍒ゆ柇褰撳墠鏄惁鍦ㄧ櫥褰曢〉锛屽鏋滃湪鐧诲綍椤� */
         // if (window.location.href.indexOf('/login') !== -1) {
         //   router.push({
@@ -356,21 +333,21 @@
         //   })
         // }
         // await this.getMenuList();
-        this.$router.push("/Layout/ProductCenter");
-        return json;
+        this.$router.push("/Layout/ProductCenter")
+        return json
       } else {
         this.$notify({
           title: "鎻愮ず",
           type: "error",
           message: "鐧诲綍澶辫触锛�",
           duration: 2500,
-          offset: 57,
-        });
+          offset: 57
+        })
         // this.loading.close()
       }
-    },
-  },
-};
+    }
+  }
+}
 </script>
 
 <style lang="scss" scoped>
@@ -548,4 +525,4 @@
     }
   }
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/src/views/manageCenter/index.vue b/src/views/manageCenter/index.vue
index b629803..61c89a1 100644
--- a/src/views/manageCenter/index.vue
+++ b/src/views/manageCenter/index.vue
@@ -22,42 +22,118 @@
         </div>
       </div>
 
-      <!--  <div class="equipmentInfo">
+      <div class="heart">
+        <div class="products">
+          <div class="title">缁熻鍒嗘瀽</div>
+          <div class="productList">
+            <p class="p-statis" style=" vertical-align: top">
+              <span>鏃堕棿锛�</span>
+              <el-date-picker
+                size="mini"
+                v-model="searchTime"
+                @change="searchHandler"
+                type="datetimerange"
+                start-placeholder="寮�濮嬫棩鏈�"
+                end-placeholder="缁撴潫鏃ユ湡"
+                :default-time="['00:00:00', '23:59:59']"
+              ></el-date-picker>
+            </p>
+            <!-- <p class="p-statis" style="margin-left: 10px">
+              <b style="width: 60px">鍦烘櫙锛�</b>
+              <el-select
+                v-model="taskValues"
+                multiple
+                @change="searchingBtn"
+                :disabled="typeDisable"
+                collapse-tags
+                size="mini"
+                placeholder="璇烽�夋嫨"
+              >
+                <el-option
+                  v-for="item in VideoPhotoData.tasks"
+                  style="font-size: 12px"
+                  :key="item.id + 'x'"
+                  :value="item.id"
+                  :label="item.isDelete ? item.name + '锛堝凡鍒犻櫎锛�' : item.name"
+                  :title="item.isDelete ? item.name + '锛堝凡鍒犻櫎锛�' : item.name"
+                ></el-option>
+              </el-select>
+            </p> -->
+
+            <p class="p-statis" style="margin-left: 20px">
+              <span>閮ㄩ棬锛�</span>
+              <el-cascader
+                size="mini"
+                style="width:400px"
+                v-model="searchTree"
+                :options="menuTree"
+                :props="{ value: 'id', label: 'name', checkStrictly: true }"
+                collapse-tags
+                clearable
+                @change="handleTreeChange"
+              ></el-cascader>
+            </p>
+            <p class="p-statis" style="margin-left: 20px">
+              <span>绛夌骇锛�</span>
+              <el-select
+                v-model="alarmValues"
+                clearable
+                collapse-tags
+                size="mini"
+                style="width:140px"
+                placeholder="璇烽�夋嫨"
+              >
+                <el-option
+                  v-for="item in levelOptions"
+                  :key="item.id"
+                  :label="item.label"
+                  :value="item.value"
+                ></el-option>
+              </el-select>
+            </p>
+            <p class="p-statis" style="">
+              <el-button type="primary" size="mini" @click="searchHandler">鎼滅储</el-button>
+            </p>
+          </div>
+        </div>
+      </div>
+
+      <div class="equipmentInfo">
         <div class="equipmentCard">
-          <div class="label">璁惧鎬婚噺</div>
+          <div class="label">棰勮鎬婚噺</div>
           <div class="number">
-            34
-            <div class="upIcon iconfont">&#xe62e; 2</div>
+            {{ warningTotal }}
+            <div class="upIcon iconfont">&#xe62e;</div>
           </div>
 
           <img src="/images/manageCenter/total2.png" alt="" />
         </div>
 
         <div class="equipmentCard">
-          <div class="label">鎽勫儚鏈烘�绘暟</div>
+          <div class="label">鎺掓煡鏁伴噺</div>
           <div class="number">
-            23
-            <div class="upIcon iconfont">&#xe62e; 2</div>
+            {{ warningChecked }}
+            <div class="upIcon iconfont">&#xe62e;</div>
           </div>
 
           <img src="/images/manageCenter/total3.png" alt="" />
         </div>
 
         <div class="equipmentCard">
-          <div class="label">绠楁硶鎬绘暟</div>
+          <div class="label">鏁存敼鏁伴噺</div>
           <div class="number">
-            34
-            <div class="downIcon iconfont">&#xe651; 2</div>
+            {{ warningSolved }}
+            <div class="downIcon iconfont">&#xe651;</div>
           </div>
 
           <img src="/images/manageCenter/total4.png" alt="" />
         </div>
 
         <div class="equipmentCard">
-          <div class="label">浠诲姟鎬绘暟</div>
+          <div class="label">澶勭悊鐜�</div>
           <div class="number">
-            34
-            <div class="downIcon iconfont">&#xe651; 2</div>
+            {{ warningManage }}
+            <div class="downIcon iconfont">&#xe651;</div>
           </div>
 
           <img src="/images/manageCenter/total1.png" alt="" />
@@ -65,169 +141,81 @@
       </div>
 
       <div class="equipmentStatus">
-        <div class="left">
-          <div class="title">璁惧杩愯鐘舵�佺洃娴�</div>
-          <div class="control">
-            <div
-              class="label"
-              @click="select('day', 'selectBar')"
-              :class="{ active: selectBar === 'day' }"
-            >
+        <div class="bar-chart">
+          <div class="title">棰勮鏁伴噺瓒嬪娍</div>
+          <!-- <div class="control">
+            <div class="label" @click="select('day', 'selectBar')" :class="{ active: selectBar === 'day' }">
               浠婃棩
             </div>
-            <div
-              class="label"
-              @click="select('week', 'selectBar')"
-              :class="{ active: selectBar === 'week' }"
-            >
+            <div class="label" @click="select('week', 'selectBar')" :class="{ active: selectBar === 'week' }">
               鏈懆
             </div>
-            <div
-              class="label"
-              @click="select('month', 'selectBar')"
-              :class="{ active: selectBar === 'month' }"
-            >
+            <div class="label" @click="select('month', 'selectBar')" :class="{ active: selectBar === 'month' }">
               鏈湀
             </div>
-          </div>
+          </div> -->
           <div id="bar"></div>
         </div>
-
-        <div class="right">
-          <div class="title">璁惧绂荤嚎鏃堕暱鎺掕</div>
-          <div class="timeList scroll">
-            <div
-              class="timeItem"
-              v-for="(item, index) in timeList"
-              :key="index"
-            >
-              <div class="index">
-                {{ index / 10 >= 1 ? index : `0${index}` }}.
-              </div>
-              <div class="name">
-                {{ item.name }}
-              </div>
-              <div class="time">{{ item.time }}</div>
-            </div>
-          </div>
-        </div>
-      </div> -->
-
-      <!-- <div class="performence">
-        <div class="title">璁惧杩愯鐘舵�佺洃娴�</div>
-        <div class="control">
-          <div
-            class="label"
-            @click="select('day', 'selectForm')"
-            :class="{ active: selectForm === 'day' }"
-          >
-            浠婃棩
-          </div>
-          <div
-            class="label"
-            @click="select('week', 'selectForm')"
-            :class="{ active: selectForm === 'week' }"
-          >
-            鏈懆
-          </div>
-          <div
-            class="label"
-            @click="select('month', 'selectForm')"
-            :class="{ active: selectForm === 'month' }"
-          >
-            鏈湀
-          </div>
-        </div>
-        <div class="table-area">
-          <el-table
-            id="table"
-            ref="table"
-            tooltip-effect="dark"
-            :data="dataList"
-            :fit="true"
-            :stripe="true"
-            class="gutter"
-          >
-            <el-table-column label="搴忓彿" class-name="index">
-              <template slot-scope="scope">{{
-                scope.$index + 1 + (page - 1) * size
-              }}</template>
-            </el-table-column>
-
-            <el-table-column
-              prop="name"
-              label="璁惧鍚嶇О"
-              show-overflow-tooltip
-            ></el-table-column>
-
-            <el-table-column
-              prop="id"
-              label="璁惧ID"
-              show-overflow-tooltip
-            ></el-table-column>
-
-            <el-table-column
-              prop="mem"
-              label="鍐呭瓨"
-              show-overflow-tooltip
-            ></el-table-column>
-
-            <el-table-column
-              prop="gpu"
-              label="绠楀姏"
-              show-overflow-tooltip
-            ></el-table-column>
-
-            <el-table-column
-              prop="cpu"
-              label="cpu"
-              show-overflow-tooltip
-            ></el-table-column>
-
-            <el-table-column
-              prop="dist"
-              label="纭洏"
-              show-overflow-tooltip
-            ></el-table-column>
-          </el-table>
-          <el-pagination
-            @current-change="refrash"
-            @size-change="handleSizeChange"
-            :current-page="page"
-            :page-size="size"
-            layout="total, sizes, prev, pager, next, jumper"
-            :page-sizes="[5, 10, 15, 20, 25]"
-            :total="total"
-            background
-          ></el-pagination>
-        </div>
-      </div>
- -->
-      <div class="map">
-        <div class="title">璁惧鍦板浘鍒嗗竷</div>
-        <div id="mapChart"></div>
       </div>
 
-      <!--  <div class="hashRate">
+      <div class="hashRate">
         <div class="left">
-          <div class="title">绠楁硶棰勮鏁版嵁鍗犳瘮:</div>
+          <div class="title">棰勮鏁版嵁鍗犳瘮:</div>
           <div class="info">
-            <div class="item">
-              <div class="label">浠婃棩骞冲潎绠楀姏:</div>
-              <div class="data">45</div>
+            <div class="equipmentInfo" style="margin-top:25px">
+              <div class="equipmentCard">
+                <div class="label">鏁存敼鎬婚噺</div>
+                <div class="number">
+                  {{ solvedTotal }}
+                  <!-- <div class="upIcon iconfont">&#xe62e; 2</div> -->
+                </div>
+
+                <!-- <img src="/images/manageCenter/total2.png" alt="" /> -->
+              </div>
+              <div class="equipmentCard">
+                <div class="label">鏃ュ潎娆℃暟</div>
+                <div class="number">
+                  {{ solvedPre }}
+                  <!-- <div class="upIcon iconfont">&#xe62e; 2</div> -->
+                </div>
+
+                <!-- <img src="/images/manageCenter/total2.png" alt="" /> -->
+              </div>
             </div>
-            <div class="item">
-              <div class="label">璁惧鎬婚噺:</div>
-              <div class="data">92</div>
+
+            <div class="table-area">
+              <el-table
+                id="table"
+                ref="table"
+                tooltip-effect="dark"
+                :data="tableDataList"
+                :fit="true"
+                :stripe="true"
+                :max-height="350"
+                class="gutter"
+              >
+                <el-table-column prop="date" label="鏃ユ湡" show-overflow-tooltip></el-table-column>
+
+                <el-table-column prop="count" align="center" label="鏁存敼鏁伴噺" show-overflow-tooltip></el-table-column>
+              </el-table>
+              <el-pagination
+                @current-change="refrash"
+                @size-change="handleSizeChange"
+                :current-page="page"
+                :page-size="size"
+                layout="total, sizes, prev, pager, next, jumper"
+                :page-sizes="[5, 10, 15, 20, 25]"
+                :total="solvedTotal"
+                background
+              ></el-pagination>
             </div>
           </div>
-          <div id="scatterChart"></div>
         </div>
         <div class="right">
           <div class="title">绠楁硶棰勮鏁版嵁鍗犳瘮</div>
           <div id="pieChart"></div>
         </div>
-      </div> -->
+      </div>
     </div>
 
     <!-- 椤靛熬 -->
@@ -240,23 +228,45 @@
 import Footer from "@/components/Footer"
 import * as echarts from "echarts"
 import "echarts/map/js/china.js"
+import * as Base64 from "js-base64"
+
+import { analysisReport } from "@/api/es"
+import { getLocalCameraTree } from "@/api/area"
+import { getClusterDevList } from "@/api/clusterManage"
 
 export default {
   components: {
     IndexHeader,
     Footer
   },
-  created() {
-    this.getInfo()
-  },
-  mounted() {
-    //  this.initBar();
-    this.initMap()
-    //  this.initScatter();
-    //   this.initPie();
+  computed: {
+    solvedPre() {
+      if (this.solvedTotal == 0 || this.tableDataList.length == 0) {
+        return 0
+      }
+      return parseInt(this.solvedTotal / this.tableDataList.length)
+    },
+    warningManage() {
+      if (this.warningChecked == 0 || this.warningTotal == 0) {
+        return 0
+      }
+      return parseInt(this.warningChecked / this.warningTotal) * 100 + "%"
+    }
   },
   data() {
     return {
+      lineChart: {},
+      pieChart: {},
+      searchTree: "",
+      selectedOrg: "",
+      selectNodes: [],
+      searchTime: [
+        this.$moment()
+          .subtract(6, "days")
+          .format("YYYY-MM-DD 00:00:00"),
+        this.$moment().format("YYYY-MM-DD HH:mm:ss")
+      ],
+      alarmValues: "",
       userName: "",
       timeMsg: "",
       selectBar: "day",
@@ -287,60 +297,48 @@
         },
 
         {
-          name: "鍛婅绠$悊",
+          name: "鎺ㄩ�佺鐞�",
           icon: "/images/manageCenter/manage2.png",
           openPath: "/report",
           path: "/report",
           permission: "statisticMng"
         }
       ],
-      timeList: [
-        { name: "20.103鏈嶅姟鍣�", time: "9澶�12灏忔椂44鍒�39绉�" },
-        { name: "20.103鏈嶅姟鍣�", time: "9澶�12灏忔椂44鍒�39绉�" },
-        { name: "20.103鏈嶅姟鍣�", time: "9澶�12灏忔椂44鍒�39绉�" },
-        { name: "20.103鏈嶅姟鍣�", time: "9澶�12灏忔椂44鍒�39绉�" },
-        { name: "20.103鏈嶅姟鍣�", time: "9澶�12灏忔椂44鍒�39绉�" },
-        { name: "20.103鏈嶅姟鍣�", time: "9澶�12灏忔椂44鍒�39绉�" },
-        { name: "20.103鏈嶅姟鍣�", time: "9澶�12灏忔椂44鍒�39绉�" },
-        { name: "20.103鏈嶅姟鍣�", time: "9澶�12灏忔椂44鍒�39绉�" },
-        { name: "20.103鏈嶅姟鍣�", time: "9澶�12灏忔椂44鍒�39绉�" },
-        { name: "20.103鏈嶅姟鍣�", time: "9澶�12灏忔椂44鍒�39绉�" },
-        { name: "20.103鏈嶅姟鍣�", time: "9澶�12灏忔椂44鍒�39绉�" }
+      cameraTree: [],
+      menuTree: [],
+      levelOptions: [
+        { id: 0, value: "", label: "鍏ㄩ儴" },
+        { id: 1, value: "涓�绾�", label: "涓�绾�" },
+        { id: 2, value: "浜岀骇", label: "浜岀骇" },
+        { id: 3, value: "涓夌骇", label: "涓夌骇" },
+        { id: 4, value: "鍥涚骇", label: "鍥涚骇" },
+        { id: 5, value: "浜旂骇", label: "浜旂骇" }
       ],
       barOption: {
+        grid: {
+          left: "3%",
+          right: "3%",
+          bottom: "10%",
+          containLabel: true
+        },
         legend: {
           x: "right",
           y: "top",
-          itemHeight: 12,
-          itemWidth: 12,
+          itemHeight: 2,
+          itemWidth: 2,
           icon: "circle"
         },
         tooltip: {},
-        dataset: {
-          source: [
-            ["status", "鍦ㄧ嚎", "绂荤嚎"],
-            ["00:00", 750, 130],
-            ["02:00", 650, 230],
-            ["04:00", 750, 130],
-            ["06:00", 550, 330],
-            ["08:00", 750, 130],
-            ["10:00", 700, 180],
-            ["12:00", 850, 30],
-            ["14:00", 750, 130],
-            ["16:00", 850, 30],
-            ["18:00", 980, 0],
-            ["20:00", 750, 130],
-            ["22:00", 750, 130]
-          ]
-        },
         xAxis: {
           type: "category",
+          boundaryGap: false,
           axisTick: {
             show: false
           },
           axisLabel: {
             color: "#666"
-          }
+          },
+          data: []
         },
         yAxis: {
           axisTick: {
@@ -366,7 +364,20 @@
         // to a column of dataset.source by default.
         series: [
           {
-            type: "bar",
+            type: "line",
+            data: [],
+            areaStyle: {
+              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                {
+                  offset: 0,
+                  color: "#0066FF"
+                },
+                {
+                  offset: 1,
+                  color: "rgba(0, 102, 255, 0.25)"
+                }
+              ])
+            },
             color: {
               type: "linear",
               x: 0.02,
@@ -376,8 +387,8 @@
               colorStops: [
                 {
                   offset: 0,
-                  color: "#0066FF", // 0% 澶勭殑棰滆壊
-                  radius: ["50%", "80%"]
+                  color: "#0066FF" // 0% 澶勭殑棰滆壊
+                  // radius: ["50%", "80%"]
                 },
                 {
                   offset: 1,
@@ -393,312 +404,18 @@
                 barBorderRadius: [15, 15, 0, 0]
               }
             }
-          },
-          {
-            type: "bar",
-            color: {
-              type: "linear",
-              x: 0.02,
-              y: 0.02,
-              x2: 1,
-              y2: 1,
-              colorStops: [
-                {
-                  offset: 0,
-                  color: "#FF4B33", // 0% 澶勭殑棰滆壊
-                  radius: ["50%", "80%"]
-                },
-                {
-                  offset: 1,
-                  color: "rgba(255,75,51,0.25)" // 100% 澶勭殑棰滆壊
-                }
-              ],
-              global: false // 缂虹渷涓� false
-            },
-            itemStyle: {
-              //鏌卞舰鍥惧渾瑙掞紝榧犳爣绉讳笂鍘绘晥鏋滐紝濡傛灉鍙槸涓�涓暟瀛楀垯璇存槑鍥涗釜鍙傛暟鍏ㄩ儴璁剧疆涓洪偅涔堝
-              normal: {
-                //鏌卞舰鍥惧渾瑙掞紝鍒濆鍖栨晥鏋�
-                barBorderRadius: [15, 15, 0, 0]
-              }
-            }
-          }
-        ]
-      },
-      mapOption: {
-        visualMap: {
-          left: "right",
-          min: 0,
-          max: 10,
-          inRange: {
-            color: ["#FCFDFF", "#0065FF"]
-          },
-          itemWidth: 56,
-          itemHeight: 200,
-          text: ["10", "0"],
-          calculable: false
-        },
-        geo: {
-          //涓浗鍦板浘璁剧疆
-          map: "china",
-          scaleLimit: {
-            min: 1,
-            max: 2
-          },
-          zoom: 1,
-          top: 120,
-          label: {
-            normal: {
-              show: false
-            },
-            emphasis: {
-              show: false
-            }
-          }
-        },
-        tooltip: {
-          //鏄剧ず鎮诞绐楀彛
-          trigger: "item", //浣跨敤杩欎釜鍑芥暟杩斿洖鎮诞鍐呭
-          backgroundColor: "#FFFFFF",
-          textStyle: {
-            color: "#0064FF",
-            fontSize: "14"
-          },
-          formatter: function(params) {
-            const msg = params.data.name + ":" + params.data.value
-            return msg
-          }
-        },
-
-        series: [
-          {
-            type: "map",
-            geoIndex: 0,
-            data: [
-              {
-                name: "鍗楁捣璇稿矝",
-                value: 0,
-                eventTotal: 100,
-                specialImportant: 10,
-                import: 10,
-                compare: 10,
-                common: 40,
-                specail: 20
-              },
-              {
-                name: "鍖椾含",
-                value: 0
-              },
-              {
-                name: "澶╂触",
-                value: 0
-              },
-              {
-                name: "涓婃捣",
-                value: 0
-              },
-              {
-                name: "閲嶅簡",
-                value: 0
-              },
-              {
-                name: "娌冲寳",
-                value: 0
-              },
-              {
-                name: "娌冲崡",
-                value: 0
-              },
-              {
-                name: "浜戝崡",
-                value: 0
-              },
-              {
-                name: "杈藉畞",
-                value: 0
-              },
-              {
-                name: "榛戦緳姹�",
-                value: 0
-              },
-              {
-                name: "婀栧崡",
-                value: 0
-              },
-              {
-                name: "瀹夊窘",
-                value: 0
-              },
-              {
-                name: "灞变笢",
-                value: 4
-              },
-              {
-                name: "鏂扮枂",
-                value: 0
-              },
-              {
-                name: "姹熻嫃",
-                value: 0
-              },
-              {
-                name: "娴欐睙",
-                value: 0
-              },
-              {
-                name: "姹熻タ",
-                value: 0
-              },
-              {
-                name: "婀栧寳",
-                value: 0
-              },
-              {
-                name: "骞胯タ",
-                value: 0
-              },
-              {
-                name: "鐢樿們",
-                value: 0
-              },
-              {
-                name: "灞辫タ",
-                value: 0
-              },
-              {
-                name: "鍐呰挋鍙�",
-                value: 0
-              },
-              {
-                name: "闄曡タ",
-                value: 0
-              },
-              {
-                name: "鍚夋灄",
-                value: 0
-              },
-              {
-                name: "绂忓缓",
-                value: 0
-              },
-              {
-                name: "璐靛窞",
-                value: 0
-              },
-              {
-                name: "骞夸笢",
-                value: 0
-              },
-              {
-                name: "闈掓捣",
-                value: 0
-              },
-              {
-                name: "瑗胯棌",
-                value: 0
-              },
-              {
-                name: "鍥涘窛",
-                value: 0
-              },
-              {
-                name: "瀹佸",
-                value: 0
-              },
-              {
-                name: "娴峰崡",
-                value: 0
-              },
-              {
-                name: "鍙版咕",
-                value: 0
-              },
-              {
-                name: "棣欐腐",
-                value: 0
-              },
-              {
-                name: "婢抽棬",
-                value: 0
-              }
-            ]
-          }
-        ]
-      },
-      scatterOption: {
-        xAxis: {
-          axisTick: {
-            show: false
-          },
-          axisLine: {
-            //y杞�
-            show: false
-          },
-          splitLine: {
-            //缃戞牸绾�
-            lineStyle: {
-              color: "rgb(230, 230, 230)",
-              type: "dashed" //璁剧疆缃戞牸绾跨被鍨� dotted锛氳櫄绾�   solid:瀹炵嚎
-            },
-            show: true //闅愯棌鎴栨樉绀�
-          }
-        },
-        yAxis: {
-          axisTick: {
-            show: false
-          },
-          axisLine: {
-            //y杞�
-            show: false
-          },
-          splitLine: {
-            //缃戞牸绾�
-            lineStyle: {
-              color: "rgb(230, 230, 230)",
-              type: "dashed" //璁剧疆缃戞牸绾跨被鍨� dotted锛氳櫄绾�   solid:瀹炵嚎
-            },
-            show: true //闅愯棌鎴栨樉绀�
-          }
-        },
-
-        series: [
-          {
-            symbolSize: 20,
-            data: [
-              [10.0, 8.04],
-              [8.07, 6.95],
-              [13.0, 7.58],
-              [9.05, 8.81],
-              [11.0, 8.33],
-              [14.0, 7.66],
-              [13.4, 6.81],
-              [10.0, 6.33],
-              [14.0, 8.96],
-              [12.5, 6.82],
-              [9.15, 7.2],
-              [11.5, 7.2],
-              [3.03, 4.23],
-              [12.2, 7.83],
-              [2.02, 4.47],
-              [1.05, 3.33],
-              [4.05, 4.96],
-              [6.03, 7.24],
-              [12.0, 6.26],
-              [12.0, 8.84],
-              [7.08, 5.82],
-              [5.02, 5.68]
-            ],
-            color: "rgba(0, 101, 255, 0.5)",
-            type: "scatter"
           }
         ]
       },
       pieOption: {
+        legend: {
+          top: "bottom"
+        },
         color: [
           "rgb(54, 60, 231)",
           "rgb(54, 178, 74)",
           "rgb(255, 178, 36)",
-          "rgb(0, 190, 231)",
+          "rgb(240, 190, 231)",
           "rgb(255, 124, 31)",
           "rgb(165, 96, 255)"
         ],
@@ -706,95 +423,213 @@
           {
             name: "Nightingale Chart",
             type: "pie",
-            radius: [35, 120],
+            radius: [20, 160],
             center: ["50%", "50%"],
             roseType: "area",
             itemStyle: {
               borderRadius: 8
             },
-            data: [
-              { value: 22.45, name: "绂诲矖" },
-              { value: 20.2, name: "浜鸿劯璇嗗埆" },
-              { value: 17.96, name: "杞﹁締璇嗗埆" },
-              { value: 15.71, name: "鐫″矖" },
-              { value: 12.86, name: "瀹夊叏甯芥娴�" },
-              { value: 10.82, name: "涓綋闈欐" }
-            ]
+            label: {
+              show: false
+            },
+            data: []
           }
         ]
       },
-      dataList: [
-        {
-          name: "2.154",
-          id: "DSVAD010120190703",
-          mem: "78%",
-          gpu: "60%",
-          cpu: "23%",
-          dist: "10%"
-        },
-        {
-          name: "2.154",
-          id: "DSVAD010120190703",
-          mem: "78%",
-          gpu: "60%",
-          cpu: "23%",
-          dist: "10%"
-        },
-        {
-          name: "2.154",
-          id: "DSVAD010120190703",
-          mem: "78%",
-          gpu: "60%",
-          cpu: "23%",
-          dist: "10%"
-        },
-        {
-          name: "2.154",
-          id: "DSVAD010120190703",
-          mem: "78%",
-          gpu: "60%",
-          cpu: "23%",
-          dist: "10%"
-        },
-        {
-          name: "2.154",
-          id: "DSVAD010120190703",
-          mem: "78%",
-          gpu: "60%",
-          cpu: "23%",
-          dist: "10%"
-        },
-        {
-          name: "2.154",
-          id: "DSVAD010120190703",
-          mem: "78%",
-          gpu: "60%",
-          cpu: "23%",
-          dist: "10%"
-        },
-        {
-          name: "2.154",
-          id: "DSVAD010120190703",
-          mem: "78%",
-          gpu: "60%",
-          cpu: "23%",
-          dist: "10%"
-        },
-        {
-          name: "2.154",
-          id: "DSVAD010120190703",
-          mem: "78%",
-          gpu: "60%",
-          cpu: "23%",
-          dist: "10%"
-        }
-      ],
+      tableDataList: [],
       page: 1,
       size: 5,
-      total: 30
+      solvedTotal: 0,
+      warningTotal: 0,
+      warningChecked: 0,
+      warningSolved: 0
     }
   },
+  created() {
+    this.getInfo()
+  },
+  mounted() {
+    this.searchHandler()
+    this.initBar()
+    this.initPie()
+    this.getCameras()
+  },
   methods: {
+    async getCameras() {
+      let clusterId = ""
+      let clusterReq = await getClusterDevList()
+      if (clusterReq && clusterReq.success) {
+        if (clusterReq.data.clusterList.length > 0) {
+          clusterId = clusterReq.data.clusterList[0].cluster_id
+        }
+      }
+      let camereReq = await getLocalCameraTree({ clusterId: clusterId })
+      if (camereReq && camereReq.success) {
+        this.cameraTree = camereReq.data.treeMenu
+        let tmpTree = JSON.parse(JSON.stringify(camereReq.data.treeMenu))
+        for (let i = 0; i < tmpTree.length; i++) this.clearNode(tmpTree[i])
+        this.menuTree = tmpTree
+      }
+    },
+    clearNode(tree) {
+      if (tree.children) {
+        tree.children = tree.children.filter((item) => {
+          return item.type == "MENU"
+        })
+      }
+      if (tree.children && tree.children.length > 0) {
+        for (let i = 0; i < tree.children.length; i++) this.clearNode(tree.children[i])
+      } else {
+        delete tree.children
+      }
+    },
+    collSelectedNodes() {
+      let selectedNodeId = this.selectedOrg
+      let selectedNode = {}
+      let orgNodeIds = []
+
+      if (this.selectedOrg == "") {
+        return orgNodeIds
+      }
+
+      function findNode(node) {
+        if (node.id == selectedNodeId) {
+          selectedNode = node
+
+          return
+        }
+
+        if (node.children) {
+          node.children.forEach((n) => {
+            findNode(n)
+          })
+        }
+      }
+
+      function collNode(node) {
+        if (node.type != "MENU") {
+          orgNodeIds.push(node.id)
+          return
+        }
+
+        if (node.children) {
+          node.children.forEach((n) => {
+            collNode(n)
+          })
+        }
+      }
+
+      this.cameraTree.forEach((n) => {
+        findNode(n)
+      })
+
+      collNode(selectedNode)
+
+      return orgNodeIds
+    },
+    searchHandler() {
+      let query = {
+        treeNodes: this.collSelectedNodes(),
+        searchTime: this.format(this.searchTime),
+        alarmLevel: this.alarmValues
+      }
+
+      analysisReport(query).then((rsp) => {
+        if (rsp && rsp.success) {
+          this.decodeWarningRate(rsp.data.warningRate)
+          this.decodeWarningChartRate(rsp.data.warningChartRate)
+          this.decodeWarningStatics(rsp.data.warningTable)
+          this.decodeWarningTable(rsp.data.warningStatics)
+        }
+      })
+    },
+    decodeWarningTable(b64data) {
+      this.solvedTotal = 0
+      this.tableDataList = []
+      if (b64data) {
+        let decodeString = Base64.decode(b64data)
+        if (decodeString != "") {
+          let decodeResult = JSON.parse(decodeString)
+          decodeResult = []
+          if (decodeResult) {
+            decodeResult.forEach((element) => {
+              this.solvedTotal = this.solvedTotal + element.doc_count
+              this.tableDataList.push({ date: element.key_as_string, count: element.doc_count })
+            })
+          }
+        }
+      }
+    },
+    // 鎶樼嚎鍥�
+    decodeWarningStatics(b64data) {
+      this.lineChart.clear()
+      this.barOption.xAxis.data = []
+      this.barOption.series[0].data = []
+      if (b64data) {
+        let decodeString = Base64.decode(b64data)
+        if (decodeString != "") {
+          let decodeResult = JSON.parse(decodeString)
+          if (decodeResult) {
+            decodeResult.forEach((element) => {
+              this.barOption.xAxis.data.push(element.key_as_string)
+              this.barOption.series[0].data.push(element.doc_count)
+            })
+          }
+        }
+      }
+
+      this.lineChart.setOption(this.barOption)
+    },
+    // 楗煎浘
+    decodeWarningChartRate(b64data) {
+      this.pieChart.clear()
+      this.pieOption.series[0].data = []
+      if (b64data) {
+        let decodeString = Base64.decode(b64data)
+        if (decodeString != "") {
+          let decodeResult = JSON.parse(decodeString)
+          if (decodeResult) {
+            decodeResult.forEach((element) => {
+              this.pieOption.series[0].data.push({ value: element.doc_count, name: element.key })
+            })
+          }
+        }
+      }
+      this.pieChart.setOption(this.pieOption)
+    },
+    // "warningRate": {"buckets":[{"doc_count":4,"key":3},{"doc_count":3,"key":2},{"doc_count":1,"key":1}],"total":3257}
+    //key 1=璇姤鏁版嵁,2=宸叉暣鏀�,3=鏈暣鏀�,4=宸叉帓鏌� doc_count=鏁伴噺 total=鎬婚噺
+    decodeWarningRate(b64data) {
+      if (b64data) {
+        this.warningTotal = 0
+        this.warningSolved = 0
+        this.warningChecked = 0
+
+        let decodeString = Base64.decode(b64data)
+        if (decodeString != "") {
+          let decodeResult = JSON.parse(decodeString)
+          if (decodeResult && decodeResult.total > 0) {
+            this.warningTotal = decodeResult.total
+            decodeResult.buckets.forEach((element) => {
+              switch (element.key) {
+                case 2:
+                  this.warningSolved += element.doc_count
+                  break
+                case 4:
+                  this.warningChecked += element.doc_count
+                  break
+                default:
+                  break
+              }
+            })
+          }
+          // console.log("WarningRate:", decodeResult)
+        }
+      }
+    },
+    handleTreeChange(value) {
+      this.selectedOrg = value[value.length - 1]
+    },
     getInfo() {
       if (sessionStorage.getItem("userInfo")) {
         this.userName = JSON.parse(sessionStorage.getItem("userInfo")).username
@@ -841,23 +676,14 @@
     },
     initBar() {
       let bartDom = document.getElementById("bar")
-      let myChart = echarts.init(bartDom)
-      myChart.setOption(this.barOption)
+      this.lineChart = echarts.init(bartDom)
+      this.lineChart.setOption(this.barOption)
     },
-    initMap() {
-      let mapDom = document.getElementById("mapChart")
-      let myChart = echarts.init(mapDom)
-      myChart.setOption(this.mapOption)
-    },
-    initScatter() {
-      let scatterDom = document.getElementById("scatterChart")
-      let myChart = echarts.init(scatterDom)
-      myChart.setOption(this.scatterOption)
-    },
+
     initPie() {
       let pieDom = document.getElementById("pieChart")
-      let myChart = echarts.init(pieDom)
-      myChart.setOption(this.pieOption)
+      this.pieChart = echarts.init(pieDom)
+      this.pieChart.setOption(this.pieOption)
     },
     jump(route) {
       const userInfo = JSON.parse(sessionStorage.getItem("userInfo"))
@@ -879,7 +705,16 @@
       }
     },
     refrash() {},
-    handleSizeChange() {}
+    handleSizeChange() {},
+    format(array) {
+      if (!array || array.length === 0) {
+        return []
+      }
+      return [
+        this.$moment(array[0]).format("YYYY-MM-DD HH:mm:ss"),
+        this.$moment(array[1]).format("YYYY-MM-DD HH:mm:ss")
+      ]
+    }
   }
 }
 </script>
@@ -890,6 +725,15 @@
   min-width: 1346px;
   background-color: rgb(243, 245, 248);
 
+  .p-statis {
+    display: flex;
+    padding-right: 10px;
+    box-sizing: border-box;
+    margin-top: 20px;
+    b:hover {
+      color: #2249b4;
+    }
+  }
   .title {
     margin-bottom: 20px;
     box-sizing: border-box;
@@ -1056,12 +900,12 @@
     margin: 24px 0;
     height: 466px;
 
-    .left {
+    .bar-chart {
       box-sizing: border-box;
       position: relative;
       padding: 20px;
       background-color: #fff;
-      width: 845px;
+      width: 100%;
       height: 466px;
 
       #bar {
@@ -1075,38 +919,6 @@
       width: 411px;
       height: 466px;
       background: #ffffff;
-
-      .timeList {
-        height: 392px;
-        overflow-y: auto;
-
-        .timeItem {
-          margin-bottom: 24px;
-          display: flex;
-          align-items: center;
-          height: 32px;
-          border-radius: 16px;
-          background: rgb(249, 251, 253);
-          font-size: 14px;
-
-          &:nth-child(1),
-          &:nth-child(2),
-          &:nth-child(3) {
-            background: #eff4f9;
-          }
-
-          .index {
-            margin: 0 35px 0 20px;
-            font-size: 16px;
-            color: #0064ff;
-          }
-
-          .time {
-            margin-left: 50px;
-            color: #999;
-          }
-        }
-      }
     }
   }
 
@@ -1189,6 +1001,12 @@
       #scatterChart {
         height: 500px;
       }
+
+      .table-area {
+        margin-top: 10px;
+        margin-bottom: 5px;
+        width: 700px;
+      }
     }
 
     .right {
diff --git a/src/views/search/Searching.vue b/src/views/search/Searching.vue
index 52a08f4..bdf982c 100644
--- a/src/views/search/Searching.vue
+++ b/src/views/search/Searching.vue
@@ -2,28 +2,17 @@
   <div class="searching-box" @click="showDownBox = false">
     <div class="searching-right">
       <div class="searching-right-nav">
-        <el-breadcrumb
-          separator-class="el-icon-arrow-right"
-          style="display: inline-block"
-        >
+        <el-breadcrumb separator-class="el-icon-arrow-right" style="display: inline-block">
           <el-breadcrumb-item>
             <span @click="uploadChange">妫�绱�</span>
           </el-breadcrumb-item>
-          <el-breadcrumb-item v-if="!VideoPhotoData.uploadType"
-            >鍏ㄩ儴</el-breadcrumb-item
-          >
-          <el-breadcrumb-item v-if="VideoPhotoData.uploadType"
-            >浠ュ浘鎼滃浘</el-breadcrumb-item
-          >
+          <el-breadcrumb-item v-if="!VideoPhotoData.uploadType">鍏ㄩ儴</el-breadcrumb-item>
+          <el-breadcrumb-item v-if="VideoPhotoData.uploadType">浠ュ浘鎼滃浘</el-breadcrumb-item>
         </el-breadcrumb>
       </div>
       <div class="searching-right-content">
         <div class="top">
-          <el-tooltip
-            content="浠ュ浘鎼滃浘"
-            placement="bottom"
-            popper-class="atooltip"
-          >
+          <el-tooltip content="浠ュ浘鎼滃浘" placement="bottom" popper-class="atooltip">
             <el-button
               @click="showUpload"
               type="primary"
@@ -134,27 +123,13 @@
               v-model="VideoPhotoData.inputValue"
               size="mini"
             ></el-input>
-            <el-button type="primary" size="mini" @click="searchingBtn"
-              >鎼滅储</el-button
-            >
+            <el-button type="primary" size="mini" @click="searchingBtn">鎼滅储</el-button>
           </p>
-
-          <div class="btnArea">
-            <div class="button light" @click.stop="showDownBox = !showDownBox">
-              <span class="iconfont">&#xe643;</span>
-              瀵煎嚭鏁版嵁
-            </div>
-
-            <div class="downBox" v-if="showDownBox">
-              <div class="downItem">瀵煎嚭鍏ㄩ儴鏁版嵁</div>
-              <div class="downItem">瀵煎嚭绛涢�夋暟鎹�</div>
-            </div>
-          </div>
 
           <p class="p-clear">
             <b class="clear-searching" @click="clearSearch">閲嶇疆</b>
           </p>
-          <el-tooltip
+          <!-- <el-tooltip
             class="item"
             effect="dark"
             content="閰嶇疆瀛樺偍璺緞"
@@ -163,7 +138,25 @@
             <span @click="showSetBox = true" class="iconfont setIcon"
               >&#xe652;</span
             >
-          </el-tooltip>
+          </el-tooltip> -->
+          <p class="p-clear">
+            <download-excel
+              class="export-excel-wrapper"
+              :data="VideoPhotoData.cards"
+              :fields="json_fields"
+              :name="'瑙嗛鍒嗘瀽鎶ヨ缁熻' + searchTimeFormated + '.xls'"
+            >
+              <!-- 涓婇潰鍙互鑷畾涔夎嚜宸辩殑鏍峰紡锛岃繕鍙互寮曠敤鍏朵粬缁勪欢button -->
+              <!-- <el-button type="primary" size="small">瀵煎嚭EXCEL</el-button> -->
+              <!-- <div class="btnArea">
+                <div class="button light">
+                  <span class="iconfont">&#xe643;</span>
+                  瀵煎嚭鏁版嵁
+                </div>
+              </div> -->
+              <b class="clear-searching"> <span class="iconfont">&#xe643;</span> 瀵煎嚭鏁版嵁</b>
+            </download-excel>
+          </p>
         </div>
         <div ref="mid" style="height: calc(100% - 50px)">
           <div class="left-selection" v-if="VideoPhotoData.uploadDiaplay">
@@ -173,24 +166,16 @@
             id="searchMid"
             class="mid"
             :style="{
-              width: VideoPhotoData.uploadDiaplay
-                ? 'calc(100% - 315px)'
-                : '100%',
+              width: VideoPhotoData.uploadDiaplay ? 'calc(100% - 315px)' : '100%'
             }"
           >
             <div class="right-section" ref="scrollContain">
               <Card
                 v-for="(item, index) in VideoPhotoData.cards"
-                :class="
-                  item.activeObject.id === VideoPhotoData.activeCard
-                    ? 'my-active-card'
-                    : ''
-                "
+                :class="item.activeObject.id === VideoPhotoData.activeCard ? 'my-active-card' : ''"
                 :key="index + 'u'"
                 :outHeight="'162px'"
-                :outWidth="
-                  VideoPhotoData.uploadDiaplay ? searchImgCardWidth : cardWidth
-                "
+                :outWidth="VideoPhotoData.uploadDiaplay ? searchImgCardWidth : cardWidth"
                 :data="item"
                 :searchTime="searchTimeFormated"
                 :showType="showType"
@@ -241,21 +226,11 @@
               <p>榛戝悕鍗� ></p>
             </div>
             <div class="baseList">
-              <el-checkbox-group
-                v-model="VideoPhotoData.selectBlacks"
-                @change="blackAngWhite"
-              >
-                <div
-                  class="base"
-                  v-for="(item, index) in VideoPhotoData.blackList"
-                  :key="index"
-                >
-                  <el-checkbox
-                    :label="item.value"
-                    :title="item.title"
-                    :disabled="item.disabled"
-                    >{{ item.title }}</el-checkbox
-                  >
+              <el-checkbox-group v-model="VideoPhotoData.selectBlacks" @change="blackAngWhite">
+                <div class="base" v-for="(item, index) in VideoPhotoData.blackList" :key="index">
+                  <el-checkbox :label="item.value" :title="item.title" :disabled="item.disabled">{{
+                    item.title
+                  }}</el-checkbox>
                 </div>
               </el-checkbox-group>
             </div>
@@ -265,21 +240,11 @@
               <p>鐧藉悕鍗� ></p>
             </div>
             <div class="baseList">
-              <el-checkbox-group
-                v-model="VideoPhotoData.selectWhites"
-                @change="blackAngWhite"
-              >
-                <div
-                  class="base"
-                  v-for="(item, index) in VideoPhotoData.whiteList"
-                  :key="index"
-                >
-                  <el-checkbox
-                    :label="item.value"
-                    :title="item.title"
-                    :disabled="item.disabled"
-                    >{{ item.title }}</el-checkbox
-                  >
+              <el-checkbox-group v-model="VideoPhotoData.selectWhites" @change="blackAngWhite">
+                <div class="base" v-for="(item, index) in VideoPhotoData.whiteList" :key="index">
+                  <el-checkbox :label="item.value" :title="item.title" :disabled="item.disabled">{{
+                    item.title
+                  }}</el-checkbox>
                 </div>
               </el-checkbox-group>
             </div>
@@ -296,17 +261,17 @@
 </template>
 
 <script>
-import Card from "./components/Card";
-import UploadImg from "./components/UploadImg";
-import bus from "@/main";
-import { getUrlKey } from "@/api/utils.ts";
-import SetBox from "@/views/search/components/SetBox";
+import Card from "./components/Card"
+import UploadImg from "./components/UploadImg"
+import bus from "@/main"
+import { getUrlKey } from "@/api/utils.ts"
+import SetBox from "@/views/search/components/SetBox"
 export default {
   name: "RightSide",
   components: {
     Card,
     UploadImg,
-    SetBox,
+    SetBox
   },
   data() {
     return {
@@ -322,115 +287,150 @@
       alarmValues: [],
       taskValues: [],
       showDownBox: false,
-      searchTime: [
-        this.$moment().format("YYYY-MM-DD 00:00:00"),
-        this.$moment().format("YYYY-MM-DD HH:mm:ss"),
-      ],
+      searchTime: [this.$moment().format("YYYY-MM-DD 00:00:00"), this.$moment().format("YYYY-MM-DD HH:mm:ss")],
       searchText: "",
       currentPage: 1,
       showSetBox: false,
-    };
+      json_fields: {
+        // 閮ㄩ棬: "",
+        // 鍛婅鏍囪: "",
+        // 鏁存敼鎻忚堪: "",
+        鎽勫儚鏈篒D: "activeObject.cameraId",
+        鎽勫儚鏈哄悕绉�: "activeObject.cameraName",
+        鎽勫儚鏈哄湴鍧�: "activeObject.cameraAddr",
+        鍦烘櫙ID: "activeObject.taskId",
+        鍦烘櫙鍚嶇О: "activeObject.taskName",
+        浜嬩欢绛夌骇: {
+          field: "activeObject.alarmRules",
+          //鑷畾涔夊洖璋冨嚱鏁�
+          callback: (value) => {
+            return value.length ? value[0].alarmLevel : ""
+          }
+        },
+        璁惧ID: "activeObject.analyServerId",
+        璁惧IP: "activeObject.analyServerIp",
+        璁惧鍚嶇О: "activeObject.analyServerName",
+        鎶撴媿鏃堕棿: "activeObject.picDate",
+        鏇存柊鏃堕棿: "activeObject.likeDate",
+        鎶撴媿鍏ㄦ櫙鍥惧湴鍧�: "activeObject.picMaxUrl",
+        褰曞儚鍦板潃: "activeObject.videoUrl",
+        妫�娴嬪尯鍩焛d: {
+          field: "activeObject.targetInfo",
+          //鑷畾涔夊洖璋冨嚱鏁�
+          callback: (value) => {
+            return value.length ? value[0].areaId : ""
+          }
+        },
+        妫�娴嬪尯鍩熷悕绉�: {
+          field: "activeObject.targetInfo",
+          //鑷畾涔夊洖璋冨嚱鏁�
+          callback: (value) => {
+            return value.length ? value[0].areaName : ""
+          }
+        }
+      }
+    }
   },
   computed: {
     searchTimeFormated() {
-      return this.format(this.searchTime);
-    },
+      return this.format(this.searchTime)
+    }
   },
   created() {
-    this.VideoPhotoData.activeCard = "";
-    this.TreeDataPool.readonly = true;
-    this.TreeDataPool.gbReadonly = true;
-    this.TreeDataPool.multiple = true;
-    this.TreeDataPool.clean();
+    this.VideoPhotoData.activeCard = ""
+    this.TreeDataPool.readonly = true
+    this.TreeDataPool.gbReadonly = true
+    this.TreeDataPool.multiple = true
+    this.TreeDataPool.clean()
   },
   mounted() {
     this.$nextTick(() => {
-      let scrollContain = this.$refs.scrollContain;
-      this.VideoPhotoData.scrollContainDom = scrollContain;
+      let scrollContain = this.$refs.scrollContain
+      this.VideoPhotoData.scrollContainDom = scrollContain
       let list =
         this.TreeDataPool.localVedioList &&
         this.TreeDataPool.localVedioList.filter((i) => {
-          return i.progress == 100;
-        });
-      this.TreeDataPool.localVedioList = list;
-    });
-    window.addEventListener("resize", this.getHeight);
-    this.getCenter();
-    this.getHeight();
-    this.blackAngWhite();
+          return i.progress == 100
+        })
+      this.TreeDataPool.localVedioList = list
+    })
+    window.addEventListener("resize", this.getHeight)
+    this.getCenter()
+    this.getHeight()
+    this.blackAngWhite()
     // 瑙嗛鐩戞帶浠诲姟璺宠浆 灞忚斀 20200730
     // if (this.$route.query.from === "video") {
     //   this.VideoPhotoData.queryTasks = this.taskValues = [
     //     this.VideoTaskData.tasks[this.VideoTaskData.activeIndex].taskId
     //   ];
     // }
-    let start = getUrlKey("start");
-    let end = getUrlKey("end");
+    let start = getUrlKey("start")
+    let end = getUrlKey("end")
     if (start && end) {
-      this.searchTime = [start, end];
-      this.VideoPhotoData.searchTime = [start, end];
+      this.searchTime = [start, end]
+      this.VideoPhotoData.searchTime = [start, end]
     } else {
-      this.searchTime = this.getDateInit();
-      this.VideoPhotoData.searchTime = this.getDateInit();
+      this.searchTime = this.getDateInit()
+      this.VideoPhotoData.searchTime = this.getDateInit()
     }
 
     // 鏆傛椂鍏抽棴璺宠浆 20200730
     // if (this.$route.query.showType === "findByPic") {
     if (getUrlKey("showType")) {
-      this.VideoPhotoData.uploadDiaplay = true;
-      this.VideoPhotoData.picUrl = getUrlKey("picSmUrl");
-      this.VideoPhotoData.uploadImg = getUrlKey("picSmUrl");
-      this.VideoPhotoData.uploadType = true;
-      this.VideoPhotoData.compTargetId = getUrlKey("targetId");
-      this.VideoPhotoData.compTargetType = getUrlKey("compType");
-      this.VideoPhotoData.size = 30;
-      this.VideoPhotoData.compareTabs = ["esData"];
-      this.VideoPhotoData.findPerson2(); // 鏌ユ壘姝や汉
+      this.VideoPhotoData.uploadDiaplay = true
+      this.VideoPhotoData.picUrl = getUrlKey("picSmUrl")
+      this.VideoPhotoData.uploadImg = getUrlKey("picSmUrl")
+      this.VideoPhotoData.uploadType = true
+      this.VideoPhotoData.compTargetId = getUrlKey("targetId")
+      this.VideoPhotoData.compTargetType = getUrlKey("compType")
+      this.VideoPhotoData.size = 30
+      this.VideoPhotoData.compareTabs = ["esData"]
+      this.VideoPhotoData.findPerson2() // 鏌ユ壘姝や汉
     } else {
-      this.searchTime = this.getDateInit();
-      this.VideoPhotoData.searchTime = this.getDateInit();
+      this.searchTime = this.getDateInit()
+      this.VideoPhotoData.searchTime = this.getDateInit()
       // this.VideoPhotoData.querySearchList();
-      this.setLoadSearch(this.VideoPhotoData.querySearchList());
+      this.setLoadSearch(this.VideoPhotoData.querySearchList())
     }
 
-    this.VideoPhotoData.queryTagList();
-    this.VideoPhotoData.queryTaskList();
-    this.VideoPhotoData.queryDictionary();
+    this.VideoPhotoData.queryTagList()
+    this.VideoPhotoData.queryTaskList()
+    this.VideoPhotoData.queryDictionary()
     this.$nextTick(() => {
       bus.$on("changePage", (page) => {
-        this.currentPage = page;
-        this.VideoPhotoData.page = page;
-      });
-    });
+        this.currentPage = page
+        this.VideoPhotoData.page = page
+      })
+    })
   },
   destroyed() {
-    window.removeEventListener("resize", this.getHeight);
-    this.CardList.details = [];
+    window.removeEventListener("resize", this.getHeight)
+    this.CardList.details = []
     // this.TreeDataPool.treeActiveName = "camera";
-    this.VideoPhotoData.queryAlarmlevel = [];
-    this.VideoPhotoData.inputValue = "";
-    this.VideoPhotoData.queryTabs = [];
-    this.VideoPhotoData.queryTasks = [];
-    this.VideoPhotoData.treeNodes = [];
+    this.VideoPhotoData.queryAlarmlevel = []
+    this.VideoPhotoData.inputValue = ""
+    this.VideoPhotoData.queryTabs = []
+    this.VideoPhotoData.queryTasks = []
+    this.VideoPhotoData.treeNodes = []
 
-    this.CardList.addBaseList = [];
-    this.VideoPhotoData.selectBlacks = [];
-    this.VideoPhotoData.selectWhites = [];
+    this.CardList.addBaseList = []
+    this.VideoPhotoData.selectBlacks = []
+    this.VideoPhotoData.selectWhites = []
   },
   watch: {
     "TreeDataPool.treeActiveName"(n) {
       if (n && n == "camera") {
-        this.VideoPhotoData.treeNodes = [];
-        this.setLoadSearch(this.VideoPhotoData.querySearchList());
+        this.VideoPhotoData.treeNodes = []
+        this.setLoadSearch(this.VideoPhotoData.querySearchList())
       }
     },
     "TreeDataPool.showTreeBox"() {
-      this.getHeight();
+      this.getHeight()
       if (this.VideoPhotoData.realSmallPath.length > 0) {
-        this.VideoPhotoData.findPersonByPage();
+        this.VideoPhotoData.findPersonByPage()
       } else {
         // this.VideoPhotoData.querySearchList();
-        this.setLoadSearch(this.VideoPhotoData.querySearchList());
+        this.setLoadSearch(this.VideoPhotoData.querySearchList())
       }
     },
     // "TreeDataPool.selectedNodes": function(newValue,oldValue) {
@@ -440,206 +440,181 @@
     //   }
     // },
     "TreeDataPool.selectedNodes": {
-      handler: function (newVal, oldVal) {
+      handler: function(newVal, oldVal) {
         if (newVal !== oldVal) {
-          this.VideoPhotoData.treeNodes = newVal;
+          this.VideoPhotoData.treeNodes = newVal
           if (this.VideoPhotoData.uploadType) {
-            this.VideoPhotoData.findPersonByPage();
+            this.VideoPhotoData.findPersonByPage()
           } else {
-            this.setLoadSearch(this.VideoPhotoData.querySearchList());
+            this.setLoadSearch(this.VideoPhotoData.querySearchList())
           }
         }
       },
-      deep: true, //娣卞害鐩戝惉
+      deep: true //娣卞害鐩戝惉
     },
     "DataStackPool.selectedDir": {
       handler(nodes, oldNodes) {
         if (nodes !== oldNodes && nodes.id != "") {
           // this.VideoPhotoData.treeNodes = nodes.map(i=>{return i.id});
-          this.VideoPhotoData.treeNodes = [nodes.id];
+          this.VideoPhotoData.treeNodes = [nodes.id]
           if (this.VideoPhotoData.uploadType) {
-            this.VideoPhotoData.findPersonByPage();
+            this.VideoPhotoData.findPersonByPage()
           } else {
             // this.VideoPhotoData.querySearchList();
-            this.setLoadSearch(this.VideoPhotoData.querySearchList());
+            this.setLoadSearch(this.VideoPhotoData.querySearchList())
           }
         }
       },
-      deep: true,
+      deep: true
     },
-    "VideoPhotoData.activeCard": function () {
-      let card =
-        this.$refs.scrollContain.getElementsByClassName("my-active-card");
-      console.log("------");
-      console.log(card);
+    "VideoPhotoData.activeCard": function() {
+      let card = this.$refs.scrollContain.getElementsByClassName("my-active-card")
 
       if (card.length > 0) {
-        let cardHeight = card[0].clientHeight;
-        let cardTop = card[0].offsetTop;
-        let scrollTop = this.$refs.scrollContain.scrollTop;
-        let divHeight = this.$refs.scrollContain.clientHeight;
-        console.log(2);
-        console.log(cardHeight);
-        console.log(cardTop);
-        console.log(scrollTop);
-        console.log(divHeight);
-        if (
-          cardTop - cardHeight - scrollTop > divHeight ||
-          cardTop - cardHeight - scrollTop < 0
-        )
-          this.$refs.scrollContain.scrollTo(0, cardTop - cardHeight);
+        let cardHeight = card[0].clientHeight
+        let cardTop = card[0].offsetTop
+        let scrollTop = this.$refs.scrollContain.scrollTop
+        let divHeight = this.$refs.scrollContain.clientHeight
+
+        if (cardTop - cardHeight - scrollTop > divHeight || cardTop - cardHeight - scrollTop < 0)
+          this.$refs.scrollContain.scrollTo(0, cardTop - cardHeight)
       }
     },
-    "VideoPhotoData.uploadType": function (value) {
+    "VideoPhotoData.uploadType": function(value) {
       if (value) {
-        this.typeDisable = true;
-        this.disabled = true;
+        this.typeDisable = true
+        this.disabled = true
       } else {
-        this.typeDisable = false;
-        this.VideoPhotoData.querySearchList();
+        this.typeDisable = false
+        this.VideoPhotoData.querySearchList()
       }
     },
-    "VideoPhotoData.selectBlacks": function () {
-      this.blackAngWhite();
+    "VideoPhotoData.selectBlacks": function() {
+      this.blackAngWhite()
     },
-    "VideoPhotoData.selectWhites": function () {
-      this.blackAngWhite();
+    "VideoPhotoData.selectWhites": function() {
+      this.blackAngWhite()
     },
-    "VideoPhotoData.uploadDiaplay": function (value) {
-      this.getHeight();
+    "VideoPhotoData.uploadDiaplay": function(value) {
+      this.getHeight()
       if (value) {
         if (!this.VideoPhotoData.uploadType) {
-          let scrollContain = this.$refs.scrollContain;
-          this.VideoPhotoData.scrollContainDom = scrollContain;
-          this.VideoPhotoData.showType = "search";
+          let scrollContain = this.$refs.scrollContain
+          this.VideoPhotoData.scrollContainDom = scrollContain
+          this.VideoPhotoData.showType = "search"
           // this.VideoPhotoData.querySearchList();
           //this.setLoadSearch(this.VideoPhotoData.querySearchList());
-          this.isDisabled = false;
+          this.isDisabled = false
         } else {
           //this.VideoPhotoData.scrollContainDom = '';
-          this.VideoPhotoData.showType = "findByPic";
+          this.VideoPhotoData.showType = "findByPic"
         }
       } else {
-        this.VideoPhotoData.uploadType = false;
-        this.VideoPhotoData.showType = "search";
+        this.VideoPhotoData.uploadType = false
+        this.VideoPhotoData.showType = "search"
       }
-    },
+    }
   },
   methods: {
     isShowUpload() {
-      this.getHeight();
+      this.getHeight()
       if (this.VideoPhotoData.uploadDiaplay) {
         if (!this.VideoPhotoData.uploadType) {
-          let scrollContain = this.$refs.scrollContain;
-          this.VideoPhotoData.scrollContainDom = scrollContain;
-          this.VideoPhotoData.showType = "search";
+          let scrollContain = this.$refs.scrollContain
+          this.VideoPhotoData.scrollContainDom = scrollContain
+          this.VideoPhotoData.showType = "search"
           // this.VideoPhotoData.querySearchList();
           //this.setLoadSearch(this.VideoPhotoData.querySearchList());
-          this.isDisabled = false;
+          this.isDisabled = false
         } else {
           //this.VideoPhotoData.scrollContainDom = '';
-          this.VideoPhotoData.showType = "findByPic";
+          this.VideoPhotoData.showType = "findByPic"
         }
       } else {
-        this.VideoPhotoData.uploadType = false;
-        this.VideoPhotoData.showType = "search";
+        this.VideoPhotoData.uploadType = false
+        this.VideoPhotoData.showType = "search"
       }
     },
     resizeWidth(w) {
-      this.defaultWidth = w;
+      this.defaultWidth = w
     },
     resizeHeight(h) {
-      this.defaultHeight = h;
+      this.defaultHeight = h
     },
     getHeight() {
-      let w = this.$refs.mid.offsetWidth;
-      let integer = parseInt(w / 330);
-      let integerSearchImg = parseInt((w - 300) / 325);
+      let w = this.$refs.mid.offsetWidth
+      let integer = parseInt(w / 330)
+      let integerSearchImg = parseInt((w - 300) / 325)
 
       // 鍙栨秷size淇敼
       // this.handleSizeChange(integer, integerSearchImg);
 
-      this.cardWidth = `calc(${100 / integer}% - 20px)`;
-      this.searchImgCardWidth = `calc(${100 / integerSearchImg}% - 20px)`;
+      this.cardWidth = `calc(${100 / integer}% - 20px)`
+      this.searchImgCardWidth = `calc(${100 / integerSearchImg}% - 20px)`
     },
     uploadChange() {
-      this.VideoPhotoData.uploadDiaplay = false;
-      this.VideoPhotoData.clearStatus();
+      this.VideoPhotoData.uploadDiaplay = false
+      this.VideoPhotoData.clearStatus()
     },
     blackAngWhite() {
-      if (
-        this.VideoPhotoData.selectBlacks &&
-        this.VideoPhotoData.selectBlacks.length > 0
-      ) {
+      if (this.VideoPhotoData.selectBlacks && this.VideoPhotoData.selectBlacks.length > 0) {
         for (let i = 0; i < this.VideoPhotoData.whiteList.length; i++) {
           //this.VideoPhotoData.whiteList[i].disabled = true
-          this.$set(this.VideoPhotoData.whiteList[i], "disabled", true);
+          this.$set(this.VideoPhotoData.whiteList[i], "disabled", true)
         }
       }
-      if (
-        this.VideoPhotoData.selectBlacks &&
-        this.VideoPhotoData.selectBlacks.length == 0
-      ) {
+      if (this.VideoPhotoData.selectBlacks && this.VideoPhotoData.selectBlacks.length == 0) {
         for (let i = 0; i < this.VideoPhotoData.whiteList.length; i++) {
           //this.VideoPhotoData.whiteList[i].disabled = false
-          this.$set(this.VideoPhotoData.whiteList[i], "disabled", false);
+          this.$set(this.VideoPhotoData.whiteList[i], "disabled", false)
         }
       }
-      if (
-        this.VideoPhotoData.selectWhites &&
-        this.VideoPhotoData.selectWhites.length > 0
-      ) {
+      if (this.VideoPhotoData.selectWhites && this.VideoPhotoData.selectWhites.length > 0) {
         for (let i = 0; i < this.VideoPhotoData.blackList.length; i++) {
           // this.VideoPhotoData.blackList[i].disabled = true
-          this.$set(this.VideoPhotoData.blackList[i], "disabled", true);
+          this.$set(this.VideoPhotoData.blackList[i], "disabled", true)
         }
       }
-      if (
-        this.VideoPhotoData.selectWhites &&
-        this.VideoPhotoData.selectWhites.length == 0
-      ) {
+      if (this.VideoPhotoData.selectWhites && this.VideoPhotoData.selectWhites.length == 0) {
         for (let i = 0; i < this.VideoPhotoData.blackList.length; i++) {
           //this.VideoPhotoData.blackList[i].disabled = false
-          this.$set(this.VideoPhotoData.blackList[i], "disabled", false);
+          this.$set(this.VideoPhotoData.blackList[i], "disabled", false)
         }
       }
     },
     saveAddBase(item, index) {
-      if (
-        this.VideoPhotoData.selectBlacks.length === 0 &&
-        this.VideoPhotoData.selectWhites.length === 0
-      ) {
+      if (this.VideoPhotoData.selectBlacks.length === 0 && this.VideoPhotoData.selectWhites.length === 0) {
         this.$notify({
           title: "娉ㄦ剰",
           message: "璇烽�夋嫨瑕佹坊鍔犵殑搴曞簱",
-          type: "warning",
-        });
-        return;
+          type: "warning"
+        })
+        return
       }
-      let res = this.VideoPhotoData.addBase(item);
+      let res = this.VideoPhotoData.addBase(item)
       res.then((data) => {
         if (data.success) {
           this.$notify({
             title: "鎴愬姛",
             message: data.data,
-            type: "success",
-          });
+            type: "success"
+          })
         } else {
           this.$notify({
             title: "澶辫触",
             message: data.data,
-            type: "error",
-          });
+            type: "error"
+          })
         }
-        this.CardList.addBaseList.splice(index, 1);
-        this.VideoPhotoData.selectBlacks = [];
-        this.VideoPhotoData.selectWhites = [];
-      });
+        this.CardList.addBaseList.splice(index, 1)
+        this.VideoPhotoData.selectBlacks = []
+        this.VideoPhotoData.selectWhites = []
+      })
     },
     getDetails(ev, index) {
       //let obj = this.CardList.datalist[index];
-      this.CardList.datalist = this.VideoPhotoData.cards;
-      let obj = this.CardList.datalist[index];
+      this.CardList.datalist = this.VideoPhotoData.cards
+      let obj = this.CardList.datalist[index]
       /*  try {
         this.CardList.details = Array.from(
           new Set([...this.CardList.details, ...[obj]])
@@ -647,27 +622,26 @@
       } catch (error) {
         console.log(error);
       } */
-      this.CardList.details = [];
-      this.CardList.details.push(obj);
+      this.CardList.details = []
+      this.CardList.details.push(obj)
       // this.CardList.details.push(obj);
-      this.VideoPhotoData.activeCard = obj.activeObject.id;
-      console.log(this.VideoPhotoData.activeCard);
+      this.VideoPhotoData.activeCard = obj.activeObject.id
     },
     toAdd(item) {
-      this.CardList.addBaseList.push(item);
+      this.CardList.addBaseList.push(item)
     },
     handleClose(done) {
       this.$confirm("纭鍏抽棴锛�")
         .then(() => {
-          done();
+          done()
         })
-        .catch(() => {});
+        .catch(() => {})
     },
     showUpload() {
-      this.VideoPhotoData.uploadDiaplay = !this.VideoPhotoData.uploadDiaplay;
+      this.VideoPhotoData.uploadDiaplay = !this.VideoPhotoData.uploadDiaplay
       //鍒濆鍖栨暟鎹�
-      this.VideoPhotoData.clearStatus();
-      this.CardList.details = [];
+      this.VideoPhotoData.clearStatus()
+      this.CardList.details = []
       // if (this.VideoPhotoData.uploadDiaplay) {
 
       // }
@@ -675,186 +649,164 @@
     },
     getDateInit() {
       // 瑕佹眰 榛樿涓�涓湀
-      const end = new Date();
-      const start = new Date();
-      const nowDate = new Date();
-      nowDate.setHours(0);
-      nowDate.setMinutes(0);
-      nowDate.setSeconds(0);
-      nowDate.setMilliseconds(0);
-      start.setTime(nowDate.getTime() - 3600 * 1000 * 24 * 30);
-      end.setTime(nowDate.getTime() + 3600 * 1000 * 24 - 1);
-      return [
-        this.$moment(start).format("YYYY-MM-DD HH:mm:ss"),
-        this.$moment(end).format("YYYY-MM-DD HH:mm:ss"),
-      ];
+      const end = new Date()
+      const start = new Date()
+      const nowDate = new Date()
+      nowDate.setHours(0)
+      nowDate.setMinutes(0)
+      nowDate.setSeconds(0)
+      nowDate.setMilliseconds(0)
+      start.setTime(nowDate.getTime() - 3600 * 1000 * 24 * 30)
+      end.setTime(nowDate.getTime() + 3600 * 1000 * 24 - 1)
+      return [this.$moment(start).format("YYYY-MM-DD HH:mm:ss"), this.$moment(end).format("YYYY-MM-DD HH:mm:ss")]
     },
     format(array) {
       if (!array || array.length === 0) {
-        return [];
+        return []
       }
       return [
         this.$moment(array[0]).format("YYYY-MM-DD HH:mm:ss"),
-        this.$moment(array[1]).format("YYYY-MM-DD HH:mm:ss"),
-      ];
+        this.$moment(array[1]).format("YYYY-MM-DD HH:mm:ss")
+      ]
     },
     searchingBtn() {
       if (!this.searchTime) {
-        this.searchTime = [];
+        this.searchTime = []
       }
-      // let obj = document.getElementById('searchMid');
-      // let load = this.$loading({
-      //   target:obj,
-      // })
-      // load.close();
-      // this.AuthData.loading = true
-      this.VideoPhotoData.page = 1;
-      this.VideoPhotoData.queryTabs = this.tagValues;
+      this.VideoPhotoData.page = 1
+      this.VideoPhotoData.queryTabs = this.tagValues
       //澶勭悊鎼滅储绫诲瀷
-      var tempArr = this.taskValues.map((task) => task.split(","));
-      var tasks = [];
-      console.log("1");
+      var tempArr = this.taskValues.map((task) => task.split(","))
+      var tasks = []
 
       tempArr.forEach((arr) => {
-        tasks = tasks.concat(arr);
-      });
-      this.VideoPhotoData.queryTasks = tasks;
-      console.log("2");
+        tasks = tasks.concat(arr)
+      })
+      this.VideoPhotoData.queryTasks = tasks
 
-      this.VideoPhotoData.queryAlarmlevel = this.stringToNum();
-      console.log("3");
-      console.log(this.searchTime);
+      this.VideoPhotoData.queryAlarmlevel = this.stringToNum()
 
-      this.VideoPhotoData.searchTime = this.format(this.searchTime);
-      console.log(this.VideoPhotoData.searchTime);
+      this.VideoPhotoData.searchTime = this.format(this.searchTime)
 
       //this.VideoPhotoData.inputValue = this.searchText;
-      this.VideoPhotoData.showType = this.showType;
+      this.VideoPhotoData.showType = this.showType
       if (!this.VideoPhotoData.uploadType) {
-        this.VideoPhotoData.uploadDiaplay = false;
-        //this.VideoPhotoData.page = this.currentPage;
-        // this.VideoPhotoData.querySearchList();
-        console.log("4");
+        this.VideoPhotoData.uploadDiaplay = false
 
-        this.setLoadSearch(this.VideoPhotoData.querySearchList());
+        this.setLoadSearch(this.VideoPhotoData.querySearchList())
       } else {
-        //this.VideoPhotoData.page = this.currentPage;
-        // this.VideoPhotoData.findPersonByPage();
-        console.log("5");
-
-        this.setLoadSearch(this.VideoPhotoData.findPersonByPage());
+        this.setLoadSearch(this.VideoPhotoData.findPersonByPage())
       }
+      console.log("cards", this.VideoPhotoData.cards)
     },
     stringToNum() {
-      var arr = [];
+      var arr = []
       this.alarmValues.forEach((element) => {
         if (element == "-1") {
-          arr.push(-1);
+          arr.push(-1)
         }
         if (element == "1") {
-          arr.push(1);
+          arr.push(1)
         }
         if (element == "2") {
-          arr.push(2);
+          arr.push(2)
         }
         if (element == "3") {
-          arr.push(3);
+          arr.push(3)
         }
         if (element == "4") {
-          arr.push(4);
+          arr.push(4)
         }
         if (element == "5") {
-          arr.push(5);
+          arr.push(5)
         }
-      });
-      return arr;
+      })
+      return arr
     },
     changePages(page) {
-      this.VideoPhotoData.page = page;
+      this.VideoPhotoData.page = page
       if (!this.VideoPhotoData.uploadType) {
-        this.VideoPhotoData.uploadDiaplay = false;
+        this.VideoPhotoData.uploadDiaplay = false
         // this.VideoPhotoData.querySearchList();
-        this.setLoadSearch(this.VideoPhotoData.querySearchList());
+        this.setLoadSearch(this.VideoPhotoData.querySearchList())
       } else {
         // this.VideoPhotoData.findPersonByPage();
-        this.setLoadSearch(this.VideoPhotoData.findPersonByPage());
+        this.setLoadSearch(this.VideoPhotoData.findPersonByPage())
       }
     },
     closeWindow(index) {
-      this.CardList.addBaseList.splice(index, 1);
+      this.CardList.addBaseList.splice(index, 1)
     },
     handleSizeChange(integer, integerSearchImg) {
       if (this.VideoPhotoData.uploadDiaplay) {
-        this.VideoPhotoData.size = integerSearchImg * 10;
+        this.VideoPhotoData.size = integerSearchImg * 10
         //this.VideoPhotoData.findPersonByPage();
       } else {
-        this.VideoPhotoData.size = integer * 10;
+        this.VideoPhotoData.size = integer * 10
         //this.VideoPhotoData.querySearchList();
       }
     },
     sizeChange(size) {
       if (this.VideoPhotoData.uploadType) {
-        this.VideoPhotoData.size = size;
-        this.VideoPhotoData.findPersonByPage();
+        this.VideoPhotoData.size = size
+        this.VideoPhotoData.findPersonByPage()
       } else {
-        this.VideoPhotoData.uploadDiaplay = false;
-        this.VideoPhotoData.size = size;
+        this.VideoPhotoData.uploadDiaplay = false
+        this.VideoPhotoData.size = size
         // this.VideoPhotoData.querySearchList();
-        this.setLoadSearch(this.VideoPhotoData.querySearchList());
+        this.setLoadSearch(this.VideoPhotoData.querySearchList())
       }
     },
     clearSearch() {
-      this.tagValues = [];
-      this.taskValues = [];
-      this.alarmValues = [];
-      this.VideoPhotoData.queryTabs = [];
-      this.VideoPhotoData.queryTasks = [];
-      this.VideoPhotoData.queryAlarmlevel = [];
-      this.VideoPhotoData.searchTime = this.getDateInit();
-      this.VideoPhotoData.inputValue = "";
+      this.tagValues = []
+      this.taskValues = []
+      this.alarmValues = []
+      this.VideoPhotoData.queryTabs = []
+      this.VideoPhotoData.queryTasks = []
+      this.VideoPhotoData.queryAlarmlevel = []
+      this.VideoPhotoData.searchTime = this.getDateInit()
+      this.VideoPhotoData.inputValue = ""
 
-      console.log(this.searchTime);
-
-      this.searchTime = this.getDateInit();
+      this.searchTime = this.getDateInit()
       if (!this.VideoPhotoData.uploadType) {
         // this.VideoPhotoData.querySearchList();
-        this.setLoadSearch(this.VideoPhotoData.querySearchList());
+        this.setLoadSearch(this.VideoPhotoData.querySearchList())
       } else {
         // this.VideoPhotoData.findPersonByPage();
-        this.setLoadSearch(this.VideoPhotoData.findPersonByPage());
+        this.setLoadSearch(this.VideoPhotoData.findPersonByPage())
       }
     },
     disabled(data) {
-      this.isDisabled = data;
+      this.isDisabled = data
     },
     getCenter() {
       this.center = {
         x: document.documentElement.clientWidth / 2 - 250,
-        y: document.documentElement.clientHeight / 2 - 200,
-      };
+        y: document.documentElement.clientHeight / 2 - 200
+      }
     },
     setLoadSearch(fn) {
-      this.AuthData.setLoading("searchMid", this);
+      this.AuthData.setLoading("searchMid", this)
       fn.then(() => {
-        this.AuthData.closeLoad();
-      });
+        this.AuthData.closeLoad()
+      })
     },
     tagChange(obj) {
       if (obj.length > 0) {
-        this.showType = "compare";
+        this.showType = "compare"
       } else {
-        this.showType = "search";
+        this.showType = "search"
       }
 
-      this.VideoPhotoData.queryTabs = obj;
+      this.VideoPhotoData.queryTabs = obj
 
-      this.setLoadSearch(this.VideoPhotoData.querySearchList());
-    },
-  },
-};
+      this.setLoadSearch(this.VideoPhotoData.querySearchList())
+    }
+  }
+}
 </script>
 
-<style lang="scss" >
+<style lang="scss">
 .searching-box {
   width: 100%;
   height: 100% !important;
@@ -1100,8 +1052,8 @@
     width: 100px;
     z-index: 10;
     padding: 10px;
-    box-shadow: 0px 1px 10px 0px rgba(0, 0, 0, 0.05),
-      0px 4px 5px 0px rgba(0, 0, 0, 0.08), 0px 2px 4px -1px rgba(0, 0, 0, 0.12);
+    box-shadow: 0px 1px 10px 0px rgba(0, 0, 0, 0.05), 0px 4px 5px 0px rgba(0, 0, 0, 0.08),
+      0px 2px 4px -1px rgba(0, 0, 0, 0.12);
 
     .downItem {
       text-align: center;

--
Gitblit v1.8.0