统计查询(集群)左侧树调试,cardwindow添加analyServerName字段
| | |
| | | import { |
| | | getLocalCameraTree, |
| | | getGB28181CameraTree, |
| | | getClusterTree, |
| | | addAreaTreeData, |
| | | delAreaTreeData, |
| | | updateAreaTreeData, |
| | |
| | | export default class TreeDataPool { |
| | | public openeds: Array<boolean>; |
| | | public treeData: Array<object>; |
| | | public clusterData: Array<object>; |
| | | public gb28181Data: Array<object>; |
| | | public treeDataPure: Array<object>; |
| | | public gb28181DataPure: Array<object>; |
| | | public clusterDataPure: Array<object>; |
| | | public videoArr: Array<string | undefined | object>; |
| | | public searchCamType: number; |
| | | public searchInput: string; |
| | |
| | | this.openeds = [true, true, false]; |
| | | this.treeData = []; |
| | | this.gb28181Data = []; |
| | | this.clusterData = []; |
| | | this.treeDataPure = []; |
| | | this.gb28181DataPure = []; |
| | | this.clusterDataPure = []; |
| | | this.videoArr = [""]; |
| | | this.searchCamType = 0; |
| | | this.searchInput = ""; |
| | |
| | | } |
| | | } |
| | | |
| | | async fetchClusterTree (){ |
| | | debugger |
| | | const rsp: any = await getClusterTree({ |
| | | searchType: this.searchCamType, |
| | | cameraName: this.searchInput |
| | | }); |
| | | if(rsp && rsp.success){ |
| | | console.log(rsp.data); |
| | | this.clusterData = rsp.data ? rsp.data : [] |
| | | if(this.clusterData && this.clusterData.length > 0){ |
| | | this.sortTreeData(this.clusterData) |
| | | } |
| | | this.clusterDataPure = JSON.parse(JSON.stringify(this.clusterData)); |
| | | this.isFold(this.clusterData) |
| | | } |
| | | } |
| | | |
| | | async fetchGbTree() { |
| | | const rsp: any = await getGB28181CameraTree({ |
| | | searchType: this.searchCamType, |
| | |
| | | if (this.openeds[1]) { |
| | | this.fetchGbTree() |
| | | } |
| | | |
| | | this.findAllFile({}) |
| | | } |
| | | |
| | |
| | | inputValue: this.inputValue, |
| | | tabs: this.queryTabs, |
| | | tasks: this.queryTasks, |
| | | treeNodes: this.treeNodes |
| | | treeNodes: this.treeNodes, |
| | | isAll: true |
| | | } |
| | | |
| | | const rsp: any = await getSearchList(param); |
| | |
| | | }); |
| | | }; |
| | | |
| | | export const getClusterTree = (query: any) => { |
| | | return request({ |
| | | url: "/data/api-v/camera/nodeCamera", |
| | | method: "get", |
| | | params: query |
| | | }); |
| | | }; |
| | | |
| | | export const addAreaTreeData = (query: any) => { |
| | | return request({ |
| | | url: "/data/api-v/area/add", |
| | |
| | | name="cluster" |
| | | :style="`height:${height - 56}px;`" |
| | | v-if="showCluster" |
| | | ></el-tab-pane> |
| | | > |
| | | <div class="local-vedio-area"> |
| | | <!-- 搜索 --> |
| | | <div class="navTopSelect"> |
| | | <div class="search-input flex-box"> |
| | | <el-select |
| | | v-model="TreeDataPool.searchCamType" |
| | | placeholder="请选择" |
| | | @change="searchClusterData" |
| | | > |
| | | <el-option |
| | | v-for="item in searchTypeOptions" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | ></el-option> |
| | | </el-select> |
| | | <span style="display: inline-block;padding: 0px 3px;"></span> |
| | | <el-input |
| | | v-model="TreeDataPool.searchInput" |
| | | placeholder="搜索" |
| | | clearable |
| | | @input="querySearchAsync('cluster')" |
| | | > |
| | | <i |
| | | class="el-icon-search el-input__icon" |
| | | style="color:#DCDFE6" |
| | | slot="prefix" |
| | | @click="searchClusterData" |
| | | ></i> |
| | | </el-input> |
| | | </div> |
| | | </div> |
| | | <div class="cluster-list"> |
| | | <tree-menu |
| | | ref="tree" |
| | | :app="appName" |
| | | :treeName="'localTree'" |
| | | :node="TreeDataPool.clusterData" |
| | | :height="height" |
| | | @addDevice="addCamera" |
| | | @import="importCameras" |
| | | /> |
| | | </div> |
| | | </div> |
| | | </el-tab-pane> |
| | | <el-tab-pane |
| | | label="数据栈" |
| | | name="dataStack" |
| | |
| | | return true; |
| | | }, |
| | | showCam() { |
| | | return this.appName === "Camera" || (this.appName === "Search" && (this.buttonAuthority.indexOf("search:camera") >= 0 || this.isAdmin)); |
| | | return this.appName === "Camera" || this.appName === 'Cluster' || (this.appName === "Search" && (this.buttonAuthority.indexOf("search:camera") >= 0 || this.isAdmin)); |
| | | }, |
| | | showCluster() { |
| | | return this.appName === "Cluster"; |
| | |
| | | }; |
| | | }, |
| | | created() { |
| | | console.log(this.appName) |
| | | console.log(this.showCam) |
| | | if (this.showCam) { |
| | | this.TreeDataPool.treeActiveName = "camera" |
| | | this.TreeDataPool.fetchTreeData(); |
| | |
| | | this.DataStackPool.fetchFiles(); |
| | | |
| | | } |
| | | if (this.showCluster) { |
| | | this.TreeDataPool.treeActiveName = "cluster" |
| | | this.TreeDataPool.fetchClusterTree(); |
| | | } |
| | | }, |
| | | methods: { |
| | | searchAreaData() { |
| | |
| | | }, |
| | | searchDataStack() { |
| | | this.DataStackPool.fetchFiles(); |
| | | }, |
| | | searchClusterData () { |
| | | this.TreeDataPool.fetchClusterTree(); |
| | | }, |
| | | lockSwitch() { |
| | | this.TreeDataPool.readonly = !this.TreeDataPool.readonly; |
| | |
| | | color: #606266; |
| | | } |
| | | } |
| | | .flex-box{ |
| | | display: flex; |
| | | } |
| | | </style> |
| | |
| | | <template lang='pug'> |
| | | .net |
| | | .arrow_box(:style="toolTipStyle") |
| | | p {{toolTipAddr}} |
| | | d3-network( |
| | | ref='net' |
| | | :startX="startX" |
| | |
| | | <p> |
| | | <span class="fontStyleForModel">{{ data.cameraAddr }}</span> |
| | | </p> |
| | | <p> |
| | | <span class="fontStyleForModel">{{ data.analyServerName }}</span> |
| | | </p> |
| | | <p style="width:100%"> |
| | | <span v-for="(item,index) in data.alarmRules" :key="index+'rule'"> |
| | | <span class="fontStyleForModel">{{data.taskName}}</span> |
| | |
| | | <div class="resize-bar"></div> |
| | | <div class="resize-line"></div> |
| | | <div class="resize-save"> |
| | | <left-nav :appName="'Search'" :height="screenHeight - 40"></left-nav> |
| | | <left-nav :appName="'Cluster'" :height="screenHeight - 40"></left-nav> |
| | | </div> |
| | | </div> |
| | | <div class="column-right"> |
| | |
| | | this.VideoPhotoData.searchTime = this.format(this.searchTime); |
| | | //this.VideoPhotoData.inputValue = this.searchText; |
| | | this.VideoPhotoData.showType = this.showType; |
| | | this.VideoPhotoData.isAll = true; |
| | | if (!this.VideoPhotoData.uploadType) { |
| | | console.log("查询方法"); |
| | | this.VideoPhotoData.uploadDiaplay = false; |