diff --git a/public/react/src/App.js b/public/react/src/App.js index 0bea5bbde..7d83757aa 100644 --- a/public/react/src/App.js +++ b/public/react/src/App.js @@ -617,7 +617,11 @@ class App extends Component { {/* jupyter */} { + return () + } + } /> diff --git a/public/react/src/AppConfig.js b/public/react/src/AppConfig.js index 68d00ce3c..fb4b33fae 100644 --- a/public/react/src/AppConfig.js +++ b/public/react/src/AppConfig.js @@ -52,7 +52,7 @@ export function initAxiosInterceptors(props) { //proxy="http://47.96.87.25:48080" proxy="https://pre-newweb.educoder.net" proxy="https://test-newweb.educoder.net" - proxy="https://test-jupyterweb.educoder.net/" + proxy="https://test-jupyterweb.educoder.net" //proxy="http://192.168.2.63:3001" // 在这里使用requestMap控制,避免用户通过双击等操作发出重复的请求; diff --git a/public/react/src/common/components/MyIcon.js b/public/react/src/common/components/MyIcon.js index 7c6f4bb94..aa9f29a19 100644 --- a/public/react/src/common/components/MyIcon.js +++ b/public/react/src/common/components/MyIcon.js @@ -4,12 +4,12 @@ * @Github: * @Date: 2019-12-10 09:03:48 * @LastEditors: tangjiang - * @LastEditTime: 2019-12-10 09:05:41 + * @LastEditTime: 2019-12-12 10:53:47 */ import { Icon } from 'antd'; const MyIcon = Icon.createFromIconfontCN({ - scriptUrl: '//at.alicdn.com/t/font_1535266_ss6796i6f6j.js' + scriptUrl: '//at.alicdn.com/t/font_1535266_i4ilpm93kp.js' }); export default MyIcon; diff --git a/public/react/src/modules/tpm/jupyter/index.js b/public/react/src/modules/tpm/jupyter/index.js index 5386f4cd7..9433a93f9 100644 --- a/public/react/src/modules/tpm/jupyter/index.js +++ b/public/react/src/modules/tpm/jupyter/index.js @@ -4,7 +4,7 @@ * @Github: * @Date: 2019-12-11 08:35:23 * @LastEditors: tangjiang - * @LastEditTime: 2019-12-12 09:26:17 + * @LastEditTime: 2019-12-12 11:26:33 */ import './index.scss'; import React, { useEffect } from 'react'; @@ -15,14 +15,28 @@ import { } from 'react-redux'; import UserInfo from '../../developer/components/userInfo'; import actions from '../../../redux/actions'; +import LeftPane from './leftPane'; function JupyterTPI (props) { + // 获取 identifier 值 + const { + match: { + params = {} + }, + getJupyterTpiDataSet, + getJupyterTpiUrl + } = props; + + const {identifier} = params; + console.log('props: ====>>>>', identifier); + useEffect(() => { // 获取数据集 - + console.log('useEffect: ====>>>>', identifier); + getJupyterTpiDataSet(identifier); // 获取jupyter地址 - }, []); + }, [identifier]); return (
@@ -40,7 +54,7 @@ function JupyterTPI (props) {
- 左侧内容 +
右侧内容
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..1de0062d3 --- /dev/null +++ b/public/react/src/modules/tpm/jupyter/leftPane/index.js @@ -0,0 +1,55 @@ +/* + * @Description: + * @Author: tangjiang + * @Github: + * @Date: 2019-12-12 10:34:03 + * @LastEditors: tangjiang + * @LastEditTime: 2019-12-12 11:22:11 + */ +import './index.scss'; +import React from 'react'; +import {Icon, Empty} from 'antd'; +import MyIcon from '../../../../common/components/MyIcon'; + +function LeftPane (props) { + + // 获取数据集 + const { dataSets = [] } = props; + + // 渲染数据集 + const renderList = () => { + // 空数据 + if (dataSets.length === 0) { + return
+ +
+ } else { + // 渲染列表 + const oList = dataSets.map((item, i) => { + return ( +
  • + + {item.title} +
  • + ); + }); + return ( +
      + { oList } +
    + ); + + } + } + + return ( +
    +

    + 数据集 +

    + {renderList()} +
    + ) +} + +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..d023403e6 --- /dev/null +++ b/public/react/src/modules/tpm/jupyter/leftPane/index.scss @@ -0,0 +1,50 @@ +.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); + } + + .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; + .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