guzijian / wvp-GB28181-pro · Commits

Commit f7236c4a9099d0ec3128861f8b485e28acb01146

Authored by 648540858
1 parent 088419b4

添加公共组件设备树

Inline Side-by-side
Showing 11 changed files with 244 additions and 25 deletions
src/main/java/com/genersoft/iot/vmp/storager/IVideoManagerStorage.java
  View file @f7236c4
... ... @@ -180,7 +180,7 @@ public interface IVideoManagerStorage {
180 180 * @param count
181 181 * @return
182 182 */
183   - PageInfo querySubChannels(String deviceId, String channelId, String query, Boolean hasSubChannel, String online, int page, int count);
  183 + PageInfo querySubChannels(String deviceId, String channelId, String query, Boolean hasSubChannel, Boolean online, int page, int count);
184 184  
185 185  
186 186 /**
... ...
src/main/java/com/genersoft/iot/vmp/storager/dao/DeviceChannelMapper.java
  View file @f7236c4
... ... @@ -246,7 +246,9 @@ public interface DeviceChannelMapper {
246 246 " channelId as \"value\",\n" +
247 247 " channelId as \"key\",\n" +
248 248 " longitude,\n" +
249   - " latitude\n" +
  249 + " latitude,\n" +
  250 + " PTZType,\n" +
  251 + " subCount\n" +
250 252 " from device_channel\n" +
251 253 " where deviceId = #{deviceId}")
252 254 List<DeviceChannelTree> tree(String deviceId);
... ...
src/main/java/com/genersoft/iot/vmp/storager/impl/VideoManagerStorageImpl.java
  View file @f7236c4
... ... @@ -365,9 +365,9 @@ public class VideoManagerStorageImpl implements IVideoManagerStorage {
365 365 }
366 366  
367 367 @Override
368   - public PageInfo<DeviceChannel> querySubChannels(String deviceId, String parentChannelId, String query, Boolean hasSubChannel, String online, int page, int count) {
  368 + public PageInfo<DeviceChannel> querySubChannels(String deviceId, String parentChannelId, String query, Boolean hasSubChannel, Boolean online, int page, int count) {
369 369 PageHelper.startPage(page, count);
370   - List<DeviceChannel> all = deviceChannelMapper.queryChannels(deviceId, parentChannelId, null, null, null);
  370 + List<DeviceChannel> all = deviceChannelMapper.queryChannels(deviceId, parentChannelId, query, hasSubChannel, online);
371 371 return new PageInfo<>(all);
372 372 }
373 373  
... ...
src/main/java/com/genersoft/iot/vmp/vmanager/gb28181/device/DeviceQuery.java
  View file @f7236c4
... ... @@ -235,7 +235,7 @@ public class DeviceQuery {
235 235 @ApiImplicitParam(name="page", value = "当前页", required = true, dataTypeClass = Integer.class),
236 236 @ApiImplicitParam(name="count", value = "每页条数", required = true, dataTypeClass = Integer.class),
237 237 @ApiImplicitParam(name="query", value = "查询内容", dataTypeClass = String.class),
238   - @ApiImplicitParam(name="online", value = "是否在线", dataTypeClass = String.class),
  238 + @ApiImplicitParam(name="online", value = "是否在线", dataTypeClass = Boolean.class),
239 239 @ApiImplicitParam(name="channelType", value = "通道类型， 子目录", dataTypeClass = Boolean.class),
240 240 })
241 241 @GetMapping("/sub_channels/{deviceId}/{channelId}/channels")
... ... @@ -244,7 +244,7 @@ public class DeviceQuery {
244 244 int page,
245 245 int count,
246 246 @RequestParam(required = false) String query,
247   - @RequestParam(required = false) String online,
  247 + @RequestParam(required = false) Boolean online,
248 248 @RequestParam(required = false) Boolean channelType){
249 249  
250 250 // if (logger.isDebugEnabled()) {
... ...
web_src/index.html
  View file @f7236c4
... ... @@ -22,7 +22,7 @@
22 22 // 地图瓦片地址
23 23 tilesUrl: "http://webrd0{1-4}.is.autonavi.com/appmaptile?x={x}&y={y}&z={z}&lang=zh_cn&size=1&scale=1&style=8",
24 24 // 瓦片大小
25   - tileSize: 512,
  25 + tileSize: 256,
26 26 // 默认层级
27 27 zoom:10,
28 28 // 默认地图中心点
... ...
web_src/src/components/UiHeader.vue
  View file @f7236c4
... ... @@ -10,6 +10,7 @@
10 10 <el-menu-item index="/cloudRecord">云端录像</el-menu-item>
11 11 <el-menu-item index="/mediaServerManger">节点管理</el-menu-item>
12 12 <el-menu-item index="/parentPlatformList/15/1">国标级联</el-menu-item>
  13 + <el-menu-item index="/test">设备树</el-menu-item>
13 14 <el-menu-item @click="openDoc">在线文档</el-menu-item>
14 15 <!-- <el-submenu index="/setting">-->
15 16 <!-- <template slot="title">系统设置</template>-->
... ...
web_src/src/components/common/DeviceTree.vue 0 → 100644
  View file @f7236c4
  1 +<template>
  2 + <div id="DeviceTree" style="width: 100%;height: 100%; background-color: #FFFFFF">
  3 + <el-container>
  4 + <el-header>设备列表</el-header>
  5 + <el-main style="background-color: #ffffff;">
  6 + <div class="device-tree-main-box">
  7 + <el-tree :props="defaultProps" :load="loadNode" lazy @node-click="handleNodeClick"@node-contextmenu="handleContextMenu">
  8 + <span class="custom-tree-node" slot-scope="{ node, data }" style="width: 100%">
  9 + <span v-if="node.data.type === 0 && node.data.online" title="在线设备" class="device-online iconfont icon-jiedianleizhukongzhongxin2"></span>
  10 + <span v-if="node.data.type === 0 && !node.data.online " title="离线设备" class="device-offline iconfont icon-jiedianleizhukongzhongxin2"></span>
  11 + <span v-if="node.data.type === 2 && node.data.online" title="目录" class="device-online iconfont icon-jiedianleilianjipingtai"></span>
  12 + <span v-if="node.data.type === 2 && !node.data.online" title="目录" class="device-offline iconfont icon-jiedianleilianjipingtai"></span>
  13 + <span v-if="node.data.type === 3 && node.data.online " title="在线通道" class="device-online iconfont icon-shebeileijiankongdian"></span>
  14 + <span v-if="node.data.type === 3 && !node.data.online" title="在线通道" class="device-offline iconfont icon-shebeileijiankongdian"></span>
  15 + <span v-if="node.data.type === 4 && node.data.online " title="在线通道-球机" class="device-online iconfont icon-shebeileiqiuji"></span>
  16 + <span v-if="node.data.type === 4 && !node.data.online" title="在线通道-球机" class="device-offline iconfont icon-shebeileiqiuji"></span>
  17 + <span v-if="node.data.type === 5 && node.data.online " title="在线通道-半球" class="device-online iconfont icon-shebeileibanqiu"></span>
  18 + <span v-if="node.data.type === 5 && !node.data.online" title="在线通道-半球" class="device-offline iconfont icon-shebeileibanqiu"></span>
  19 + <span v-if="node.data.type === 6 && node.data.online " title="在线通道-枪机" class="device-online iconfont icon-shebeileiqiangjitongdao"></span>
  20 + <span v-if="node.data.type === 6 && !node.data.online" title="在线通道-枪机" class="device-offline iconfont icon-shebeileiqiangjitongdao"></span>
  21 + <span v-if="node.data.online" style="padding-left: 1px" class="device-online">{{ node.label }}</span>
  22 + <span v-if="!node.data.online" style="padding-left: 1px" class="device-offline">{{ node.label }}</span>
  23 + <span>
  24 + <i v-if="node.data.hasGPS && node.data.online" style="color: #9d9d9d" class="device-online iconfont icon-dizhi"></i>
  25 + <i v-if="node.data.hasGPS && !node.data.online" style="color: #9d9d9d" class="device-offline iconfont icon-dizhi"></i>
  26 + </span>
  27 + </span>
  28 + </el-tree>
  29 + </div>
  30 + </el-main>
  31 + </el-container>
  32 + </div>
  33 +</template>
  34 +
  35 +<script>
  36 +import DeviceService from "../service/DeviceService.js";
  37 +
  38 +export default {
  39 + name: 'DeviceTree',
  40 + data() {
  41 + return {
  42 + deviceService: new DeviceService(),
  43 + defaultProps: {
  44 + children: 'children',
  45 + label: 'name',
  46 + isLeaf: 'isLeaf'
  47 + }
  48 + };
  49 + },
  50 + props: ['clickEvent', 'contextMenuEvent'],
  51 + methods: {
  52 + handleNodeClick(data) {
  53 + console.log("点击事件")
  54 + if(typeof (this.clickEvent) == "function") {
  55 + this.clickEvent(data.userData)
  56 + }
  57 + },
  58 + handleContextMenu(data) {
  59 + console.log("右键点击事件")
  60 + if(typeof (this.contextMenuEvent) == "function") {
  61 + this.contextMenuEvent(data.userData)
  62 + }
  63 + },
  64 + loadNode: function(node, resolve){
  65 + if (node.level === 0) {
  66 + this.deviceService.getAllDeviceList((data)=>{
  67 + console.log(data)
  68 + if (data.length > 0) {
  69 + let nodeList = []
  70 + for (let i = 0; i < data.length; i++) {
  71 + console.log(data[i].name)
  72 + let node = {
  73 + name: data[i].name || data[i].deviceId,
  74 + isLeaf: false,
  75 + id: data[i].deviceId,
  76 + type: data[i].online,
  77 + online: data[i].online === 1,
  78 + userData: data[i]
  79 + }
  80 + nodeList.push(node);
  81 + }
  82 + resolve(nodeList)
  83 + }else {
  84 + resolve([])
  85 + }
  86 + }, (error)=>{
  87 +
  88 + })
  89 + }
  90 + if (node.level === 1) {
  91 + this.deviceService.getAllChannel(true, node.data.id, (catalogData) => {
  92 + this.deviceService.getAllChannel(false, node.data.id, (channelData) => {
  93 + let data = catalogData.concat(channelData)
  94 + this.channelDataHandler(data, resolve)
  95 + })
  96 + })
  97 + }else if (node.level > 1){
  98 + this.deviceService.getAllSubChannel(true, node.data.deviceId, node.data.id, (catalogData)=>{
  99 + this.deviceService.getAllSubChannel(false, node.data.deviceId, node.data.id, (channelData)=>{
  100 + let data = catalogData.concat(channelData)
  101 + this.channelDataHandler(data, resolve)
  102 + })
  103 + })
  104 + }
  105 + },
  106 + channelDataHandler: function (data, resolve) {
  107 + if (data.length > 0) {
  108 + let nodeList = []
  109 + for (let i = 0; i < data.length; i++) {
  110 + let type = 3;
  111 + if (data[i].subCount > 0) {
  112 + type = 2;
  113 + }else if (data[i].ptztype === 1 ) { // 1-球机;2-半球;3-固定枪机;4-遥控枪机
  114 + type = 4;
  115 + }else if (data[i].ptztype === 2) {
  116 + type = 5;
  117 + }else if (data[i].ptztype === 3 || data[i].ptztype === 4) {
  118 + type = 6;
  119 + }
  120 + let node = {
  121 + name: data[i].name || data[i].channelId,
  122 + isLeaf: data[i].subCount === 0,
  123 + id: data[i].channelId,
  124 + deviceId: data[i].deviceId,
  125 + type: type,
  126 + online: data[i].status === 1,
  127 + hasGPS: data[i].longitude*data[i].latitude !== 0,
  128 + userData: data[i]
  129 + }
  130 + nodeList.push(node);
  131 + }
  132 + resolve(nodeList)
  133 + }else {
  134 + resolve([])
  135 + }
  136 + }
  137 + },
  138 + destroyed() {
  139 + // if (this.jessibuca) {
  140 + // this.jessibuca.destroy();
  141 + // }
  142 + // this.playing = false;
  143 + // this.loaded = false;
  144 + // this.performance = "";
  145 + },
  146 +}
  147 +</script>
  148 +
  149 +<style>
  150 +.device-tree-main-box{
  151 + text-align: left;
  152 +}
  153 +.device-online{
  154 + color: #252525;
  155 +}
  156 +.device-offline{
  157 + color: #727272;
  158 +}
  159 +</style>
... ...
web_src/src/components/service/DeviceService.js
  View file @f7236c4
... ... @@ -46,21 +46,21 @@ class DeviceService{
46 46 }
47 47  
48 48  
49   - getAllCatalog(deviceId, callback, errorCallback) {
  49 + getAllChannel(isCatalog, deviceId, callback, errorCallback) {
50 50 let currentPage = 1;
51 51 let count = 100;
52 52 let catalogList = []
53   - this.getAllCatalogIteration(deviceId, catalogList, currentPage, count, callback, errorCallback)
  53 + this.getAllChannelIteration(isCatalog, deviceId, catalogList, currentPage, count, callback, errorCallback)
54 54 }
55 55  
56   - getAllCatalogIteration(deviceId, catalogList, currentPage, count, callback, errorCallback) {
57   - this.getCatalog(deviceId, currentPage, count, (data) => {
  56 + getAllChannelIteration(isCatalog, deviceId, catalogList, currentPage, count, callback, errorCallback) {
  57 + this.getChanel(isCatalog, deviceId, currentPage, count, (data) => {
58 58 console.log(data)
59 59 if (data.list) {
60 60 catalogList = catalogList.concat(data.list);
61 61 if (catalogList.length < data.total) {
62 62 currentPage ++
63   - this.getAllCatalogIteration(deviceId, catalogList, currentPage, count, callback, errorCallback)
  63 + this.getAllChannelIteration(isCatalog, deviceId, catalogList, currentPage, count, callback, errorCallback)
64 64 }else {
65 65 console.log(2222)
66 66 if (typeof (callback) == "function") callback(catalogList)
... ... @@ -68,7 +68,7 @@ class DeviceService{
68 68 }
69 69 }, errorCallback)
70 70 }
71   - getCatalog(deviceId, currentPage, count, callback, errorCallback) {
  71 + getChanel(isCatalog, deviceId, currentPage, count, callback, errorCallback) {
72 72 this.$axios({
73 73 method: 'get',
74 74 url: `/api/device/query/devices/${deviceId}/channels`,
... ... @@ -77,7 +77,7 @@ class DeviceService{
77 77 count: count,
78 78 query: "",
79 79 online: "",
80   - channelType: true
  80 + channelType: isCatalog
81 81 }
82 82 }).then((res) =>{
83 83 if (typeof (callback) == "function") callback(res.data)
... ... @@ -85,29 +85,28 @@ class DeviceService{
85 85 }
86 86  
87 87  
88   - getAllSubCatalog(deviceId, channelId, callback, errorCallback) {
  88 + getAllSubChannel(isCatalog, deviceId, channelId, callback, errorCallback) {
89 89 let currentPage = 1;
90 90 let count = 100;
91 91 let catalogList = []
92   - this.getAllSubCatalogIteration(deviceId, channelId, catalogList, currentPage, count, callback, errorCallback)
  92 + this.getAllSubChannelIteration(isCatalog, deviceId, channelId, catalogList, currentPage, count, callback, errorCallback)
93 93 }
94 94  
95   - getAllSubCatalogIteration(deviceId,channelId, catalogList, currentPage, count, callback, errorCallback) {
96   - this.getSubCatalog(deviceId, channelId, currentPage, count, (data) => {
  95 + getAllSubChannelIteration(isCatalog, deviceId,channelId, catalogList, currentPage, count, callback, errorCallback) {
  96 + this.getSubChannel(isCatalog, deviceId, channelId, currentPage, count, (data) => {
97 97 console.log(data)
98 98 if (data.list) {
99 99 catalogList = catalogList.concat(data.list);
100 100 if (catalogList.length < data.total) {
101 101 currentPage ++
102   - this.getAllSubCatalogIteration(deviceId, channelId, catalogList, currentPage, count, callback, errorCallback)
  102 + this.getAllSubChannelIteration(isCatalog, deviceId, channelId, catalogList, currentPage, count, callback, errorCallback)
103 103 }else {
104   - console.log(2222)
105 104 if (typeof (callback) == "function") callback(catalogList)
106 105 }
107 106 }
108 107 }, errorCallback)
109 108 }
110   - getSubCatalog(deviceId, channelId, currentPage, count, callback, errorCallback) {
  109 + getSubChannel(isCatalog, deviceId, channelId, currentPage, count, callback, errorCallback) {
111 110 this.$axios({
112 111 method: 'get',
113 112 url: `/api/device/query/sub_channels/${deviceId}/${channelId}/channels`,
... ... @@ -116,12 +115,22 @@ class DeviceService{
116 115 count: count,
117 116 query: "",
118 117 online: "",
119   - channelType: true
  118 + channelType: isCatalog
120 119 }
121 120 }).then((res) =>{
122 121 if (typeof (callback) == "function") callback(res.data)
123 122 }).catch(errorCallback);
124 123 }
  124 + getDeviceTree(deviceId, callback, errorCallback){
  125 + this.$axios({
  126 + method: 'get',
  127 + url: `/api/device/query/${deviceId}/tree`,
  128 + params:{}
  129 + }).then((res) =>{
  130 + console.log(res.data)
  131 + if (typeof (callback) == "function") callback(res.data.data)
  132 + }).catch(errorCallback);
  133 + }
125 134 }
126 135  
127 136 export default DeviceService;
... ...
web_src/src/router/index.js
  View file @f7236c4
... ... @@ -15,6 +15,7 @@ import web from &#39;../components/setting/Web.vue&#39;
15 15 import sip from '../components/setting/Sip.vue'
16 16 import media from '../components/setting/Media.vue'
17 17 import live from '../components/live.vue'
  18 +import deviceTree from '../components/common/DeviceTree.vue'
18 19  
19 20 import wasmPlayer from '../components/common/jessibuca.vue'
20 21 import rtcPlayer from '../components/dialog/rtcPlayer.vue'
... ... @@ -115,5 +116,10 @@ export default new VueRouter({
115 116 name: 'rtcPlayer',
116 117 component: rtcPlayer,
117 118 },
  119 + {
  120 + path: '/test',
  121 + name: 'deviceTree',
  122 + component: deviceTree,
  123 + },
118 124 ]
119 125 })
... ...
web_src/static/css/iconfont.css
  View file @f7236c4
1 1 @font-face {
2 2 font-family: "iconfont"; /* Project id 1291092 */
3   - src: url('iconfont.woff2?t=1647245982270') format('woff2'),
4   - url('iconfont.woff?t=1647245982270') format('woff'),
5   - url('iconfont.ttf?t=1647245982270') format('truetype');
  3 + src: url('iconfont.woff2?t=1650436696596') format('woff2');
6 4 }
7 5  
8 6 .iconfont {
... ... @@ -13,6 +11,50 @@
13 11 -moz-osx-font-smoothing: grayscale;
14 12 }
15 13  
  14 +.icon-jiedianleizhukongzhongxin1:before {
  15 + content: "\e9d0";
  16 +}
  17 +
  18 +.icon-jiedianleizhukongzhongxin2:before {
  19 + content: "\e9d1";
  20 +}
  21 +
  22 +.icon-jiedianleilianjipingtai:before {
  23 + content: "\e9d3";
  24 +}
  25 +
  26 +.icon-jiedianleiquyu:before {
  27 + content: "\e9d4";
  28 +}
  29 +
  30 +.icon-shebeileigis:before {
  31 + content: "\e9ec";
  32 +}
  33 +
  34 +.icon-shebeileibanqiu:before {
  35 + content: "\e9f5";
  36 +}
  37 +
  38 +.icon-shebeileibanqiugis:before {
  39 + content: "\e9f6";
  40 +}
  41 +
  42 +.icon-shebeileijiankongdian:before {
  43 + content: "\ea07";
  44 +}
  45 +
  46 +.icon-shebeileiqiangjitongdao:before {
  47 + content: "\ea15";
  48 +}
  49 +
  50 +.icon-shebeileiqiuji:before {
  51 + content: "\ea17";
  52 +}
  53 +
  54 +.icon-shebeileiqiujigis:before {
  55 + content: "\ea18";
  56 +}
  57 +
16 58 .icon-xitongxinxi:before {
17 59 content: "\e7d6";
18 60 }
... ...
web_src/static/css/iconfont.woff2
View file @f7236c4
No preview for this file type