-
- :""
- )
- :""
- }
-
+ {/*{*/}
+ {/* this.props.type==='shixuns'?*/}
+ {/* (*/}
+ {/* item.is_jupyter===true?*/}
+ - Jupyter -
-
+
+ {/* :""*/}
+ {/* )*/}
+ {/* :""*/}
+ {/*}*/}
+
@@ -345,7 +372,13 @@ class ShixunsHome extends Component {
{item.tag_name}
{/*+ Jupyter +
+}/)
*/}
-
+ {
+ item.is_jupyter===true?
+
+ }/)
*/}
+
+ :""}
Jupyter
+ {/**/}
+ ![]({getImageUrl("images/educoder/icon/lockclose.svg")}){kind=icon}
diff --git a/public/react/src/modules/modals/Bottomsubmit.js b/public/react/src/modules/modals/Bottomsubmit.js
index 7c811be26..b128b2afe 100644
--- a/public/react/src/modules/modals/Bottomsubmit.js
+++ b/public/react/src/modules/modals/Bottomsubmit.js
@@ -10,7 +10,8 @@ class Bottomsubmit extends Component {
}
cannelfun=()=>{
- window.location.href=this.props.url
+ // window.location.href=
+ this.props.history.replace(this.props.url);
}
diff --git a/public/react/src/modules/tpm/TPMBanner.js b/public/react/src/modules/tpm/TPMBanner.js
index c78c05b92..7befed4c4 100644
--- a/public/react/src/modules/tpm/TPMBanner.js
+++ b/public/react/src/modules/tpm/TPMBanner.js
@@ -748,82 +748,86 @@ class TPMBanner extends Component {
-
- this.showonMouseOver()}
- onMouseOut={() => this.hideonMouseOut()}>
-
{
startbtn === false && shixunsDetails.shixun_status != -1 ?
diff --git a/public/react/src/modules/tpm/TPMDataset.js b/public/react/src/modules/tpm/TPMDataset.js
index 91322d18e..b7f168e0a 100644
--- a/public/react/src/modules/tpm/TPMDataset.js
+++ b/public/react/src/modules/tpm/TPMDataset.js
@@ -16,7 +16,6 @@ class TPMDataset extends Component {
constructor(props) {
super(props)
this.state = {
- datas: [0, 1, 2, 3, 4, 5],
value: undefined,
columns: [
{
@@ -80,10 +79,15 @@ class TPMDataset extends Component {
datalist:[],
data_sets_count:0,
selectedRowKeysdata:[],
+ loadingstate:false,
+ checked: false,
}
}
componentDidMount() {
+ this.setState({
+ loadingstate:true,
+ })
this.getdatas()
}
@@ -98,18 +102,20 @@ class TPMDataset extends Component {
datas.push(i);
}
-
this.setState({
selectedRowKeysdata:mydata,
selectedRowKeys: datas,
+ checked:true,
})
// console.log(mydata);
// console.log(datas);
-
-
} else {
this.setState({
+ selectedRowKeysdata:[],
selectedRowKeys: [],
+ checked:false,
+
+
})
}
}
@@ -143,11 +149,26 @@ class TPMDataset extends Component {
collaboratorList: response.data,
data_sets_count:response.data.data_sets_count,
datalist:datalists,
+ selectedRowKeysdata:[],
+ selectedRowKeys: [],
+ checked:false,
});
+
}
}
+ setTimeout(() => {
+ this.setState({
+ loadingstate:false,
+ })
+ }, 500)
+
}).catch((error)=>{
+ setTimeout(() => {
+ this.setState({
+ loadingstate:false,
+ })
+ }, 500)
console.log(error)
});
@@ -181,34 +202,39 @@ class TPMDataset extends Component {
collaboratorList: response.data,
data_sets_count:response.data.data_sets_count,
datalist:datalists,
+ selectedRowKeysdata:[],
+ selectedRowKeys: [],
+ checked:false,
});
}
}
+ setTimeout(() => {
+ this.setState({
+ loadingstate:false,
+ })
+ }, 500)
}).catch((error)=>{
+ setTimeout(() => {
+ this.setState({
+ loadingstate:false,
+ })
+ }, 500)
console.log(error)
});
}
- showModal = (id, status) => {
-
- };
-
- handleOk = (id, editid) => {
-
- };
-
- handleCancel = (e) => {
-
- };
paginationonChanges = (pageNumber) => {
// //console.log('Page: ');
this.setState({
page: pageNumber,
+ loadingstate:true,
})
+
this.getdatastwo(pageNumber,10);
}
+
onSelectChange = (selectedRowKeys, selectedRows) => {
console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
this.setState(
@@ -237,27 +263,37 @@ class TPMDataset extends Component {
// 附件相关 START
handleChange = (info) => {
- debugger
if(info.file.status === 'uploading' || info.file.status === 'done' || info.file.status === 'removed') {
let {fileList} = this.state;
if (info.file.status === 'uploading' || info.file.status === 'done' || info.file.status === 'removed') {
- console.log("handleChange1");
+ console.log("handleChange1fileLists");
// if(fileList.length===0){
let fileLists = info.fileList;
+ // console.log(fileLists);
this.setState({
// fileList:appendFileSizeToUploadFileAll(fileList),
fileList: fileLists,
deleteisnot: false
});
+ }
+ if(info.file.status === 'done'){
+ //done 成功就会调用这个方法
this.getdatas();
- // }
+ // this.props.showNotification(`上传文件成功`);
+
+ }else if(info.file.status === 'removed'){
+ // this.props.showNotification(`上传文件失败`);
+
+ }else if(info.file.status === 'uploading'){
+ // this.props.showNotification(`正在上传文件中`);
+
}
}
}
onAttachmentRemove = (file) => {
- debugger
+ // debugger
if(!file.percent || file.percent == 100){
confirm({
title: '确定要删除这个附件吗?',
@@ -278,28 +314,48 @@ class TPMDataset extends Component {
}
deleteRemovedata(){
- debugger
- console.log("删除");
- console.log(this.state.selectedRowKeysdata);
- const url = `/attachments/destroy_files.json`;
- axios.delete(url, {
- id:this.state.selectedRowKeysdata,
- })
- .then((response) => {
- if (response.data) {
- const { status } = response.data;
- if (status == 0) {
- this.props.showNotification(`删除成功`);
- this.getdatas()
- }
- }
- })
- .catch(function (error) {
- console.log(error);
- });
+
+ if(this.state.selectedRowKeysdata===undefined || this.state.selectedRowKeysdata===null ||this.state.selectedRowKeysdata.length===0){
+
+ this.props.showNotification(`请选择要删除的文件`);
+
+ return
+ }
+
+ confirm({
+ title: '确定要删除文件吗?',
+ okText: '确定',
+ cancelText: '取消',
+ // content: 'Some descriptions',
+ onOk: () => {
+ const url = `/attachments/destroy_files.json`;
+ axios.delete(url,
+ { params: {
+ id:this.state.selectedRowKeysdata,
+ }}
+ )
+ .then((response) => {
+ if (response.data) {
+ const { status } = response.data;
+ if (status == 0) {
+ this.props.showNotification(`删除成功`);
+
+ this.getdatas()
+ }
+ }
+ })
+ .catch(function (error) {
+ console.log(error);
+ });
+ },
+ onCancel() {
+ console.log('Cancel');
+ },
+ });
+
}
deleteAttachment = (file) => {
- console.log(file);
+ // console.log(file);
let id=file.response ==undefined ? file.id : file.response.id
const url = `/attachements/destroy_files.json`
axios.delete(url, {
@@ -333,7 +389,7 @@ class TPMDataset extends Component {
render() {
const {tpmLoading, shixun, user, match} = this.props;
- const {columns, datas, page, limit, selectedRowKeys,mylistansum,fileList,datalist,data_sets_count} = this.state;
+ const {columns, page, limit, selectedRowKeys,mylistansum,fileList,datalist,data_sets_count,loadingstate} = this.state;
const rowSelection = {
selectedRowKeys,
onChange: this.onSelectChange,
@@ -359,7 +415,7 @@ class TPMDataset extends Component {
onChange: this.handleChange,
onRemove: this.onAttachmentRemove,
beforeUpload: (file, fileList) => {
- debugger
+
if (this.state.fileList.length >= 1) {
return false
}
@@ -372,7 +428,6 @@ class TPMDataset extends Component {
message: '提示',
description:
'文件大小必须小于50MB',
-
}
)
}
@@ -386,8 +441,6 @@ class TPMDataset extends Component {
file:file
})
}
-
- console.log("handleChange2");
return isLt150M;
},
}
@@ -407,9 +460,14 @@ class TPMDataset extends Component {
学员评分
-
-
- this.hideonMouseOut()}>
-
+ :""
+ }
-
-
-
+
+
-
+
-
+
+ {
+ this.props.is_jupyter===false?
+
+ this.showonMouseOver()}
+ onMouseOut={() => this.hideonMouseOut()}>
+
+ 学员评分
+
+
+ this.hideonMouseOut()}>
+
+ className="font-24 color-yellow-ff lineh-20 mb10 ml20">{star_infos[0]}分
+ 总评分
+
+
+
-
+
-
+
-
{star_infos[0]}分
- 总评分
-
-
- {showradios === true ?
-
-
-
-
-
-
- {showradios === true ?
-
-
- {star_infos[1]}%
-
-
-
- {showradios === true ?
-
-
- {star_infos[2]}%
-
-
-
- {showradios === true ?
-
-
- {star_infos[3]}%
-
-
-
- {showradios === true ?
-
-
- {star_infos[4]}%
-
-
-
- {showradios === true ?
-
-
- {star_infos[5]}%
-
+ {showradios === true ?
+
+
+
+
+
+
+ {showradios === true ?
+
+
+ {star_infos[1]}%
+
+
+
+ {showradios === true ?
+
+
+ {star_infos[2]}%
+
+
+
+ {showradios === true ?
+
+
+ {star_infos[3]}%
+
+
+
+ {showradios === true ?
+
+
+ {star_infos[4]}%
+
+
+
+ {showradios === true ?
+
+
+ {star_infos[5]}%
+
-
-
-
-
-
-
-
-
+
- 全选
-
+ {
+ data_sets_count>0?
+
+ 全选
+
+ :""
+ }
+
+
+
+ {
+ this.props.identity < 5 && this.state.data && this.state.data.shixun.status == 0 ?
+
+ : ""
+ }
+ {
+ this.props.identity == 1 && this.state.data && this.state.data.shixun.status == 2 ?
+ : ""
+ }
+ {
+ this.props.identity === 1 && this.state.data && this.state.data.shixun.status == 2 ?
+ : ""
}
-
-
-
-
-
- }>
-
+ {this.state.delType === 1 ?
+
+ 是否确认删除 ？
: +关闭后,
用户不能再开始挑战了是否确认关闭 ？
数据集
+ (
+ is_teacher===true?
+ 数据集
+ :""
+ )
+
+ :""
+ }
+
+ {
+ this.props.is_jupyter === false ?
+ 评论
:""
}
+ {
+ this.props.is_jupyter === false ?
+ 排行榜:""
+ }
+ {this.props.identity >2||this.props.identity===undefined?"":
+ (this.props.is_jupyter === false?
+ 审核情况
+ :
+ is_teacher===true?
+ 审核情况
+ :
+ ""
+
+ )
- 评论
- 排行榜
- {this.props.identity >2||this.props.identity===undefined?"":审核情况}
+ }
{this.props.identity >4||this.props.identity===undefined ? "":配置}
diff --git a/public/react/src/modules/tpm/jupyter/index.js b/public/react/src/modules/tpm/jupyter/index.js
index 031b5c2b9..6a84f964e 100644
--- a/public/react/src/modules/tpm/jupyter/index.js
+++ b/public/react/src/modules/tpm/jupyter/index.js
@@ -4,38 +4,165 @@
* @Github:
* @Date: 2019-12-11 08:35:23
* @LastEditors: tangjiang
- * @LastEditTime: 2019-12-11 09:13:09
+ * @LastEditTime: 2019-12-12 20:19:48
*/
import './index.scss';
-import React from 'react';
+import React, { useEffect, useState } from 'react';
import SplitPane from 'react-split-pane';
-import { Button } from 'antd';
-
+import { Button, Modal } from 'antd';
+import {
+ connect
+} from 'react-redux';
import UserInfo from '../../developer/components/userInfo';
-
+import actions from '../../../redux/actions';
+import LeftPane from './leftPane';
+import RightPane from './rightPane';
function JupyterTPI (props) {
+ // 获取 identifier 值
+ const {
+ match: {
+ params = {}
+ },
+ url,
+ loading, // 保存按钮状态
+ dataSets, // 数据集
+ jupyter_info,
+ getJupyterInfo,
+ syncJupyterCode,
+ jupyter_tpi_url_state,
+ // getJupyterTpiDataSet,
+ getJupyterTpiUrl,
+ saveJupyterTpi,
+ changeLoadingState,
+ changeGetJupyterUrlState
+ } = props;
+
+ const {identifier} = params;
+ const [userInfo, setUserInfo] = useState({});
+ const [jupyterInfo, setJupyterInfo] = useState({});
+ const [updateTip, setUpdateTip] = useState(true);
+ const [myIdentifier, setMyIdentifier] = useState('');
+ useEffect(() => {
+ /* 先调用 jupyter的 TPI 接口，
+ * 获取 用户信息,
+ * 实训的 identifier, 状态， 名称， 是否被修改等信息
+ */
+ getJupyterInfo(identifier);
+ }, [identifier]);
+
+ useEffect(() => {
+ // 设置jupyter信息
+ setJupyterInfo(jupyter_info || {});
+ const {user, tpm_modified, myshixun_identifier} = jupyter_info;
+ if (user) {
+ setUserInfo(user);
+ }
+
+ if (myshixun_identifier) {
+ setMyIdentifier(myshixun_identifier);
+ }
+
+ // 同步代码
+ if (tpm_modified && updateTip && myshixun_identifier) {
+ setUpdateTip(false);
+ Modal.confirm({
+ title: '更新通知',
+ content: (
-
@@ -44,4 +171,35 @@ function JupyterTPI (props) {
);
}
-export default JupyterTPI;
+const mapStateToProps = (state) => {
+ const {
+ jupyter_info,
+ jupyter_tpi_url,
+ jupyter_data_set,
+ jupyter_tpi_url_state
+ } = state.jupyterReducer;
+ const { loading } = state.commonReducer;
+ return {
+ loading,
+ jupyter_info,
+ url: jupyter_tpi_url,
+ dataSets: jupyter_data_set,
+ jupyter_tpi_url_state
+ };
+}
+
+const mapDispatchToProps = (dispatch) => ({
+ changeGetJupyterUrlState: (status) => dispatch(actions.changeGetJupyterUrlState(status)),
+ getJupyterInfo: (identifier) => dispatch(actions.getJupyterInfo(identifier)),
+ // 重置代码
+ syncJupyterCode: (identifier, msg) => dispatch(actions.syncJupyterCode(identifier, msg)),
+ // getJupyterTpiDataSet: (identifier) => dispatch(actions.getJupyterTpiDataSet(identifier)),
+ getJupyterTpiUrl: (identifier) => dispatch(actions.getJupyterTpiUrl(identifier)),
+ saveJupyterTpi: () => dispatch(actions.saveJupyterTpi()),
+ changeLoadingState: (flag) => dispatch(actions.changeLoadingState(flag))
+});
+
+export default connect(
+ mapStateToProps,
+ mapDispatchToProps
+)(JupyterTPI);
diff --git a/public/react/src/modules/tpm/jupyter/index.scss b/public/react/src/modules/tpm/jupyter/index.scss
index 7ec98f3b0..a174c5be5 100644
--- a/public/react/src/modules/tpm/jupyter/index.scss
+++ b/public/react/src/modules/tpm/jupyter/index.scss
@@ -55,7 +55,7 @@
height: 60px;
line-height: 60px;
background-color: #070F1A;
-
+ padding-left: 30px;
.jupyter_title{
display: flex;
flex-direction: column;
@@ -90,4 +90,12 @@
position: relative;
height: calc(100vh - 60px);
}
+
+ .update_notice{
+ text-align: center;
+ .update_txt{
+ line-height: 18px;
+ font-size: 14px;
+ }
+ }
}
\ No newline at end of file
diff --git a/public/react/src/modules/tpm/jupyter/leftPane/index.js b/public/react/src/modules/tpm/jupyter/leftPane/index.js
new file mode 100644
index 000000000..f8cbbeccd
--- /dev/null
+++ b/public/react/src/modules/tpm/jupyter/leftPane/index.js
@@ -0,0 +1,84 @@
+/*
+ * @Description:
+ * @Author: tangjiang
+ * @Github:
+ * @Date: 2019-12-12 10:34:03
+ * @LastEditors: tangjiang
+ * @LastEditTime: 2019-12-12 20:18:46
+ */
+import './index.scss';
+import React, { useState, useEffect } from 'react';
+import {Icon, Empty} from 'antd';
+import MyIcon from '../../../../common/components/MyIcon';
+
+function LeftPane (props) {
+
+ // 获取数据集
+ const { dataSets = [] } = props;
+
+ const emptyCtx = (
+
+
+ );
+ });
+
+ const oUl = (
+
+ //
+ // );
+ // });
+ // return (
+ //
@@ -567,7 +566,7 @@ class Newshixuns extends Component {
- this.handleSubmit()}/>
+ this.handleSubmit()}/>
);
diff --git a/public/react/src/modules/tpm/newshixuns/css/Newshixuns.css b/public/react/src/modules/tpm/newshixuns/css/Newshixuns.css
index f18446ea1..9a85f33d4 100644
--- a/public/react/src/modules/tpm/newshixuns/css/Newshixuns.css
+++ b/public/react/src/modules/tpm/newshixuns/css/Newshixuns.css
@@ -392,9 +392,9 @@ a.white-btn.use_scope-btn:hover{
border-color: #096dd9;
}
-.ant-btn:hover, .ant-btn:focus, .ant-btn:active, .ant-btn.active{
- background-color: #4CACFF;
-}
+/*.ant-btn:hover, .ant-btn:focus, .ant-btn:active, .ant-btn.active{*/
+/* background-color: #4CACFF;*/
+/*}*/
.newViewAfter .ant-input{
line-height: 40px !important;
diff --git a/public/react/src/modules/tpm/shixunchild/Challenges/Challengesjupyter.js b/public/react/src/modules/tpm/shixunchild/Challenges/Challengesjupyter.js
index 658e5d9da..ea241b479 100644
--- a/public/react/src/modules/tpm/shixunchild/Challenges/Challengesjupyter.js
+++ b/public/react/src/modules/tpm/shixunchild/Challenges/Challengesjupyter.js
@@ -33,6 +33,9 @@ class Challengesjupyter extends Component {
iFrameHeight: '0px',
jupyter_port:0,
jupyter_url:null,
+ username:"",
+ booljupyterurls:false,
+ loading:false,
}
}
@@ -53,102 +56,82 @@ class Challengesjupyter extends Component {
}
}
}).catch((error) => {
- console.log(error)
+ //console.log(error)
});
}
componentDidMount() {
setTimeout(this.ChallengesList(), 1000);
-
- // console.log("componentDidMount");
- // console.log("Challengesjupyter");
- // console.log(this.props);
let id = this.props.match.params.shixunId;
let ChallengesURL = `/jupyters/get_info_with_tpm.json`;
let datas={
identifier:id,
}
axios.get(ChallengesURL, {params: datas}).then((response) => {
- debugger
- 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) {
}else{
- // console.log("componentDidMountChallengesjupyter");
- // console.log(response.data);
- debugger
if(response.data.status===0){
this.setState({
jupyter_url:response.data.url,
jupyter_port:response.data.port,
})
-
-
}else{
-
}
}
+ this.setState({
+ booljupyterurls:true,
+ })
}).catch((error) => {
- console.log(error)
+ this.setState({
+ booljupyterurls:true,
+ })
});
-
-
-
- }
-
- updatamakedown = (id) => {
-
- }
-
- // 关卡的上移下移操作
- operations = (sumid, type) => {
-
- }
- delOperations = (sumid) => {
-
}
- clonedelOperationss = () => {
-
- }
- delOperationss = () => {
-
- }
-
- startgameid=(id)=>{
-
-
-
-
- }
-
- hidestartshixunsreplace=(url)=>{
-
+ updatamakedowns = () => {
+ this.setState({
+ loading:true,
+ })
+ let id = this.props.match.params.shixunId;
+ let ChallengesURL = `/jupyters/get_info_with_tpm.json`;
+ let datas={
+ identifier:id,
+ }
+ axios.get(ChallengesURL, {params: datas}).then((response) => {
+ if (response.data.status === 403||response.data.status === 401||response.data.status === 500) {
+ }else{
+ if(response.data.status===0){
+ this.setState({
+ jupyter_url:response.data.url,
+ jupyter_port:response.data.port,
+ })
+ }else{
+ }
+ }
+ this.setState({
+ booljupyterurls:true,
+ loading:false,
+ })
+ }).catch((error) => {
+ this.setState({
+ booljupyterurls:true,
+ loading:false,
+ })
+ });
}
- //编辑实训题目选择题
- EditTraining=(type, ids, path)=>{
- }
- //开始实战按钮
- startshixunCombat = (type, ids, id) => {
- }
- hidestartshixunCombattype=()=>{
- }
- hideAccountProfile=()=>{
- };
modifyjupyter=()=>{
- // console.log("propsysl");
- // console.log(propsysl);
let id=this.props.match.params.shixunId;
var jupyter_port="";
try{
@@ -162,7 +145,7 @@ class Challengesjupyter extends Component {
identifier:id,
jupyter_port:jupyter_port,
}
- axios.post(url, data)
+ axios.get(url, {params: data})
.then((result) => {
if (result.data.status === 0) {
this.props.showNotification(`应用成功`);
@@ -171,47 +154,18 @@ class Challengesjupyter extends Component {
})
}
- sendToken=()=>{
- // console.log("sendToken");
- // const iframe = document.getElementById('iframe');
- // console.log("modifyjupyter");
- // const frameWindow = iframe.contentWindow;
- // console.log("frameWindow");
- // console.log(frameWindow);
- }
render() {
- let{ChallengesDataList}=this.state;
+ let{ChallengesDataList,booljupyterurls}=this.state;
let id = this.props.match.params.shixunId;
-// var deptObjs=document.getElementById("IFRAMEID").contentWindow.document.getElementById("TAGID");
-// //判断此元素是否存在
-// if(deptObjs!=null){
-// //设置该元素的样式或其他属性
-// deptObjs.setAttribute('style',' height: 20px !important;'); //!important用来提升指定样式条目的应用优先权
-// }
-// var submitObj = document.getElementById('submit');
-// if(submitObj){
-// submitObj.style.color = 'green';
-// }
-// const dom = document.getElementById('shutdown');
-// ReactDOM.unmountComponentAtNode(dom)
-// // window.$('#picture_display').hide();
-// window.$('.data-tip-right').hide()
-// window.onload=()=>{
-// debugger
-// var _iframe = document.getElementById('header');
-// console.log(_iframe);
-// // .contentWindow.document.getElementById('shutdown_widget') //get iframe下的id
-// // _iframe.style.display= "none"; //修改样式
-// }
-
-
+ const is_teacher = this.props&&this.props.current_user&&this.props.current_user.is_teacher?this.props.current_user.is_teacher:false;
return (
+
),
+ okText: '确定',
+ cancelText: '取消',
+ onOk () {
+ syncJupyterCode(myshixun_identifier, '同步成功');
+ }
+ })
+ }
+ }, [props]);
+
+ // 重置实训
+ const handleClickResetTpi = () => {
+ Modal.confirm({
+ title: '重置实训',
+ content: (
+ 关卡任务的代码文件有更新啦
+更新操作将保留已完成的评测记录和成绩
+还未完成评测的任务代码，请自行保存
+
+ 你在本文件中修改的内容将丢失,
+ 是否确定重新加载初始代码？
+
-
- MySQL数据库编程开发实训(基础篇) - 时间 + {jupyterInfo.name} +
{/* sync | poweroff */} - - + +
- 左侧内容
+
右侧内容
+
+
+ );
+
+ // const listCtx = ;
+ const [renderCtx, setRenderCtx] = useState(() => (emptyCtx));
+
+ useEffect(() => {
+ if (dataSets.length > 0) {
+ console.log('数据集的个数: ', dataSets.length);
+ const oList = dataSets.map((item, i) => {
+ return (
+ -
+ { oList }
+
+ //
+ // } else {
+ // // 渲染列表
+ // const oList = dataSets.map((item, i) => {
+ // return (
+ // -
+ // { oList }
+ //
+
+
+ { renderCtx }
+
+ )
+}
+
+export default LeftPane;
\ No newline at end of file
diff --git a/public/react/src/modules/tpm/jupyter/leftPane/index.scss b/public/react/src/modules/tpm/jupyter/leftPane/index.scss
new file mode 100644
index 000000000..dfd9f121d
--- /dev/null
+++ b/public/react/src/modules/tpm/jupyter/leftPane/index.scss
@@ -0,0 +1,55 @@
+.jupyter_data_sets_area{
+ height: 100%;
+ .jupyter_h2_title{
+ height: 50px;
+ line-height: 50px;
+ background-color: #EEEEEE;
+ padding: 0 30px;
+ .jupyter_data_icon{
+ color: #7286ff;
+ font-size: 24px;
+ position: relative;
+ top: 2px;
+ transform: scale(1.5);
+ }
+ }
+
+ .jupyter_data_list,
+ .jupyter_empty{
+ height: calc(100vh - 110px);
+ overflow-y: auto;
+ }
+
+ .jupyter_data_list{
+ .jupyter_item{
+ line-height:45px;
+ border-bottom: 1px solid rgba(238,238,238, 1);
+ padding: 0 30px 0 60px;
+ overflow: hidden;
+ text-overflow:ellipsis;
+ white-space: nowrap;
+ cursor: pointer;
+ transition: .3s;
+ &:hover{
+ background-color: rgba(235, 235, 235, .3);
+ }
+ .jupyter_icon{
+ color: rgb(74, 188, 125);
+ font-size: 16px;
+ transform: scale(1.2);
+ margin-right: 5px;
+ }
+ .jupyter_name{
+ color: #000;
+ font-size: 16px;
+ }
+ }
+ }
+
+ .jupyter_empty{
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: 100%;
+ }
+}
\ No newline at end of file
diff --git a/public/react/src/modules/tpm/jupyter/rightPane/index.js b/public/react/src/modules/tpm/jupyter/rightPane/index.js
new file mode 100644
index 000000000..1282732f4
--- /dev/null
+++ b/public/react/src/modules/tpm/jupyter/rightPane/index.js
@@ -0,0 +1,90 @@
+/*
+ * @Description:
+ * @Author: tangjiang
+ * @Github:
+ * @Date: 2019-12-12 15:04:20
+ * @LastEditors: tangjiang
+ * @LastEditTime: 2019-12-12 17:41:41
+ */
+import './index.scss';
+import React, { useEffect, useState } from 'react';
+import { Spin, Button } from 'antd';
+function RightPane (props) {
+ const {
+ status,
+ url,
+ onReloadUrl,
+ onSave,
+ loading
+ } = props;
+
+ const [renderCtx, setRenderCtx] = useState(() => loadInit);
+ // 重新获取 url
+ const handleClickReload = () => {
+ onReloadUrl && onReloadUrl();
+ }
+
+ const loadInit = (
+
+
+ { renderCtx }
+
+
+ );
+
+ const loadError = (
+
+
+ );
+
+ // 保存
+ const handleClickSubmit = () => {
+ console.log('调用了保存接口....');
+ onSave && onSave();
+ }
+
+ useEffect(() => {
+ if (status === -1) {
+ setRenderCtx(() => loadInit);
+ } else if (status === 0 && url) {
+ setRenderCtx(() => (
+
+ + 加载实训出错，是否 + 重新加载 +
+
+
+
+ ));
+ } else {
+ setRenderCtx(() => loadError);
+ }
+ }, [status, url, loading]);
+
+ return (
+
+
+
+
+
+
+
+ { renderCtx }
+
+ )
+}
+
+export default RightPane;
+
diff --git a/public/react/src/modules/tpm/jupyter/rightPane/index.scss b/public/react/src/modules/tpm/jupyter/rightPane/index.scss
new file mode 100644
index 000000000..edf305623
--- /dev/null
+++ b/public/react/src/modules/tpm/jupyter/rightPane/index.scss
@@ -0,0 +1,62 @@
+.jupyter_right_pane_area{
+ position: relative;
+ height: calc(100vh - 60px);
+ // background: pink;
+
+ .jupyter_load_url_error,
+ .jupyter_loading_init{
+ display: flex;
+ position: relative;
+ align-items: center;
+ justify-content: center;
+ height: 100%;
+ &::before{
+ position: absolute;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ content: '';
+
+ }
+ }
+
+ .jupyter_loading_init{
+ &::before{
+ background-color: rgba(0,0,0,.2);
+ }
+ }
+
+ .jupyter_load_url_error{
+ // &::before{
+ // background-color: rgba(0,0,0,.2);
+ // }
+ .jupyter_error_txt{
+ position: relative;
+ z-index: 1;
+ .jupyter_reload{
+ cursor: pointer;
+ color: #1890ff;
+ }
+ }
+ }
+
+ .jupyter_result{
+ height: 100%;
+ .jupyter_iframe{
+ height: calc(100% - 56px);
+ // background: pink;
+ .jupyter_iframe_style{
+ border: none;
+ outline: none;
+ }
+ }
+ .jupyter_submit{
+ display: flex;
+ align-items: center;
+ height: 56px;
+ justify-content: flex-end;
+ padding-right: 30px;
+ }
+ }
+}
\ No newline at end of file
diff --git a/public/react/src/modules/tpm/newshixuns/Newshixuns.js b/public/react/src/modules/tpm/newshixuns/Newshixuns.js
index 8a1be807b..7621a82ca 100644
--- a/public/react/src/modules/tpm/newshixuns/Newshixuns.js
+++ b/public/react/src/modules/tpm/newshixuns/Newshixuns.js
@@ -4,7 +4,7 @@ import {TPMIndexHOC} from '../TPMIndexHOC';
import {SnackbarHOC} from 'educoder';
-import {Select, Radio, Input, Modal, Button, Form, Tooltip, Upload, Icon,notification} from 'antd';
+import {Select, Radio, Input, Modal, Button, Form, Tooltip, Upload, Icon, notification} from 'antd';
import axios from 'axios';
@@ -145,7 +145,7 @@ class Newshixuns extends Component {
});
let newlist = ""
e.map((item, key) => {
- if(item.props.name!=""){
+ if (item.props.name != "") {
newlist = newlist + `${item.props.name}`
}
})
@@ -316,7 +316,7 @@ class Newshixuns extends Component {
// 附件相关 START
handleChange = (info) => {
- if(info.file.status === 'uploading' || info.file.status === 'done' || info.file.status === 'removed') {
+ if (info.file.status === 'uploading' || info.file.status === 'done' || info.file.status === 'removed') {
let {fileList} = this.state;
if (info.file.status === 'uploading' || info.file.status === 'done' || info.file.status === 'removed') {
@@ -334,7 +334,7 @@ class Newshixuns extends Component {
}
onAttachmentRemove = (file) => {
- if(!file.percent || file.percent == 100){
+ if (!file.percent || file.percent == 100) {
Modal.confirm({
title: '确定要删除这个附件吗?',
okText: '确定',
@@ -355,13 +355,12 @@ class Newshixuns extends Component {
deleteAttachment = (file) => {
console.log(file);
- let id=file.response ==undefined ? file.id : file.response.id
+ let id = file.response == undefined ? file.id : file.response.id
const url = `/attachments/${id}.json`
- axios.delete(url, {
- })
+ axios.delete(url, {})
.then((response) => {
if (response.data) {
- const { status } = response.data;
+ const {status} = response.data;
if (status == 0) {
// console.log('--- success')
@@ -372,7 +371,7 @@ class Newshixuns extends Component {
newFileList.splice(index, 1);
return {
fileList: newFileList,
- deleteisnot:true
+ deleteisnot: true
};
});
}
@@ -503,8 +502,8 @@ class Newshixuns extends Component {
>
-
-
+
+
+
+
简介
+
+
+
+ :""
+ )
+ :""
+ }
+
+
+
- 加载实训出错，是否
this.updatamakedowns()}>重新加载
+ +
- {/*https://48888.jupyter.educoder.net/tree?*/}
-
-
+ {
+ is_teacher===true?
+
- {
- this.state.jupyter_url===null || this.state.jupyter_url===undefined?
- ""
- :
-
- }
-
-
+
+ :""
+ }
+ {
+ this.state.jupyter_url===null || this.state.jupyter_url===undefined?
+ ""
+ :
+
+ }
+
+ ![]({setImagesUrl("images/educoder/tag2.png")}/)
*/}
}
+ {
+ item.is_jupyter===true?
+
+ */}
+
+ :""}
+
+
Jupyter
+ {/**/}
+ Jupyter
Jupyter