marking
/
WGShare.Client.Wx
19
0
Fork 0
Code Pull Requests Actions Releases 2 Activity

优化

This commit is contained in:
yj 2025-02-24 14:34:14 +08:00
parent a95e977ca1
commit 9c4e9cb918
4 changed files with 154 additions and 166 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
pages/meeting/index.scss
View File

@ -10,7 +10,7 @@
border-radius: 4rpx;
padding: 2rpx;
bottom: 4rpx;
width: calc(100% - 12rpx);
max-width: calc(100% - 12rpx);
box-sizing: border-box;
&-view {

289
pages/meeting/index.ts
View File

@ -9,7 +9,6 @@ import dayjs from 'dayjs';
const computedBehavior = require('miniprogram-computed').behavior;
let reconnectTime = "" as any;
let refreshTime = "" as any;
let isReconnecTimeSetTimeout = "" as any;
let isAutoApplySpeakTime = "" as any;
Page({
behaviors: [computedBehavior],
@ -104,9 +103,9 @@ Page({
isFirstShow: true,
isCurrePage: true,
isReconnec: false,
isReconnecTime: false,
isAutoApplySpeakDialog: false,
showScroll: false,
reconnecNumber: 0
},
watch: {
'roomUserList.**': function (roomUserList) {
@ -173,31 +172,9 @@ Page({
}, 10000);
}
},
'isReconnecTime': function (isReconnecTime) {
if (isReconnecTime) {
isReconnecTimeSetTimeout = setTimeout(() => {
clearTimeout(isReconnecTimeSetTimeout)
this.setData({
isReconnec: true,
isReconnecTime: false,
})
isReconnecTimeSetTimeout = ''
wx.hideLoading()
}, 10000)
} else {
if (isReconnecTimeSetTimeout) {
clearTimeout(isReconnecTimeSetTimeout)
isReconnecTimeSetTimeout = ''
wx.hideLoading()
}
}
},
'isCurrePage': function (isCurrePage) {
if (isCurrePage) {
if (refreshTime) {
clearInterval(refreshTime)
refreshTime = ''
}
this.clearTimer()
} else {
refreshTime = setInterval(() => {
GetRoomUser(this.data.channelId).then(res => {
@ -213,8 +190,6 @@ Page({
});
this.changeAgoraDevice()
}
}).catch(() => {
this.setIsConnectedBack()
})
}, 1000 * 30)
}
@ -293,7 +268,7 @@ Page({
onReady() {
wx.onNetworkStatusChange(this.listener)
},
onShow() {
async onShow() {
wx.setKeepScreenOn({
keepScreenOn: true,
});
@ -305,83 +280,105 @@ Page({
isFirstShow: false,
})
} else {
const item = this.data.roomUserList.find(row => row.uid === this.data.user.uid)
if (item && !item.isRoomManager) {
wx.showLoading({
title: '重连中',
mask: true
})
this.setData({
isReconnecTime: true,
})
agora.destroy(() => {
reconnectTime = setInterval(() => {
if (getSignIr() === signalR.HubConnectionState.Connected) {
this.reconnecFun()
clearInterval(reconnectTime)
this.reconnecFun()
}
},
// 隐藏
onHide() {
this.setData({
isCurrePage: true,
})
this.clearTimer()
},
// 卸载
onUnload() {
wx.offNetworkStatusChange(this.listener)
this.clearTimer()
},
async reconnecFun() {
wx.hideLoading()
wx.showLoading({
title: '重连中',
mask: true
})
if (reconnectTime) {
clearTimeout(reconnectTime)
reconnectTime = ''
}
agora.destroy(() => {
this.startReconnec()
reconnectTime = setInterval(() => {
this.startReconnec()
}, 3000)
})
},
async startReconnec() {
if (getSignIr() === signalR.HubConnectionState.Connected) {
await GetRoomRtcToken(this.data.channelId).then(res => {
if (res.code === 200) {
agora.reconnecSetOption(res.data, async (bool) => {
if (bool) {
await this.joinChannel()
this.startClientEvent()
this.startSignalr()
await this.getRoomUser()
await this.getShowUser()
Message.success({
context: this,
offset: [20, 32],
duration: 3000,
content: '重连成功',
});
clearTimeout(reconnectTime)
reconnectTime = ''
this.setData({
isReconnec: false
})
} else {
this.setData({
isReconnec: true
})
}
}, 2000)
wx.hideLoading()
})
} else {
wx.hideLoading()
this.setData({
isReconnec: true
})
}
}).catch(() => {
wx.hideLoading()
this.setData({
isReconnec: true
})
})
} else {
if (this.data.reconnecNumber > 10) {
this.setIsConnectedBack()
} else {
this.setData({
currentUser: '',
currentUid: ''
}, () => {
this.getShowUser()
reconnecNumber: this.data.reconnecNumber + 1
})
}
}
},
onHide() {
this.setData({
isCurrePage: true,
isReconnecTime: false
})
if (reconnectTime) {
clearInterval(reconnectTime)
reconnectTime = ''
}
if (isReconnecTimeSetTimeout) {
clearInterval(isReconnecTimeSetTimeout)
isReconnecTimeSetTimeout = ''
}
// 清除定时器
clearTimer() {
if (refreshTime) {
clearInterval(refreshTime)
refreshTime = ''
}
},
onUnload() {
wx.offNetworkStatusChange(this.listener)
if (reconnectTime) {
clearInterval(reconnectTime)
reconnectTime = ''
}
if (isReconnecTimeSetTimeout) {
clearInterval(isReconnecTimeSetTimeout)
isReconnecTimeSetTimeout = ''
}
if (refreshTime) {
clearInterval(refreshTime)
refreshTime = ''
}
if (isAutoApplySpeakTime) {
clearTimeout(isAutoApplySpeakTime)
isAutoApplySpeakTime = ''
}
},
setIsConnectedBack() {
wx.setStorage({
key: "isConnected",
data: true
})
wx.disableAlertBeforeUnload({
complete: () => {
onStop()
wx.navigateBack()
}
})
},
// 显示聊天输入框
showInputPopup() {
this.setData({
inputPopupVisible: true,
@ -389,6 +386,7 @@ Page({
chatPopupVisible: false
})
},
// 隐藏聊天输入框
hideInputPopup() {
this.setData({
inputPopupVisible: false,
@ -396,6 +394,7 @@ Page({
chatPopupVisible: true
})
},
// 申请发言提示框
confirmIsAutoApplySpeakDialog() {
if (!this.data.isClicked) {
GetApplySpeak(this.data.channelId).then(res => {
@ -417,53 +416,15 @@ Page({
this.message('申请太频繁了，请稍后重试！').error();
}
},
// 关闭发言断开弹窗
cancelIsAutoApplySpeakDialog() {
this.setData({
isAutoApplySpeakDialog: false
})
},
async reconnecFun() {
offSignalr()
await GetRoomRtcToken(this.data.channelId).then(res => {
if (res.code === 200) {
agora.reconnecSetOption(res.data, async (bool) => {
if (bool) {
await this.joinChannel()
this.startClientEvent()
this.startSignalr()
await this.getRoomUser()
await this.getShowUser()
Message.success({
context: this,
offset: [20, 32],
duration: 3000,
content: '重连成功',
});
this.setData({
isReconnecTime: false,
isReconnec: false
})
} else {
this.setData({
isReconnec: true
})
}
wx.hideLoading()
})
} else {
wx.hideLoading()
this.setData({
isReconnec: true
})
}
}).catch(() => {
wx.hideLoading()
this.setData({
isReconnec: true
})
})
},
// socket监听
startSignalr() {
offSignalr()
onSignalr(async (item) => {
if (this.data.isCurrePage) {
const item = this.data.roomUserList.find(row => row.uid === this.data.user.uid)
@ -496,12 +457,7 @@ Page({
key: "isAllLeave",
data: true
})
wx.disableAlertBeforeUnload({
complete: () => {
onStop()
wx.navigateBack()
}
})
this.closeRoom()
break;
// 移出会议
case 'ForceExitRoom':
@ -509,12 +465,7 @@ Page({
key: "isForceExitRoom",
data: true
})
wx.disableAlertBeforeUnload({
complete: () => {
onStop()
wx.navigateBack()
}
})
this.closeRoom()
break;
// 更新视图模式
case 'RefreshView':
@ -675,6 +626,7 @@ Page({
}
})
},
// 声网监听
startClientEvent() {
agora.clientEvent({
streamAdded: async (url: string, uid: number | string) => {
@ -722,10 +674,11 @@ Page({
}
},
error: (e) => {
this.setIsConnectedBack()
this.reconnecFun()
},
})
},
// 获取房间用户
async getRoomUser(): Promise<void> {
await GetRoomUser(this.data.channelId).then(res => {
if (res.code === 200) {
@ -740,6 +693,7 @@ Page({
}
})
},
// 成员显示用户名称
showMultiText(e) {
Toast({
context: this,
@ -747,6 +701,7 @@ Page({
message: e.currentTarget.dataset.item.userName,
});
},
// 查看全员观看
async getShowUser(): Promise<void> {
await GetShowUser(this.data.channelId).then(async (res) => {
if (res.code === 200 && res.data) {
@ -756,6 +711,7 @@ Page({
}
})
},
// 首次获取用户信息
async getRoomInfo(): Promise<void> {
await GetRoomInfo(this.data.channelId).then(async (res) => {
if (res.code === 200) {
@ -765,14 +721,26 @@ Page({
}
})
},
// 加入房间
async joinChannel(): Promise<void> {
const item = this.data.roomUserList.find(row => row.uid === this.data.user.uid)
await onInvoke('joinChannel', {
roomNum: this.data.channelId,
enableMicr: this.data.footerList[1].active,
enableCamera: this.data.footerList[2].active,
isRoomManager: item ? item.isRoomManager : false,
})
await agora.joinChannel()
agora.joinChannel(item ? item.isRoomManager : false, (url: string) => {
const roomUserListTemp = [...this.data.roomUserList]
const itemUser = roomUserListTemp.find(row => row.uid == this.data.user.uid)
itemUser.src = url
this.setData({
roomUserList: roomUserListTemp,
})
})
this.changeAgoraDevice()
},
// 用户数据组装
async setAllUserListData(key: string, item: any, callBack?: Function): Promise<void> {
const { roomUserList } = this.data;
const userInfo: any = await getStorage('user')
@ -858,6 +826,7 @@ Page({
}
this.changeAgoraDevice()
},
// 点击底部按钮
async changeFooterList(e): Promise<void> {
const userInfo: any = await getStorage('user')
const { index } = e.currentTarget.dataset;
@ -960,6 +929,7 @@ Page({
break;
}
},
// 开关摄像头
async postOpenMicrApi(enableMicr: boolean, uid: string, isAll: boolean, isMessage: boolean = false): Promise<void> {
if (isAll) {
await PostMuteAll({
@ -986,6 +956,7 @@ Page({
this.message('操作成功').success()
}
},
// 开关摄像头
async postOpenCameraApi(enableCamera: boolean, uid: string, isMessage: boolean = false): Promise<void> {
if (enableCamera) {
// await agora.startCameraCapture()
@ -1010,6 +981,7 @@ Page({
this.message('操作成功').success()
}
},
// 关闭弹窗
async closeDialog(e) {
const { type } = e.currentTarget.dataset;
switch (e.type) {
@ -1029,7 +1001,6 @@ Page({
case "leaveDialog":
wx.disableAlertBeforeUnload({
complete: () => {
onStop()
wx.navigateBack()
}
})
@ -1043,12 +1014,7 @@ Page({
break;
}
},
playerStateChange(e) {
},
recorderStateChange(e) {
},
// 音量提示
playerAudioVolumenotify(e) {
const { uid } = e.currentTarget.dataset;
const { volume } = e.detail;
@ -1063,12 +1029,14 @@ Page({
userVolume: audioListTemp.find(row => row.uid == this.data.user.uid).volume
})
},
// 切换视频
clickChangeVideo(e) {
const { item } = e.currentTarget.dataset;
this.setData({
currentUid: item.uid
})
},
// 悬浮提示
message(content: string) {
return {
success: () => {
@ -1089,6 +1057,7 @@ Page({
}
}
},
// 获取当前用户在房间信息
async getUserRoomInfo(): Promise<any> {
const userInfo: any = await getStorage('user')
return new Promise((resolve, _reject) => {
@ -1100,6 +1069,7 @@ Page({
}
})
},
// 更改数据
async changeAgoraDevice(): Promise<any> {
const userInfo: any = await getStorage('user')
this.data.roomUserList.forEach(async (item: any) => {
@ -1118,27 +1088,32 @@ Page({
}
});
},
// 退出提示
async back() {
this.setData({
leaveDialog: true
})
},
// 关闭聊天和成员
onVisibleChange() {
this.setData({
userPopupVisible: false,
chatPopupVisible: false,
})
},
// 聊天内容输入框赋值
changeMessageStr(e) {
this.setData({
messageStr: e.detail.value
})
},
// 聊天内容输入框赋值
changeInputStr(e) {
this.setData({
inputStr: e.detail.value
})
},
// 聊天发送
async sendMeg(e) {
if (this.data.messageStr || e.target.dataset.item) {
await onInvoke('sendChannelMsg', {
@ -1164,11 +1139,13 @@ Page({
this.message('请输入文字！').error()
}
},
// 全屏切换
changeFullscreen() {
this.setData({
isFullscreen: !this.data.isFullscreen
})
},
// 聊天框位置滚动
scrollToBottom() {
wx.createSelectorQuery()
.select('#chatView')
@ -1180,27 +1157,38 @@ Page({
})
})
},
// 断网退出房间
setIsConnectedBack() {
wx.setStorage({
key: "isConnected",
data: true
})
wx.disableAlertBeforeUnload({
complete: () => {
wx.navigateBack()
}
})
},
// 监听网络变化
async listener(res) {
if (res.isConnected && (res.networkType !== 'none' || res.networkType !== 'unknown')) {
} else {
this.setIsConnectedBack()
}
},
// 重连失败退出房间
closeRoom() {
wx.disableAlertBeforeUnload({
complete: () => {
this.setData({
isReconnec: false
})
onStop()
wx.navigateBack()
}
})
},
scroll() {
},
// 上箭头滚动
scrollUp() {
const query = wx.createSelectorQuery()
query.select('#meeting-content-smallvideo').scrollOffset((res => {
@ -1210,6 +1198,7 @@ Page({
}))
query.exec()
},
// 下箭头滚动
scrollDown() {
const query = wx.createSelectorQuery()
query.select('#meeting-content-smallvideo').scrollOffset((res => {

12
pages/meeting/index.wxml
View File

@ -16,10 +16,10 @@
<t-icon name="fullscreen-2" size="24rpx" data-name="fullscreen-2" wx:else />
</view>
<view class="meeting-content-video-canvas" wx:if="{{currentUser.shareSrc}}">
<live-player id="player" src="{{currentUser.shareSrc}}" mode="RTC" autoplay="true" bindstatechange="playerStateChange" object-fit="contain" />
<live-player id="player" src="{{currentUser.shareSrc}}" mode="RTC" autoplay="true" object-fit="contain" />
</view>
<view class="meeting-content-video-canvas" wx:else>
<live-player id="player" src="{{currentUser.src}}" mode="RTC" autoplay="true" bindstatechange="playerStateChange" object-fit="contain" muted="{{currentUser.uid === user.uid}}" />
<live-player id="player" src="{{currentUser.src}}" mode="RTC" autoplay="true" object-fit="contain" muted="{{currentUser.uid === user.uid}}" />
</view>
<view class="meeting-content-video-user">
<view class="meeting-content-video-user-view" wx:if="{{currentUser.roleId === '1' || currentUser.roleId === '3'}}" style=" background:#FDC229">
@ -29,7 +29,7 @@
<text class="meeting-content-video-user-text">{{currentUser.userName}}</text>
</view>
</view>
<scroll-view scroll-y class="meeting-content-smallvideo" id="meeting-content-smallvideo" style="width: {{isFullscreen ? '0' :'170px'}}" bindscroll='scroll' scroll-top="{{scrollTop}}">
<scroll-view scroll-y class="meeting-content-smallvideo" id="meeting-content-smallvideo" style="width: {{isFullscreen ? '0' :'170px'}}" scroll-top="{{scrollTop}}">
<view class="meeting-content-smallvideo-box" id="video-{{item.uid}}" wx:for="{{roomUserList}}" data-item="{{item}}" wx:key="index" bind:tap="clickChangeVideo" wx:if="{{item.isRoom && item.isAdmin}}">
<view class="meeting-content-smallvideo-box-view {{item.uid == currentUid ? 'active' : ''}}">
<view class="meeting-content-smallvideo-box-view-avatar {{item.uid == currentUid ? 'active' : ''}}" wx:if="{{!item.enableCamera}}">
@ -38,8 +38,8 @@
</view>
</view>
<view class="meeting-content-smallvideo-box-view-canvas" wx:if="{{item.src}}">
<live-pusher wx:if="{{user.uid === item.uid}}" url="{{item.src}}" mode="RTC" object-fit="contain" bindstatechange="recorderStateChange" background-mute enable-mic="{{footerList[1].active}}" enable-camera max-bitrate="500" min-bitrate="200" autopush enable-agc enable-ans device-position="front" class="meeting-content-smallvideo-box-view-canvas-play" data-uid="{{item.uid}}" bindaudiovolumenotify="playerAudioVolumenotify" beauty='{{9}}' whiteness='{{9}}' />
<live-player src="{{item.src}}" class="meeting-content-smallvideo-box-view-canvas-play" mode="RTC" autoplay="true" bindstatechange="playerStateChange" object-fit="contain" data-uid="{{item.uid}}" bindaudiovolumenotify="playerAudioVolumenotify" wx:else />
<live-pusher wx:if="{{user.uid === item.uid}}" url="{{item.src}}" mode="RTC" object-fit="contain" background-mute enable-mic="{{footerList[1].active}}" enable-camera max-bitrate="500" min-bitrate="200" autopush enable-agc enable-ans device-position="front" class="meeting-content-smallvideo-box-view-canvas-play" data-uid="{{item.uid}}" bindaudiovolumenotify="playerAudioVolumenotify" beauty='{{9}}' whiteness='{{9}}' />
<live-player src="{{item.src}}" class="meeting-content-smallvideo-box-view-canvas-play" mode="RTC" autoplay="true" object-fit="contain" data-uid="{{item.uid}}" bindaudiovolumenotify="playerAudioVolumenotify" wx:else />
</view>
<view class="meeting-content-smallvideo-box-view-user">
<view class="meeting-content-smallvideo-box-view-user-view" wx:if="{{item.roleId === '1' || item.roleId === '3'}}" style=" background:#FDC229">
@ -146,4 +146,4 @@
</t-popup>
<t-dialog visible="{{isReconnec}}" content="重连失败，请退出重试！" confirm-btn="{{ { content: '确定', variant: 'base', theme: 'primary' } }}" data-type="isReconnec" cancel-btn="{{null}}" bind:confirm="closeRoom" style="transform: scale(0.5) translate3d(-50%, -50%, 0);" close-btn="{{false}}" />
<t-dialog visible="{{isAutoApplySpeakDialog}}" content="由于您长时间未发言，已自动取消发言权限，是否重新申请发言？" cancel-btn="取消" confirm-btn="{{ { content: '确定', variant: 'base', theme: 'primary' } }}" data-type="isAutoApplySpeakDialog" bind:cancel="cancelIsAutoApplySpeakDialog" bind:confirm="confirmIsAutoApplySpeakDialog" style="transform: scale(0.5) translate3d(-50%, -50%, 0);" close-btn="{{false}}" />
<t-toast id="t-toast" style="transform: scale(0.5) translate3d(-50%, -50%, 0);transform-origin: 0% 0%;"/>
<t-toast id="t-toast" style="transform: scale(0.5) translate3d(-50%, -50%, 0);transform-origin: 0% 0%;" />

17
utils/agora.ts
View File

@ -22,13 +22,10 @@ export const agora = {
destroy: async (callback?) => {
if (client) {
await client.leave()
await client.destroy(() => {
callback?.()
client = '';
})
} else {
callback?.()
await client.destroy()
client = '';
}
callback?.()
},
// 设置角色
setRole: async (isRoomManager: boolean, callBack?: Function) => {
@ -54,9 +51,11 @@ export const agora = {
await agora.init(callback)
},
// 加入频道
joinChannel: () => {
client.join(option.token, option.channelId, option.uid, () => {
agora.setRole(false)
joinChannel: async (roleStatus: boolean, callBack: Function) => {
await client.join(option.token, option.channelId, option.uid, () => {
agora.setRole(roleStatus, (url) => {
callBack(url)
})
})
},
// 刷新token