|
|
@@ -78,6 +78,30 @@
|
|
|
</span>
|
|
|
</el-dialog>
|
|
|
|
|
|
+ <el-dialog :title="this.$t('broadcast.audition')" width="300" :visible="auditionPlay" :show-close="false">
|
|
|
+ <el-row>
|
|
|
+ <el-col v-if="audioName.length > 0" :span="24" >
|
|
|
+ {{ this.$t('broadcast.playing') + audioName[audioIndex] }}
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row>
|
|
|
+ <el-progress :show-text="false" :text-inside="true" :stroke-width="30" :percentage="auditionPositionPercent" status="success"></el-progress>
|
|
|
+ </el-row>
|
|
|
+ <div v-if="audioList.length > 0">
|
|
|
+ <audio
|
|
|
+ :src="audioList[audioIndex]"
|
|
|
+ autoplay="autoplay"
|
|
|
+ ref="audios"
|
|
|
+ style="width: 300px;height:100px;"
|
|
|
+ @ended="audioFinished"
|
|
|
+ >
|
|
|
+ </audio>
|
|
|
+ </div>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button type="primary" @click="streamingStop(true)">{{ this.$t('broadcast.stop') }}</el-button>
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
<!-- 新建广播弹窗 -->
|
|
|
<el-dialog :title.sync="formtitle" :visible.sync="formshow" width="55%">
|
|
|
<div>
|
|
|
@@ -212,6 +236,7 @@ import ListFilter from '@/components/AgGridCustomFilter/ListFilter'
|
|
|
import RadioFilter from '@/components/AgGridCustomFilter/RadioFilter'
|
|
|
import { Janus } from 'janus-gateway'
|
|
|
import * as API_BroadcastFiles from '@/api/calling-broadcastFiles'
|
|
|
+import {playAudio, stopAudio} from "@/api/calling-broadcast";
|
|
|
const serverUrl = domain.serverUrl
|
|
|
const DeviceUrl = domain.DeviceUrl
|
|
|
|
|
|
@@ -245,6 +270,13 @@ export default {
|
|
|
manulPlay: false,
|
|
|
currentRow: null,
|
|
|
|
|
|
+ audioTotalTime: 0,
|
|
|
+ audioTime: 0,
|
|
|
+ audioList: [],
|
|
|
+ audioIndex: 0,
|
|
|
+ auditionPlay: false,
|
|
|
+ audioName: [],
|
|
|
+
|
|
|
tableData: [],
|
|
|
/** 列表参数 */
|
|
|
params: {
|
|
|
@@ -310,7 +342,8 @@ export default {
|
|
|
{ key: this.$t('broadcast.scheduledPlay'), value: 2 }
|
|
|
],
|
|
|
websocket: null,
|
|
|
- scheduledIds: []
|
|
|
+ scheduledIds: [],
|
|
|
+ serverInfo: []
|
|
|
}
|
|
|
},
|
|
|
computed: {
|
|
|
@@ -402,6 +435,12 @@ export default {
|
|
|
buttonType: 'danger',
|
|
|
buttonSize: 'mini'
|
|
|
},
|
|
|
+ // {
|
|
|
+ // onClick: this.playAudio,
|
|
|
+ // label: this.$t('broadcast.play'),
|
|
|
+ // buttonType: 'primary',
|
|
|
+ // buttonSize: 'mini'
|
|
|
+ // } ,
|
|
|
{
|
|
|
onClick: () => {
|
|
|
param.data.playing ? this.stopBroadcast(param.data) : this.playBroadcast(param.data)
|
|
|
@@ -410,7 +449,8 @@ export default {
|
|
|
buttonType: param.data.playing ? 'danger' : 'primary',
|
|
|
buttonSize: 'mini',
|
|
|
disabled: param.data.broadcast_mode !== 1 || !param.data.status
|
|
|
- },{
|
|
|
+ },
|
|
|
+ {
|
|
|
label: this.$t('broadcast.audition'),
|
|
|
buttonSize: 'mini',
|
|
|
buttonType: 'success',
|
|
|
@@ -459,9 +499,7 @@ export default {
|
|
|
]
|
|
|
})
|
|
|
this.getAllFrameGroups()
|
|
|
- if (this.rtcServer === null || this.rtcServer === "") {
|
|
|
- this.getRtcServer()
|
|
|
- }
|
|
|
+ this.getServerInfo()
|
|
|
|
|
|
this.initAuditionWebSocket()
|
|
|
// Janus.init({
|
|
|
@@ -476,18 +514,22 @@ export default {
|
|
|
|
|
|
const _this = this
|
|
|
//每分钟检查一次websocket状态，如果掉线，则重连
|
|
|
- setInterval(function() {
|
|
|
- if (_this.janus === null) {
|
|
|
- if (_this.rtcServer !== null && _this.rtcServer !== "") {
|
|
|
- _this.connect(this.rtcServer)
|
|
|
- } else {
|
|
|
- this.getRtcServer()
|
|
|
+ if (this.serverInfo.voice_type === "rtc") {
|
|
|
+ setInterval(function () {
|
|
|
+ if (_this.janus === null) {
|
|
|
+ if (_this.rtcServer !== null && _this.rtcServer !== "") {
|
|
|
+ _this.connect(this.rtcServer)
|
|
|
+ } else {
|
|
|
+ this.getRtcServer()
|
|
|
+ }
|
|
|
}
|
|
|
- }
|
|
|
- if (_this.websock === null) {
|
|
|
- _this.initAuditionWebSocket()
|
|
|
- }
|
|
|
- }, 60000)
|
|
|
+ if (_this.websock === null) {
|
|
|
+ _this.initAuditionWebSocket()
|
|
|
+ }
|
|
|
+ }, 60000)
|
|
|
+ }
|
|
|
+
|
|
|
+ this.Time()
|
|
|
},
|
|
|
methods: {
|
|
|
windowResize() {
|
|
|
@@ -525,31 +567,55 @@ export default {
|
|
|
this.deleteStreaming(row.id)
|
|
|
},
|
|
|
playBroadcast(row) {
|
|
|
- API_Broadcast.manulStart(row.id).then(res=>{
|
|
|
- const result = res.data
|
|
|
- if (!result.success){
|
|
|
- this.$message({
|
|
|
- type: 'error',
|
|
|
- message: result.message
|
|
|
- })
|
|
|
- } else {
|
|
|
- this.$message({
|
|
|
- type: 'success',
|
|
|
- message: this.$t('broadcast.playbackSuccessful')
|
|
|
- })
|
|
|
- row.playing = true
|
|
|
- this.gridApi.redrawRows()
|
|
|
- this.manulPlay = true
|
|
|
- this.currentRow = row
|
|
|
- }
|
|
|
- })
|
|
|
+ console.log(row)
|
|
|
+ if (this.serverInfo.voice_type === "rtc") {
|
|
|
+ API_Broadcast.manulStart(row.id).then(res => {
|
|
|
+ const result = res.data
|
|
|
+ if (!result.success) {
|
|
|
+ this.$message({
|
|
|
+ type: 'error',
|
|
|
+ message: result.message
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ this.$message({
|
|
|
+ type: 'success',
|
|
|
+ message: this.$t('broadcast.playbackSuccessful')
|
|
|
+ })
|
|
|
+ row.playing = true
|
|
|
+ this.gridApi.redrawRows()
|
|
|
+ this.manulPlay = true
|
|
|
+ this.currentRow = row
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ this.audioTotalTime = 0
|
|
|
+ API_Broadcast.playAudio(row.id, this.$store.getters.partId).then(res => {
|
|
|
+ this.audioTotalTime = res
|
|
|
+ })
|
|
|
+ row.playing = true
|
|
|
+ this.manulPlay = true
|
|
|
+ this.currentRow = row
|
|
|
+ }
|
|
|
},
|
|
|
stopBroadcast(row) {
|
|
|
- row.playing = false
|
|
|
- this.gridApi.redrawRows()
|
|
|
- this.manulPlay = false
|
|
|
- this.currentRow = null
|
|
|
- API_Broadcast.manulStop(this.$store.getters.partId, row.id)
|
|
|
+ console.log(row)
|
|
|
+ if (this.serverInfo.voice_type === "rtc") {
|
|
|
+ row.playing = false
|
|
|
+ this.gridApi.redrawRows()
|
|
|
+ this.manulPlay = false
|
|
|
+ this.currentRow = null
|
|
|
+ API_Broadcast.manulStop(this.$store.getters.partId, row.id)
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ row.playing = false
|
|
|
+ this.manulPlay = false
|
|
|
+ this.currentRow = null
|
|
|
+ this.audioTime = 0
|
|
|
+ this.audioTotalTime = 0
|
|
|
+
|
|
|
+ API_Broadcast.stopAudio(row.id, this.$store.getters.partId)
|
|
|
+ }
|
|
|
},
|
|
|
/**
|
|
|
* 创建广播
|
|
|
@@ -707,14 +773,16 @@ export default {
|
|
|
delete this.formmodel.id
|
|
|
this.formmodel.part_id = this.$store.getters.partId
|
|
|
//判断 janus 是否连接状态
|
|
|
- if (this.janus === null) {
|
|
|
- if (this.rtcServer === null || this.rtcServer === ""){
|
|
|
- this.getRtcServer()
|
|
|
- } else {
|
|
|
- this.connect(this.rtcServer)
|
|
|
+ if (this.serverInfo.voice_type === "rtc") {
|
|
|
+ if (this.janus === null) {
|
|
|
+ if (this.rtcServer === null || this.rtcServer === "") {
|
|
|
+ this.getRtcServer()
|
|
|
+ } else {
|
|
|
+ this.connect(this.rtcServer)
|
|
|
+ }
|
|
|
+ this.$message.error(this.$t('action.saveAgain'))
|
|
|
+ return
|
|
|
}
|
|
|
- this.$message.error(this.$t('action.saveAgain'))
|
|
|
- return
|
|
|
}
|
|
|
|
|
|
API_Broadcast.add(this.formmodel).then(result => {
|
|
|
@@ -1017,47 +1085,107 @@ export default {
|
|
|
}})
|
|
|
},
|
|
|
streamingStart(id) {
|
|
|
- API_Broadcast.auditionStart(id).then(res=>{
|
|
|
- const result = res.data
|
|
|
- if (!result.success){
|
|
|
- this.$message({
|
|
|
- type: 'error',
|
|
|
- message: result.message
|
|
|
- })
|
|
|
- } else {
|
|
|
- this.pluginHandle.send({ message: { request: "watch", id: id } })
|
|
|
- }
|
|
|
- })
|
|
|
+ if (this.serverInfo.voice_type === "rtc") {
|
|
|
+ API_Broadcast.auditionStart(id).then(res => {
|
|
|
+ const result = res.data
|
|
|
+ if (!result.success) {
|
|
|
+ this.$message({
|
|
|
+ type: 'error',
|
|
|
+ message: result.message
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ this.pluginHandle.send({message: {request: "watch", id: id}})
|
|
|
+ }
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ API_Broadcast.getBroadcastFileList(id).then(res => {
|
|
|
+ const filesUri = res.files_uri
|
|
|
+ for (let i = 0; i < filesUri.length; i++) {
|
|
|
+ this.audioList.push(DeviceUrl + filesUri[i])
|
|
|
+ }
|
|
|
+
|
|
|
+ const broadcastFiles = res.broadcast_files
|
|
|
+ for (let i = 0; i < broadcastFiles.length; i++) {
|
|
|
+ this.audioName.push(broadcastFiles[i].file_name)
|
|
|
+ }
|
|
|
+
|
|
|
+ this.auditionPlay = true
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ audioFinished() {
|
|
|
+ if (this.audioIndex < this.audioList.length - 1) {
|
|
|
+ this.audioIndex++
|
|
|
+ } else {
|
|
|
+ this.streamingStop("")
|
|
|
+ }
|
|
|
},
|
|
|
streamingStop(personClose) {
|
|
|
- this.pluginHandle.send({ message: { request: "stop" } })
|
|
|
- this.pluginHandle.hangup()
|
|
|
- this.onCleanup()
|
|
|
- if (personClose) {
|
|
|
- API_Broadcast.auditionStop(this.$store.getters.partId)
|
|
|
+ if (this.serverInfo.voice_type === "rtc") {
|
|
|
+ this.pluginHandle.send({message: {request: "stop"}})
|
|
|
+ this.pluginHandle.hangup()
|
|
|
+ this.onCleanup()
|
|
|
+ if (personClose) {
|
|
|
+ API_Broadcast.auditionStop(this.$store.getters.partId)
|
|
|
+ }
|
|
|
+ this.auditionMsg = null
|
|
|
+ } else {
|
|
|
+ this.$refs.audios.pause()
|
|
|
+ this.auditionPlay = false
|
|
|
+ this.audioIndex = 0
|
|
|
+ this.audioList = []
|
|
|
+ this.audioTotalTime = 0
|
|
|
+ this.audioTime = 0
|
|
|
}
|
|
|
- this.auditionMsg = null
|
|
|
},
|
|
|
onCleanup() {
|
|
|
this.stream = null
|
|
|
},
|
|
|
getRtcServer() {
|
|
|
- API_ServiceInfo.getServiceInfo().then(r => {
|
|
|
- const result = r
|
|
|
- console.log("result", result)
|
|
|
- this.rtcServer = "ws://" + r.rtc_public_ip + ":" + r.rtc_port + "/janus"
|
|
|
+ this.rtcServer = "ws://" + this.serverInfo.rtc_public_ip + ":" + this.serverInfo.rtc_port + "/janus"
|
|
|
|
|
|
- Janus.init({
|
|
|
- debug: false,
|
|
|
- dependencies: Janus.useDefaultDependencies(),
|
|
|
- callback: () => {
|
|
|
- if (this.rtcServer !== null && this.rtcServer !== "") {
|
|
|
- this.connect(this.rtcServer)
|
|
|
- }
|
|
|
+ Janus.init({
|
|
|
+ debug: false,
|
|
|
+ dependencies: Janus.useDefaultDependencies(),
|
|
|
+ callback: () => {
|
|
|
+ if (this.rtcServer !== null && this.rtcServer !== "") {
|
|
|
+ this.connect(this.rtcServer)
|
|
|
}
|
|
|
- })
|
|
|
+ }
|
|
|
})
|
|
|
- }
|
|
|
+ },
|
|
|
+ getServerInfo() {
|
|
|
+ API_ServiceInfo.getServiceInfo().then(response => {
|
|
|
+ this.serverInfo = response;
|
|
|
+ console.log("response", response)
|
|
|
+
|
|
|
+ if (response.voice_type === "rtc") {
|
|
|
+ if (this.rtcServer === null || this.rtcServer === "") {
|
|
|
+ this.getRtcServer()
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ playAudio(row) {
|
|
|
+ API_Broadcast.playAudio(row.id, this.$store.getters.partId).then(res => {
|
|
|
+ this.audioTotalTime = res
|
|
|
+ })
|
|
|
+ },
|
|
|
+ Time() {
|
|
|
+ setInterval(() => {
|
|
|
+ if (this.audioList.length > 0) {
|
|
|
+ this.audioTotalTime = this.$refs.audios.duration
|
|
|
+ }
|
|
|
+ if (this.audioTotalTime !== 0 && !isNaN(this.audioTotalTime)) {
|
|
|
+ this.audioTime += 1
|
|
|
+ this.auditionPositionPercent = this.audioTime / this.audioTotalTime * 100
|
|
|
+ if (this.audioTime >= Math.floor(this.audioTotalTime) || isNaN(this.audioTotalTime)) {
|
|
|
+ this.audioTime = 0
|
|
|
+ this.audioTotalTime = 0
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }, 1000)
|
|
|
+ },
|
|
|
}
|
|
|
}
|
|
|
</script>
|
