You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
88 lines
2.1 KiB
88 lines
2.1 KiB
/*
|
|
* @Description:
|
|
* @Author: tangjiang
|
|
* @Github:
|
|
* @Date: 2019-12-12 10:34:03
|
|
* @LastEditors: tangjiang
|
|
* @LastEditTime: 2019-12-13 21:19:30
|
|
*/
|
|
import './index.scss';
|
|
import React, { useState, useEffect } from 'react';
|
|
import {Icon, Empty, Pagination, Tooltip } from 'antd';
|
|
import MyIcon from '../../../../common/components/MyIcon';
|
|
|
|
function LeftPane (props) {
|
|
|
|
// 获取数据集
|
|
const {
|
|
dataSets = [],
|
|
total,
|
|
pagination,
|
|
onPageChange
|
|
} = props;
|
|
|
|
const emptyCtx = (
|
|
<div className="jupyter_empty">
|
|
<Empty />
|
|
</div>
|
|
);
|
|
|
|
// const listCtx = ;
|
|
const [renderCtx, setRenderCtx] = useState(() => (emptyCtx));
|
|
|
|
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">{item.title}</span>
|
|
</Tooltip>
|
|
</li>
|
|
);
|
|
});
|
|
|
|
const oUl = (
|
|
<ul className="jupyter_data_list">
|
|
{ oList }
|
|
</ul>
|
|
);
|
|
|
|
setRenderCtx(oUl);
|
|
}
|
|
}, [props]);
|
|
|
|
// 分页处理
|
|
const handleChangePage = (page) => {
|
|
// console.log(page, pageSize);
|
|
// setCurrent(page);
|
|
onPageChange && onPageChange(page);
|
|
}
|
|
return (
|
|
<div className="jupyter_data_sets_area">
|
|
<h2 className="jupyter_h2_title">
|
|
<MyIcon type="iconwenti" className="jupyter_data_icon"/> 数据集
|
|
{/* <span className="iconfont icon-java jupyter_data_icon"></span>数据集 */}
|
|
</h2>
|
|
{ renderCtx }
|
|
<div className='jupyter_pagination' style={{ display: dataSets > 0 ? 'flex' : 'none'}}>
|
|
<Pagination
|
|
simple
|
|
current={pagination.page}
|
|
pageSize={pagination.limit}
|
|
total={total}
|
|
onChange={handleChangePage}
|
|
/>
|
|
</div>
|
|
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default LeftPane; |