From 7379af6d4dee21b011811c351698803ba0ecb120 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=9D=A8=E6=A0=91=E6=98=8E?= <775174143@qq.com> Date: Thu, 4 Jul 2019 10:48:03 +0800 Subject: [PATCH] =?UTF-8?q?=E8=B0=83=E6=95=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../react/src/modules/courses/css/Courses.css | 4 +- .../modules/paths/PathDetail/DetailCards.js | 1077 +++++++++-------- .../tpm/shixunchild/Challenges/Challenges.js | 36 +- 3 files changed, 610 insertions(+), 507 deletions(-) diff --git a/public/react/src/modules/courses/css/Courses.css b/public/react/src/modules/courses/css/Courses.css index 11ba24c5d..c61af1160 100644 --- a/public/react/src/modules/courses/css/Courses.css +++ b/public/react/src/modules/courses/css/Courses.css @@ -616,12 +616,12 @@ a.white-btn.use_scope-btn:hover{ border-radius: 10px; } .Navmodal .ant-modal-content .ant-modal-header{ - border-radius: 10px 10px 0 0; + /*border-radius: 10px 10px 0 0;*/ } .ant-modal-content{ -webkit-box-shadow: 0 4px 12px transparent !important; box-shadow: 0 4px 12px transparent !important; - border-radius: 10px !important; + /*border-radius: 10px !important;*/ } .Navmodal .ant-modal-body{ diff --git a/public/react/src/modules/paths/PathDetail/DetailCards.js b/public/react/src/modules/paths/PathDetail/DetailCards.js index 9c817543c..0cac533d1 100644 --- a/public/react/src/modules/paths/PathDetail/DetailCards.js +++ b/public/react/src/modules/paths/PathDetail/DetailCards.js @@ -1,500 +1,579 @@ -import React, { Component } from 'react'; -import {getImageUrl} from 'educoder'; -import {Tooltip} from 'antd'; -import '../../paths/ShixunPaths.css'; -import DetailCardsEditAndAdd from './DetailCardsEditAndAdd'; -import DetailCardsEditAndEdit from './DetailCardsEditAndEdit'; -import { BrowserRouter as Router, Route, Link } from "react-router-dom"; -import axios from 'axios'; -import { DragDropContext , Draggable, Droppable} from 'react-beautiful-dnd'; -import Modals from '../../modals/Modals'; - -const $ = window.$ -// -// //a little function to help us with reordering the result -// const reorder = (list, startIndex, endIndex) => { -// let newlist=list; -// const result = Array.from(newlist.shixuns_list); -// const [removed] = result.splice(startIndex, 1); -// result.splice(endIndex, 0, removed); -// newlist.shixuns_list=result; -// return newlist; -// }; -// - - - -class DetailCards extends Component{ - constructor(props){ - super(props) - this.state={ - pathCardsList:undefined, - dropid:undefined, - dropidtype:false, - idsum:undefined, - pathCardsedittype:false, - pathlistedit:undefined, - pathid:undefined, - Modalstype:false, - Modalstopval:'', - Modalsbottomval:'', - cardsModalsave:this.cardsModalsave, - cardsModalcancel:this.cardsModalcancel, - delecttype:false, - editdelectid:undefined, - editbuttomtype:false, - editbuttomtypeadd:false, - showparagraph:false, - showparagraphkey:"", - showparagraphindex:"" - } - - - // this.onDragEnd = this.onDragEnd.bind(this); - } - - getPathCardsList(){ - let pathid=this.props.match.params.pathId; - let url=`/stages.json?subject_id=`+pathid; - axios.get(url).then((result)=>{ - if(result.status===200){ - this.setState({ - pathCardsList:result.data.stages, - }) - } - }).catch((error)=>{ - console.log(error); - }) - } - - - for_paragraph = (index) =>{ - $("#detail_for_paragraph_"+index).slideToggle(500); - } - - componentDidMount(){ - let pathid=this.props.match.params.pathId; - this.setState({ - pathid:pathid - }) - this.getPathCardsList(); - - } - - // onDragStart = () => { - // /*...*/ - // }; - // onDragUpdate = () => { - // /*...*/ - // } - // - // onDragEnd (result) { - // - // let{pathCardsList}=this.state; - // // dropped outside the list - // let newpathCardsList=pathCardsList; - // if(!result.destination) { - // return; - // } - // var sum=result.source.droppableId.replace('ids','') - // sum=parseInt(sum) - // - // const items = reorder( - // newpathCardsList[sum], - // result.source.index, - // result.destination.index - // ); - // newpathCardsList[sum]=items - // this.setState({ - // pathCardsList:newpathCardsList - // }) - // } - - pathCardsedit=(key,pathid)=>{ - - let url=`/stages/`+pathid+`/edit.json`; - axios.get(url).then((result)=>{ - if(result.status===200){ - this.setState({ - idsum:key, - pathCardsedittype:true, - pathlistedit:result.data, - editbuttomtype:true, - editbuttomtypeadd:true - }) - } - }).catch((error)=>{ - console.log(error); - }) - - } - - updatapathCardsedit=()=>{ - this.setState({ - idsum:undefined, - pathCardsedittype:false, - editbuttomtype:false, - editbuttomtypeadd:false - }) - this.getPathCardsList(); - this.props.updatadetailInfoLists(); - } - - delectpathCardsedit=(id)=>{ - - this.setState({ - Modalstype:true, - Modalstopval:'是否删除该章节？', - Modalsbottomval:'', - editdelectid:id, - delecttype:true, - }) - - } - - delectpathCardseditfun=()=>{ - let {delecttype,editdelectid}=this.state; - let id=editdelectid; - if(delecttype===true){ - let url ='/stages/'+id+'.json' - axios.delete(url).then((response) => { - if(response.data.status===1){ - // window.location.href = "/paths/" + response.data.subject_id - this.setState({ - idsum:undefined, - pathCardsedittype:false, - Modalstype:false, - Modalstopval:'', - Modalsbottomval:'', - cardsModalsave:this.cardsModalsave, - delecttype:false, - editdelectid:undefined - }) - this.getPathCardsList(); - } - }).catch((error) => { - console.log(error) - }) - } - - } - - // 关卡的上移下移操作 - operations = (url) => { - let newurl = url+".json" - axios.get(newurl).then((response) => { - if(response.data.status===1){ - this.getPathCardsList(); - } - }).catch((error) => { - console.log(error); - }) - - } - startgameid=(id)=>{ - let url = "/shixuns/" + id + "/shixun_exec.json"; - axios.get(url).then((response) => { - if (response.data.status === -2) { - this.setState({ - Modalstype:true, - Modalstopval:response.data.message, - }) - } else if (response.data.status === -1) { - }else if(response.data.status===-3){ - this.setState({ - Modalstype:true, - Modalstopval:response.data.message, - }) - } else { - window.location.href = "/tasks/" + response.data.game_identifier; - // let path="/tasks/"+response.data.game_identifier; - // this.props.history.push(path); - } - }).catch((error) => { - - }); - } - - cardsModalcancel=()=>{ - this.setState({ - Modalstype:false, - Modalstopval:'', - Modalsbottomval:'', - editdelectid:undefined - }) - } - cardsModalsave=()=>{ - this.setState({ - Modalstype:false, - Modalstopval:'', - Modalsbottomval:'', - editdelectid:undefined - }) - } - - editeditbuttomtypecanle=()=>{ - this.setState({ - editbuttomtype:true, - editbuttomtypeadd:false - }) - } - - showparagraph=(key,index)=>{ - this.setState({ - showparagraph:true, - showparagraphkey:key, - showparagraphindex:index - }) - } - - hideparagraph=()=>{ - this.setState({ - showparagraph:false - }) - } - render(){ - let { pathCardsList, - dropid, - dropidtype, - idsum, - pathCardsedittype, - pathlistedit, - pathid, - Modalstype, - Modalstopval, - Modalsbottomval, - cardsModalsave, - cardsModalcancel, - delecttype, - editdelectid, - editbuttomtype, - editbuttomtypeadd, - showparagraph, - showparagraphkey, - showparagraphindex - }=this.state; - - return( -
- - -
- { - pathCardsList && pathCardsList.map((item,key)=>{ - - return( -
-

- - - - - {item.stage_name} - { - idsum===key&&pathCardsedittype===true?'': - - this.props.detailInfoList===undefined?"":this.props.detailInfoList.allow_statistics===true? - - - { editbuttomtype===true?'': - this.pathCardsedit(key, item.stage_id)}> - - - } - - { - pathCardsList.length=== key+1?"":this.operations(item.down_path)}> - - - - - } - - - {key===0?"": - this.operations(item.up_path)}> - - - - } - - :"" - - - } - - { - idsum === key && pathCardsedittype === true ? - this.props.detailInfoList===undefined?"":this.props.detailInfoList.allow_statistics===true? - this.delectpathCardsedit(item.stage_id)}> - - - - :"" - : '' - } -

- - - { - idsum===key&&pathCardsedittype===true?'': -
-

{item.stage_description}

- -
- - { - item.shixuns_list && item.shixuns_list.map((line,index)=>{ - return( -
this.showparagraph(key,index)} onMouseLeave={this.hideparagraph}> - -
  • - - - { - line.complete_status === 1 ? - : - } - - - {key+1}-{index+1}  {line.shixun_name} - - -
    • - { - line.shixun_status==="暂未公开"? -
  • 暂未公开
    • - : -
  • - { - showparagraphkey===key&&showparagraphindex===index?:"" - } - -
    • - } -
    ) - }) - } -
    -
    - } - - - - - -
    - ) - }) - } -
    - - - { editbuttomtypeadd===true?'': - - } - -
    - ) - } -} -export default DetailCards; - - - - - - -// { -// idsum===key&&pathCardsedittype===true?'': -//
    -//

    {item.stage_description}

    -// -// -// -// -// {(provided, snapshot) => ( -// -//
    -// -// { -// item.shixuns_list && item.shixuns_list.map((line,index)=>{ -// return( -// -// {(provided, snapshot) => ( -//
    -// -//
  • -// -// -// { -// line.complete_status === 1 ? -// : -// } -// -// -// -// -// {key+1}-{index+1}  {line.shixun_name} -// -// -//
    • -// { -// line.shixun_status==="暂未公开"? -//
  • 暂未公开
    • -// : -//
  • -// 查看详情 -// 开始实战 -//
    • -// } -// {provided.placeholder} -//
    -// )} -//     -// ) -// }) -// } -//
    -// )} -//     -//     -//
    +import React, { Component } from 'react'; +import {getImageUrl} from 'educoder'; +import {Tooltip,Modal,Icon,Spin,message} from 'antd'; +import '../../paths/ShixunPaths.css'; +import DetailCardsEditAndAdd from './DetailCardsEditAndAdd'; +import DetailCardsEditAndEdit from './DetailCardsEditAndEdit'; +import { BrowserRouter as Router, Route, Link } from "react-router-dom"; +import axios from 'axios'; +import { DragDropContext , Draggable, Droppable} from 'react-beautiful-dnd'; +import Modals from '../../modals/Modals'; + +const $ = window.$ +// +// //a little function to help us with reordering the result +// const reorder = (list, startIndex, endIndex) => { +// let newlist=list; +// const result = Array.from(newlist.shixuns_list); +// const [removed] = result.splice(startIndex, 1); +// result.splice(endIndex, 0, removed); +// newlist.shixuns_list=result; +// return newlist; +// }; +// + + + +class DetailCards extends Component{ + constructor(props){ + super(props) + this.state={ + pathCardsList:undefined, + dropid:undefined, + dropidtype:false, + idsum:undefined, + pathCardsedittype:false, + pathlistedit:undefined, + pathid:undefined, + Modalstype:false, + Modalstopval:'', + Modalsbottomval:'', + cardsModalsave:this.cardsModalsave, + cardsModalcancel:this.cardsModalcancel, + delecttype:false, + editdelectid:undefined, + editbuttomtype:false, + editbuttomtypeadd:false, + showparagraph:false, + showparagraphkey:"", + showparagraphindex:"", + isSpin:false + } + + + // this.onDragEnd = this.onDragEnd.bind(this); + } + + getPathCardsList(){ + let pathid=this.props.match.params.pathId; + let url=`/stages.json?subject_id=`+pathid; + axios.get(url).then((result)=>{ + if(result.status===200){ + this.setState({ + pathCardsList:result.data.stages, + }) + } + }).catch((error)=>{ + console.log(error); + }) + } + + + for_paragraph = (index) =>{ + $("#detail_for_paragraph_"+index).slideToggle(500); + } + + componentDidMount(){ + let pathid=this.props.match.params.pathId; + this.setState({ + pathid:pathid + }) + this.getPathCardsList(); + + } + + // onDragStart = () => { + // /*...*/ + // }; + // onDragUpdate = () => { + // /*...*/ + // } + // + // onDragEnd (result) { + // + // let{pathCardsList}=this.state; + // // dropped outside the list + // let newpathCardsList=pathCardsList; + // if(!result.destination) { + // return; + // } + // var sum=result.source.droppableId.replace('ids','') + // sum=parseInt(sum) + // + // const items = reorder( + // newpathCardsList[sum], + // result.source.index, + // result.destination.index + // ); + // newpathCardsList[sum]=items + // this.setState({ + // pathCardsList:newpathCardsList + // }) + // } + + pathCardsedit=(key,pathid)=>{ + + let url=`/stages/`+pathid+`/edit.json`; + axios.get(url).then((result)=>{ + if(result.status===200){ + this.setState({ + idsum:key, + pathCardsedittype:true, + pathlistedit:result.data, + editbuttomtype:true, + editbuttomtypeadd:true + }) + } + }).catch((error)=>{ + console.log(error); + }) + + } + + updatapathCardsedit=()=>{ + this.setState({ + idsum:undefined, + pathCardsedittype:false, + editbuttomtype:false, + editbuttomtypeadd:false + }) + this.getPathCardsList(); + this.props.updatadetailInfoLists(); + } + + delectpathCardsedit=(id)=>{ + + this.setState({ + Modalstype:true, + Modalstopval:'是否删除该章节？', + Modalsbottomval:'', + editdelectid:id, + delecttype:true, + }) + + } + + delectpathCardseditfun=()=>{ + let {delecttype,editdelectid}=this.state; + let id=editdelectid; + if(delecttype===true){ + let url ='/stages/'+id+'.json' + axios.delete(url).then((response) => { + if(response.data.status===1){ + // window.location.href = "/paths/" + response.data.subject_id + this.setState({ + idsum:undefined, + pathCardsedittype:false, + Modalstype:false, + Modalstopval:'', + Modalsbottomval:'', + cardsModalsave:this.cardsModalsave, + delecttype:false, + editdelectid:undefined + }) + this.getPathCardsList(); + } + }).catch((error) => { + console.log(error) + }) + } + + } + + // 关卡的上移下移操作 + operations = (url) => { + let newurl = url+".json" + axios.get(newurl).then((response) => { + if(response.data.status===1){ + this.getPathCardsList(); + } + }).catch((error) => { + console.log(error); + }) + + } + 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) => { + debugger + 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, + startbtn:false, + }) + + // message.success('重置成功，正在进入实训！'); + // this.startshixunCombat(); + }} + ).catch((error) => { + + }); + + } + + cardsModalcancel=()=>{ + this.setState({ + Modalstype:false, + Modalstopval:'', + Modalsbottomval:'', + editdelectid:undefined + }) + } + cardsModalsave=()=>{ + this.setState({ + Modalstype:false, + Modalstopval:'', + Modalsbottomval:'', + editdelectid:undefined + }) + } + + editeditbuttomtypecanle=()=>{ + this.setState({ + editbuttomtype:true, + editbuttomtypeadd:false + }) + } + + showparagraph=(key,index)=>{ + this.setState({ + showparagraph:true, + showparagraphkey:key, + showparagraphindex:index + }) + } + + hideparagraph=()=>{ + this.setState({ + showparagraph:false + }) + } + + hidestartshixunCombattype=()=>{ + this.setState({ + startshixunCombattype:false + }) + } + render(){ + let { pathCardsList, + dropid, + dropidtype, + idsum, + pathCardsedittype, + pathlistedit, + pathid, + Modalstype, + Modalstopval, + Modalsbottomval, + cardsModalsave, + cardsModalcancel, + delecttype, + hidestartshixunsreplacevalue, + editbuttomtype, + editbuttomtypeadd, + showparagraph, + showparagraphkey, + showparagraphindex + }=this.state; + const antIcon = ; + return( +
    + + + +
    +

    本实训的开启时间：{this.state.shixunsmessage}
    开启时间之前不能挑战

    +
    +
    + {/*取消*/} + 知道了 +
    + {/*

    */} + {/*知道了*/} + {/*

    */} +     + + + +
    +

    实训已经更新了，正在为您重置!

    +
    +
    + this.hidestartshixunsreplace(hidestartshixunsreplacevalue)}>知道了 +
    +     +     +
    + { + pathCardsList && pathCardsList.map((item,key)=>{ + + return( +
    +

    + + + + + {item.stage_name} + { + idsum===key&&pathCardsedittype===true?'': + + this.props.detailInfoList===undefined?"":this.props.detailInfoList.allow_statistics===true? + + + { editbuttomtype===true?'': + this.pathCardsedit(key, item.stage_id)}> + + + } + + { + pathCardsList.length=== key+1?"":this.operations(item.down_path)}> + + + + + } + + + {key===0?"": + this.operations(item.up_path)}> + + + + } + + :"" + + + } + + { + idsum === key && pathCardsedittype === true ? + this.props.detailInfoList===undefined?"":this.props.detailInfoList.allow_statistics===true? + this.delectpathCardsedit(item.stage_id)}> + + + + :"" + : '' + } +

    + + + { + idsum===key&&pathCardsedittype===true?'': +
    +

    {item.stage_description}

    + +
    + + { + item.shixuns_list && item.shixuns_list.map((line,index)=>{ + return( +
    this.showparagraph(key,index)} onMouseLeave={this.hideparagraph}> + +
  • + + + { + line.complete_status === 1 ? + : + } + + + {key+1}-{index+1}  {line.shixun_name} + + +
    • + { + line.shixun_status==="暂未公开"? +
  • 暂未公开
    • + : +
  • + { + showparagraphkey===key&&showparagraphindex===index?:"" + } + +
    • + } +
    ) + }) + } +
    +
    + } + + + + + +
    + ) + }) + } +
    + + + { editbuttomtypeadd===true?'': + + } + +
    + ) + } +} +export default DetailCards; + + + + + + +// { +// idsum===key&&pathCardsedittype===true?'': +//
    +//

    {item.stage_description}

    +// +// +// +// +// {(provided, snapshot) => ( +// +//
    +// +// { +// item.shixuns_list && item.shixuns_list.map((line,index)=>{ +// return( +// +// {(provided, snapshot) => ( +//
    +// +//
  • +// +// +// { +// line.complete_status === 1 ? +// : +// } +// +// +// +// +// {key+1}-{index+1}  {line.shixun_name} +// +// +//
    • +// { +// line.shixun_status==="暂未公开"? +//
  • 暂未公开
    • +// : +//
  • +// 查看详情 +// 开始实战 +//
    • +// } +// {provided.placeholder} +//
    +// )} +//     +// ) +// }) +// } +//
    +// )} +//     +//     +//
    // } \ No newline at end of file diff --git a/public/react/src/modules/tpm/shixunchild/Challenges/Challenges.js b/public/react/src/modules/tpm/shixunchild/Challenges/Challenges.js index cc9f02505..5554e0370 100644 --- a/public/react/src/modules/tpm/shixunchild/Challenges/Challenges.js +++ b/public/react/src/modules/tpm/shixunchild/Challenges/Challenges.js @@ -156,7 +156,35 @@ class Challenges extends Component { } } + 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({ @@ -167,7 +195,7 @@ class Challenges extends Component { // let path="/shixuns/"+response.data.shixun_identifier+"/challenges"; // this.props.history.push(path); message.success('重置成功，正在进入实训！'); - this.startshixunCombat(response.data.shixun_identifier); + this.startgameid(response.data.shixun_identifier); this.setState({ shixunsreplace:false, isSpin:false, @@ -179,11 +207,7 @@ class Challenges extends Component { ).catch((error) => { }); - this.setState({ - startbtn:false, - shixunsreplace:false, - isSpin:false - }) + } //编辑实训题目选择题