|
|
import React , { Component } from 'react';
|
|
|
import { getImageUrl } from 'educoder';
|
|
|
import { Link } from 'react-router-dom';
|
|
|
import '../css/index.css'
|
|
|
import './list.css';
|
|
|
import img_parise from '../Images/parise.png';
|
|
|
class IndexItem extends Component{
|
|
|
// constructor(props){
|
|
|
// super(props);
|
|
|
// }
|
|
|
|
|
|
TurnToDetail=(login,url)=>{
|
|
|
this.props.history.push({
|
|
|
pathname:url,
|
|
|
state:login
|
|
|
})
|
|
|
}
|
|
|
render(){
|
|
|
const { projects } = this.props;
|
|
|
// item.author.login
|
|
|
const renderList = (
|
|
|
projects && projects.length >0 ? projects.map((item,key)=>{
|
|
|
return(
|
|
|
<div className="p-r-Item">
|
|
|
<img className="p-r-photo" alt="" src={getImageUrl(`images/${item.author && item.author.image_url}`)} ></img>
|
|
|
<div className="p-r-Infos">
|
|
|
<div className="p-r-name">
|
|
|
<a onClick={()=>this.TurnToDetail(`${item.author && item.author.login}`,`/projects/${item.identifier}/coder`)} className="hide-1 font-16 color-grey-3" style={{whiteSpace:"wrap"}}>{item.name}</a>
|
|
|
</div>
|
|
|
<div className="p-r-content">
|
|
|
<p className="break_word task-hide flex1" style={{maxHeight:"40px"}}>{item.description}</p>
|
|
|
<span className="p-r-tags">
|
|
|
{/* { item.forked_count ? <span><label>Fork</label><span>{ item.forked_count}</span></span>:"" } */}
|
|
|
<span className="pariseTag"><img src={img_parise} alt="" className="pariseImg"/>点赞 ({ item.praises_count })</span>
|
|
|
{ item.language && item.language.id ? <span><label>{ item.language.name }</label></span>:"" }
|
|
|
</span>
|
|
|
</div>
|
|
|
<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> : "" }
|
|
|
</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
)
|
|
|
}):""
|
|
|
)
|
|
|
return(
|
|
|
<div className="project-list">
|
|
|
{ renderList }
|
|
|
</div>
|
|
|
)
|
|
|
}
|
|
|
}
|
|
|
export default IndexItem; |
