| | |
| | | <div id="devicePlayer" v-loading="isLoging"> |
| | | |
| | | <el-dialog title="视频播放" top="0" :close-on-click-modal="false" :visible.sync="showVideoDialog" @close="close()"> |
| | | <!-- <LivePlayer v-if="showVideoDialog" ref="videoPlayer" :videoUrl="videoUrl" :error="videoError" :message="videoError" :hasaudio="hasaudio" fluent autoplay live></LivePlayer> --> |
| | | <div style="width: 100%; height: 100%"> |
| | | <el-tabs type="card" :stretch="true" v-model="activePlayer" @tab-click="changePlayer" v-if="Object.keys(this.player).length > 1"> |
| | | <!-- <el-tab-pane label="LivePlayer" name="livePlayer">--> |
| | | <!-- <LivePlayer v-if="showVideoDialog" ref="livePlayer" :visible.sync="showVideoDialog" :videoUrl="videoUrl" :error="videoError" :message="videoError" :hasaudio="hasAudio" fluent autoplay live></LivePlayer>--> |
| | | <!-- </el-tab-pane>--> |
| | | <el-tab-pane label="Jessibuca" name="jessibuca"> |
| | | <jessibucaPlayer v-if="activePlayer === 'jessibuca'" ref="jessibuca" :visible.sync="showVideoDialog" :videoUrl="videoUrl" :error="videoError" :message="videoError" height="100px" :hasAudio="hasAudio" fluent autoplay live ></jessibucaPlayer> |
| | | </el-tab-pane> |
| | |
| | | <el-dropdown-item :command="streamInfo.rtc"> |
| | | <el-tag >RTC:</el-tag> |
| | | <span>{{ streamInfo.rtc }}</span> |
| | | </el-dropdown-item> |
| | | <el-dropdown-item :command="streamInfo.rtcs"> |
| | | <el-tag >RTCS:</el-tag> |
| | | <span>{{ streamInfo.rtcs }}</span> |
| | | </el-dropdown-item> |
| | | <el-dropdown-item :command="streamInfo.rtmp"> |
| | | <el-tag >RTMP:</el-tag> |
| | |
| | | |
| | | <script> |
| | | import rtcPlayer from '../dialog/rtcPlayer.vue' |
| | | // import LivePlayer from '@liveqing/liveplayer' |
| | | import LivePlayer from '@liveqing/liveplayer' |
| | | // import player from '../dialog/easyPlayer.vue' |
| | | import jessibucaPlayer from '../common/jessibuca.vue' |
| | | import recordDownload from '../dialog/recordDownload.vue' |
| | |
| | | name: 'devicePlayer', |
| | | props: {}, |
| | | components: { |
| | | jessibucaPlayer, rtcPlayer, recordDownload, |
| | | LivePlayer, jessibucaPlayer, rtcPlayer, recordDownload, |
| | | }, |
| | | computed: { |
| | | getPlayerShared: function () { |
| | |
| | | // 如何你只是用一种播放器,直接注释掉不用的部分即可 |
| | | player: { |
| | | jessibuca : ["ws_flv", "wss_flv"], |
| | | webRTC: ["rtc", "rtc"], |
| | | livePlayer : ["ws_flv", "wss_flv"], |
| | | webRTC: ["rtc", "rtcs"], |
| | | }, |
| | | videoHistory: { |
| | | date: '', |
| | |
| | | if (tab.name === "codec") { |
| | | this.$axios({ |
| | | method: 'get', |
| | | url: '/zlm/' +this.mediaServerId+ '/index/api/getMediaInfo?vhost=__defaultVhost__&schema=rtmp&app='+ this.app +'&stream='+ this.streamId |
| | | url: '/zlm/' +this.mediaServerId+ '/index/api/getMediaInfo?vhost=__defaultVhost__&schema=rtsp&app='+ this.app +'&stream='+ this.streamId |
| | | }).then(function (res) { |
| | | that.tracksLoading = false; |
| | | if (res.data.code == 0 && res.data.tracks) { |
| | |
| | | changePlayer: function (tab) { |
| | | console.log(this.player[tab.name][0]) |
| | | this.activePlayer = tab.name; |
| | | this.videoUrl = this.streamInfo[this.player[tab.name][0]] |
| | | this.videoUrl = this.getUrlByStreamInfo() |
| | | console.log(this.videoUrl) |
| | | }, |
| | | openDialog: function (tab, deviceId, channelId, param) { |
| | | if (this.showVideoDialog) { |
| | | return; |
| | | } |
| | | this.tabActiveName = tab; |
| | | this.channelId = channelId; |
| | | this.deviceId = deviceId; |