Commit ec88b4d8 authored by liujiaxin's avatar liujiaxin

用户金币奖励保存到ac项目

parent 9e379994
...@@ -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();
......
...@@ -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;}
......
...@@ -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}
......
...@@ -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') {
......
/*.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;
}
*/
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>
)
}
...@@ -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,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"); background-image: url("data:image/png;base64,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");
} background-repeat: no-repeat;
.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');
}
} }
.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%;
......
...@@ -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}*/}
......
...@@ -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 (
......
...@@ -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;
......
...@@ -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) => {
u.stars = u.stars + value; if (u.role === 'student') {
stuChannelData[_uid] = u (data.users as number[]).push(+_uid)
u.stars = u.stars + value;
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 = [];
......
...@@ -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];
} }
return await this._client.addOrUpdateChannelAttributes(this._currentChannelName, channelAttributes, {enableNotificationToChannelMembers}); try{
return await this._client.addOrUpdateChannelAttributes(this._currentChannelName, channelAttributes, {enableNotificationToChannelMembers});
} catch (e) {
debugger
}
} }
public removeAllListeners(): any { public removeAllListeners(): any {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment