From 7a4d48b89c8c4d31db703343733210e415474f8c Mon Sep 17 00:00:00 2001
From: yj <1336058017@qq.com>
Date: Fri, 19 Jul 2024 16:15:35 +0800
Subject: [PATCH] =?UTF-8?q?=E9=82=80=E8=AF=B7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.tsx                                   |   6 +-
 src/assets/icon37.png                         | Bin 0 -> 936 bytes
 src/assets/icon38.png                         | Bin 0 -> 794 bytes
 .../InvitingPersonnelModal/index.tsx          |   1 +
 .../JoinMeetingModal/index.module.scss        |  55 +++++++++++
 src/components/JoinMeetingModal/index.tsx     |  88 ++++++++++++++++++
 src/utils/package/imageUrl.ts                 |   4 +
 7 files changed, 153 insertions(+), 1 deletion(-)
 create mode 100644 src/assets/icon37.png
 create mode 100644 src/assets/icon38.png
 create mode 100644 src/components/JoinMeetingModal/index.module.scss
 create mode 100644 src/components/JoinMeetingModal/index.tsx

diff --git a/src/App.tsx b/src/App.tsx
index 13672b1..ec94919 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,5 +1,5 @@
 
-import { useEffect, useState } from "react";
+import { useEffect, useState, useRef } from "react";
 import '@/utils/styles/App.scss'
 import { Route, Routes, useNavigate, Navigate } from 'react-router-dom';
 import Home from '@/page/Home/index'
@@ -11,9 +11,11 @@ import NotFound from '@/page/NotFound/index'
 import { storage } from '@/utils'
 import { Spin } from "antd";
 import { onSignalr, offSignalr } from "@/utils/package/signalr";
+import JoinMeetingModal from "./components/JoinMeetingModal";
 
 const App: React.FC = () => {
   const navigate = useNavigate();
+  const joinMeetingModalRef = useRef<any>();
   const [_windowSize, setWindowSize] = useState({
     width: window.innerWidth,
     height: window.innerHeight,
@@ -66,6 +68,7 @@ const App: React.FC = () => {
             body: item.roomName,
             name: item.InviterName,
           })
+          joinMeetingModalRef.current.changeModal(item)
           break;
       }
     })
@@ -106,6 +109,7 @@ const App: React.FC = () => {
         <Route path='*' element={<NotFound />} />
       </Routes>
       <Spin spinning={spinning} fullscreen />
+      <JoinMeetingModal ref={joinMeetingModalRef} />
     </>
   )
 }
diff --git a/src/assets/icon37.png b/src/assets/icon37.png
new file mode 100644
index 0000000000000000000000000000000000000000..cd1cfc5e56614df029d597648c323c9d7cab2336
GIT binary patch
literal 936
zcmV;Z16TZsP)<h;3K|Lk000e1NJLTq001Tc001Tk1^@s6s6FYf00009a7bBm000XU
z000XU0RWnu7ytkO0drDELIAGL9O(c600d`2O+f$vv5yP<VFdsH13gJZK~#7F?U+qZ
z6G0fq|1-t-LNvt$j<V&Vi3cE2ue2USBMEK40Q9COym1rj7igMzCmc1=EinYe2y3{h
zhaU7uSS}`FqD@ptOxf|7<*obHoo;tI@jEoxotf=F&ph+I3~)+kFm%ImUZdYEz%|Ev
zVbvjE;(o1;h;%M&IiKa6PYQ-<`tx+iY?Cn<)}FP1do=@z2qQr(#pWPb7Exfr5PPCT
z0!@|aTxrtVVuf+O7Fm>p*3vgN`Mctr%JlXY)AMQ8%k-`U`6BAV5`}iw3l>I>ZCeS@
zkPN2Su|`p-HT(txx03Oco}eg+X75G-zQV|-$PdH_l7?J_e6Hd*<lV~sE!@NjA}lNC
z4ktbCNsO`ipbu#01~55r3+Xc#>}PZL2Nu4qp<84a5`f`&=a?a5)xN{~GIM1Dm1`x(
zyUhASZ0&BNTijN2_!v*|sdkGS%|A#C#`3L?4q-ybycbNPx#M}4?YoXRAQzhQ7q*m_
zr%-FR_`}byo_AxH;}J%r@xC|+kFcJU7Phj{{EPbU;{z+5zr67RvGET%c!XJMacgn=
z<B_P`=f|-)ehV5r!W5})E!n<ilAxGHIp|oJ+|KIOYh=l{W(Fsa6denbNUO=MtXwT&
ztS>g_chDltGNFjH+HLYLxuyE(tVf*85Hb+wDNBr8(x9CmQ2Q{qj!N<4$R8m`4qwbb
zADN{;?zc~8dE>b)YV~H>Bc}A_S!ntaO)7&9`UFQxVk^a83U#~#DPZ-+Q(K&Qa2Wh7
zBt?gW7E_GB${ap8BfljU&>>RH(E5XYYmp%3ZF50c$7p@#uF)DIBCRn*30-bkYY<jf
zW;u-FsmIux!Wt#6EV?A!(~Du-@%!!P#qXc&L*uK7Iw;)Hb8Ur%l|D&8B~QlPn0VtD
z)kH#wDozM05X*kuQec-9*Os=2)y4SBQNNME$S=-P-$#cI$zcj>uMjjCoRV_2hF$Jb
zbBdTDS266KGE&3a%5w1u<4|ht6+~5WSAP^Xuaip^jeKsNMf5vqCHg6=-ugtkhN5ND
zjI%L>b?OWa(WGp`C~zls4durQ^$CK+S=?3q+Lel-dgXLV9Q+3>f<DARt7FUn0000<
KMNUMnLSTYii?pHu

literal 0
HcmV?d00001

diff --git a/src/assets/icon38.png b/src/assets/icon38.png
new file mode 100644
index 0000000000000000000000000000000000000000..e2548c7655d395e50db77d44e9d7af0ab815fd88
GIT binary patch
literal 794
zcmV+#1LgdQP)<h;3K|Lk000e1NJLTq001Wd001Tk1^@s6NB@G500009a7bBm000XU
z000XU0RWnu7ytkO0drDELIAGL9O(c600d`2O+f$vv5yP<VFdsH0<TF#K~#7F?U+Ao
z(?Ar)KPLe(B%&iQxe_WPW&=c}WUT~rK|(APBqSDuSXrvDFfc@Af`z6F0}Ief?T80J
z3?RHh2Rs2AL9if5j`!>&cFyPXpR{&|{v=D6cX#pU=XZDS8Q3Qu267^r)(rljNlg<K
zoD6mKAn+3d*f<2ou$>-ql3AQMV=a=H+th5PoMMyMHRG+*MMhGK6Z0ghj}FZ+kq?(d
zwzG&#6z9FZzj%)Ho=T!i57{=}Id0NGtvGSo;&^&Bg}35xNnk5UpizRb5s3ngl7x+L
zaR8^{R&+%<rHbVOgfS+?b0@Ad;yH2FS|aNzio~GT``WQ(v&wVJC>o)5#)P<`*Gv?T
zDb86<**NJr16NTNBKpS0F*n?7f1o^iv~p*|D>v|5f5%RMyv*PqtgxXrZuO}n?Md5c
z0LSO(Iswelb>!G&|L<SG_9x)ud%8X#HGNN<9Tg{NAtZ@AN+K>@0TwO*^@e`zd@E>g
zt^=!&fp1^+bEL&sLs}Nj19$ID+So&U<L%FZtzP#%%MUQ}D7X1~_yBnJ6dG}d^NG8D
zGiqC*n{92V$Mb8w---T*PMky~^+=(x>Eem|*t1#S3_3(uoTHt%wLZKl1^E+-pIbM8
z@0u85VM~{3>?3~;v$=r;ac=l$u+MR(JMfaq@{rEhz;o4L373U@_>aX6cV-)9A@EW*
zRis}lC<{Tgg@h`f`%*$?;u>$9S=kufN-DU9qM?#eWsZpRf>PiGilZA>%c?iwgXBGF
z&)Froz_}CGsTAj}+yPp<EYL3vHQ!S9bWyE6TfNEbL0}C#g+bdD*Q(QgjtJuwKbWeX
zwP|i!RRYG5{S%lk@*>S#Ofj6}$;m1TdBu(J3L?(={q)`(CyJc*@ItDRsM>TN5BJH-
Ye;oYa;G8~b#{d8T07*qoM6N<$g6OJe`~Uy|

literal 0
HcmV?d00001

diff --git a/src/components/InvitingPersonnelModal/index.tsx b/src/components/InvitingPersonnelModal/index.tsx
index 51487ec..2637c54 100644
--- a/src/components/InvitingPersonnelModal/index.tsx
+++ b/src/components/InvitingPersonnelModal/index.tsx
@@ -165,6 +165,7 @@ const InvitingPersonnelModal = forwardRef((props: any, ref: any) => {
             <Button type="primary" className='m-ant-btn' onClick={() => {
               if (checkedList.length) {
                 PostRoomInvite(state.roomId, checkedList.map((item: any) => item.id))
+                setIsInvitingPersonnelModal(false)
               } else {
                 message.error('请选择人员')
               }
diff --git a/src/components/JoinMeetingModal/index.module.scss b/src/components/JoinMeetingModal/index.module.scss
new file mode 100644
index 0000000..b9d1918
--- /dev/null
+++ b/src/components/JoinMeetingModal/index.module.scss
@@ -0,0 +1,55 @@
+.joinMeetingModal {
+  >div:nth-child(1) {
+    display: flex;
+    align-items: center;
+
+    >div:nth-child(1) {
+      width: 44px;
+      height: 40px;
+      border-radius: 50%;
+      overflow: hidden;
+
+      >img {
+        width: 100%;
+        height: 100%;
+        object-fit: cover;
+      }
+    }
+
+    >div:nth-child(2) {
+      margin-left: 10px;
+      display: flex;
+      flex-direction: column;
+
+      >span:nth-child(1) {
+        color: #989696;
+        font-size: 16px;
+      }
+
+      >span:nth-child(2) {
+        color: white;
+        margin-top: 4px;
+        font-size: 16px;
+      }
+    }
+  }
+
+  >div:nth-child(2) {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-top: 20px;
+
+    >div {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      cursor: pointer;
+
+      >span {
+        color: white;
+        font-size: 16px;
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/src/components/JoinMeetingModal/index.tsx b/src/components/JoinMeetingModal/index.tsx
new file mode 100644
index 0000000..2d67266
--- /dev/null
+++ b/src/components/JoinMeetingModal/index.tsx
@@ -0,0 +1,88 @@
+import { GetCheckoutRoomNum, GetRoomInfo, GetRoomRtcToken } from '@/api/Home/Index';
+import styles from '@/components/JoinMeetingModal/index.module.scss'
+import ImageUrl from '@/utils/package/imageUrl';
+import { Modal, message } from 'antd';
+import { useState, useImperativeHandle, forwardRef } from "react";
+import { useNavigate } from 'react-router-dom';
+const JoinMeetingModal = forwardRef((props: any, ref: any) => {
+  useImperativeHandle(ref, () => ({
+    changeModal: (item: any) => {
+      setInfo(item)
+      setIsJoinMeetingModal(true)
+    }
+  }))
+  const navigate = useNavigate();
+  const [isJoinMeetingModal, setIsJoinMeetingModal] = useState(false);
+  const [info, setInfo] = useState<any>('');
+  const isGetCheckoutRoomNum = async (roomNum: string, callBack: Function): Promise<void> => {
+    await GetCheckoutRoomNum(roomNum).then(res => {
+      if (res.code === 200) {
+        callBack(res.data)
+      }
+    })
+  }
+  const getRoomRtcToken = async (roomNum: string, callBack: Function): Promise<void> => {
+    await GetRoomRtcToken(roomNum).then(res => {
+      if (res.code === 200) {
+        callBack(res.data)
+      }
+    })
+  }
+  return (
+    <>
+      <Modal
+        title=""
+        open={isJoinMeetingModal}
+        footer={null}
+        onCancel={() => setIsJoinMeetingModal(false)}
+        centered
+        width={'300px'}
+      >
+        <div className={styles.joinMeetingModal}>
+          <div>
+            <div><img src={ImageUrl.avatar} alt="" /></div>
+            <div>
+              <span>{info.InviterName} 邀请你加入</span>
+              <span>{info.roomName}</span>
+            </div>
+          </div>
+          <div>
+            <div style={{ marginRight: '40px' }} onClick={() => setIsJoinMeetingModal(false)}>
+              <img src={ImageUrl.icon38} alt="" />
+              <span>拒绝</span>
+            </div>
+            <div onClick={() => {
+              isGetCheckoutRoomNum(info.roomNum, (bool: boolean) => {
+                if (bool) {
+                  getRoomRtcToken(info.roomNum, (token: string) => {
+                    if (token) {
+                      GetRoomInfo(info.roomNum).then(res => {
+                        if (res.code === 200) {
+                          navigate(`/meeting`, {
+                            state: {
+                              channelId: info.roomNum,
+                              token,
+                              roomId: res.data.id,
+                              roomName: res.data.roomName,
+                            }
+                          })
+                        }
+                      })
+                    }
+                  })
+                } else {
+                  message.error('房间号不存在！')
+                }
+              })
+            }}>
+              <img src={ImageUrl.icon37} alt="" />
+              <span>接听</span>
+            </div>
+          </div>
+        </div>
+      </Modal>
+    </>
+  )
+})
+
+export default JoinMeetingModal
\ No newline at end of file
diff --git a/src/utils/package/imageUrl.ts b/src/utils/package/imageUrl.ts
index 849e56f..b413b8d 100644
--- a/src/utils/package/imageUrl.ts
+++ b/src/utils/package/imageUrl.ts
@@ -44,6 +44,8 @@ import icon33 from '@/assets/icon33.png'
 import icon34 from '@/assets/icon34.png'
 import icon35 from '@/assets/icon35.png'
 import icon36 from '@/assets/icon36.png'
+import icon37 from '@/assets/icon37.png'
+import icon38 from '@/assets/icon38.png'
 export default {
   avatar,
   error,
@@ -91,4 +93,6 @@ export default {
   icon34,
   icon35,
   icon36,
+  icon37,
+  icon38,
 }
\ No newline at end of file