import { defineStore } from 'pinia'; import consola from 'consola'; import { genTestUserSig } from '/@/utils/generateTestUserSig'; import type { RemoteStream } from 'trtc-js-sdk'; import sortBy from 'lodash-es/sortBy'; interface RtcState { socket: Nullable; socketId: string; showDaoGou: boolean; sdkAppId: string; userId: string; roomId: string; role: 'leader' | 'customer'; secretKey: string; userSig: string; audioDeviceId: string; videoDeviceId: string; cameraList: MediaDeviceInfo[]; microphoneList: MediaDeviceInfo[]; logs: any[]; isJoined: boolean; isPublished: boolean; isShared: boolean; remoteStreams: RemoteStream[]; // invitedRemoteStreams: any[], avatar: Nullable; nickname: string; mode: string; chatList: ChatContentType[]; memberList: UserInfoType[]; audioMuted: boolean; inputStatus: boolean; currentSession: Nullable; baseDialog: BaseDialog; ifBaseDialog: boolean; baseDiaLogCallback?: () => void; } interface DeviceListParams { cameraItems: MediaDeviceInfo[]; microphoneItems: MediaDeviceInfo[]; } export interface ChatContentType { role: RoleType; mode: string; Nickname: Nullable; UserId: string; text: string; } export interface UserInfoType { Avatar: string; Id: string; InTime: string; IsClient: boolean; IsMuted: boolean; IsWords: boolean; JoinTime: string; Nickname: string; Role: RoleType; RoomId: string; UserId: string; text?: string; order: number; } export type RoleType = 'leader' | 'customer'; export interface SocketParams { userId: string; roomId: string; role: RoleType; avatar: string; nickname: string; mode: string; } interface BaseDialog { title: string; desc: string; okTxt: string; closeTxt: string; isSingle?: boolean; } const defaultBaseDialog: BaseDialog = { title: '温馨提示', desc: '', okTxt: '确定', closeTxt: '取消', }; export const useRtcStore = defineStore({ id: 'rtc', state: (): RtcState => ({ socket: null, socketId: '', showDaoGou: false, sdkAppId: '1400685498', nickname: '', userId: '', roomId: '', role: 'customer', secretKey: '7500f8938c46c5d3c64621ae7826905eec9723bf218fbcf121242e056a4ee14f', userSig: 'eJwtzcsOgjAQBdB-6RaDU2jLI3EhsrHRBdGNK2Po0IyvNAWJxvjvEmA5597c*bLj7hD26FnOohDYYrzJ4LOjhkZ*tejPd7wY9EJwnsV8brXmdnGODMu5AEggExBNSUcPHFQpnkopIJkU34784ApECjBvkB1e8MLJfWyLOAis06Wut4b0tVdL77RVTb35dGXby6o6rVfs9wdhLDRy', audioDeviceId: '', videoDeviceId: '', cameraList: [], microphoneList: [], logs: [], isJoined: false, isPublished: false, isShared: false, remoteStreams: [], // invitedRemoteStreams: [], avatar: null, mode: '', chatList: [], memberList: [], audioMuted: true, inputStatus: true, currentSession: null, baseDialog: defaultBaseDialog, ifBaseDialog: false, }), persist: [ { storage: localStorage, paths: ['memberList'], }, { storage: sessionStorage, paths: ['userId'], }, ], getters: { checkUserInMemberList() { return (userId: string) => this.memberList.find((item) => item.UserId === userId); }, isLeader(): boolean { return this.role === 'leader'; }, isMe() { return (userId: string) => this.userId === userId; }, genUserSig() { const { userSig } = genTestUserSig({ sdkAppId: parseInt(this.sdkAppId, 10), userId: this.userId, secretKey: this.secretKey, }); return userSig; }, isUserInRemoteStream() { return (userId: string) => { return this.remoteStreams.some((item) => item.getUserId() === userId); }; }, }, actions: { showBaseDialog(dialog: BaseDialog, callback?: () => void): void { this.ifBaseDialog = true; this.baseDialog = dialog; this.baseDiaLogCallback = callback; }, hideBaseDialog() { this.ifBaseDialog = false; this.baseDialog = defaultBaseDialog; }, setSocketParams(params: SocketParams): void { this.avatar = params.avatar; this.roomId = params.roomId; this.userId = params.userId; this.nickname = params.nickname; this.role = params.role; if (!['leader', 'customer'].includes(params.role)) { consola.info({ message: '角色参数有误', level: 0, tag: 'role', }); this.role = 'customer'; } }, setNickName(nickname: string) { this.nickname = nickname; }, setAvatar(payload: string) { this.avatar = payload; localStorage.setItem('leaderAvatar', payload || ''); }, setSocket(payload: SocketIOClient.Socket) { this.socket = payload; }, setShowDaoGou(payload: boolean) { this.showDaoGou = payload; }, setUserId(payload: string) { this.userId = payload; }, setRoomId(payload: string) { this.roomId = payload; }, setRole(payload: RoleType) { this.role = payload; }, setDeviceList(payload: DeviceListParams) { this.cameraList = payload.cameraItems; this.microphoneList = payload.microphoneItems; }, setVideoDeviceId(payload: string) { this.videoDeviceId = payload; }, setAudioDeviceId(payload: string) { this.audioDeviceId = payload; }, setIsJoined(payload: boolean) { this.isJoined = payload; }, setIsPublished(payload: boolean) { this.isPublished = payload; }, addToChatList(content: ChatContentType) { this.chatList.push(content); }, setMemberList(members: UserInfoType[]) { const memberList = members.reduce((prev: UserInfoType[], current: UserInfoType, index) => { if (prev.findIndex((ele: UserInfoType) => ele.UserId === current.UserId) === -1) { // console.log(current); current.order = index > 1 ? index : 2; if (current.Role === 'leader') { current.order = 0; } if (current.UserId === this.userId) { current.order = 1; this.currentSession = current; } prev.push(current); } return prev; }, []); const sortList = sortBy(memberList, ['order', 'UserId'], ['asc', 'asc']); console.log('sortList', sortList); this.memberList = sortList; }, clearMemberList(): void { this.memberList = []; this.userId = ''; }, updateMemberDatabyId(UserId: string, data: Partial) { const updateIndex = this.memberList.findIndex((member) => member.UserId === UserId); if (updateIndex > -1) { this.memberList[updateIndex] = Object.assign({}, this.memberList[updateIndex], data); //单点更新并是当事人也更一份数据 if (UserId === this.userId) { this.currentSession = this.memberList[updateIndex]; } } }, mute() { this.setMute(false); }, unmute() { this.setMute(true); }, setMute(mute: boolean) { this.audioMuted = mute; this.updateMemberDatabyId(this.userId, { IsMuted: mute, }); }, setinputStatus(status: boolean) { this.inputStatus = status; }, pushRemoteStreams(stream: RemoteStream) { this.remoteStreams.push(stream); }, removeRemoteStreams(id: string) { const existStreamIndex = this.remoteStreams.findIndex((stream) => stream.getId() === id); if (existStreamIndex > -1) { this.remoteStreams.splice(existStreamIndex, 1); } }, }, });