Commit 6c897a12 authored by liujiangnan's avatar liujiangnan

登录整改,集成课件联调

parent bc56e5d1
......@@ -5,6 +5,7 @@ import { AgoraElectronStream, StreamType, nativeRTCClient as nativeClient } from
import { useRoomState } from '../containers/root-container';
import { platform } from '../utils/platform';
import {makeStyles} from "@material-ui/core/styles";
import { endPoint } from '../services/agora-end-points';
const contentMode = 0;
......@@ -35,20 +36,11 @@ const useStyles = makeStyles({
}
});
const CourseWareFrame: React.FC = () => {
const classes = useStyles();
const ref = useRef<any>('');
const [src, setSrc] = useState('')
const changSrc = (evt: any) => {
setSrc(ref.current.value);
}
const classes = useStyles();
const src = endPoint.getCourseUrl();
return (
<div className={classes.style1}>
<div className={classes.style2}>
<input type="text" ref={ref} className={classes.style3} />
<button onClick={changSrc} className={classes.style4}>GO</button>
</div>
<iframe src={src} className={classes.frm}></iframe>
</div>
)
......
......@@ -29,7 +29,7 @@ export default function (props: any) {
return (
<>
<InputLabel>{props.Label}</InputLabel>
<Input className={classes.formInput} value={props.value}
<Input className={classes.formInput} type={props.type} value={props.value}
onChange={onChange}>
</Input>
{props.requiredText ? <Typography className={classes.required}>{props.requiredText}</Typography> : null}
......
......@@ -13,6 +13,7 @@ import { roomStore } from '../stores/room';
import { genUid } from '../utils/helper';
import MD5 from 'js-md5';
import { globalStore } from '../stores/global';
import { endPoint } from '../services/agora-end-points';
export const roomTypes = [
{value: 0, text: 'One-to-One', path: 'one-to-one'},
......@@ -31,6 +32,7 @@ type SessionInfo = {
roomName: string
roomType: number
yourName: string
yourPass: string
role: string
}
......@@ -39,6 +41,7 @@ const defaultState: SessionInfo = {
roomType: 1,
role: '',
yourName: '',
yourPass: ''
}
function HomePage() {
......@@ -66,63 +69,65 @@ function HomePage() {
const [required, setRequired] = useState<any>({} as any);
const handleSubmit = () => {
if (!session.roomName) {
setRequired({...required, roomName: 'missing room name'});
return;
}
const handleSubmit = () => {
if (!session.yourName) {
setRequired({...required, yourName: 'missing your name'});
return;
}
if (!session.role) {
setRequired({...required, role: 'missing role'});
if (!session.yourPass) {
setRequired({...required, yourPass: 'missing your password'});
return;
}
if (!roomTypes[session.roomType]) return;
const path = roomTypes[session.roomType].path
const payload = {
uid: session.yourName, // genUid(),
rid: session.roomName, // `${session.roomType}${MD5(session.roomName)}`,
role: session.role,
roomName: session.roomName,
roomType: session.roomType,
video: 0,
audio: 0,
chat: 1,
account: session.yourName,
token: '',
boardId: '',
linkId: 0,
sharedId: 0,
lockBoard: 0,
}
ref.current = true;
globalStore.showLoading();
roomStore.loginAndJoin(payload).then(() => {
roomStore.updateSessionInfo(payload);
history.push(`/classroom/${path}`);
}).catch((err: any) => {
if (err.reason) {
globalStore.showToast({
type: 'rtmClient',
message: err.reason
})
} else {
globalStore.showToast({
type: 'rtmClient',
message: 'login failure, please checkout ur network'
})
}
endPoint.login({username: session.yourName, password: session.yourPass}).then((userInfo: any) => {
console.log(userInfo);
session.roomName = userInfo["class_id"];
session.yourName = userInfo["nick_name"];
session.role = userInfo["classRole"]==="tea"?"teacher":"student";
session.roomType = 1;
if (!roomTypes[session.roomType]) return;
const path = roomTypes[session.roomType].path
const payload = {
uid: userInfo["uuid"], // genUid(),
rid: session.roomName, // `${session.roomType}${MD5(session.roomName)}`,
role: session.role,
roomName: session.roomName,
roomType: session.roomType,
video: 0,
audio: 0,
chat: 1,
account: session.yourName,
token: '',
boardId: '',
linkId: 0,
sharedId: 0,
lockBoard: 0,
}
console.warn(err);
})
.finally(() => {
ref.current = false;
globalStore.stopLoading();
})
ref.current = true;
globalStore.showLoading();
roomStore.loginAndJoin(payload).then(() => {
roomStore.updateSessionInfo(payload);
history.push(`/classroom/${path}`);
}).catch((err: any) => {
if (err.reason) {
globalStore.showToast({
type: 'rtmClient',
message: err.reason
})
} else {
globalStore.showToast({
type: 'rtmClient',
message: 'login failure, please checkout ur network'
})
}
console.warn(err);
})
.finally(() => {
ref.current = false;
globalStore.stopLoading();
})
});
}
return (
......@@ -155,20 +160,9 @@ function HomePage() {
<div className="position-top card-menu">
<HomeBtn handleSetting={handleSetting}/>
</div>
<div className="position-content flex-direction-column">
<div className="position-content flex-direction-column">
<FormControl className={classes.formControl}>
<FormInput Label={"Room Name"} value={session.roomName} onChange={
(val: string) => {
setSessionInfo({
...session,
roomName: val
});
}}
requiredText={required.roomName}
/>
</FormControl>
<FormControl className={classes.formControl}>
<FormInput Label={"Your Name"} value={session.yourName} onChange={
<FormInput Label={"User Name"} value={session.yourName} onChange={
(val: string) => {
setSessionInfo({
...session,
......@@ -179,26 +173,16 @@ function HomePage() {
/>
</FormControl>
<FormControl className={classes.formControl}>
<FormSelect
Label={"Room Type"}
value={session.roomType}
onChange={(evt: any) => {
<FormInput Label={"Password"} type="password" value={session.yourPass} onChange={
(val: string) => {
setSessionInfo({
...session,
roomType: evt.target.value
yourPass: val
});
}}
items={roomTypes}
requiredText={required.yourPass}
/>
</FormControl>
<FormControl className={classes.formControl}>
<RoleRadio value={session.role} onChange={(evt: any) => {
setSessionInfo({
...session,
role: evt.target.value
});
}} requiredText={required.role}></RoleRadio>
</FormControl>
</FormControl>
<Button name={"Join"} onClick={handleSubmit}/>
</div>
</div>
......
import { AgoraFetch } from "../utils/fetch";
import jwt_decode from 'jwt-decode';
const ENDPOINT: string = process.env.REACT_APP_AGORA_ENDPOINT as string;
......@@ -44,10 +45,39 @@ export interface RoomParams {
export class EndPoint {
appID: string = '';
roomId: string = '';
userToken: string = '';
roomId: string = '';
userToken: string = '';
recordId: string = '';
async login(data: any) {
let json = await AgoraFetchJson({
url: `${ENDPOINT}/api/login`,
method: 'POST',
data: data
});
let token = json.data;
this.userToken = token;
try {
let userInfo = jwt_decode(token);
return userInfo;
} catch (Error) {
return null;
}
}
getUserInfo(){
try {
let userInfo = jwt_decode(this.userToken);
return userInfo;
} catch (Error) {
return null;
}
}
getCourseUrl(){
return `${ENDPOINT}/airclass_ol?token=${this.userToken}`;
}
async config() {
let json = await AgoraFetchJson({
url: `${ENDPOINT}/v1/room/config`,
......@@ -178,4 +208,6 @@ export class EndPoint {
}
}
}
\ No newline at end of file
}
export const endPoint = new EndPoint();
\ No newline at end of file
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