From f468170d79dee3f8efb75705c7e23a1b53e54e91 Mon Sep 17 00:00:00 2001 From: feige <791364011@qq.com> Date: 星期二, 29 七月 2025 22:08:02 +0800 Subject: [PATCH] 修改了内容 --- ruoyi-ui/src/components/comp-room.vue | 96 ++++++++++++++++++++++++++++-------------------- 1 files changed, 56 insertions(+), 40 deletions(-) diff --git a/ruoyi-ui/src/components/comp-room.vue b/ruoyi-ui/src/components/comp-room.vue index de8c180..5395691 100644 --- a/ruoyi-ui/src/components/comp-room.vue +++ b/ruoyi-ui/src/components/comp-room.vue @@ -6,14 +6,14 @@ <template> <div class="rtc-container"> <!-- 杩涙埧鎿嶄綔鍖哄煙 --> - <p v-if="isHostMode" class="label">{{ $t('Operation') }}</p> + <p v-if="isHostMode" class="label">{{ $t('浼氳鎿嶄綔') }}</p> <div class="control-container"> <div class="rtc-control-container"> - <el-button +<!-- <el-button class="button" type="primary" - size="small" :disabled="isJoining || isJoined" @click="handleJoinRoom">{{ $t('Join Room') }}</el-button> - <el-button + size="small" :disabled="isJoining || isJoined" @click="handleJoinRoom">{{ $t('鍔犲叆鎴块棿') }}</el-button> --> +<!-- <el-button v-if="isHostMode" class="button" type="primary" @@ -21,21 +21,24 @@ <el-button v-if="isHostMode" class="button" - type="primary" size="small" @click="handleUnpublish">{{ $t('Unpublish') }}</el-button> - <el-button + type="primary" size="small" @click="handleUnpublish">{{ $t('Unpublish') }}</el-button> --> +<!-- <el-button class="button" - type="primary" size="small" @click="handleLeave">{{ $t('Leave Room') }}</el-button> + type="primary" size="small" @click="handleLeave">{{ $t('绂诲紑鎴块棿') }}</el-button> --> </div> <div v-if="isHostMode" class="screen-share-control-container"> <el-button class="button" type="primary" size="small" - :disabled="isShareJoined && isSharePublished" - @click="handleStartScreenShare">{{ $t('Start Screen Share') }}</el-button> + :disabled="(isShareJoined && isSharePublished) || disable" + @click="handleStartScreenShare">{{ $t('鍏变韩灞忓箷') }}</el-button> <el-button class="button" - type="primary" size="small" @click="handleStopScreenShare">{{ $t('Stop Screen Share') }}</el-button> + type="primary" size="small" @click="handleStopScreenShare" :disabled='disable'>{{ $t('缁撴潫灞忓箷鍏变韩') }}</el-button> + <el-button + class="button" + type="primary" size="small" @click="handleLeave" :disabled='disable'>{{ $t('绂诲紑鎴块棿') }}</el-button> </div> </div> @@ -63,19 +66,22 @@ <div class="info-container" :class="$isMobile && 'info-container-mobile'"> <!-- Log 灞曠ず鍖哄煙 --> - <div v-if="isHostMode" class="log-container" ref="logContainer"> - <p class="log-label">Log:</p> - <div v-for="(item, index) in logList" :key="index"> - <span class="log-state" v-if="item.type === 'success'">馃煩 </span> - <span class="log-state" v-if="item.type === 'failed'">馃煡 </span> - <span>{{ item.log }}</span> - </div> + <div v-if="isHostMode" class="log-container" ref="logContainer"> + <!-- <p class="log-label">Log:</p> --> + <!-- <div v-for="(item, index) in logList" :key="index"> --> + <!-- <span class="log-state" v-if="item.type === 'success'">馃煩 </span> --> + <!-- <span class="log-state" v-if="item.type === 'failed'">馃煡 </span> --> + <!-- <span>{{ item.log }}</span> --> + <!-- </div> --> </div> <!-- 鏈湴娴佸尯鍩� --> <div v-if="localStream" class="local-stream-container"> + <!-- <div style="background-color: red; width: 20px;height: 20px">123123</div> --> <!-- 鏈湴娴佹挱鏀惧尯鍩� --> - <div id="localStream" class="local-stream-content"></div> + <div id="localStream" class="local-stream-content" ref="myDiv"> + <!-- <div v-if="bj" style="background-color: red; width: 50%;height: 50%">123123</div> --> + </div> <!-- 鏈湴娴佹搷浣滄爮 --> <div v-if="isPlayingLocalStream" class="local-stream-control"> <div class="video-control control"> @@ -100,6 +106,7 @@ <!-- 杩滅娴佸尯鍩� --> <div class="remote-container"> + <!-- <div style="background-color: red; width: 20px;height: 20px">456456</div> --> <div v-for="(item) in remoteStreamList" :key="item.getUserId()" @@ -130,10 +137,16 @@ }, data() { return { + disable:false, logList: [], inviteLink: '', showCopiedTip: false, }; + }, + created() { + }, + mounted(){ + this.handleJoinRoom(); }, computed: { isHostMode() { @@ -161,7 +174,7 @@ } const { sdkAppId, secretKey, roomId } = this; const inviteUserId = `user_${parseInt(Math.random() * 100000000, 10)}`; - alert(123) + // alert(123) const userSigGenerator = new LibGenerateTestUserSig(sdkAppId, secretKey, 604800); const inviteUserSig = userSigGenerator.genTestUserSig(inviteUserId); this.inviteLink = encodeURI(`${location.origin}${location.pathname}#/invite?sdkAppId=${sdkAppId}&userSig=${inviteUserSig}&roomId=${roomId}&userId=${inviteUserId}`); @@ -185,7 +198,7 @@ alert(this.$t('Please enter userId and roomId')); return; } - alert(129) + // alert(129) const userSigGenerator = new LibGenerateTestUserSig(this.sdkAppId, this.secretKey, 604800); this.userSig = userSigGenerator.genTestUserSig(this.userId); } else { @@ -216,6 +229,7 @@ // 鐐瑰嚮銆怢eave Room銆戞寜閽� async handleLeave() { await this.leave(); + this.disable = true }, // 鐐瑰嚮銆愬紑濮嬪睆骞曞垎浜�戞寜閽� @@ -239,6 +253,7 @@ // 鏄剧ず鎴愬姛鐨� Log addSuccessLog(log) { + // alert('鍔犲叆鎴愬姛') if (!this.isHostMode) { return; } @@ -252,6 +267,7 @@ // 鏄剧ず澶辫触鐨� Log addFailedLog(log) { + // alert('鍔犲叆澶辫触') if (!this.isHostMode) { return; } @@ -320,28 +336,28 @@ } .info-container { - width: 100%; + width: 0%; display: flex; justify-content: space-between; - .log-container { - flex-grow: 1; - border: 1px solid #dddddd; - height: 360px; - padding: 10px; - margin-right: 16px; - overflow-y: scroll; - .log-label { - margin: 0 0 6px; - font-weight: bold; - } - .log-state { - display: inline-block; - margin-right: 6px; - } - > div { - font-size: 12px; - } - } + // .log-container { + // flex-grow: 1; + // border: 1px solid #dddddd; + // height: 360px; + // padding: 10px; + // margin-right: 16px; + // overflow-y: scroll; + // .log-label { + // margin: 0 0 6px; + // font-weight: bold; + // } + // .log-state { + // display: inline-block; + // margin-right: 6px; + // } + // > div { + // font-size: 12px; + // } + // } .local-stream-container { width: 480px; height: 360px; -- Gitblit v1.9.1