rtc.ts 6.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229
  1. import { defineStore } from 'pinia';
  2. import consola from 'consola'
  3. import { genTestUserSig } from '/@/utils/generateTestUserSig'
  4. import type { RemoteStream } from "trtc-js-sdk";
  5. import sortBy from 'lodash-es/sortBy'
  6. import { object } from 'vue-types';
  7. interface RtcState {
  8. socket: Nullable<SocketIOClient.Socket>,
  9. showDaoGou: boolean,
  10. sdkAppId: string,
  11. userId: string,
  12. roomId: string,
  13. role: 'leader' | 'customer'
  14. secretKey: string
  15. userSig: string
  16. audioDeviceId: string,
  17. videoDeviceId: string,
  18. cameraList: MediaDeviceInfo[],
  19. microphoneList: MediaDeviceInfo[],
  20. logs: any[],
  21. isJoined: boolean,
  22. isPublished: boolean,
  23. isShared: boolean,
  24. remoteStreams: RemoteStream[],
  25. // invitedRemoteStreams: any[],
  26. avatar: Nullable<string>,
  27. nickname: Nullable<string>,
  28. mode: string,
  29. chatList: ChatContentType[],
  30. memberList: UserInfoType[],
  31. audioMuted: boolean
  32. }
  33. interface DeviceListParams {
  34. cameraItems: MediaDeviceInfo[],
  35. microphoneItems: MediaDeviceInfo[],
  36. }
  37. export interface ChatContentType {
  38. role: RoleType,
  39. mode: string,
  40. Nickname: Nullable<string>,
  41. UserId: string,
  42. text: string,
  43. }
  44. export interface UserInfoType {
  45. Avatar: string
  46. Id: string
  47. InTime: string
  48. IsClient: boolean
  49. IsMuted: boolean
  50. IsWords: boolean
  51. JoinTime: string
  52. Nickname: string
  53. Role: RoleType
  54. RoomId: string
  55. UserId: string
  56. text?: string
  57. order: number
  58. }
  59. export type RoleType = 'leader' | 'customer'
  60. export interface SocketParams {
  61. userId: string
  62. roomId: string
  63. role: RoleType
  64. avatar: string
  65. nickname: string
  66. mode: string
  67. }
  68. export const useRtcStore = defineStore({
  69. id: 'rtc',
  70. state: (): RtcState => ({
  71. socket: null,
  72. showDaoGou: false,
  73. sdkAppId: "1400685498",
  74. nickname: '',
  75. userId: '',
  76. roomId: '',
  77. role: 'customer',
  78. secretKey: '7500f8938c46c5d3c64621ae7826905eec9723bf218fbcf121242e056a4ee14f',
  79. userSig: 'eJwtzcsOgjAQBdB-6RaDU2jLI3EhsrHRBdGNK2Po0IyvNAWJxvjvEmA5597c*bLj7hD26FnOohDYYrzJ4LOjhkZ*tejPd7wY9EJwnsV8brXmdnGODMu5AEggExBNSUcPHFQpnkopIJkU34784ApECjBvkB1e8MLJfWyLOAis06Wut4b0tVdL77RVTb35dGXby6o6rVfs9wdhLDRy',
  80. audioDeviceId: '',
  81. videoDeviceId: '',
  82. cameraList: [],
  83. microphoneList: [],
  84. logs: [],
  85. isJoined: false,
  86. isPublished: false,
  87. isShared: false,
  88. remoteStreams: [],
  89. // invitedRemoteStreams: [],
  90. avatar: null,
  91. mode: '',
  92. chatList: [],
  93. memberList: [],
  94. audioMuted: true
  95. }),
  96. getters: {
  97. isLeader(): boolean {
  98. return this.role === 'leader'
  99. },
  100. isMe() {
  101. return (userId: string) => this.userId === userId
  102. },
  103. genUserSig() {
  104. const { userSig } = genTestUserSig({
  105. sdkAppId: parseInt(this.sdkAppId, 10),
  106. userId: this.userId,
  107. secretKey: this.secretKey,
  108. });
  109. return userSig
  110. },
  111. isUserInRemoteStream() {
  112. return (userId: string) => {
  113. return this.remoteStreams.some(item => item.getUserId() === userId)
  114. }
  115. }
  116. },
  117. actions: {
  118. setSocketParams(params: SocketParams): void {
  119. this.avatar = params.avatar
  120. this.roomId = params.roomId
  121. this.userId = params.userId
  122. this.nickname = params.nickname
  123. this.role = params.role
  124. if (!['leader', 'customer'].includes(params.role)) {
  125. consola.info({
  126. message: '角色参数有误',
  127. level: 0,
  128. tag: 'role'
  129. })
  130. this.role = 'customer'
  131. }
  132. },
  133. setAvatar(payload: string) {
  134. this.avatar = payload
  135. localStorage.setItem('leaderAvatar', payload || '')
  136. },
  137. setSocket(payload: SocketIOClient.Socket) {
  138. this.socket = payload
  139. },
  140. setShowDaoGou(payload: boolean) {
  141. this.showDaoGou = payload
  142. },
  143. setUserId(payload: string) {
  144. this.userId = payload
  145. },
  146. setRoomId(payload: string) {
  147. this.roomId = payload
  148. },
  149. setRole(payload: RoleType) {
  150. this.role = payload
  151. },
  152. setDeviceList(payload: DeviceListParams) {
  153. this.cameraList = payload.cameraItems
  154. this.microphoneList = payload.microphoneItems
  155. },
  156. setVideoDeviceId(payload: string) {
  157. this.videoDeviceId = payload
  158. },
  159. setAudioDeviceId(payload: string) {
  160. this.audioDeviceId = payload
  161. },
  162. setIsJoined(payload: boolean) {
  163. this.isJoined = payload
  164. },
  165. setIsPublished(payload: boolean) {
  166. this.isPublished = payload
  167. },
  168. addToChatList(content: ChatContentType) {
  169. this.chatList.push(content)
  170. },
  171. setMemberList(members: UserInfoType[]) {
  172. const memberList = members.reduce((prev: UserInfoType[], current: UserInfoType, index) => {
  173. if (prev.findIndex((ele: UserInfoType) => ele.UserId === current.UserId) === -1) {
  174. // console.log(current);
  175. current.order = index > 1 ? index : 2
  176. if (current.Role === 'leader') {
  177. current.order = 0
  178. }
  179. if (current.Role === this.userId) {
  180. current.order = 1
  181. }
  182. prev.push(current);
  183. }
  184. return prev;
  185. }, []);
  186. const sortList = sortBy(memberList, ['order', 'UserId'], ['asc', 'asc'])
  187. console.log('sortList', sortList)
  188. this.memberList = sortList
  189. },
  190. updateMemberDatabyId(UserId: string, data: Partial<UserInfoType>) {
  191. const updateIndex = this.memberList.findIndex(member => member.UserId === UserId)
  192. if (updateIndex > -1) {
  193. this.memberList[updateIndex] = Object.assign({}, this.memberList[updateIndex], data)
  194. }
  195. },
  196. mute() {
  197. this.audioMuted = true
  198. },
  199. unmute() {
  200. this.audioMuted = false
  201. },
  202. pushRemoteStreams(stream: RemoteStream) {
  203. this.remoteStreams.push(stream)
  204. },
  205. removeRemoteStreams(id: string) {
  206. const existStreamIndex = this.remoteStreams.findIndex(stream => stream.getId() === id)
  207. if (existStreamIndex > -1) {
  208. this.remoteStreams.splice(existStreamIndex, 1)
  209. }
  210. }
  211. }
  212. })