优化通道管理/业务分组页面逻辑

src/main/java/com/genersoft/iot/vmp/gb28181/controller/CommonChannelController.java

@@ -98,23 +98,40 @@ public class CommonChannelController {
         return channel;
     }
 
-    @Operation(summary = "获取通道列表", security = @SecurityRequirement(name = JwtUtils.HEADER))
+    @Operation(summary = "获取关联行政区划通道列表", security = @SecurityRequirement(name = JwtUtils.HEADER))
     @Parameter(name = "page", description = "当前页", required = true)
     @Parameter(name = "count", description = "每页查询数量", required = true)
     @Parameter(name = "query", description = "查询内容")
     @Parameter(name = "online", description = "是否在线")
     @Parameter(name = "civilCode", description = "行政区划")
+    @GetMapping("/civilcode/list")
+    public PageInfo<CommonGBChannel> queryListByCivilCode(int page, int count,
+                                               @RequestParam(required = false) String query,
+                                               @RequestParam(required = false) Boolean online,
+                                               @RequestParam(required = false) Integer channelType,
+                                               @RequestParam(required = false) String civilCode){
+        if (ObjectUtils.isEmpty(query)){
+            query = null;
+        }
+        return channelService.queryListByCivilCode(page, count, query, online, channelType, civilCode);
+    }
+
+    @Operation(summary = "获取关联业务分组通道列表", security = @SecurityRequirement(name = JwtUtils.HEADER))
+    @Parameter(name = "page", description = "当前页", required = true)
+    @Parameter(name = "count", description = "每页查询数量", required = true)
+    @Parameter(name = "query", description = "查询内容")
+    @Parameter(name = "online", description = "是否在线")
     @Parameter(name = "groupDeviceId", description = "业务分组下的父节点ID")
-    @GetMapping("/list")
-    public PageInfo<CommonGBChannel> queryList(int page, int count,
+    @GetMapping("/parent/list")
+    public PageInfo<CommonGBChannel> queryListByParentId(int page, int count,
                                                @RequestParam(required = false) String query,
                                                @RequestParam(required = false) Boolean online,
-                                               @RequestParam(required = false) String civilCode,
+                                               @RequestParam(required = false) Integer channelType,
                                                @RequestParam(required = false) String groupDeviceId){
         if (ObjectUtils.isEmpty(query)){
             query = null;
         }
-        return channelService.queryList(page, count, query, online, civilCode, groupDeviceId);
+        return channelService.queryListByParentId(page, count, query, online, channelType, groupDeviceId);
     }
 
     @Operation(summary = "通道设置行政区划", security = @SecurityRequirement(name = JwtUtils.HEADER))

src/main/java/com/genersoft/iot/vmp/gb28181/controller/GroupController.java

@@ -40,12 +40,13 @@ public class GroupController {
     @GetMapping("/tree/list")
     public List<GroupTree> queryForTree(
             @RequestParam(required = false) String query,
-            @RequestParam(required = false) Integer parent
+            @RequestParam(required = false) Integer parent,
+            @RequestParam(required = false) Boolean hasChannel
     ){
         if (ObjectUtils.isEmpty(query)) {
             query = null;
         }
-        return groupService.queryForTree(query, parent);
+        return groupService.queryForTree(query, parent, hasChannel);
     }
 
     @Operation(summary = "更新分组")
@@ -68,6 +69,14 @@ public class GroupController {
         }
     }
 
+    @Operation(summary = "获取所属的行政区划下的行政区划")
+    @Parameter(name = "deviceId", description = "当前的行政区划", required = false)
+    @ResponseBody
+    @GetMapping("/path")
+    public List<Group> getPath(String deviceId, String businessGroup){
+        return groupService.getPath(deviceId, businessGroup);
+    }
+
 //    @Operation(summary = "根据分组Id查询分组")
 //    @Parameter(name = "groupDeviceId", description = "分组节点编号", required = true)
 //    @ResponseBody

src/main/java/com/genersoft/iot/vmp/gb28181/dao/CommonGBChannelMapper.java

@@ -255,9 +255,17 @@ public interface CommonGBChannelMapper {
     @SelectProvider(type = ChannelProvider.class, method = "queryByStreamProxyId")
     CommonGBChannel queryByStreamProxyId(@Param("streamProxyId") Integer streamProxyId);
 
-    @SelectProvider(type = ChannelProvider.class, method = "queryList")
-    List<CommonGBChannel> queryList(@Param("query") String query, @Param("online") Boolean online,
-                                    @Param("civilCode") String civilCode, @Param("groupDeviceId") String groupDeviceId);
+    @SelectProvider(type = ChannelProvider.class, method = "queryListByCivilCode")
+    List<CommonGBChannel> queryListByCivilCode(@Param("query") String query, @Param("online") Boolean online,
+                                               @Param("channelType") Integer channelType, @Param("civilCode") String civilCode);
+
+
+
+    @SelectProvider(type = ChannelProvider.class, method = "queryListByParentId")
+    List<CommonGBChannel> queryListByParentId(@Param("query") String query, @Param("online") Boolean online,
+                                              @Param("channelType") Integer channelType, @Param("groupDeviceId") String groupDeviceId);
+
+
 
     @Select("<script>" +
             " select " +

src/main/java/com/genersoft/iot/vmp/gb28181/dao/provider/ChannelProvider.java

@@ -117,7 +117,7 @@ public class ChannelProvider {
     }
 
 
-    public String queryList(Map<String, Object> params ){
+    public String queryListByCivilCode(Map<String, Object> params ){
         StringBuilder sqlBuild = new StringBuilder();
         sqlBuild.append(BASE_SQL);
         sqlBuild.append(" where channel_type = 0 ");
@@ -134,9 +134,50 @@ public class ChannelProvider {
         }
         if (params.get("civilCode") != null) {
             sqlBuild.append(" AND coalesce(gb_civil_code, civil_code) = #{civilCode}");
+        }else {
+            sqlBuild.append(" AND coalesce(gb_civil_code, civil_code) is null");
+        }
+        if (params.get("channelType") != null) {
+            if ((Integer)params.get("channelType") == 0) {
+                sqlBuild.append(" AND device_db_id is not null");
+            }else if ((Integer)params.get("channelType") == 1) {
+                sqlBuild.append(" AND stream_push_id is not null");
+            }else if ((Integer)params.get("channelType") == 2) {
+                sqlBuild.append(" AND stream_proxy_id is not null");
+            }
+        }
+        return sqlBuild.toString();
+    }
+
+    public String queryListByParentId(Map<String, Object> params ){
+        StringBuilder sqlBuild = new StringBuilder();
+        sqlBuild.append(BASE_SQL);
+        sqlBuild.append(" where channel_type = 0 ");
+        if (params.get("query") != null) {
+            sqlBuild.append(" AND (coalesce(gb_device_id, device_id) LIKE concat('%',#{query},'%')" +
+                    " OR coalesce(gb_name, name) LIKE concat('%',#{query},'%') )")
+            ;
+        }
+        if (params.get("online") != null && (Boolean)params.get("online")) {
+            sqlBuild.append(" AND coalesce(gb_status, status) = 'ON'");
+        }
+        if (params.get("online") != null && !(Boolean)params.get("online")) {
+            sqlBuild.append(" AND coalesce(gb_status, status) = 'OFF'");
         }
         if (params.get("groupDeviceId") != null) {
             sqlBuild.append(" AND coalesce(gb_parent_id, parent_id) = #{groupDeviceId}");
+        }else {
+            sqlBuild.append(" AND coalesce(gb_parent_id, parent_id) is null");
+        }
+
+        if (params.get("channelType") != null) {
+            if ((Integer)params.get("channelType") == 0) {
+                sqlBuild.append(" AND device_db_id is not null");
+            }else if ((Integer)params.get("channelType") == 1) {
+                sqlBuild.append(" AND stream_push_id is not null");
+            }else if ((Integer)params.get("channelType") == 2) {
+                sqlBuild.append(" AND stream_proxy_id is not null");
+            }
         }
         return sqlBuild.toString();
     }

src/main/java/com/genersoft/iot/vmp/gb28181/service/IGbChannelService.java

@@ -41,7 +41,9 @@ public interface IGbChannelService {
 
     void reset(int id);
 
-    PageInfo<CommonGBChannel> queryList(int page, int count, String query, Boolean online, String civilCode, String groupDeviceId);
+    PageInfo<CommonGBChannel> queryListByCivilCode(int page, int count, String query, Boolean online, Integer channelType, String civilCode);
+
+    PageInfo<CommonGBChannel> queryListByParentId(int page, int count, String query, Boolean online, Integer channelType, String groupDeviceId);
 
     void removeCivilCode(List<Region> allChildren);
 

src/main/java/com/genersoft/iot/vmp/gb28181/service/IGroupService.java

@@ -14,11 +14,13 @@ public interface IGroupService {
 
     Group queryGroupByDeviceId(String regionDeviceId);
 
-    List<GroupTree> queryForTree(String query, Integer parent);
+    List<GroupTree> queryForTree(String query, Integer parent, Boolean hasChannel);
 
     void syncFromChannel();
 
     boolean delete(int id);
 
     boolean batchAdd(List<Group> groupList);
+
+    List<Group> getPath(String deviceId, String businessGroup);
 }

src/main/java/com/genersoft/iot/vmp/gb28181/service/impl/GbChannelServiceImpl.java

@@ -388,9 +388,16 @@ public class GbChannelServiceImpl implements IGbChannelService {
     }
 
     @Override
-    public PageInfo<CommonGBChannel> queryList(int page, int count, String query, Boolean online, String civilCode, String groupDeviceId) {
+    public PageInfo<CommonGBChannel> queryListByCivilCode(int page, int count, String query, Boolean online, Integer channelType, String civilCode) {
         PageHelper.startPage(page, count);
-        List<CommonGBChannel> all = commonGBChannelMapper.queryList(query, online, civilCode, groupDeviceId);
+        List<CommonGBChannel> all = commonGBChannelMapper.queryListByCivilCode(query, online, channelType, civilCode);
+        return new PageInfo<>(all);
+    }
+
+    @Override
+    public PageInfo<CommonGBChannel> queryListByParentId(int page, int count, String query, Boolean online, Integer channelType, String groupDeviceId) {
+        PageHelper.startPage(page, count);
+        List<CommonGBChannel> all = commonGBChannelMapper.queryListByParentId(query, online, channelType, groupDeviceId);
         return new PageInfo<>(all);
     }
 

src/main/java/com/genersoft/iot/vmp/gb28181/service/impl/GroupServiceImpl.java

@@ -1,5 +1,6 @@
 package com.genersoft.iot.vmp.gb28181.service.impl;
 
+import com.genersoft.iot.vmp.conf.exception.ControllerException;
 import com.genersoft.iot.vmp.gb28181.bean.*;
 import com.genersoft.iot.vmp.gb28181.dao.CommonGBChannelMapper;
 import com.genersoft.iot.vmp.gb28181.dao.GroupMapper;
@@ -8,6 +9,7 @@ import com.genersoft.iot.vmp.gb28181.event.subscribe.catalog.CatalogEvent;
 import com.genersoft.iot.vmp.gb28181.service.IGbChannelService;
 import com.genersoft.iot.vmp.gb28181.service.IGroupService;
 import com.genersoft.iot.vmp.utils.DateUtil;
+import com.genersoft.iot.vmp.vmanager.bean.ErrorCode;
 import lombok.extern.slf4j.Slf4j;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.stereotype.Service;
@@ -15,10 +17,7 @@ import org.springframework.transaction.annotation.Transactional;
 import org.springframework.util.Assert;
 import org.springframework.util.ObjectUtils;
 
-import java.util.ArrayList;
-import java.util.HashMap;
-import java.util.List;
-import java.util.Map;
+import java.util.*;
 
 /**
  * 区域管理类
@@ -154,7 +153,7 @@ public class GroupServiceImpl implements IGroupService {
     }
 
     @Override
-    public List<GroupTree> queryForTree(String query, Integer parentId) {
+    public List<GroupTree> queryForTree(String query, Integer parentId, Boolean hasChannel) {
 
         List<GroupTree> groupTrees = groupManager.queryForTree(query, parentId);
         if (parentId == null) {
@@ -162,7 +161,7 @@ public class GroupServiceImpl implements IGroupService {
         }
         // 查询含有的通道
         Group parentGroup = groupManager.queryOne(parentId);
-        if (parentGroup != null ) {
+        if (parentGroup != null && hasChannel != null && hasChannel) {
             List<GroupTree> groupTreesForChannel = commonGBChannelMapper.queryForGroupTreeByParentId(query, parentGroup.getDeviceId());
             if (!ObjectUtils.isEmpty(groupTreesForChannel)) {
                 groupTrees.addAll(groupTreesForChannel);
@@ -247,4 +246,37 @@ public class GroupServiceImpl implements IGroupService {
 
         return true;
     }
+
+    @Override
+    public List<Group> getPath(String deviceId, String businessGroup) {
+        Group businessGroupInDb = groupManager.queryBusinessGroup(businessGroup);
+        if (businessGroupInDb == null) {
+            throw new ControllerException(ErrorCode.ERROR100.getCode(), "业务分组不存在");
+        }
+        List<Group> groupList = new LinkedList<>();
+        groupList.add(businessGroupInDb);
+        Group group = groupManager.queryOneByDeviceId(deviceId, businessGroup);
+        if (group == null) {
+            throw new ControllerException(ErrorCode.ERROR100.getCode(), "虚拟组织不存在");
+        }
+        groupList.add(group);
+        List<Group> allParent = getAllParent(group);
+        groupList.addAll(allParent);
+        return groupList;
+    }
+
+    private List<Group> getAllParent(Group group) {
+        if (group.getParentId() == null || group.getBusinessGroup() == null) {
+            return new ArrayList<>();
+        }
+
+        List<Group> groupList = new ArrayList<>();
+        Group parent = groupManager.queryOneByDeviceId(group.getParentDeviceId(), group.getBusinessGroup());
+        if (parent == null) {
+            return groupList;
+        }
+        List<Group> allParent = getAllParent(parent);
+        allParent.add(parent);
+        return allParent;
+    }
 }

src/main/java/com/genersoft/iot/vmp/gb28181/service/impl/RegionServiceImpl.java

@@ -242,13 +242,14 @@ public class RegionServiceImpl implements IRegionService {
             return new ArrayList<>();
         }
 
-        List<Region> regionList = new ArrayList<>();
+        List<Region> regionList = new LinkedList<>();
         Region parent = regionMapper.queryByDeviceId(region.getParentDeviceId());
         if (parent == null) {
             return regionList;
         }
+        regionList.add(parent);
         List<Region> allParent = getAllParent(parent);
-        allParent.add(parent);
-        return allParent;
+        regionList.addAll(allParent);
+        return regionList;
     }
 }

web_src/package.json

@@ -16,7 +16,6 @@
     "@wchbrad/vue-easy-tree": "^1.0.12",
     "axios": "^0.24.0",
     "core-js": "^2.6.5",
-    "defineProperty": "link:@babel/runtime/helpers/defineProperty",
     "echarts": "^4.9.0",
     "element-ui": "^2.15.14",
     "fingerprintjs2": "^2.1.2",
@@ -24,7 +23,6 @@
     "ol": "^6.14.1",
     "postcss-pxtorem": "^5.1.1",
     "screenfull": "5.1.0",
-    "slicedToArray": "link:@babel/runtime/helpers/slicedToArray",
     "strip-ansi": "^7.1.0",
     "uuid": "^8.3.2",
     "v-charts": "^1.19.0",

web_src/src/components/common/GroupTree.vue

@@ -4,14 +4,15 @@
       <div class="page-title">业务分组</div>
       <div class="page-header-btn">
         <div style="display: inline;">
-          <el-input @input="search" style="visibility:hidden; margin-right: 1rem; width: 12rem;" size="mini" placeholder="关键字"
+          <el-input @input="search" style="visibility:hidden; margin-right: 1rem; width: 12rem;" size="mini"
+                    placeholder="关键字"
                     prefix-icon="el-icon-search" v-model="searchSrt" clearable></el-input>
 
           <el-checkbox v-model="showCode">显示编号</el-checkbox>
         </div>
       </div>
     </div>
-    <div v-if="showHeader" style="height: 2rem; background-color: #FFFFFF" ></div>
+    <div v-if="showHeader" style="height: 2rem; background-color: #FFFFFF"></div>
     <div>
       <vue-easy-tree
         class="flow-tree"
@@ -27,22 +28,21 @@
         @node-contextmenu="contextmenuEventHandler"
         @node-click="nodeClickHandler"
       >
-        <template  v-slot:default="{ node, data }">
+        <template v-slot:default="{ node, data }">
           <span class="custom-tree-node">
-            <span @click.stop v-if="edit">
-            <el-radio v-if="node.data.type === 0 && node.level > 2" style="margin-right: 0" v-model="chooseId" @input="chooseIdChange(node.data.treeId, node.data.deviceId, node.data.businessGroup)" :label="node.data.deviceId">{{''}}</el-radio>
-          </span>
-          <span v-if="node.data.type === 0" style="color: #409EFF" class="iconfont icon-bianzubeifen3"></span>
-          <span v-if="node.data.type === 1 && node.data.status === 'ON'" style="color: #409EFF" class="iconfont icon-shexiangtou2"></span>
-          <span v-if="node.data.type === 1 && node.data.status !== 'ON'" style="color: #808181" class="iconfont icon-shexiangtou2"></span>
-          <span style=" padding-left: 1px" v-if="node.data.deviceId !=='' && showCode" :title="node.data.deviceId">{{ node.label }}（编号：{{ node.data.deviceId }}）</span>
-          <span style=" padding-left: 1px" v-if="node.data.deviceId ==='' || !showCode" :title="node.data.deviceId">{{ node.label }}</span>
+            <span v-if="node.data.type === 0 && chooseId !== node.data.deviceId" style="color: #409EFF" class="iconfont icon-bianzubeifen3"></span>
+          <span v-if="node.data.type === 0 && chooseId === node.data.deviceId" style="color: #c60135;" class="iconfont icon-bianzubeifen3"></span>
+            <span v-if="node.data.type === 1 && node.data.status === 'ON'" style="color: #409EFF" class="iconfont icon-shexiangtou2"></span>
+            <span v-if="node.data.type === 1 && node.data.status !== 'ON'" style="color: #808181" class="iconfont icon-shexiangtou2"></span>
+            <span style=" padding-left: 1px" v-if="node.data.deviceId !=='' && showCode" :title="node.data.deviceId">{{ node.label }}（编号：{{ node.data.deviceId }}）</span>
+            <span style=" padding-left: 1px" v-if="node.data.deviceId ==='' || !showCode" :title="node.data.deviceId">{{ node.label }}</span>
           </span>
         </template>
       </vue-easy-tree>
     </div>
     <groupEdit ref="groupEdit"></groupEdit>
     <gbDeviceSelect ref="gbDeviceSelect"></gbDeviceSelect>
+    <gbChannelSelect ref="gbChannelSelect"></gbChannelSelect>
   </div>
 </template>
 
@@ -50,10 +50,12 @@
 import VueEasyTree from "@wchbrad/vue-easy-tree";
 import groupEdit from './../dialog/groupEdit'
 import gbDeviceSelect from './../dialog/GbDeviceSelect'
+import GbChannelSelect from "../dialog/GbChannelSelect.vue";
 
 export default {
   name: 'DeviceTree',
   components: {
+    GbChannelSelect,
     VueEasyTree, groupEdit, gbDeviceSelect
   },
   data() {
@@ -68,7 +70,7 @@ export default {
       treeData: [],
     }
   },
-  props: ['edit', 'clickEvent', 'chooseIdChange', 'onChannelChange', 'showHeader'],
+  props: ['edit', 'clickEvent', 'onChannelChange', 'showHeader', 'hasChannel', 'addChannelToGroup'],
   created() {
   },
   methods: {
@@ -94,7 +96,8 @@ export default {
           url: `/api/group/tree/list`,
           params: {
             query: this.searchSrt,
-            parent: node.data.id
+            parent: node.data.id,
+            hasChannel: this.hasChannel
           }
         }).then((res) => {
           if (res.data.code === 0) {
@@ -113,42 +116,7 @@ export default {
       if (!this.edit) {
         return;
       }
-      console.log(node.level)
-      if (node.data.type === 1) {
-        data.parentId = node.parent.data.id;
-        this.$contextmenu({
-          items: [
-            {
-              label: "移除通道",
-              icon: "el-icon-delete",
-              disabled: false,
-              onClick: () => {
-                console.log(data)
-                this.$axios({
-                  method: "post",
-                  url: `/api/common/channel/group/delete`,
-                  data: {
-                    channelIds: [data.id]
-                  }
-                }).then((res) => {
-                  console.log("移除成功")
-                  console.log(node)
-                  if (this.onChannelChange) {
-                    this.onChannelChange()
-                  }
-                  node.parent.loaded = false
-                  node.parent.expand();
-                }).catch(function (error) {
-                  console.log(error);
-                });
-              }
-            }
-          ],
-          event, // 鼠标事件信息
-          customClass: "custom-class", // 自定义菜单 class
-          zIndex: 3000, // 菜单样式 z-index
-        });
-      } else if (node.data.type === 0) {
+      if (node.data.type === 0) {
         this.$contextmenu({
           items: [
             {
@@ -204,10 +172,19 @@ export default {
               label: "移除设备",
               icon: "el-icon-delete",
               disabled: node.level <= 2,
+              divided: true,
               onClick: () => {
                 this.removeChannelFormDevice(data.id, node)
               }
             },
+            {
+              label: "添加通道",
+              icon: "el-icon-plus",
+              disabled: node.level <= 2,
+              onClick: () => {
+                this.addChannel(data.id, node)
+              }
+            },
             // {
             //   label: "导出",
             //   icon: "el-icon-download",
@@ -250,15 +227,15 @@ export default {
           node.parent.loaded = false
           node.parent.expand();
           if (this.onChannelChange) {
-            this.onChannelChange()
+            this.onChannelChange(node.data.deviceId)
           }
         }
       }).catch(function (error) {
-          console.log(error);
+        console.log(error);
       });
     },
     addChannelFormDevice: function (id, node) {
-      this.$refs.gbDeviceSelect.openDialog((rows)=>{
+      this.$refs.gbDeviceSelect.openDialog((rows) => {
         let deviceIds = []
         for (let i = 0; i < rows.length; i++) {
           deviceIds.push(rows[i].id)
@@ -271,26 +248,26 @@ export default {
             businessGroup: node.data.businessGroup,
             deviceIds: deviceIds,
           }
-        }).then((res)=> {
+        }).then((res) => {
           if (res.data.code === 0) {
             this.$message.success({
-            showClose: true,
-            message: "保存成功"
-          })
+              showClose: true,
+              message: "保存成功"
+            })
             if (this.onChannelChange) {
               this.onChannelChange()
             }
             console.log(node)
             node.loaded = false
             node.expand();
-          }else {
+          } else {
             this.$message.error({
               showClose: true,
               message: res.data.msg
             })
           }
           this.loading = false
-        }).catch((error)=> {
+        }).catch((error) => {
           this.$message.error({
             showClose: true,
             message: error
@@ -300,7 +277,7 @@ export default {
       })
     },
     removeChannelFormDevice: function (id, node) {
-      this.$refs.gbDeviceSelect.openDialog((rows)=>{
+      this.$refs.gbDeviceSelect.openDialog((rows) => {
         let deviceIds = []
         for (let i = 0; i < rows.length; i++) {
           deviceIds.push(rows[i].id)
@@ -311,25 +288,25 @@ export default {
           data: {
             deviceIds: deviceIds,
           }
-        }).then((res)=> {
+        }).then((res) => {
           if (res.data.code === 0) {
             this.$message.success({
-            showClose: true,
-            message: "保存成功"
-          })
+              showClose: true,
+              message: "保存成功"
+            })
             if (this.onChannelChange) {
               this.onChannelChange()
             }
             node.loaded = false
             node.expand();
-          }else {
+          } else {
             this.$message.error({
               showClose: true,
               message: res.data.msg
             })
           }
           this.loading = false
-        }).catch((error)=> {
+        }).catch((error) => {
           this.$message.error({
             showClose: true,
             message: error
@@ -338,6 +315,13 @@ export default {
         });
       })
     },
+    addChannel: function (id, node) {
+      this.$refs.gbChannelSelect.openDialog((data) => {
+        console.log("选择的数据")
+        console.log(data)
+        this.addChannelToGroup(node.data.deviceId, node.data.businessGroup, data)
+      })
+    },
     refreshNode: function (node) {
       console.log(node)
       node.loaded = false
@@ -358,10 +342,10 @@ export default {
         name: "",
         deviceId: "",
         civilCode: "",
-        parentDeviceId: node.level > 2 ? node.data.deviceId:"",
+        parentDeviceId: node.level > 2 ? node.data.deviceId : "",
         parentId: node.data.id,
-        businessGroup: node.level > 2 ? node.data.businessGroup: node.data.deviceId,
-      },form => {
+        businessGroup: node.level > 2 ? node.data.businessGroup : node.data.deviceId,
+      }, form => {
         console.log(node)
         node.loaded = false
         node.expand();
@@ -369,13 +353,14 @@ export default {
     },
     editGroup: function (id, node) {
       console.log(node)
-      this.$refs.groupEdit.openDialog(node.data,form => {
+      this.$refs.groupEdit.openDialog(node.data, form => {
         console.log(node)
         node.parent.loaded = false
         node.parent.expand();
       }, id);
     },
     nodeClickHandler: function (data, node, tree) {
+      this.chooseId = data.deviceId;
       if (this.clickEvent) {
         this.clickEvent(data)
       }
@@ -404,6 +389,7 @@ export default {
 .device-offline {
   color: #727272;
 }
+
 .custom-tree-node .el-radio__label {
   padding-left: 4px !important;
 }

web_src/src/components/common/RegionTree.vue

@@ -30,7 +30,7 @@
         <template class="custom-tree-node" v-slot:default="{ node, data }">
         <span class="custom-tree-node" >
           <span v-if="node.data.type === 0 && chooseId !== node.data.deviceId" style="color: #409EFF" class="iconfont icon-bianzubeifen3"></span>
-          <span v-if="node.data.type === 0 && chooseId === node.data.deviceId" style="color: #013e83;" class="iconfont icon-bianzubeifen3"></span>
+          <span v-if="node.data.type === 0 && chooseId === node.data.deviceId" style="color: #c60135;" class="iconfont icon-bianzubeifen3"></span>
           <span v-if="node.data.type === 1 && node.data.status === 'ON'" style="color: #409EFF" class="iconfont icon-shexiangtou2"></span>
           <span v-if="node.data.type === 1 && node.data.status !== 'ON'" style="color: #808181" class="iconfont icon-shexiangtou2"></span>
           <span style=" padding-left: 1px" v-if="node.data.deviceId !=='' && showCode" :title="node.data.deviceId">{{ node.label }}（编号：{{ node.data.deviceId }}）</span>
@@ -41,6 +41,7 @@
     </div>
     <regionEdit ref="regionEdit"></regionEdit>
     <gbDeviceSelect ref="gbDeviceSelect"></gbDeviceSelect>
+    <GbChannelSelect ref="gbChannelSelect" dataType="civilCode"></GbChannelSelect>
   </div>
 </template>
 
@@ -48,10 +49,12 @@
 import VueEasyTree from "@wchbrad/vue-easy-tree";
 import regionEdit from './../dialog/regionEdit'
 import gbDeviceSelect from './../dialog/GbDeviceSelect'
+import GbChannelSelect from "../dialog/GbChannelSelect.vue";
 
 export default {
   name: 'DeviceTree',
   components: {
+    GbChannelSelect,
     VueEasyTree, regionEdit, gbDeviceSelect
   },
   data() {
@@ -65,7 +68,7 @@ export default {
       treeData: [],
     }
   },
-  props: ['edit', 'clickEvent', 'onChannelChange', 'showHeader', 'hasChannel'],
+  props: ['edit', 'clickEvent', 'onChannelChange', 'showHeader', 'hasChannel', 'addChannelToCivilCode'],
   created() {
   },
   methods: {
@@ -249,7 +252,7 @@ export default {
             message: "保存成功"
           })
             if (this.onChannelChange) {
-              this.onChannelChange(node.data.deviceId)
+              this.onChannelChange()
             }
             node.loaded = false
             node.expand();
@@ -309,43 +312,10 @@ export default {
       })
     },
     addChannel: function (id, node) {
-      this.$refs.gbDeviceSelect.openDialog((rows)=>{
-        let deviceIds = []
-        for (let i = 0; i < rows.length; i++) {
-          deviceIds.push(rows[i].id)
-        }
-        this.$axios({
-          method: 'post',
-          url: `/api/common/channel/region/device/add`,
-          data: {
-            civilCode: node.data.deviceId,
-            deviceIds: deviceIds,
-          }
-        }).then((res)=> {
-          if (res.data.code === 0) {
-            this.$message.success({
-              showClose: true,
-              message: "保存成功"
-            })
-            if (this.onChannelChange) {
-              this.onChannelChange(node.data.deviceId)
-            }
-            node.loaded = false
-            node.expand();
-          }else {
-            this.$message.error({
-              showClose: true,
-              message: res.data.msg
-            })
-          }
-          this.loading = false
-        }).catch((error)=> {
-          this.$message.error({
-            showClose: true,
-            message: error
-          })
-          this.loading = false
-        });
+      this.$refs.gbChannelSelect.openDialog((data) => {
+        console.log("选择的数据")
+        console.log(data)
+        this.addChannelToCivilCode(node.data.deviceId, data)
       })
     },
     refreshNode: function (node) {
@@ -383,8 +353,7 @@ export default {
       }, node.data);
     },
     nodeClickHandler: function (data, node, tree) {
-      console.log(data)
-      console.log(node)
+
       this.chooseId = data.deviceId;
       if (this.clickEvent) {
         this.clickEvent(data)

web_src/src/components/dialog/GbChannelSelect.vue

@@ -0,0 +1,185 @@
+<template>
+  <div id="gbChannelSelect" v-loading="getChannelListLoading">
+    <el-dialog
+      title="添加国标通道"
+      width="60%"
+      top="2rem"
+      :close-on-click-modal="false"
+      :visible.sync="showDialog"
+      :destroy-on-close="true"
+      append-to-body
+      @close="close()"
+    >
+      <div class="page-header" style="width: 100%">
+        <div class="page-header-btn" style="width: 100%; text-align: left">
+          搜索:
+          <el-input @input="getChannelList" style="margin-right: 1rem; width: auto;" size="mini" placeholder="关键字"
+                    prefix-icon="el-icon-search" v-model="searchSrt" clearable></el-input>
+          在线状态:
+          <el-select size="mini" style="width: 8rem; margin-right: 1rem;" @change="getChannelList" v-model="online" placeholder="请选择"
+                     default-first-option>
+            <el-option label="全部" value=""></el-option>
+            <el-option label="在线" value="true"></el-option>
+            <el-option label="离线" value="false"></el-option>
+          </el-select>
+          类型:
+          <el-select size="mini" style="width: 8rem; margin-right: 1rem;" @change="getChannelList" v-model="channelType" placeholder="请选择"
+                     default-first-option>
+            <el-option label="全部" value=""></el-option>
+            <el-option label="国标设备" :value="0"></el-option>
+            <el-option label="推流设备" :value="1"></el-option>
+            <el-option label="拉流代理" :value="2"></el-option>
+          </el-select>
+          <el-button size="mini" :loading="getChannelListLoading"
+                     @click="getChannelList()">刷新</el-button>
+          <el-button type="primary" size="mini" style="float: right" @click="onSubmit">确 定</el-button>
+        </div>
+      </div>
+      <!--通道列表-->
+      <el-table size="small"  ref="channelListTable" :data="channelList" :height="winHeight" style="width: 100%;"
+                header-row-class-name="table-header" @selection-change="handleSelectionChange" >
+        <el-table-column type="selection" width="55" >
+        </el-table-column>
+        <el-table-column prop="gbName" label="名称" min-width="180">
+        </el-table-column>
+        <el-table-column prop="gbDeviceId" label="编号" min-width="180">
+        </el-table-column>
+        <el-table-column prop="gbManufacturer" label="厂家" min-width="100">
+        </el-table-column>
+        <el-table-column label="类型" min-width="100">
+          <template v-slot:default="scope">
+            <div slot="reference" class="name-wrapper">
+              <el-tag size="medium" effect="plain" v-if="scope.row.gbDeviceDbId">国标设备</el-tag>
+              <el-tag size="medium" effect="plain" type="success" v-if="scope.row.streamPushId">推流设备</el-tag>
+              <el-tag size="medium" effect="plain" type="warning" v-if="scope.row.streamProxyId">拉流代理</el-tag>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column label="状态" min-width="100">
+          <template v-slot:default="scope">
+            <div slot="reference" class="name-wrapper">
+              <el-tag size="medium" v-if="scope.row.gbStatus === 'ON'">在线</el-tag>
+              <el-tag size="medium" type="info" v-if="scope.row.gbStatus !== 'ON'">离线</el-tag>
+            </div>
+          </template>
+        </el-table-column>
+      </el-table>
+      <el-pagination
+        style="text-align: right"
+        @size-change="handleSizeChange"
+        @current-change="currentChange"
+        :current-page="currentPage"
+        :page-size="count"
+        :page-sizes="[10, 25, 35, 50, 200, 1000, 50000]"
+        layout="total, sizes, prev, pager, next"
+        :total="total">
+      </el-pagination>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+
+export default {
+  name: "gbChannelSelect",
+  props: ['dataType', "selected"],
+  computed: {},
+  data() {
+    return {
+      showDialog: false,
+      channelList: [], //设备列表
+      currentDevice: {}, //当前操作设备对象
+      searchSrt: "",
+      online: null,
+      channelType: "",
+      videoComponentList: [],
+      updateLooper: 0, //数据刷新轮训标志
+      currentDeviceChannelsLenth: 0,
+      winHeight: 580,
+      currentPage: 1,
+      count: 10,
+      total: 0,
+      getChannelListLoading: false,
+      multipleSelection: [],
+    };
+  },
+  methods: {
+    initData: function () {
+      this.getChannelList();
+    },
+    currentChange: function (val) {
+      this.currentPage = val;
+      this.getChannelList();
+    },
+    handleSizeChange: function (val) {
+      this.count = val;
+      this.getChannelList();
+    },
+    handleSelectionChange: function (val){
+      this.multipleSelection = val;
+    },
+    getChannelList: function () {
+      this.getChannelListLoading = true;
+      if (this.dataType === "civilCode") {
+        this.$axios({
+          method: 'get',
+          url: `/api/common/channel/civilcode/list`,
+          params: {
+            page: this.currentPage,
+            count: this.count,
+            channelType: this.channelType,
+            query: this.searchSrt,
+            online: this.online,
+          }
+        }).then( (res)=> {
+          if (res.data.code === 0) {
+            this.total = res.data.data.total;
+            this.channelList = res.data.data.list;
+          }
+          this.getChannelListLoading = false;
+        }).catch( (error)=> {
+          console.error(error);
+          this.getChannelListLoading = false;
+        });
+      }else {
+        this.$axios({
+          method: 'get',
+          url: `/api/common/channel/parent/list`,
+          params: {
+            page: this.currentPage,
+            count: this.count,
+            query: this.searchSrt,
+            channelType: this.channelType,
+            online: this.online,
+          }
+        }).then( (res)=> {
+          if (res.data.code === 0) {
+            this.total = res.data.data.total;
+            this.channelList = res.data.data.list;
+          }
+          this.getChannelListLoading = false;
+        }).catch( (error)=> {
+          console.error(error);
+          this.getChannelListLoading = false;
+        });
+      }
+
+    },
+    openDialog: function (callback) {
+      this.listChangeCallback = callback;
+      this.showDialog = true;
+      this.initData();
+    },
+    onSubmit: function () {
+      if (this.listChangeCallback ) {
+        this.listChangeCallback(this.multipleSelection)
+      }
+      this.showDialog = false;
+    },
+    close: function () {
+      this.showDialog = false;
+    },
+
+  }
+};
+</script>

web_src/src/components/group.vue

@@ -1,45 +1,54 @@
 <template>
   <div id="region" style="width: 100%">
-    <el-container v-loading="loading" >
-      <el-aside width="400px" >
-        <GroupTree ref="groupTree" :show-header="true" :edit="true" :clickEvent="treeNodeClickEvent" :chooseIdChange="chooseIdChange" :onChannelChange="getChannelList"></GroupTree>
+    <el-container v-loading="loading">
+      <el-aside width="400px">
+        <GroupTree ref="groupTree" :show-header="true" :edit="true" :clickEvent="treeNodeClickEvent"
+                   :onChannelChange="onChannelChange" :addChannelToGroup="addChannelToGroup"></GroupTree>
       </el-aside>
       <el-main style="padding: 5px;">
         <div class="page-header">
-          <div class="page-title">通道列表</div>
+          <div class="page-title">
+            <el-breadcrumb separator="/">
+              <el-breadcrumb-item v-for="key in regionParents" key="key">{{ key }}</el-breadcrumb-item>
+            </el-breadcrumb>
+          </div>
           <div class="page-header-btn">
-            <div  style="display: inline;">
+            <div style="display: inline;">
               搜索:
               <el-input @input="search" style="margin-right: 1rem; width: auto;" size="mini" placeholder="关键字"
                         prefix-icon="el-icon-search" v-model="searchSrt" clearable></el-input>
 
               在线状态:
-              <el-select size="mini" style="width: 8rem; margin-right: 1rem;" @change="search" v-model="online" placeholder="请选择"
+              <el-select size="mini" style="width: 8rem; margin-right: 1rem;" @change="search" v-model="online"
+                         placeholder="请选择"
                          default-first-option>
                 <el-option label="全部" value=""></el-option>
                 <el-option label="在线" value="true"></el-option>
                 <el-option label="离线" value="false"></el-option>
               </el-select>
-              添加状态:
-              <el-select size="mini" style="width: 8rem; margin-right: 1rem;" @change="search" v-model="hasGroup" placeholder="请选择"
+              类型:
+              <el-select size="mini" style="width: 8rem; margin-right: 1rem;" @change="getChannelList"
+                         v-model="channelType" placeholder="请选择"
                          default-first-option>
                 <el-option label="全部" value=""></el-option>
-                <el-option label="已添加" value="true"></el-option>
-                <el-option label="未添加" value="false"></el-option>
+                <el-option label="国标设备" :value="0"></el-option>
+                <el-option label="推流设备" :value="1"></el-option>
+                <el-option label="拉流代理" :value="2"></el-option>
               </el-select>
-              <el-button v-if="hasGroup !=='true'" size="mini" type="primary" @click="add()">
-                添加
+              <el-button size="mini" type="primary" @click="add()">
+                添加通道
               </el-button>
-              <el-button v-if="hasGroup ==='true'" size="mini" type="danger" @click="remove()">
-                移除
+              <el-button v-bind:disabled="multipleSelection.length === 0" size="mini" type="danger" @click="remove()">
+                移除通道
               </el-button>
               <el-button icon="el-icon-refresh-right" circle size="mini" @click="getChannelList()"></el-button>
             </div>
           </div>
         </div>
-        <el-table size="medium"  ref="channelListTable" :data="channelList" :height="winHeight" style="width: 100%"
-                  header-row-class-name="table-header" @selection-change="handleSelectionChange" @row-dblclick="rowDblclick">
-          <el-table-column type="selection" width="55" :selectable="selectable">
+        <el-table size="medium" ref="channelListTable" :data="channelList" :height="winHeight" style="width: 100%"
+                  header-row-class-name="table-header" @selection-change="handleSelectionChange"
+                  @row-dblclick="rowDblclick">
+          <el-table-column type="selection" width="55" >
           </el-table-column>
           <el-table-column prop="gbName" label="名称" min-width="180">
           </el-table-column>
@@ -64,14 +73,6 @@
               </div>
             </template>
           </el-table-column>
-          <el-table-column label="添加状态" min-width="100">
-            <template v-slot:default="scope">
-              <div slot="reference" class="name-wrapper">
-                <el-tag size="medium" :title="scope.row.gbParentId" v-if="scope.row.gbParentId">已添加</el-tag>
-                <el-tag size="medium" type="info" v-if="!scope.row.gbParentId">未添加</el-tag>
-              </div>
-            </template>
-          </el-table-column>
         </el-table>
         <el-pagination
           style="text-align: right"
@@ -85,7 +86,7 @@
         </el-pagination>
       </el-main>
     </el-container>
-
+    <GbChannelSelect ref="gbChannelSelect" dataType="civilCode"></GbChannelSelect>
   </div>
 </template>
 
@@ -93,10 +94,12 @@
 import uiHeader from '../layout/UiHeader.vue'
 import DeviceService from "./service/DeviceService";
 import GroupTree from "./common/GroupTree.vue";
+import GbChannelSelect from "./dialog/GbChannelSelect.vue";
 
 export default {
   name: 'channelList',
   components: {
+    GbChannelSelect,
     uiHeader,
     GroupTree,
   },
@@ -116,6 +119,7 @@ export default {
       groupDeviceId: "",
       groupId: "",
       businessGroup: "",
+      regionParents: ["请选择虚拟组织"],
       multipleSelection: []
     };
   },
@@ -123,7 +127,8 @@ export default {
   created() {
     this.initData();
   },
-  destroyed() {},
+  destroyed() {
+  },
   methods: {
     initData: function () {
       this.getChannelList();
@@ -139,15 +144,16 @@ export default {
     getChannelList: function () {
       this.$axios({
         method: 'get',
-        url: `/api/common/channel/list`,
+        url: `/api/common/channel/parent/list`,
         params: {
           page: this.currentPage,
           count: this.count,
           query: this.searchSrt,
           online: this.online,
-          hasGroup: this.hasGroup
+          channelType: this.channelType,
+          groupDeviceId: this.groupDeviceId
         }
-      }).then((res)=> {
+      }).then((res) => {
         if (res.data.code === 0) {
           this.total = res.data.data.total;
           this.channelList = res.data.data.list;
@@ -157,77 +163,67 @@ export default {
           })
         }
 
-      }).catch((error)=> {
+      }).catch((error) => {
         console.log(error);
       });
     },
-    handleSelectionChange: function (val){
+    handleSelectionChange: function (val) {
       this.multipleSelection = val;
     },
-    selectable: function (row, rowIndex) {
-      if (this.hasGroup === "") {
-        if (row.gbParentId) {
-          return false
-        }else {
-          return true
-        }
-      }else {
-        return true
-      }
-    },
     rowDblclick: function (row, rowIndex) {
 
     },
     add: function (row) {
-      if (!this.groupDeviceId) {
+      if (this.regionDeviceId === "") {
         this.$message.info({
           showClose: true,
-          message: "请选择左侧行政区划节点"
-        })
-        return;
-      }
-      let channels = []
-      for (let i = 0; i < this.multipleSelection.length; i++) {
-        channels.push(this.multipleSelection[i].gbId)
-      }
-      if (channels.length === 0) {
-        this.$message.info({
-          showClose: true,
-          message: "请选择右侧通道"
+          message: "请选择左侧虚拟组织节点"
         })
         return;
       }
+      this.$refs.gbChannelSelect.openDialog((data) => {
+        console.log("选择的数据")
+        console.log(data)
+        this.addChannelToGroup(this.groupDeviceId, this.businessGroup, data)
+      })
+    },
+    addChannelToGroup: function (groupDeviceId, businessGroup,  data) {
+        if (data.length === 0) {
+          return;
+        }
+        let channels = []
+        for (let i = 0; i < data.length; i++) {
+          channels.push(data[i].gbId)
+        }
       this.loading = true
 
       this.$axios({
         method: 'post',
         url: `/api/common/channel/group/add`,
         data: {
-          parentId: this.groupDeviceId,
-          businessGroup: this.businessGroup,
+          parentId: groupDeviceId,
+          businessGroup: businessGroup,
           channelIds: channels
         }
-      }).then((res)=> {
+      }).then((res) => {
         if (res.data.code === 0) {
           this.$message.success({
             showClose: true,
             message: "保存成功"
           })
           this.getChannelList()
-          // 刷新树节点
-          this.$refs.groupTree.refresh(this.groupId)
-        }else {
+        } else {
           this.$message.error({
-              showClose: true,
-              message: res.data.msg
-            })
+            showClose: true,
+            message: res.data.msg
+          })
         }
         this.loading = false
-      }).catch((error)=> {
+      }).catch((error) => {
         this.$message.error({
-            showClose: true,
-            message: error
-          })
+          showClose: true,
+          message: error
+        })
         this.loading = false
       });
     },
@@ -240,7 +236,7 @@ export default {
       if (channels.length === 0) {
         this.$message.info({
           showClose: true,
-          message: "请选择右侧通道"
+          message: "请选择通道"
         })
         return;
       }
@@ -252,7 +248,7 @@ export default {
         data: {
           channelIds: channels
         }
-      }).then((res)=> {
+      }).then((res) => {
         if (res.data.code === 0) {
           this.$message.success({
             showClose: true,
@@ -261,18 +257,18 @@ export default {
           this.getChannelList()
           // 刷新树节点
           this.$refs.groupTree.refresh(this.groupDeviceId)
-        }else {
+        } else {
           this.$message.error({
-              showClose: true,
-              message: res.data.msg
-            })
+            showClose: true,
+            message: res.data.msg
+          })
         }
         this.loading = false
-      }).catch((error)=> {
+      }).catch((error) => {
         this.$message.error({
-            showClose: true,
-            message: error
-          })
+          showClose: true,
+          message: error
+        })
         this.loading = false
       });
     },
@@ -288,13 +284,38 @@ export default {
     refresh: function () {
       this.initData();
     },
-    treeNodeClickEvent: function (device, data, isCatalog) {
+    treeNodeClickEvent: function (group) {
+      if (group.deviceId === "" || group.deviceId === group.businessGroup) {
+        this.channelList = []
+        this.regionParents = ["请选择虚拟组织"];
+        return
+      }
+      this.groupDeviceId = group.deviceId;
+      this.businessGroup = group.businessGroup;
+      this.initData();
+      // 获取regionDeviceId对应的节点信息
+      this.$axios({
+        method: 'get',
+        url: `/api/group/path`,
+        params: {
+          deviceId: this.groupDeviceId,
+          businessGroup: this.businessGroup,
+        }
+      }).then((res) => {
+        if (res.data.code === 0) {
+          let path = []
+          for (let i = 0; i < res.data.data.length; i++) {
+            path.push(res.data.data[i].name)
+          }
+          this.regionParents = path;
+        }
 
+      }).catch((error) => {
+        console.log(error);
+      });
     },
-    chooseIdChange: function (id, deviceId, businessGroup) {
-      this.groupId = id;
-      this.groupDeviceId = deviceId;
-      this.businessGroup = businessGroup;
+    onChannelChange: function (deviceId) {
+      //
     },
   }
 };

web_src/src/components/region.vue

@@ -3,13 +3,13 @@
     <el-container v-loading="loading">
       <el-aside width="400px">
         <RegionTree ref="regionTree" :showHeader=true :edit="true" :clickEvent="treeNodeClickEvent"
-                    :onChannelChange="onChannelChange"></RegionTree>
+                    :onChannelChange="onChannelChange" :addChannelToCivilCode="addChannelToCivilCode"></RegionTree>
       </el-aside>
       <el-main style="padding: 5px;">
         <div class="page-header">
           <div class="page-title">
             <el-breadcrumb separator="/">
-              <el-breadcrumb-item v-for="key in regionParents" >{{key}}</el-breadcrumb-item>
+              <el-breadcrumb-item v-for="key in regionParents" key="key">{{ key }}</el-breadcrumb-item>
             </el-breadcrumb>
           </div>
           <div class="page-header-btn">
@@ -26,6 +26,14 @@
                 <el-option label="在线" value="true"></el-option>
                 <el-option label="离线" value="false"></el-option>
               </el-select>
+              类型:
+              <el-select size="mini" style="width: 8rem; margin-right: 1rem;" @change="getChannelList" v-model="channelType" placeholder="请选择"
+                         default-first-option>
+                <el-option label="全部" value=""></el-option>
+                <el-option label="国标设备" :value="0"></el-option>
+                <el-option label="推流设备" :value="1"></el-option>
+                <el-option label="拉流代理" :value="2"></el-option>
+              </el-select>
               <el-button size="mini" type="primary" @click="add()">
                 添加通道
               </el-button>
@@ -77,7 +85,7 @@
         </el-pagination>
       </el-main>
     </el-container>
-
+    <GbChannelSelect ref="gbChannelSelect" dataType="civilCode"></GbChannelSelect>
   </div>
 </template>
 
@@ -85,10 +93,12 @@
 import uiHeader from '../layout/UiHeader.vue'
 import DeviceService from "./service/DeviceService";
 import RegionTree from "./common/RegionTree.vue";
+import GbChannelSelect from "./dialog/GbChannelSelect.vue";
 
 export default {
   name: 'channelList',
   components: {
+    GbChannelSelect,
     uiHeader,
     RegionTree,
   },
@@ -131,12 +141,13 @@ export default {
     getChannelList: function () {
       this.$axios({
         method: 'get',
-        url: `/api/common/channel/list`,
+        url: `/api/common/channel/civilcode/list`,
         params: {
           page: this.currentPage,
           count: this.count,
           query: this.searchSrt,
           online: this.online,
+          channelType: this.channelType,
           civilCode: this.regionDeviceId
         }
       }).then((res) => {
@@ -162,31 +173,34 @@ export default {
       // }
     },
     add: function (row) {
-      if (!this.regionDeviceId) {
+      if (this.regionDeviceId === "") {
         this.$message.info({
           showClose: true,
-          message: "请选择左侧行政区划节点"
+          message: "请选择左侧行政区划"
         })
         return;
       }
-      let channels = []
-      for (let i = 0; i < this.multipleSelection.length; i++) {
-        channels.push(this.multipleSelection[i].gbId)
-      }
-      if (channels.length === 0) {
-        this.$message.info({
-          showClose: true,
-          message: "请选择通道"
-        })
+      this.$refs.gbChannelSelect.openDialog((data) => {
+        console.log("选择的数据")
+        console.log(data)
+        this.addChannelToCivilCode(this.regionDeviceId, data)
+      })
+    },
+    addChannelToCivilCode: function (regionDeviceId, data) {
+      if (data.length === 0) {
         return;
       }
+      let channels = []
+      for (let i = 0; i < data.length; i++) {
+        channels.push(data[i].gbId)
+      }
       this.loading = true
 
       this.$axios({
         method: 'post',
         url: `/api/common/channel/region/add`,
         data: {
-          civilCode: this.regionDeviceId,
+          civilCode: regionDeviceId,
           channelIds: channels
         }
       }).then((res) => {
@@ -196,8 +210,6 @@ export default {
             message: "保存成功"
           })
           this.getChannelList()
-          // 刷新树节点
-          this.$refs.regionTree.refresh(this.regionId)
         } else {
           this.$message.error({
             showClose: true,
@@ -271,6 +283,10 @@ export default {
     },
     treeNodeClickEvent: function (region) {
       this.regionDeviceId = region.deviceId;
+      if (region.deviceId === "") {
+        this.channelList = []
+        this.regionParents = ["请选择行政区划"];
+      }
       this.initData();
       // 获取regionDeviceId对应的节点信息
       this.$axios({
@@ -292,6 +308,9 @@ export default {
         console.log(error);
       });
     },
+    gbChannelSelectEnd: function (selectedData) {
+      console.log(selectedData);
+    },
     onChannelChange: function (deviceId) {
       //
     },