添加内容+1

anyremote/agoraHandle.js

@@ -6,7 +6,9 @@ import {CallState} from "./constants/chatChannelRelated";
 import {clearStateOfChatChannel} from "./functionals/chatChannel";
 import {handleCommonCall} from "./functionals/callMsg";
 import {addMessageItemInMeeting} from "./functionals/callMsg";
+import {isCurrentUserMuted} from "./states/chatChannelStates";
 import {convertObj2FU} from "./utils/cnvertObjectToFormData";
+import {screenShareMetaData} from "./states/chatChannelStates";
 
 export class AgoraHandle {
     agoraOptions = {}
@@ -492,7 +494,8 @@ export class AgoraHandle {
         this.AnyRemote.sendWSFromCall(toId, 'Connect', {rtcToken, channelID})
     }
 
-    toggleMuteSelf(v) {
+    toggleMuteSelf() {
+        const v = !isCurrentUserMuted.value
         this.AnyRemote.sendWSFromCall(
             '-2',
             v ? 'MuteSelf' : "UnMuteSelf"
@@ -603,7 +606,8 @@ export class AgoraHandle {
         )
     }
 
-    screenShareHandle(v) {
+    screenShareHandle() {
+        const v = !screenShareMetaData.value.byCurrentUser
         this.AnyRemote.sendWSFromCall(
             '-2',
             v ? "ScreenShareStart" : "ScreenShareEnd"

anyremote/states/chatChannelStates.js

@@ -39,6 +39,14 @@ export const allOtherChattersIdSet = computed(function () {
     return chatChannelState.value.currentChatters.filter(a=>a!==userStates.value.currentUserId)
 })
 
+export const screenShareMetaData = computed(function () {
+    return {
+        available: chatChannelState.value.screenShareId === '',
+        byCurrentUser: chatChannelState.value.screenShareId === userStates.value.currentUserId,
+        byOther: chatChannelState.value.screenShareId && chatChannelState.value.screenShareId !== userStates.value.currentUserId
+    }
+})
+
 export const allChattersInCompany = computed(function () {
     return userStates.value.onlineContacts
         .map(a=> {

src/views/remote/videoCall/videoTools.vue

@@ -9,31 +9,37 @@
             </div>
         </div>
         <div class="flex justify-center w-full">
-            <div class="w-[120px] h-[72px] item" @click="hangupCall">
+            <div v-if="!isUserHost" class="w-[120px] h-[72px] item" @click="hangupCall">
                 <global-icon icon="phone-hangup" :size="21" color="rgb(var(--danger-5))"></global-icon>
                 <span class="mt-1" style="color: rgb(var(--danger-5))">挂断</span>
             </div>
-            <div class="w-[120px] h-[72px] item">
+          <div v-else class="w-[120px] h-[72px] item" @click="endMeeting">
+            <global-icon icon="phone-hangup" :size="21" color="rgb(var(--danger-5))"></global-icon>
+            <span class="mt-1" style="color: rgb(var(--danger-5))">结束会议</span>
+          </div>
+            <div class="w-[120px] h-[72px] item" @click="toggleMute">
                 <global-icon icon="mic" :size="21"></global-icon>
-                <span class="mt-1 color-text-2">静音</span>
+                <span class="mt-1 color-text-2">{{isCurrentUserMuted ? '取消静音' : "静音"}}</span>
             </div>
-            <div class="w-[120px] h-[72px] item">
+            <div class="w-[120px] h-[72px] item" @click="toggleVoiceChatOnly">
                 <global-icon icon="swap" :size="21"></global-icon>
-                <span class="mt-1 color-text-2">语音模式</span>
+                <span class="mt-1 color-text-2">{{isVoiceChatOnly ? '视频模式' : "语音模式"}}</span>
             </div>
 <!--            <div class="w-[120px] h-[72px] item">-->
 <!--                <global-icon icon="screenshot" :size="21"></global-icon>-->
 <!--                <span class="mt-1 color-text-2">截图</span>-->
 <!--            </div>-->
-            <div class="w-[120px] h-[72px] item">
+            <div class="w-[120px] h-[72px] item" @click="toggleScreenShare">
                 <global-icon icon="shared-screen" :size="21"></global-icon>
-                <span class="mt-1 color-text-2">屏幕共享</span>
+                <span class="mt-1 color-text-2">
+                  {{screenShareMetaData.byOther ? '他人正在共享' : screenShareMetaData.byCurrentUser ? '取消屏幕共享' : '屏幕共享'}}
+                </span>
             </div>
             <div class="w-[120px] h-[72px] item">
                 <global-icon icon="record" :size="21"></global-icon>
                 <span class="mt-1 color-text-2">开始录制</span>
             </div>
-            <div class="w-[120px] h-[72px] item">
+            <div class="w-[120px] h-[72px] item" v-if="isUserHost" @click="allMute">
                 <global-icon icon="mic-off" :size="21"></global-icon>
                 <span class="mt-1 color-text-2">全体静音</span>
             </div>
@@ -43,13 +49,46 @@
 
 <script setup lang="ts">
 import {useAnyR} from "AnyR/index";
+import {isUserHost} from "AnyR/states/chatChannelStates";
+import {ref} from "vue"
+import {isCurrentUserMuted} from "AnyR/states/chatChannelStates";
+import {screenShareMetaData} from "AnyR/states/chatChannelStates";
 
 const ps = defineProps<{
   id: any
 }>()
 
+const isVoiceChatOnly = ref(false)
+
 const AnyR = useAnyR();
 
+function toggleMute() {
+  AnyR?.agora.toggleMuteSelf()
+}
+
+function toggleScreenShare() {
+  if (screenShareMetaData.value.byOther)
+    return;
+  const endHandle = () => {
+    AnyR?.agora.screenShareHandle()
+  }
+  AnyR?.agora.screenShareHandle()
+  AnyR?.agora.agoraApp.toggleScreenShare(!screenShareMetaData.value.byCurrentUser, endHandle, endHandle, () => {})
+}
+
+function allMute() {
+  AnyR?.agora.muteAllUser()
+}
+
+function toggleVoiceChatOnly() {
+  isVoiceChatOnly.value = !isVoiceChatOnly.value
+  AnyR?.agora.toggleVoiceChatOnly(isVoiceChatOnly.value);
+}
+
+function endMeeting() {
+  AnyR?.agora.endCurrentCall()
+}
+
 function hangupCall() {
   AnyR?.agora.hangUpCurrentCall();
 }