add jupyter tpi page

public/react/src/App.js

@@ -316,6 +316,11 @@ const RecordDetail = Loadable({
 	loader: () => import('./modules/developer/recordDetail'),
 	loading: Loading
 });
+// jupyter tpi
+const JupyterTPI = Loadable({
+	loader: () => import('./modules/tpm/jupyter'),
+	loading: Loading
+});
 // //个人竞赛报名
 // const PersonalCompetit = Loadable({
 // 	loader: () => import('./modules/competition/personal/PersonalCompetit.js'),
@@ -697,6 +702,10 @@ class App extends Component {
 										(props) => (<Developer  {...this.props} {...props} {...this.state} />)
 									}/>
 
+								<Route path="/jupytertpi"
+									component={JupyterTPI}
+								/>
+
 								<Route exact path="/"
 											// component={ShixunsHome}
 											render={

public/react/src/modules/tpm/jupyter/index.css

@@ -0,0 +1,49 @@
+.Resizer {
+  background: #000;
+  opacity: 0.2;
+  z-index: 1;
+  -moz-box-sizing: border-box;
+  -webkit-box-sizing: border-box;
+  box-sizing: border-box;
+  -moz-background-clip: padding;
+  -webkit-background-clip: padding;
+  background-clip: padding-box;
+}
+ 
+.Resizer:hover {
+  -webkit-transition: all 2s ease;
+  transition: all 2s ease;
+}
+ 
+.Resizer.horizontal {
+  height: 11px;
+  margin: -5px 0;
+  border-top: 5px solid rgba(255, 255, 255, 0);
+  border-bottom: 5px solid rgba(255, 255, 255, 0);
+  cursor: row-resize;
+  width: 100%;
+}
+ 
+.Resizer.horizontal:hover {
+  border-top: 5px solid rgba(0, 0, 0, 0.5);
+  border-bottom: 5px solid rgba(0, 0, 0, 0.5);
+}
+ 
+.Resizer.vertical {
+  width: 11px;
+  margin: 0 -5px;
+  border-left: 5px solid rgba(255, 255, 255, 0);
+  border-right: 5px solid rgba(255, 255, 255, 0);
+  cursor: col-resize;
+}
+ 
+.Resizer.vertical:hover {
+  border-left: 5px solid rgba(0, 0, 0, 0.5);
+  border-right: 5px solid rgba(0, 0, 0, 0.5);
+}
+.Resizer.disabled {
+  cursor: not-allowed;
+}
+.Resizer.disabled:hover {
+  border-color: transparent;
+}

public/react/src/modules/tpm/jupyter/index.js

@@ -0,0 +1,34 @@
+/*
+ * @Description: jupyter tpi
+ * @Author: tangjiang
+ * @Github: 
+ * @Date: 2019-12-11 08:35:23
+ * @LastEditors: tangjiang
+ * @LastEditTime: 2019-12-11 08:48:20
+ */
+import './index.css';
+import React from 'react';
+import SplitPane from 'react-split-pane';
+// import UserInfo from '../../developer/components/'
+
+function JupyterTPI (props) {
+
+  return (
+    <div className="jupyter_area">
+      <div className="jupyter_header"></div>
+      <div className="jupyter_ctx">
+      <SplitPane split="vertical" minSize={350} maxSize={-350} defaultSize="40%">
+          <div className={'split-pane-left'}>
+            左侧内容
+          </div>
+          <SplitPane split="vertical" defaultSize="100%" allowResize={false}>
+            <div>右侧内容</div>
+            <div />
+          </SplitPane>
+        </SplitPane>
+      </div>
+    </div>
+  );
+}
+
+export default JupyterTPI;