优化通道管理/行政区划页面逻辑

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

@@ -103,17 +103,18 @@ public class CommonChannelController {
     @Parameter(name = "count", description = "每页查询数量", required = true)
     @Parameter(name = "query", description = "查询内容")
     @Parameter(name = "online", description = "是否在线")
-    @Parameter(name = "hasCivilCode", description = "是否分配行政区划")
+    @Parameter(name = "civilCode", description = "行政区划")
+    @Parameter(name = "groupDeviceId", description = "业务分组下的父节点ID")
     @GetMapping("/list")
     public PageInfo<CommonGBChannel> queryList(int page, int count,
                                                @RequestParam(required = false) String query,
                                                @RequestParam(required = false) Boolean online,
-                                               @RequestParam(required = false) Boolean hasCivilCode,
+                                               @RequestParam(required = false) String civilCode,
-                                               @RequestParam(required = false) Boolean hasGroup){
+                                               @RequestParam(required = false) String groupDeviceId){
         if (ObjectUtils.isEmpty(query)){
             query = null;
         }
-        return channelService.queryList(page, count, query, online, hasCivilCode, hasGroup);
+        return channelService.queryList(page, count, query, online, civilCode, groupDeviceId);
     }
 
     @Operation(summary = "通道设置行政区划", security = @SecurityRequirement(name = JwtUtils.HEADER))

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

@@ -57,12 +57,13 @@ public class RegionController {
     @GetMapping("/tree/list")
     public List<RegionTree> 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 regionService.queryForTree(query, parent);
+        return regionService.queryForTree(query, parent, hasChannel);
     }
 
     @Operation(summary = "更新区域")
@@ -109,6 +110,14 @@ public class RegionController {
         return regionService.getAllChild(parent);
     }
 
+    @Operation(summary = "获取所属的行政区划下的行政区划")
+    @Parameter(name = "deviceId", description = "当前的行政区划", required = false)
+    @ResponseBody
+    @GetMapping("/path")
+    public List<Region> getPath(String deviceId){
+        return regionService.getPath(deviceId);
+    }
+
     @Operation(summary = "从通道中同步行政区划")
     @ResponseBody
     @GetMapping("/sync")

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

@@ -257,8 +257,7 @@ public interface CommonGBChannelMapper {
 
     @SelectProvider(type = ChannelProvider.class, method = "queryList")
     List<CommonGBChannel> queryList(@Param("query") String query, @Param("online") Boolean online,
-                                    @Param("hasCivilCode") Boolean hasCivilCode,
+                                    @Param("civilCode") String civilCode, @Param("groupDeviceId") String groupDeviceId);
-                                    @Param("hasGroup") Boolean hasGroup);
 
     @Select("<script>" +
             " select " +

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

@@ -1,7 +1,6 @@
 package com.genersoft.iot.vmp.gb28181.dao;
 
 import com.genersoft.iot.vmp.gb28181.bean.CommonGBChannel;
-import com.genersoft.iot.vmp.gb28181.bean.Group;
 import com.genersoft.iot.vmp.gb28181.bean.Region;
 import com.genersoft.iot.vmp.gb28181.bean.RegionTree;
 import org.apache.ibatis.annotations.*;

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

@@ -132,17 +132,11 @@ public class ChannelProvider {
         if (params.get("online") != null && !(Boolean)params.get("online")) {
             sqlBuild.append(" AND coalesce(gb_status, status) = 'OFF'");
         }
-        if (params.get("hasCivilCode") != null && (Boolean)params.get("hasCivilCode")) {
+        if (params.get("civilCode") != null) {
-            sqlBuild.append(" AND coalesce(gb_civil_code, civil_code) is not null");
+            sqlBuild.append(" AND coalesce(gb_civil_code, civil_code) = #{civilCode}");
         }
-        if (params.get("hasCivilCode") != null && !(Boolean)params.get("hasCivilCode")) {
+        if (params.get("groupDeviceId") != null) {
-            sqlBuild.append(" AND coalesce(gb_civil_code, civil_code) is null");
+            sqlBuild.append(" AND coalesce(gb_parent_id, parent_id) = #{groupDeviceId}");
-        }
-        if (params.get("hasGroup") != null && (Boolean)params.get("hasGroup")) {
-            sqlBuild.append(" AND coalesce(gb_parent_id, parent_id) is not null");
-        }
-        if (params.get("hasGroup") != null && !(Boolean)params.get("hasGroup")) {
-            sqlBuild.append(" AND coalesce(gb_parent_id, parent_id) is null");
         }
         return sqlBuild.toString();
     }

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

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

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

@@ -27,11 +27,13 @@ public interface IRegionService {
 
     Region queryRegionByDeviceId(String regionDeviceId);
 
-    List<RegionTree> queryForTree(String query, Integer parent);
+    List<RegionTree> queryForTree(String query, Integer parent, Boolean hasChannel);
 
     void syncFromChannel();
 
     boolean delete(int id);
 
     boolean batchAdd(List<Region> regionList);
+
+    List<Region> getPath(String deviceId);
 }

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

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

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

@@ -139,9 +139,9 @@ public class RegionServiceImpl implements IRegionService {
     }
 
     @Override
-    public List<RegionTree> queryForTree(String query, Integer parent) {
+    public List<RegionTree> queryForTree(String query, Integer parent, Boolean hasChannel) {
         List<RegionTree> regionList = regionMapper.queryForTree(query, parent);
-        if (parent != null) {
+        if (parent != null && hasChannel != null && hasChannel) {
             Region parentRegion = regionMapper.queryOne(parent);
             if (parentRegion != null) {
                 List<RegionTree> channelList = commonGBChannelMapper.queryForRegionTreeByCivilCode(query, parentRegion.getDeviceId());
@@ -224,4 +224,31 @@ public class RegionServiceImpl implements IRegionService {
 
         return true;
     }
+
+    @Override
+    public List<Region> getPath(String deviceId) {
+        Region region = regionMapper.queryByDeviceId(deviceId);
+        if (region == null) {
+            throw new ControllerException(ErrorCode.ERROR100.getCode(), "行政区划不存在");
+        }
+        List<Region> allParent = getAllParent(region);
+        allParent.add(region);
+        return allParent;
+    }
+
+
+    private List<Region> getAllParent(Region region) {
+        if (region.getParentId() == null) {
+            return new ArrayList<>();
+        }
+
+        List<Region> regionList = new ArrayList<>();
+        Region parent = regionMapper.queryByDeviceId(region.getParentDeviceId());
+        if (parent == null) {
+            return regionList;
+        }
+        List<Region> allParent = getAllParent(parent);
+        allParent.add(parent);
+        return allParent;
+    }
 }

web_src/src/components/CloudRecord.vue

@@ -52,17 +52,17 @@
       <el-table-column prop="stream" label="流ID" width="380">
       </el-table-column>
       <el-table-column label="开始时间">
-        <template slot-scope="scope">
+        <template v-slot:default="scope">
           {{formatTimeStamp(scope.row.startTime)}}
         </template>
       </el-table-column>
       <el-table-column label="结束时间">
-        <template slot-scope="scope">
+        <template v-slot:default="scope">
           {{formatTimeStamp(scope.row.endTime)}}
         </template>
       </el-table-column>
       <el-table-column  label="时长">
-        <template slot-scope="scope">
+        <template v-slot:default="scope">
           <el-tag>{{formatTime(scope.row.timeLen)}}</el-tag>
         </template>
       </el-table-column>
@@ -71,7 +71,7 @@
       <el-table-column prop="mediaServerId" label="流媒体">
       </el-table-column>
       <el-table-column label="操作" width="200" fixed="right">
-        <template slot-scope="scope">
+        <template v-slot:default="scope">
           <el-button size="medium" icon="el-icon-video-play" type="text" @click="play(scope.row)">播放
           </el-button>
           <el-button size="medium" icon="el-icon-download" type="text" @click="downloadFile(scope.row)">下载

web_src/src/components/DeviceList.vue

@@ -28,7 +28,7 @@
       <el-table-column prop="deviceId" label="设备编号" min-width="200" >
       </el-table-column>
       <el-table-column label="地址" min-width="160" >
-        <template slot-scope="scope">
+        <template v-slot:default="scope">
           <div slot="reference" class="name-wrapper">
             <el-tag v-if="scope.row.hostAddress" size="medium">{{ scope.row.hostAddress }}</el-tag>
             <el-tag v-if="!scope.row.hostAddress" size="medium">未知</el-tag>
@@ -40,7 +40,7 @@
       <el-table-column prop="transport" label="信令传输模式" min-width="120" >
       </el-table-column>
       <el-table-column label="流传输模式"  min-width="160" >
-        <template slot-scope="scope">
+        <template v-slot:default="scope">
           <el-select size="mini" @change="transportChange(scope.row)" v-model="scope.row.streamMode" placeholder="请选择" style="width: 120px">
             <el-option key="UDP" label="UDP" value="UDP"></el-option>
             <el-option key="TCP-ACTIVE" label="TCP主动模式"  value="TCP-ACTIVE"></el-option>
@@ -51,7 +51,7 @@
       <el-table-column prop="channelCount" label="通道数" min-width="120" >
       </el-table-column>
       <el-table-column label="状态" min-width="120">
-        <template slot-scope="scope">
+        <template v-slot:default="scope">
           <div slot="reference" class="name-wrapper">
             <el-tag size="medium" v-if="scope.row.onLine">在线</el-tag>
             <el-tag size="medium" type="info" v-if="!scope.row.onLine">离线</el-tag>
@@ -68,7 +68,7 @@
 <!--      </el-table-column>-->
 
       <el-table-column label="操作" min-width="380" fixed="right">
-        <template slot-scope="scope">
+        <template v-slot:default="scope">
           <el-button type="text" size="medium" v-bind:disabled="scope.row.online==0" icon="el-icon-refresh" @click="refDevice(scope.row)"
                      @mouseover="getTooltipContent(scope.row.deviceId)">刷新
           </el-button>

web_src/src/components/PlatformList.vue

@@ -19,7 +19,7 @@
         <el-table-column prop="name" label="名称"></el-table-column>
         <el-table-column prop="serverGBId" label="平台编号" min-width="200"></el-table-column>
         <el-table-column label="是否启用" min-width="80">
-          <template slot-scope="scope">
+          <template v-slot:default="scope">
             <div slot="reference" class="name-wrapper">
               <el-tag size="medium" v-if="scope.row.enable">已启用</el-tag>
               <el-tag size="medium" type="info" v-if="!scope.row.enable">未启用</el-tag>
@@ -27,7 +27,7 @@
           </template>
         </el-table-column>
         <el-table-column label="状态" min-width="80">
-          <template slot-scope="scope">
+          <template v-slot:default="scope">
             <div slot="reference" class="name-wrapper">
               <el-tag size="medium" v-if="scope.row.status">在线</el-tag>
               <el-tag size="medium" type="info" v-if="!scope.row.status">离线</el-tag>
@@ -35,7 +35,7 @@
           </template>
         </el-table-column>
         <el-table-column label="地址" min-width="160">
-          <template slot-scope="scope">
+          <template v-slot:default="scope">
             <div slot="reference" class="name-wrapper">
               <el-tag size="medium">{{ scope.row.serverIp }}:{{ scope.row.serverPort }}</el-tag>
             </div>
@@ -45,7 +45,7 @@
         <el-table-column prop="transport" label="信令传输模式" min-width="120"></el-table-column>
         <el-table-column prop="channelCount" label="通道数" min-width="120"></el-table-column>
         <el-table-column label="订阅信息" min-width="120" fixed="right">
-          <template slot-scope="scope">
+          <template v-slot:default="scope">
             <i v-if="scope.row.alarmSubscribe" style="font-size: 20px" title="报警订阅"
                class="iconfont icon-gbaojings subscribe-on "></i>
             <i v-if="!scope.row.alarmSubscribe" style="font-size: 20px" title="报警订阅"
@@ -60,7 +60,7 @@
         </el-table-column>
 
         <el-table-column label="操作" min-width="240" fixed="right">
-          <template slot-scope="scope">
+          <template v-slot:default="scope">
             <el-button size="medium" icon="el-icon-edit" type="text" @click="editPlatform(scope.row)">编辑</el-button>
             <el-button size="medium" icon="el-icon-share" type="text" @click="chooseChannel(scope.row)">通道共享
             </el-button>

web_src/src/components/StreamProxyList.vue

@@ -36,7 +36,7 @@
         <el-table-column prop="app" label="流应用名" min-width="120" show-overflow-tooltip/>
         <el-table-column prop="stream" label="流ID" min-width="120" show-overflow-tooltip/>
         <el-table-column label="流地址" min-width="250"  show-overflow-tooltip >
-          <template slot-scope="scope">
+          <template v-slot:default="scope">
             <div slot="reference" class="name-wrapper">
               <el-tag size="medium">
                 <i class="cpoy-btn el-icon-document-copy"  title="点击拷贝" v-clipboard="scope.row.srcUrl" @success="$message({type:'success', message:'成功拷贝到粘贴板'})"></i>
@@ -47,7 +47,7 @@
         </el-table-column>
         <el-table-column prop="mediaServerId" label="流媒体" min-width="180" ></el-table-column>
         <el-table-column label="代理方式" width="100" >
-          <template slot-scope="scope">
+          <template v-slot:default="scope">
             <div slot="reference" class="name-wrapper">
               {{scope.row.type === "default"? "默认":"FFMPEG代理"}}
             </div>
@@ -56,7 +56,7 @@
 
         <el-table-column prop="gbDeviceId" label="国标编码" min-width="180"  show-overflow-tooltip/>
         <el-table-column label="拉流状态" min-width="120" >
-          <template slot-scope="scope">
+          <template v-slot:default="scope">
             <div slot="reference" class="name-wrapper">
               <el-tag size="medium" v-if="scope.row.pulling">正在拉流</el-tag>
               <el-tag size="medium" type="info" v-if="!scope.row.pulling">尚未拉流</el-tag>
@@ -64,7 +64,7 @@
           </template>
         </el-table-column>
         <el-table-column label="启用" min-width="120" >
-          <template slot-scope="scope">
+          <template v-slot:default="scope">
             <div slot="reference" class="name-wrapper">
               <el-tag size="medium" v-if="scope.row.enable">已启用</el-tag>
               <el-tag size="medium" type="info" v-if="!scope.row.enable">未启用</el-tag>
@@ -73,7 +73,7 @@
         </el-table-column>
         <el-table-column prop="createTime" label="创建时间"  min-width="150" show-overflow-tooltip/>
         <el-table-column label="操作" width="400"  fixed="right">
-          <template slot-scope="scope">
+          <template v-slot:default="scope">
             <el-button size="medium" icon="el-icon-video-play" type="text" @click="play(scope.row)">播放</el-button>
             <el-divider direction="vertical"></el-divider>
             <el-button size="medium" icon="el-icon-switch-button" style="color: #f56c6c"  type="text" v-if="scope.row.pulling" @click="stopPlay(scope.row)">停止</el-button>

web_src/src/components/StreamPushList.vue

@@ -51,7 +51,7 @@
         <el-table-column prop="stream" label="流ID" min-width="200">
         </el-table-column>
         <el-table-column label="推流状态"  min-width="100">
-          <template slot-scope="scope">
+          <template v-slot:default="scope">
             <el-tag size="medium" v-if="scope.row.pushing">推流中</el-tag>
             <el-tag size="medium" type="info" v-if="!scope.row.pushing">已停止</el-tag>
           </template>
@@ -59,7 +59,7 @@
         <el-table-column prop="gbDeviceId" label="国标编码" min-width="200" >
         </el-table-column>
         <el-table-column label="位置信息" min-width="200">
-          <template slot-scope="scope">
+          <template v-slot:default="scope">
             <span size="medium" v-if="scope.row.gbLongitude && scope.row.gbLatitude">{{scope.row.gbLongitude}}<br/>{{scope.row.gbLatitude}}</span>
             <span size="medium" v-if="!scope.row.gbLongitude || !scope.row.gbLatitude">无</span>
           </template>
@@ -67,7 +67,7 @@
         <el-table-column prop="mediaServerId" label="流媒体" min-width="200" >
         </el-table-column>
         <el-table-column label="开始时间"  min-width="200">
-          <template slot-scope="scope">
+          <template v-slot:default="scope">
             <el-button-group>
               {{ scope.row.pushTime == null? "-":scope.row.pushTime }}
             </el-button-group>
@@ -76,7 +76,7 @@
 
 
         <el-table-column label="操作" min-width="360"  fixed="right">
-          <template slot-scope="scope">
+          <template v-slot:default="scope">
             <el-button size="medium" icon="el-icon-video-play"@click="playPush(scope.row)" type="text">播放
             </el-button>
             <el-divider direction="vertical"></el-divider>

web_src/src/components/UserManager.vue

@@ -18,7 +18,7 @@
       <el-table-column prop="pushKey" label="pushkey" min-width="160"/>
       <el-table-column prop="role.name" label="类型" min-width="160"/>
       <el-table-column label="操作" min-width="450" fixed="right">
-        <template slot-scope="scope">
+        <template v-slot:default="scope">
           <el-button size="medium" icon="el-icon-edit" type="text" @click="edit(scope.row)">修改密码</el-button>
           <el-divider direction="vertical"></el-divider>
           <el-button size="medium" icon="el-icon-edit" type="text" @click="changePushKey(scope.row)">修改pushkey</el-button>

web_src/src/components/channelList.vue

@@ -73,7 +73,7 @@
           <el-table-column prop="manufacturer" label="厂家" min-width="100">
           </el-table-column>
           <el-table-column label="位置信息" min-width="120">
-            <template slot-scope="scope">
+            <template v-slot:default="scope">
               <span size="medium" v-if="scope.row.longitude && scope.row.latitude">{{scope.row.longitude}}<br/>{{scope.row.latitude}}</span>
               <span size="medium" v-if="!scope.row.longitude || !scope.row.latitude">无</span>
             </template>
@@ -84,13 +84,13 @@
             </template>
           </el-table-column>
           <el-table-column label="开启音频" min-width="100">
-            <template slot-scope="scope">
+            <template v-slot:default="scope">
               <el-switch @change="updateChannel(scope.row)" v-model="scope.row.hasAudio" active-color="#409EFF">
               </el-switch>
             </template>
           </el-table-column>
           <el-table-column label="码流类型" min-width="180">
-            <template slot-scope="scope">
+            <template v-slot:default="scope">
               <el-select size="mini" style="margin-right: 1rem;" @change="channelSubStreamChange(scope.row)" v-model="scope.row.streamIdentification"
                          placeholder="请选择码流类型" default-first-option >
                 <el-option label="stream:0(主码流)" value="stream:0"></el-option>
@@ -105,7 +105,7 @@
             </template>
           </el-table-column>
           <el-table-column label="状态" min-width="100">
-            <template slot-scope="scope">
+            <template v-slot:default="scope">
               <div slot="reference" class="name-wrapper">
                 <el-tag size="medium" v-if="scope.row.status === 'ON'">在线</el-tag>
                 <el-tag size="medium" type="info" v-if="scope.row.status !== 'ON'">离线</el-tag>
@@ -113,7 +113,7 @@
             </template>
           </el-table-column>
           <el-table-column label="操作" min-width="340" fixed="right">
-            <template slot-scope="scope">
+            <template v-slot:default="scope">
               <el-button size="medium" v-bind:disabled="device == null || device.online === 0" icon="el-icon-video-play"
                          type="text" @click="sendDevicePush(scope.row)">播放
               </el-button>

web_src/src/components/common/GroupTree.vue

@@ -27,8 +27,9 @@
         @node-contextmenu="contextmenuEventHandler"
         @node-click="nodeClickHandler"
       >
-        <span class="custom-tree-node" slot-scope="{ node, data }">
+        <template  v-slot:default="{ node, data }">
-          <span @click.stop v-if="edit">
+          <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>
@@ -36,7 +37,8 @@
           <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>
+          </span>
+        </template>
       </vue-easy-tree>
     </div>
     <groupEdit ref="groupEdit"></groupEdit>

web_src/src/components/common/RegionTree.vue

@@ -27,16 +27,16 @@
         @node-contextmenu="contextmenuEventHandler"
         @node-click="nodeClickHandler"
       >
-        <span class="custom-tree-node" slot-scope="{ node, data }">
+        <template class="custom-tree-node" v-slot:default="{ node, data }">
-          <span @click.stop v-if="edit">
+        <span class="custom-tree-node" >
-            <el-radio v-if="node.data.type === 0 && node.level !== 1 " style="margin-right: 0" v-model="chooseId" @input="chooseIdChange(node.data.treeId, node.data.deviceId)" :label="node.data.deviceId">{{''}}</el-radio>
+          <span v-if="node.data.type === 0 && chooseId !== node.data.deviceId" style="color: #409EFF" class="iconfont icon-bianzubeifen3"></span>
-          </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" 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>
+        </template>
       </vue-easy-tree>
     </div>
     <regionEdit ref="regionEdit"></regionEdit>
@@ -65,7 +65,7 @@ export default {
       treeData: [],
     }
   },
-  props: ['edit', 'clickEvent', 'chooseIdChange', 'onChannelChange', 'showHeader'],
+  props: ['edit', 'clickEvent', 'onChannelChange', 'showHeader', 'hasChannel'],
   created() {
   },
   methods: {
@@ -91,7 +91,8 @@ export default {
           url: `/api/region/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,40 +114,7 @@ export default {
         return
       }
       console.log(node.level)
-      if (node.data.type === 1) {
+      if (node.data.type === 0) {
-        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/region/delete`,
-                  data: {
-                    channelIds: [data.id]
-                  }
-                }).then((res) => {
-                  console.log("移除成功")
-                  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) {
         this.$contextmenu({
           items: [
             {
@@ -202,10 +170,19 @@ export default {
               label: "移除设备",
               icon: "el-icon-delete",
               disabled: node.level === 1,
+              divided: true,
               onClick: () => {
                 this.removeChannelFormDevice(data.id, node)
               }
             },
+            {
+              label: "添加通道",
+              icon: "el-icon-plus",
+              disabled: node.level === 1,
+              onClick: () => {
+                this.addChannel(data.id, node)
+              }
+            },
             // {
             //   label: "导出",
             //   icon: "el-icon-download",
@@ -272,7 +249,7 @@ export default {
             message: "保存成功"
           })
             if (this.onChannelChange) {
-              this.onChannelChange()
+              this.onChannelChange(node.data.deviceId)
             }
             node.loaded = false
             node.expand();
@@ -311,7 +288,47 @@ export default {
               message: "保存成功"
             })
             if (this.onChannelChange) {
-              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
+        });
+      })
+    },
+    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();
@@ -368,12 +385,10 @@ export default {
     nodeClickHandler: function (data, node, tree) {
       console.log(data)
       console.log(node)
+      this.chooseId = data.deviceId;
       if (this.clickEvent) {
         this.clickEvent(data)
       }
-      // this.chooseId = data.id;
-      // this.chooseName = data.name;
-      // if (this.catalogIdChange)this.catalogIdChange(this.chooseId, this.chooseName);
     }
   },
   destroyed() {

web_src/src/components/dialog/GbDeviceSelect.vue

@@ -40,7 +40,7 @@
         <el-table-column prop="manufacturer" label="厂家" min-width="120" >
         </el-table-column>
         <el-table-column label="地址" min-width="160" >
-          <template slot-scope="scope">
+          <template v-slot:default="scope">
             <div slot="reference" class="name-wrapper">
               <el-tag v-if="scope.row.hostAddress" size="medium">{{ scope.row.hostAddress }}</el-tag>
               <el-tag v-if="!scope.row.hostAddress" size="medium">未知</el-tag>
@@ -48,7 +48,7 @@
           </template>
         </el-table-column>
         <el-table-column label="状态" min-width="120">
-          <template slot-scope="scope">
+          <template v-slot:default="scope">
             <div slot="reference" class="name-wrapper">
               <el-tag size="medium" v-if="scope.row.onLine">在线</el-tag>
               <el-tag size="medium" type="info" v-if="!scope.row.onLine">离线</el-tag>

web_src/src/components/dialog/shareChannelAdd.vue

@@ -52,21 +52,21 @@
       <el-table-column prop="gbDeviceId" label="编号" min-width="180">
       </el-table-column>
       <el-table-column v-if="hasShare ==='true'" label="自定义名称" min-width="180">
-        <template slot-scope="scope">
+        <template v-slot:default="scope">
           <div slot="—" class="name-wrapper">
             <el-input size="mini" placeholder="不填按原名称" v-model:value="scope.row.customName"></el-input>
           </div>
         </template>
       </el-table-column>
       <el-table-column v-if="hasShare ==='true'" label="自定义编号" min-width="180">
-        <template slot-scope="scope">
+        <template v-slot:default="scope">
           <div slot="—" class="name-wrapper">
             <el-input size="mini" placeholder="不填按原编号" v-model:value="scope.row.customDeviceId"></el-input>
           </div>
         </template>
       </el-table-column>
       <el-table-column v-if="hasShare ==='true'"  label="" min-width="80">
-        <template slot-scope="scope">
+        <template v-slot:default="scope">
           <el-button size="mini" type="primary" @click="saveCustom(scope.row)">保存
           </el-button>
         </template>
@@ -74,7 +74,7 @@
       <el-table-column prop="gbManufacturer" label="厂家" min-width="100">
       </el-table-column>
       <el-table-column label="类型" min-width="100">
-        <template slot-scope="scope">
+        <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>
@@ -83,7 +83,7 @@
         </template>
       </el-table-column>
       <el-table-column label="状态" min-width="100">
-        <template slot-scope="scope">
+        <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>
@@ -91,7 +91,7 @@
         </template>
       </el-table-column>
       <el-table-column label="共享状态" min-width="100">
-        <template slot-scope="scope">
+        <template v-slot:default="scope">
           <div slot="reference" class="name-wrapper">
             <el-tag size="medium" :title="scope.row.platformId" v-if="scope.row.platformId">已共享</el-tag>
             <el-tag size="medium" type="info" v-if="!scope.row.platformId">未共享</el-tag>

web_src/src/components/group.vue

@@ -48,7 +48,7 @@
           <el-table-column prop="gbManufacturer" label="厂家" min-width="100">
           </el-table-column>
           <el-table-column label="类型" min-width="100">
-            <template slot-scope="scope">
+            <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>
@@ -57,7 +57,7 @@
             </template>
           </el-table-column>
           <el-table-column label="状态" min-width="100">
-            <template slot-scope="scope">
+            <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>
@@ -65,7 +65,7 @@
             </template>
           </el-table-column>
           <el-table-column label="添加状态" min-width="100">
-            <template slot-scope="scope">
+            <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>

web_src/src/components/operationsForHistoryLog.vue

@@ -41,22 +41,22 @@
       <el-table-column prop="fileName" label="文件名">
       </el-table-column>
       <el-table-column prop="fileSize" label="文件大小">
-        <template slot-scope="scope">
+        <template v-slot:default="scope">
           {{formatFileSize(scope.row.fileSize)}}
         </template>
       </el-table-column>
       <el-table-column label="开始时间">
-        <template slot-scope="scope">
+        <template v-slot:default="scope">
           {{formatTimeStamp(scope.row.startTime)}}
         </template>
       </el-table-column>
       <el-table-column label="结束时间">
-        <template slot-scope="scope">
+        <template v-slot:default="scope">
           {{formatTimeStamp(scope.row.endTime)}}
         </template>
       </el-table-column>
       <el-table-column label="操作" width="200" fixed="right">
-        <template slot-scope="scope">
+        <template v-slot:default="scope">
           <el-button size="medium" icon="el-icon-document" type="text" @click="showLogView(scope.row)">查看
           </el-button>
           <el-button size="medium" icon="el-icon-download" type="text" @click="downloadFile(scope.row)">下载

web_src/src/components/region.vue

@@ -1,45 +1,45 @@
 <template>
   <div id="region" style="width: 100%">
-    <el-container v-loading="loading" >
+    <el-container v-loading="loading">
-      <el-aside width="400px" >
+      <el-aside width="400px">
-        <RegionTree ref="regionTree" :showHeader=true :edit="true" :clickEvent="treeNodeClickEvent" :chooseIdChange="chooseIdChange" :onChannelChange="getChannelList"></RegionTree>
+        <RegionTree ref="regionTree" :showHeader=true :edit="true" :clickEvent="treeNodeClickEvent"
+                    :onChannelChange="onChannelChange"></RegionTree>
       </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}}</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-button size="mini" type="primary" @click="add()">
-              <el-select size="mini" style="width: 8rem; margin-right: 1rem;" @change="search" v-model="hasCivilCode" 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-button v-if="hasCivilCode !=='true'" size="mini" type="primary" @click="add()">
-                添加
               </el-button>
-              <el-button v-if="hasCivilCode ==='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%"
+        <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">
+                  header-row-class-name="table-header" @selection-change="handleSelectionChange"
-          <el-table-column type="selection" width="55" :selectable="selectable">
+                  @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>
@@ -48,7 +48,7 @@
           <el-table-column prop="gbManufacturer" label="厂家" min-width="100">
           </el-table-column>
           <el-table-column label="类型" min-width="100">
-            <template slot-scope="scope">
+            <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>
@@ -57,21 +57,13 @@
             </template>
           </el-table-column>
           <el-table-column label="状态" min-width="100">
-            <template slot-scope="scope">
+            <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-column label="添加状态" min-width="100">
-            <template slot-scope="scope">
-              <div slot="reference" class="name-wrapper">
-                <el-tag size="medium" :title="scope.row.gbCivilCode" v-if="scope.row.gbCivilCode">已添加</el-tag>
-                <el-tag size="medium" type="info" v-if="!scope.row.gbCivilCode">未添加</el-tag>
-              </div>
-            </template>
-          </el-table-column>
         </el-table>
         <el-pagination
           style="text-align: right"
@@ -106,7 +98,6 @@ export default {
       searchSrt: "",
       channelType: "",
       online: "",
-      hasCivilCode: "false",
       winHeight: window.innerHeight - 180,
       currentPage: 1,
       count: 15,
@@ -115,6 +106,7 @@ export default {
       loadSnap: {},
       regionId: "",
       regionDeviceId: "",
+      regionParents: ["请选择行政区划"],
       multipleSelection: []
     };
   },
@@ -122,7 +114,8 @@ export default {
   created() {
     this.initData();
   },
-  destroyed() {},
+  destroyed() {
+  },
   methods: {
     initData: function () {
       this.getChannelList();
@@ -144,9 +137,9 @@ export default {
           count: this.count,
           query: this.searchSrt,
           online: this.online,
-          hasCivilCode: this.hasCivilCode
+          civilCode: this.regionDeviceId
         }
-      }).then((res)=> {
+      }).then((res) => {
         if (res.data.code === 0) {
           this.total = res.data.data.total;
           this.channelList = res.data.data.list;
@@ -156,25 +149,13 @@ export default {
           })
         }
 
-      }).catch((error)=> {
+      }).catch((error) => {
-
         console.log(error);
       });
     },
-    handleSelectionChange: function (val){
+    handleSelectionChange: function (val) {
       this.multipleSelection = val;
     },
-    selectable: function (row, rowIndex) {
-      if (this.hasCivilCode === "") {
-        if (row.gbCivilCode) {
-          return false
-        }else {
-          return true
-        }
-      }else {
-        return true
-      }
-    },
     rowDblclick: function (row, rowIndex) {
       // if (row.gbCivilCode) {
       //   this.$refs.regionTree.refresh(row.gbCivilCode)
@@ -195,7 +176,7 @@ export default {
       if (channels.length === 0) {
         this.$message.info({
           showClose: true,
-          message: "请选择右侧通道"
+          message: "请选择通道"
         })
         return;
       }
@@ -208,7 +189,7 @@ export default {
           civilCode: this.regionDeviceId,
           channelIds: channels
         }
-      }).then((res)=> {
+      }).then((res) => {
         if (res.data.code === 0) {
           this.$message.success({
             showClose: true,
@@ -217,18 +198,18 @@ export default {
           this.getChannelList()
           // 刷新树节点
           this.$refs.regionTree.refresh(this.regionId)
-        }else {
+        } else {
           this.$message.error({
-              showClose: true,
+            showClose: true,
-              message: res.data.msg
+            message: res.data.msg
-            })
+          })
         }
         this.loading = false
-      }).catch((error)=> {
+      }).catch((error) => {
         this.$message.error({
-            showClose: true,
+          showClose: true,
-            message: error
+          message: error
-          })
+        })
         this.loading = false
       });
     },
@@ -240,7 +221,7 @@ export default {
       if (channels.length === 0) {
         this.$message.info({
           showClose: true,
-          message: "请选择右侧通道"
+          message: "请选择通道"
         })
         return;
       }
@@ -252,7 +233,7 @@ export default {
         data: {
           channelIds: channels
         }
-      }).then((res)=> {
+      }).then((res) => {
         if (res.data.code === 0) {
           this.$message.success({
             showClose: true,
@@ -261,18 +242,18 @@ export default {
           this.getChannelList()
           // 刷新树节点
           this.$refs.regionTree.refresh(this.regionId)
-        }else {
+        } else {
           this.$message.error({
-              showClose: true,
+            showClose: true,
-              message: res.data.msg
+            message: res.data.msg
-            })
+          })
         }
         this.loading = false
-      }).catch((error)=> {
+      }).catch((error) => {
         this.$message.error({
-            showClose: true,
+          showClose: true,
-            message: error
+          message: error
-          })
+        })
         this.loading = false
       });
     },
@@ -288,67 +269,32 @@ export default {
     refresh: function () {
       this.initData();
     },
-    treeNodeClickEvent: function (device, data, isCatalog) {
+    treeNodeClickEvent: function (region) {
+      this.regionDeviceId = region.deviceId;
+      this.initData();
+      // 获取regionDeviceId对应的节点信息
+      this.$axios({
+        method: 'get',
+        url: `/api/region/path`,
+        params: {
+          deviceId: this.regionDeviceId,
+        }
+      }).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) {
+    onChannelChange: function (deviceId) {
-      this.regionDeviceId = deviceId;
+      //
-      this.regionId = id;
     },
   }
 };
 </script>
-
-<style>
-.videoList {
-  display: flex;
-  flex-wrap: wrap;
-  align-content: flex-start;
-}
-
-.video-item {
-  position: relative;
-  width: 15rem;
-  height: 10rem;
-  margin-right: 1rem;
-  background-color: #000000;
-}
-
-.video-item-img {
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  margin: auto;
-  width: 100%;
-  height: 100%;
-}
-
-.video-item-img:after {
-  content: "";
-  display: inline-block;
-  position: absolute;
-  z-index: 2;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  margin: auto;
-  width: 3rem;
-  height: 3rem;
-  background-image: url("../assets/loading.png");
-  background-size: cover;
-  background-color: #000000;
-}
-
-.video-item-title {
-  position: absolute;
-  bottom: 0;
-  color: #000000;
-  background-color: #ffffff;
-  line-height: 1.5rem;
-  padding: 0.3rem;
-  width: 14.4rem;
-}
-</style>