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) }}
-