From 33db09c023fd9a724f62c8578e92a1f9458e13e4 Mon Sep 17 00:00:00 2001 From: yj <1336058017@qq.com> Date: Mon, 22 Jul 2024 14:32:15 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../InvitingPersonnelModal/index.tsx | 24 +++-- src/page/Home/index.tsx | 1 + src/page/Meeting/index.tsx | 99 +++++++++++-------- 3 files changed, 76 insertions(+), 48 deletions(-) diff --git a/src/components/InvitingPersonnelModal/index.tsx b/src/components/InvitingPersonnelModal/index.tsx index 3f82746..5132fc8 100644 --- a/src/components/InvitingPersonnelModal/index.tsx +++ b/src/components/InvitingPersonnelModal/index.tsx @@ -10,11 +10,13 @@ import { storage } from '@/utils'; const InvitingPersonnelModal = forwardRef((props: any, ref: any) => { useImperativeHandle(ref, () => ({ changeInvitingPersonnelModal: () => { + getUserList() setIsInvitingPersonnelModal(true) } })) const { state } = useLocation(); const [isInvitingPersonnelModal, setIsInvitingPersonnelModal] = useState(false); + const [isFirstRender, setIsFirstRender] = useState(true); const [operation, setOperation] = useState<{ options: { label: string; value: number }[]; optionsValue: number[]; @@ -35,17 +37,25 @@ const InvitingPersonnelModal = forwardRef((props: any, ref: any) => { const [checkedList, setCheckedList] = useState([]) useEffect(() => { - getUserList() + if (isFirstRender) { + setIsFirstRender(false); + } else { + getUserList() + } }, [list.pageIndex]); useEffect(() => { - if (list.pageIndex === 1) { - getUserList() + if (isFirstRender) { + setIsFirstRender(false); } else { - setList({ - ...list, - pageIndex: 1 - }) + if (list.pageIndex === 1) { + getUserList() + } else { + setList({ + ...list, + pageIndex: 1 + }) + } } }, [operation.optionsValue]); diff --git a/src/page/Home/index.tsx b/src/page/Home/index.tsx index 64bedfb..e7a722e 100644 --- a/src/page/Home/index.tsx +++ b/src/page/Home/index.tsx @@ -137,6 +137,7 @@ const Home: React.FC = () => { } navigate('/login') + storage.removeItem('user') }} onCancel={() => { diff --git a/src/page/Meeting/index.tsx b/src/page/Meeting/index.tsx index 012878f..bb6b7eb 100644 --- a/src/page/Meeting/index.tsx +++ b/src/page/Meeting/index.tsx @@ -1,6 +1,8 @@ import styles from '@/page/Meeting/index.module.scss' import { useEffect, useRef, useState } from "react"; import Operation from '@/components/Operation'; +import SpeakerModeModal from '@/components/SpeakerModeModal'; +import InvitingPersonnelModal from '@/components/InvitingPersonnelModal'; import { Button, Input, Popover, Modal, Checkbox, message, Table, Pagination } from "antd"; import { DeleteOutlined, ProfileOutlined, ReloadOutlined, SearchOutlined, VerticalAlignBottomOutlined } from '@ant-design/icons'; import { useLocation, useNavigate } from 'react-router-dom'; @@ -10,12 +12,11 @@ import { GetRoomFile, PostRoomFile, DeleteRoomFile, GetRoomUpFileurl, GetRoomFil import axios from 'axios'; import ImageUrl from '@/utils/package/imageUrl' import agora from '@/utils/package/agora' -import SpeakerModeModal from '@/components/SpeakerModeModal'; import { onInvoke, onSignalr, offSignalr } from '@/utils/package/signalr'; import dayjs from 'dayjs'; import durationPlugin from 'dayjs/plugin/duration'; import { VideoSourceType } from 'agora-electron-sdk'; -import InvitingPersonnelModal from '@/components/InvitingPersonnelModal'; +import { GetUserList } from '@/api/Home/User'; dayjs.extend(durationPlugin); const { Column } = Table const Meeting: React.FC = () => { @@ -109,6 +110,7 @@ const Meeting: React.FC = () => { pageSize: 10, }) const [roomUserList, setRoomUserList] = useState([]) + const [allUserList, setAllUserList] = useState([]) const [chatList, setChatList] = useState([]) const [currentVideoId, setCurrentVideoId] = useState('') let [currentSeconds, setCurrentSeconds] = useState(0) @@ -116,7 +118,6 @@ const Meeting: React.FC = () => { const [open, setOpen] = useState(false) const [meetingMode, setMeetingMode] = useState('') const [userSearchValue, setUserSearchValue] = useState('') - const [xx, setxx] = useState(true) useEffect(() => { let time = null as any; if (isInit) { @@ -149,13 +150,12 @@ const Meeting: React.FC = () => { }) }, 1000); }, - onUserOffline: async (info: any, remoteUid: any, reason: any) => { + onUserOffline: async (info: any, remoteUid: any, _reason: any) => { await agora.setupRemoteVideo({ account: Number(remoteUid), view: document.getElementById(`video-${remoteUid}`) as HTMLElement, channelId: info.channelId, }) - setxx(false) setTimeout(() => { getRoomUser() }, 1000); @@ -389,14 +389,38 @@ const Meeting: React.FC = () => { } // 获取房间用户 const getRoomUser = async (): Promise => { - await GetRoomUser(state.channelId).then(res => { - if (res.code === 200) { - setRoomUserList(res.data.map((item: any) => { + Promise.all([ + GetRoomUser(state.channelId), + GetUserList({ + pageIndex: 1, + pageSize: 9999, + searchKeywod: '', + isOnline: true, + }) + ]).then(res => { + if (res[0].code === 200 && res[1].code === 200) { + setRoomUserList(res[0].data.map((item: any) => { return { isShow: true, ...item } })) + res[1].data.items.forEach((item: any) => { + const itemUser = res[0].data.find((row: any) => row.account === item.account) + if (itemUser) { + item.isRoom = true; + for (const itemUserKey in itemUser) { + for (const key in item) { + if (itemUserKey === key) { + item[key] = itemUser[itemUserKey]; + } + } + } + } else { + item.isRoom = false; + } + }); + setAllUserList(res[1].data.items); } }) } @@ -516,40 +540,33 @@ const Meeting: React.FC = () => {
- {xx ?
-
-
- 暂无视频 -
-
-
: null} -
-
-
- 暂无视频 -
-
-
- {/* {roomUserList.map((item: any, index: number) => -
{ - if (footerList[1][3].active) { - return message.error('视频录制中请勿切换，或结束录制再切换！') + {allUserList.map((item: any, index: number) => { + return ( + <> + {item.isRoom ? +
{ + if (footerList[1][3].active) { + return message.error('视频录制中请勿切换，或结束录制再切换！') + } + setCurrentVideoId(item.account) + }} + > +
+
+ 暂无视频 +
+
+ {meetingContentUser(item)} + {item.enableCamera ? null : meetingContentError(currentVideoId, item)} +
: null } - setCurrentVideoId(item.account) - }} - > -
-
- 暂无视频 -
-
- {meetingContentUser(item)} - {item.enableCamera ? null : meetingContentError(currentVideoId, item)} -
- )} */} + + ) + } + )}
{