forked from Gitlink/forgeplus-react
74 lines
3.1 KiB
JavaScript
74 lines
3.1 KiB
JavaScript
import React, { Component } from 'react';
|
||
import { Tooltip } from 'antd';
|
||
import { getImageUrl } from 'educoder';
|
||
import { Link } from 'react-router-dom';
|
||
import '../css/index.scss'
|
||
import './list.css';
|
||
import img_parise from '../Images/parise.png';
|
||
|
||
class IndexItem extends Component {
|
||
TurnToDetail = (login, url) => {
|
||
this.props.history.push({
|
||
pathname: url,
|
||
state: login
|
||
})
|
||
}
|
||
render() {
|
||
const { projects } = this.props;
|
||
const renderList = (
|
||
projects && projects.length > 0 ? projects.map((item, key) => {
|
||
return (
|
||
<div className="p-r-Item" key={key}>
|
||
<Link to={`/users/${item.author.login}`} className="show-user-link">
|
||
<img className="p-r-photo" alt="" src={getImageUrl(`images/${item.author && item.author.image_url}`)} ></img>
|
||
</Link>
|
||
<div className="p-r-Infos">
|
||
<div className="p-r-name">
|
||
<Link to={`/projects/${item.id}/coders`} className="hide-1 color-grey-3 font-18 task-hide " style={{ whiteSpace: "wrap", display: 'flex', width: 400 }}>
|
||
{item.author.name}/{item.name}
|
||
{
|
||
item.forked_from_project_id ?
|
||
<span className="ml5">
|
||
<i className="iconfont icon-fork font-18 color-orange" />
|
||
</span>
|
||
: ""
|
||
}
|
||
{
|
||
item.type && item.type !==0 ?
|
||
item.type ==2?
|
||
<Tooltip title="该项目是一个镜像" className="ml5">
|
||
<i className="iconfont icon-banbenku font-18 color-green" />
|
||
</Tooltip>:
|
||
<span className="ml5">
|
||
<i className="iconfont icon-jingxiang font-18 color-green" />
|
||
</span>:""
|
||
}
|
||
</Link>
|
||
<span className="p-r-tags">
|
||
<span className="pariseTag"><img src={img_parise} alt="" className="pariseImg" />赞 ({item.praises_count})</span>
|
||
<span><i className="iconfont icon-fork mr3 font-16" style={{ color: "#1B8FFF" }} />fork ({item.forked_count})</span>
|
||
</span>
|
||
</div>
|
||
<p className="break_word task-hide-2 mt10" style={{ maxHeight: "44px",lineHeight:"22px" }}>{item.description}</p>
|
||
|
||
<div className="p-r-about">
|
||
<span className="p-r-detail">
|
||
<span><label>浏览量：</label>{item.visits}</span>
|
||
{item.category && item.category.id && <span><label>项目类别：</label>{item.category.name}</span>}
|
||
{item.last_update_time ? <span ><label>更新于</label>{item.time_ago}</span> : ""}
|
||
{item.language && item.language.id ? <span className="color-grey-3">{item.language.name}</span> : ""}
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
)
|
||
}) : ""
|
||
)
|
||
return (
|
||
<div className="project-list">
|
||
{renderList}
|
||
</div>
|
||
)
|
||
}
|
||
}
|
||
export default IndexItem; |