Commit 3da32f2a by Tianqing Liu

Merge branch 'qxh-master' of http://git.keliuyun.com:55676/jiaxiuc123/miniProject into qxh-master

2 parents d0a3a3b7 70863b03
...@@ -51,6 +51,7 @@ export default { ...@@ -51,6 +51,7 @@ export default {
} }
}, },
created() { created() {
console.log(window.JessibucaPro)
this.init(); this.init();
}, },
methods: { methods: {
......
...@@ -5,28 +5,40 @@ ...@@ -5,28 +5,40 @@
<el-button type="primary" @click="addPlayer({gateUnid: '85de13a8-5775-11ee-94ed-00163e143ecd'})">河南分公司--办公室--办公室监控</el-button> <el-button type="primary" @click="addPlayer({gateUnid: '85de13a8-5775-11ee-94ed-00163e143ecd'})">河南分公司--办公室--办公室监控</el-button>
<el-button type="primary" @click="addPlayer({gateUnid: '85de1aec-5775-11ee-94ed-00163e143ecd',watermarkText:'Demo Store'})">Demo Store--客流相机-入口1</el-button> <el-button type="primary" @click="addPlayer({gateUnid: '85de1aec-5775-11ee-94ed-00163e143ecd',watermarkText:'Demo Store'})">Demo Store--客流相机-入口1</el-button>
</div> </div>
<iframe id="iframe" name="iframe" ref="iframe" style="width: 100vw;height:calc(100vh - 60px);" src="/nvsdemo/#/jplayer-web" frameborder="0"></iframe> <indexPlayer ref="iframe"></indexPlayer>
<!-- <iframe name="iframe" ref="iframe" style="width: 100vw;height:calc(100vh - 60px);" src="http://192.168.1.117:8080/" frameborder="0"></iframe> --> <!-- <iframe id="iframe" name="iframe" ref="iframe" style="width: 100vw;height:calc(100vh - 60px);" src="/nvsdemo/#/jplayer-web" frameborder="0"></iframe> -->
<!-- <iframe id="iframe" name="iframe" ref="iframe" style="width: 100vw;height:calc(100vh - 60px);" src="http://192.168.1.67:9091/#/vion-player-demo" frameborder="0"></iframe> -->
</div> </div>
</template> </template>
<script> <script>
// import indexPlayer from './index.vue'; import indexPlayer from './index.vue';
export default { export default {
name: 'jplayerWebDemo', name: 'jplayerWebDemo',
components: { components: {
// indexPlayer, indexPlayer,
}, },
data() { data() {
return { return {
} }
}, },
created() { created() {
console.log(window.JessibucaPro)
},
mounted() {
this.$refs.iframe.initWebVideo({
isShowTime:true,// 是否显示时间操作区,默认为true
height:'',// 设置组件高度
isShowJT:false,// 是否显示截图按钮,默认为false
isShowSplit:false,// 是否支持四分屏,默认为true
controlAutoHide:false,// 是否显示视频操作区,默认为true
showPtz:false,// 是否显示视频操作区中的云台控制,默认为true
})
}, },
methods: { methods: {
addPlayer(obj) { addPlayer(obj) {
// window.playWebVideo(obj) // window.parent.document.getElementById('iframe').contentWindow.playWebVideo(obj)
window.parent.document.getElementById('iframe').contentWindow.playWebVideo(obj)
// document.getElementById('iframe').contentWindow.playWebVideo(obj); this.$refs.iframe.playWebVideo(obj)
}, },
}, },
} }
......
...@@ -52,14 +52,12 @@ export default { ...@@ -52,14 +52,12 @@ export default {
return ""; return "";
}, },
}, },
// 需要标记的时间 markTimeArr: {
markTime: {
type: Array, type: Array,
default() { default() {
return []; return [];
}, },
}, },
//是否自动播放 //是否自动播放
isAutoPlay: { isAutoPlay: {
type: Boolean, type: Boolean,
...@@ -96,6 +94,7 @@ export default { ...@@ -96,6 +94,7 @@ export default {
}, },
data() { data() {
return { return {
markTime:[],
//像素比 //像素比
dpr: 1, dpr: 1,
// realTimeRange: [], // realTimeRange: [],
...@@ -205,6 +204,12 @@ export default { ...@@ -205,6 +204,12 @@ export default {
} }
if (this.interval_play) clearInterval(this.interval_play); if (this.interval_play) clearInterval(this.interval_play);
}, },
// 重置画布
resetCanvas() {
this.markTime = []
this.stop()
this.drow();
},
/** /**
* 进度条播放(每次走一秒) * 进度条播放(每次走一秒)
* @param {String|Date} date 启动时间,不传启动时间为this.meddleTime * @param {String|Date} date 启动时间,不传启动时间为this.meddleTime
...@@ -710,6 +715,9 @@ export default { ...@@ -710,6 +715,9 @@ export default {
changeProps: function (newV) { changeProps: function (newV) {
this.drow(); this.drow();
}, },
markTimeArr: function (newV) {
this.markTime = Object.assign([],newV)
},
}, },
}; };
// import Hammer from "./assets/hammerjs"; // import Hammer from "./assets/hammerjs";
......
...@@ -65,7 +65,7 @@ ...@@ -65,7 +65,7 @@
<i class="el-icon-arrow-left"></i> <i class="el-icon-arrow-left"></i>
</div> --> </div> -->
<div class="timeline-canvas-box"> <div class="timeline-canvas-box">
<TimeLineCanvas id="timeline-canvas" ref="time_line" @click="clickCanvas" @change="changeDate" :mark-time="markTime" :time-range="timeRange" :isAutoPlay="isAutoPlay" :startMeddleTime="startMeddleTime" @mouseMove="mouseMoveDate"/> <TimeLineCanvas id="timeline-canvas" ref="time_line" @click="clickCanvas" @change="changeDate" :markTimeArr="markTime" :time-range="timeRange" :isAutoPlay="isAutoPlay" :startMeddleTime="startMeddleTime" @mouseMove="mouseMoveDate"/>
</div> </div>
<!-- <div class="timeline-icon-box" @click="timeLineMove(1)"> <!-- <div class="timeline-icon-box" @click="timeLineMove(1)">
<i class="el-icon-arrow-right"></i> <i class="el-icon-arrow-right"></i>
...@@ -200,6 +200,7 @@ export default { ...@@ -200,6 +200,7 @@ export default {
this.isAutoPlay = true this.isAutoPlay = true
}, },
stopPlay() { stopPlay() {
console.log(1)
this.isAutoPlay = false this.isAutoPlay = false
this.isNoBack = true this.isNoBack = true
this.markTime = [] this.markTime = []
...@@ -212,8 +213,9 @@ export default { ...@@ -212,8 +213,9 @@ export default {
this.startMeddleTime = moment().format('YYYY-MM-DD HH:mm:ss') this.startMeddleTime = moment().format('YYYY-MM-DD HH:mm:ss')
this.daySubtractNum = 0 this.daySubtractNum = 0
if(this.$refs.time_line) { if(this.$refs.time_line) {
this.$refs.time_line.stop(); this.$refs.time_line.resetCanvas();
} }
this.$forceUpdate()
}, },
showDayChange(val) { showDayChange(val) {
this.showDayShow = val this.showDayShow = val
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!