forked from Gitlink/forgeplus-react
124 lines
3.5 KiB
JavaScript
124 lines
3.5 KiB
JavaScript
import React from 'react';
|
||
import { Button } from 'antd';
|
||
import Search from '../Component/Search';
|
||
import Sort from '../Component/Sort';
|
||
import ListCount from '../Component/ListCount';
|
||
import Box from './Box';
|
||
import './Index.scss';
|
||
import styled from 'styled-components';
|
||
|
||
import { Menu } from 'antd';
|
||
|
||
const Span = styled.span`{
|
||
color:#888;
|
||
font-size:12px;
|
||
margin-right:10px;
|
||
}`
|
||
const Align = styled.div`{
|
||
display:flex;
|
||
aligin:center;
|
||
}`
|
||
const ListName = styled.div`{
|
||
font-size:14px;
|
||
color:#333;
|
||
margin-bottom:8px;
|
||
height:18px;
|
||
line-height:18px;
|
||
}`;
|
||
const ColorListName = styled.div`{
|
||
color:#5091FF;
|
||
font-size:14px;
|
||
margin-bottom:8px;
|
||
height:18px;
|
||
line-height:18px;
|
||
}`
|
||
const Img = styled.img`{
|
||
border-radius:50%;
|
||
width:45px;
|
||
height:45px;
|
||
margin-right:12px;
|
||
}`
|
||
export default (()=>{
|
||
function onSearch(value){
|
||
|
||
}
|
||
const menu=(
|
||
<Menu>
|
||
<Menu.Item key="updated_on">更新时间排序</Menu.Item>
|
||
<Menu.Item key="created_on">项目数排序</Menu.Item>
|
||
</Menu>
|
||
)
|
||
const menu_new=(
|
||
<Menu>
|
||
<Menu.Item key="updated_on">新建托管项目</Menu.Item>
|
||
<Menu.Item key="created_on">新建镜像项目</Menu.Item>
|
||
</Menu>
|
||
)
|
||
const leftList = (
|
||
<div className="team_project">
|
||
<p className="t_p_title">
|
||
<span className="flex1">
|
||
<span className="name">react项目react项目react项目react项目</span>
|
||
<i className="iconfont icon-banbenku font-20 color-green" />
|
||
<i className="iconfont icon-jingxiang font-18 color-green" />
|
||
<i className="iconfont icon-fork font-18 color-orange" />
|
||
</span>
|
||
<ListCount fork={1} parise={0}/>
|
||
</p>
|
||
<div className="desc">
|
||
用于构建用户界面的 JavaScript 库
|
||
</div>
|
||
<div className="infos">
|
||
<span className="font-12 color-grey-8">更新于1天前</span>
|
||
</div>
|
||
</div>
|
||
)
|
||
return(
|
||
<div className="list">
|
||
<div className="list-l">
|
||
<div className="head">
|
||
<div style={{width:"370px"}}>
|
||
<Search placeholder="输入仓库名称进行搜索" onSearch={onSearch}/>
|
||
</div>
|
||
<p>
|
||
<Sort menu={menu_new}>
|
||
<a className="addBtn mr30">+ 新建项目</a>
|
||
</Sort>
|
||
<Sort menu={menu}>
|
||
<a className="color-blue">排序<i className="iconfont icon-sanjiaoxing-down ml3 font-14"></i></a>
|
||
</Sort>
|
||
</p>
|
||
</div>
|
||
<div className="team">
|
||
{leftList}
|
||
</div>
|
||
</div>
|
||
<div className="list-r">
|
||
<Box name="组织成员" count={8}>
|
||
<div className="teammembers">
|
||
<Img src="https://dss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1990625098,3468619056&fm=111&gp=0.jpg" alt="" className="m-img"/>
|
||
<div>
|
||
<ListName>陈Professer</ListName>
|
||
<Align><i className="iconfont icon-shijian color-green mr3 font-13"></i><Span>加入时间:2020-04-28</Span></Align>
|
||
</div>
|
||
</div>
|
||
</Box>
|
||
<Box
|
||
name="组织团队"
|
||
count={3}
|
||
bottom={<Button type={'primary'} to={``}>新建团队</Button>}
|
||
>
|
||
<div className="teammembers">
|
||
<div>
|
||
<ColorListName>陈Professer</ColorListName>
|
||
<Align>
|
||
<Span>2名成员</Span>
|
||
<Span>1个仓库</Span>
|
||
</Align>
|
||
</div>
|
||
</div>
|
||
</Box>
|
||
</div>
|
||
</div>
|
||
)
|
||
}) |