gemercheung 1 سال پیش
والد
کامیت
9233261159

+ 1 - 1
package.json

@@ -18,7 +18,7 @@
     "lint:lint-staged": "lint-staged"
     "lint:lint-staged": "lint-staged"
   },
   },
   "dependencies": {
   "dependencies": {
-    "agora-rtc-sdk-ng": "^4.19.2",
+    "agora-rtc-sdk-ng": "^4.19.3",
     "axios": "^1.1.3",
     "axios": "^1.1.3",
     "clipboard": "^2.0.11",
     "clipboard": "^2.0.11",
     "consola": "^2.15.3",
     "consola": "^2.15.3",

+ 16 - 16
pnpm-lock.yaml

@@ -6,8 +6,8 @@ settings:
 
 
 dependencies:
 dependencies:
   agora-rtc-sdk-ng:
   agora-rtc-sdk-ng:
-    specifier: ^4.19.2
-    version: 4.19.2
+    specifier: ^4.19.3
+    version: 4.19.3
   axios:
   axios:
     specifier: ^1.1.3
     specifier: ^1.1.3
     version: 1.1.3
     version: 1.1.3
@@ -162,11 +162,11 @@ packages:
     engines: {node: '>=0.10.0'}
     engines: {node: '>=0.10.0'}
     dev: true
     dev: true
 
 
-  /@agora-js/media@4.19.2:
-    resolution: {integrity: sha512-A83uOxolbWod1ydOPFPi+xKoCN5IfcT7q4oR0H6VyGFoo1IA0OWpPztY/C1ueiU9ct5TSBqewEJUQrwvYKWuYQ==}
+  /@agora-js/media@4.19.3:
+    resolution: {integrity: sha512-isdguA/wAYRILVN831Xuyaz7MWqhWBECuAoIQg+7aATbRNtNO8Y/OvWpb9dhHnUgyf8V/CIH1wz/6dWXQtIXTA==}
     dependencies:
     dependencies:
-      '@agora-js/report': 4.19.2
-      '@agora-js/shared': 4.19.2
+      '@agora-js/report': 4.19.3
+      '@agora-js/shared': 4.19.3
       agora-rte-extension: 1.2.3
       agora-rte-extension: 1.2.3
       axios: 0.27.2
       axios: 0.27.2
       pako: 2.1.0
       pako: 2.1.0
@@ -175,17 +175,17 @@ packages:
       - debug
       - debug
     dev: false
     dev: false
 
 
-  /@agora-js/report@4.19.2:
-    resolution: {integrity: sha512-fT3ShsADEQQQwCbVXFGCj3hmsBR9F69JkpeypdiMmDyUrG9MgKYZub/En+nijk4nZ30wuWYeJBntfx+/4Vfd0g==}
+  /@agora-js/report@4.19.3:
+    resolution: {integrity: sha512-g64mpKEhuItmoKv8YJdjJAZyFxKwfCtOZ99RZ2d2HcN9yuKT7WoMJ1TbHdCl9nwigtxBloZTv49ukOp2qIUpcw==}
     dependencies:
     dependencies:
-      '@agora-js/shared': 4.19.2
+      '@agora-js/shared': 4.19.3
       axios: 0.27.2
       axios: 0.27.2
     transitivePeerDependencies:
     transitivePeerDependencies:
       - debug
       - debug
     dev: false
     dev: false
 
 
-  /@agora-js/shared@4.19.2:
-    resolution: {integrity: sha512-foCSc2tZx99DlMZ3zO47en4eyWYeHtm3Q0dDEWKK7sTaTVqS73aa6O/7CIw9vm2MKfvBv9rFcpXUlYbFKA0/1g==}
+  /@agora-js/shared@4.19.3:
+    resolution: {integrity: sha512-APC7HEA4240pSTk3Ri++lzzW+E4lr35YsgU8Va4WciLDQSlDrTybxiyY0gdZ5DqhrRE4Si0bOX32yc3p1HllWg==}
     dependencies:
     dependencies:
       axios: 0.27.2
       axios: 0.27.2
       ua-parser-js: 0.7.37
       ua-parser-js: 0.7.37
@@ -1791,12 +1791,12 @@ packages:
       indent-string: 4.0.0
       indent-string: 4.0.0
     dev: true
     dev: true
 
 
-  /agora-rtc-sdk-ng@4.19.2:
-    resolution: {integrity: sha512-5ctCSxhdo2UnTAd/+00ZAuHRQzLUt4yNkopkd7tXAQNAmaTFu0dyOkAK5/ind5cZuqQLTuggX4ctXCHpIzpHTw==}
+  /agora-rtc-sdk-ng@4.19.3:
+    resolution: {integrity: sha512-vzIZ2wHoVRM/38YTCKIP6nQ3ehiBUfvpExsJw4Ala9QhCK6J8qMxmZxqBoNmz6jigMfMWi7c8UVZThbaNQM6Pg==}
     dependencies:
     dependencies:
-      '@agora-js/media': 4.19.2
-      '@agora-js/report': 4.19.2
-      '@agora-js/shared': 4.19.2
+      '@agora-js/media': 4.19.3
+      '@agora-js/report': 4.19.3
+      '@agora-js/shared': 4.19.3
       agora-rte-extension: 1.2.3
       agora-rte-extension: 1.2.3
       axios: 0.27.2
       axios: 0.27.2
       formdata-polyfill: 4.0.10
       formdata-polyfill: 4.0.10

+ 1 - 1
src/App.vue

@@ -368,7 +368,7 @@
       {{ maxNumber }}
       {{ maxNumber }}
     </span> -->
     </span> -->
     <span>
     <span>
-      {{ t('base.debuginfo') }}V:1.2.0-t1,角色:{{ rtcStore.role }} rId:{{
+      {{ t('base.debuginfo') }}V:1.2.0-g3,角色:{{ rtcStore.role }} rId:{{
         rtcStore.roomId || browser.getURLParam('roomId')
         rtcStore.roomId || browser.getURLParam('roomId')
       }}
       }}
       sceneIndex:{{ currentSceneIndex }} uid::
       sceneIndex:{{ currentSceneIndex }} uid::

+ 9 - 3
src/components/basic/FloorSwitch.vue

@@ -90,7 +90,7 @@
   .floor-switch {
   .floor-switch {
     pointer-events: all;
     pointer-events: all;
     position: absolute;
     position: absolute;
-    bottom: calc(100% + 5px);
+    bottom: 2.5rem;
     left: 20px;
     left: 20px;
     z-index: 10;
     z-index: 10;
     transition: bottom 0.1s;
     transition: bottom 0.1s;
@@ -169,9 +169,11 @@
       span {
       span {
         margin-left: 10px;
         margin-left: 10px;
         font-size: 14px;
         font-size: 14px;
-        //color: #939393;
+        height: 32px;
+
         cursor: pointer;
         cursor: pointer;
         color: #eeeeee;
         color: #eeeeee;
+        overflow: hidden;
         text-shadow: 0px 0px 4px rgba(0, 0, 0, 0.5);
         text-shadow: 0px 0px 4px rgba(0, 0, 0, 0.5);
       }
       }
       &.active {
       &.active {
@@ -282,6 +284,10 @@
         }
         }
         span {
         span {
           font-size: 0.36842rem;
           font-size: 0.36842rem;
+          max-width: 280px;
+          overflow: hidden;
+          white-space: nowrap;
+          text-overflow: ellipsis;
         }
         }
         &.active {
         &.active {
           b {
           b {
@@ -301,7 +307,7 @@
             border: solid 3px #1c1c1c;
             border: solid 3px #1c1c1c;
             border-radius: 30px;
             border-radius: 30px;
             padding: 0px 10px;
             padding: 0px 10px;
-            margin-left: 5px;
+            justify-content: flex-start;
             &::before {
             &::before {
               left: -11px;
               left: -11px;
               width: 10px;
               width: 10px;

+ 1 - 1
src/components/chatRoom/camera.vue

@@ -49,7 +49,7 @@
   const isRTCJoined = computed(() => rtcStore.isRTCJoined);
   const isRTCJoined = computed(() => rtcStore.isRTCJoined);
   const isLeader = computed(() => rtcStore.isLeader);
   const isLeader = computed(() => rtcStore.isLeader);
   const roomLeader = computed(() => rtcStore.getRoomLeader());
   const roomLeader = computed(() => rtcStore.getRoomLeader());
-  const cameraBoxId = computed(() => 'camera_box_' + rtcStore.userId);
+  const cameraBoxId = computed(() => 'camera_box_' + `${rtcStore.roomId}-${rtcStore.userId}`);
   // const cameraRemoteBoxId = computed(() => 'camera_remote_box_' + rtcStore.userId);
   // const cameraRemoteBoxId = computed(() => 'camera_remote_box_' + rtcStore.userId);
   const isPanoramaMode = computed(() => appStore.mode === 'panorama');
   const isPanoramaMode = computed(() => appStore.mode === 'panorama');
   const {
   const {

+ 12 - 0
src/components/chatRoom/controls/actions.ts

@@ -307,6 +307,8 @@ const handleUserSetWords = (UserId?: string, words?: boolean, members?: UserInfo
 };
 };
 const handleUserMuted = (UserId?: string, muted?: boolean) => {
 const handleUserMuted = (UserId?: string, muted?: boolean) => {
   const rtcStore = useRtcStore();
   const rtcStore = useRtcStore();
+  // const { isUsingMiniApp } = useMiniApp();
+  const { t } = useI18n();
   UserId &&
   UserId &&
     rtcStore.updateMemberDatabyId(UserId, {
     rtcStore.updateMemberDatabyId(UserId, {
       IsMuted: muted,
       IsMuted: muted,
@@ -320,8 +322,18 @@ const handleUserMuted = (UserId?: string, muted?: boolean) => {
       const { unMutedAudio, mutedAudio } = useRtcSdk();
       const { unMutedAudio, mutedAudio } = useRtcSdk();
       if (muted) {
       if (muted) {
         mutedAudio();
         mutedAudio();
+        // if (!isUsingMiniApp.value) {
+        Dialog.toast({
+          content: t('action.micOff'),
+        });
+        // }
       } else {
       } else {
         unMutedAudio();
         unMutedAudio();
+        // if (!isUsingMiniApp.value) {
+        Dialog.toast({
+          content: t('action.micOn'),
+        });
+        // }
       }
       }
     }, 500);
     }, 500);
   }
   }

+ 2 - 1
src/components/chatRoom/index.vue

@@ -353,7 +353,8 @@
   console.log('initParams', rtcStore.userId);
   console.log('initParams', rtcStore.userId);
   const nickname = decodeURIComponent(decodeURIComponent(browser.getURLParam('name')));
   const nickname = decodeURIComponent(decodeURIComponent(browser.getURLParam('name')));
 
 
-  const randomUserId = `user_${uuidv4()}`;
+  const randomUserId = `${uuidv4()}`;
+
   // debugger;
   // debugger;
   const initParams: SocketParams = {
   const initParams: SocketParams = {
     userId: browser.getURLParam('vruserId') || rtcStore.userId || randomUserId,
     userId: browser.getURLParam('vruserId') || rtcStore.userId || randomUserId,

+ 19 - 40
src/components/hotspot/metas/metas-image.vue

@@ -20,7 +20,7 @@
     <div class="over-box" ref="containerRef">
     <div class="over-box" ref="containerRef">
       <div
       <div
         v-show="!loading"
         v-show="!loading"
-        class="image-list"
+        class="image-list 11"
         :style="`transform:translateX(${-100 * imageNum}%);`"
         :style="`transform:translateX(${-100 * imageNum}%);`"
       >
       >
         <!-- <div
         <!-- <div
@@ -56,14 +56,12 @@
 </template>
 </template>
 
 
 <script setup lang="ts">
 <script setup lang="ts">
-  import { onMounted, nextTick, ref, computed } from 'vue';
-  import { tagType } from '/@/store/modules/scene';
+  import { onMounted, nextTick, ref, computed, watch } from 'vue';
+  import { tagType, useSceneStore } from '/@/store/modules/scene';
   import { changeUrl } from '../common';
   import { changeUrl } from '../common';
-  // import { useApp } from '/@/hooks/userApp';
   import browser from '/@/utils/browser';
   import browser from '/@/utils/browser';
   const isMobile = ref(false);
   const isMobile = ref(false);
-  // const type = ref('image');
-  // const emit = defineEmits(['close']);
+  const sceneStore = useSceneStore();
 
 
   const props = defineProps({
   const props = defineProps({
     data: {
     data: {
@@ -96,37 +94,26 @@
     } else {
     } else {
       imageNum.value++;
       imageNum.value++;
     }
     }
+
+    sceneStore.setCurrentTagLayerIndex(imageNum.value);
     if (props.viewer && !isMobile.value) {
     if (props.viewer && !isMobile.value) {
       resetScale();
       resetScale();
     }
     }
   };
   };
-  // const hanlderFiles = (data) => {
-  //   // store.commit('tag/setImageList', data[0])
-  //   setImageList(data[0]);
-  //   // if (imageNum.value < imageList.value.length + data[0].length - 1) {
-  //   //     imageNum.value = imageList.value.length + data[0].length - 1
-  //   // }
-  //   imageNum.value = imageList.value.length - 1;
-  // };
 
 
-  // const setImageList = (data) => {
-  //   let picLength = 0;
-  //   let list = JSON.parse(JSON.stringify(imageList.value));
-  //   if (list.length > 0) {
-  //     picLength = list.length;
-  //   }
+  const currentTagLayerIndex = computed(() => sceneStore.currentTagLayerIndex);
+  //同步
+  watch(
+    currentTagLayerIndex,
+    (index) => {
+      console.log('index', index);
+      imageNum.value = index;
+    },
+    {
+      immediate: true,
+    },
+  );
 
 
-  //   for (let i = 0; i < data.length; i++) {
-  //     if (list.length < 9) {
-  //       list.push('');
-  //       var index = i + picLength;
-  //       list[index] = { src: URL.createObjectURL(data[i]), file: data[i] };
-  //     } else {
-  //       break;
-  //     }
-  //   }
-  //   // store.commit('tag/setImageList', list);
-  // };
   let result = { width: 0, height: 0 },
   let result = { width: 0, height: 0 },
     x,
     x,
     y,
     y,
@@ -156,7 +143,6 @@
         y += diff.y;
         y += diff.y;
 
 
         image.style.transform = 'translate3d(' + x + 'px, ' + y + 'px, 0) scale(' + scale + ')';
         image.style.transform = 'translate3d(' + x + 'px, ' + y + 'px, 0) scale(' + scale + ')';
-        // log.innerHTML = `x = ${x.toFixed(0)}<br>y = ${y.toFixed(0)}<br>scale = ${scale.toFixed(5)}`
       }
       }
       e.preventDefault();
       e.preventDefault();
     });
     });
@@ -255,6 +241,7 @@
   onMounted(async () => {
   onMounted(async () => {
     // const app = await useApp();
     // const app = await useApp();
     isMobile.value = browser.isMobile();
     isMobile.value = browser.isMobile();
+    // (window as any).pcGlobalSwiper = new (window as any).Swiper('.pic-box');
 
 
     nextTick(() => {
     nextTick(() => {
       let img = new Image();
       let img = new Image();
@@ -287,9 +274,6 @@
         loading.value = false;
         loading.value = false;
       };
       };
       img.src = zoomInImg.value || '';
       img.src = zoomInImg.value || '';
-      // nextTick(() => {
-      //     zoomElement(topology.value)
-      // })
     }
     }
   };
   };
 </script>
 </script>
@@ -327,11 +311,6 @@
       background-size: contain;
       background-size: contain;
       background-position: center center;
       background-position: center center;
       #eleImg {
       #eleImg {
-        // position: absolute;
-
-        // top: 50%;
-        // left: 50%;
-        // transform: translate(-50%, -50%);
         margin: 0 auto;
         margin: 0 auto;
         display: block;
         display: block;
         &.s {
         &.s {

+ 91 - 66
src/hooks/useAgora.ts

@@ -7,14 +7,15 @@ export { ILocalAudioTrack, ILocalVideoTrack } from 'agora-rtc-sdk-ng';
 import { ref } from 'vue';
 import { ref } from 'vue';
 import { muteVideoLeader } from './useTRTC';
 import { muteVideoLeader } from './useTRTC';
 
 
-export let localAudioTrack: ILocalAudioTrack;
-export let localVideoTrack: ILocalVideoTrack;
+export const localAudioTrack = ref<ILocalAudioTrack | null>();
+export const localVideoTrack = ref<ILocalVideoTrack | null>();
 export let localClient: IAgoraRTCClient;
 export let localClient: IAgoraRTCClient;
 
 
-const isHasCamera = ref(false);
-const isHasMicrophone = ref(false);
+export const isHasCamera = ref(false);
+export const isHasMicrophone = ref(false);
 const userID = ref('');
 const userID = ref('');
-
+const roomID = ref('');
+const CamID = ref('');
 export const createAgoraClient = async (
 export const createAgoraClient = async (
   sdkAppId: string,
   sdkAppId: string,
   roomId: string,
   roomId: string,
@@ -23,22 +24,30 @@ export const createAgoraClient = async (
 ): Promise<IAgoraRTCClient> => {
 ): Promise<IAgoraRTCClient> => {
   const rtcStore = useRtcStore();
   const rtcStore = useRtcStore();
   // const { muteVideoLeader } = useRtcSdk();
   // const { muteVideoLeader } = useRtcSdk();
-
+  userID.value = userId;
+  roomID.value = roomId;
+  CamID.value = `camera_box_${userID.value}`;
   const isOK = AgoraRTC.checkSystemRequirements();
   const isOK = AgoraRTC.checkSystemRequirements();
   if (!isOK) {
   if (!isOK) {
     console.log('当前不支持');
     console.log('当前不支持');
   }
   }
 
 
-  // AgoraRTC.setLogLevel();
-
-  const role = rtcStore.role === 'leader' ? 'host' : 'audience';
-  const client: IAgoraRTCClient = AgoraRTC.createClient({ mode: 'rtc', codec: 'vp9', role: role });
+  AgoraRTC.enableLogUpload();
+  // 将日志输出级别设置为 INFO
+  AgoraRTC.setLogLevel(1);
 
 
+  // const role = rtcStore.role === 'leader' ? 'audience' : 'audience';
+  const client: IAgoraRTCClient = AgoraRTC.createClient({ mode: 'rtc', codec: 'vp8' });
+  // client.setClientRole('host');
   localClient = client;
   localClient = client;
-  const uid = await client.join(String(sdkAppId), roomId, sign, userId);
-  userID.value = userId;
 
 
-  console.warn('client', uid, client);
+  if (!userID.value) {
+    console.error('加入时不能没没有UserID');
+    return Promise.reject();
+  }
+  const uid = await client.join(String(sdkAppId), roomId, sign, userID.value);
+
+  console.warn('rtc-client', uid, client);
 
 
   client.on('volume-indicator', function (result) {
   client.on('volume-indicator', function (result) {
     result.forEach(function (volume, index) {
     result.forEach(function (volume, index) {
@@ -48,15 +57,15 @@ export const createAgoraClient = async (
   client.on('exception', (error) => {
   client.on('exception', (error) => {
     console.error('sdk error', error);
     console.error('sdk error', error);
   });
   });
+
   client.on('user-joined', (user) => {
   client.on('user-joined', (user) => {
-    console.log('userJoin', user);
+    console.warn('userJoin', user);
   });
   });
   client.on('user-info-updated', (user) => {
   client.on('user-info-updated', (user) => {
     console.log('userJoin', user);
     console.log('userJoin', user);
   });
   });
   //取消订阅
   //取消订阅
   client.on('user-unpublished', async (user, mediaType) => {
   client.on('user-unpublished', async (user, mediaType) => {
-    // await client.unsubscribe(user, mediaType);
     if (mediaType === 'audio') {
     if (mediaType === 'audio') {
       console.error('unpublished-audio', user);
       console.error('unpublished-audio', user);
     }
     }
@@ -66,28 +75,24 @@ export const createAgoraClient = async (
       if (remoteVideoEl) {
       if (remoteVideoEl) {
         remoteVideoEl.style.display = 'none';
         remoteVideoEl.style.display = 'none';
       }
       }
-      const leader = rtcStore.getRoomLeader();
-      console.error('unpublished-video', leader, user.uid === leader?.Id);
     }
     }
   });
   });
   //发布订阅
   //发布订阅
-  client.on('user-published', async (user, mediaType) => {
+  localClient.on('user-published', async (user, mediaType) => {
     console.warn('远程音视频-published', user, mediaType);
     console.warn('远程音视频-published', user, mediaType);
-    await client.subscribe(user, mediaType);
+    await localClient.subscribe(user, mediaType);
     if (mediaType === 'video') {
     if (mediaType === 'video') {
-      console.error('subscribe video success', user);
       const remoteVideoEl = document.getElementById(`cameraRemoteBox`);
       const remoteVideoEl = document.getElementById(`cameraRemoteBox`);
       if (user.videoTrack && user.hasVideo && remoteVideoEl) {
       if (user.videoTrack && user.hasVideo && remoteVideoEl) {
-        // remoteVideoEl.style.display = 'block';
         remoteVideoEl.style.display = 'block';
         remoteVideoEl.style.display = 'block';
         console.warn(`收到远程视频-->当前用ID${user.uid}`);
         console.warn(`收到远程视频-->当前用ID${user.uid}`);
         user.videoTrack.play(remoteVideoEl);
         user.videoTrack.play(remoteVideoEl);
-        // muteVideoLeader.value = false;
       }
       }
     }
     }
     if (mediaType === 'audio') {
     if (mediaType === 'audio') {
       console.warn(`收到远程音频-->当前用ID${user.uid}`);
       console.warn(`收到远程音频-->当前用ID${user.uid}`);
-      user.audioTrack?.play();
+      const remoteAudioTrack = user.audioTrack;
+      remoteAudioTrack?.play();
     }
     }
   });
   });
 
 
@@ -96,44 +101,40 @@ export const createAgoraClient = async (
     isHasMicrophone.value = (await AgoraRTC.getMicrophones()).length > 0;
     isHasMicrophone.value = (await AgoraRTC.getMicrophones()).length > 0;
 
 
     if (isHasCamera.value) {
     if (isHasCamera.value) {
-      localVideoTrack = await AgoraRTC.createCameraVideoTrack();
-      localVideoTrack.setEncoderConfiguration('120p');
+      localVideoTrack.value = await AgoraRTC.createCameraVideoTrack();
+      localVideoTrack.value.setEncoderConfiguration('120p');
     }
     }
+  } catch (error) {
+    console.error('error', error);
+  }
 
 
-    isHasMicrophone.value && (localAudioTrack = await AgoraRTC.createMicrophoneAudioTrack());
-  } catch (error) {}
-
-  const localVideoEl = document.getElementById(`camera_box_${userId}`);
   console.warn('isHasCamera', isHasCamera.value);
   console.warn('isHasCamera', isHasCamera.value);
   console.warn('isHasMicrophone', isHasMicrophone.value);
   console.warn('isHasMicrophone', isHasMicrophone.value);
 
 
   if (rtcStore.role === 'leader') {
   if (rtcStore.role === 'leader') {
-    if (isHasCamera.value) {
+    if (isHasCamera.value && localVideoTrack.value) {
       rtcStore.setHasCamera();
       rtcStore.setHasCamera();
+
+      const localVideoEl = document.getElementById(CamID.value);
       if (localVideoEl) {
       if (localVideoEl) {
         try {
         try {
-          console.warn('播放本地rtc-localVideoTrack');
-          localVideoTrack.play(localVideoEl);
+          console.warn('播放本地rtc-localVideoTrack', localVideoEl);
+          localVideoTrack.value.play(localVideoEl);
         } catch (error) {
         } catch (error) {
-          console.error(error);
+          console.error('error', error);
         }
         }
       }
       }
       //主持人有相机的
       //主持人有相机的
       console.warn('有VID leader发布流');
       console.warn('有VID leader发布流');
-      await client.publish(localVideoTrack);
-      localVideoTrack.setMuted(true);
+      await client.publish(localVideoTrack.value);
+      localVideoTrack.value.setMuted(true);
     }
     }
   }
   }
 
 
-  if (isHasMicrophone.value) {
-    await client.publish(localAudioTrack);
-    // 先play
-
-    localAudioTrack.setVolume(120);
-    localAudioTrack.setMuted(true);
-    localAudioTrack.play();
-    console.warn('所有有MIC静音和发布', localAudioTrack.isPlaying);
-  }
+  // if (isHasMicrophone.value) {
+  //   await publishLockAudioTrack(true);
+  //   console.warn('所有人有MIC静音和发布', localAudioTrack.value?.isPlaying);
+  // }
   //默认头闭摄像头
   //默认头闭摄像头
   muteVideoLeader.value = true;
   muteVideoLeader.value = true;
   rtcStore.setIsRTCJoined(true);
   rtcStore.setIsRTCJoined(true);
@@ -141,54 +142,78 @@ export const createAgoraClient = async (
   return client;
   return client;
 };
 };
 
 
+const publishLockAudioTrack = async () => {
+  if (localAudioTrack.value) {
+    await localClient.unpublish(localAudioTrack.value);
+    localAudioTrack.value = null;
+  }
+  localAudioTrack.value = await AgoraRTC.createMicrophoneAudioTrack();
+  if (localAudioTrack.value) {
+    await localClient.publish([localAudioTrack.value]);
+    // localAudioTrack.value.setVolume(120);
+    // localAudioTrack.value.setMuted(muted);
+    // localAudioTrack.value.play();
+  }
+};
+const unPublishLockAudioTrack = async () => {
+  if (localAudioTrack.value) {
+    await localClient.unpublish([localAudioTrack.value]);
+    localAudioTrack.value = null;
+  }
+};
+
 export const muteVideo = () => {
 export const muteVideo = () => {
   //通用开音方法
   //通用开音方法
-  localVideoTrack.setMuted(true);
+  localVideoTrack.value?.setMuted(true);
 };
 };
 export const unMuteVideo = () => {
 export const unMuteVideo = () => {
-  localVideoTrack.setMuted(false);
+  localVideoTrack.value?.setMuted(false);
 };
 };
 
 
 export const mutedAudio = () => {
 export const mutedAudio = () => {
   //通用禁音方法
   //通用禁音方法
-  console.error('mutedAudio');
   if (isHasMicrophone.value) {
   if (isHasMicrophone.value) {
-    console.log('localAudioTrack', localAudioTrack);
-    localAudioTrack.setMuted(true);
+    console.error('有MIC关MIC');
+    unPublishLockAudioTrack();
   }
   }
 };
 };
 export const unMutedAudio = async () => {
 export const unMutedAudio = async () => {
   //通用开音方法
   //通用开音方法
-  console.error('unMutedAudio');
   if (isHasMicrophone.value) {
   if (isHasMicrophone.value) {
-    console.log('localAudioTrack', localAudioTrack);
-    localAudioTrack.setMuted(false);
+    // 开MIC要重新发布
+    console.error('有MIC开MIC');
+    publishLockAudioTrack();
   }
   }
 };
 };
 
 
 export const switchToFrontCam = async () => {
 export const switchToFrontCam = async () => {
-  localVideoTrack.close();
-  localClient.unpublish(localVideoTrack);
-  localVideoTrack = await AgoraRTC.createCameraVideoTrack({
+  if (localVideoTrack.value) {
+    localVideoTrack.value.close();
+    await localClient.unpublish(localVideoTrack.value);
+  }
+  localVideoTrack.value = null;
+  localVideoTrack.value = await AgoraRTC.createCameraVideoTrack({
     facingMode: 'user',
     facingMode: 'user',
   });
   });
-  const localVideoEl = document.getElementById(`camera_box_${userID.value}`);
+  const localVideoEl = document.getElementById(CamID.value);
   if (localVideoEl) {
   if (localVideoEl) {
-    localVideoTrack.play(localVideoEl);
+    localVideoTrack.value.play(localVideoEl);
   }
   }
-  await localClient.publish(localVideoTrack);
+  await localClient.publish(localVideoTrack.value);
 };
 };
 
 
 export const switchToBackCam = async () => {
 export const switchToBackCam = async () => {
-  localClient.unpublish(localVideoTrack);
-  localVideoTrack = await AgoraRTC.createCameraVideoTrack({
-    facingMode: 'environment',
-  });
-  const localVideoEl = document.getElementById(`camera_box_${userID.value}`);
-  if (localVideoEl) {
-    localVideoTrack.play(localVideoEl);
+  if (localVideoTrack.value) {
+    await localClient.unpublish(localVideoTrack.value);
+    localVideoTrack.value = await AgoraRTC.createCameraVideoTrack({
+      facingMode: 'environment',
+    });
+    const localVideoEl = document.getElementById(CamID.value);
+    if (localVideoEl) {
+      localVideoTrack.value.play(localVideoEl);
+    }
+    await localClient.publish(localVideoTrack.value);
   }
   }
-  await localClient.publish(localVideoTrack);
 };
 };
 export const cleanAll = () => {
 export const cleanAll = () => {
   // AgoraRTC.removeAllListeners();
   // AgoraRTC.removeAllListeners();

+ 1 - 1
src/hooks/useRoom.ts

@@ -208,7 +208,7 @@ export const getSign = async (
   roleId: string,
   roleId: string,
   platform?: string,
   platform?: string,
 ): Promise<getSignType> => {
 ): Promise<getSignType> => {
-  let role = 2;
+  let role = 1;
   if (roleId === 'leader') {
   if (roleId === 'leader') {
     role = 1;
     role = 1;
   }
   }

+ 25 - 8
src/hooks/useTRTC.ts

@@ -15,6 +15,8 @@ import {
   switchToFrontCam as argoraSwitchToFrontCam,
   switchToFrontCam as argoraSwitchToFrontCam,
   switchToBackCam as argoraSwitchToBackCam,
   switchToBackCam as argoraSwitchToBackCam,
   cleanAll as argoraCleanAll,
   cleanAll as argoraCleanAll,
+  isHasMicrophone as argoraIsHasMicrophone,
+  isHasCamera as argoraIsHasCamera,
 } from './useAgora';
 } from './useAgora';
 import {
 import {
   createRTCSocket as createTXRTCSocket,
   createRTCSocket as createTXRTCSocket,
@@ -29,7 +31,7 @@ import { useMiniApp } from './useMiniApp';
 import { useRoom } from './useRoom';
 import { useRoom } from './useRoom';
 
 
 let localClient: Client | AgoraClient;
 let localClient: Client | AgoraClient;
-// let localAudio: ILocalAudioTrack | LocalStream;
+
 const sdkType = ref(0);
 const sdkType = ref(0);
 
 
 // const muteAudioLeader = ref(false);
 // const muteAudioLeader = ref(false);
@@ -55,17 +57,16 @@ async function createRTCSocket(): Promise<void> {
     if (!unref(isUsingMiniApp)) {
     if (!unref(isUsingMiniApp)) {
       const { getSign } = useRoom();
       const { getSign } = useRoom();
       const rtcStore = useRtcStore();
       const rtcStore = useRtcStore();
-      const res = await getSign(rtcStore.userId, rtcStore.roomId, rtcStore.role, 'fire');
+      let uid = rtcStore.userId;
+      if (rtcStore.role === 'leader') {
+        uid = `${rtcStore.roomId}-${rtcStore.userId}`;
+      }
+      const res = await getSign(uid, rtcStore.roomId, rtcStore.role, 'fire');
       // console.warn('web rtc入口', res);
       // console.warn('web rtc入口', res);
       const { sign, operatorType, sdkAppId } = res;
       const { sign, operatorType, sdkAppId } = res;
       sdkType.value = Number(operatorType);
       sdkType.value = Number(operatorType);
       if (Number(operatorType) === 1) {
       if (Number(operatorType) === 1) {
-        localClient = await createAgoraClient(
-          String(sdkAppId),
-          rtcStore.roomId,
-          sign,
-          rtcStore.userId,
-        );
+        localClient = await createAgoraClient(String(sdkAppId), rtcStore.roomId, sign, uid);
       } else if (operatorType === 0) {
       } else if (operatorType === 0) {
         localClient = await createTXRTCSocket(
         localClient = await createTXRTCSocket(
           String(sdkAppId),
           String(sdkAppId),
@@ -156,6 +157,20 @@ const cleanAll = () => {
     argoraCleanAll();
     argoraCleanAll();
   }
   }
 };
 };
+const isHasMicrophone = computed(() => {
+  if (sdkType.value === 1) {
+    return argoraIsHasMicrophone.value;
+  } else {
+    return argoraIsHasMicrophone.value;
+  }
+});
+const isHasCamera = computed(() => {
+  if (sdkType.value === 1) {
+    return argoraIsHasCamera.value;
+  } else {
+    return argoraIsHasCamera.value;
+  }
+});
 export function useRtcSdk() {
 export function useRtcSdk() {
   return {
   return {
     initRtcSDK,
     initRtcSDK,
@@ -171,5 +186,7 @@ export function useRtcSdk() {
     client: localClient,
     client: localClient,
     globalVideoEnable,
     globalVideoEnable,
     cleanAll,
     cleanAll,
+    isHasMicrophone,
+    isHasCamera,
   };
   };
 }
 }

+ 2 - 0
src/locales/lang/en/action.ts

@@ -17,4 +17,6 @@ export default {
   earlyRoomError: 'Please wait till the reservation can be made.',
   earlyRoomError: 'Please wait till the reservation can be made.',
   timeOutRoomError: 'You have reached your time limit for the use of the current studio.',
   timeOutRoomError: 'You have reached your time limit for the use of the current studio.',
   hostNotInRoomError: '主持人不在带看房间内',
   hostNotInRoomError: '主持人不在带看房间内',
+  micOn: "your's mic is on",
+  micOff: "your's mic is off",
 };
 };

+ 2 - 0
src/locales/lang/zh/action.ts

@@ -18,4 +18,6 @@ export default {
   earlyRoomError: '未到房间使用时间',
   earlyRoomError: '未到房间使用时间',
   timeOutRoomError: '当前房间使用期限已到',
   timeOutRoomError: '当前房间使用期限已到',
   hostNotInRoomError: '主持人不在带看房间内',
   hostNotInRoomError: '主持人不在带看房间内',
+  micOn: '你已开启麦克风',
+  micOff: '你已关闭麦克风',
 };
 };