feat:语音通话更新

张含笑

2026-01-15 a81dcecdd4313b0ce4c486211e8f4b5d6bfb9bb1

feat:语音通话更新

 applications/mobile-web-view/src/appPages/voiceCallDetail/index.vue

@@ -1,38 +1,39 @@
<template>
    <div class="call-container">
      <div class="content-wrapper">
        <div class="input-group">
            <div class="input-item">
                <span class="input-label">我的 userId：</span>
                <input v-model="uid" class="input-field" />
            </div>
		  
            <div class="input-item">
                <span class="input-label">对方 userId：</span>
                <input v-model="peerUid" class="input-field" />
            </div>
        </div>
<!--        <div class="input-group">-->
<!--            <div class="input-item">-->
<!--                <span class="input-label">我的 userId：</span>-->
<!--                <input v-model="uid" class="input-field" />-->
<!--            </div>-->
<!--          -->
<!--            <div class="input-item">-->
<!--                <span class="input-label">对方 userId：</span>-->
<!--                <input v-model="peerUid" class="input-field" />-->
<!--            </div>-->
<!--        </div>-->
  
        <div class="button-group" v-if="false">
            <button @click="connectWS" :disabled="connected" class="btn btn-connect">连接WS</button>
        </div>
      <!--  头像-->
            <div class="contactAvatar">
                <img :src="defaultAvatar" alt=""></img>
            </div>
         <div class="contactAvatar">
             <img :src="defaultAvatar" alt=""></img>
         </div>
         <div class="status-group">
<!--            <strong class="status-text">状态：<span :style="{color: getStateColor(state)}">{{ state }}</span></strong>-->
            <strong v-if="state==='in-call'" class="status-text">通话时长：{{ durationText }}</strong>
        </div>
        <div class="button-group">
            <button v-if="false" @click="requestCall" :disabled="!connected || state!=='idle'" class="btn btn-call">呼叫</button>
          
            <button v-if="state==='ringing'" @click="acceptCall" class="btn btn-accept">接听</button>
            <button v-if="state==='ringing'" @click="rejectCall" class="btn btn-reject">拒绝</button>
          
            <button @click="hangup" :disabled="!connected || (state!=='calling' && state!=='in-call')" class="btn btn-hangup">挂断</button>
            <button v-if="state==='calling' || state==='in-call'" @click="hangup" class="btn btn-hangup">挂断</button>
        </div>
  
        <div class="status-group">
<!--            <strong class="status-text">状态：<span :style="{color: getStateColor(state)}">{{ state }}</span></strong>-->
            <strong v-if="state==='in-call'" class="status-text">通话时长：{{ durationText }}</strong>
        </div>

      </div>
  
<!--      <div class="tip-message">-->
@@ -410,6 +411,13 @@
    offeredByPeer = false
    lastOfferSdp = null
    state.value = 'idle'
	
    // 返回上一页（uni-app的语音通话列表页面）
    if (window.uni) {
      window.uni.navigateBack()
    } else {
      log('❌ uni对象不存在，无法返回上一页')
    }
  }
  
  async function startOffer() {
@@ -478,6 +486,13 @@
    lastOfferSdp = null
  
    state.value = 'idle'
	
    // 返回上一页（uni-app的语音通话列表页面）
    if (window.uni) {
      window.uni.navigateBack()
    } else {
      log('❌ uni对象不存在，无法返回上一页')
    }
}

onMounted(() => {
@@ -593,6 +608,8 @@
    .status-text {
        font-size: 16px;
        color: #333;
        text-align: center;
        margin-bottom: 50px;
    }

    .tip-message {