| | |
| | | props: { |
| | | phoneNumber: { |
| | | type: String, |
| | | default: '' |
| | | } |
| | | default: "", |
| | | }, |
| | | }, |
| | | data() { |
| | | const randomNum = Math.floor(Math.random() * 11) + 1000; // 内部定义 |
| | | return { |
| | | isCalling: false, |
| | | callStatus: 'idle', // idle, calling, connected, ended |
| | | callStatus: "idle", // idle, calling, connected, ended |
| | | sipStatus: "未连接", |
| | | sipStatusClass: "status-disconnected", |
| | | randomNum = Math.floor(Math.random() * 21) + 1000, // 生成 1000-1020 的随机整数 |
| | | sipConfig: { |
| | | wsUrl: "wss://192.168.100.6:7443", |
| | | sipUri: `${randomNum}`+"@192.168.100.6", |
| | | wsUrl: "wss://192.168.10.124:7443", |
| | | sipUri: `${randomNum}` + "@192.168.10.124", |
| | | password: "Smartor@2023", |
| | | displayName: "Web 小龙", |
| | | }, |
| | |
| | | computed: { |
| | | callStatusText() { |
| | | const statusMap = { |
| | | idle: '准备就绪', |
| | | calling: '呼叫中...', |
| | | connected: '通话中', |
| | | ended: '通话结束' |
| | | idle: "准备就绪", |
| | | calling: "呼叫中...", |
| | | connected: "通话中", |
| | | ended: "通话结束", |
| | | }; |
| | | return statusMap[this.callStatus]; |
| | | }, |
| | |
| | | }, |
| | | callButtonText() { |
| | | return this.isCalling ? "通话中..." : "一键呼叫"; |
| | | } |
| | | }, |
| | | }, |
| | | mounted() { |
| | | sipService.init(this.sipConfig); |
| | |
| | | // 监听通话状态变化 |
| | | sipService.onCallStatusChange = (status) => { |
| | | this.callStatus = status.type; |
| | | this.isCalling = status.type === 'calling' || status.type === 'connected'; |
| | | this.isCalling = status.type === "calling" || status.type === "connected"; |
| | | |
| | | // 通知父组件通话状态变化 |
| | | this.$emit('call-status-change', status); |
| | | this.$emit("call-status-change", status); |
| | | }; |
| | | }, |
| | | methods: { |
| | |
| | | } |
| | | |
| | | try { |
| | | this.callStatus = 'calling'; |
| | | this.callStatus = "calling"; |
| | | this.isCalling = true; |
| | | |
| | | await sipService.makeCall(this.phoneNumber); |
| | | |
| | | } catch (error) { |
| | | console.error("呼叫失败:", error); |
| | | this.callStatus = 'ended'; |
| | | this.callStatus = "ended"; |
| | | this.isCalling = false; |
| | | this.$message.error(`呼叫失败: ${error.message}`); |
| | | } |
| | |
| | | |
| | | endCall() { |
| | | sipService.endCall(); |
| | | this.callStatus = 'ended'; |
| | | this.callStatus = "ended"; |
| | | this.isCalling = false; |
| | | } |
| | | } |
| | | }, |
| | | }, |
| | | }; |
| | | </script> |
| | | |