Skip to content

蒋秀川 / miniProject

Go to a project
Commit f114ada5 by Tianqing Liu
Options

feat: 增加录像示例

1 parent 3456206f
Inline Side-by-side
Showing 1 changed file with 14 additions and 12 deletions
h5/src/views/player/vionPlayerDemo.vue
...@@ -4,7 +4,6 @@ ...@@ -4,7 +4,6 @@
<!-- :play-url="playUrl" --> <!-- :play-url="playUrl" -->
<vion-player v-if="playerVisible" <vion-player v-if="playerVisible"
ref="vionPlayer" ref="vionPlayer"
:type="playerType"
:datetime-range="datetimeRange" :datetime-range="datetimeRange"
watermarkText="文安智能123" watermarkText="文安智能123"
@ptz-control="handlePtz" @ptz-control="handlePtz"
...@@ -16,12 +15,15 @@ ...@@ -16,12 +15,15 @@
<button @click="handlePlay">播放</button> <button @click="handlePlay">播放</button>
</div> </div>
<!-- <button @click="handleLive">直播</button> --> <!-- <button @click="handleLive">直播</button> -->
<!-- <button @click="handlePlayback">回放</button> -->
<!-- <button @click="handleShow">展示</button> --> <!-- <button @click="handleShow">展示</button> -->
<button @click="handlePause">暂停</button> <button @click="handlePause">暂停</button>
<button @click="handleStop">停止</button> <button @click="handleStop">停止</button>
<button @click="handleDestroy">销毁</button> <button @click="handleDestroy">销毁</button>
<button @click="handleScreenshot">抓拍</button> <button @click="handleScreenshot">抓拍</button>
<div class="record">
<input type="text" v-model="recordUrl">
<button @click="handleRecord">录像</button>
</div>
</div> </div>
<el-dialog title="Image" :visible.sync="dialogVisible" width="90%"> <el-dialog title="Image" :visible.sync="dialogVisible" width="90%">
...@@ -40,7 +42,6 @@ export default { ...@@ -40,7 +42,6 @@ export default {
}, },
data() { data() {
return { return {
playerType: 'live',
datetimeRange: [], datetimeRange: [],
playerVisible: true, playerVisible: true,
...@@ -49,6 +50,7 @@ export default { ...@@ -49,6 +50,7 @@ export default {
// 播放器相关 // 播放器相关
playUrl: 'https://rtmp01open.ys7.com:9188/v3/openlive/F16423875_1_1.flv?expire=1695279265&id=624619383494283264&t=75ae0260690eedd9d493ab1caf716fe3f10a3e4c9b6df59135e032d437cf187a&ev=100&supportH265=1', playUrl: 'https://rtmp01open.ys7.com:9188/v3/openlive/F16423875_1_1.flv?expire=1695279265&id=624619383494283264&t=75ae0260690eedd9d493ab1caf716fe3f10a3e4c9b6df59135e032d437cf187a&ev=100&supportH265=1',
recordUrl: 'https://rtmp01open.ys7.com:9188/v3/openpb/F16423875_1_1.flv?begin=20230919103030&end=20230919113030&expire=1695289270&id=624661345092866048&rec=local&t=53368acd4fe795901a25cc1f85e212040abd6d816d5d7154fc61cff27285b81a&ev=100&supportH265=1',
} }
}, },
methods: { methods: {
...@@ -59,15 +61,8 @@ export default { ...@@ -59,15 +61,8 @@ export default {
handleShow() { handleShow() {
this.playerVisible = true; this.playerVisible = true;
}, },
handleLive() { handleRecord() {
this.playerType = 'live'; this.$refs.vionPlayer.play(this.recordUrl);
},
handlePlayback() {
this.playerType = 'playback';
this.datetimeRange = [
'1693904400000',
'1693908000000',
];
}, },
handleScreenshot() { handleScreenshot() {
this.$refs.vionPlayer.screenshot().then(data => { this.$refs.vionPlayer.screenshot().then(data => {
...@@ -121,6 +116,13 @@ export default { ...@@ -121,6 +116,13 @@ export default {
> button { > button {
margin-right: 10px; margin-right: 10px;
} }
> div.record {
margin-top: 10px;
> button {
margin-left: 2px;
}
}
} }
::v-deep(.el-dialog__body) { ::v-deep(.el-dialog__body) {
text-align: center; text-align: center;
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!