|
|
import React, { Component } from 'react';
|
|
|
|
|
|
import { Link } from "react-router-dom";
|
|
|
|
|
|
import { getImageUrl ,markdownToHTML, configShareForCustom} from 'educoder';
|
|
|
|
|
|
import { CircularProgress } from 'material-ui/Progress';
|
|
|
|
|
|
import { Modal, Spin, Tooltip ,message,Icon,Button,Divider} from 'antd';
|
|
|
|
|
|
import axios from 'axios';
|
|
|
|
|
|
import '../shixunchildCss/Challenges.css';
|
|
|
|
|
|
import AccountProfile from"../../../user/AccountProfile";
|
|
|
|
|
|
const $ = window.$;
|
|
|
|
|
|
class Challenges extends Component {
|
|
|
constructor(props) {
|
|
|
super(props)
|
|
|
this.state = {
|
|
|
ChallengesDataList: undefined,
|
|
|
operate: true,
|
|
|
startbtns: false,
|
|
|
sumid: "",
|
|
|
sumidtype: false,
|
|
|
startshixunCombattype:false,
|
|
|
shixunsreplace:false,
|
|
|
shixunsmessage:"",
|
|
|
hidestartshixunsreplacevalue:"",
|
|
|
operationstrue:false,
|
|
|
isSpin:false,
|
|
|
boxoffsetHeigh:0,
|
|
|
opentitletype:true,
|
|
|
isopentitletype:"Less",
|
|
|
}
|
|
|
}
|
|
|
|
|
|
ChallengesList = () => {
|
|
|
let id = this.props.match.params.shixunId;
|
|
|
let ChallengesURL = `/shixuns/` + id + `/challenges.json`;
|
|
|
|
|
|
axios.get(ChallengesURL).then((response) => {
|
|
|
if (response.status === 200) {
|
|
|
if (response.data.status === 403||response.data.status === 401||response.data.status === 500) {
|
|
|
|
|
|
}else{
|
|
|
configShareForCustom(this.props.shixunsDetails.name, response.data.description)
|
|
|
this.setState({
|
|
|
ChallengesDataList: response.data,
|
|
|
sumidtype: false,
|
|
|
});
|
|
|
|
|
|
if(response.data.description=== ""||response.data.description===null||response.data.description===undefined){
|
|
|
this.setState({
|
|
|
isopentitletype:"Less",
|
|
|
})
|
|
|
}
|
|
|
this.getjianjiesize()
|
|
|
}
|
|
|
}
|
|
|
}).catch((error) => {
|
|
|
console.log(error)
|
|
|
});
|
|
|
}
|
|
|
|
|
|
getjianjiesize=()=>{
|
|
|
let {ChallengesDataList}=this.state;
|
|
|
let boxoffsetHeigh;
|
|
|
let box=document.getElementById("shixunchallengesid");
|
|
|
|
|
|
if(box){
|
|
|
boxoffsetHeigh=box.offsetHeight
|
|
|
if(ChallengesDataList === undefined || ChallengesDataList&&ChallengesDataList.description=== ""||ChallengesDataList&&ChallengesDataList.description===null||ChallengesDataList&&ChallengesDataList.description===undefined){
|
|
|
|
|
|
}else{
|
|
|
if(this.state.isopentitletype==="greater"){
|
|
|
|
|
|
}else{
|
|
|
if(boxoffsetHeigh>=300){
|
|
|
this.setState({
|
|
|
opentitletype:true,
|
|
|
isopentitletype:"greater",
|
|
|
boxoffsetHeigh:boxoffsetHeigh
|
|
|
})
|
|
|
}else{
|
|
|
this.setState({
|
|
|
isopentitletype:"Less",
|
|
|
boxoffsetHeigh:boxoffsetHeigh
|
|
|
})
|
|
|
}
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
}
|
|
|
|
|
|
componentDidMount() {
|
|
|
if(this.state.isopentitletype==="greater"){
|
|
|
|
|
|
}else {
|
|
|
this.ChallengesList()
|
|
|
}
|
|
|
|
|
|
}
|
|
|
componentDidUpdate = (prevProps,prevState) => {
|
|
|
|
|
|
//防止陷入无限循环
|
|
|
if(prevState.ChallengesDataList!=this.state.ChallengesDataList){
|
|
|
if(this.state.isopentitletype==="greater"){
|
|
|
|
|
|
}else{
|
|
|
this.getjianjiesize()
|
|
|
}
|
|
|
}
|
|
|
|
|
|
}
|
|
|
updatamakedown = (id) => {
|
|
|
setTimeout(() => {
|
|
|
var shixunDescr = window.editormd.markdownToHTML(id, {
|
|
|
htmlDecode: "style,script,iframe",
|
|
|
taskList: true,
|
|
|
tex: true,
|
|
|
flowChart: true,
|
|
|
sequenceDiagram: true
|
|
|
});
|
|
|
$("#" + id + " p:first").addClass("ReactMarkdown");
|
|
|
}, 200)
|
|
|
}
|
|
|
|
|
|
// 关卡的上移下移操作
|
|
|
operations = (sumid, type) => {
|
|
|
this.setState({
|
|
|
operationstrue:true
|
|
|
})
|
|
|
let { ChallengesDataList } = this.state;
|
|
|
let operationUrl;
|
|
|
if (type === "up") {
|
|
|
operationUrl = "/shixuns/" + ChallengesDataList.shixun_identifier + "/challenges/" + sumid + "/index_up.json";
|
|
|
} else if (type === "down") {
|
|
|
operationUrl = "/shixuns/" + ChallengesDataList.shixun_identifier + "/challenges/" + sumid + "/index_down.json";
|
|
|
}
|
|
|
if (this.state.operate) {
|
|
|
|
|
|
this.setState({
|
|
|
operate: false
|
|
|
});
|
|
|
axios.get(operationUrl).then((response) => {
|
|
|
if (response.status === 200) {
|
|
|
this.setState({
|
|
|
operate: true,
|
|
|
operationstrue:false
|
|
|
});
|
|
|
this.ChallengesList();
|
|
|
|
|
|
}
|
|
|
}).catch((error) => {
|
|
|
console.log(error);
|
|
|
this.setState({
|
|
|
operate: true,
|
|
|
operationstrue:false
|
|
|
});
|
|
|
this.ChallengesList()
|
|
|
})
|
|
|
}
|
|
|
}
|
|
|
delOperations = (sumid) => {
|
|
|
this.setState({
|
|
|
sumid: sumid,
|
|
|
sumidtype: true
|
|
|
})
|
|
|
}
|
|
|
|
|
|
clonedelOperationss = () => {
|
|
|
this.setState({
|
|
|
sumidtype: false
|
|
|
})
|
|
|
}
|
|
|
delOperationss = () => {
|
|
|
let { ChallengesDataList, sumid } = this.state;
|
|
|
let operationUrl = "/shixuns/" + ChallengesDataList.shixun_identifier + "/challenges/" + sumid+".json"
|
|
|
|
|
|
if (this.state.operate) {
|
|
|
this.setState({
|
|
|
operate: false,
|
|
|
sumidtype: false
|
|
|
})
|
|
|
axios.delete(operationUrl, {
|
|
|
withCredentials: true
|
|
|
}).then((response) => {
|
|
|
if (response.status === 200) {
|
|
|
this.setState({
|
|
|
operate: true,
|
|
|
sumidtype: false
|
|
|
});
|
|
|
this.ChallengesList();
|
|
|
}
|
|
|
this.ChallengesList()
|
|
|
}).catch((error) => {
|
|
|
console.log(error);
|
|
|
this.setState({
|
|
|
operate: true,
|
|
|
sumidtype: false
|
|
|
});
|
|
|
this.ChallengesList()
|
|
|
})
|
|
|
}
|
|
|
}
|
|
|
|
|
|
startgameid=(id)=>{
|
|
|
|
|
|
let url = "/shixuns/" + id + "/shixun_exec.json";
|
|
|
axios.get(url).then((response) => {
|
|
|
|
|
|
if (response.data.status === -2) {
|
|
|
this.setState({
|
|
|
shixunsreplace:true,
|
|
|
hidestartshixunsreplacevalue:response.data.message+".json"
|
|
|
})
|
|
|
} else if (response.data.status === -1) {
|
|
|
console.log(response)
|
|
|
}else if(response.data.status===-3){
|
|
|
this.setState({
|
|
|
shixunsmessage:response.data.message,
|
|
|
startshixunCombattype:true,
|
|
|
})
|
|
|
} else {
|
|
|
window.location.href = "/tasks/" + response.data.game_identifier;
|
|
|
// window.location.href = path
|
|
|
// let path="/tasks/"+response.data.game_identifier;
|
|
|
// this.props.history.push(path);
|
|
|
}
|
|
|
}).catch((error) => {
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
hidestartshixunsreplace=(url)=>{
|
|
|
this.setState({
|
|
|
isSpin:true,
|
|
|
})
|
|
|
axios.get(url).then((response) => {
|
|
|
if(response.status===200){
|
|
|
// let path="/shixuns/"+response.data.shixun_identifier+"/challenges";
|
|
|
// this.props.history.push(path);
|
|
|
message.success('重置成功，正在进入实训！');
|
|
|
this.startgameid(response.data.shixun_identifier);
|
|
|
this.setState({
|
|
|
shixunsreplace:false,
|
|
|
isSpin:false,
|
|
|
})
|
|
|
|
|
|
// message.success('重置成功，正在进入实训！');
|
|
|
// this.startshixunCombat();
|
|
|
}}
|
|
|
).catch((error) => {
|
|
|
|
|
|
});
|
|
|
|
|
|
}
|
|
|
|
|
|
//编辑实训题目选择题
|
|
|
EditTraining=(type, ids, path)=>{
|
|
|
let { ChallengesDataList } = this.state;
|
|
|
window.location.href = "/shixuns/" + ChallengesDataList.shixun_identifier + "/challenges/" + ids + path;
|
|
|
}
|
|
|
|
|
|
//开始实战按钮
|
|
|
startshixunCombat = (type, ids, id) => {
|
|
|
|
|
|
if(this.props.checkIfLogin()===false){
|
|
|
this.props.showLoginDialog()
|
|
|
return
|
|
|
}
|
|
|
|
|
|
if(this.props.checkIfProfileCompleted()===false){
|
|
|
this.setState({
|
|
|
AccountProfiletype:true
|
|
|
})
|
|
|
return
|
|
|
}
|
|
|
|
|
|
// if(this.props.checkIfProfessionalCertification()===false){
|
|
|
// this.setState({
|
|
|
// AccountProfiletype:true
|
|
|
// })
|
|
|
// return
|
|
|
// }
|
|
|
|
|
|
|
|
|
let { ChallengesDataList } = this.state;
|
|
|
// let id = this.props.match.params.shixunId;
|
|
|
this.setState({
|
|
|
startbtns: true
|
|
|
})
|
|
|
let url = "/shixuns/" + ChallengesDataList.shixun_identifier + "/shixun_exec.json?challenge_id="+id;
|
|
|
axios.get(url).then((response) => {
|
|
|
|
|
|
if (response.data.status === -2) {
|
|
|
this.setState({
|
|
|
startbtns:false,
|
|
|
shixunsreplace:true,
|
|
|
hidestartshixunsreplacevalue:response.data.message+".json"
|
|
|
})
|
|
|
} else if (response.data.status === -1) {
|
|
|
this.setState({
|
|
|
startbtns: false
|
|
|
})
|
|
|
console.log(response)
|
|
|
}else if(response.data.status===-3){
|
|
|
this.setState({
|
|
|
shixunsmessage:response.data.message,
|
|
|
startshixunCombattype:true,
|
|
|
startbtns:false
|
|
|
})
|
|
|
} else {
|
|
|
window.location.href = "/tasks/" + response.data.game_identifier;
|
|
|
// window.location.href = path
|
|
|
// let path="/tasks/"+response.data.game_identifier;
|
|
|
// this.props.history.push(path);
|
|
|
}
|
|
|
}).catch((error) => {
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
// if(path===null){
|
|
|
// }else{
|
|
|
// if (type > 4 || type === false) {
|
|
|
// window.location.href = path;
|
|
|
// } else {
|
|
|
//
|
|
|
// }
|
|
|
// }
|
|
|
|
|
|
|
|
|
}
|
|
|
hidestartshixunCombattype=()=>{
|
|
|
this.setState({
|
|
|
startshixunCombattype:false
|
|
|
})
|
|
|
}
|
|
|
|
|
|
hideAccountProfile=()=>{
|
|
|
this.setState({
|
|
|
AccountProfiletype:false
|
|
|
})
|
|
|
}
|
|
|
|
|
|
opentitle=()=>{
|
|
|
this.setState({
|
|
|
opentitletype:!this.state.opentitletype,
|
|
|
})
|
|
|
}
|
|
|
|
|
|
render() {
|
|
|
let { ChallengesDataList, startbtns, sumidtype ,startshixunCombattype,shixunsreplace,shixunsmessage,hidestartshixunsreplacevalue,operationstrue,AccountProfiletype} = this.state;
|
|
|
let { loadingContent } = this.props;
|
|
|
if (ChallengesDataList != undefined) {
|
|
|
this.updatamakedown("ReactMarkdown")
|
|
|
}
|
|
|
let id = this.props.match.params.shixunId;
|
|
|
const antIcon = <Icon type="loading" style={{ fontSize: 24 }} spin />;
|
|
|
|
|
|
return (
|
|
|
<React.Fragment>
|
|
|
{AccountProfiletype===true?<AccountProfile
|
|
|
hideAccountProfile={()=>this.hideAccountProfile()}
|
|
|
{...this.props}
|
|
|
{...this.state}
|
|
|
/>:""}
|
|
|
|
|
|
{loadingContent ?
|
|
|
<CircularProgress size={40} thickness={3} style={{
|
|
|
marginLeft: 'auto',
|
|
|
marginRight: 'auto',
|
|
|
marginTop: '200px',
|
|
|
display: 'block'
|
|
|
}} /> :
|
|
|
|
|
|
<div>
|
|
|
{/*<p className="clearfix mb20">*/}
|
|
|
{/* {this.props.identity < 5 && ChallengesDataList&&ChallengesDataList.shixun_status=== 0 ?*/}
|
|
|
{/* <Link to={"/shixuns/" + id + "/challenges/new"}*/}
|
|
|
{/* className="white-btn edu-greenline-btn fr addshixuns"*/}
|
|
|
{/* // data-tip-down="新增代码编辑类型任务"*/}
|
|
|
{/* >*/}
|
|
|
{/* <Tooltip placement="bottom" title={"新增代码编辑类型任务"}>*/}
|
|
|
{/* <img src={getImageUrl("images/educoder/icon/addsmallgreen.svg")}*/}
|
|
|
{/* className="fl mr5 mt6" />*/}
|
|
|
{/* 实践任务*/}
|
|
|
{/* </Tooltip>*/}
|
|
|
|
|
|
{/* </Link> : ""*/}
|
|
|
{/* }*/}
|
|
|
{/* {this.props.identity < 5 && ChallengesDataList&&ChallengesDataList.shixun_status=== 0 ?*/}
|
|
|
{/* <Link to={"/shixuns/" + id + "/challenges/newquestion"}*/}
|
|
|
{/* className="white-btn edu-greenline-btn fr mr20 addshixuns"*/}
|
|
|
{/* // data-tip-down="新增选择题类型任务"*/}
|
|
|
{/* >*/}
|
|
|
{/* <Tooltip placement="bottom" title={"新增选择题类型任务"}>*/}
|
|
|
{/* <img src={getImageUrl("images/educoder/icon/addsmallgreen.svg")}*/}
|
|
|
{/* className="fl mr5 mt5" />*/}
|
|
|
{/* 选择题任务*/}
|
|
|
{/* </Tooltip>*/}
|
|
|
{/* </Link> : ""*/}
|
|
|
{/* }*/}
|
|
|
{/*</p>*/}
|
|
|
|
|
|
<style>
|
|
|
{
|
|
|
`
|
|
|
.task-item{
|
|
|
margin-bottom: 20px;
|
|
|
padding-bottom: 20px;
|
|
|
margin-top: 10px;
|
|
|
}
|
|
|
`
|
|
|
}
|
|
|
</style>
|
|
|
<p className="clearfix mb20 edu-back-white">
|
|
|
<div className={"shixunjianjie"}>
|
|
|
<span className="font-16 fl">简介</span>
|
|
|
|
|
|
{this.props.identity < 5 && ChallengesDataList&&ChallengesDataList.shixun_status < 3 ?
|
|
|
<a href={"/shixuns/" + id + "/settings?edit=1"} className="fr color-blue font-14">
|
|
|
{/*<img src={getImageUrl("images/educoder/icon/edit.svg")} className="fl mt3 ml2" />*/}
|
|
|
编辑
|
|
|
</a>:""}
|
|
|
{this.props.user && this.props.user.main_site === true ?
|
|
|
this.props.identity < 5?<a className="fr font-14 color-blue mr20" href="/forums/2943"
|
|
|
target="_blank">实训制作指南</a> : "":""}
|
|
|
</div>
|
|
|
|
|
|
<div>
|
|
|
<div className={"pd20"} id={"shixunchallengesid"}>
|
|
|
<style>
|
|
|
{
|
|
|
`
|
|
|
.editormd-html-preview, .editormd-preview-container {
|
|
|
width: 100% !important;
|
|
|
}
|
|
|
`
|
|
|
}
|
|
|
</style>
|
|
|
<style>
|
|
|
{
|
|
|
`
|
|
|
.markdown-body img{
|
|
|
min-height: 200px;
|
|
|
}
|
|
|
`
|
|
|
}
|
|
|
</style>
|
|
|
|
|
|
{ChallengesDataList === undefined || ChallengesDataList&&ChallengesDataList.description=== ""||ChallengesDataList&&ChallengesDataList.description===null||ChallengesDataList&&ChallengesDataList.description===undefined?<style>
|
|
|
{
|
|
|
`
|
|
|
#shixunchallengesid{
|
|
|
max-height: 300px;
|
|
|
overflow: hidden;
|
|
|
}
|
|
|
`
|
|
|
}
|
|
|
</style>:""}
|
|
|
|
|
|
|
|
|
{ChallengesDataList === undefined || ChallengesDataList&&ChallengesDataList.description=== ""||ChallengesDataList&&ChallengesDataList.description===null||ChallengesDataList&&ChallengesDataList.description===undefined?"":this.state.isopentitletype==="greater"&&this.state.opentitletype===true?
|
|
|
<style>
|
|
|
{
|
|
|
`
|
|
|
#shixunchallengesid{
|
|
|
max-height:260px;
|
|
|
overflow: hidden;
|
|
|
}
|
|
|
`
|
|
|
}
|
|
|
</style>:""}
|
|
|
|
|
|
|
|
|
<div className="justify break_full_word new_li "
|
|
|
id="challenge_editorMd_description">
|
|
|
{ChallengesDataList === undefined || ChallengesDataList&&ChallengesDataList.description=== ""||ChallengesDataList&&ChallengesDataList.description===null||ChallengesDataList&&ChallengesDataList.description===undefined?
|
|
|
<div className="edu-tab-con-box clearfix edu-txt-center">
|
|
|
{this.props.identity < 5?<img className="newedu-nodata-img mb20"
|
|
|
src={getImageUrl("images/educoder/shixunnodata.png")} />:<img className="edu-nodata-img mb20"
|
|
|
src={getImageUrl("images/educoder/nodata.png")} />}
|
|
|
<p className="edu-nodata-p mb80">暂时还没有相关数据哦！</p>
|
|
|
</div>
|
|
|
:<p id="ReactMarkdown" style={{overflow:'hidden'}}>
|
|
|
{ChallengesDataList === undefined ? "" :ChallengesDataList&&ChallengesDataList.description===null?"":
|
|
|
<div className={"markdown-body"} dangerouslySetInnerHTML={{__html: markdownToHTML(ChallengesDataList.description).replace(/▁/g,"▁▁▁")}}></div>
|
|
|
}
|
|
|
</p>}
|
|
|
</div>
|
|
|
</div>
|
|
|
<style>
|
|
|
{
|
|
|
`
|
|
|
.ant-divider-horizontal.ant-divider-with-text-center.ant-divider-dashed::before{
|
|
|
border: none !important
|
|
|
}
|
|
|
.ant-divider-horizontal.ant-divider-with-text-center.ant-divider-dashed::after{
|
|
|
border: none !important
|
|
|
}
|
|
|
`
|
|
|
}
|
|
|
</style>
|
|
|
{this.state.isopentitletype==="Less"?"":this.state.opentitletype===true?<Divider dashed={true} onClick={()=>this.opentitle()} className={"pointer Breadcrumbfont color-grey-9 "}>
|
|
|
<a className={"font-14 color-grey-9"}>阅读全文 <i className={"iconfont icon-jiantou9 font-14"}></i></a>
|
|
|
</Divider>:<Divider dashed={true} onClick={()=>this.opentitle()} className={"pointer Breadcrumbfont color-grey-9 "}>
|
|
|
<a className={"font-14 color-grey-9"}>收起全文 <i className={"iconfont icon-changyongtubiao-xianxingdaochu-zhuanqu- font-14"}></i></a>
|
|
|
</Divider>}
|
|
|
|
|
|
</div>
|
|
|
</p>
|
|
|
|
|
|
<div className={"shixunjianjiecballenges edu-back-white boreee"}>
|
|
|
<span className="font-16 fl">全部任务</span>
|
|
|
<span className="fr mt5">
|
|
|
{/* <img src={getImageUrl("images/educoder/icon/addsmallgreen.svg")}
|
|
|
className="fl mr5 mt6" />*/}
|
|
|
{/*<Tooltip placement="bottom" title={"新增代码编辑类型任务"}>*/}
|
|
|
{/* </Tooltip>*/}
|
|
|
{this.props.identity < 5 && ChallengesDataList&&ChallengesDataList.shixun_status=== 0 ?
|
|
|
<Link to={"/shixuns/" + id + "/challenges/new"}
|
|
|
className="fr"
|
|
|
// data-tip-down="新增代码编辑类型任务"
|
|
|
>
|
|
|
<Button type="primary"
|
|
|
className="edu-default-btn edu-greenback-btn"
|
|
|
>新增实践任务</Button>
|
|
|
</Link> : ""
|
|
|
}
|
|
|
{this.props.identity < 5 && ChallengesDataList&&ChallengesDataList.shixun_status=== 0 ?
|
|
|
<Link to={"/shixuns/" + id + "/challenges/newquestion"}
|
|
|
className="fr mr20"
|
|
|
// data-tip-down="新增选择题类型任务"
|
|
|
>
|
|
|
<Button type="primary"
|
|
|
className="edu-default-btn edu-greenback-btn"
|
|
|
>新增选择题任务</Button>
|
|
|
</Link> : ""
|
|
|
}
|
|
|
{/*<Tooltip placement="bottom" title={"新增选择题类型任务"}>*/}
|
|
|
{/* </Tooltip>*/}
|
|
|
{/* <img src={getImageUrl("images/educoder/icon/addsmallgreen.svg")}
|
|
|
className="fl mr5 mt5" />*/}
|
|
|
</span>
|
|
|
</div>
|
|
|
|
|
|
<div className="alltask edu-back-white padding1020pxshixun">
|
|
|
|
|
|
{ChallengesDataList === undefined ? <div className="alltask">
|
|
|
<div className="edu-tab-con-box clearfix edu-txt-center">
|
|
|
{this.props.identity < 5?<img className="newedu-nodata-img mb20"
|
|
|
src={getImageUrl("images/educoder/shixunnodata.png")} />:<img className="edu-nodata-img mb20"
|
|
|
src={getImageUrl("images/educoder/nodata.png")} />}
|
|
|
<p className="edu-nodata-p mb80">暂时还没有相关数据哦！</p>
|
|
|
</div>
|
|
|
</div> : ChallengesDataList.challenge_list === undefined ?
|
|
|
<div className="alltask">
|
|
|
<div className="edu-tab-con-box clearfix edu-txt-center">
|
|
|
{this.props.identity < 5?<img className="newedu-nodata-img mb20"
|
|
|
src={getImageUrl("images/educoder/shixunnodata.png")} />:<img className="edu-nodata-img mb20"
|
|
|
src={getImageUrl("images/educoder/nodata.png")} />}
|
|
|
<p className="edu-nodata-p mb80">暂时还没有相关数据哦！</p>
|
|
|
</div>
|
|
|
</div>
|
|
|
: ChallengesDataList.challenge_list.length === 0 ?
|
|
|
<div className="alltask">
|
|
|
<div className="edu-tab-con-box clearfix edu-txt-center">
|
|
|
{this.props.identity < 5?<img className="newedu-nodata-img mb20"
|
|
|
src={getImageUrl("images/educoder/shixunnodata.png")} />:<img className="edu-nodata-img mb20"
|
|
|
src={getImageUrl("images/educoder/nodata.png")} />}
|
|
|
<p className="edu-nodata-p mb80">暂时还没有相关数据哦！</p>
|
|
|
</div>
|
|
|
</div>
|
|
|
: ChallengesDataList.challenge_list.map((item, key) => {
|
|
|
return (
|
|
|
<div className="task-item" key={key} id={"shixun_index_" + item.position}>
|
|
|
<div className="clearfix mb5">
|
|
|
<div className="mr15 font-16 fl shixunstartbutton666666">第{key+1}关：{item.st === 0 ?"实践题":"选择题"}
|
|
|
|
|
|
{/*<a className={"edu-default-btn edu-blueline-btn fr Finish_button mtf3"}*/}
|
|
|
{/* onClick={()=>this.startshixunCombat(false,undefined, item.challenge_id)}*/}
|
|
|
{/* // onClick={() => this.startshixunCombat(false)}*/}
|
|
|
{/* title={"查看挑战关卡"}*/}
|
|
|
{/*>已完成</a>*/}
|
|
|
{/*判断比较复杂 有排第一不能是灰色按钮*/}
|
|
|
{item.status === 2 ?
|
|
|
<Button type="primary" shape="round" size={"small"} className={"ml30 shixunstartbutton33BD8C"}>已完成</Button>
|
|
|
: ""
|
|
|
}
|
|
|
|
|
|
{/* <a className={"edu-default-btn edu-blueback-btn fr Finish_button"}
|
|
|
title={"直接挑战"}
|
|
|
style={{marginTop: '-2px'}}
|
|
|
onClick={()=>this.startshixunCombat(false,undefined, item.challenge_id)}
|
|
|
// onClick={() => this.startshixunCombat(false)}
|
|
|
>直接挑战</a> */}
|
|
|
{
|
|
|
ChallengesDataList.allow_skip === true && item.status === 1?
|
|
|
<Button type="primary" shape="round" size={"small"} className={"ml30 shixunstartbuttonFF6601"}>未完成</Button>
|
|
|
: ""
|
|
|
}
|
|
|
|
|
|
{/* <Tooltip placement="bottom" title={"直接挑战"}>
|
|
|
<a className={"edu-default-btn edu-blueback-btn fr Finish_button"}
|
|
|
onClick={()=>this.startshixunCombat(false,undefined, item.challenge_id)}
|
|
|
style={{marginTop: '-2px'}}>直接挑战</a>
|
|
|
</Tooltip>
|
|
|
*/}
|
|
|
{
|
|
|
ChallengesDataList.allow_skip === false ? item.status === 1?
|
|
|
<Button type="primary" shape="round" size={"small"} className={"ml30 shixunstartbuttonFF6601"}>未完成</Button>
|
|
|
:"":""
|
|
|
|
|
|
}
|
|
|
|
|
|
{/*<Tooltip placement="bottom" title={"请先完成前序关卡"}>*/}
|
|
|
{/* <a className={"edu-default-btn edu-greyback-btn fr Finish_button"}*/}
|
|
|
{/* // onClick={this.props.identity<5&&item.open_game!=""?()=>this.startshixunCombat(false,undefined, item.challenge_id):""}*/}
|
|
|
{/* style={{marginTop: '-2px'}}>直接挑战</a>*/}
|
|
|
{/*</Tooltip>*/}
|
|
|
|
|
|
{
|
|
|
item.status === 0 ?
|
|
|
<Button type="primary" shape="round" size={"small"} className={"ml30 shixunstartbuttonFF6601"}>未完成</Button>
|
|
|
:""
|
|
|
}
|
|
|
</div>
|
|
|
|
|
|
<span className="fr">
|
|
|
{item.delete_url != undefined &&
|
|
|
<Tooltip placement="bottom" title={"删除"}>
|
|
|
<a onClick={() => this.delOperations(item.challenge_id)}
|
|
|
style={{ display:this.props.user.admin===true?"block":this.props.identity < 5 && ChallengesDataList.shixun_status === 0 ? "block" : 'none' }}
|
|
|
className="fl mr25">
|
|
|
{/*<img src={getImageUrl("images/educoder/icon/close.svg")}*/}
|
|
|
{/* className="fl mt5 ml5" />*/}
|
|
|
<i className={"iconfont icon-shanchu_Hover"}></i>
|
|
|
</a>
|
|
|
</Tooltip>
|
|
|
}
|
|
|
|
|
|
|
|
|
{item.up_url != undefined &&
|
|
|
<Tooltip placement="bottom" title={"向上移动"}>
|
|
|
<a onClick={operationstrue===true?"":() => this.operations(item.challenge_id, "up")}
|
|
|
style={{ display:this.props.user.admin===true?"block":this.props.identity < 5 && ChallengesDataList.shixun_status === 0 ? "block" : 'none' }}
|
|
|
className="fl mr25">
|
|
|
{/*<img src={getImageUrl("images/educoder/icon/moveup.svg")}*/}
|
|
|
{/* className="fl mt2 ml4" />*/}
|
|
|
<i className={"iconfont icon-shangyi_Hover"}></i>
|
|
|
</a>
|
|
|
</Tooltip>
|
|
|
}
|
|
|
{item.down_url != undefined &&
|
|
|
<Tooltip placement="bottom" title={"向下移动"}>
|
|
|
<a onClick={operationstrue===true?"":() => this.operations(item.challenge_id, "down")}
|
|
|
style={{ display: this.props.user.admin===true?"block":this.props.identity < 5 && ChallengesDataList.shixun_status=== 0 ? "block" : 'none' }}
|
|
|
className="fl mr25">
|
|
|
{/*<img src={getImageUrl("images/educoder/icon/movedown.svg")} className="fl mt2 ml4" />*/}
|
|
|
<i className={"iconfont icon-xiayi_Hover"}></i>
|
|
|
</a>
|
|
|
</Tooltip>
|
|
|
|
|
|
}
|
|
|
|
|
|
{
|
|
|
item.st === 1 ?
|
|
|
<Tooltip placement="bottom" title={"编辑"}>
|
|
|
<Link
|
|
|
style={{ display:this.props.user.admin===true?"block":this.props.identity < 5 && ChallengesDataList.shixun_status< 3 ? "block" : 'none' }}
|
|
|
to={"/shixuns/" + ChallengesDataList.shixun_identifier + "/challenges/" + item.challenge_id + "/editquestion"}
|
|
|
className="fl">
|
|
|
{/*<img src={getImageUrl("images/educoder/icon/edit.svg")}*/}
|
|
|
{/* className="fl mt3 ml2" />*/}
|
|
|
<i className={"iconfont icon-bianji_Hover"}></i>
|
|
|
</Link>
|
|
|
</Tooltip>
|
|
|
:
|
|
|
<Tooltip placement="bottom" title={"编辑"}>
|
|
|
<Link
|
|
|
style={{ display:this.props.user.admin===true?"block":this.props.identity < 5 && ChallengesDataList.shixun_status < 3 ? "block" : 'none' }}
|
|
|
to={"/shixuns/" + ChallengesDataList.shixun_identifier + "/challenges/" + item.challenge_id + "/editcheckpoint"}
|
|
|
className="fl">
|
|
|
{/*<img src={getImageUrl("images/educoder/icon/edit.svg")}*/}
|
|
|
{/* className="fl mt3 ml2" />*/}
|
|
|
<i className={"iconfont icon-bianji_Hover"}></i>
|
|
|
</Link>
|
|
|
</Tooltip>
|
|
|
}
|
|
|
|
|
|
</span>
|
|
|
</div>
|
|
|
|
|
|
|
|
|
<div className="clearfix mb5">
|
|
|
{/*onClick={() => this.EditTraining(this.props.identity, item.challenge_id, "/editquestion")}*/}
|
|
|
{this.props.identity<5?
|
|
|
item.st === 1 ?
|
|
|
<div className="font-16 color05101a fonthiddens">{item.name}</div>
|
|
|
:
|
|
|
<div className="font-16 color05101a fonthiddens">{item.name}</div>:<div
|
|
|
// onClick={() => this.startshixunCombat(this.props.identity, item.challenge_id, "/editcheckpoint")}
|
|
|
className="font-16 color05101a fonthiddens">{item.name}</div>
|
|
|
}
|
|
|
{/* onClick={() => this.EditTraining(this.props.identity, item.challenge_id, "/editcheckpoint")}*/}
|
|
|
|
|
|
<Modal
|
|
|
keyboard={false}
|
|
|
visible={startbtns}
|
|
|
closable={false}
|
|
|
footer={null}
|
|
|
className="startbtnModal"
|
|
|
>
|
|
|
<Spin size="large" />
|
|
|
</Modal>
|
|
|
|
|
|
</div>
|
|
|
<div className="clearfix">
|
|
|
<style>
|
|
|
{
|
|
|
`
|
|
|
.task-colspan {
|
|
|
min-width: 18% !important;
|
|
|
}
|
|
|
`
|
|
|
}
|
|
|
</style>
|
|
|
<span className="task-colspan"><span className={"shixunbingbaocun12"}>正在挑战： </span><span className={"shixunbingbaocun33312"}>{item.playing_count}人</span></span>
|
|
|
<span className="task-colspan"><span className={"shixunbingbaocun12"}>完成挑战： </span><span className={"shixunbingbaocun33312"}>{item.passed_count}人</span></span>
|
|
|
<span className="task-colspan"><span className={"shixunbingbaocun12"}>可获经验： </span><span className={"shixunbingbaocun33312"}>{item.score}点</span></span>
|
|
|
|
|
|
</div>
|
|
|
</div>
|
|
|
)
|
|
|
})}
|
|
|
</div>
|
|
|
<Modal
|
|
|
keyboard={false}
|
|
|
title="提示"
|
|
|
visible={sumidtype}
|
|
|
closable={false}
|
|
|
footer={null}
|
|
|
>
|
|
|
<div className="task-popup-content">
|
|
|
<p className="task-popup-text-center font-16">
|
|
|
<span className="font-17 mt10">是否删除该关卡？</span>
|
|
|
</p>
|
|
|
<p className="task-popup-text-center font-16 mt30">
|
|
|
<a className="pop_close task-btn mr20"
|
|
|
onClick={() => this.clonedelOperationss()}
|
|
|
>取消</a>
|
|
|
<a onClick={() => this.delOperationss()}
|
|
|
className="task-btn task-btn-orange ">确定</a>
|
|
|
|
|
|
</p>
|
|
|
</div>
|
|
|
|
|
|
</Modal>
|
|
|
|
|
|
<Modal
|
|
|
keyboard={false}
|
|
|
title="提示"
|
|
|
visible={startshixunCombattype}
|
|
|
closable={false}
|
|
|
footer={null}
|
|
|
>
|
|
|
<div className="task-popup-content">
|
|
|
<p className="task-popup-text-center font-16 pb20">目前该实训项目尚在内测中，将于{shixunsmessage}之后开放，谢谢！ </p>
|
|
|
</div>
|
|
|
<div className="task-popup-submit clearfix">
|
|
|
{/*<a onClick={this.hidestartshixunCombattype} className="task-btn fl">取消</a>*/}
|
|
|
<a className="task-btn task-btn-orange fr mr51" onClick={this.hidestartshixunCombattype}>知道了啦</a>
|
|
|
</div>
|
|
|
{/*<p className="inviteTipbtn with100 fl">*/}
|
|
|
{/*<a onClick={this.hidestartshixunCombattype}>知道了</a>*/}
|
|
|
{/*</p>*/}
|
|
|
</Modal>
|
|
|
|
|
|
<Modal
|
|
|
keyboard={false}
|
|
|
title="提示"
|
|
|
visible={shixunsreplace}
|
|
|
closable={false}
|
|
|
footer={null}
|
|
|
>
|
|
|
<Spin indicator={antIcon} spinning={this.state.isSpin}>
|
|
|
<div className="task-popup-content">
|
|
|
<p className="task-popup-text-center font-16 pb20">实训已经更新了，正在为您重置!</p>
|
|
|
</div>
|
|
|
<div className="task-popup-submit clearfix">
|
|
|
<a className="task-btn task-btn-orange fr mr51"
|
|
|
onClick={() => this.hidestartshixunsreplace(hidestartshixunsreplacevalue)}>知道了</a>
|
|
|
</div>
|
|
|
</Spin>
|
|
|
</Modal>
|
|
|
</div>
|
|
|
}
|
|
|
</React.Fragment>
|
|
|
|
|
|
)
|
|
|
}
|
|
|
}
|
|
|
|
|
|
export default Challenges;
|
|
|
// {
|
|
|
// ChallengesDataList.allow_skip === false ? item.status === 1 && newstatus === 2 ?
|
|
|
// <Tooltip placement="bottom" title={"直接挑战"}>
|
|
|
// <a className={"edu-default-btn edu-blueback-btn fr Finish_button"}
|
|
|
// onClick={()=>this.startshixunCombat(false,undefined, item.challenge_id)}
|
|
|
// style={{marginTop: '-2px'}}>直接挑战</a>
|
|
|
// </Tooltip>
|
|
|
//
|
|
|
// : item.status === 1 && newstatus === 1 ?
|
|
|
// <Tooltip placement="bottom" title={"直接挑战"}>
|
|
|
// <a className={"edu-default-btn edu-blueback-btn fr Finish_button"}
|
|
|
// onClick={()=>this.startshixunCombat(false,undefined, item.challenge_id)}
|
|
|
// style={{marginTop: '-2px'}}>直接挑战</a>
|
|
|
// </Tooltip> : "" : ""
|
|
|
//
|
|
|
// }
|
