m52mxtq3o
/
educoder
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

调整 全局esc 刷新问题

Browse Source
dev_forum
杨树明 6 years ago
parent 69097619b3
commit 3eb10b62fa
7 changed files with 1403 additions and 1393 deletions
Show Stats Download Patch File Download Diff File

1
public/react/src/context/TPIContextProvider.js
Unescape View File

@ -892,6 +892,7 @@ pop_box_new(htmlvalue, 480, 182);
<Dialog <Dialog
id="tpi-dialog" id="tpi-dialog"
open={this.state.gDialogOpen} open={this.state.gDialogOpen}
disableEscapeKeyDown={true}
onClose={() => this.handleGdialogClose()} onClose={() => this.handleGdialogClose()}
> >
<DialogTitle id="alert-dialog-title">{"提示"}</DialogTitle> <DialogTitle id="alert-dialog-title">{"提示"}</DialogTitle>

2
public/react/src/modules/comment/Comments.js
Unescape View File

@ -505,6 +505,7 @@ class Comments extends Component {
</Modals> : </Modals> :
<Dialog <Dialog
open={dialogOpen} open={dialogOpen}
disableEscapeKeyDown={true}
onClose={this.handleDialogClose} onClose={this.handleDialogClose}
> >
<DialogTitle id="alert-dialog-title">{"提示"}</DialogTitle> <DialogTitle id="alert-dialog-title">{"提示"}</DialogTitle>
@ -531,6 +532,7 @@ class Comments extends Component {
<Dialog <Dialog
open={goldRewardDialogOpen} open={goldRewardDialogOpen}
disableEscapeKeyDown={true}
onClose={this.handleGoldRewardDialogClose} onClose={this.handleGoldRewardDialogClose}
> >
<DialogTitle id="alert-dialog-title">{"奖励设置"}</DialogTitle> <DialogTitle id="alert-dialog-title">{"奖励设置"}</DialogTitle>

177
public/react/src/modules/common/RewardDialog.js
Unescape View File

@ -1,88 +1,89 @@
import React, { Component } from 'react'; import React, { Component } from 'react';
import Dialog, { import Dialog, {
DialogActions, DialogActions,
DialogContent, DialogContent,
DialogContentText, DialogContentText,
DialogTitle, DialogTitle,
} from 'material-ui/Dialog'; } from 'material-ui/Dialog';
import Button from 'material-ui/Button'; import Button from 'material-ui/Button';
import { FormControl, FormHelperText } from 'material-ui/Form'; import { FormControl, FormHelperText } from 'material-ui/Form';
import Input, { InputLabel } from 'material-ui/Input'; import Input, { InputLabel } from 'material-ui/Input';
class RewardDialog extends Component { class RewardDialog extends Component {
constructor(props) { constructor(props) {
super(props) super(props)
this.handleGoldRewardDialogClose = this.handleGoldRewardDialogClose.bind(this) this.handleGoldRewardDialogClose = this.handleGoldRewardDialogClose.bind(this)
this.state = { this.state = {
// goldRewardDialogOpen: false, // goldRewardDialogOpen: false,
goldRewardInput: '', goldRewardInput: '',
} }
} }
showGoldRewardDialog(comment, childComment) { showGoldRewardDialog(comment, childComment) {
if (comment.admin === true) { if (comment.admin === true) {
this.comment = comment; this.comment = comment;
this.childComment = childComment; this.childComment = childComment;
this.setState({goldRewardDialogOpen: true}) this.setState({goldRewardDialogOpen: true})
} }
} }
handleGoldRewardDialogClose() { handleGoldRewardDialogClose() {
this.props.setRewardDialogVisible(false) this.props.setRewardDialogVisible(false)
} }
onGoldRewardDialogOkBtnClick() { onGoldRewardDialogOkBtnClick() {
console.log('onGoldRewardDialogOkBtnClick') console.log('onGoldRewardDialogOkBtnClick')
const { goldRewardInput } = this.state; const { goldRewardInput } = this.state;
if (!goldRewardInput || goldRewardInput === '0' || goldRewardInput.indexOf('-') !== -1) { if (!goldRewardInput || goldRewardInput === '0' || goldRewardInput.indexOf('-') !== -1) {
this.setState({ goldRewardInputError: true}) this.setState({ goldRewardInputError: true})
return; return;
} else { } else {
this.props.setRewardDialogVisible( false ) this.props.setRewardDialogVisible( false )
this.props.rewardCode(goldRewardInput) this.props.rewardCode(goldRewardInput)
} }
} }
onGoldRewardInputChange(event) { onGoldRewardInputChange(event) {
this.setState({ goldRewardInput: event.target.value, goldRewardInputError: false }); this.setState({ goldRewardInput: event.target.value, goldRewardInputError: false });
} }
render() { render() {
const { goldRewardDialogOpen } = this.props; const { goldRewardDialogOpen } = this.props;
const { goldRewardInputError } = this.state; const { goldRewardInputError } = this.state;
const goldRewardInputErrorObj = goldRewardInputError ? {'error': 'error'} : {} const goldRewardInputErrorObj = goldRewardInputError ? {'error': 'error'} : {}
return ( return (
<Dialog <Dialog
open={goldRewardDialogOpen} open={goldRewardDialogOpen}
onClose={this.handleGoldRewardDialogClose} disableEscapeKeyDown={true}
> onClose={this.handleGoldRewardDialogClose}
<DialogTitle id="alert-dialog-title">{"奖励设置"}</DialogTitle> >
<DialogContent> <DialogTitle id="alert-dialog-title">{"奖励设置"}</DialogTitle>
<DialogContent>
<FormControl { ...goldRewardInputErrorObj } aria-describedby="name-error-text">
<InputLabel htmlFor="goldReward">请输入奖励的金币数量</InputLabel> <FormControl { ...goldRewardInputErrorObj } aria-describedby="name-error-text">
<Input id="goldReward" type="number" value={this.state.goldRewardInput} onChange={(e) => this.onGoldRewardInputChange(e)} /> <InputLabel htmlFor="goldReward">请输入奖励的金币数量</InputLabel>
{ goldRewardInputError ? <FormHelperText id="name-error-text">奖励金币不能为空或负数</FormHelperText> : ''} <Input id="goldReward" type="number" value={this.state.goldRewardInput} onChange={(e) => this.onGoldRewardInputChange(e)} />
</FormControl> { goldRewardInputError ? <FormHelperText id="name-error-text">奖励金币不能为空或负数</FormHelperText> : ''}
</FormControl>
{/*<DialogContentText id="alert-dialog-description" style={{textAlign: 'center'}}> </DialogContentText>*/}
</DialogContent> {/*<DialogContentText id="alert-dialog-description" style={{textAlign: 'center'}}> </DialogContentText>*/}
<DialogActions> </DialogContent>
<Button onClick={this.handleGoldRewardDialogClose} color="primary"> <DialogActions>
取消 <Button onClick={this.handleGoldRewardDialogClose} color="primary">
</Button> 取消
<Button variant="raised" </Button>
onClick={() => this.onGoldRewardDialogOkBtnClick() } color="primary" autoFocus> <Button variant="raised"
确定 onClick={() => this.onGoldRewardDialogOkBtnClick() } color="primary" autoFocus>
</Button> 确定
</DialogActions> </Button>
</Dialog> </DialogActions>
); </Dialog>
} );
} }
}
export default RewardDialog;
export default RewardDialog;

1
public/react/src/modules/login/LoginDialog.js
Unescape View File

@ -381,6 +381,7 @@ class LoginDialog extends Component {
return ( return (
<Dialog open={true} id="DialogID" <Dialog open={true} id="DialogID"
style={{ display: isRender==false? 'none' : ''}} style={{ display: isRender==false? 'none' : ''}}
disableEscapeKeyDown={true}
onClose={() => this.handleDialogClose()} onClose={() => this.handleDialogClose()}
> >
<div className={dialogBox}> <div className={dialogBox}>

1
public/react/src/modules/login/Trialapplication.js
Unescape View File

@ -538,6 +538,7 @@ class Trialapplication extends Component {
style={{height: '0', width: '0', border: 'none', display: "none"}}/> style={{height: '0', width: '0', border: 'none', display: "none"}}/>
<Dialog open={true} id="DialogIDysl" <Dialog open={true} id="DialogIDysl"
disableEscapeKeyDown={true}
style={{display: isRenders == false ? 'none' : '', "border-radius": "10px"}} style={{display: isRenders == false ? 'none' : '', "border-radius": "10px"}}
> >
<div id="closeIcon" onClick={() => { <div id="closeIcon" onClick={() => {

1895
public/react/src/modules/page/MainContentContainer.js
View File

File diff suppressed because it is too large Load Diff

719
public/react/src/modules/page/main/LeftView.js
Unescape View File

@ -1,359 +1,360 @@
import React, { Component } from 'react'; import React, { Component } from 'react';
import ContentLoader from 'react-content-loader' import ContentLoader from 'react-content-loader'
import Tooltip from 'material-ui/Tooltip'; import Tooltip from 'material-ui/Tooltip';
import Dialog, { import Dialog, {
DialogActions, DialogActions,
DialogContent, DialogContent,
DialogContentText, DialogContentText,
DialogTitle, DialogTitle,
} from 'material-ui/Dialog'; } from 'material-ui/Dialog';
import { CircularProgress } from 'material-ui/Progress'; import { CircularProgress } from 'material-ui/Progress';
import Button from 'material-ui/Button'; import Button from 'material-ui/Button';
import IconButton from 'material-ui/IconButton'; import IconButton from 'material-ui/IconButton';
import CommentContainer from '../../comment/CommentContainer' import CommentContainer from '../../comment/CommentContainer'
import CommentInput from '../../comment/CommentInput' import CommentInput from '../../comment/CommentInput'
import ChooseAnswerView from '../component/ChooseAnswerView' import ChooseAnswerView from '../component/ChooseAnswerView'
import { withStyles } from 'material-ui/styles'; import { withStyles } from 'material-ui/styles';
import { markdownToHTML } from 'educoder' import { markdownToHTML } from 'educoder'
import AnswerListContainer from './answer/AnswerListContainer' import AnswerListContainer from './answer/AnswerListContainer'
import './leftView.css' import './leftView.css'
import CodeEvaluateMultiLevelAnswerUnlock from './CodeEvaluateMultiLevelAnswerUnlock' import CodeEvaluateMultiLevelAnswerUnlock from './CodeEvaluateMultiLevelAnswerUnlock'
import MUIDialogStyleUtil from '../component/MUIDialogStyleUtil' import MUIDialogStyleUtil from '../component/MUIDialogStyleUtil'
// http://danilowoz.com/create-react-content-loader/ // http://danilowoz.com/create-react-content-loader/
const MyLoader = () => ( const MyLoader = () => (
<ContentLoader <ContentLoader
height={600} height={600}
width={400} width={400}
speed={2} speed={2}
primaryColor={"#000000"} primaryColor={"#000000"}
secondaryColor={"#ecebeb"} secondaryColor={"#ecebeb"}
> >
<rect x="0" y="10" rx="3" ry="3" width="320" height="6.4" /> <rect x="0" y="10" rx="3" ry="3" width="320" height="6.4" />
<rect x="0" y="35" rx="3" ry="3" width="85" height="10" /> <rect x="0" y="35" rx="3" ry="3" width="85" height="10" />
<rect x="0" y="60" rx="3" ry="3" width="350" height="6.4" /> <rect x="0" y="60" rx="3" ry="3" width="350" height="6.4" />
<rect x="0" y="80" rx="3" ry="3" width="350" height="6.4" /> <rect x="0" y="80" rx="3" ry="3" width="350" height="6.4" />
<rect x="0" y="100" rx="3" ry="3" width="350" height="6.4" /> <rect x="0" y="100" rx="3" ry="3" width="350" height="6.4" />
<rect x="0" y="120" rx="3" ry="3" width="101" height="6.4" /> <rect x="0" y="120" rx="3" ry="3" width="101" height="6.4" />
<rect x="0" y="145" rx="3" ry="3" width="65" height="10" /> <rect x="0" y="145" rx="3" ry="3" width="65" height="10" />
<rect x="0" y="170" rx="3" ry="3" width="350" height="6.4" /> <rect x="0" y="170" rx="3" ry="3" width="350" height="6.4" />
<rect x="0" y="190" rx="3" ry="3" width="350" height="6.4" /> <rect x="0" y="190" rx="3" ry="3" width="350" height="6.4" />
<rect x="0" y="210" rx="3" ry="3" width="201" height="6.4" /> <rect x="0" y="210" rx="3" ry="3" width="201" height="6.4" />
</ContentLoader> </ContentLoader>
) )
const styles = MUIDialogStyleUtil.getTwoButtonStyle( const styles = MUIDialogStyleUtil.getTwoButtonStyle(
(theme) => { return { (theme) => { return {
iconButton: { iconButton: {
margin: theme.spacing.unit, margin: theme.spacing.unit,
// background: '#05101A', // background: '#05101A',
color: '#4CACFF', color: '#4CACFF',
top: '-7px', top: '-7px',
width: '36px', width: '36px',
height: '36px', height: '36px',
} }
} }
} }
) )
// const styles = theme => (); // const styles = theme => ();
class LeftView extends Component { class LeftView extends Component {
goToCertification() { goToCertification() {
window.open('/account/professional_certification', '_blank'); window.open('/account/professional_certification', '_blank');
} }
// /shixuns/mnf6b7z3/shixun_discuss?challenge_id=88 // /shixuns/mnf6b7z3/shixun_discuss?challenge_id=88
render() { render() {
let { challenge, shixun, tabIndex, tabIndexChange, loading, discusses_count let { challenge, shixun, tabIndex, tabIndexChange, loading, discusses_count
, dialogOpen, handleDialogClose, handleDialogReadAnswer, gameAnswer, loadingComments, st, user, , dialogOpen, handleDialogClose, handleDialogReadAnswer, gameAnswer, loadingComments, st, user,
classes, onDrawerButtonClick, lockedAnswers, unlockedAnswers, isMultiLevelAnswer } = this.props classes, onDrawerButtonClick, lockedAnswers, unlockedAnswers, isMultiLevelAnswer } = this.props
let propaedeutics = shixun ? shixun.propaedeutics : null; let propaedeutics = shixun ? shixun.propaedeutics : null;
let _hasAnswer = challenge.hasAnswer // st === 1 || let _hasAnswer = challenge.hasAnswer // st === 1 ||
// const actions = [ // const actions = [
// <Button // <Button
// label="取消" // label="取消"
// primary={true} // primary={true}
// onClick={handleDialogClose} // onClick={handleDialogClose}
// style={{marginRight: '6px'}} // style={{marginRight: '6px'}}
// />, // />,
// <Button // <Button
// variant="raised" // variant="raised"
// label="确定" // label="确定"
// primary={true} // primary={true}
// onClick={handleDialogReadAnswer} // onClick={handleDialogReadAnswer}
// />, // />,
// ]; // ];
// TODO TEST // TODO TEST
// isMultiLevelAnswer = true // isMultiLevelAnswer = true
const is_teacher = user.is_teacher const is_teacher = user.is_teacher
let contentText = is_teacher ? let contentText = is_teacher ?
<React.Fragment> <React.Fragment>
<p>{`已经过职业认证的教师可以免金币查看答案哟~`}</p> <p>{`已经过职业认证的教师可以免金币查看答案哟~`}</p>
<p>{`将扣除${challenge.score}点金币，是否确认查看答案`}</p> <p>{`将扣除${challenge.score}点金币，是否确认查看答案`}</p>
<p><a onClick={()=>this.goToCertification()} style={{textDecoration: 'underline'}}>立即认证</a></p> <p><a onClick={()=>this.goToCertification()} style={{textDecoration: 'underline'}}>立即认证</a></p>
</React.Fragment> </React.Fragment>
: :
<React.Fragment> <React.Fragment>
<p>{`先查看参考答案，再通过评测的学生，实训作业有可能是零分哦~`}</p> <p>{`先查看参考答案，再通过评测的学生，实训作业有可能是零分哦~`}</p>
<p>{`将扣除${challenge.score}点金币，是否确认查看答案`}</p> <p>{`将扣除${challenge.score}点金币，是否确认查看答案`}</p>
</React.Fragment>; </React.Fragment>;
// 多级别解锁 // 多级别解锁
if (isMultiLevelAnswer) { if (isMultiLevelAnswer) {
// power === 0 && // power === 0 &&
contentText = ( is_teacher ) ? contentText = ( is_teacher ) ?
            <React.Fragment>             <React.Fragment>
             <p>{`已经过职业认证的教师可以免金币查看答案哟~`}</p>              <p>{`已经过职业认证的教师可以免金币查看答案哟~`}</p>
<p><a style={{textDecoration: 'underline'}} onClick={()=>this.goToCertification()} <p><a style={{textDecoration: 'underline'}} onClick={()=>this.goToCertification()}
style={{ color: '#1890ff', 'margin-top': '6px', display: 'inline-block'}}>立即认证</a></p> style={{ color: '#1890ff', 'margin-top': '6px', display: 'inline-block'}}>立即认证</a></p>
<CodeEvaluateMultiLevelAnswerUnlock <CodeEvaluateMultiLevelAnswerUnlock
ref="answerUnlock" lockedAnswers={lockedAnswers} unlockedAnswers={unlockedAnswers} ref="answerUnlock" lockedAnswers={lockedAnswers} unlockedAnswers={unlockedAnswers}
challenge={challenge} challenge={challenge}
> >
</CodeEvaluateMultiLevelAnswerUnlock> </CodeEvaluateMultiLevelAnswerUnlock>
            </React.Fragment>             </React.Fragment>
              :               :
            <React.Fragment>             <React.Fragment>
<p>{`先查看参考答案，再通过评测的学生，实训作业将被扣分`}</p> <p>{`先查看参考答案，再通过评测的学生，实训作业将被扣分`}</p>
{/* { MultiLevelUnlockTable } */} {/* { MultiLevelUnlockTable } */}
<CodeEvaluateMultiLevelAnswerUnlock <CodeEvaluateMultiLevelAnswerUnlock
ref="answerUnlock" lockedAnswers={lockedAnswers} unlockedAnswers={unlockedAnswers} ref="answerUnlock" lockedAnswers={lockedAnswers} unlockedAnswers={unlockedAnswers}
challenge={challenge} challenge={challenge}
> >
</CodeEvaluateMultiLevelAnswerUnlock> </CodeEvaluateMultiLevelAnswerUnlock>
            </React.Fragment>;             </React.Fragment>;
} }
/** /**
{ is_teacher ? <Button size="small" variant="raised" style={{ marginRight: '20px'}} { is_teacher ? <Button size="small" variant="raised" style={{ marginRight: '20px'}}
onClick={()=>this.goToCertification()} color="primary"> onClick={()=>this.goToCertification()} color="primary">
{ '立即认证' } { '立即认证' }
</Button> : ''} </Button> : ''}
*/ */
return ( return (
<React.Fragment> <React.Fragment>
<Dialog <Dialog
open={dialogOpen} open={dialogOpen}
onClose={handleDialogClose} disableEscapeKeyDown={true}
> onClose={handleDialogClose}
<DialogTitle id="alert-dialog-title">{"提示"}</DialogTitle> >
<DialogContent id="dialog-content" > <DialogTitle id="alert-dialog-title">{"提示"}</DialogTitle>
<DialogContentText id="alert-dialog-description" style={{textAlign: 'center'}}> <DialogContent id="dialog-content" >
{ contentText } <DialogContentText id="alert-dialog-description" style={{textAlign: 'center'}}>
</DialogContentText> { contentText }
</DialogContent> </DialogContentText>
{/* http://localhost:3000/account/professional_certification */} </DialogContent>
<DialogActions id="dialog-actions"> {/* http://localhost:3000/account/professional_certification */}
<DialogActions id="dialog-actions">
<Button onClick={handleDialogClose} color="primary" className={`${classes.button} ${classes.buttonGray}`}>
取消 <Button onClick={handleDialogClose} color="primary" className={`${classes.button} ${classes.buttonGray}`}>
</Button> 取消
{/* variant={ is_teacher ? "flat" : "raised"} */} </Button>
<Button size="medium" variant={"raised"} {/* variant={ is_teacher ? "flat" : "raised"} */}
className={`${classes.button} `} <Button size="medium" variant={"raised"}
onClick={() => handleDialogReadAnswer(this.refs.answerUnlock ? this.refs.answerUnlock.getSelectedId() : '')} className={`${classes.button} `}
color="primary" autoFocus> onClick={() => handleDialogReadAnswer(this.refs.answerUnlock ? this.refs.answerUnlock.getSelectedId() : '')}
{ is_teacher ? '继续查看' : '确定'} color="primary" autoFocus>
</Button> { is_teacher ? '继续查看' : '确定'}
</DialogActions> </Button>
</DialogActions>
</Dialog>
</Dialog>
<div className="-fit -layout-v">
<div className="-fit -layout-v">
<div className="-layout-v -flex -bg-white -task-ml80">
<div className="-layout-v -flex -bg-white -task-ml80">
{/*新界面关卡名称显示、关卡金币显示*/}
<div id="task_name_section" className="task_name_section"> {/*新界面关卡名称显示、关卡金币显示*/}
<div id="task_name_section" className="task_name_section">
{ loading ? "" :
<React.Fragment> { loading ? "" :
<Tooltip title={ "点击查看全部任务" } disableFocusListener={true}> <React.Fragment>
<IconButton color="default" mini={''} aria-label="edit" className={classes.iconButton} <Tooltip title={ "点击查看全部任务" } disableFocusListener={true}>
onClick={onDrawerButtonClick}> <IconButton color="default" mini={''} aria-label="edit" className={classes.iconButton}
<i className={ "fa font-18 fa-list-ul" }></i> onClick={onDrawerButtonClick}>
</IconButton> <i className={ "fa font-18 fa-list-ul" }></i>
</Tooltip> </IconButton>
<h3 className="subject">第{challenge.position}关：{challenge.subject}</h3> </Tooltip>
<span className="btn-cir-big fr mt8 mr15">{challenge.score}</span> <h3 className="subject">第{challenge.position}关：{challenge.subject}</h3>
</React.Fragment> <span className="btn-cir-big fr mt8 mr15">{challenge.score}</span>
} </React.Fragment>
</div> }
</div>
<ul id="tab_nav" className="-tab-nav">
<li id="tab_nav_1" className={ tabIndex === 0 ? `tab_hover` : ''} onClick={() => tabIndexChange(0)}> <ul id="tab_nav" className="-tab-nav">
<a href="javascript:void(0);" className="tab_type" style={{fontSize: '16px'}}>过关任务</a> <li id="tab_nav_1" className={ tabIndex === 0 ? `tab_hover` : ''} onClick={() => tabIndexChange(0)}>
</li> <a href="javascript:void(0);" className="tab_type" style={{fontSize: '16px'}}>过关任务</a>
{/**/} </li>
{ propaedeutics && <li id="tab_nav_2" className={ tabIndex === 1 ? `tab_hover` : ''} onClick={() => tabIndexChange(1)}> {/**/}
<a href="javascript:void(0);" className="tab_type">背景知识</a> { propaedeutics && <li id="tab_nav_2" className={ tabIndex === 1 ? `tab_hover` : ''} onClick={() => tabIndexChange(1)}>
</li> } <a href="javascript:void(0);" className="tab_type">背景知识</a>
{ _hasAnswer && <li id="tab_nav_3" className={ tabIndex === 2 ? `tab_hover` : ''} onClick={() => tabIndexChange(2)}> </li> }
<a href="javascript:void(0);" className="tab_type" style={{fontSize: '16px'}}>参考答案</a> { _hasAnswer && <li id="tab_nav_3" className={ tabIndex === 2 ? `tab_hover` : ''} onClick={() => tabIndexChange(2)}>
</li> } <a href="javascript:void(0);" className="tab_type" style={{fontSize: '16px'}}>参考答案</a>
<li id="tab_nav_5" className={ tabIndex === 4 ? `tab_hover` : ''} onClick={() => tabIndexChange(4)} </li> }
style={{display: 'none'}}> <li id="tab_nav_5" className={ tabIndex === 4 ? `tab_hover` : ''} onClick={() => tabIndexChange(4)}
<a href="javascript:void(0);" className="tab_type" style={{fontSize: '16px'}}>TA人解答</a> style={{display: 'none'}}>
</li> <a href="javascript:void(0);" className="tab_type" style={{fontSize: '16px'}}>TA人解答</a>
<li id="tab_nav_4" className={ tabIndex === 3 ? `tab_hover` : ''} onClick={() => tabIndexChange(3)}> </li>
<a href="javascript:void(0)" className="tab_type" style={{fontSize: '16px'}} data-remote="true"> <li id="tab_nav_4" className={ tabIndex === 3 ? `tab_hover` : ''} onClick={() => tabIndexChange(3)}>
评论<span id="discusses_count" className="edu-cir-grey1" style={{lineHeight: '18px!important'}}>{discusses_count||""}</span> <a href="javascript:void(0)" className="tab_type" style={{fontSize: '16px'}} data-remote="true">
</a> 评论<span id="discusses_count" className="edu-cir-grey1" style={{lineHeight: '18px!important'}}>{discusses_count||""}</span>
</li> </a>
{/*<span className="btn-cir-big fr mt8 mr15">经验值：{challenge.score}</span>*/} </li>
</ul> {/*<span className="btn-cir-big fr mt8 mr15">经验值：{challenge.score}</span>*/}
<div className="cl"></div> </ul>
<div className="-flex -relative greytab-inner"> <div className="cl"></div>
{/*过关任务*/} <div className="-flex -relative greytab-inner">
<div id="tab_con_1" className="tab-info" style={ tabIndex === 0 ? {display: 'block'} : {display: 'none'} }> {/*过关任务*/}
<div className="fit -scroll"> <div id="tab_con_1" className="tab-info" style={ tabIndex === 0 ? {display: 'block'} : {display: 'none'} }>
<div className="-layout-v -fit"> <div className="fit -scroll">
{ loading ? <div className="-layout-v -fit">
<div className="-flex -scroll task-padding16 panel-box-sizing new_li break_word markdown-body editormd-html-preview" { loading ?
unselectable="on"> <div className="-flex -scroll task-padding16 panel-box-sizing new_li break_word markdown-body editormd-html-preview"
<CircularProgress size={40} thickness={3} className="circularProgress" unselectable="on">
style={{ marginLeft: 'auto', marginRight: 'auto', marginTop: '40% !important', display: 'block' }}/> <CircularProgress size={40} thickness={3} className="circularProgress"
</div> : "" style={{ marginLeft: 'auto', marginRight: 'auto', marginTop: '40% !important', display: 'block' }}/>
} </div> : ""
}
<div className="-flex -scroll task-padding16 panel-box-sizing new_li break_word markdown-body editormd-html-preview"
unselectable="on" id="game_task_pass" style={loading ? {display:'none'} : {}}> <div className="-flex -scroll task-padding16 panel-box-sizing new_li break_word markdown-body editormd-html-preview"
</div> unselectable="on" id="game_task_pass" style={loading ? {display:'none'} : {}}>
</div> </div>
</div> </div>
</div> </div>
{/*背景知识*/} </div>
<div id="tab_con_2" className="tab-info" style={ tabIndex === 1 ? {display: 'block'} : {display: 'none'} }> {/*背景知识*/}
<div className="fit -scroll"> <div id="tab_con_2" className="tab-info" style={ tabIndex === 1 ? {display: 'block'} : {display: 'none'} }>
<div className="-layout-v -fit"> <div className="fit -scroll">
<div className="-flex -scroll task-padding16 panel-box-sizing new_li markdown-body editormd-html-preview" unselectable="on" id="game_ready_knowledge"> <div className="-layout-v -fit">
<div className="-flex -scroll task-padding16 panel-box-sizing new_li markdown-body editormd-html-preview" unselectable="on" id="game_ready_knowledge">
</div>
</div> </div>
</div> </div>
</div> </div>
{/* 参考答案*/} </div>
<div id="tab_con_3" className="tab-info" style={ tabIndex === 2 ? {display: 'block'} : {display: 'none'} }> {/* 参考答案*/}
<div className="fit -scroll"> <div id="tab_con_3" className="tab-info" style={ tabIndex === 2 ? {display: 'block'} : {display: 'none'} }>
<div className="-layout-v -fit" style={{ overflowY: 'scroll' }}> <div className="fit -scroll">
{/* 只读markdown的写法 markdownToHTML 这个接口生成的markdown没有setMarkdown接口 <div className="-layout-v -fit" style={{ overflowY: 'scroll' }}>
<textarea style={{display:'none'}} id="editorMd_contents" value={gameAnswer}></textarea>*/} {/* 只读markdown的写法 markdownToHTML 这个接口生成的markdown没有setMarkdown接口
<textarea style={{display:'none'}} id="editorMd_contents" value={gameAnswer}></textarea>*/}
{ (!unlockedAnswers || unlockedAnswers.length === 0) && (!lockedAnswers || lockedAnswers.length === 0) &&
<div className="-flex -scroll task-padding16 panel-box-sizing new_li" id="game_answer_show" { (!unlockedAnswers || unlockedAnswers.length === 0) && (!lockedAnswers || lockedAnswers.length === 0) &&
style={{ display: st === 0 ? 'block' : 'none' }}> <div className="-flex -scroll task-padding16 panel-box-sizing new_li" id="game_answer_show"
</div> style={{ display: st === 0 ? 'block' : 'none' }}>
} </div>
}
<style>{`
.multiLevelAnswer { <style>{`
margin: 0px 12px; .multiLevelAnswer {
} margin: 0px 12px;
.multiLevelAnswer .anwserSection { }
padding: 20px; .multiLevelAnswer .anwserSection {
border-bottom: 1px solid #EAEAEA; padding: 20px;
} border-bottom: 1px solid #EAEAEA;
.multiLevelAnswer .df { }
display: flex; .multiLevelAnswer .df {
font-size: 15px; display: flex;
} font-size: 15px;
.multiLevelAnswer .level { }
color: #9A9A9A; .multiLevelAnswer .level {
flex: 0 0 55px; color: #9A9A9A;
} flex: 0 0 55px;
.multiLevelAnswer .name{ }
color: #4C4C4C; .multiLevelAnswer .name{
flex: 1; color: #4C4C4C;
} flex: 1;
.multiLevelAnswer .status{ }
color: #CDCDCD; .multiLevelAnswer .status{
flex: 0 0 45px; color: #CDCDCD;
} flex: 0 0 45px;
.markdown-body ol, .markdown-body ul { }
padding-left: 2.5em; .markdown-body ol, .markdown-body ul {
} padding-left: 2.5em;
`}</style> }
`}</style>
<div className="multiLevelAnswer">
{ unlockedAnswers && unlockedAnswers.map((item, index) => { <div className="multiLevelAnswer">
return <div className="anwserSection"> { unlockedAnswers && unlockedAnswers.map((item, index) => {
<div className="df"> return <div className="anwserSection">
<div className="level">级别{index + 1}：</div> <div className="df">
<div className="name">{item.name}</div> <div className="level">级别{index + 1}：</div>
<div className="status">已解锁</div> <div className="name">{item.name}</div>
</div> <div className="status">已解锁</div>
<div className="contents markdown-body" dangerouslySetInnerHTML={{__html: markdownToHTML(item.contents)}}> </div>
</div> <div className="contents markdown-body" dangerouslySetInnerHTML={{__html: markdownToHTML(item.contents)}}>
</div> </div>
})} </div>
})}
{ lockedAnswers && lockedAnswers.map((item, index) => {
return <div class="anwserSection"> { lockedAnswers && lockedAnswers.map((item, index) => {
<div className="df"> return <div class="anwserSection">
<div className="level">级别{index + 1 + (unlockedAnswers ? unlockedAnswers.length : 0)}：</div> <div className="df">
<div className="name">{item.name}</div> <div className="level">级别{index + 1 + (unlockedAnswers ? unlockedAnswers.length : 0)}：</div>
<div <div className="name">{item.name}</div>
className="status" onClick={ () => { this.props.showUnlockAnswerDialog(item) } } <div
style={{ color: '#4CACFF', cursor: 'pointer' }} className="status" onClick={ () => { this.props.showUnlockAnswerDialog(item) } }
>解锁</div> style={{ color: '#4CACFF', cursor: 'pointer' }}
</div> >解锁</div>
</div> </div>
})} </div>
})}
</div>
</div>
{ st === 1 ?
<div className="-flex -scroll task-padding16 panel-box-sizing new_li" id="game_answer_show_choose" { st === 1 ?
> <div className="-flex -scroll task-padding16 panel-box-sizing new_li" id="game_answer_show_choose"
<ChooseAnswerView gameAnswer={gameAnswer}></ChooseAnswerView> >
</div> <ChooseAnswerView gameAnswer={gameAnswer}></ChooseAnswerView>
: '' </div>
} : ''
</div> }
</div> </div>
</div> </div>
{/* TA人解答*/} </div>
<div id="tab_con_5" className="tab-info" style={ tabIndex === 4 ? {display: 'block'} : {display: 'none'} }> {/* TA人解答*/}
<div className="fit -scroll"> <div id="tab_con_5" className="tab-info" style={ tabIndex === 4 ? {display: 'block'} : {display: 'none'} }>
<div className="-layout-v -fit"> <div className="fit -scroll">
<AnswerListContainer {...this.props}></AnswerListContainer> <div className="-layout-v -fit">
</div> <AnswerListContainer {...this.props}></AnswerListContainer>
</div> </div>
</div> </div>
<div id="tab_con_4" className="tab-info commentsDelegateParent" style={ tabIndex === 3 ? {display: 'block'} : {display: 'none'} }> </div>
{ loadingComments ? <div id="tab_con_4" className="tab-info commentsDelegateParent" style={ tabIndex === 3 ? {display: 'block'} : {display: 'none'} }>
<CircularProgress size={40} thickness={3} style={{ marginLeft: 'auto', marginRight: 'auto', marginTop: '40%', display: 'block' }}/> : { loadingComments ?
<CommentContainer {...this.props}></CommentContainer> <CircularProgress size={40} thickness={3} style={{ marginLeft: 'auto', marginRight: 'auto', marginTop: '40%', display: 'block' }}/> :
} <CommentContainer {...this.props}></CommentContainer>
</div> }
</div> </div>
</div>
<div id="mini_comment_section">
{/*说点什么 */} <div id="mini_comment_section">
<CommentInput challenge={challenge} {...this.props}></CommentInput> {/*说点什么 */}
</div> <CommentInput challenge={challenge} {...this.props}></CommentInput>
</div> </div>
</div>
</div>
</React.Fragment> </div>
); </React.Fragment>
} );
} }
// <textarea style={{display:'none'}} value={challenge.task_pass ? `${challenge.task_pass}` : ''}></textarea> }
// {/*<textarea style={{display:'none'}} value={propaedeutics ? `${propaedeutics}` : ''}></textarea>*/} // <textarea style={{display:'none'}} value={challenge.task_pass ? `${challenge.task_pass}` : ''}></textarea>
export default withStyles(styles)( LeftView ); // {/*<textarea style={{display:'none'}} value={propaedeutics ? `${propaedeutics}` : ''}></textarea>*/}
export default withStyles(styles)( LeftView );

Write Preview
Loading…
Cancel
Save