Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
L
live
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
liujiaxin
live
Commits
ec88b4d8
Commit
ec88b4d8
authored
Apr 06, 2020
by
liujiaxin
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
用户金币奖励保存到ac项目
parent
9e379994
Changes
12
Show whitespace changes
Inline
Side-by-side
Showing
12 changed files
with
246 additions
and
43 deletions
+246
-43
room.tsx
src/components/dialog/room.tsx
+6
-3
member-holder.scss
src/components/member-holder.scss
+43
-0
member-holder.tsx
src/components/member-holder.tsx
+15
-2
nav.tsx
src/components/nav.tsx
+1
-0
user-stars.scss
src/components/user-stars.scss
+37
-0
user-stars.tsx
src/components/user-stars.tsx
+44
-0
video-player.scss
src/components/video-player.scss
+40
-24
video-player.tsx
src/components/video-player.tsx
+9
-5
root-container.tsx
src/containers/root-container.tsx
+3
-0
index.tsx
src/pages/classroom/index.tsx
+7
-0
room.ts
src/stores/room.ts
+22
-7
agora-rtm-client.ts
src/utils/agora-rtm-client.ts
+19
-2
No files found.
src/components/dialog/room.tsx
View file @
ec88b4d8
...
@@ -69,9 +69,10 @@ const DialogContainer = () => {
...
@@ -69,9 +69,10 @@ const DialogContainer = () => {
},
[
dialog
]);
},
[
dialog
]);
const
onClose
=
(
type
:
string
)
=>
{
const
onClose
=
(
type
:
string
)
=>
{
if
(
type
===
'
exitRoom
'
)
{
if
(
type
===
'
closeDialog
'
)
{
globalStore
.
removeDialog
();
}
else
if
(
type
===
'
exitRoom
'
)
{
globalStore
.
removeDialog
();
globalStore
.
removeDialog
();
;
}
}
else
if
(
type
===
'
apply
'
)
{
else
if
(
type
===
'
apply
'
)
{
roomStore
.
rtmClient
.
sendPeerMessage
(
roomStore
.
rtmClient
.
sendPeerMessage
(
...
@@ -83,7 +84,9 @@ const DialogContainer = () => {
...
@@ -83,7 +84,9 @@ const DialogContainer = () => {
}
}
const
onConfirm
=
(
type
:
string
)
=>
{
const
onConfirm
=
(
type
:
string
)
=>
{
if
(
type
===
'
exitRoom
'
)
{
if
(
type
===
'
closeDialog
'
)
{
globalStore
.
removeDialog
();
}
else
if
(
type
===
'
exitRoom
'
)
{
// const data = roomStore.getUserUsage();
// const data = roomStore.getUserUsage();
// const host = getApiServerHost();
// const host = getApiServerHost();
...
...
src/components/member-holder.scss
View file @
ec88b4d8
...
@@ -15,6 +15,49 @@
...
@@ -15,6 +15,49 @@
height
:
40px
!
important
;
height
:
40px
!
important
;
color
:
#dd4814
;
color
:
#dd4814
;
}
}
/*.medal{
width: 16px;
z-index: 99;
background-size: contain;
background-image: url("data:image/png;base64,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");
}*/
.user-profile
{
.star
{
position
:
relative
;
z-index
:
10
;
padding-top
:
8px
;
color
:
#fff
;
line-height
:
32px
;
height
:
32px
;
display
:
flex
;
flex-direction
:
row
;
top
:
0
;
}
.star
.medal-bg
{
position
:
relative
;
background
:
none
;
opacity
:
.6
;
height
:
16px
;
top
:
0
;
left
:
0
;
padding-left
:
4px
;
padding-right
:
12px
;
padding-top
:
4px
;
}
.star
.points
{
line-height
:
16px
;
height
:
16px
;
font-size
:
14px
;
display
:
block
;
color
:
#000
;
}
}
@keyframes
blink
{
@keyframes
blink
{
0
%
{
opacity
:
1
;}
0
%
{
opacity
:
1
;}
25
%
{
opacity
:
.5
;}
25
%
{
opacity
:
.5
;}
...
...
src/components/member-holder.tsx
View file @
ec88b4d8
...
@@ -8,6 +8,8 @@ import AccountCircle from '@material-ui/icons/AccountCircle';
...
@@ -8,6 +8,8 @@ import AccountCircle from '@material-ui/icons/AccountCircle';
import
Link
from
'
@material-ui/core/Link
'
;
import
Link
from
'
@material-ui/core/Link
'
;
import
PanToolIcon
from
'
@material-ui/icons/PanTool
'
;
import
PanToolIcon
from
'
@material-ui/icons/PanTool
'
;
import
{
roomStore
}
from
"
../stores/room
"
;
import
{
roomStore
}
from
"
../stores/room
"
;
import
UserStars
from
"
./user-stars
"
;
import
{
eventBus
}
from
"
../stores/EventBus
"
;
const
contentMode
=
0
;
const
contentMode
=
0
;
interface
MemberHolderProps
{
interface
MemberHolderProps
{
...
@@ -226,7 +228,12 @@ const MemberHolder: React.FC<MemberHolderProps> = ({
...
@@ -226,7 +228,12 @@ const MemberHolder: React.FC<MemberHolderProps> = ({
handleClose
(
'
close
'
,
streamID
);
handleClose
(
'
close
'
,
streamID
);
}
}
}
}
const
addStar
=
(
evt
:
any
)
=>
{
if
(
me
.
role
!=
'
teacher
'
)
{
return
}
eventBus
.
emit
(
'
showAddStartDialog
'
,
{
uid
:
id
});
}
const
me
=
useRoomState
().
me
;
const
me
=
useRoomState
().
me
;
return
(
return
(
...
@@ -239,6 +246,7 @@ const MemberHolder: React.FC<MemberHolderProps> = ({
...
@@ -239,6 +246,7 @@ const MemberHolder: React.FC<MemberHolderProps> = ({
<
div
className=
"user-profile"
>
<
div
className=
"user-profile"
>
<
span
className=
"account"
>
{
account
}
</
span
>
<
span
className=
"account"
>
{
account
}
</
span
>
{
/*me.uid === id ||*/
}
{
/*me.uid === id ||*/
}
<
UserStars
id=
{
id
}
streamID=
{
streamID
}
></
UserStars
>
{
me
.
role
===
'
teacher
'
?
{
me
.
role
===
'
teacher
'
?
<
span
className=
"media-btn"
>
<
span
className=
"media-btn"
>
{
{
...
@@ -248,7 +256,12 @@ const MemberHolder: React.FC<MemberHolderProps> = ({
...
@@ -248,7 +256,12 @@ const MemberHolder: React.FC<MemberHolderProps> = ({
}
}
{
/*<Link component="button" onClick={onAudioClick}>{audio ? "静音" : "开麦"}</Link>*/
}
{
/*<Link component="button" onClick={onAudioClick}>{audio ? "静音" : "开麦"}</Link>*/
}
{
me
.
role
===
'
teacher
'
?
<
Link
component=
"button"
onClick=
{
onStageUp
}
>
上台
</
Link
>
:
null
}
{
me
.
role
===
'
teacher
'
?
<>
<
Link
component=
"button"
onClick=
{
addStar
}
>
奖励
</
Link
>
<
Link
component=
"button"
onClick=
{
onStageUp
}
>
上台
</
Link
>
</>
:
null
}
{
/*<Icon onClick={onAudioClick} className={audio ? "icon-speaker-on" : "icon-speaker-off"} data={"audio"} />*/
}
{
/*<Icon onClick={onAudioClick} className={audio ? "icon-speaker-on" : "icon-speaker-off"} data={"audio"} />*/
}
{
/*<Icon onClick={onVideoClick} className={video ? "icons-camera-unmute-s" : "icons-camera-mute-s"} data={"video"} />*/
}
{
/*<Icon onClick={onVideoClick} className={video ? "icons-camera-unmute-s" : "icons-camera-mute-s"} data={"video"} />*/
}
</
span
>
:
null
}
</
span
>
:
null
}
...
...
src/components/nav.tsx
View file @
ec88b4d8
...
@@ -209,6 +209,7 @@ export default function NavContainer() {
...
@@ -209,6 +209,7 @@ export default function NavContainer() {
};
};
const
handleClick
=
(
type
:
string
)
=>
{
const
handleClick
=
(
type
:
string
)
=>
{
console
.
log
(
'
handleClick
'
,
type
);
if
(
type
===
'
setting
'
)
{
if
(
type
===
'
setting
'
)
{
setCard
(
true
);
setCard
(
true
);
}
else
if
(
type
===
'
exit
'
)
{
}
else
if
(
type
===
'
exit
'
)
{
...
...
src/components/user-stars.scss
0 → 100644
View file @
ec88b4d8
/*.medal{
width: 16px;
z-index: 99;
background-size: contain;
background-image: url("data:image/png;base64,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");
}
.star{
position: absolute;
z-index: 10;
left: 4px;
top: 4px;
color: #fff;
line-height: 20px;
height: 20px;
display: flex;
flex-direction: row;
//cursor: pointer;
}
.star .medal-bg{
position: absolute;
background: #000;
opacity: .6;
height: 16px;
top: 2px;
left: 6px;
border-radius: 0 4px 4px 0;
padding-left: 12px;
padding-right: 8px;
}
.star .points{
line-height: 16px;
height: 16px;
font-size: 14px;
display: block;
}
*/
src/components/user-stars.tsx
0 → 100644
View file @
ec88b4d8
import
React
,
{
useEffect
,
useRef
,
useState
}
from
'
react
'
;
import
'
./toast.scss
'
;
import
{
useGlobalState
}
from
'
../containers/root-container
'
;
import
{
isEmpty
}
from
'
lodash
'
;
import
{
roomStore
}
from
"
../stores/room
"
;
interface
UserStarsProps
{
id
?:
string
,
streamID
:
number
// stars: number
}
export
default
function
UserStars
({
id
,
streamID
}:
UserStarsProps
)
{
const
[
star
,
setStar
]
=
useState
<
number
>
(
0
);
useEffect
(()
=>
{
console
.
log
(
'
roomStore.state.userStars change, streamID
'
,
streamID
)
if
(
streamID
)
{
const
u
=
roomStore
.
state
.
users
.
get
(
`
${
streamID
}
`
)
if
(
u
)
{
console
.
log
(
'
u.stars
'
,
u
.
stars
);
setStar
(
u
.
stars
||
0
);
}
}
// setStar()
},
[
roomStore
.
state
.
users
]);
return
(
<
div
className=
'star'
>
<
div
className=
"medal"
></
div
>
<
div
className=
"medal-bg"
>
<
span
className=
"points"
>
{
star
}
</
span
>
</
div
>
</
div
>
)
}
src/components/video-player.scss
View file @
ec88b4d8
...
@@ -3,6 +3,15 @@
...
@@ -3,6 +3,15 @@
justify-content
:
space-between
;
justify-content
:
space-between
;
//width: 80px;
//width: 80px;
margin-right
:
10px
;
margin-right
:
10px
;
button
{
margin
:
12px
0
;
border-right
:
1px
solid
#333
;
line-height
:
16px
;
padding
:
0
4px
;
}
button
:last-child
{
border
:
0
;
}
}
}
.media-btn
>
.icon.disabled
{
.media-btn
>
.icon.disabled
{
cursor
:
not
-
allowed
;
cursor
:
not
-
allowed
;
...
@@ -19,35 +28,14 @@
...
@@ -19,35 +28,14 @@
}
}
}
}
.medal
{
.medal
{
width
:
16px
;
width
:
16px
;
z-index
:
99
;
z-index
:
99
;
background-size
:
contain
;
background-size
:
contain
;
background-image
:
url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAA3CAYAAAB3lahZAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAADDtJREFUeNrMWnuMXFUd/p1zHzOzu7PbfXdbWtquLVhLGx9paakgIT5iMPxjRDSKIdE/NJhq9G+JITFIiEFM+EOF4CM0QRMEYsQQ0AqVUoJAC23pk+2D7W67292d2Xndc4/f7547O3ded25tjU7ym9mZ+zjf+c7vfL/vnLtCT/yUml5CRL5o/oESvm4j4ewiv7iDLr0sSeVfI+E+gsufC24T9xJhUxKhEFMpomUVoi58UbX2JV291y7EC4jbEQOIZYjPAMiz+PzR1WrkCgHrMACM6Gcxp9yH9zv/DwDzUInlePtzgpN34/QN5pL/GWBKI/6GsBIOyEuIgY75/F8CvBPxFuK6xINBtCK85tP/aaN2zDG++Q7EMMIPg5tdibgpUITLyZyaElyD978i9iD+gZiISBHjmSFLv4pvpy4H8P2IHyLcK0o4ilXHm/H95qX0qH464GXe1lSWDwP494Ic0DoGsBAP4f37lw3IQhq76J/bhQbw6eG7B4Q+WqygQaWpKXd1wygw2BwgTaUFtHcXQA+Qo+/G51JnRUPh2ATABxIzxq9uAExD5BdyRJcukc6XiAr4O38IdLDwuyR60GC3ZYAX/NYpUwU7maYlJeHfBso7UUheqTFcV9Xoi4nA+rhRBjfu7iZ9bpL0kaPknz5LNDdPVCyS9gFMpklIAHWLJABWjKCpa1MkRh2cg+uLupYiVbDnQ7A2vvvCVDihv0wZ9UowUi1SYigR2GV9YMsj/8U9pN46iJzLBSyLFJhOA6iIiC3A+zMe0Qdg+2iRrPE0yS0YlV4wPo+ym2pg1ta1eiS54zQakCpa5/DxjmAH+okuzpD33POkT02Q6AP44cG6iVGf24JEBq0BI6eEenuRfIC3dmZJjAH0BzIEqw0aHeYIM5z2mf3DpGuAG3V4b0ew0xfI+/1TpM+cw/COgCG3PdjGnLcBfsAmPeuRemGW6AR+zHWbg3aL812MgKVfCQQ1ZL0R8L8Q882N4cyenmBieX98lnQuT2IoZJXzFOmhL84Gvze7vWYgos8ijQzx9sxhElbMhGzsNNfOlK/A7mtLk1A0Ay4jXmyuhzx5nCBn9dQ0icEBwzi/SuUgf61P3khy3RrSM2BusWCuaTtaaLsLTKsyqZMzYRuC6jTZ4nTQe3HubKfCcbSJXUwyVgL17pF6sHy4UCD7pm0kbrkFsnaBxOqV5O97A4wvgsm0YapVxuC+IgMScJ6cxoiNYgQXK2E1rIouvVMzhO29hN3ELkbGf+ewAWpZ9Y3a+N6bRSKBqWKJ5I7tZN/1BZLX9yBFSgi/fbGUJn18ACbPDybokiLwpPNRaWVn87O97hvr7bnzpM9ikjGwVhOsUjafHuRrGiOYzZL1qWGyb+0h0Y+hn8fvqgVwzueUTf4COoYg26oVEq6SRXkTJl3EyTYDXoe4sS4dUG59KIPOIy9tO5nRyRXBeIXE2hTZnwf4D6OjGG3NQ97qfLCr82XDcNVzMPZ55zqU5U9EtbkR8G9aru3m5oICEFuiW63PGOCCTXLlEFmbl5McyJAuqdb3KXo1sMGkwxt7iAvuY4FGSx2mBLNohvnB0DbWA1ZeOOtFjHUUzb+57LpQhs9ApxfAdq9L1g1jZK3IQtJU0/m6rEzaRF+O5g7fQDPurwOWg5QIklx8FYd/0FqCtPEGsSYookcMNg2Q84jzKcMUs8N6i3wVYDlwbq20PnrT6n0Z9Ix7DyznvSx1zPA4jvwuzjYKx05QzRgshjADQOcnMVErZhIxWP7sdklPLkB3MSntFnPdkvUFpzpyMvx71v05efKj7NYeaI9BGxnLZtsDXlpNMFicdw525L03AQrp4ODaNDpbglE6fpH8c/OQWBEoQ939fKMWteIh6ucGp0MF9y9YD9kd11dKQZpgcBzHNNJYdnXIbBfAHgbQI2/gXKRDT8a0ex6sTlwKVECkHRKBEuimTnPla5q0S6kSdsCTW/msrljA8LdiDA6vfxnyct4MeV1jzGy3YZbBwl5Stov0XBEe+VJQFASGW3S71Fi1DCE+OoKB7kmZ4rFEQoTlqpewfJczJH6FUUYuDg6SHF9jzI1oyD+bJxfWiyexGM4CODyxfwr288CkAQtWKWW1kT8BmfNABkjoDgGLVjotTFpk1Ps86X7csRhA1uTmjwQs63y+lhbcIAd8BquAzivyDk6SOjFjSOly6oe3qUIi3VybLPYRSoXqEF2tak4Ds/LoL7NU/oRl7WkceSQe8CLRCMR/J4ogA+YSHIIWjiR/zgOjU6QOTQUlVmAdFyiBjhcVZtdahfnRC3ZZhyniJZhVLhy8XFqOypmtPAHwj1XH97uIryD2t21gdo7Ex7aQtWMb8jNf7w0YHBcDzHLOxyRmniehHOslsRKAS1WwZNgsC1N4huEvVhQOAOw9APuNxtL8JGIr4o5w+6m+4jGrBbixz95GctM4QC8AZANoKeJZFWaS6UWARcWz1g+ajldz1xNmqWSAvkr9lS/h980A+3icW3sGcSvi7jpKAuODyXPqMFljDgzNCnMkX2lduVpVTD4Xn9b4AFkbho0/4VSoguUiMwYb0F/5DprcjpR4KrCZCbeq2AjBV+q/BMUjjYlxGp74GNQg00Xy2gGS/V2kuBjMFmDkPdMwp4WISKhvtIyrpcTkkit6jbFns8P+eulkXrOD2Yx/F5Xk7mR7a3yxrDPoz8PAP0Fu5m46fQRr6rchUZBtidmf45uD6Q1DMCglTLyS2UThNAlNDOsvpwprsGSQ2ZTpRWAzI2rA7PJOe4/6Eyra7jhlEfr0g+GQuwZsqVC7WbBPkFpHk6eO00nItZOuVTwdEXjHAAvY5HysmiXO6Wpue2GuRmWrCqwiDLv93lZMuP1RVWusfDaNZkwxKAPoxLtQg/PGB1QBSzpBF3LHycqMB3ns+7Vj1U8GwipRHV4ZyYmSami5dX5Tn5iia+z9VBSxvtv2nz4UmvQLGNqZEKxXt44Wq903xJAYD7aXoj2OMrFUSsONv+hiMgpUNKyOuf/9grzp8sGFPUWStozdMLUrj74XbnKwu+qpTx4eefTD+ZwuWXfgS1HUmx8dqfPVxn1Z+03o2qcW9ddU04l1d5Wgi08uVo7fN0fp1XY8YFozGi9HWQuLxEXHWsibPFcNm73csJIG7BAO9ipzjrBMzOG8OQYXaq2IDE91ZCyPCu97trvcIXfIitVym1av7rCotEjNemSffY/E+hzWWF01BpgdZm4MKTQAL3EavmKfTWoKg4EOin6o4bhL9oegDosAclEbtoO9MzIedxvS/O0cXdpTJndE1kalLWDf77AIVsHOTvnIenL7DqGUArQH0GXcOItruz3SZ4D9JayuX8cIzDjQekU5ODWvUiFnuELpj5eoe3uKnA1sMS2TWuxSRxWVjuXo2P1zpNFnK40Oq07POJJs5LlFFIY0lf65keyRI/AA81ibpUiDMf+wS2ofGJzFUmoI3nYMDgw6bPPGH1JFwMAsPq+ouC9Pma0w8ZsgIkN8TNP8MwWa/kORvAVNqTErAH0lD2Uik4u3TOGY/BR5RzeSePk4Gsxh9QuaSgDVD1qu8cxuTXRyBRslaGQVXCxvzL/kU+XvHs2IPFUW4INzFtmDEmBx3Ev2LCwZYKpKFKzjKIZ1cC1K9EnMF6THsnRNIdo9l+ZjECE5wssbl5yyRdMCS6c+jERQVBrXRVfrOR3P6HI5qF56w1qzwigUG9YxrVaokXnKG2awoKMDfbiNhUquIgtZ0TFqGylx0Qq0xKVr15l941KRkm8LcWFUWPlLGunLoqoDtFI1be4QMkmv2jIdgAbT3T3BYrX9HkCr1ZEKGB7u6yUHbtBTqu5xe7u4fIbbgW7BtIghXVSZxvXDvVlyGbSvOyK2Y7f3k+a065Jet47EyROwnfmlXc6WU7Dhf0cCppEeQ9ksvLwKn0BdDZVIAnrNWhITEyQWF1FhBG+wbo4tW1WzB922oBYZy+koFElVIpMItJTH9LWr76WhoY1oeQts4zdx9J0kffa17lIArvz4SAp4tsNxGA3xbapU1qP5XwQpYXL/V8HjYKJ7Wm7Y6IY2Ik+L2kXSSfdwG6BYN9G3wv+ZeNRQ5VOjP8EtHkcgPejrS8CbE/yBq/cPHlrz87vbw30LeDF6HcHDfT3il5eR8b8lBq7pawC7N7zXm0B+J2IPJaD43wIMAHLraTBKSUc9AAAAAElFTkSuQmCC")
;
background-image
:
url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAA3CAYAAAB3lahZAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAADDtJREFUeNrMWnuMXFUd/p1zHzOzu7PbfXdbWtquLVhLGx9paakgIT5iMPxjRDSKIdE/NJhq9G+JITFIiEFM+EOF4CM0QRMEYsQQ0AqVUoJAC23pk+2D7W67292d2Xndc4/f7547O3ded25tjU7ym9mZ+zjf+c7vfL/vnLtCT/yUml5CRL5o/oESvm4j4ewiv7iDLr0sSeVfI+E+gsufC24T9xJhUxKhEFMpomUVoi58UbX2JV291y7EC4jbEQOIZYjPAMiz+PzR1WrkCgHrMACM6Gcxp9yH9zv/DwDzUInlePtzgpN34/QN5pL/GWBKI/6GsBIOyEuIgY75/F8CvBPxFuK6xINBtCK85tP/aaN2zDG++Q7EMMIPg5tdibgpUITLyZyaElyD978i9iD+gZiISBHjmSFLv4pvpy4H8P2IHyLcK0o4ilXHm/H95qX0qH464GXe1lSWDwP494Ic0DoGsBAP4f37lw3IQhq76J/bhQbw6eG7B4Q+WqygQaWpKXd1wygw2BwgTaUFtHcXQA+Qo+/G51JnRUPh2ATABxIzxq9uAExD5BdyRJcukc6XiAr4O38IdLDwuyR60GC3ZYAX/NYpUwU7maYlJeHfBso7UUheqTFcV9Xoi4nA+rhRBjfu7iZ9bpL0kaPknz5LNDdPVCyS9gFMpklIAHWLJABWjKCpa1MkRh2cg+uLupYiVbDnQ7A2vvvCVDihv0wZ9UowUi1SYigR2GV9YMsj/8U9pN46iJzLBSyLFJhOA6iIiC3A+zMe0Qdg+2iRrPE0yS0YlV4wPo+ym2pg1ta1eiS54zQakCpa5/DxjmAH+okuzpD33POkT02Q6AP44cG6iVGf24JEBq0BI6eEenuRfIC3dmZJjAH0BzIEqw0aHeYIM5z2mf3DpGuAG3V4b0ew0xfI+/1TpM+cw/COgCG3PdjGnLcBfsAmPeuRemGW6AR+zHWbg3aL812MgKVfCQQ1ZL0R8L8Q882N4cyenmBieX98lnQuT2IoZJXzFOmhL84Gvze7vWYgos8ijQzx9sxhElbMhGzsNNfOlK/A7mtLk1A0Ay4jXmyuhzx5nCBn9dQ0icEBwzi/SuUgf61P3khy3RrSM2BusWCuaTtaaLsLTKsyqZMzYRuC6jTZ4nTQe3HubKfCcbSJXUwyVgL17pF6sHy4UCD7pm0kbrkFsnaBxOqV5O97A4wvgsm0YapVxuC+IgMScJ6cxoiNYgQXK2E1rIouvVMzhO29hN3ELkbGf+ewAWpZ9Y3a+N6bRSKBqWKJ5I7tZN/1BZLX9yBFSgi/fbGUJn18ACbPDybokiLwpPNRaWVn87O97hvr7bnzpM9ikjGwVhOsUjafHuRrGiOYzZL1qWGyb+0h0Y+hn8fvqgVwzueUTf4COoYg26oVEq6SRXkTJl3EyTYDXoe4sS4dUG59KIPOIy9tO5nRyRXBeIXE2hTZnwf4D6OjGG3NQ97qfLCr82XDcNVzMPZ55zqU5U9EtbkR8G9aru3m5oICEFuiW63PGOCCTXLlEFmbl5McyJAuqdb3KXo1sMGkwxt7iAvuY4FGSx2mBLNohvnB0DbWA1ZeOOtFjHUUzb+57LpQhs9ApxfAdq9L1g1jZK3IQtJU0/m6rEzaRF+O5g7fQDPurwOWg5QIklx8FYd/0FqCtPEGsSYookcMNg2Q84jzKcMUs8N6i3wVYDlwbq20PnrT6n0Z9Ix7DyznvSx1zPA4jvwuzjYKx05QzRgshjADQOcnMVErZhIxWP7sdklPLkB3MSntFnPdkvUFpzpyMvx71v05efKj7NYeaI9BGxnLZtsDXlpNMFicdw525L03AQrp4ODaNDpbglE6fpH8c/OQWBEoQ939fKMWteIh6ucGp0MF9y9YD9kd11dKQZpgcBzHNNJYdnXIbBfAHgbQI2/gXKRDT8a0ex6sTlwKVECkHRKBEuimTnPla5q0S6kSdsCTW/msrljA8LdiDA6vfxnyct4MeV1jzGy3YZbBwl5Stov0XBEe+VJQFASGW3S71Fi1DCE+OoKB7kmZ4rFEQoTlqpewfJczJH6FUUYuDg6SHF9jzI1oyD+bJxfWiyexGM4CODyxfwr288CkAQtWKWW1kT8BmfNABkjoDgGLVjotTFpk1Ps86X7csRhA1uTmjwQs63y+lhbcIAd8BquAzivyDk6SOjFjSOly6oe3qUIi3VybLPYRSoXqEF2tak4Ds/LoL7NU/oRl7WkceSQe8CLRCMR/J4ogA+YSHIIWjiR/zgOjU6QOTQUlVmAdFyiBjhcVZtdahfnRC3ZZhyniJZhVLhy8XFqOypmtPAHwj1XH97uIryD2t21gdo7Ex7aQtWMb8jNf7w0YHBcDzHLOxyRmniehHOslsRKAS1WwZNgsC1N4huEvVhQOAOw9APuNxtL8JGIr4o5w+6m+4jGrBbixz95GctM4QC8AZANoKeJZFWaS6UWARcWz1g+ajldz1xNmqWSAvkr9lS/h980A+3icW3sGcSvi7jpKAuODyXPqMFljDgzNCnMkX2lduVpVTD4Xn9b4AFkbho0/4VSoguUiMwYb0F/5DprcjpR4KrCZCbeq2AjBV+q/BMUjjYlxGp74GNQg00Xy2gGS/V2kuBjMFmDkPdMwp4WISKhvtIyrpcTkkit6jbFns8P+eulkXrOD2Yx/F5Xk7mR7a3yxrDPoz8PAP0Fu5m46fQRr6rchUZBtidmf45uD6Q1DMCglTLyS2UThNAlNDOsvpwprsGSQ2ZTpRWAzI2rA7PJOe4/6Eyra7jhlEfr0g+GQuwZsqVC7WbBPkFpHk6eO00nItZOuVTwdEXjHAAvY5HysmiXO6Wpue2GuRmWrCqwiDLv93lZMuP1RVWusfDaNZkwxKAPoxLtQg/PGB1QBSzpBF3LHycqMB3ns+7Vj1U8GwipRHV4ZyYmSami5dX5Tn5iia+z9VBSxvtv2nz4UmvQLGNqZEKxXt44Wq903xJAYD7aXoj2OMrFUSsONv+hiMgpUNKyOuf/9grzp8sGFPUWStozdMLUrj74XbnKwu+qpTx4eefTD+ZwuWXfgS1HUmx8dqfPVxn1Z+03o2qcW9ddU04l1d5Wgi08uVo7fN0fp1XY8YFozGi9HWQuLxEXHWsibPFcNm73csJIG7BAO9ipzjrBMzOG8OQYXaq2IDE91ZCyPCu97trvcIXfIitVym1av7rCotEjNemSffY/E+hzWWF01BpgdZm4MKTQAL3EavmKfTWoKg4EOin6o4bhL9oegDosAclEbtoO9MzIedxvS/O0cXdpTJndE1kalLWDf77AIVsHOTvnIenL7DqGUArQH0GXcOItruz3SZ4D9JayuX8cIzDjQekU5ODWvUiFnuELpj5eoe3uKnA1sMS2TWuxSRxWVjuXo2P1zpNFnK40Oq07POJJs5LlFFIY0lf65keyRI/AA81ibpUiDMf+wS2ofGJzFUmoI3nYMDgw6bPPGH1JFwMAsPq+ouC9Pma0w8ZsgIkN8TNP8MwWa/kORvAVNqTErAH0lD2Uik4u3TOGY/BR5RzeSePk4Gsxh9QuaSgDVD1qu8cxuTXRyBRslaGQVXCxvzL/kU+XvHs2IPFUW4INzFtmDEmBx3Ev2LCwZYKpKFKzjKIZ1cC1K9EnMF6THsnRNIdo9l+ZjECE5wssbl5yyRdMCS6c+jERQVBrXRVfrOR3P6HI5qF56w1qzwigUG9YxrVaokXnKG2awoKMDfbiNhUquIgtZ0TFqGylx0Qq0xKVr15l941KRkm8LcWFUWPlLGunLoqoDtFI1be4QMkmv2jIdgAbT3T3BYrX9HkCr1ZEKGB7u6yUHbtBTqu5xe7u4fIbbgW7BtIghXVSZxvXDvVlyGbSvOyK2Y7f3k+a065Jet47EyROwnfmlXc6WU7Dhf0cCppEeQ9ksvLwKn0BdDZVIAnrNWhITEyQWF1FhBG+wbo4tW1WzB922oBYZy+koFElVIpMItJTH9LWr76WhoY1oeQts4zdx9J0kffa17lIArvz4SAp4tsNxGA3xbapU1qP5XwQpYXL/V8HjYKJ7Wm7Y6IY2Ik+L2kXSSfdwG6BYN9G3wv+ZeNRQ5VOjP8EtHkcgPejrS8CbE/yBq/cPHlrz87vbw30LeDF6HcHDfT3il5eR8b8lBq7pawC7N7zXm0B+J2IPJaD43wIMAHLraTBKSUc9AAAAAElFTkSuQmCC")
;
}
.menu-close
{
cursor
:
pointer
;
width
:
18px
;
top
:
15px
;
right
:
15px
;
position
:
absolute
;
background-size
:
18px
;
height
:
18px
;
border-radius
:
8px
;
&
:hover
{
background
:
rgba
(
0
,
0
,
0
,
0
.07
);
}
&
:
:
after
{
border-radius
:
8px
;
display
:
block
;
width
:
18px
;
height
:
18px
;
content
:
' '
;
background-position
:
center
;
background-repeat
:
no-repeat
;
background-repeat
:
no-repeat
;
background-size
:
18px
;
background-image
:
url('../assets/icon-resource-menu-close.png')
;
}
}
}
.star
{
.star
{
position
:
absolute
;
position
:
absolute
;
...
@@ -79,6 +67,34 @@
...
@@ -79,6 +67,34 @@
font-size
:
14px
;
font-size
:
14px
;
display
:
block
;
display
:
block
;
}
}
.menu-close
{
cursor
:
pointer
;
width
:
18px
;
top
:
15px
;
right
:
15px
;
position
:
absolute
;
background-size
:
18px
;
height
:
18px
;
border-radius
:
8px
;
&
:hover
{
background
:
rgba
(
0
,
0
,
0
,
0
.07
);
}
&
:
:
after
{
border-radius
:
8px
;
display
:
block
;
width
:
18px
;
height
:
18px
;
content
:
' '
;
background-position
:
center
;
background-repeat
:
no-repeat
;
background-size
:
18px
;
background-image
:
url('../assets/icon-resource-menu-close.png')
;
}
}
.video-profile
{
.video-profile
{
z-index
:
3
;
z-index
:
3
;
width
:
100%
;
width
:
100%
;
...
...
src/components/video-player.tsx
View file @
ec88b4d8
...
@@ -11,6 +11,7 @@ import BuildIcon from '@material-ui/icons/Build';
...
@@ -11,6 +11,7 @@ import BuildIcon from '@material-ui/icons/Build';
import
{
eventBus
}
from
"
../stores/EventBus
"
;
import
{
eventBus
}
from
"
../stores/EventBus
"
;
// import StarIcon from '@material-ui/icons/Star';
// import StarIcon from '@material-ui/icons/Star';
import
EmojiEventsOutlinedIcon
from
'
@material-ui/icons/EmojiEventsOutlined
'
;
import
EmojiEventsOutlinedIcon
from
'
@material-ui/icons/EmojiEventsOutlined
'
;
import
UserStars
from
'
./user-stars
'
;
const
useStyles
=
makeStyles
({
const
useStyles
=
makeStyles
({
stageDown
:
{
stageDown
:
{
...
@@ -95,7 +96,7 @@ const VideoPlayer: React.FC<VideoPlayerProps> = ({
...
@@ -95,7 +96,7 @@ const VideoPlayer: React.FC<VideoPlayerProps> = ({
const
stateError
=
useRef
<
boolean
>
(
false
);
const
stateError
=
useRef
<
boolean
>
(
false
);
const
[
star
,
setStar
]
=
useState
<
number
>
(
0
);
// const hasError = useMemo(() => {
// const hasError = useMemo(() => {
// return stateError.current;
// return stateError.current;
...
@@ -220,16 +221,19 @@ const VideoPlayer: React.FC<VideoPlayerProps> = ({
...
@@ -220,16 +221,19 @@ const VideoPlayer: React.FC<VideoPlayerProps> = ({
}
}
},
[
domId
,
stream
]);
},
[
domId
,
stream
]);
/*
const [star, setStar] = useState<number>(0);
useEffect(() => {
useEffect(() => {
console.log('roomStore.state.userStars change')
console.log('roomStore.state.userStars change')
if (id) {
if (id) {
const u = roomStore.state.users.get(id)
const u = roomStore.state.users.get(id)
if (u) {
if (u) {
setStar
(
u
.
stars
);
setStar(u.stars
|| 0
);
}
}
}
}
// setStar()
// setStar()
}, [roomStore.state.users]);
}, [roomStore.state.users]);
*/
useEffect
(()
=>
{
useEffect
(()
=>
{
if
(
stream
&&
platform
===
'
web
'
)
{
if
(
stream
&&
platform
===
'
web
'
)
{
...
@@ -367,15 +371,15 @@ return (
...
@@ -367,15 +371,15 @@ return (
account
?
account
?
<>
<>
{
streamID
>
0
&&
id
!=
teacherId
?
{
streamID
>
0
&&
id
!=
teacherId
?
<
div
className=
'star'
>
<
UserStars
id=
{
id
}
streamID=
{
streamID
}
></
UserStars
>
/*<div className='star'>
<div className="medal"></div>
<div className="medal"></div>
<div className="medal-bg">
<div className="medal-bg">
<span className="points">
<span className="points">
{star}
{star}
</span>
</span>
</div>
</div>
</div> */
:
null
}
</
div
>:
null
}
<
div
className=
"video-profile"
>
<
div
className=
"video-profile"
>
<
span
className=
"account"
>
{
account
}
</
span
>
<
span
className=
"account"
>
{
account
}
</
span
>
{
/*{stateError.current?<span onClick={resumeStream}>恢复</span>: null}*/
}
{
/*{stateError.current?<span onClick={resumeStream}>恢复</span>: null}*/
}
...
...
src/containers/root-container.tsx
View file @
ec88b4d8
...
@@ -197,6 +197,9 @@ export const RootProvider: React.FC<any> = ({children}) => {
...
@@ -197,6 +197,9 @@ export const RootProvider: React.FC<any> = ({children}) => {
window
.
state
=
globalState
;
window
.
state
=
globalState
;
//@ts-ignore
//@ts-ignore
window
.
whiteboard
=
whiteboardState
;
window
.
whiteboard
=
whiteboardState
;
//@ts-ignore
window
.
store
=
globalStore
;
},
[
value
,
location
]);
},
[
value
,
location
]);
return
(
return
(
...
...
src/pages/classroom/index.tsx
View file @
ec88b4d8
...
@@ -58,16 +58,19 @@ function StarDialog(props: StarDialogProps) {
...
@@ -58,16 +58,19 @@ function StarDialog(props: StarDialogProps) {
const
handleEntering
=
()
=>
{
const
handleEntering
=
()
=>
{
// console.log('dialog handleEntering ');
// console.log('dialog handleEntering ');
onClose
(
uid
,
value
);
onClose
(
uid
,
value
);
setValue
(
0
)
};
};
const
handleCancel
=
()
=>
{
const
handleCancel
=
()
=>
{
console
.
log
(
'
dialog handleCancel
'
);
console
.
log
(
'
dialog handleCancel
'
);
onClose
(
-
1
,
0
);
onClose
(
-
1
,
0
);
setValue
(
0
)
};
};
const
handleOk
=
()
=>
{
const
handleOk
=
()
=>
{
// console.log('dialog handleOk ');
// console.log('dialog handleOk ');
onClose
(
uid
,
value
);
onClose
(
uid
,
value
);
setValue
(
0
)
};
};
...
@@ -89,6 +92,7 @@ function StarDialog(props: StarDialogProps) {
...
@@ -89,6 +92,7 @@ function StarDialog(props: StarDialogProps) {
id=
"starNumber"
id=
"starNumber"
label=
"奖励值"
label=
"奖励值"
type=
"number"
type=
"number"
value=
{
value
||
''
}
onChange=
{
handleChange
}
onChange=
{
handleChange
}
fullWidth
fullWidth
/>
/>
...
@@ -135,6 +139,7 @@ export function RoomPage({ children }: any) {
...
@@ -135,6 +139,7 @@ export function RoomPage({ children }: any) {
if
(
!
eventNames
.
includes
(
'
showAddStartDialog
'
))
{
if
(
!
eventNames
.
includes
(
'
showAddStartDialog
'
))
{
console
.
log
(
3333333
);
console
.
log
(
3333333
);
eventBus
.
on
(
'
showAddStartDialog
'
,
(
data
)
=>
{
eventBus
.
on
(
'
showAddStartDialog
'
,
(
data
)
=>
{
console
.
log
(
'
showAddStartDialog event
'
)
if
(
dialogLock
.
current
)
{
if
(
dialogLock
.
current
)
{
return
return
}
}
...
@@ -184,6 +189,7 @@ export function RoomPage({ children }: any) {
...
@@ -184,6 +189,7 @@ export function RoomPage({ children }: any) {
sharedId: me.sharedId,
sharedId: me.sharedId,
lockBoard: me.lockBoard,
lockBoard: me.lockBoard,
grantBoard: me.grantBoard,
grantBoard: me.grantBoard,
stars: me.stars
}
}
lock.current = true;
lock.current = true;
if (roomStore.state.rtm.joined) return;
if (roomStore.state.rtm.joined) return;
...
@@ -389,6 +395,7 @@ export function RoomPage({ children }: any) {
...
@@ -389,6 +395,7 @@ export function RoomPage({ children }: any) {
deviceId: mediaDevice.speakerId
deviceId: mediaDevice.speakerId
}
}
}
}
console.log("canPb>>> ", canPublish, roomStore.state.course.linkId, roomStore.state.me.uid);
console.log("canPb>>> ", canPublish, roomStore.state.course.linkId, roomStore.state.me.uid);
if (canPublish && !publishLock.current) {
if (canPublish && !publishLock.current) {
publishLock.current = true;
publishLock.current = true;
...
...
src/stores/room.ts
View file @
ec88b4d8
...
@@ -360,26 +360,39 @@ export class RoomStore {
...
@@ -360,26 +360,39 @@ export class RoomStore {
if
(
value
<=
0
)
{
if
(
value
<=
0
)
{
return
;
return
;
}
}
const
data
=
{
star
:
value
,
users
:
[]};
console
.
log
(
'
addStarToUser
'
,
uid
,
value
);
console
.
log
(
'
addStarToUser
'
,
uid
,
value
);
const
stuChannelData
:
any
=
{};
const
stuChannelData
:
any
=
{};
// const userStars = {...this.state.userStars};
// const userStars = {...this.state.userStars};
if
(
uid
!==
0
)
{
if
(
uid
!==
0
)
{
const
stu
=
this
.
state
.
users
.
get
(
`
${
uid
}
`
);
const
stu
=
this
.
state
.
users
.
get
(
`
${
uid
}
`
);
(
data
.
users
as
number
[]).
push
(
uid
)
let
uStar
=
0
;
let
uStar
=
0
;
if
(
stu
)
{
if
(
stu
)
{
uStar
=
stu
.
stars
;
uStar
=
stu
.
stars
;
if
(
!
uStar
||
isNaN
(
uStar
))
{
uStar
=
0
;
}
stu
.
stars
=
uStar
+
value
;
stu
.
stars
=
uStar
+
value
;
stuChannelData
[
uid
]
=
stu
stuChannelData
[
uid
]
=
stu
}
}
}
else
{
}
else
{
this
.
state
.
users
.
forEach
((
u
,
_uid
)
=>
{
this
.
state
.
users
.
forEach
((
u
,
_uid
)
=>
{
if
(
u
.
role
===
'
student
'
)
{
(
data
.
users
as
number
[]).
push
(
+
_uid
)
u
.
stars
=
u
.
stars
+
value
;
u
.
stars
=
u
.
stars
+
value
;
stuChannelData
[
_uid
]
=
u
stuChannelData
[
_uid
]
=
u
}
})
})
}
}
const
host
=
getApiServerHost
(
true
);
var
blob
=
new
Blob
([
JSON
.
stringify
(
data
)],
{
type
:
'
text/plain
'
});
navigator
.
sendBeacon
(
`
${
host
}
/api/classroom/stars`
,
blob
);
// this.state = {
// this.state = {
// ...this.state,
// ...this.state,
...
@@ -1285,7 +1298,8 @@ export class RoomStore {
...
@@ -1285,7 +1298,8 @@ export class RoomStore {
audio
:
user
.
audio
,
audio
:
user
.
audio
,
chat
:
user
.
chat
,
chat
:
user
.
chat
,
grant_board
:
user
.
grantBoard
,
grant_board
:
user
.
grantBoard
,
last_stage_ts
:
user
.
lastStageTs
last_stage_ts
:
user
.
lastStageTs
,
stars
:
user
.
stars
}
}
if
(
user
.
role
===
'
teacher
'
)
{
if
(
user
.
role
===
'
teacher
'
)
{
Object
.
assign
(
attrs
,
{
Object
.
assign
(
attrs
,
{
...
@@ -1422,7 +1436,7 @@ export class RoomStore {
...
@@ -1422,7 +1436,7 @@ export class RoomStore {
}
}
async
updateMe
(
user
:
any
,
studentsOrder
:
number
[]
=
[])
{
async
updateMe
(
user
:
any
,
studentsOrder
:
number
[]
=
[])
{
const
{
role
,
uid
,
account
,
rid
,
video
,
audio
,
chat
,
boardId
,
linkId
,
sharedId
,
muteChat
,
muteAudio
,
grantBoard
}
=
user
;
const
{
role
,
uid
,
account
,
rid
,
video
,
audio
,
chat
,
boardId
,
linkId
,
sharedId
,
muteChat
,
muteAudio
,
grantBoard
,
stars
}
=
user
;
const
key
=
role
===
'
teacher
'
?
'
teacher
'
:
uid
;
const
key
=
role
===
'
teacher
'
?
'
teacher
'
:
uid
;
const
me
=
this
.
state
.
me
;
const
me
=
this
.
state
.
me
;
const
attrs
=
{
const
attrs
=
{
...
@@ -1442,7 +1456,8 @@ export class RoomStore {
...
@@ -1442,7 +1456,8 @@ export class RoomStore {
link_uid
:
linkId
,
link_uid
:
linkId
,
shared_uid
:
sharedId
,
shared_uid
:
sharedId
,
grant_board
:
grantBoard
,
grant_board
:
grantBoard
,
last_stage_ts
:
Date
.
now
()
last_stage_ts
:
Date
.
now
(),
stars
});
});
console
.
log
(
'
updateMe in
'
,
user
);
console
.
log
(
'
updateMe in
'
,
user
);
...
@@ -1641,7 +1656,7 @@ export class RoomStore {
...
@@ -1641,7 +1656,7 @@ export class RoomStore {
}
}
async
updateRoomAttrs
({
teacher
,
accounts
,
room
,
studentsOrder
,
userStars
}:
{
teacher
:
any
,
accounts
:
any
,
room
:
any
,
studentsOrder
:
number
[],
userStars
:
any
})
{
async
updateRoomAttrs
({
teacher
,
accounts
,
room
,
studentsOrder
/*, userStars*/
}:
{
teacher
:
any
,
accounts
:
any
,
room
:
any
,
studentsOrder
:
number
[]
/*, userStars: any*/
})
{
console
.
log
(
"
[agora-board], room:
"
,
teacher
,
accounts
,
room
,
studentsOrder
);
console
.
log
(
"
[agora-board], room:
"
,
teacher
,
accounts
,
room
,
studentsOrder
);
const
currentRoomUsers
=
this
.
state
.
users
.
toArray
();
const
currentRoomUsers
=
this
.
state
.
users
.
toArray
();
const
exitUserIds
=
[];
const
exitUserIds
=
[];
...
...
src/utils/agora-rtm-client.ts
View file @
ec88b4d8
...
@@ -2,6 +2,8 @@ import AgoraRTM from 'agora-rtm-sdk';
...
@@ -2,6 +2,8 @@ import AgoraRTM from 'agora-rtm-sdk';
import
EventEmitter
from
'
events
'
;
import
EventEmitter
from
'
events
'
;
import
*
as
_
from
'
lodash
'
;
import
*
as
_
from
'
lodash
'
;
import
{
resolveMessage
,
jsonParse
}
from
'
./helper
'
;
import
{
resolveMessage
,
jsonParse
}
from
'
./helper
'
;
import
{
globalStore
}
from
"
../stores/global
"
;
import
{
roomStore
}
from
"
../stores/room
"
;
export
const
APP_ID
=
process
.
env
.
REACT_APP_AGORA_APP_ID
as
string
;
export
const
APP_ID
=
process
.
env
.
REACT_APP_AGORA_APP_ID
as
string
;
const
ENABLE_LOG
=
process
.
env
.
REACT_APP_AGORA_LOG
===
'
true
'
;
const
ENABLE_LOG
=
process
.
env
.
REACT_APP_AGORA_LOG
===
'
true
'
;
...
@@ -59,7 +61,7 @@ export default class AgoraRTMClient {
...
@@ -59,7 +61,7 @@ export default class AgoraRTMClient {
this
.
_channelAttrsKey
=
null
;
this
.
_channelAttrsKey
=
null
;
this
.
_client
=
AgoraRTM
.
createInstance
(
APP_ID
,
{
enableLogUpload
:
false
,
logFilter
});
this
.
_client
=
AgoraRTM
.
createInstance
(
APP_ID
,
{
enableLogUpload
:
false
,
logFilter
});
}
}
async
addOrUpdateChannelAttributes
(
data
:
any
,
enableNotificationToChannelMembers
=
true
):
Promise
<
string
>
{
async
addOrUpdateChannelAttributes
(
data
:
any
,
enableNotificationToChannelMembers
=
true
):
Promise
<
string
|
undefined
>
{
if
(
!
_channelAttrCallCounterTimer
)
{
if
(
!
_channelAttrCallCounterTimer
)
{
_channelAttrCallCounterTimer
=
setTimeout
(()
=>
{
_channelAttrCallCounterTimer
=
setTimeout
(()
=>
{
console
.
log
(
'
current 10s call
'
,
_channelAttrCallCounter
);
console
.
log
(
'
current 10s call
'
,
_channelAttrCallCounter
);
...
@@ -70,12 +72,27 @@ export default class AgoraRTMClient {
...
@@ -70,12 +72,27 @@ export default class AgoraRTMClient {
}
}
_channelAttrCallCounter
++
;
_channelAttrCallCounter
++
;
if
(
_channelAttrCallCounter
>
10
)
{
if
(
roomStore
.
state
.
me
.
role
===
'
teacher
'
)
{
// globalStore.showDialog({type: 'closeDialog', message: '频繁操作,请重试'});
globalStore
.
showToast
({
message
:
`频繁过于操作,请重试`
,
type
:
'
notice
'
});
}
return
}
const
channelAttributes
:
{[
key
:
string
]:
string
}
=
{};
const
channelAttributes
:
{[
key
:
string
]:
string
}
=
{};
for
(
const
k
of
Object
.
keys
(
data
))
{
for
(
const
k
of
Object
.
keys
(
data
))
{
channelAttributes
[
k
]
=
typeof
(
data
[
k
])
!=
'
string
'
?
JSON
.
stringify
(
data
[
k
])
:
data
[
k
];
channelAttributes
[
k
]
=
typeof
(
data
[
k
])
!=
'
string
'
?
JSON
.
stringify
(
data
[
k
])
:
data
[
k
];
}
}
try
{
return
await
this
.
_client
.
addOrUpdateChannelAttributes
(
this
.
_currentChannelName
,
channelAttributes
,
{
enableNotificationToChannelMembers
});
return
await
this
.
_client
.
addOrUpdateChannelAttributes
(
this
.
_currentChannelName
,
channelAttributes
,
{
enableNotificationToChannelMembers
});
}
catch
(
e
)
{
debugger
}
}
}
public
removeAllListeners
():
any
{
public
removeAllListeners
():
any
{
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment