1
0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-08 10:22:46 +00:00

show reviewer avatar (#2514)

This commit is contained in:
C_Q
2018-11-14 11:02:07 +08:00
committed by Daniel Pan
parent 360bd739ce
commit 6f690e6ba3
6 changed files with 104 additions and 49 deletions

View File

@@ -9,6 +9,16 @@ const propTypes = {
item: PropTypes.object.isRequired,
};
function Reviewers(props) {
return (
<div>
{props.reviewers.map((item, index) => (
<img key={index} className="avatar avatar-sm" alt={item.username} src={item.avatar_url} />
))}
</div>
);
}
class ReviewListItem extends React.Component {
constructor(props) {
@@ -54,10 +64,11 @@ class ReviewListItem extends React.Component {
return (
<tr className={this.state.highlight} onMouseEnter={this.onMouseEnter} onMouseLeave={this.onMouseLeave}>
<td className="icon" style={{width: '4%'}}><img src={siteRoot + 'media/img/file/192/txt.png'} alt="icon"/></td>
<td className="name a-simulate" style={{width: '46%'}} onClick={this.onReviewsClick}>{fileName}</td>
<td className='library'>{item.draft_origin_repo_name}</td>
<td className="name a-simulate" style={{width: '26%'}} onClick={this.onReviewsClick}>{fileName}</td>
<td className='library' style={{width: '25%'}}>{item.draft_origin_repo_name}</td>
<td className="update" style={{width: '20%'}}>{localTime}</td>
<td className="menu-toggle"></td>
<td className="author" style={{width: '10%'}}><img className="avatar avatar-sm" src={item.author.avatar_url} /></td>
<td className="reviewer" style={{width: '15%'}}><Reviewers reviewers={item.reviewers}/></td>
</tr>
);
}

View File

@@ -14,30 +14,23 @@ class ReviewListView extends React.Component {
constructor(props) {
super(props);
this.toggle = this.toggle.bind(this);
this.state = {
activeTab: 'open'
};
}
toggle(tab) {
if (this.state.activeTab !== tab) {
this.setState({
activeTab: tab
});
if (this.props.activeTab !== tab) {
this.props.getReviewList(tab)
}
}
render() {
let items = this.props.itemsList;
let { activeTab } = this.state;
return (
<div className="table-container">
<Nav tabs>
<NavItem>
<NavLink
className={classnames({ active: this.state.activeTab === 'open' })}
className={classnames({ active: this.props.activeTab === 'open' })}
onClick={() => { this.toggle('open');}}
>
{gettext('Open')}
@@ -45,7 +38,7 @@ class ReviewListView extends React.Component {
</NavItem>
<NavItem>
<NavLink
className={classnames({ active: this.state.activeTab === 'finished' })}
className={classnames({ active: this.props.activeTab === 'finished' })}
onClick={() => { this.toggle('finished');}}
>
{gettext('Published')}
@@ -53,7 +46,7 @@ class ReviewListView extends React.Component {
</NavItem>
<NavItem>
<NavLink
className={classnames({ active: this.state.activeTab === 'closed' })}
className={classnames({ active: this.props.activeTab === 'closed' })}
onClick={() => { this.toggle('closed');}}
>
{gettext('Closed')}
@@ -65,22 +58,21 @@ class ReviewListView extends React.Component {
<tr>
<th style={{width: '4%'}}>{/*img*/}</th>
<th style={{width: '26%'}}>{gettext('Name')}</th>
<th style={{width: '20%'}}>{gettext('Library')}</th>
<th style={{width: '25%'}}>{gettext('Library')}</th>
<th style={{width: '20%'}}>{gettext('Last Update')}</th>
<th style={{width: '10%'}}></th>
<th style={{width: '10%'}}>{gettext('Author')}</th>
<th style={{width: '15%'}}>{gettext('Reviewers')}</th>
</tr>
</thead>
<tbody>
{ items && items.map((item) => {
if(item.status === activeTab) {
return (
<ReviewListItem
key={item.id}
item={item}
isItemFreezed={this.props.isItemFreezed}
/>
);
}
return (
<ReviewListItem
key={item.id}
item={item}
isItemFreezed={this.props.isItemFreezed}
/>
);
})}
</tbody>
</table>