panlinlin
4 years ago
42 changed files with 1395 additions and 225 deletions
@ -0,0 +1,71 @@ |
|||||
|
package com.genersoft.iot.vmp.gb28181.bean; |
||||
|
|
||||
|
/** |
||||
|
* 直播流关联国标上级平台 |
||||
|
*/ |
||||
|
public class GbStream extends PlatformGbStream{ |
||||
|
|
||||
|
private String app; |
||||
|
private String stream; |
||||
|
private String gbId; |
||||
|
private String name; |
||||
|
private double longitude; |
||||
|
private double latitude; |
||||
|
private String streamType; |
||||
|
|
||||
|
public String getApp() { |
||||
|
return app; |
||||
|
} |
||||
|
|
||||
|
public void setApp(String app) { |
||||
|
this.app = app; |
||||
|
} |
||||
|
|
||||
|
public String getStream() { |
||||
|
return stream; |
||||
|
} |
||||
|
|
||||
|
public void setStream(String stream) { |
||||
|
this.stream = stream; |
||||
|
} |
||||
|
|
||||
|
public String getGbId() { |
||||
|
return gbId; |
||||
|
} |
||||
|
|
||||
|
public void setGbId(String gbId) { |
||||
|
this.gbId = gbId; |
||||
|
} |
||||
|
|
||||
|
public String getName() { |
||||
|
return name; |
||||
|
} |
||||
|
|
||||
|
public void setName(String name) { |
||||
|
this.name = name; |
||||
|
} |
||||
|
|
||||
|
public double getLongitude() { |
||||
|
return longitude; |
||||
|
} |
||||
|
|
||||
|
public void setLongitude(double longitude) { |
||||
|
this.longitude = longitude; |
||||
|
} |
||||
|
|
||||
|
public double getLatitude() { |
||||
|
return latitude; |
||||
|
} |
||||
|
|
||||
|
public void setLatitude(double latitude) { |
||||
|
this.latitude = latitude; |
||||
|
} |
||||
|
|
||||
|
public String getStreamType() { |
||||
|
return streamType; |
||||
|
} |
||||
|
|
||||
|
public void setStreamType(String streamType) { |
||||
|
this.streamType = streamType; |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,31 @@ |
|||||
|
package com.genersoft.iot.vmp.gb28181.bean; |
||||
|
|
||||
|
public class PlatformGbStream { |
||||
|
private String app; |
||||
|
private String stream; |
||||
|
private String platformId; |
||||
|
|
||||
|
public String getApp() { |
||||
|
return app; |
||||
|
} |
||||
|
|
||||
|
public void setApp(String app) { |
||||
|
this.app = app; |
||||
|
} |
||||
|
|
||||
|
public String getStream() { |
||||
|
return stream; |
||||
|
} |
||||
|
|
||||
|
public void setStream(String stream) { |
||||
|
this.stream = stream; |
||||
|
} |
||||
|
|
||||
|
public String getPlatformId() { |
||||
|
return platformId; |
||||
|
} |
||||
|
|
||||
|
public void setPlatformId(String platformId) { |
||||
|
this.platformId = platformId; |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,49 @@ |
|||||
|
package com.genersoft.iot.vmp.storager.dao; |
||||
|
|
||||
|
import com.genersoft.iot.vmp.gb28181.bean.GbStream; |
||||
|
import com.genersoft.iot.vmp.media.zlm.dto.StreamProxyItem; |
||||
|
import org.apache.ibatis.annotations.*; |
||||
|
import org.springframework.stereotype.Repository; |
||||
|
|
||||
|
import java.util.List; |
||||
|
|
||||
|
@Mapper |
||||
|
@Repository |
||||
|
public interface GbStreamMapper { |
||||
|
|
||||
|
@Insert("INSERT INTO gb_stream (app, stream, gbId, name, " + |
||||
|
"longitude, latitude, streamType) VALUES" + |
||||
|
"('${app}', '${stream}', '${gbId}', '${name}', " + |
||||
|
"'${longitude}', '${latitude}', '${streamType}')") |
||||
|
int add(GbStream gbStream); |
||||
|
|
||||
|
@Update("UPDATE gb_stream " + |
||||
|
"SET app=#{app}," + |
||||
|
"stream=#{stream}," + |
||||
|
"gbId=#{gbId}," + |
||||
|
"name=#{name}," + |
||||
|
"streamType=#{streamType}," + |
||||
|
"longitude=#{longitude}, " + |
||||
|
"latitude=#{latitude}, " + |
||||
|
"WHERE app=#{app} AND stream=#{stream} AND gbId=#{gbId}") |
||||
|
int update(GbStream gbStream); |
||||
|
|
||||
|
@Delete("DELETE FROM gb_stream WHERE app=#{app} AND stream=#{stream}") |
||||
|
int del(String app, String stream); |
||||
|
|
||||
|
@Select("SELECT gs.*, pgs.platformId FROM gb_stream gs LEFT JOIN platform_gb_stream pgs ON gs.app = pgs.app AND gs.stream = pgs.stream") |
||||
|
List<GbStream> selectAll(); |
||||
|
|
||||
|
@Select("SELECT * FROM gb_stream WHERE app=#{app} AND stream=#{stream}") |
||||
|
StreamProxyItem selectOne(String app, String stream); |
||||
|
|
||||
|
@Select("SELECT gs.*, pgs.platformId FROM gb_stream gs " + |
||||
|
"LEFT JOIN platform_gb_stream pgs ON gs.app = pgs.app AND gs.stream = pgs.stream " + |
||||
|
"WHERE gs.gbId = '${gbId}' AND pgs.platformId = '${platformId}'") |
||||
|
GbStream queryStreamInPlatform(String platformId, String gbId); |
||||
|
|
||||
|
@Select("SELECT gs.*, pgs.platformId FROM gb_stream gs " + |
||||
|
"LEFT JOIN platform_gb_stream pgs ON gs.app = pgs.app AND gs.stream = pgs.stream " + |
||||
|
"WHERE pgs.platformId = '${platformId}'") |
||||
|
List<GbStream> queryGbStreamListInPlatform(String platformId); |
||||
|
} |
||||
@ -0,0 +1,28 @@ |
|||||
|
package com.genersoft.iot.vmp.storager.dao; |
||||
|
|
||||
|
import com.genersoft.iot.vmp.gb28181.bean.GbStream; |
||||
|
import com.genersoft.iot.vmp.gb28181.bean.PlatformGbStream; |
||||
|
import com.genersoft.iot.vmp.media.zlm.dto.StreamProxyItem; |
||||
|
import org.apache.ibatis.annotations.*; |
||||
|
import org.springframework.stereotype.Repository; |
||||
|
|
||||
|
import java.util.List; |
||||
|
|
||||
|
|
||||
|
@Mapper |
||||
|
@Repository |
||||
|
public interface PlarfotmGbStreamMapper { |
||||
|
|
||||
|
@Insert("INSERT INTO platform_gb_stream (app, stream, platformId) VALUES" + |
||||
|
"('${app}', '${stream}', '${platformId}')") |
||||
|
int add(PlatformGbStream platformGbStream); |
||||
|
|
||||
|
@Delete("DELETE FROM platform_gb_stream WHERE app=#{app} AND stream=#{stream}") |
||||
|
int delByAppAndStream(String app, String stream); |
||||
|
|
||||
|
@Delete("DELETE FROM platform_gb_stream WHERE app=#{app} AND stream=#{stream}") |
||||
|
int delByPlatformId(String platformId); |
||||
|
|
||||
|
@Select("SELECT * FROM platform_gb_stream WHERE app=#{app} AND stream=#{stream} AND platformId=#{platformId}") |
||||
|
StreamProxyItem selectOne(String app, String stream, String platformId); |
||||
|
} |
||||
@ -0,0 +1,65 @@ |
|||||
|
package com.genersoft.iot.vmp.vmanager.gbStream; |
||||
|
|
||||
|
import com.alibaba.fastjson.JSON; |
||||
|
import com.alibaba.fastjson.JSONArray; |
||||
|
import com.genersoft.iot.vmp.gb28181.bean.GbStream; |
||||
|
import com.genersoft.iot.vmp.storager.IVideoManagerStorager; |
||||
|
import com.genersoft.iot.vmp.vmanager.gbStream.bean.GbStreamParam; |
||||
|
import com.genersoft.iot.vmp.vmanager.platform.bean.UpdateChannelParam; |
||||
|
import com.genersoft.iot.vmp.vmanager.service.IGbStreamService; |
||||
|
import com.github.pagehelper.PageInfo; |
||||
|
import org.slf4j.Logger; |
||||
|
import org.slf4j.LoggerFactory; |
||||
|
import org.springframework.beans.factory.annotation.Autowired; |
||||
|
import org.springframework.web.bind.annotation.*; |
||||
|
|
||||
|
import java.util.List; |
||||
|
|
||||
|
@CrossOrigin |
||||
|
@RestController |
||||
|
@RequestMapping("/api/gbStream") |
||||
|
public class GbStreamController { |
||||
|
|
||||
|
private final static Logger logger = LoggerFactory.getLogger(GbStreamController.class); |
||||
|
|
||||
|
@Autowired |
||||
|
private IGbStreamService gbStreamService; |
||||
|
|
||||
|
@Autowired |
||||
|
private IVideoManagerStorager storager; |
||||
|
|
||||
|
|
||||
|
@RequestMapping(value = "/list") |
||||
|
@ResponseBody |
||||
|
public PageInfo<GbStream> list(@RequestParam(required = false)Integer page, |
||||
|
@RequestParam(required = false)Integer count){ |
||||
|
|
||||
|
return gbStreamService.getAll(page, count); |
||||
|
} |
||||
|
|
||||
|
|
||||
|
@RequestMapping(value = "/del") |
||||
|
@ResponseBody |
||||
|
public Object del(@RequestBody GbStreamParam gbStreamParam){ |
||||
|
System.out.println(2222); |
||||
|
System.out.println(gbStreamParam.getGbStreams().size()); |
||||
|
if (gbStreamService.delPlatformInfo(gbStreamParam.getGbStreams())) { |
||||
|
return "success"; |
||||
|
}else { |
||||
|
return "fail"; |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
@RequestMapping(value = "/add") |
||||
|
@ResponseBody |
||||
|
public Object add(@RequestBody GbStreamParam gbStreamParam){ |
||||
|
System.out.println(3333); |
||||
|
System.out.println(gbStreamParam.getGbStreams().size()); |
||||
|
if (gbStreamService.addPlatformInfo(gbStreamParam.getGbStreams(), gbStreamParam.getPlatformId())) { |
||||
|
return "success"; |
||||
|
}else { |
||||
|
return "fail"; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,28 @@ |
|||||
|
package com.genersoft.iot.vmp.vmanager.gbStream.bean; |
||||
|
|
||||
|
import com.genersoft.iot.vmp.gb28181.bean.GbStream; |
||||
|
|
||||
|
import java.util.List; |
||||
|
|
||||
|
public class GbStreamParam { |
||||
|
|
||||
|
private String platformId; |
||||
|
|
||||
|
private List<GbStream> gbStreams; |
||||
|
|
||||
|
public String getPlatformId() { |
||||
|
return platformId; |
||||
|
} |
||||
|
|
||||
|
public void setPlatformId(String platformId) { |
||||
|
this.platformId = platformId; |
||||
|
} |
||||
|
|
||||
|
public List<GbStream> getGbStreams() { |
||||
|
return gbStreams; |
||||
|
} |
||||
|
|
||||
|
public void setGbStreams(List<GbStream> gbStreams) { |
||||
|
this.gbStreams = gbStreams; |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,35 @@ |
|||||
|
package com.genersoft.iot.vmp.vmanager.platformGbStream; |
||||
|
|
||||
|
import com.genersoft.iot.vmp.gb28181.bean.GbStream; |
||||
|
import com.genersoft.iot.vmp.gb28181.bean.PlatformGbStream; |
||||
|
import com.genersoft.iot.vmp.storager.IVideoManagerStorager; |
||||
|
import com.genersoft.iot.vmp.vmanager.service.IGbStreamService; |
||||
|
import com.github.pagehelper.PageInfo; |
||||
|
import org.slf4j.Logger; |
||||
|
import org.slf4j.LoggerFactory; |
||||
|
import org.springframework.beans.factory.annotation.Autowired; |
||||
|
import org.springframework.web.bind.annotation.*; |
||||
|
|
||||
|
@CrossOrigin |
||||
|
@RestController |
||||
|
@RequestMapping("/api") |
||||
|
public class PlatformGbStreamController { |
||||
|
|
||||
|
private final static Logger logger = LoggerFactory.getLogger(PlatformGbStreamController.class); |
||||
|
|
||||
|
@Autowired |
||||
|
private IGbStreamService gbStreamService; |
||||
|
|
||||
|
@Autowired |
||||
|
private IVideoManagerStorager storager; |
||||
|
|
||||
|
@RequestMapping(value = "/list") |
||||
|
@ResponseBody |
||||
|
public PageInfo<GbStream> list(@RequestParam(required = false)Integer page, |
||||
|
@RequestParam(required = false)Integer count){ |
||||
|
|
||||
|
return gbStreamService.getAll(page, count); |
||||
|
} |
||||
|
|
||||
|
|
||||
|
} |
||||
@ -0,0 +1,41 @@ |
|||||
|
package com.genersoft.iot.vmp.vmanager.service; |
||||
|
|
||||
|
import com.genersoft.iot.vmp.gb28181.bean.GbStream; |
||||
|
import com.genersoft.iot.vmp.gb28181.bean.PlatformGbStream; |
||||
|
import com.github.pagehelper.PageInfo; |
||||
|
|
||||
|
import java.util.List; |
||||
|
|
||||
|
/** |
||||
|
* 级联国标平台关联流业务接口 |
||||
|
*/ |
||||
|
public interface IGbStreamService { |
||||
|
|
||||
|
/** |
||||
|
* 分页获取所有 |
||||
|
* @param page |
||||
|
* @param count |
||||
|
* @return |
||||
|
*/ |
||||
|
PageInfo<GbStream> getAll(Integer page, Integer count); |
||||
|
|
||||
|
|
||||
|
/** |
||||
|
* 移除 |
||||
|
* @param app |
||||
|
* @param stream |
||||
|
*/ |
||||
|
void del(String app, String stream); |
||||
|
|
||||
|
/** |
||||
|
* 保存国标关联 |
||||
|
* @param gbStreams |
||||
|
*/ |
||||
|
boolean addPlatformInfo(List<GbStream> gbStreams, String platformId); |
||||
|
|
||||
|
/** |
||||
|
* 移除国标关联 |
||||
|
* @param gbStreams |
||||
|
*/ |
||||
|
boolean delPlatformInfo(List<GbStream> gbStreams); |
||||
|
} |
||||
@ -0,0 +1,89 @@ |
|||||
|
package com.genersoft.iot.vmp.vmanager.service.impl; |
||||
|
|
||||
|
import com.genersoft.iot.vmp.gb28181.bean.GbStream; |
||||
|
import com.genersoft.iot.vmp.gb28181.bean.PlatformGbStream; |
||||
|
import com.genersoft.iot.vmp.media.zlm.dto.StreamProxyItem; |
||||
|
import com.genersoft.iot.vmp.storager.dao.GbStreamMapper; |
||||
|
import com.genersoft.iot.vmp.storager.dao.PlarfotmGbStreamMapper; |
||||
|
import com.genersoft.iot.vmp.vmanager.platform.PlatformController; |
||||
|
import com.genersoft.iot.vmp.vmanager.service.IGbStreamService; |
||||
|
import com.github.pagehelper.PageHelper; |
||||
|
import com.github.pagehelper.PageInfo; |
||||
|
import org.slf4j.Logger; |
||||
|
import org.slf4j.LoggerFactory; |
||||
|
import org.springframework.beans.factory.annotation.Autowired; |
||||
|
import org.springframework.jdbc.datasource.DataSourceTransactionManager; |
||||
|
import org.springframework.stereotype.Service; |
||||
|
import org.springframework.transaction.TransactionDefinition; |
||||
|
import org.springframework.transaction.TransactionStatus; |
||||
|
|
||||
|
import java.util.List; |
||||
|
|
||||
|
@Service |
||||
|
public class GbStreamServiceImpl implements IGbStreamService { |
||||
|
|
||||
|
private final static Logger logger = LoggerFactory.getLogger(GbStreamServiceImpl.class); |
||||
|
|
||||
|
@Autowired |
||||
|
DataSourceTransactionManager dataSourceTransactionManager; |
||||
|
|
||||
|
@Autowired |
||||
|
TransactionDefinition transactionDefinition; |
||||
|
|
||||
|
@Autowired |
||||
|
private GbStreamMapper gbStreamMapper; |
||||
|
|
||||
|
@Autowired |
||||
|
private PlarfotmGbStreamMapper plarfotmGbStreamMapper; |
||||
|
|
||||
|
@Override |
||||
|
public PageInfo<GbStream> getAll(Integer page, Integer count) { |
||||
|
PageHelper.startPage(page, count); |
||||
|
List<GbStream> all = gbStreamMapper.selectAll(); |
||||
|
return new PageInfo<>(all); |
||||
|
} |
||||
|
|
||||
|
@Override |
||||
|
public void del(String app, String stream) { |
||||
|
gbStreamMapper.del(app, stream); |
||||
|
} |
||||
|
|
||||
|
|
||||
|
@Override |
||||
|
public boolean addPlatformInfo(List<GbStream> gbStreams, String platformId) { |
||||
|
// 放在事务内执行
|
||||
|
boolean result = false; |
||||
|
TransactionStatus transactionStatus = dataSourceTransactionManager.getTransaction(transactionDefinition); |
||||
|
try { |
||||
|
for (GbStream gbStream : gbStreams) { |
||||
|
gbStream.setPlatformId(platformId); |
||||
|
plarfotmGbStreamMapper.add(gbStream); |
||||
|
} |
||||
|
dataSourceTransactionManager.commit(transactionStatus); //手动提交
|
||||
|
result = true; |
||||
|
}catch (Exception e) { |
||||
|
logger.error("批量保存流与平台的关系时错误", e); |
||||
|
dataSourceTransactionManager.rollback(transactionStatus); |
||||
|
} |
||||
|
return result; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
@Override |
||||
|
public boolean delPlatformInfo(List<GbStream> gbStreams) { |
||||
|
// 放在事务内执行
|
||||
|
boolean result = false; |
||||
|
TransactionStatus transactionStatus = dataSourceTransactionManager.getTransaction(transactionDefinition); |
||||
|
try { |
||||
|
for (GbStream gbStream : gbStreams) { |
||||
|
plarfotmGbStreamMapper.delByAppAndStream(gbStream.getApp(), gbStream.getStream()); |
||||
|
} |
||||
|
dataSourceTransactionManager.commit(transactionStatus); //手动提交
|
||||
|
result = true; |
||||
|
}catch (Exception e) { |
||||
|
logger.error("批量移除流与平台的关系时错误", e); |
||||
|
dataSourceTransactionManager.rollback(transactionStatus); |
||||
|
} |
||||
|
return result; |
||||
|
} |
||||
|
} |
||||
Binary file not shown.
@ -0,0 +1,283 @@ |
|||||
|
<template> |
||||
|
<div id="pLatformStreamList"> |
||||
|
<el-container> |
||||
|
<el-header> |
||||
|
<uiHeader></uiHeader> |
||||
|
</el-header> |
||||
|
<el-main> |
||||
|
<div style="background-color: #FFFFFF; margin-bottom: 1rem; position: relative; padding: 0.5rem; text-align: left;"> |
||||
|
<span style="font-size: 1rem; font-weight: bold;">直播级联列表</span> |
||||
|
</div> |
||||
|
<div style="background-color: #FFFFFF; margin-bottom: 1rem; position: relative; padding: 0.5rem; text-align: left;font-size: 14px;"> |
||||
|
<el-button icon="el-icon-plus" size="mini" style="margin-right: 1rem;" type="primary" @click="addStreamProxy">添加代理</el-button> |
||||
|
</div> |
||||
|
<devicePlayer ref="devicePlayer"></devicePlayer> |
||||
|
<el-table :data="streamProxyList" border style="width: 100%" :height="winHeight"> |
||||
|
<el-table-column prop="app" label="应用名" align="center" show-overflow-tooltip/> |
||||
|
<el-table-column prop="stream" label="流ID" align="center" show-overflow-tooltip/> |
||||
|
<el-table-column prop="gbId" label="国标平台" align="center" show-overflow-tooltip/> |
||||
|
|
||||
|
<el-table-column label="转HLS" width="120" align="center"> |
||||
|
<template slot-scope="scope"> |
||||
|
<div slot="reference" class="name-wrapper"> |
||||
|
<el-tag size="medium" v-if="scope.row.enable_hls">已启用</el-tag> |
||||
|
<el-tag size="medium" type="info" v-if="!scope.row.enable_hls">未启用</el-tag> |
||||
|
</div> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column label="MP4录制" width="120" align="center"> |
||||
|
<template slot-scope="scope"> |
||||
|
<div slot="reference" class="name-wrapper"> |
||||
|
<el-tag size="medium" v-if="scope.row.enable_mp4">已启用</el-tag> |
||||
|
<el-tag size="medium" type="info" v-if="!scope.row.enable_mp4">未启用</el-tag> |
||||
|
</div> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column label="启用" width="120" align="center"> |
||||
|
<template slot-scope="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> |
||||
|
</div> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
|
||||
|
<el-table-column label="操作" width="360" align="center" fixed="right"> |
||||
|
<template slot-scope="scope"> |
||||
|
<el-button-group> |
||||
|
<el-button size="mini" icon="el-icon-video-play" v-if="scope.row.enable" @click="play(scope.row)">播放</el-button> |
||||
|
<el-button size="mini" icon="el-icon-close" type="success" v-if="scope.row.enable" @click="stop(scope.row)">停用</el-button> |
||||
|
<el-button size="mini" icon="el-icon-check" type="primary" v-if="!scope.row.enable" @click="start(scope.row)">启用</el-button> |
||||
|
<el-button size="mini" icon="el-icon-delete" type="danger" @click="deleteStreamProxy(scope.row)">删除</el-button> |
||||
|
<!-- <el-button size="mini" icon="el-icon-position" type="primary" >加入国标</el-button> --> |
||||
|
</el-button-group> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</el-table> |
||||
|
<el-pagination |
||||
|
style="float: right" |
||||
|
@size-change="handleSizeChange" |
||||
|
@current-change="currentChange" |
||||
|
:current-page="currentPage" |
||||
|
:page-size="count" |
||||
|
:page-sizes="[15, 25, 35, 50]" |
||||
|
layout="total, sizes, prev, pager, next" |
||||
|
:total="total"> |
||||
|
</el-pagination> |
||||
|
<streamProxyEdit ref="streamProxyEdit" ></streamProxyEdit> |
||||
|
</el-main> |
||||
|
</el-container> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import streamProxyEdit from './dialog/StreamProxyEdit.vue' |
||||
|
import devicePlayer from './dialog/devicePlayer.vue' |
||||
|
import uiHeader from './UiHeader.vue' |
||||
|
export default { |
||||
|
name: 'pLatformStreamList', |
||||
|
components: { |
||||
|
devicePlayer, |
||||
|
streamProxyEdit, |
||||
|
uiHeader |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
streamProxyList: [], |
||||
|
currentPusher: {}, //当前操作设备对象 |
||||
|
updateLooper: 0, //数据刷新轮训标志 |
||||
|
currentDeviceChannelsLenth:0, |
||||
|
winHeight: window.innerHeight - 200, |
||||
|
currentPage:1, |
||||
|
count:15, |
||||
|
total:0, |
||||
|
getListLoading: false |
||||
|
}; |
||||
|
}, |
||||
|
computed: { |
||||
|
}, |
||||
|
mounted() { |
||||
|
this.initData(); |
||||
|
// this.updateLooper = setInterval(this.initData, 10000); |
||||
|
}, |
||||
|
destroyed() { |
||||
|
this.$destroy('videojs'); |
||||
|
clearTimeout(this.updateLooper); |
||||
|
}, |
||||
|
methods: { |
||||
|
initData: function() { |
||||
|
this.getStreamProxyList(); |
||||
|
}, |
||||
|
currentChange: function(val){ |
||||
|
this.currentPage = val; |
||||
|
this.getStreamProxyList(); |
||||
|
}, |
||||
|
handleSizeChange: function(val){ |
||||
|
this.count = val; |
||||
|
this.getStreamProxyList(); |
||||
|
}, |
||||
|
getStreamProxyList: function() { |
||||
|
let that = this; |
||||
|
this.getListLoading = true; |
||||
|
this.$axios.get(`/api/proxy/list`,{ |
||||
|
params: { |
||||
|
page: that.currentPage, |
||||
|
count: that.count |
||||
|
} |
||||
|
} ) |
||||
|
.then(function (res) { |
||||
|
console.log(res); |
||||
|
console.log(res.data.list); |
||||
|
that.total = res.data.total; |
||||
|
that.streamProxyList = res.data.list; |
||||
|
that.getListLoading = false; |
||||
|
}) |
||||
|
.catch(function (error) { |
||||
|
console.log(error); |
||||
|
that.getListLoading = false; |
||||
|
}); |
||||
|
}, |
||||
|
addStreamProxy: function(){ |
||||
|
this.$refs.streamProxyEdit.openDialog(null, this.initData) |
||||
|
}, |
||||
|
saveStreamProxy: function(){ |
||||
|
}, |
||||
|
play: function(row){ |
||||
|
let that = this; |
||||
|
this.getListLoading = true; |
||||
|
this.$axios.get(`/api/media/getStreamInfoByAppAndStream`,{ |
||||
|
params: { |
||||
|
app: row.app, |
||||
|
stream: row.stream |
||||
|
} |
||||
|
}) |
||||
|
.then(function (res) { |
||||
|
that.getListLoading = false; |
||||
|
that.$refs.devicePlayer.openDialog("streamPlay", null, null, { |
||||
|
streamInfo: res.data, |
||||
|
hasAudio: true |
||||
|
}); |
||||
|
}) |
||||
|
.catch(function (error) { |
||||
|
console.log(error); |
||||
|
that.getListLoading = false; |
||||
|
}); |
||||
|
|
||||
|
}, |
||||
|
deleteStreamProxy: function(row){ |
||||
|
console.log(1111) |
||||
|
let that = this; |
||||
|
this.getListLoading = true; |
||||
|
this.$axios.get(`/api/proxy/del`,{ |
||||
|
params: { |
||||
|
app: row.app, |
||||
|
stream: row.stream |
||||
|
} |
||||
|
}) |
||||
|
.then(function (res) { |
||||
|
that.getListLoading = false; |
||||
|
that.initData() |
||||
|
}) |
||||
|
.catch(function (error) { |
||||
|
console.log(error); |
||||
|
that.getListLoading = false; |
||||
|
}); |
||||
|
}, |
||||
|
start: function(row){ |
||||
|
let that = this; |
||||
|
this.getListLoading = true; |
||||
|
this.$axios.get(`/api/proxy/start`,{ |
||||
|
params: { |
||||
|
app: row.app, |
||||
|
stream: row.stream |
||||
|
} |
||||
|
}) |
||||
|
.then(function (res) { |
||||
|
that.getListLoading = false; |
||||
|
that.initData() |
||||
|
}) |
||||
|
.catch(function (error) { |
||||
|
console.log(error); |
||||
|
that.getListLoading = false; |
||||
|
}); |
||||
|
}, |
||||
|
stop: function(row){ |
||||
|
let that = this; |
||||
|
this.getListLoading = true; |
||||
|
this.$axios.get(`/api/proxy/stop`,{ |
||||
|
params: { |
||||
|
app: row.app, |
||||
|
stream: row.stream |
||||
|
} |
||||
|
}) |
||||
|
.then(function (res) { |
||||
|
that.getListLoading = false; |
||||
|
that.initData() |
||||
|
}) |
||||
|
.catch(function (error) { |
||||
|
console.log(error); |
||||
|
that.getListLoading = false; |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
}; |
||||
|
</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; |
||||
|
} |
||||
|
.cpoy-btn { |
||||
|
cursor: pointer; |
||||
|
margin-right: 10px; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,215 @@ |
|||||
|
<template> |
||||
|
<div id="chooseChannelFoStream" > |
||||
|
<el-table ref="gbStreamsTable" :data="gbStreams" border style="width: 100%" @selection-change="checkedChanage" > |
||||
|
<el-table-column type="selection" width="55" align="center" fixed > </el-table-column> |
||||
|
<el-table-column prop="name" label="名称" show-overflow-tooltip> |
||||
|
</el-table-column> |
||||
|
<el-table-column prop="app" label="应用名" show-overflow-tooltip> |
||||
|
</el-table-column> |
||||
|
<el-table-column prop="stream" label="流ID" show-overflow-tooltip> |
||||
|
</el-table-column> |
||||
|
<el-table-column prop="gbId" label="国标编码" show-overflow-tooltip> |
||||
|
</el-table-column> |
||||
|
<el-table-column prop="streamType" label="流来源" align="center" show-overflow-tooltip> |
||||
|
</el-table-column> |
||||
|
<el-table-column label="流来源" width="100" align="center"> |
||||
|
<template slot-scope="scope"> |
||||
|
<div slot="reference" class="name-wrapper"> |
||||
|
<el-tag size="medium" v-if="scope.row.streamType == 'proxy'">拉流代理</el-tag> |
||||
|
<el-tag size="medium" v-if="scope.row.streamType == 'push'">推流</el-tag> |
||||
|
</div> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</el-table> |
||||
|
<el-pagination style="float: right;margin-top: 1rem;" @size-change="handleSizeChange" @current-change="currentChange" :current-page="currentPage" :page-size="count" :page-sizes="[10, 20, 30, 50]" layout="total, sizes, prev, pager, next" :total="total"> |
||||
|
</el-pagination> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
name: 'chooseChannelFoStream', |
||||
|
props: {}, |
||||
|
computed: { |
||||
|
// getPlayerShared: function () { |
||||
|
// return { |
||||
|
// sharedUrl: window.location.host + '/' + this.videoUrl, |
||||
|
// sharedIframe: '<iframe src="' + window.location.host + '/' + this.videoUrl + '"></iframe>', |
||||
|
// sharedRtmp: this.videoUrl |
||||
|
// }; |
||||
|
// } |
||||
|
}, |
||||
|
props: ['platformId'], |
||||
|
created() { |
||||
|
this.initData(); |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
gbStreams: [], |
||||
|
gbChoosechannel:{}, |
||||
|
searchSrt: "", |
||||
|
channelType: "", |
||||
|
online: "", |
||||
|
choosed: "", |
||||
|
currentPage: 0, |
||||
|
count: 10, |
||||
|
total: 0, |
||||
|
eventEnanle: false |
||||
|
|
||||
|
}; |
||||
|
}, |
||||
|
watch:{ |
||||
|
platformId(newData, oldData){ |
||||
|
console.log(newData) |
||||
|
this.initData() |
||||
|
|
||||
|
}, |
||||
|
}, |
||||
|
methods: { |
||||
|
initData: function() { |
||||
|
this.getChannelList(); |
||||
|
}, |
||||
|
currentChange: function (val) { |
||||
|
this.currentPage = val; |
||||
|
this.initData(); |
||||
|
}, |
||||
|
handleSizeChange: function (val) { |
||||
|
this.count = val; |
||||
|
console.log(val) |
||||
|
this.initData(); |
||||
|
|
||||
|
}, |
||||
|
rowcheckedChanage: function (val, row) { |
||||
|
console.log(val) |
||||
|
console.log(row) |
||||
|
}, |
||||
|
checkedChanage: function (val) { |
||||
|
var that = this; |
||||
|
if (!that.eventEnanle) { |
||||
|
return; |
||||
|
} |
||||
|
var tabelData = JSON.parse(JSON.stringify(this.$refs.gbStreamsTable.data)); |
||||
|
console.log("checkedChanage") |
||||
|
console.log(val) |
||||
|
|
||||
|
var newData = {}; |
||||
|
var addData = []; |
||||
|
var delData = []; |
||||
|
if (val.length > 0) { |
||||
|
for (let i = 0; i < val.length; i++) { |
||||
|
const element = val[i]; |
||||
|
var key = element.app + "_" + element.stream; |
||||
|
newData[key] = element; |
||||
|
if (!!!that.gbChoosechannel[key]){ |
||||
|
addData.push(element) |
||||
|
}else{ |
||||
|
delete that.gbChoosechannel[key] |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
var oldKeys = Object.keys(that.gbChoosechannel); |
||||
|
if (oldKeys.length > 0) { |
||||
|
for (let i = 0; i < oldKeys.length; i++) { |
||||
|
const key = oldKeys[i]; |
||||
|
delData.push(that.gbChoosechannel[key]) |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
}else{ |
||||
|
var oldKeys = Object.keys(that.gbChoosechannel); |
||||
|
if (oldKeys.length > 0) { |
||||
|
for (let i = 0; i < oldKeys.length; i++) { |
||||
|
const key = oldKeys[i]; |
||||
|
delData.push(that.gbChoosechannel[key]) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
that.gbChoosechannel = newData; |
||||
|
if (Object.keys(addData).length >0) { |
||||
|
console.log(addData) |
||||
|
that.$axios({ |
||||
|
method:"post", |
||||
|
url:"/api/gbStream/add", |
||||
|
data:{ |
||||
|
platformId: that.platformId, |
||||
|
gbStreams: addData, |
||||
|
} |
||||
|
}).then((res)=>{ |
||||
|
console.log("保存成功") |
||||
|
}).catch(function (error) { |
||||
|
console.log(error); |
||||
|
}); |
||||
|
} |
||||
|
if (Object.keys(delData).length >0) { |
||||
|
console.log(delData) |
||||
|
that.$axios({ |
||||
|
method:"post", |
||||
|
url:"/api/gbStream/del", |
||||
|
data:{ |
||||
|
gbStreams: delData, |
||||
|
} |
||||
|
}).then((res)=>{ |
||||
|
console.log("移除成功") |
||||
|
}).catch(function (error) { |
||||
|
console.log(error); |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
}, |
||||
|
shareAllCheckedChanage: function (val) { |
||||
|
this.chooseChanage(null, val) |
||||
|
}, |
||||
|
getChannelList: function () { |
||||
|
let that = this; |
||||
|
|
||||
|
this.$axios.get(`/api/gbStream/list`, { |
||||
|
params: { |
||||
|
page: that.currentPage, |
||||
|
count: that.count, |
||||
|
query: that.searchSrt, |
||||
|
online: that.online, |
||||
|
choosed: that.choosed, |
||||
|
platformId: that.platformId, |
||||
|
channelType: that.channelType |
||||
|
} |
||||
|
}) |
||||
|
.then(function (res) { |
||||
|
that.total = res.data.total; |
||||
|
that.gbStreams = res.data.list; |
||||
|
that.gbChoosechannel = {}; |
||||
|
// 防止出现表格错位 |
||||
|
that.$nextTick(() => { |
||||
|
that.$refs.gbStreamsTable.doLayout(); |
||||
|
// 默认选中 |
||||
|
var chooseGBS = []; |
||||
|
for (let i = 0; i < res.data.list.length; i++) { |
||||
|
const row = res.data.list[i]; |
||||
|
console.log(row.platformId) |
||||
|
if (row.platformId == that.platformId) { |
||||
|
that.$refs.gbStreamsTable.toggleRowSelection(row, true); |
||||
|
chooseGBS.push(row) |
||||
|
that.gbChoosechannel[row.app+ "_" + row.stream] = row; |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
that.eventEnanle = true; |
||||
|
// that.checkedChanage(chooseGBS) |
||||
|
}) |
||||
|
console.log(that.gbChoosechannel) |
||||
|
}) |
||||
|
.catch(function (error) { |
||||
|
console.log(error); |
||||
|
}); |
||||
|
|
||||
|
}, |
||||
|
handleGBSelectionChange: function() { |
||||
|
this.initData(); |
||||
|
}, |
||||
|
} |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style> |
||||
|
|
||||
|
</style> |
||||
Loading…
Reference in new issue