|
@@ -2,7 +2,7 @@
|
|
<div
|
|
<div
|
|
:id="cameraBoxId"
|
|
:id="cameraBoxId"
|
|
class="camera_box"
|
|
class="camera_box"
|
|
- v-show="isLeader && isPublished && isPanoramaMode && !muteVideoLeader"
|
|
|
|
|
|
+ v-show="isLeader && isRTCJoined && isPanoramaMode && !muteVideoLeader && hosterhasVideo"
|
|
>
|
|
>
|
|
<span class="micBox">
|
|
<span class="micBox">
|
|
<i class="speak_mic" v-if="!roomLeader?.IsMuted"></i>
|
|
<i class="speak_mic" v-if="!roomLeader?.IsMuted"></i>
|
|
@@ -12,7 +12,9 @@
|
|
<div
|
|
<div
|
|
:id="cameraRemoveBoxId"
|
|
:id="cameraRemoveBoxId"
|
|
class="camera_box"
|
|
class="camera_box"
|
|
- v-show="!isLeader && isPublished && roomLeader && isPanoramaMode && !muteVideoLeader"
|
|
|
|
|
|
+ v-show="
|
|
|
|
+ !isLeader && isRTCJoined && roomLeader && isPanoramaMode && !muteVideoLeader && hosterhasVideo
|
|
|
|
+ "
|
|
>
|
|
>
|
|
<span class="micBox">
|
|
<span class="micBox">
|
|
<i class="speak_mic" v-if="!roomLeader?.IsMuted"></i>
|
|
<i class="speak_mic" v-if="!roomLeader?.IsMuted"></i>
|
|
@@ -21,7 +23,7 @@
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
<script lang="ts" setup>
|
|
<script lang="ts" setup>
|
|
- import { computed, onMounted } from 'vue';
|
|
|
|
|
|
+ import { computed, onMounted, unref, watch } from 'vue';
|
|
import { useAppStore } from '/@/store/modules/app';
|
|
import { useAppStore } from '/@/store/modules/app';
|
|
import { useRtcSdk } from '/@/hooks/useTRTC';
|
|
import { useRtcSdk } from '/@/hooks/useTRTC';
|
|
import { useRtcStore } from '/@/store/modules/rtc';
|
|
import { useRtcStore } from '/@/store/modules/rtc';
|
|
@@ -29,8 +31,8 @@
|
|
const rtcStore = useRtcStore();
|
|
const rtcStore = useRtcStore();
|
|
const appStore = useAppStore();
|
|
const appStore = useAppStore();
|
|
// const destination = computed(() => (rtcStore.isLeader ? '.local' : '.remote'));
|
|
// const destination = computed(() => (rtcStore.isLeader ? '.local' : '.remote'));
|
|
- const isPublished = computed(() => rtcStore.isPublished);
|
|
|
|
- // const isRTCJoined = computed(() => rtcStore.isRTCJoined);
|
|
|
|
|
|
+ // const isPublished = computed(() => rtcStore.isPublished);
|
|
|
|
+ const isRTCJoined = computed(() => rtcStore.isRTCJoined);
|
|
const isLeader = computed(() => rtcStore.isLeader);
|
|
const isLeader = computed(() => rtcStore.isLeader);
|
|
// const remoteStreams = computed(() => rtcStore.remoteStreams);
|
|
// const remoteStreams = computed(() => rtcStore.remoteStreams);
|
|
const roomLeader = computed(() => rtcStore.getRoomLeader());
|
|
const roomLeader = computed(() => rtcStore.getRoomLeader());
|
|
@@ -38,7 +40,18 @@
|
|
const cameraRemoveBoxId = computed(() => 'camera_remote_box_' + rtcStore.userId);
|
|
const cameraRemoveBoxId = computed(() => 'camera_remote_box_' + rtcStore.userId);
|
|
const isPanoramaMode = computed(() => appStore.mode === 'panorama');
|
|
const isPanoramaMode = computed(() => appStore.mode === 'panorama');
|
|
const { muteVideoLeader } = useRtcSdk();
|
|
const { muteVideoLeader } = useRtcSdk();
|
|
- onMounted(() => {});
|
|
|
|
|
|
+ const hosterhasVideo = computed(() => rtcStore.videoDeviceId?.length > 0);
|
|
|
|
+ const remoteStreams = computed(() => rtcStore.remoteStreams);
|
|
|
|
+ console.log('hosterhasVideo', hosterhasVideo);
|
|
|
|
+ onMounted(() => {
|
|
|
|
+ watch(
|
|
|
|
+ () => remoteStreams,
|
|
|
|
+ (val) => {
|
|
|
|
+ console.log('remoteStreams', unref(val));
|
|
|
|
+ },
|
|
|
|
+ { deep: true },
|
|
|
|
+ );
|
|
|
|
+ });
|
|
</script>
|
|
</script>
|
|
<style lang="scss">
|
|
<style lang="scss">
|
|
.camera_box {
|
|
.camera_box {
|