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

调整

Browse Source
chromesetting
杨树林 5 years ago
parent 7fca3f2e87
commit a44e06b506
1 changed files with 91 additions and 143 deletions
Show Stats Download Patch File Download Diff File

234
public/react/src/modules/tpm/shixunchild/Challenges/Challengesjupyter.js
Unescape View File

@ -8,7 +8,7 @@ import '../shixunchildCss/Challenges.css';
import axios from 'axios'; import axios from 'axios';
const $ = window.$; const $ = window.$;
//12.20,14:11
class Challengesjupyter extends Component { class Challengesjupyter extends Component {
constructor(props) { constructor(props) {
super(props) super(props)
@ -48,54 +48,33 @@ class Challengesjupyter extends Component {
isopentitletype:"Less", isopentitletype:"Less",
}) })
} }
this.getjianjiesize()
} }
} }
}).catch((error) => { }).catch((error) => {
//console.log(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
})
}
}
}
}
}
componentDidUpdate = (prevProps,prevState) => { componentDidUpdate = (prevProps,prevState) => {
//防止陷入无限循环 //防止陷入无限循环
if(prevState.ChallengesDataList!=this.state.ChallengesDataList){ if(prevState.ChallengesDataList!=this.state.ChallengesDataList){
if(this.state.isopentitletype==="greater"){ let boxoffsetHeigh;
let box=document.getElementById("shixunchallengesid");
if(box){
boxoffsetHeigh=box.offsetHeight
if(boxoffsetHeigh<300){
this.setState({
isopentitletype:"Less",
boxoffsetHeigh:boxoffsetHeigh
})
}else{
this.setState({
isopentitletype:"greater",
opentitletype:true,
boxoffsetHeigh:boxoffsetHeigh
})
}
}else{
this.getjianjiesize()
} }
} }
@ -105,9 +84,9 @@ class Challengesjupyter extends Component {
setTimeout(this.ChallengesList(), 1000); setTimeout(this.ChallengesList(), 1000);
let id = this.props.match.params.shixunId; let id = this.props.match.params.shixunId;
let ChallengesURL = `/jupyters/get_info_with_tpm.json`; let ChallengesURL = `/jupyters/get_info_with_tpm.json`;
let datas={ let datas={
identifier:id, identifier:id,
} }
axios.get(ChallengesURL, {params: datas}).then((response) => { axios.get(ChallengesURL, {params: datas}).then((response) => {
if (response.data.status === 403||response.data.status === 401||response.data.status === 500) { if (response.data.status === 403||response.data.status === 401||response.data.status === 500) {
setTimeout(() => { setTimeout(() => {
@ -115,26 +94,26 @@ class Challengesjupyter extends Component {
booljupyterurls:true, booljupyterurls:true,
}) })
}, 600) }, 600)
}else{
if(response.data.status===0){
setTimeout(() => {
this.setState({
jupyter_url:response.data.url,
jupyter_port:response.data.port,
booljupyterurls:true,
})
}, 800)
}else{ }else{
if(response.data.status===0){ setTimeout(() => {
this.setState({
setTimeout(() => { booljupyterurls:true,
this.setState({ })
jupyter_url:response.data.url, }, 600)
jupyter_port:response.data.port,
booljupyterurls:true,
})
}, 800)
}else{
setTimeout(() => {
this.setState({
booljupyterurls:true,
})
}, 600)
}
} }
}
}).catch((error) => { }).catch((error) => {
@ -145,10 +124,6 @@ class Challengesjupyter extends Component {
}, 600) }, 600)
}); });
setTimeout(this.getjianjiesize(), 1000);
window.addEventListener('message', (e) => { window.addEventListener('message', (e) => {
console.log("触发了jupytermessage"); console.log("触发了jupytermessage");
@ -163,8 +138,6 @@ class Challengesjupyter extends Component {
} }
}); });
setTimeout(this.getjianjiesize(), 1000);
} }
updatamakedowns = () => { updatamakedowns = () => {
@ -218,13 +191,13 @@ class Challengesjupyter extends Component {
modifyjupyter=()=>{ modifyjupyter=()=>{
let id=this.props.match.params.shixunId; let id=this.props.match.params.shixunId;
var jupyter_port=""; var jupyter_port="";
try{ try{
jupyter_port= parseInt(this.state.jupyter_port); jupyter_port= parseInt(this.state.jupyter_port);
}catch (e) { }catch (e) {
jupyter_port=this.state.jupyter_port; jupyter_port=this.state.jupyter_port;
} }
const url=`/jupyters/save_with_tpm.json`; const url=`/jupyters/save_with_tpm.json`;
const data={ const data={
identifier:id, identifier:id,
@ -234,7 +207,6 @@ class Challengesjupyter extends Component {
.then((result) => { .then((result) => {
if (result.data.status === 0) { if (result.data.status === 0) {
this.props.showNotification(`应用成功`); this.props.showNotification(`应用成功`);
console.log("触发了jupytermessage调用了应用成功");
} }
}).catch((error) => { }).catch((error) => {
}) })
@ -245,15 +217,12 @@ class Challengesjupyter extends Component {
opentitletype:!this.state.opentitletype opentitletype:!this.state.opentitletype
}) })
} }
onclki=(bool)=>{ onclki=(bool)=>{
this.setState({ this.setState({
enlarge:bool enlarge:bool
}) })
} }
render() { render() {
let{ChallengesDataList,booljupyterurls,enlarge}=this.state; let{ChallengesDataList,booljupyterurls,enlarge}=this.state;
let id = this.props.match.params.shixunId; let id = this.props.match.params.shixunId;
@ -263,8 +232,6 @@ class Challengesjupyter extends Component {
const business = this.props&&this.props.current_user&&this.props.current_user.business?this.props.current_user.business:false; const business = this.props&&this.props.current_user&&this.props.current_user.business?this.props.current_user.business:false;
//管理员 //管理员
const admin = this.props&&this.props.current_user&&this.props.current_user.admin?this.props.current_user.admin:false; const admin = this.props&&this.props.current_user&&this.props.current_user.admin?this.props.current_user.admin:false;
//用户
const login = this.props&&this.props.current_user&&this.props.current_user.login?this.props.current_user.login:"";
let mysidentity =false; let mysidentity =false;
try { try {
@ -286,39 +253,17 @@ class Challengesjupyter extends Component {
</a> </a>
</Tooltip> </Tooltip>
</div> </div>
{this.state.opentitletype===true?<style>
<div> {
<style> `
{
`
.markdown-body img{
min-height: 200px;
}
`
}
</style>
{ChallengesDataList === undefined || ChallengesDataList&&ChallengesDataList.description=== ""||ChallengesDataList&&ChallengesDataList.description===null||ChallengesDataList&&ChallengesDataList.description===undefined?<style>
{
`
#shixunchallengesid{ #shixunchallengesid{
max-height: 300px; max-height: 300px;
overflow: hidden; overflow: hidden;
} }
` `
} }
</style>:""} </style>:""}
{ChallengesDataList === undefined || ChallengesDataList&&ChallengesDataList.description=== ""||ChallengesDataList&&ChallengesDataList.description===null||ChallengesDataList&&ChallengesDataList.description===undefined?"":this.state.isopentitletype==="greater"&&this.state.opentitletype===true? <div>
<style>
{
`
#shixunchallengesid{
max-height:260px;
overflow: hidden;
}
`
}
</style>:""}
<div className={"pd20"} id={"shixunchallengesid"}> <div className={"pd20"} id={"shixunchallengesid"}>
<p id="ReactMarkdown" style={{overflow:'hidden'}}> <p id="ReactMarkdown" style={{overflow:'hidden'}}>
@ -385,9 +330,8 @@ class Challengesjupyter extends Component {
display: flex; display: flex;
flex-direction:row-reverse; flex-direction:row-reverse;
} }
; ;
} }
` `
} }
</style> </style>
@ -396,29 +340,33 @@ class Challengesjupyter extends Component {
"" ""
: :
( (
admin===true||business===true||mysidentity===true? admin===true||business===true||mysidentity===true?
<div className={"shixunjianjiecballenges edu-back-white sortinxdirection mt20"}> <div className={enlarge?"shixunjianjiecballenges edu-back-white intermediatecenter fangdaone":"shixunjianjiecballenges edu-back-white mt20"}>
<div className="renwuxiangssi sortinxdirection">
<div><p className="renwuxiangqdiv">任务详情</p></div> <div className={"sortinxdirection"} >
<div><p className="renwuxiangqdivtest ml1 shixunbingbaocun">（请将实训题目写在下方并保存）</p></div> <div className="renwuxiangssi sortinxdirection">
</div> <div><p className="renwuxiangqdiv">任务详情</p></div>
<div className="renwuxiangssit xaxisreverseorder"> <div><p className="renwuxiangqdivtest ml1 shixunbingbaocun">（请将实训题目写在下方并保存）</p></div>
{ </div>
enlarge===true? <div className="renwuxiangssit xaxisreverseorder">
<i className="iconfont icon-suoxiao2 font-20 ml2 ysliconfont" style={{ {
marginLeft: '30px', enlarge===true?
}} onClick={()=>this.onclki(false)}></i> <i className="iconfont icon-suoxiao2 font-20 ml2 ysliconfont" style={{
: marginLeft: '30px',
<i className="iconfont icon-fangda font-20 ml2 ysliconfont" style={{ }} onClick={()=>this.onclki(false)}></i>
marginLeft: '30px', :
}} onClick={()=>this.onclki(true)}></i> <i className="iconfont icon-fangda font-20 ml2 ysliconfont" style={{
} marginLeft: '30px',
{/*<div className="challenbaocun" ><p*/} }} onClick={()=>this.onclki(true)}></i>
{/* className="challenbaocuntest">导入</p>*/} }
{/*</div>*/} {/*<div className="challenbaocun" onClick={() => this.modifyjupyter(this.state)}><p*/}
{/* className="challenbaocuntest">导入</p>*/}
{/*</div>*/}
</div>
</div> </div>
</div> </div>
:
:
"" ""
) )
@ -450,25 +398,25 @@ class Challengesjupyter extends Component {
} }
</style> </style>
{ {
admin===true||business===true||mysidentity===true? admin===true||business===true||mysidentity===true?
<div> <div>
<div className="pb47"> <div className="pb47">
{ {
this.state.jupyter_url===null || this.state.jupyter_url===undefined? this.state.jupyter_url===null || this.state.jupyter_url===undefined?
( (
booljupyterurls===false? booljupyterurls===false?
<LoadingSpin></LoadingSpin> <LoadingSpin></LoadingSpin>
:"" :""
) )
: :
<iframe src={this.state.jupyter_url} className={enlarge?"fangdatwo":""} <iframe src={this.state.jupyter_url} className={enlarge?"fangdatwo":""}
sandbox="allow-same-origin allow-scripts allow-top-navigation " scrolling="no" id="frame" sandbox="allow-same-origin allow-scripts allow-top-navigation " scrolling="no" id="frame"
name="framename" width="100%" height="700" frameBorder="0" name="framename" width="100%" height="700" frameBorder="0"
></iframe> ></iframe>
} }
</div>
</div> </div>
:"" </div>
:""
} }
</div> </div>
</div> </div>

Write Preview
Loading…
Cancel
Save