This commit is contained in:
yj 2024-08-13 13:41:21 +08:00
parent dfd7dc0508
commit 55788f2906
3 changed files with 153 additions and 94 deletions

View File

@ -77,7 +77,6 @@ const InvitingPersonnelModal = forwardRef((props: any, ref: any) => {
})
]).then(res => {
if (res[0].code === 200 && res[1].code === 200) {
res[1].data.items.splice(res[1].data.items.findIndex((item: any) => item.uid === userInfo.uid), 1)
setList({
...list,
total: res[1].data.total,
@ -149,7 +148,7 @@ const InvitingPersonnelModal = forwardRef((props: any, ref: any) => {
})
}} disabled={!item.isOnline || item.account === userInfo.account || item.disabled} checked={item.checked}></Checkbox>
<div><Avatar name={item.userName} /></div>
<span>{item.userName}{item.disabled ? '(已入会)' : ''}</span>
<span>{item.userName}{item.account === userInfo.account ? '(我)' : ''}{item.disabled ? '(已入会)' : ''}</span>
</div>
<div style={{ color: item.isOnline ? '#02B188' : 'rgb(221 11 11)' }}>{item.isOnline ? '在线' : '离线'}</div>
</div>) : <span style={{ display: 'block', textAlign: 'center', color: 'white', padding: '30px 0' }}></span>}

View File

@ -349,7 +349,6 @@
position: relative;
padding: 10px 20px;
box-sizing: border-box;
cursor: pointer;
>div:nth-child(1) {
display: flex;
@ -370,49 +369,26 @@
display: flex;
align-items: center;
>div {
height: 30px;
width: 30px;
cursor: pointer;
display: flex;
justify-content: center;
align-items: center;
>img {
width: 20px;
margin-left: 4px;
}
}
>div:nth-child(3) {
position: absolute;
top: 50px;
left: 50%;
transform: translate(-50%, 0);
width: 160px;
z-index: 1;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
display: none;
background-color: rgb(16, 19, 23);
padding: 20px 0;
>div {
margin: 0 auto;
&:hover {
background-color: rgba(0, 0, 0, 0.5);
}
&::after {
content: "";
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
border-width: 0 10px 10px;
border-style: solid;
border-color: transparent transparent #333;
}
}
&:hover {
background-color: rgb(52, 52, 52);
>div:nth-child(3) {
display: flex;
}
}
}
}
@ -710,6 +686,20 @@
}
}
}
}
.meetingContentSwiperCardPopover {
display: flex;
flex-direction: column;
>button {
margin-bottom: 4px;
&:last-child {
margin-bottom: 0;
}
}
}
// 共享屏幕

View File

@ -546,14 +546,12 @@ const Meeting: React.FC = () => {
footerListTemplate[itemIndex][rowIndex].active = true
setFooterList(footerListTemplate)
await postOpenCamera(false, user.uid)
await agora.stopCameraCapture();
break;
case '开启视频':
footerListTemplate[itemIndex][rowIndex].title = '关闭视频'
footerListTemplate[itemIndex][rowIndex].active = false
setFooterList(footerListTemplate)
await postOpenCamera(true, user.uid)
await agora.startCameraCapture()
break;
case '设置':
stupWizardRef.current.changeModal()
@ -732,6 +730,11 @@ const Meeting: React.FC = () => {
}
// 开关视频
const postOpenCamera = async (enableCamera: boolean, uid: string): Promise<void> => {
if (enableCamera) {
await agora.startCameraCapture()
} else {
await agora.stopCameraCapture();
}
await PostOpenCamera({
roomNum: state.channelId,
uid,
@ -889,13 +892,72 @@ const Meeting: React.FC = () => {
{String(isShare) === item.screenShareId ? <div className={styles.meetingContentSwiperCardShare}>
</div> : null}
<Popover placement="top" title={''} content={
<div>
<Popover placement="bottom" title={''} content={
<div className={styles.meetingContentSwiperCardPopover}>
<Button
type="primary"
className='m-ant-btn'
onClick={() => setAllUserLook(item)}
size={'small'}
onClick={(event) => {
event.stopPropagation();
setAllUserLook(item)
}}
>Ta</Button>
{item.uid !== user.uid ? <Button
type="primary"
className='m-ant-btn'
size={'small'}
onClick={(event) => {
event.stopPropagation();
GetRoomKickout(state.channelId, item.id).then(res => {
if (res.code === 200) {
onInvoke('sendOper', {
roomNum: state.channelId,
type: 3,
})
}
})
}}
></Button> : null}
{item.uid !== user.uid && user.roleId === '1' ? <Button
type="primary"
className='m-ant-btn'
size={'small'}
onClick={(event) => {
event.stopPropagation();
if (item.isRoomManager) {
DeleteRoomManager({
roomId: state.roomId,
roomNum: state.channelId,
userId: item.uid
})
} else {
PostRoomManager({
roomId: state.roomId,
roomNum: state.channelId,
userId: item.uid
})
}
}}
>{item.isRoomManager ? '取消房间管理员' : '设为房间管理员'}</Button> : null}
<Button
type="primary"
className='m-ant-btn'
size={'small'}
onClick={(event) => {
event.stopPropagation();
postOpenMicr(!item.enableMicr, item.uid)
}}
>{item.enableMicr ? '静音' : '解除静音'}</Button>
<Button
type="primary"
className='m-ant-btn'
size={'small'}
onClick={(event) => {
event.stopPropagation();
postOpenCamera(!item.enableCamera, item.uid)
}}
>{item.enableCamera ? '关闭视频' : '打开视频'}</Button>
</div>
}>
<div className={styles.meetingContentOperation}>
@ -1012,45 +1074,45 @@ const Meeting: React.FC = () => {
: null}
</span>
</div>
<div>
<div>
<img src={item.enableMicr ? ImageUrl.icon22 : ImageUrl.icon22Active} alt="" onClick={() => {
postOpenMicr(!item.enableMicr, item.uid)
}} title={item.enableMicr ? '静音' : '解除声音'} />
</div>
<div>
<img src={item.enableCamera ? ImageUrl.icon23 : ImageUrl.icon23Active} alt="" onClick={() => {
postOpenCamera(!item.enableCamera, item.uid)
}} title={item.enableCamera ? '关闭视频' : '开启视频'} />
</div>
{item.uid !== user.uid && user.roleId === '1' ? <div className='drag'>
{!item.isRoomManager ? <Button
{item.uid !== user.uid && user.roleId === '1' ? <div>
<Popover placement="left" title={''} content={
<div className='drag'>
<Button
type="primary"
className='m-ant-btn'
style={{ marginBottom: '10px', width: '80%' }}
size={'small'}
onClick={() => {
PostRoomManager({
roomId: state.roomId,
roomNum: state.channelId,
userId: item.uid
})
}}
></Button> : <Button
type="primary"
className='m-ant-btn'
style={{ marginBottom: '10px', width: '80%' }}
style={{ marginBottom: '10px', width: '100%' }}
size={'small'}
onClick={() => {
if (item.isRoomManager) {
DeleteRoomManager({
roomId: state.roomId,
roomNum: state.channelId,
userId: item.uid
})
} else {
PostRoomManager({
roomId: state.roomId,
roomNum: state.channelId,
userId: item.uid
})
}
}}
></Button>}
>{item.isRoomManager ? '取消房间管理员' : '设为房间管理员'}</Button>
<Button
type="primary"
className='m-ant-btn'
style={{ width: '80%' }}
style={{ width: '100%' }}
size={'small'}
onClick={() => {
GetRoomKickout(state.channelId, item.id).then(res => {
@ -1063,7 +1125,15 @@ const Meeting: React.FC = () => {
})
}}
></Button>
</div>
}>
<EllipsisOutlined style={{
color: '#fff',
fontSize: '20px'
}} />
</Popover>
</div> : null}
</div>
</div> : null
)
}