|
|
|
@ -9,7 +9,7 @@
|
|
|
|
|
import './index.scss';
|
|
|
|
|
import React, { useEffect, useState } from 'react';
|
|
|
|
|
import SplitPane from 'react-split-pane';
|
|
|
|
|
import { Button, Modal,Drawer } from 'antd';
|
|
|
|
|
import { Button, Modal,Drawer ,Pagination,Empty,Tooltip,Icon,message} from 'antd';
|
|
|
|
|
import {
|
|
|
|
|
connect
|
|
|
|
|
} from 'react-redux';
|
|
|
|
@ -18,6 +18,25 @@ import UserInfo from '../../developer/components/userInfo';
|
|
|
|
|
import actions from '../../../redux/actions';
|
|
|
|
|
import LeftPane from './leftPane';
|
|
|
|
|
import RightPane from './rightPane';
|
|
|
|
|
import MyIcon from "../../../common/components/MyIcon";
|
|
|
|
|
function jsCopy(s) {
|
|
|
|
|
var copyEle = document.getElementById(s);
|
|
|
|
|
const range = document.createRange(); // 创造range
|
|
|
|
|
window.getSelection().removeAllRanges(); //清除页面中已有的selection
|
|
|
|
|
range.selectNode(copyEle); // 选中需要复制的节点
|
|
|
|
|
window.getSelection().addRange(range); // 执行选中元素
|
|
|
|
|
const copyStatus = document.execCommand("Copy"); // 执行copy操作
|
|
|
|
|
// 对成功与否定进行提示
|
|
|
|
|
copyStatuss(copyStatus)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function copyStatuss(copyStatus){
|
|
|
|
|
if (copyStatus) {
|
|
|
|
|
message.success('复制成功');
|
|
|
|
|
} else {
|
|
|
|
|
message.error('复制失败');
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
function JupyterTPI (props) {
|
|
|
|
|
|
|
|
|
|
// 获取 identifier 值
|
|
|
|
@ -45,11 +64,17 @@ function JupyterTPI (props) {
|
|
|
|
|
drawervisible,
|
|
|
|
|
} = props;
|
|
|
|
|
|
|
|
|
|
const emptyCtx = (
|
|
|
|
|
<div className="jupyter_empty">
|
|
|
|
|
<Empty />
|
|
|
|
|
</div>
|
|
|
|
|
);
|
|
|
|
|
const {identifier} = params;
|
|
|
|
|
const [userInfo, setUserInfo] = useState({});
|
|
|
|
|
const [jupyterInfo, setJupyterInfo] = useState({});
|
|
|
|
|
const [updateTip, setUpdateTip] = useState(true);
|
|
|
|
|
const [myIdentifier, setMyIdentifier] = useState('');
|
|
|
|
|
const [renderCtx, setRenderCtx] = useState(() => (emptyCtx));
|
|
|
|
|
useEffect(() => {
|
|
|
|
|
/* 先调用 jupyter的 TPI 接口,
|
|
|
|
|
* 获取 用户信息,
|
|
|
|
@ -170,6 +195,45 @@ function JupyterTPI (props) {
|
|
|
|
|
const firstDrawerWidth = ()=>{
|
|
|
|
|
return 260
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
// 分页处理
|
|
|
|
|
const handleChangePage = (page) => {
|
|
|
|
|
// console.log(page, pageSize);
|
|
|
|
|
handlePageChange(page);
|
|
|
|
|
}
|
|
|
|
|
// const listCtx = ;
|
|
|
|
|
useEffect(() => {
|
|
|
|
|
if (dataSets.length > 0) {
|
|
|
|
|
console.log('数据集的个数: ', dataSets.length);
|
|
|
|
|
const oList = dataSets.map((item, i) => {
|
|
|
|
|
return (
|
|
|
|
|
<li className="jupyter_item" key={`key_${i}`}>
|
|
|
|
|
<Tooltip
|
|
|
|
|
placement="right"
|
|
|
|
|
// title={item.file_path}
|
|
|
|
|
mouseLeaveDelay={0.3}
|
|
|
|
|
>
|
|
|
|
|
<Icon type="file-text" className="jupyter_icon"/>
|
|
|
|
|
<span className="jupyter_name ml10">{item.title}</span>
|
|
|
|
|
<a className={"fr color-blue"}
|
|
|
|
|
onClick={() => {
|
|
|
|
|
jsCopy("file_path"+i)
|
|
|
|
|
}}>复制地址</a>
|
|
|
|
|
<input id={"file_path"+i} className={"file_path_input"} value={item.file_path}/>
|
|
|
|
|
</Tooltip>
|
|
|
|
|
</li>
|
|
|
|
|
);
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
const oUl = (
|
|
|
|
|
<ul className="jupyter_data_list">
|
|
|
|
|
{ oList }
|
|
|
|
|
</ul>
|
|
|
|
|
);
|
|
|
|
|
|
|
|
|
|
setRenderCtx(oUl);
|
|
|
|
|
}
|
|
|
|
|
}, [props]);
|
|
|
|
|
return (
|
|
|
|
|
<div className="jupyter_area">
|
|
|
|
|
<div className="jupyter_header">
|
|
|
|
@ -232,10 +296,27 @@ function JupyterTPI (props) {
|
|
|
|
|
mask={false}
|
|
|
|
|
// onClose={this.onClose}
|
|
|
|
|
visible={drawervisible}
|
|
|
|
|
className={"RightPaneDrawer"}
|
|
|
|
|
>
|
|
|
|
|
<p>Some contents...</p>
|
|
|
|
|
<p>Some contents...</p>
|
|
|
|
|
<p>Some contents...</p>
|
|
|
|
|
<p className={"RightPaneDrawertop"}></p>
|
|
|
|
|
<div className="jupyter_data_sets_area newjupyter_data_sets_area">
|
|
|
|
|
<h2 className="jupyter_h2_title">
|
|
|
|
|
{/*<MyIcon type="iconwenti" className="jupyter_data_icon"/>*/}
|
|
|
|
|
<i className={"iconfont icon-base"}></i>数据集
|
|
|
|
|
{/* <span className="iconfont icon-java jupyter_data_icon"></span>数据集 */}
|
|
|
|
|
</h2>
|
|
|
|
|
{ renderCtx }
|
|
|
|
|
<div className='jupyter_pagination'>
|
|
|
|
|
{total<20?"":<Pagination
|
|
|
|
|
simple
|
|
|
|
|
current={pagination.page}
|
|
|
|
|
pageSize={pagination.limit}
|
|
|
|
|
total={total}
|
|
|
|
|
onChange={handleChangePage}
|
|
|
|
|
/>}
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</Drawer>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|