Эх сурвалжийг харах

feat: 多人音视频功能

xsx 1 жил өмнө
parent
commit
9adc57750e

+ 89 - 0
im-uniapp/components/group-rtc-join/group-rtc-join.vue

@@ -0,0 +1,89 @@
+<template>
+	<uni-popup ref="popup" type="center">
+		<uni-popup-dialog mode="base" message="成功消息" :duration="2000" title="是否加入通话?" confirmText="加入"
+			@confirm="onOk">
+			<div class="group-rtc-join">
+				<div class="host-info">
+					<div>发起人</div>
+					<head-image :name="rtcInfo.host.nickName" :url="rtcInfo.host.headImage" :size="80"></head-image>
+				</div>
+				<div class="user-info">
+					<div>{{rtcInfo.userInfos.length+'人正在通话中'}}</div>
+					<scroll-view scroll-x="true" scroll-left="120">
+						<view class="user-list">
+							<view v-for="user in rtcInfo.userInfos" class="user-item">
+								<head-image :name="user.nickName" :url="user.headImage" :size="80"></head-image>
+							</view>
+						</view>
+					</scroll-view>
+				</div>
+			</div>
+		</uni-popup-dialog>
+	</uni-popup>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				rtcInfo: {}
+			}
+		},
+		props: {
+			groupId: {
+				type: Number
+			}
+		},
+		methods: {
+			open(rtcInfo) {
+				this.rtcInfo = rtcInfo;
+				this.$refs.popup.open();
+			},
+			onOk() {
+				let users = this.rtcInfo.userInfos;
+				let mine = this.$store.state.userStore.userInfo;
+				// 加入自己的信息
+				if(!users.find((user)=>user.id==mine.id)){
+					users.push({
+						id: mine.id,
+						nickName: mine.nickName,
+						headImage: mine.headImageThumb,
+						isCamera: false,
+						isMicroPhone: true
+					})
+				}
+				const userInfos = encodeURIComponent(JSON.stringify(users));
+				uni.navigateTo({
+					url: `/pages/chat/chat-group-video?groupId=${this.groupId}&isHost=false
+						&inviterId=${mine.id}&userInfos=${userInfos}`
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.group-rtc-join {
+		width: 100%;
+
+		.host-info {
+			font-size: 16px;
+			padding: 10px;
+		}
+
+		.user-info {
+			font-size: 16px;
+			padding: 10px;
+		}
+
+		.user-list {
+			display: flex;
+			align-items: center;
+			height: 90rpx;
+
+			.user-item {
+				padding: 3rpx;
+			}
+		}
+	}
+</style>

+ 0 - 2
im-uniapp/store/chatStore.js

@@ -51,7 +51,6 @@ export default {
 					}
 				})
 			})
-			console.log(cacheChats.length)
 		},
 		openChat(state, chatInfo) {
 			let chats = this.getters.findChats();
@@ -295,7 +294,6 @@ export default {
 			});
 			// 将消息一次性装载回来
 			state.chats = cacheChats;
-			console.log(cacheChats.length)
 			this.commit("saveToStorage");
 		},
 		saveToStorage(state) {

+ 32 - 0
im-uniapp/store/configStore.js

@@ -0,0 +1,32 @@
+import http from '../common/request'
+
+export default {
+	state: {
+		webrtc: {}
+	},
+	mutations: {
+		setConfig(state, config) {
+			state.webrtc = config.webrtc; 
+		},
+		clear(state){
+			state.webrtc = {};
+		}
+	},
+	actions:{
+		loadConfig(context){
+			return new Promise((resolve, reject) => {
+				http({
+					url: '/system/config',
+					method: 'GET'
+				}).then((config) => {
+					console.log("系统配置",config)
+					context.commit("setConfig",config);
+					resolve();
+				}).catch((res)=>{
+					reject(res);
+				});
+			})
+		}
+	}
+	
+}