Commit 954ea79e authored by Kimber's avatar Kimber

'update'

parent cd60b0f0
...@@ -3,6 +3,56 @@ ...@@ -3,6 +3,56 @@
*/ */
const Config = { const Config = {
'15719992223': {
info: {
appKey: '32aa449f2b3d495cbbdc366199b03a1c',
appSecret: '9a2880086dd4b4c5e53dc415da881582'
},
list: [
{
name: '监控1',
channel: '1.hd.live',
id: 'AX7006080',
captcha: 'txgc112233',
remark: ''
},
{
name: '监控2',
channel: '2.hd.live',
id: 'AX7006080',
captcha: 'txgc112233',
remark: ''
},
{
name: '监控3',
channel: '3.hd.live',
id: 'AX7006080',
captcha: 'txgc112233',
remark: ''
},
{
name: '监控4',
channel: '4.hd.live',
id: 'AX7006080',
captcha: 'txgc112233',
remark: ''
},
{
name: '监控5',
channel: '5.hd.live',
id: 'AX7006080',
captcha: 'txgc112233',
remark: ''
},
{
name: '监控6',
channel: '6.hd.live',
id: 'AX7006080',
captcha: 'txgc112233',
remark: ''
}
]
},
}; };
export function getVideoInfo(key){ export function getVideoInfo(key){
......
...@@ -62,11 +62,10 @@ export default { ...@@ -62,11 +62,10 @@ export default {
}, },
mounted(){ mounted(){
this.videoContainer = this.$el.querySelector("#video-container"); this.videoContainer = this.$el.querySelector("#video-container");
//var configInfo = getVideoInfo(this.$store.state.user.user.username); var configInfo = getVideoInfo('15719992223');
this.info = configInfo.info;
//this.info = configInfo.info; this.videoList = configInfo.list;
//this.videoList = configInfo.list;
if(this.autoPlayer !== 'false'){ if(this.autoPlayer !== 'false'){
// 播放视频 // 播放视频
...@@ -97,9 +96,13 @@ export default { ...@@ -97,9 +96,13 @@ export default {
}; };
}, },
createVideo(item){ createVideo: function(item){
this.getAccessToken(this.info.appKey, this.info.appSecret).then(accessToken => { this.getAccessToken(this.info.appKey, this.info.appSecret).then(accessToken => {
var url = this.getUrl(item); var url = this.getUrl(item);
var video = document.getElementById("video-container");
video.innerHTML = '';
this.player = new EZUIKit.EZUIKitPlayer({ this.player = new EZUIKit.EZUIKitPlayer({
autoplay: true, autoplay: true,
id: "video-container", id: "video-container",
...@@ -153,6 +156,7 @@ export default { ...@@ -153,6 +156,7 @@ export default {
var id = item.id || this.info.id || ''; var id = item.id || this.info.id || '';
return 'ezopen://'+captcha+'open.ys7.com/'+id+'/'+item.channel; return 'ezopen://'+captcha+'open.ys7.com/'+id+'/'+item.channel;
}, },
// 视频选择事件 // 视频选择事件
selectVideo(index){ selectVideo(index){
var item = this.videoList[index]; var item = this.videoList[index];
......
...@@ -4,86 +4,7 @@ ...@@ -4,86 +4,7 @@
<!-- 视频监控 --> <!-- 视频监控 -->
<div class="page-wrapper"> <div class="page-wrapper">
<div class="video-wrapper"> <div class="video-wrapper">
<div <EZUIKitJs ref="EZUIKit" selectSeat="right" autoPlayer="true"/>
class="item"
>
<video
ref="videoPlayer6"
id="my-video6"
class="video-js vjs-default-skin"
width="380px"
height="300px"
controls
>
<source src="https://gctxyc.liveplay.myqcloud.com/gc/gccntv241-slf01_1/index.m3u8" type="application/x-mpegURL" />
Your browser does not support the video tag.
</video>
</div>
<div class="item">
<video
ref="videoPlayer1"
id="my-video1"
class="video-js vjs-default-skin"
controls
width="380px"
height="300px"
>
<source src="https://gcalic.v.myalicdn.com/gc/ztn_1/index.m3u8" type="application/x-mpegURL" />
Your browser does not support the video tag.
</video>
</div>
<div class="item">
<video
ref="videoPlayer2"
id="my-video2"
class="video-js vjs-default-skin"
controls
width="380px"
height="300px"
>
<source src="https://gctxyc.liveplay.myqcloud.com/gc/hlwxt_1/index.m3u8" type="application/x-mpegURL" />
Your browser does not support the video tag.
</video>
</div>
<div class="item">
<video
ref="videoPlayer3"
id="my-video3"
class="video-js vjs-default-skin"
controls
width="380px"
height="300px"
>
<source src="https://gctxyc.liveplay.myqcloud.com/gc/ylxs12_1/index.m3u8" type="application/x-mpegURL" />
Your browser does not support the video tag.
</video>
</div>
<div class="item">
<video
ref="videoPlayer4"
id="my-video4"
class="video-js vjs-default-skin"
controls
width="380px"
height="300px"
>
<source src="https://gctxyc.liveplay.myqcloud.com/gc/zyqcdx01_1/index.m3u8" type="application/x-mpegURL" />
Your browser does not support the video tag.
</video>
</div>
<div class="item">
<video
ref="videoPlayer5"
id="my-video5"
class="video-js vjs-default-skin"
controls
width="380px"
height="300px"
>
<source src="https://gctxyc.liveplay.myqcloud.com/gc/ztn_1/index.m3u8" type="application/x-mpegURL" />
Your browser does not support the video tag.
</video>
</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -94,10 +15,14 @@ ...@@ -94,10 +15,14 @@
<script> <script>
import { Tools } from "@/assets/js/common.js"; import { Tools } from "@/assets/js/common.js";
import { reqApi, Config } from "@/assets/js/httpApi.js"; import { reqApi, Config } from "@/assets/js/httpApi.js";
import videojs from "video.js"; //import videojs from "video.js";
import "video.js/dist/video-js.css"; //import "video.js/dist/video-js.css";
import EZUIKitJs from '@/components/EZUIKitJs';
export default { export default {
name: "videoMonitor", name: "videoMonitor",
components: {
EZUIKitJs
},
data() { data() {
return { return {
player1: null, player1: null,
...@@ -134,10 +59,23 @@ export default { ...@@ -134,10 +59,23 @@ export default {
}; };
}, },
mounted() { mounted() {
var that = this; var that = this;
this.$nextTick(() => { this.$nextTick(() => {
this.pageApi = Config.getModuleInfo(this); this.pageApi = Config.getModuleInfo(this);
console.log('this.pageApi ________________ ', this.pageApi);
}); });
return ;
const videoConfig = { const videoConfig = {
_controls: true, _controls: true,
autoplay: true, autoplay: true,
...@@ -191,19 +129,21 @@ export default { ...@@ -191,19 +129,21 @@ export default {
</script> </script>
<style rel="stylesheet/scss" lang="scss" scope> <style rel="stylesheet/scss" lang="scss" scope>
.page-wrapper { .page-wrapper {
width: 100%; width: 100%;display:flex;
height: 100%; height: 100%;
background: no-repeat center center url("~@/assets/images/layout/main_bg.png"); background: no-repeat center center url("~@/assets/images/layout/main_bg.png");
background-size: 100% 100%; background-size: 100% 100%;
.video-wrapper { .video-wrapper {
// background-color: #fff; // background-color: #fff;
width: 1200px;
margin: 0 auto; border:1px solid #3385FF;
width: 1000px;
margin:.3rem auto .3rem;
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
justify-content: center; justify-content: center;
padding-bottom: 0.1rem; padding-bottom: 0.1rem;
margin-top: 0.5rem;
} }
.item { .item {
width: 32.3333%; width: 32.3333%;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment