forked from Gitlink/forgeplus-react
67 lines
1.9 KiB
JavaScript
67 lines
1.9 KiB
JavaScript
import React , { useState } from 'react';
|
|
import { AutoComplete , Pagination } from 'antd';
|
|
import { Banner , Blueline , FlexAJ , Greenback , Redback } from '../../Component/layout';
|
|
import styled from 'styled-components';
|
|
|
|
const Option = AutoComplete.Option;
|
|
const Div = styled.div`{
|
|
padding:18px 30px;
|
|
}`;
|
|
const LIMIT = 15;
|
|
const demoData=[{name:"Python相关",id:1},{name:"Python相关",id:2}];
|
|
export default ()=>{
|
|
const [ searchKey , setSearchKey ] = useState(undefined);
|
|
const [ page , setPage ] = useState(1);
|
|
const [ total , setTotal ] = useState(0);
|
|
|
|
function changeInputUser(){}
|
|
function selectInputUser(){}
|
|
|
|
// 切换分页
|
|
function ChangePage(page){
|
|
setPage(page);
|
|
}
|
|
const source = demoData && demoData.map((item,key)=>{
|
|
return(
|
|
<Option key={key} value={`${item.id}`}>{item.name}</Option>
|
|
)
|
|
})
|
|
return(
|
|
<div>
|
|
<Banner>团队项目管理</Banner>
|
|
<Div>
|
|
<FlexAJ className="actionNav">
|
|
<div>
|
|
<AutoComplete
|
|
dataSource={source}
|
|
value={searchKey}
|
|
style={{ width: 270 }}
|
|
onChange={changeInputUser}
|
|
onSelect={selectInputUser}
|
|
placeholder="搜索项目…"
|
|
/>
|
|
<Blueline className="ml30">+ 添加项目</Blueline>
|
|
</div>
|
|
<span>
|
|
<Greenback>添加所有</Greenback>
|
|
<Redback className="ml20">移除所有</Redback>
|
|
</span>
|
|
</FlexAJ>
|
|
<div className="GSlist">
|
|
<div>
|
|
<span>
|
|
caishi/前端v0.1
|
|
</span>
|
|
<a style={{color:"#F73030"}}>移除</a>
|
|
</div>
|
|
</div>
|
|
{
|
|
total > LIMIT ?
|
|
<div className="edu-txt-center mt30 mb20">
|
|
<Pagination simple defaultCurrent={page} total={total} pageSize={LIMIT} onChange={ChangePage}></Pagination>
|
|
</div>:""
|
|
}
|
|
</Div>
|
|
</div>
|
|
)
|
|
} |