update0728

src/app.vue

@@ -9,17 +9,17 @@
       <Information v-if="!isshoppingguide" />
       <Control />
       <teleport v-if="refMiniMap && player.showWidgets" :to="refMiniMap">
-        <span class="button-switch" @click.stop="toggleMap">
+        <span :class="{gudieDisabled:isshoppingguide}" class="button-switch" @click.stop="toggleMap">
           <ui-icon type="show_map_collect"></ui-icon>
         </span>
 
-        <p class="change" @click="changeMode('dollhouse', $event, 'focus3d')">
+        <p class="change" :class="{gudieDisabled:isshoppingguide}" @click="changeMode('dollhouse', $event, 'focus3d')">
           <ui-icon type="show_3d_normal"></ui-icon>
           3D模型
         </p>
       </teleport>
       <template v-if="refMiniMap && player.showWidgets">
-        <div :class="{ disabled: flying }" v-show="mode != 'panorama'" v-if="controls.showFloorplan && controls.showDollhouse" class="tab-layer">
+        <div :class="{ disabled: flying,gudieDisabled: isshoppingguide }" v-show="mode != 'panorama'" v-if="controls.showFloorplan && controls.showDollhouse" class="tab-layer">
           <div class="tabs" v-if="controls.showMap">
             <span :class="{ active: mode === 'floorplan' }" @click="changeMode('floorplan', $event)">
               <ui-icon :type="mode == 'floorplan' ? 'show_plane_selected' : 'show_plane_normal'"></ui-icon>
@@ -155,6 +155,27 @@ const resize = () => {
 //   }
 // );
 
+
+watch(
+  () => isshoppingguide.value,
+  (val, old) => {
+    let $minmap = document.querySelector("[xui_min_map]");
+    if ($minmap) {
+      setTimeout (async () => {
+        await nextTick()
+        if (isshoppingguide.value) {
+          $minmap.classList.add("gudieDisabled");
+        } else {
+          $minmap.classList.remove("gudieDisabled");
+        } 
+      });
+    }
+  },
+  {
+    deep: true,
+  }
+);
+
 watch(
   () => player.value.showMap,
   (val, old) => {
@@ -644,6 +665,15 @@ onMounted(async () => {
   }
 }
 
+
+.gudieDisabled{
+  pointer-events: none !important;
+  *{
+    pointer-events: none !important;
+  }
+
+}
+
 @media (orientation: landscape) {
   .tab-layer {
     top: 1.2rem;

src/components/RTC/PageRtcLive.vue

@@ -95,7 +95,7 @@
 import { onMounted, watch, defineEmits, ref, reactive, computed, nextTick } from "vue";
 import { useApp, getApp } from "@/app";
 import { useStore } from "vuex";
-import { Scrollbar, Dialog } from "@/global_components/";
+import { Dialog } from "@/global_components/";
 import common from "@/utils/common";
 
 import { mapGetters } from "vuex";
@@ -188,6 +188,7 @@ const userGetOut = (item, i) => {
 const setUserWords = (res) => {
   if (res.userId == user_info.value.UserId) {
     user_info.value.IsWords = res.words;
+    Dialog.toast({ content: !user_info.value.IsWords? `主持人設置了禁言` : `主持人已解除禁言`  });
   }
 };
 
@@ -200,26 +201,24 @@ const handleMuteAduio = () => {
 };
 
 const setUserMuted = (res) => {
-  if(res.userId){
+  if (res.userId) {
     if (res.userId == user_info.value.UserId) {
       user_info.value.IsMuted = res.muted;
+      Dialog.toast({ content: !user_info.value.IsMuted? `主持人設置了开麦` : `主持人设置了静音`  });
       disableMic.value = res.muted;
       audioMuted.value = res.muted;
-    } 
-  }else{
-    onAllMuted(res)
+    }
+  } else {
+    onAllMuted(res);
   }
-
 };
 
 const setAllMuted = (data) => {
-  console.log(data,'IsMuted');
-  socket.value.emit("action", { type: "users-muted", muted: data});
+  console.log(data, "IsMuted");
+  socket.value.emit("action", { type: "users-muted", muted: data });
 };
 
-
 const onAllMuted = (res) => {
-
   user_list.value = res.members.reduce(function (tempArr, item) {
     if (tempArr.findIndex((ele) => ele.UserId === item.UserId) === -1) {
       tempArr.push(item);
@@ -233,6 +232,7 @@ const onAllMuted = (res) => {
 
   user_list.value.forEach((item) => {
     user_info.value.IsMuted = res.muted;
+    Dialog.toast({ content: !user_info.value.IsMuted? `主持人設置了开麦` : `主持人设置了静音`  });
     disableMic.value = res.muted;
     audioMuted.value = res.muted;
     item.IsMuted = res.muted;
@@ -372,9 +372,7 @@ const onMemberMuted = (item) => {
   socket.value.emit("action", { type: "users-muted", muted: item.IsMuted, userId: item.UserId });
 };
 
-
-
-const onMemberLeave = (res) => {
+const onMemberLeave = async (res) => {
   console.log("有人離開了", res);
   user_list.value = res.members.reduce(function (tempArr, item) {
     if (tempArr.findIndex((ele) => ele.UserId === item.UserId) === -1) {
@@ -382,10 +380,23 @@ const onMemberLeave = (res) => {
     }
     return tempArr;
   }, []);
+  let name = res.user.Nickname;
   if (res.user.Role == "leader") {
+    name = "主持人";
     Dialog.toast({ content: `主持人離開了房間` });
-    // emit("closeSocket");
   }
+  let data = {
+    role: res.user.Role,
+    mode: mode.value,
+    Nickname: name,
+    UserId: res.user.UserId,
+    text: "离开房間",
+  };
+  chatList.value.push(data);
+  await nextTick();
+  try {
+    chatAutoScroll();
+  } catch (error) {}
 };
 
 const userCanSpeak = (item) => {
@@ -396,7 +407,7 @@ const userCanSpeak = (item) => {
 const onGetOuT = (data) => {
   if (data.id == user_info.UserId) {
     emit("closeSocket");
-    Dialog.toast({ content: `你已被移除` });
+    Dialog.toast({ content: `您已被移除` });
   }
 };
 
@@ -511,6 +522,10 @@ const startFollow = (app) => {
     } else if (data.type == "user-leave") {
       // 房間解散
       onMemberLeave(data);
+    } else if (data.type == "leader-dismiss") {
+      emit("closeSocket");
+      Dialog.toast({ content: `主持人已解散房间` });
+
     }
   });
 

src/components/RTC/Trtccom.vue

@@ -24,9 +24,12 @@
       </div>
     </template>
 
-    <div class="videoBox userVideo" v-show="props.videoMuted">
+    <div class="videoBox userVideo" v-show="props.videoMuted || muteVideoLeader">
       <img :src="require('@/assets/images/rtcLive/avatar_small@2x.png')" alt="" />
-      <img class="loadingTip" :src="require('@/assets/images/rtcLive/loading@2x.png')" alt="" />
+      <div class="micBox">
+        <img v-if="muteAudioLeader" :src="require('@/assets/images/rtcLive/mic_off@2x.png')" alt="" />
+        <i v-else class="speak_mic"></i>
+      </div>
     </div>
   </div>
 </template>
@@ -342,14 +345,16 @@ async function handleStreamSubscribed(event) {
 
   console.log(invitedRemoteStreams.value, "invitedRemoteStreams.value");
   await nextTick();
-  remoteStream
-    .play(remoteStream.getId())
-    .then(() => {
-      console.log(`RemoteStream play success`, 88888888888888888888);
-    })
-    .catch((error) => {
-      console.log(`RemoteStream play failed:  error: ${error.message_}`);
-    });
+  setTimeout(() => {
+    remoteStream
+      .play(remoteStream.getId())
+      .then(() => {
+        console.log(`RemoteStream play success`, 88888888888888888888);
+      })
+      .catch((error) => {
+        console.log(`RemoteStream play failed:  error: ${error.message_}`);
+      });
+  }, 100);
 
   // const remoteStream = event.stream;
   // const userId = remoteStream.getUserId();
@@ -406,10 +411,12 @@ let canUseDevice = () => {
   .videoBox {
     width: 72px;
     height: 72px;
-    top: 18px;
-    left: 18px;
+    top: 19px;
+    left: 19px;
     position: fixed;
     z-index: 99999;
+    border-radius: 50%;
+    overflow: hidden;
     .loadingTip {
       position: absolute;
       z-index: 101;

src/components/RTC/index.vue

@@ -46,10 +46,15 @@ const confirmDialog = async () => {
   await getApp().Connect.follow.exit();
   store.commit("rtc/setIsJoined", false);
   if (socket.value) {
-    console.log(socket.value);
+    if(role.value == 'leader'){
+      socket.value.emit("action", { type: "leader-dismiss" });
+    }
+
     socket.value.close();
     store.commit("rtc/setSocket", null);
   }
+
+  
   let tempUrl = window.location.href;
   ["mode", "name", "role", "roomId", "userId"].forEach((item) => {
     tempUrl = browser.replaceQueryString(tempUrl, item, "");