|  |  | 
 |  |  |     <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="border-card" v-model="activePlayer" @tab-click="changePlayer" v-if="Object.keys(this.player).length > 1"> | 
 |  |  |         <el-tabs type="card" :stretch="true" v-model="activePlayer" @tab-click="changePlayer" v-if="Object.keys(this.player).length > 1"> | 
 |  |  |           <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> | 
 |  |  | 
 |  |  |             }; | 
 |  |  |         } | 
 |  |  |     }, | 
 |  |  |     created() {}, | 
 |  |  |     created() { | 
 |  |  |       console.log(this.player) | 
 |  |  |       if (Object.keys(this.player).length === 1) { | 
 |  |  |         this.activePlayer = Object.keys(this.player)[0] | 
 |  |  |       } | 
 |  |  |     }, | 
 |  |  |     data() { | 
 |  |  |         return { | 
 |  |  |             video: 'http://lndxyj.iqilu.com/public/upload/2019/10/14/8c001ea0c09cdc59a57829dabc8010fa.mp4', | 
 |  |  | 
 |  |  |             activePlayer: "jessibuca", | 
 |  |  |             // 如何你只是用一种播放器,直接注释掉不用的部分即可 | 
 |  |  |             player: { | 
 |  |  |               // jessibuca : ["ws_flv", "wss_flv"], | 
 |  |  |               jessibuca : ["ws_flv", "wss_flv"], | 
 |  |  |               webRTC: ["rtc", "rtc"], | 
 |  |  |             }, | 
 |  |  |             videoHistory: { | 
 |  |  | 
 |  |  |                     url: '/api/playback/start/' + this.deviceId + '/' + this.channelId + '?startTime=' + row.startTime + '&endTime=' + | 
 |  |  |                         row.endTime | 
 |  |  |                 }).then(function (res) { | 
 |  |  |                     var streamInfo = res.data; | 
 |  |  |                     that.app = streamInfo.app; | 
 |  |  |                     that.streamId = streamInfo.stream; | 
 |  |  |                     that.mediaServerId = streamInfo.mediaServerId; | 
 |  |  |                     that.ssrc = streamInfo.ssrc; | 
 |  |  |                     that.videoUrl = that.getUrlByStreamInfo(streamInfo); | 
 |  |  |                     that.streamInfo = res.data; | 
 |  |  |                     that.app = that.streamInfo.app; | 
 |  |  |                     that.streamId = that.streamInfo.stream; | 
 |  |  |                     that.mediaServerId = that.streamInfo.mediaServerId; | 
 |  |  |                     that.ssrc = that.streamInfo.ssrc; | 
 |  |  |                     that.videoUrl = that.getUrlByStreamInfo(); | 
 |  |  |                     that.recordPlay = true; | 
 |  |  |                 }); | 
 |  |  |             } |