|
|
|
@ -1,193 +1,192 @@
|
|
|
|
import React, {Component} from 'react';
|
|
|
|
import React, {Component} from 'react';
|
|
|
|
|
|
|
|
|
|
|
|
import {Input, Select, Radio, Checkbox, Popconfirm, message, Modal,Pagination,Tooltip} from 'antd';
|
|
|
|
import {Input, Select, Radio, Checkbox, Popconfirm, message, Modal,Pagination,Tooltip,Spin} from 'antd';
|
|
|
|
|
|
|
|
|
|
|
|
import {BrowserRouter as Router, Route, Link, Switch} from "react-router-dom";
|
|
|
|
import {BrowserRouter as Router, Route, Link, Switch} from "react-router-dom";
|
|
|
|
|
|
|
|
|
|
|
|
// import "antd/dist/antd.css";
|
|
|
|
// import "antd/dist/antd.css";
|
|
|
|
|
|
|
|
|
|
|
|
import Rating from '@icedesign/base/lib/rating';
|
|
|
|
import Rating from '@icedesign/base/lib/rating';
|
|
|
|
|
|
|
|
|
|
|
|
import Loading from '@icedesign/base/lib/loading';
|
|
|
|
import axios from 'axios';
|
|
|
|
|
|
|
|
|
|
|
|
import axios from 'axios';
|
|
|
|
import {getImageUrl, toPath, getUrl} from 'educoder'
|
|
|
|
|
|
|
|
|
|
|
|
import {getImageUrl, toPath, getUrl} from 'educoder'
|
|
|
|
import './shixunCss/fork.css';
|
|
|
|
|
|
|
|
|
|
|
|
import './shixunCss/fork.css';
|
|
|
|
let origin = getUrl();
|
|
|
|
|
|
|
|
|
|
|
|
let origin = getUrl();
|
|
|
|
let path = getUrl("/editormd/lib/")
|
|
|
|
|
|
|
|
|
|
|
|
let path = getUrl("/editormd/lib/")
|
|
|
|
const $ = window.$;
|
|
|
|
|
|
|
|
|
|
|
|
const $ = window.$;
|
|
|
|
let timeout;
|
|
|
|
|
|
|
|
|
|
|
|
let timeout;
|
|
|
|
let currentValue;
|
|
|
|
|
|
|
|
|
|
|
|
let currentValue;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
export default class TPMFork_listComponent extends Component {
|
|
|
|
|
|
|
|
constructor(props) {
|
|
|
|
export default class TPMFork_listComponent extends Component {
|
|
|
|
super(props)
|
|
|
|
constructor(props) {
|
|
|
|
this.state = {
|
|
|
|
super(props)
|
|
|
|
shixuns:undefined,
|
|
|
|
this.state = {
|
|
|
|
total_count:0,
|
|
|
|
shixuns:undefined,
|
|
|
|
shixunsID:undefined,
|
|
|
|
total_count:0,
|
|
|
|
Forkvisible: true,
|
|
|
|
shixunsID:undefined,
|
|
|
|
Forkcurrent: 1
|
|
|
|
Forkvisible: true,
|
|
|
|
}
|
|
|
|
Forkcurrent: 1
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
componentDidMount() {
|
|
|
|
|
|
|
|
let id = this.props.match.params.shixunId;
|
|
|
|
componentDidMount() {
|
|
|
|
|
|
|
|
let id = this.props.match.params.shixunId;
|
|
|
|
let Url="/shixuns/"+id+"/fork_list.json";
|
|
|
|
|
|
|
|
axios.get(Url, {
|
|
|
|
let Url="/shixuns/"+id+"/fork_list.json";
|
|
|
|
params: {
|
|
|
|
axios.get(Url, {
|
|
|
|
page:1,
|
|
|
|
params: {
|
|
|
|
limit:8
|
|
|
|
page:1,
|
|
|
|
}
|
|
|
|
limit:8
|
|
|
|
}).then((response)=> {
|
|
|
|
}
|
|
|
|
this.setState({
|
|
|
|
}).then((response)=> {
|
|
|
|
shixunsID:id,
|
|
|
|
this.setState({
|
|
|
|
shixuns:response.data.shixuns,
|
|
|
|
shixunsID:id,
|
|
|
|
total_count:response.data.total_count,
|
|
|
|
shixuns:response.data.shixuns,
|
|
|
|
Forkvisible:false
|
|
|
|
total_count:response.data.total_count,
|
|
|
|
})
|
|
|
|
Forkvisible:false
|
|
|
|
}).catch((error)=>{
|
|
|
|
})
|
|
|
|
console.log(error)
|
|
|
|
}).catch((error)=>{
|
|
|
|
});
|
|
|
|
console.log(error)
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
TPMForkonChange=(pageNumber)=>{
|
|
|
|
|
|
|
|
let id = this.props.match.params.shixunId;
|
|
|
|
TPMForkonChange=(pageNumber)=>{
|
|
|
|
this.setState({
|
|
|
|
let id = this.props.match.params.shixunId;
|
|
|
|
Forkvisible:true
|
|
|
|
this.setState({
|
|
|
|
})
|
|
|
|
Forkvisible:true
|
|
|
|
let Url="/shixuns/"+id+"/fork_list.json";
|
|
|
|
})
|
|
|
|
axios.get(Url, {
|
|
|
|
let Url="/shixuns/"+id+"/fork_list.json";
|
|
|
|
params: {
|
|
|
|
axios.get(Url, {
|
|
|
|
page:pageNumber,
|
|
|
|
params: {
|
|
|
|
limit:8
|
|
|
|
page:pageNumber,
|
|
|
|
}
|
|
|
|
limit:8
|
|
|
|
}).then((response)=> {
|
|
|
|
}
|
|
|
|
this.setState({
|
|
|
|
}).then((response)=> {
|
|
|
|
shixunsID:id,
|
|
|
|
this.setState({
|
|
|
|
shixuns:response.data.shixuns,
|
|
|
|
shixunsID:id,
|
|
|
|
total_count:response.data.total_count,
|
|
|
|
shixuns:response.data.shixuns,
|
|
|
|
Forkvisible: false,
|
|
|
|
total_count:response.data.total_count,
|
|
|
|
Forkcurrent: pageNumber
|
|
|
|
Forkvisible: false,
|
|
|
|
})
|
|
|
|
Forkcurrent: pageNumber
|
|
|
|
}).catch((error)=>{
|
|
|
|
})
|
|
|
|
console.log(error)
|
|
|
|
}).catch((error)=>{
|
|
|
|
});
|
|
|
|
console.log(error)
|
|
|
|
}
|
|
|
|
});
|
|
|
|
render() {
|
|
|
|
}
|
|
|
|
|
|
|
|
render() {
|
|
|
|
let {shixuns, total_count, shixunsID, Forkvisible, Forkcurrent} = this.state;
|
|
|
|
|
|
|
|
|
|
|
|
let {shixuns, total_count, shixunsID, Forkvisible, Forkcurrent} = this.state;
|
|
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
|
|
|
<React.Fragment>
|
|
|
|
return (
|
|
|
|
<div className="educontent mb20">
|
|
|
|
<React.Fragment>
|
|
|
|
|
|
|
|
<div className="educontent mb20">
|
|
|
|
<div className="edu-back-white padding20 clearfix mt30">
|
|
|
|
|
|
|
|
<span className="fl font-16">Fork实训列表</span>
|
|
|
|
<div className="edu-back-white padding20 clearfix mt30">
|
|
|
|
<a href={"/shixuns/"+shixunsID+"/challenges"} className="font-16 color-grey-9 fr">返回</a>
|
|
|
|
<span className="fl font-16">Fork实训列表</span>
|
|
|
|
</div>
|
|
|
|
<a href={"/shixuns/"+shixunsID+"/challenges"} className="font-16 color-grey-9 fr">返回</a>
|
|
|
|
{/*<Loading visible={Forkvisible} shape="dot-circle" style={{width:'100%'}}color='#4AC7FF'>*/}
|
|
|
|
</div>
|
|
|
|
<Spin spinning={Forkvisible} size="large" style={{marginTop:'15%'}}>
|
|
|
|
<Loading visible={Forkvisible} shape="dot-circle" style={{width:'100%'}}color='#4AC7FF'>
|
|
|
|
<div className="mt30 square-list clearfix mh320">
|
|
|
|
<div className="mt30 square-list clearfix mh320">
|
|
|
|
|
|
|
|
|
|
|
|
{ shixuns===undefined?" ":shixuns.map((item,key)=>{
|
|
|
|
{ shixuns===undefined?" ":shixuns.map((item,key)=>{
|
|
|
|
return(
|
|
|
|
return(
|
|
|
|
<div className="square-Item" key={key} id={item.id}>
|
|
|
|
<div className="square-Item" key={key} id={item.id}>
|
|
|
|
|
|
|
|
|
|
|
|
<div className="tag-green">
|
|
|
|
<div className="tag-green">
|
|
|
|
<span className="tag-name"> {item.tag_name}</span>
|
|
|
|
<span className="tag-name"> {item.tag_name}</span>
|
|
|
|
<img src={require(`./shixunCss/tag2.png`)}/>
|
|
|
|
<img src={require(`./shixunCss/tag2.png`)}/>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div className={item.power === false ? "closeSquare" : "none"}>
|
|
|
|
<div className={item.power === false ? "closeSquare" : "none"}>
|
|
|
|
<img src={getImageUrl("images/educoder/icon/lockclose.svg")}
|
|
|
|
<img src={getImageUrl("images/educoder/icon/lockclose.svg")}
|
|
|
|
className="mt80 mb25"/>
|
|
|
|
className="mt80 mb25"/>
|
|
|
|
<p className="font-14 color-white">非试用内容，需要授权</p>
|
|
|
|
<p className="font-14 color-white">非试用内容，需要授权</p>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<a href={"/shixuns/"+item.identifier+"/challenges"} className="square-img" target="_blank">
|
|
|
|
<a href={"/shixuns/"+item.identifier+"/challenges"} className="square-img" target="_blank">
|
|
|
|
<img src={'/'+item.pic}/>
|
|
|
|
<img src={'/'+item.pic}/>
|
|
|
|
</a>
|
|
|
|
</a>
|
|
|
|
|
|
|
|
|
|
|
|
<div className="square-main">
|
|
|
|
<div className="square-main">
|
|
|
|
<p className="task-hide">
|
|
|
|
<p className="task-hide">
|
|
|
|
<a href={"/shixuns/"+item.identifier+"/challenges"} target="_blank" className="justify color-grey-name">
|
|
|
|
<a href={"/shixuns/"+item.identifier+"/challenges"} target="_blank" className="justify color-grey-name">
|
|
|
|
{item.name}
|
|
|
|
{item.name}
|
|
|
|
</a>
|
|
|
|
</a>
|
|
|
|
</p>
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
|
|
<p className="clearfix mt8 ml-3">
|
|
|
|
<p className="clearfix mt8 ml-3">
|
|
|
|
<span className="rateYoStar fl" style={{padding: '0px',height: '20px',lineHeight: '19px',cursor: 'default'}} title="">
|
|
|
|
<span className="rateYoStar fl" style={{padding: '0px',height: '20px',lineHeight: '19px',cursor: 'default'}} title="">
|
|
|
|
<Rating key={key} value={item.score_info===null?5:item.score_info} disabled allowHalf />
|
|
|
|
<Rating key={key} value={item.score_info===null?5:item.score_info} disabled allowHalf />
|
|
|
|
</span>
|
|
|
|
</span>
|
|
|
|
<span className="fl ml25 font-12 color-grey-9 lineh-12 mt4">{item.score_info===null?"5分":item.score_info+"分"}</span>
|
|
|
|
<span className="fl ml25 font-12 color-grey-9 lineh-12 mt4">{item.score_info===null?"5分":item.score_info+"分"}</span>
|
|
|
|
</p>
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
|
|
<p className="clearfix mt8 font-12 color-grey-B4">
|
|
|
|
<p className="clearfix mt8 font-12 color-grey-B4">
|
|
|
|
|
|
|
|
|
|
|
|
<Tooltip placement="bottom" title={"关卡"}>
|
|
|
|
<Tooltip placement="bottom" title={"关卡"}>
|
|
|
|
<span className="mr10 fl squareIconSpan">
|
|
|
|
<span className="mr10 fl squareIconSpan">
|
|
|
|
<i className="iconfont icon-shixunguanqia fl mr3"></i>{item.challenges_count}
|
|
|
|
<i className="iconfont icon-shixunguanqia fl mr3"></i>{item.challenges_count}
|
|
|
|
</span>
|
|
|
|
</span>
|
|
|
|
</Tooltip>
|
|
|
|
</Tooltip>
|
|
|
|
|
|
|
|
|
|
|
|
{/*<Tooltip placement="bottom" title={"经验值"}>*/}
|
|
|
|
{/*<Tooltip placement="bottom" title={"经验值"}>*/}
|
|
|
|
{/*<span className="mr10 fl squareIconSpan">*/}
|
|
|
|
{/*<span className="mr10 fl squareIconSpan">*/}
|
|
|
|
{/*<i className="iconfont icon-jingyan fl mr3"></i>{item.exp}*/}
|
|
|
|
{/*<i className="iconfont icon-jingyan fl mr3"></i>{item.exp}*/}
|
|
|
|
{/*</span>*/}
|
|
|
|
{/*</span>*/}
|
|
|
|
{/*</Tooltip>*/}
|
|
|
|
{/*</Tooltip>*/}
|
|
|
|
|
|
|
|
|
|
|
|
<Tooltip placement="bottom" title={"学习人数"}>
|
|
|
|
<Tooltip placement="bottom" title={"学习人数"}>
|
|
|
|
<span className="mr10 fl squareIconSpan" style={{display:item.stu_num===0?"none":'block'}}>
|
|
|
|
<span className="mr10 fl squareIconSpan" style={{display:item.stu_num===0?"none":'block'}}>
|
|
|
|
<i className="iconfont icon-chengyuan fl mr3"></i>{item.stu_num}
|
|
|
|
<i className="iconfont icon-chengyuan fl mr3"></i>{item.stu_num}
|
|
|
|
</span>
|
|
|
|
</span>
|
|
|
|
</Tooltip>
|
|
|
|
</Tooltip>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<span className="fr color-grey-B3 squareIconSpan">{item.level}</span>
|
|
|
|
<span className="fr color-grey-B3 squareIconSpan">{item.level}</span>
|
|
|
|
</p>
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
)
|
|
|
|
)
|
|
|
|
})
|
|
|
|
})
|
|
|
|
}
|
|
|
|
}
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
{/*<div>{total_count}</div>*/}
|
|
|
|
{/*<div>{total_count}</div>*/}
|
|
|
|
<div className="educontent mb80 edu-txt-center mt10" style={{display: total_count > 8 ? "block" : "none"}}>
|
|
|
|
<div className="educontent mb80 edu-txt-center mt10" style={{display: total_count > 8 ? "block" : "none"}}>
|
|
|
|
{/*<div className={total_count < 9 ? " ml32" : "ml105"}>*/}
|
|
|
|
{/*<div className={total_count < 9 ? " ml32" : "ml105"}>*/}
|
|
|
|
<Pagination
|
|
|
|
<Pagination
|
|
|
|
showQuickJumper
|
|
|
|
showQuickJumper
|
|
|
|
defaultCurrent={1}
|
|
|
|
defaultCurrent={1}
|
|
|
|
pageSize={8}
|
|
|
|
pageSize={8}
|
|
|
|
total={total_count}
|
|
|
|
total={total_count}
|
|
|
|
current={Forkcurrent}
|
|
|
|
current={Forkcurrent}
|
|
|
|
style={
|
|
|
|
style={
|
|
|
|
{
|
|
|
|
{
|
|
|
|
display: total_count < 9 ? 'none' : 'block'
|
|
|
|
display: total_count < 9 ? 'none' : 'block'
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
onChange={this.TPMForkonChange}/>
|
|
|
|
onChange={this.TPMForkonChange}/>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</Spin>
|
|
|
|
|
|
|
|
{/*</Loading>*/}
|
|
|
|
</Loading>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</React.Fragment>
|
|
|
|
</React.Fragment>
|
|
|
|
)
|
|
|
|
)
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
