From 1441312097a12b8ebcd10679674f4a035a7f8039 Mon Sep 17 00:00:00 2001 From: liqi Date: Thu, 4 Dec 2025 12:46:15 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E5=90=84=E7=A7=8D=E5=9C=BA?= =?UTF-8?q?=E6=99=AF=E9=9F=B3=E8=A7=86=E9=A2=91=E9=80=9A=E8=AF=9D=E7=9A=84?= =?UTF-8?q?bug?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- index.html | 2 +- package.json | 1 + pnpm-lock.yaml | 9 + src/App.vue | 49 ++- src/api/modules/contact.ts | 1 + src/components/call/CallWindow.vue | 155 ++++--- src/components/chat/MessageList.vue | 51 ++- src/components/common/ConfirmModal.vue | 13 +- src/composables/useWebRTC.ts | 561 +++++++++++++----------- src/main.ts | 3 +- src/stores/conversation.ts | 6 +- src/stores/webrtc.ts | 64 +++ src/utils/storage.ts | 14 + src/views/chat/ChatView.vue | 183 ++++++-- src/views/contact/ContactDetail.vue | 64 ++- src/views/contact/ContactDetailCard.vue | 69 ++- 16 files changed, 887 insertions(+), 358 deletions(-) create mode 100644 src/stores/webrtc.ts diff --git a/index.html b/index.html index 31f2297..3365b07 100644 --- a/index.html +++ b/index.html @@ -6,7 +6,7 @@ NL-IM 即时通讯系统 - +
diff --git a/package.json b/package.json index 9b7b0c2..6dc44ac 100644 --- a/package.json +++ b/package.json @@ -9,6 +9,7 @@ }, "dependencies": { "@ant-design/icons-vue": "^7.0.0", + "@fortawesome/fontawesome-free": "^7.1.0", "axios": "^1.6.0", "pinia": "^2.1.0", "vue": "^3.4.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index f82d864..d52b1b7 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -11,6 +11,9 @@ importers: '@ant-design/icons-vue': specifier: ^7.0.0 version: 7.0.1(vue@3.5.25(typescript@5.9.3)) + '@fortawesome/fontawesome-free': + specifier: ^7.1.0 + version: 7.1.0 axios: specifier: ^1.6.0 version: 1.13.2 @@ -228,6 +231,10 @@ packages: cpu: [x64] os: [win32] + '@fortawesome/fontawesome-free@7.1.0': + resolution: {integrity: sha512-+WxNld5ZCJHvPQCr/GnzCTVREyStrAJjisUPtUxG5ngDA8TMlPnKp6dddlTpai4+1GNmltAeuk1hJEkBohwZYA==} + engines: {node: '>=6'} + '@jridgewell/gen-mapping@0.3.13': resolution: {integrity: sha512-2kkt/7niJ6MgEPxF0bYdQ6etZaA+fQvDcLKckhy1yIQOzaoKjBBjSj63/aLVjYE3qhRt5dvM+uUyfCg6UKCBbA==} @@ -1265,6 +1272,8 @@ snapshots: '@esbuild/win32-x64@0.21.5': optional: true + '@fortawesome/fontawesome-free@7.1.0': {} + '@jridgewell/gen-mapping@0.3.13': dependencies: '@jridgewell/sourcemap-codec': 1.5.5 diff --git a/src/App.vue b/src/App.vue index e65c650..8583746 100644 --- a/src/App.vue +++ b/src/App.vue @@ -1,9 +1,56 @@ +import CallWindow from '@/components/call/CallWindow.vue' +import { useWebRTCStore } from '@/stores/webrtc' +import { useChatStore } from '@/stores/chat' +const webrtcStore = useWebRTCStore() +const chatStore = useChatStore() +const isMobile = ref(window.innerWidth < 768) + +// --- 关键修复:去除 .value --- +// Pinia/Vue 的 reactive 系统会自动解包 Store 中的 refs。 +// 因此 webrtcStore.webrtc.localStream 已经是 MediaStream 对象或 null,而不是 Ref。 +// 之前的报错是因为尝试访问 null.value。 +const localStream = computed(() => { + if (!webrtcStore.webrtc) return null + return webrtcStore.webrtc.localStream ?? null +}) + +const remoteStream = computed(() => { + if (!webrtcStore.webrtc) return null + return webrtcStore.webrtc.remoteStream ?? null +}) + +const handleResize = () => { + isMobile.value = window.innerWidth < 768 +} + +onMounted(() => { + window.addEventListener('resize', handleResize) +}) + +onUnmounted(() => { + window.removeEventListener('resize', handleResize) +}) + diff --git a/src/api/modules/contact.ts b/src/api/modules/contact.ts index 2cccd8a..0475ab6 100644 --- a/src/api/modules/contact.ts +++ b/src/api/modules/contact.ts @@ -66,6 +66,7 @@ export async function getContactDetail(id: string): Promise { id: response.contact.id?.toString() || response.contact.contact_id, user_id: response.contact.contact_id || response.contact.user_id, contact_user_id: response.contact.contact_id, + room_id: response.contact.room_id, // 确保 room_id 被正确传递 user: response.user, } as Contact } diff --git a/src/components/call/CallWindow.vue b/src/components/call/CallWindow.vue index 3184fcf..a35c515 100644 --- a/src/components/call/CallWindow.vue +++ b/src/components/call/CallWindow.vue @@ -6,25 +6,25 @@ :class="windowClass" :style="dragStyle" > - +
{{ call.type === 'video' ? '视频通话' : '语音通话' }} - {{ formatDuration(call.duration) }}
-