From f8b9f369ec0dee0f7a7910f024f4541283a650b6 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, 19 Dec 2019 16:44:21 +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 --- public/react/public/js/jupyter.js | 11 +++ public/react/src/modules/page/VNC.css | 25 ++++++ .../src/modules/page/component/FloatButton.js | 2 +- public/react/src/modules/tpm/TPMBanner.js | 4 +- public/react/src/modules/tpm/jupyter/index.js | 90 +++++++++++++++---- .../react/src/modules/tpm/jupyter/index.scss | 3 +- public/react/src/redux/actions/actionTypes.js | 3 +- public/react/src/redux/actions/index.js | 6 +- public/react/src/redux/actions/jupyter.js | 8 ++ .../react/src/redux/reducers/commonReducer.js | 8 +- 10 files changed, 134 insertions(+), 26 deletions(-) create mode 100644 public/react/public/js/jupyter.js diff --git a/public/react/public/js/jupyter.js b/public/react/public/js/jupyter.js new file mode 100644 index 000000000..8d76a9a7f --- /dev/null +++ b/public/react/public/js/jupyter.js @@ -0,0 +1,11 @@ +//用于嵌入到jupyter pod中的js +//guange 2019.12.18 + +window.onload=function(){ + require(["base/js/namespace"],function(Jupyter) { + Jupyter.notebook.save_checkpoint(); + }); +} + + + \ No newline at end of file diff --git a/public/react/src/modules/page/VNC.css b/public/react/src/modules/page/VNC.css index cf47d7207..e29335242 100644 --- a/public/react/src/modules/page/VNC.css +++ b/public/react/src/modules/page/VNC.css @@ -14,4 +14,29 @@ color: #fff; left: 13px; user-select: none; +} + +.jupyter_float_button { + background-image: url(./images/float_switch.jpg); + height: 112px; + width: 38px; + position: absolute; + right: 0px; + top: 32%; + cursor: pointer; + left:auto; + z-index: 99999999; +} + +.jupyter_float_button .text { + position: relative; + writing-mode: vertical-rl; + top: 36px; + color: #fff; + left: 13px; + user-select: none; +} + +.newjupyter_float_button{ + right: 257px; } \ No newline at end of file diff --git a/public/react/src/modules/page/component/FloatButton.js b/public/react/src/modules/page/component/FloatButton.js index 4e7f794c6..7cc8288a7 100644 --- a/public/react/src/modules/page/component/FloatButton.js +++ b/public/react/src/modules/page/component/FloatButton.js @@ -1,5 +1,5 @@ import React, { Component } from 'react'; - +import '../VNC.css' const $ = window.$; class FloatButton extends Component { componentDidMount() { diff --git a/public/react/src/modules/tpm/TPMBanner.js b/public/react/src/modules/tpm/TPMBanner.js index a31ca5952..b498c4d22 100644 --- a/public/react/src/modules/tpm/TPMBanner.js +++ b/public/react/src/modules/tpm/TPMBanner.js @@ -851,8 +851,6 @@ class TPMBanner extends Component { - { - this.props.is_jupyter===true?"": @@ -917,7 +915,7 @@ class TPMBanner extends Component { - } + { diff --git a/public/react/src/modules/tpm/jupyter/index.js b/public/react/src/modules/tpm/jupyter/index.js index cd947df85..7425a4732 100644 --- a/public/react/src/modules/tpm/jupyter/index.js +++ b/public/react/src/modules/tpm/jupyter/index.js @@ -9,10 +9,11 @@ import './index.scss'; import React, { useEffect, useState } from 'react'; import SplitPane from 'react-split-pane'; -import { Button, Modal } from 'antd'; +import { Button, Modal,Drawer } from 'antd'; import { connect } from 'react-redux'; +import FloatButton from '../../page/component/FloatButton'; import UserInfo from '../../developer/components/userInfo'; import actions from '../../../redux/actions'; import LeftPane from './leftPane'; @@ -39,7 +40,9 @@ function JupyterTPI (props) { changeLoadingState, changeGetJupyterUrlState, jupyter_identifier, - changeCurrentPage + changeCurrentPage, + changeshowDrawer, + drawervisible, } = props; const {identifier} = params; @@ -107,6 +110,28 @@ function JupyterTPI (props) { }) } + + // 重置环境 + const handleEnvironmentTpi = () => { + Modal.confirm({ + title: '重置环境', + content: ( +

+ 你在本文件中修改的内容将丢失,
+ 是否确定重置环境？ +

+ ), + okText: '确定', + cancelText: '取消', + onOk () { + // console.log('调用重置代码....', myIdentifier); + // if (myIdentifier) { + // syncJupyterCode(myIdentifier, '重置成功'); + // } + } + }) + } + // 退出实训 const handleClickQuitTpi = () => { // console.log(jupyterInfo); @@ -138,6 +163,13 @@ function JupyterTPI (props) { getJupyterTpiDataSet(jupyter_identifier); } + const swtichFirstDrawer = () => { + changeshowDrawer(!drawervisible) + } + + const firstDrawerWidth = ()=>{ + return 260 + }; return (
@@ -151,9 +183,17 @@ function JupyterTPI (props) { + >重置实训 + + +

+
- -
- -
+ + {/*
*/} + {/* */} + {/*
*/} -
+ {"数据集"} + + +

Some contents...

+

Some contents...

+

Some contents...

+
); @@ -199,7 +252,7 @@ const mapStateToProps = (state) => { jupyter_pagination, jupyter_identifier } = state.jupyterReducer; - const { loading } = state.commonReducer; + const { loading ,drawervisible} = state.commonReducer; return { loading, jupyter_info, @@ -208,7 +261,8 @@ const mapStateToProps = (state) => { jupyter_tpi_url_state, total: jupyter_data_set_count, pagination: jupyter_pagination, - jupyter_identifier + jupyter_identifier, + drawervisible, }; } @@ -221,7 +275,9 @@ const mapDispatchToProps = (dispatch) => ({ getJupyterTpiUrl: (identifier) => dispatch(actions.getJupyterTpiUrl(identifier)), saveJupyterTpi: () => dispatch(actions.saveJupyterTpi()), changeLoadingState: (flag) => dispatch(actions.changeLoadingState(flag)), - changeCurrentPage: (current) => dispatch(actions.changeCurrentPage(current)) + changeCurrentPage: (current) => dispatch(actions.changeCurrentPage(current)), + //展开Drawer + changeshowDrawer: (type) => dispatch(actions.changeshowDrawer(type)) }); export default connect( diff --git a/public/react/src/modules/tpm/jupyter/index.scss b/public/react/src/modules/tpm/jupyter/index.scss index 430bb1c6e..5fdfcb02c 100644 --- a/public/react/src/modules/tpm/jupyter/index.scss +++ b/public/react/src/modules/tpm/jupyter/index.scss @@ -9,7 +9,7 @@ -webkit-background-clip: padding; background-clip: padding-box; } - + .Resizer:hover { -webkit-transition: all 2s ease; transition: all 2s ease; @@ -56,6 +56,7 @@ line-height: 60px; background-color: #070F1A; padding-left: 30px; + z-index:999999; .jupyter_title{ display: flex; flex-direction: column; diff --git a/public/react/src/redux/actions/actionTypes.js b/public/react/src/redux/actions/actionTypes.js index 55aa42799..999fb7339 100644 --- a/public/react/src/redux/actions/actionTypes.js +++ b/public/react/src/redux/actions/actionTypes.js @@ -57,7 +57,8 @@ const types = { SAVE_JUPYTER_INFO: 'SAVE_JUPYTER_INFO', // 保存 jupyter 信息 CHANGE_JUPYTER_URL_STATE: 'CHANGE_JUPYTER_URL_STATE', // 获取url返回的状态值 SAVE_JUPYTER_TPI: 'SAVE_JUPYTER_TPI', // 保存 jupyter tpi - CHANGE_JUPYTER_CURRENT_PAGE: 'CHANGE_JUPYTER_CURRENT_PAGE' + CHANGE_JUPYTER_CURRENT_PAGE: 'CHANGE_JUPYTER_CURRENT_PAGE', + CHANGE_SHOW_DRAWER: 'CHANGE_SHOW_DRAWER', } export default types; diff --git a/public/react/src/redux/actions/index.js b/public/react/src/redux/actions/index.js index ad33061ba..40aec251a 100644 --- a/public/react/src/redux/actions/index.js +++ b/public/react/src/redux/actions/index.js @@ -70,7 +70,8 @@ import { syncJupyterCode, changeGetJupyterUrlState, saveJupyterTpi, - changeCurrentPage + changeCurrentPage, + changeshowDrawer, } from './jupyter'; export default { @@ -123,6 +124,7 @@ export default { syncJupyterCode, changeGetJupyterUrlState, saveJupyterTpi, - changeCurrentPage + changeCurrentPage, + changeshowDrawer // isUpdateCodeCtx } \ No newline at end of file diff --git a/public/react/src/redux/actions/jupyter.js b/public/react/src/redux/actions/jupyter.js index 57c12e6d3..73bc30a42 100644 --- a/public/react/src/redux/actions/jupyter.js +++ b/public/react/src/redux/actions/jupyter.js @@ -154,4 +154,12 @@ export const changeCurrentPage = (current) => { type: types.CHANGE_JUPYTER_CURRENT_PAGE, payload: current } +} + +// 改变当前页数 +export const changeshowDrawer = (type) => { + return { + type: types.CHANGE_SHOW_DRAWER, + payload: type + } } \ No newline at end of file diff --git a/public/react/src/redux/reducers/commonReducer.js b/public/react/src/redux/reducers/commonReducer.js index 8a2e927cc..4d38b75ad 100644 --- a/public/react/src/redux/reducers/commonReducer.js +++ b/public/react/src/redux/reducers/commonReducer.js @@ -14,7 +14,8 @@ const initialState = { excuteState: '', // 代码执行状态 submitLoading: false, // 提交按钮状态 publishLoading: false, // 发布 - isMySource: false + isMySource: false, + drawervisible:false } const commonReducer = (state = initialState, action) => { @@ -50,6 +51,11 @@ const commonReducer = (state = initialState, action) => { ...state, isMySource: action.payload } + case types.CHANGE_SHOW_DRAWER: + return { + ...state, + drawervisible: action.payload + } default: return state; }