|
|
|
|
@ -4,7 +4,10 @@ import { Tooltip,Modal,Icon,Spin,message} from 'antd';
|
|
|
|
|
import '../../paths/ShixunPaths.css';
|
|
|
|
|
import axios from 'axios';
|
|
|
|
|
import { BrowserRouter as Router, Route, Link } from "react-router-dom";
|
|
|
|
|
|
|
|
|
|
import DetailCardsEditAndEdit from '../../paths/PathDetail/DetailCardsEditAndEdit';
|
|
|
|
|
import DetailCardsEditAndAdd from "../../paths/PathDetail/DetailCardsEditAndAdd";
|
|
|
|
|
import Modals from "../../modals/Modals";
|
|
|
|
|
import NoneData from "../coursesPublic/NoneData";
|
|
|
|
|
class YslDetailCards extends Component{
|
|
|
|
|
constructor(props){
|
|
|
|
|
super(props)
|
|
|
|
|
@ -17,7 +20,23 @@ class YslDetailCards extends Component{
|
|
|
|
|
shixunsmessage:"",
|
|
|
|
|
startshixunCombattype:false,
|
|
|
|
|
isSpin:false,
|
|
|
|
|
idsum:undefined,
|
|
|
|
|
pathCardsedittype:false,
|
|
|
|
|
pathid:undefined,
|
|
|
|
|
editbuttomtype:false,
|
|
|
|
|
editbuttomtypeadd:false,
|
|
|
|
|
pathlistedit:undefined,
|
|
|
|
|
delecttype:false,
|
|
|
|
|
Modalstype:false,
|
|
|
|
|
Modalstopval:'',
|
|
|
|
|
Modalsbottomval:'',
|
|
|
|
|
}
|
|
|
|
|
//idsum 是否点击这个
|
|
|
|
|
//pathCardsedittype 是否是在编辑模式
|
|
|
|
|
//editbuttomtypeadd 是否已经是编辑模式
|
|
|
|
|
//pathid课堂id
|
|
|
|
|
//pathlistedit 编辑返回的数据
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
showparagraph =(key,index)=>{
|
|
|
|
|
@ -90,6 +109,10 @@ class YslDetailCards extends Component{
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
componentDidMount(){
|
|
|
|
|
let pathid=this.props.match.params.coursesId;
|
|
|
|
|
this.setState({
|
|
|
|
|
pathid:pathid
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
@ -125,14 +148,192 @@ class YslDetailCards extends Component{
|
|
|
|
|
this.setState({
|
|
|
|
|
startshixunCombattype:false
|
|
|
|
|
})
|
|
|
|
|
};
|
|
|
|
|
// 关卡的上移下移操作
|
|
|
|
|
operations = (url) => {
|
|
|
|
|
let newurl = url+".json"
|
|
|
|
|
axios.get(newurl).then((response) => {
|
|
|
|
|
if(response.data.status===1){
|
|
|
|
|
this.props.getPathCardsList();
|
|
|
|
|
}
|
|
|
|
|
}).catch((error) => {
|
|
|
|
|
console.log(error);
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
//章节下移
|
|
|
|
|
chapterdown=(id)=>{
|
|
|
|
|
let url=`/course_stages/${id}/down_position.json`;
|
|
|
|
|
axios.post(url).then((response) => {
|
|
|
|
|
if(response){
|
|
|
|
|
if(response.data){
|
|
|
|
|
if(response.data.status===0){
|
|
|
|
|
this.props.showNotification(`下移成功`);
|
|
|
|
|
this.props.getPathCardsList();
|
|
|
|
|
}else{
|
|
|
|
|
this.props.showNotification(`下移失败`);
|
|
|
|
|
}
|
|
|
|
|
}else{
|
|
|
|
|
this.props.showNotification(`下移失败`);
|
|
|
|
|
}
|
|
|
|
|
}else {
|
|
|
|
|
this.props.showNotification(`下移失败`);
|
|
|
|
|
}
|
|
|
|
|
}).catch((error) => {
|
|
|
|
|
console.log(error)
|
|
|
|
|
});
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
//章节上移
|
|
|
|
|
chapterup=(id)=>{
|
|
|
|
|
let url=`/course_stages/${id}/up_position.json`;
|
|
|
|
|
axios.post(url).then((response) => {
|
|
|
|
|
if(response){
|
|
|
|
|
if(response.data){
|
|
|
|
|
if(response.data.status===0){
|
|
|
|
|
this.props.showNotification(`上移成功`);
|
|
|
|
|
this.props.getPathCardsList();
|
|
|
|
|
}else{
|
|
|
|
|
this.props.showNotification(`上移失败`);
|
|
|
|
|
}
|
|
|
|
|
}else{
|
|
|
|
|
this.props.showNotification(`上移失败`);
|
|
|
|
|
}
|
|
|
|
|
}else{
|
|
|
|
|
this.props.showNotification(`上移失败`);
|
|
|
|
|
}
|
|
|
|
|
}).catch((error) => {
|
|
|
|
|
console.log(error)
|
|
|
|
|
});
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//取消的
|
|
|
|
|
updatapathCardsedit=()=>{
|
|
|
|
|
this.setState({
|
|
|
|
|
idsum:undefined,
|
|
|
|
|
pathCardsedittype:false,
|
|
|
|
|
editbuttomtype:false,
|
|
|
|
|
editbuttomtypeadd:false
|
|
|
|
|
})
|
|
|
|
|
this.props.getPathCardsList();
|
|
|
|
|
// this.props.updatadetailInfoLists();
|
|
|
|
|
};
|
|
|
|
|
//确认的
|
|
|
|
|
editeditbuttomtypecanle=()=>{
|
|
|
|
|
this.setState({
|
|
|
|
|
editbuttomtype:true,
|
|
|
|
|
editbuttomtypeadd:false
|
|
|
|
|
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
//编辑用
|
|
|
|
|
pathCardsedit=(key,pathid)=>{
|
|
|
|
|
|
|
|
|
|
let url=`/course_stages/${pathid}/edit.json`;
|
|
|
|
|
axios.get(url).then((result)=>{
|
|
|
|
|
if(result){
|
|
|
|
|
if(result.status===200){
|
|
|
|
|
this.setState({
|
|
|
|
|
idsum:key,
|
|
|
|
|
pathCardsedittype:true,
|
|
|
|
|
pathlistedit:result.data,
|
|
|
|
|
editbuttomtype:true,
|
|
|
|
|
editbuttomtypeadd:true
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}).catch((error)=>{
|
|
|
|
|
console.log(error);
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
};
|
|
|
|
|
//删除用的
|
|
|
|
|
delectpathCardsedit=(id)=>{
|
|
|
|
|
|
|
|
|
|
this.setState({
|
|
|
|
|
Modalstype:true,
|
|
|
|
|
Modalstopval:'是否删除该章节？',
|
|
|
|
|
Modalsbottomval:'',
|
|
|
|
|
editdelectid:id,
|
|
|
|
|
delecttype:true,
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
cardsModalcancel=()=>{
|
|
|
|
|
this.setState({
|
|
|
|
|
Modalstype:false,
|
|
|
|
|
Modalstopval:'',
|
|
|
|
|
Modalsbottomval:'',
|
|
|
|
|
editdelectid:undefined
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
cardsModalsave=()=>{
|
|
|
|
|
debugger
|
|
|
|
|
this.setState({
|
|
|
|
|
Modalstype:false,
|
|
|
|
|
Modalstopval:'',
|
|
|
|
|
Modalsbottomval:'',
|
|
|
|
|
editdelectid:undefined
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
delectpathCardseditfun=()=>{
|
|
|
|
|
let {delecttype,editdelectid}=this.state;
|
|
|
|
|
let id=editdelectid;
|
|
|
|
|
if(delecttype===true){
|
|
|
|
|
let url =`/course_stages/${id}.json`
|
|
|
|
|
axios.delete(url).then((response) => {
|
|
|
|
|
if(response){
|
|
|
|
|
if(response.data){
|
|
|
|
|
if(response.data.status===0){
|
|
|
|
|
this.setState({
|
|
|
|
|
idsum:undefined,
|
|
|
|
|
pathCardsedittype:false,
|
|
|
|
|
Modalstype:false,
|
|
|
|
|
Modalstopval:'',
|
|
|
|
|
Modalsbottomval:'',
|
|
|
|
|
delecttype:false,
|
|
|
|
|
editdelectid:undefined
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
this.updatapathCardsedit()
|
|
|
|
|
this.props.showNotification(`删除成功`);
|
|
|
|
|
}else {
|
|
|
|
|
this.props.showNotification(`删除失败`);
|
|
|
|
|
}
|
|
|
|
|
}else{
|
|
|
|
|
this.props.showNotification(`删除失败`);
|
|
|
|
|
}
|
|
|
|
|
}else {
|
|
|
|
|
this.props.showNotification(`删除失败`);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
}).catch((error) => {
|
|
|
|
|
console.log(error)
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
render(){
|
|
|
|
|
let{showparagraph,showparagraphkey,showparagraphindex,hidestartshixunsreplacevalue} =this.state;
|
|
|
|
|
let { stages }=this.props;
|
|
|
|
|
let{showparagraph,showparagraphkey,showparagraphindex,hidestartshixunsreplacevalue,idsum,pathCardsedittype,pathid,Modalstype,Modalstopval,Modalsbottomval,delecttype,pathlistedit,editbuttomtypeadd,editbuttomtype} =this.state;
|
|
|
|
|
let { stages ,subject_id}=this.props;
|
|
|
|
|
const antIcon = <Icon type="loading" style={{ fontSize: 24 }} spin />;
|
|
|
|
|
// console.log("pathCardsedittype");
|
|
|
|
|
// console.log(pathCardsedittype);
|
|
|
|
|
// console.log(editbuttomtype);
|
|
|
|
|
// console.log("this.props.isAdmin");
|
|
|
|
|
// console.log(this.props.isAdmin());
|
|
|
|
|
// console.log(this.state.delecttype);
|
|
|
|
|
return(
|
|
|
|
|
<div className="lesson-saved-list">
|
|
|
|
|
<div>
|
|
|
|
|
{
|
|
|
|
|
stages===undefined||stages===JSON.stringify("[]")||stages.length===0?
|
|
|
|
|
""
|
|
|
|
|
:
|
|
|
|
|
<div className="lesson-saved-list">
|
|
|
|
|
<Modal
|
|
|
|
|
keyboard={false}
|
|
|
|
|
title="提示"
|
|
|
|
|
@ -171,6 +372,15 @@ class YslDetailCards extends Component{
|
|
|
|
|
</div>
|
|
|
|
|
</Spin>
|
|
|
|
|
</Modal>
|
|
|
|
|
|
|
|
|
|
<Modals
|
|
|
|
|
modalsType={Modalstype}
|
|
|
|
|
modalsTopval={Modalstopval}
|
|
|
|
|
modalsBottomval={Modalsbottomval}
|
|
|
|
|
modalCancel={this.cardsModalcancel}
|
|
|
|
|
modalSave={delecttype===true?this.delectpathCardseditfun:this.cardsModalsave}
|
|
|
|
|
>
|
|
|
|
|
</Modals>
|
|
|
|
|
<style>{
|
|
|
|
|
`
|
|
|
|
|
.lesson-saved-list-item {
|
|
|
|
|
@ -180,30 +390,84 @@ class YslDetailCards extends Component{
|
|
|
|
|
}
|
|
|
|
|
`
|
|
|
|
|
}</style>
|
|
|
|
|
{
|
|
|
|
|
stages && stages.map((item,key)=>{
|
|
|
|
|
|
|
|
|
|
return(
|
|
|
|
|
<div className={"lesson-saved-list-item"} key={key} id={"stage_div_"+key} >
|
|
|
|
|
<p className="clearfix title-line">
|
|
|
|
|
|
|
|
|
|
<a className="fl ring-blue mr10 mt2">
|
|
|
|
|
<img src={getImageUrl("images/educoder/icon/charpter-white.svg")} className="fl ml3 mt3"/>
|
|
|
|
|
</a>
|
|
|
|
|
<span className="font-18 font-bd lessonvalue" title={item.stage_name}>{item.stage_name}</span>
|
|
|
|
|
{
|
|
|
|
|
this.props.isStudent()===true&&(stages===undefined||stages===JSON.stringify("[]")||stages.length===0)?
|
|
|
|
|
<NoneData></NoneData>
|
|
|
|
|
:
|
|
|
|
|
""
|
|
|
|
|
}
|
|
|
|
|
{
|
|
|
|
|
stages && stages.map((item,key)=>{
|
|
|
|
|
|
|
|
|
|
return(
|
|
|
|
|
<div className={"lesson-saved-list-item"} key={key} id={"stage_div_"+key} >
|
|
|
|
|
<p className="clearfix title-line">
|
|
|
|
|
|
|
|
|
|
</p>
|
|
|
|
|
<div className="detail_for_paragraph clearfix" id={"detail_for_paragraph_"+key}>
|
|
|
|
|
<p className="color-dark-grey mt20 mb25 ml20 mr20 pl28 justify font-15">{item.stage_description}</p>
|
|
|
|
|
<a className="fl ring-blue mr10 mt2">
|
|
|
|
|
<img src={getImageUrl("images/educoder/icon/charpter-white.svg")} className="fl ml3 mt3"/>
|
|
|
|
|
</a>
|
|
|
|
|
<span className="font-18 font-bd lessonvalue" title={item.stage_name}>{item.stage_name}</span>
|
|
|
|
|
{
|
|
|
|
|
idsum===key&&pathCardsedittype===true?'':
|
|
|
|
|
|
|
|
|
|
this.props.isAdmin()==true?
|
|
|
|
|
<a>
|
|
|
|
|
<a className="fr mtf3">
|
|
|
|
|
{ editbuttomtype===true?'':
|
|
|
|
|
<Tooltip placement="bottom" title="编辑"
|
|
|
|
|
onClick={() => this.pathCardsedit(key, item.stage_id)}>
|
|
|
|
|
<i className="iconfont icon-bianjidaibeijing font-22 color-green"></i>
|
|
|
|
|
</Tooltip>
|
|
|
|
|
}
|
|
|
|
|
</a>
|
|
|
|
|
{
|
|
|
|
|
stages.length=== key+1?"":<a className="fr ring-op-green mr20" onClick={()=>this.chapterdown(item.stage_id)}>
|
|
|
|
|
<Tooltip placement="bottom" title="向下移动">
|
|
|
|
|
<img src={getImageUrl("images/educoder/icon/movedown.svg")} className="fl mt2 ml4"/>
|
|
|
|
|
</Tooltip>
|
|
|
|
|
</a>
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
{key===0?"":
|
|
|
|
|
<a className="fr ring-op-green mr20" onClick={()=>this.chapterup(item.stage_id)}>
|
|
|
|
|
<Tooltip placement="bottom" title="向上移动">
|
|
|
|
|
<img src={getImageUrl("images/educoder/icon/moveup.svg")} className="fl mt2 ml4"/>
|
|
|
|
|
</Tooltip>
|
|
|
|
|
</a>}
|
|
|
|
|
|
|
|
|
|
<div>
|
|
|
|
|
</a>:""
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
{
|
|
|
|
|
item.shixuns_list && item.shixuns_list.map((line,index)=>{
|
|
|
|
|
return(
|
|
|
|
|
<div className="clearfix paragraph lineh-30" key={index} onMouseEnter={()=>this.showparagraph(key,index)} onMouseLeave={this.hideparagraph}>
|
|
|
|
|
idsum === key && pathCardsedittype === true ?
|
|
|
|
|
this.props.isAdmin()===true?
|
|
|
|
|
<a className="fr" onClick={()=>this.delectpathCardsedit(item.stage_id)}>
|
|
|
|
|
<Tooltip placement="bottom" title="删除">
|
|
|
|
|
<i className="iconfont icon-shanchu color-grey-c font-14 font-n"></i>
|
|
|
|
|
</Tooltip>
|
|
|
|
|
</a>:""
|
|
|
|
|
: ''
|
|
|
|
|
}
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
{
|
|
|
|
|
idsum===key&&pathCardsedittype===true?'':
|
|
|
|
|
<div className="detail_for_paragraph clearfix" id={"detail_for_paragraph_"+key}>
|
|
|
|
|
<p className="color-dark-grey mt20 mb25 ml20 mr20 pl28 justify font-15">{item.stage_description}</p>
|
|
|
|
|
|
|
|
|
|
<li className="fl li-width63">
|
|
|
|
|
<div>
|
|
|
|
|
|
|
|
|
|
{
|
|
|
|
|
item.shixuns_list && item.shixuns_list.map((line,index)=>{
|
|
|
|
|
return(
|
|
|
|
|
<div className="clearfix paragraph lineh-30" key={index} onMouseEnter={()=>this.showparagraph(key,index)} onMouseLeave={this.hideparagraph}>
|
|
|
|
|
|
|
|
|
|
<li className="fl li-width63">
|
|
|
|
|
|
|
|
|
|
<span className="progressRing mr10">
|
|
|
|
|
{
|
|
|
|
|
@ -211,36 +475,70 @@ class YslDetailCards extends Component{
|
|
|
|
|
:<i className="iconfont icon-bofang progressRing-part font-18 mt10"></i>
|
|
|
|
|
}
|
|
|
|
|
</span>
|
|
|
|
|
<span className={this.props.current_user&&this.props.current_user.admin===false&&line.shixun_status==="暂未公开"?"paragraph_name color204":"paragraph_name color-grey3"}>
|
|
|
|
|
<span className={this.props.current_user&&this.props.current_user.admin===false&&line.shixun_status==="暂未公开"?"paragraph_name color204":"paragraph_name color-grey3"}>
|
|
|
|
|
<span className="subject_stage_shixun_index">{key+1}</span>-{index+1} {line.shixun_name}
|
|
|
|
|
</span>
|
|
|
|
|
|
|
|
|
|
</li>
|
|
|
|
|
{
|
|
|
|
|
this.props.current_user&&this.props.current_user.admin===false&&line.shixun_status==="暂未公开"?
|
|
|
|
|
<li className="fr status_li"><span className="fr color204">暂未公开</span></li>
|
|
|
|
|
:
|
|
|
|
|
<li className={showparagraph===false?"none":"fr status_li"}>
|
|
|
|
|
</li>
|
|
|
|
|
{
|
|
|
|
|
showparagraphkey===key&&showparagraphindex===index?<div>
|
|
|
|
|
<Link to={'/shixuns/'+line.identifier+'/challenges'} className="mr30 color-blue_4C shixun_detail pointer fl" target="_blank">查看详情</Link>
|
|
|
|
|
{line.shixun_status==="暂未公开"?"":<a onClick={()=>this.startgameid(line.identifier)} className="btn_auto user_bluebg_btn fl" id="shixun_operation" >开始学习</a>}
|
|
|
|
|
</div>:""
|
|
|
|
|
this.props.current_user&&this.props.current_user.admin===false&&line.shixun_status==="暂未公开"?
|
|
|
|
|
<li className="fr status_li"><span className="fr color204">暂未公开</span></li>
|
|
|
|
|
:
|
|
|
|
|
<li className={showparagraph===false?"none":"fr status_li"}>
|
|
|
|
|
{
|
|
|
|
|
showparagraphkey===key&&showparagraphindex===index?<div>
|
|
|
|
|
<Link to={'/shixuns/'+line.identifier+'/challenges'} className="mr30 color-blue_4C shixun_detail pointer fl" target="_blank">查看详情</Link>
|
|
|
|
|
{line.shixun_status==="暂未公开"?"":<a onClick={()=>this.startgameid(line.identifier)} className="btn_auto user_bluebg_btn fl" id="shixun_operation" >开始学习</a>}
|
|
|
|
|
</div>:""
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
</li>
|
|
|
|
|
}
|
|
|
|
|
</div>)
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
}
|
|
|
|
|
{
|
|
|
|
|
this.props.isAdmin()===true?
|
|
|
|
|
<DetailCardsEditAndEdit
|
|
|
|
|
idsum={idsum}
|
|
|
|
|
keys={key}
|
|
|
|
|
pathCardsedittype={pathCardsedittype}
|
|
|
|
|
updatapathCardsedits={this.updatapathCardsedit}
|
|
|
|
|
pathlisteditlist={pathlistedit}
|
|
|
|
|
stageid={item.stage_id}
|
|
|
|
|
ysldetailcards={"ysldetailcards"}
|
|
|
|
|
pathid={subject_id}
|
|
|
|
|
coursesId={pathid}
|
|
|
|
|
></DetailCardsEditAndEdit>
|
|
|
|
|
:""
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
</li>
|
|
|
|
|
}
|
|
|
|
|
</div>)
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
)
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
)
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
</div>
|
|
|
|
|
}
|
|
|
|
|
{ editbuttomtypeadd===true?'':this.props.isAdmin()===true?
|
|
|
|
|
<DetailCardsEditAndAdd
|
|
|
|
|
{...this.props}
|
|
|
|
|
sum={stages && stages.length+1}
|
|
|
|
|
pathid={subject_id}
|
|
|
|
|
coursesId={pathid}
|
|
|
|
|
detailInfoList={this.props.detailInfoList}
|
|
|
|
|
getPathCardsLists={this.updatapathCardsedit}
|
|
|
|
|
editeditbuttomtypes={this.editeditbuttomtypecanle}
|
|
|
|
|
ysldetailcards={"ysldetailcards"}
|
|
|
|
|
></DetailCardsEditAndAdd>
|
|
|
|
|
:""
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
export default YslDetailCards;
|
|
|
|
|
export default YslDetailCards;
|
|
|
|
|
// detailInfoList以前实训课堂做权限判断的作用 this.props.subject_id
|
