<template>
|
<div style="display: flex; flex-direction: column; width: 100%">
|
<div style="width: 100%;display: flex;justify-content: center;">
|
<div class="video-container">
|
<easy-player :video-url="url"></easy-player>
|
</div>
|
</div>
|
<div style="margin-top: 15px;display: flex;justify-content: center; width: 100%;">
|
<controller-video :index-code="indexCode"/>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import EasyPlayer from '@easydarwin/easyplayer'
|
import ControllerVideo from '@/components/ControllerVideoWx'
|
export default {
|
name: 'CameraPTZ1',
|
components: { EasyPlayer, ControllerVideo },
|
data () {
|
return {
|
indexCode: '1a137202592b430f8c346f243996014e',
|
url: 'https://hkpt.xwshtxq.com:1443/mls/openUrl/vbcZ7K8/live.m3u8?params=eyJpbmRleENvZGUiOiIxYTEzNzIwMjU5MmI0MzBmOGMzNDZmMjQzOTk2MDE0ZSIsIm5ldFpvbmVDb2RlIjoiNTMiLCJwcm90b2NvbCI6Imhsc3MiLCJ1c2VyZWRpcmVjdCI6dHJ1ZSwidXNlcklkIjoiYWRtaW4ifQ=='
|
}
|
},
|
methods: {
|
}
|
}
|
</script>
|
|
<style scoped>
|
/* 针对web的样式 */
|
.video-container {
|
height: 370px;
|
width: 700px;
|
}
|
/* 针对手机屏幕的样式 */
|
@media (max-width: 768px) {
|
.video-container {
|
height: 30vh;
|
width: 90vw;
|
}
|
}
|
</style>
|
