| | |
| | | </el-tab-pane> |
| | | <el-tab-pane label="语音对讲" name="broadcast" > |
| | | <div class="trank" style="text-align: center;"> |
| | | <el-button @click="broadcastStatusClick()" :type="getBroadcastStatus()" circle icon="el-icon-microphone" style="font-size: 32px; padding: 24px;margin-top: 24px;"/> |
| | | <el-button @click="broadcastStatusClick()" :type="getBroadcastStatus()" :disabled="broadcastStatus === -2" circle icon="el-icon-microphone" style="font-size: 32px; padding: 24px;margin-top: 24px;"/> |
| | | <p> |
| | | <span v-if="broadcastStatus === -2">正在释放资源</span> |
| | | <span v-if="broadcastStatus === -1">点击开始对讲</span> |
| | | <span v-if="broadcastStatus === 0">等待接通中...</span> |
| | | <span v-if="broadcastStatus === 1">请说话</span> |
| | |
| | | showTimeText: "00:00:00", |
| | | streamInfo: null, |
| | | broadcastRtc: null, |
| | | broadcastStatus: -1, // -1 默认状态 0 等待接通 1 接通成功 |
| | | broadcastStatus: -1, // -2 正在释放资源 -1 默认状态 0 等待接通 1 接通成功 |
| | | }; |
| | | }, |
| | | methods: { |
| | |
| | | url: '/zlm/' +this.mediaServerId+ '/index/api/getMediaInfo?vhost=__defaultVhost__&schema=rtmp&app='+ this.app +'&stream='+ this.streamId |
| | | }).then(function (res) { |
| | | that.tracksLoading = false; |
| | | if (res.data.code == 0 && res.data.online) { |
| | | if (res.data.code == 0 && res.data.tracks) { |
| | | that.tracks = res.data.tracks; |
| | | }else{ |
| | | that.tracksNotLoaded = true; |
| | |
| | | }); |
| | | }, |
| | | getBroadcastStatus() { |
| | | if (this.broadcastStatus == -2) { |
| | | return "primary" |
| | | } |
| | | if (this.broadcastStatus == -1) { |
| | | return "primary" |
| | | } |
| | |
| | | broadcastStatusClick() { |
| | | if (this.broadcastStatus == -1) { |
| | | // 默认状态, 开始 |
| | | this.broadcastStatus = 0 |
| | | // 发起语音对讲 |
| | | this.$axios({ |
| | | method: 'get', |
| | |
| | | this.broadcastStatus = 0; |
| | | }else if (e === "connected") { |
| | | this.broadcastStatus = 1; |
| | | }else { |
| | | }else if (e === "disconnected") { |
| | | this.broadcastStatus = -1; |
| | | } |
| | | }); |
| | |
| | | }); |
| | | }, |
| | | stopBroadcast(){ |
| | | this.broadcastRtc.close() |
| | | this.broadcastStatus = -2; |
| | | this.broadcastRtc = null; |
| | | this.$axios({ |
| | | method: 'get', |
| | |
| | | }).then( (res)=> { |
| | | if (res.data.code == 0) { |
| | | // this.broadcastStatus = -1; |
| | | |
| | | // this.broadcastRtc.close() |
| | | }else { |
| | | this.$message({ |
| | | showClose: true, |