111

src/views/im/chat/index.vue

@@ -154,7 +154,7 @@
           <div>拍摄</div>
         </div>
         <div class="tool-btn">
-          <svg-icon class="tool-icon" name="yyth" @click="startAudioOnline"/>
+          <svg-icon class="tool-icon" name="yyth" @click="startAudioOnline" />
           <div>语音通话</div>
         </div>
         <div class="tool-btn">
@@ -168,7 +168,7 @@
       </div>
     </div>
     <CallController
-      :visible="rtcStore.imSate.videoCallModal || inCall"
+      :visible="rtcStore.imSate.videoCallModal"
       :inCall="inCall"
       :callName="rtcStore.imSate.callName"
       :callAvatar="rtcStore.imSate.callAvatar"
@@ -443,13 +443,14 @@ const beforeRead = (file) => {
 //  创建呼叫:开启语音电话: 调试用，正式逻辑读src/views/im/hook/messagesHook.js
 // ==== 1. 发起语音通话 ====
 const startAudioOnline = async () => {
-  inCall.value = true
-  rtcStore.imSate.callAvatar = wsStore.toUserInfo.avatar
+  inCall.value = true;
+  rtcStore.imSate.videoCallModal = true;
+  rtcStore.imSate.callAvatar = wsStore.toUserInfo.avatar;
   wsStore.sendMessage({
     messageType: MESSAGE_TYPE_USER, // 单聊消息
     contentType: Constant.DIAL_AUDIO_ONLINE,
     type: Constant.MESSAGE_TRANS_TYPE,
-    avatar: walletStore.avatar
+    avatar: walletStore.avatar,
   });
 };
 // ==== 2. 接听来电 ====
@@ -468,7 +469,6 @@ async function acceptCall() {
     // 这里你可以加上开启 WebRTC 连接或媒体流处理逻辑
     // 例如调用 rtcStore 的方法，启动本地音频/视频流
     // await rtcStore.startLocalAudio();
-
   } catch (error) {
     console.error("接听失败", error);
     // 如果接听失败，考虑重置状态或提示用户
@@ -476,7 +476,6 @@ async function acceptCall() {
   }
 }
 
-
 // ==== 3. 拒接来电 ====
 function rejectCall() {
   wsStore.sendMessage({
@@ -495,6 +494,11 @@ function hangupCall() {
   // 隐藏弹窗
   rtcStore.imSate.videoCallModal = false;
   inCall.value = false;
+  wsStore.sendMessage({
+    messageType: MESSAGE_TYPE_USER, // 单聊消息
+    contentType: Constant.CANCELL_AUDIO_ONLINE,
+    type: Constant.MESSAGE_TRANS_TYPE,
+  });
 }
 
 // 时间格式化

src/views/im/components/CallController/index.vue

@@ -20,8 +20,7 @@
     </div>
   </template>
   
-  <script setup>
-  import { defineProps, computed } from "vue";
+  <script setup> 
   
   const props = defineProps({
     visible: Boolean,           // 是否显示弹窗

src/views/im/hook/messagesHook.js

@@ -92,7 +92,7 @@ export const handleMessageHook = (message, state) => {
   ) {
     console.log("音频在线：取消")
     const rtcStore = useWebRTCStore();
-    rtcStore.videoCallModal = false;
+    rtcStore.imSate.videoCallModal = false; 
     return;
   }
   // 音频在线：拒接
@@ -102,7 +102,7 @@ export const handleMessageHook = (message, state) => {
   ) {
     console.log("音频在线：拒接")
     const rtcStore = useWebRTCStore();
-    rtcStore.videoCallModal = false;
+    rtcStore.imSate.videoCallModal = false;
     return;
   }
   // 音频在线：接听
@@ -182,6 +182,16 @@ export const handleMessageHook = (message, state) => {
   }
 };
 
+
+// 消息回调
+const messageCallback = (contentType, state)=>{
+ state.sendMessage({
+    contentType, // 消息内容类型
+    content: "callback", // 
+    type: Constant.MESSAGE_TRANS_TYPE,
+  });
+}
+
 // 创建呼叫:开启语音电话
 const startAudioOnline = (video, state) => { 
   const rtcStore = useWebRTCStore();