haiwen/seahub
1
0
Fork 0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-12 21:30:39 +00:00
Code Issues Releases Wiki Activity

Table module optimized (#2727)

Browse Source
This commit is contained in:
杨顺强
2018-12-28 11:12:24 +08:00
committed by Daniel Pan
parent f20f418f29
commit 8637abde8d
35 changed files with 294 additions and 362 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/components/common/notification.js
View File

@@ -52,7 +52,7 @@ class Notification extends React.Component {
<div className="outer-caret up-outer-caret"><div className="inner-caret"></div></div>
<div className="sf-popover-hd ovhd">
<h3 className="sf-popover-title title">{gettext('Notifications')}</h3>
<a href="#" onClick={this.onClick} title={gettext('Close')} aria-label={gettext('Close')} className="sf-popover-close js-close sf2-icon-x1 op-icon float-right"></a>
<a href="#" onClick={this.onClick} title={gettext('Close')} aria-label={gettext('Close')} className="sf-popover-close js-close sf2-icon-x1 action-icon float-right"></a>
</div>
<div className="sf-popover-con">
<ul className="notice-list" dangerouslySetInnerHTML={{__html: notice_html}}></ul>

4
frontend/src/components/dialog/share-repo-dialog.js
View File

@@ -30,8 +30,8 @@ class ShareRepoListItem extends React.Component {
let repo = this.props.repo;
return (
<tr>
<td className="select"><input type="checkbox" className="vam" name="repo" onChange={this.onRepoSelect} /></td>
<td className="icon"><img src={siteRoot + 'media/img/lib/48/lib.png'} width="24" alt={gettext('icon')} /></td>
<td className="text-center"><input type="checkbox" className="vam" name="repo" onChange={this.onRepoSelect} /></td>
<td className="text-center"><img src={siteRoot + 'media/img/lib/48/lib.png'} alt={gettext('icon')} /></td>
<td className="name">{gettext(repo.repo_name)}</td>
<td>{moment(repo.last_modified).fromNow()}</td>
<td>

2
frontend/src/components/dialog/share-to-group.js
View File

@@ -50,7 +50,7 @@ class GroupItem extends React.Component {
</td>
<td>
<span
className={`sf2-icon-x3 op-icon ${this.state.isOperationShow ? '' : 'hide'}`}
className={`sf2-icon-x3 action-icon ${this.state.isOperationShow ? '' : 'hide'}`}
onClick={this.deleteShareItem}
title={gettext('Delete')}
>

2
frontend/src/components/dialog/share-to-user.js
View File

@@ -49,7 +49,7 @@ class UserItem extends React.Component {
</td>
<td>
<span
className={`sf2-icon-x3 op-icon ${this.state.isOperationShow ? '' : 'hide'}`}
className={`sf2-icon-x3 action-icon ${this.state.isOperationShow ? '' : 'hide'}`}
onClick={this.deleteShareItem}
title={gettext('Delete')}
>

4
frontend/src/components/dialog/wiki-select-dialog.js
View File

@@ -65,8 +65,8 @@ class WikiSelectDialog extends React.Component {
{this.state.repos.map((repo, index) => {
return (
<tr key={index}>
<td className="select"><input type="radio" className="vam" name="repo" value={repo.repo_id} onChange={this.onChange.bind(this, repo)} /></td>
<td><img src={siteRoot + 'media/img/lib/48/lib.png'} width="24" alt={gettext('icon')} /></td>
<td className="text-center"><input type="radio" className="vam" name="repo" value={repo.repo_id} onChange={this.onChange.bind(this, repo)} /></td>
<td className="text-center"><img src={siteRoot + 'media/img/lib/48/lib.png'} alt={gettext('icon')} /></td>
<td>{gettext(repo.repo_name)}</td>
<td>{moment(repo.last_modified).fromNow()}</td>
</tr>

16
frontend/src/components/dirent-list-view/dirent-list-item.js
View File

@@ -15,6 +15,8 @@ import MoveDirentDialog from '../dialog/move-dirent-dialog';
import CopyDirentDialog from '../dialog/copy-dirent-dialog';
import ShareDialog from '../dialog/share-dialog';
import '../../css/dirent-list-item.css';
const propTypes = {
path: PropTypes.string.isRequired,
repoID: PropTypes.string.isRequired,
@@ -404,14 +406,14 @@ class DirentListItem extends React.Component {
return (
<Fragment>
<tr className={this.state.highlight ? 'tr-highlight' : ''} onMouseEnter={this.onMouseEnter} onMouseOver={this.onMouseOver} onMouseLeave={this.onMouseLeave}>
<td className="select">
<td className="text-center">
<input type="checkbox" className="vam" onChange={this.onItemSelected} checked={dirent.isSelected}/>
</td>
<td className="star" onClick={this.onItemStarred}>
{dirent.starred !== undefined && !dirent.starred && <i className="far fa-star empty"></i>}
<td className="text-center cursor-pointer" onClick={this.onItemStarred}>
{dirent.starred !== undefined && !dirent.starred && <i className="far fa-star star-empty"></i>}
{dirent.starred !== undefined && dirent.starred && <i className="fas fa-star"></i>}
</td>
<td className="icon">
<td className="text-center">
<div className="dir-icon">
<img src={dirent.type === 'dir' ? siteRoot + 'media/img/folder-192.png' : siteRoot + 'media/img/file/192/txt.png'} alt=''></img>
{dirent.is_locked && <img className="locked" src={siteRoot + 'media/img/file-locked-32.png'} alt={gettext('locked')}></img>}
@@ -446,13 +448,13 @@ class DirentListItem extends React.Component {
<div className="operations">
<ul className="operation-group">
<li className="operation-group-item">
<i className="sf2-icon-download" title={gettext('Download')} onClick={this.onItemDownload}></i>
<i className="op-icon sf2-icon-download" title={gettext('Download')} onClick={this.onItemDownload}></i>
</li>
<li className="operation-group-item">
<i className="sf2-icon-share" title={gettext('Share')} onClick={this.onItemShare}></i>
<i className="op-icon sf2-icon-share" title={gettext('Share')} onClick={this.onItemShare}></i>
</li>
<li className="operation-group-item">
<i className="sf2-icon-delete" title={gettext('Delete')} onClick={this.onItemDelete}></i>
<i className="op-icon sf2-icon-delete" title={gettext('Delete')} onClick={this.onItemDelete}></i>
</li>
<li className="operation-group-item">
<i className="sf2-icon-caret-down sf-dropdown-toggle" title={gettext('More Operations')} onClick={this.onItemMenuToggle}></i>

2
frontend/src/components/dirent-list-view/dirent-list-view.js
View File

@@ -106,7 +106,7 @@ class DirentListView extends React.Component {
<table>
<thead>
<tr>
<th width="3%" className="select">
<th width="3%" className="text-center">
<input type="checkbox" className="vam" onChange={this.props.onAllItemSelected} checked={this.props.isAllItemSelected}/>
</th>
<th width="3%">{/*icon */}</th>

4
frontend/src/components/draft-list-view/draft-list-item.js
View File

@@ -58,7 +58,7 @@ class DraftListItem extends React.Component {
localTime = moment(localTime).fromNow();
return (
<tr className={this.state.highlight} onMouseEnter={this.onMouseEnter} onMouseLeave={this.onMouseLeave}>
<td className="icon"><img src={siteRoot + 'media/img/file/192/txt.png'} alt='icon' /></td>
<td className="text-center"><img src={siteRoot + 'media/img/file/192/txt.png'} alt='icon' /></td>
<td className="name" >
<a href={draftUrl} target="_blank">{fileName}</a>
</td>
@@ -72,7 +72,7 @@ class DraftListItem extends React.Component {
}
</td>
<td className="update">{localTime}</td>
<td className="menu-toggle">
<td className="text-center cursor-pointer">
{
this.props.draft.review_status !== 'open' &&
<MenuControl

2
frontend/src/components/logo.js
View File

@@ -19,7 +19,7 @@ class Logo extends React.Component {
<img src={mediaUrl + logoPath} height={logoHeight} width={logoWidth} title={siteTitle} alt="logo" />
</a>
<a
className="sf2-icon-x1 sf-popover-close side-panel-close op-icon d-md-none"
className="sf2-icon-x1 sf-popover-close side-panel-close action-icon d-md-none"
onClick={this.closeSide}
title="Close"
aria-label="Close"

2
frontend/src/components/permission-editor.js
View File

@@ -81,7 +81,7 @@ class PermissionEditor extends React.Component {
<span
title={gettext('Edit')}
style={{fontSize: '0.875rem', marginLeft: '0.5rem'}}
className="fa fa-pencil op-icon"
className="fa fa-pencil action-icon"
onClick={this.onEidtPermission}>
</span>
)}

6
frontend/src/components/review-list-view/review-list-item.js
View File

@@ -103,11 +103,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" style={{width: '26%'}}><a href={reviewUrl} target="_blank">{fileName}</a></td>
<td className="text-center" style={{width: '4%'}}><img src={siteRoot + 'media/img/file/192/txt.png'} alt="icon"/></td>
<td style={{width: '26%'}}><a href={reviewUrl} target="_blank">{fileName}</a></td>
<td className='library' style={{width: '25%'}}>{item.draft_origin_repo_name}</td>
<td className="update" style={{width: '20%'}}>{localTime}</td>
<td className="author" style={{width: '10%'}}><img className="avatar avatar-sm avatar-with-tooltip" id={'tip-' + item.id} src={item.author.avatar_url} alt={item.user_name} /></td>
<td className="author" style={{width: '10%'}}><img className="avatar avatar-sm cursor-pointer" id={'tip-' + item.id} src={item.author.avatar_url} alt={item.user_name} /></td>
<td className="reviewer" style={{width: '15%'}}><Reviewers item={item}/></td>
<Tooltip placement="bottom-end" isOpen={this.state.authorTipOpen} target={'tip-' + item.id} toggle={this.toggle}>
{item.author.user_name}

14
frontend/src/components/shared-repo-list-view/shared-repo-list-item.js
View File

@@ -206,8 +206,8 @@ class SharedRepoListItem extends React.Component {
return (
<Dropdown isOpen={this.state.isItemMenuShow} toggle={this.toggleOperationMenu}>
<DropdownToggle
tag="a"
className="sf2-icon-caret-down item-operation-menu-toggle-icon op-icon"
tag="i"
className="sf-dropdown-toggle sf2-icon-caret-down"
title={gettext('More Operations')}
data-toggle="dropdown"
aria-expanded={this.state.isItemMenuShow}
@@ -239,9 +239,9 @@ class SharedRepoListItem extends React.Component {
// scene two: (share, unshare), (share), (unshare)
operations = this.generatorOperations();
}
const shareOperation = <a href="#" className="sf2-icon-share sf2-x op-icon" title={gettext("Share")} onClick={this.onItemShare}></a>;
const unshareOperation = <a href="#" className="sf2-icon-x3 sf2-x op-icon" title={gettext("Unshare")} onClick={this.onItemUnshare}></a>
const deleteOperation = <a href="#" className="sf2-icon-delete sf2-x op-icon" title={gettext('Delete')} onClick={this.onItemDelete}></a>;
const shareOperation = <a href="#" className="op-icon sf2-icon-share" title={gettext("Share")} onClick={this.onItemShare}></a>;
const unshareOperation = <a href="#" className="op-icon sf2-icon-x3" title={gettext("Unshare")} onClick={this.onItemUnshare}></a>
const deleteOperation = <a href="#" className="op-icon sf2-icon-delete" title={gettext('Delete')} onClick={this.onItemDelete}></a>;
if (this.isDeparementOnwerGroupMember) {
return (
@@ -250,8 +250,8 @@ class SharedRepoListItem extends React.Component {
{deleteOperation}
<Dropdown isOpen={this.state.isItemMenuShow} toggle={this.toggleOperationMenu}>
<DropdownToggle
tag="a"
className="sf2-icon-caret-down item-operation-menu-toggle-icon op-icon"
tag="i"
className="sf-dropdown-toggle sf2-icon-caret-down"
title={gettext('More Operations')}
data-toggle="dropdown"
aria-expanded={this.state.isItemMenuShow}

2
frontend/src/components/toolbar/groups-toolbar.js
View File

@@ -24,7 +24,7 @@ class GroupsToolbar extends React.Component {
<div className="cur-view-toolbar border-left-show">
<div className="operation">
<Button color="btn btn-secondary operation-item" onClick={this.props.toggleAddGroupModal}>
<i className="fas fa-plus-square op-icon"></i>{gettext("New Group")}
<i className="fas fa-plus-square action-icon"></i>{gettext("New Group")}
</Button>
</div>
<span title="Side Nav Menu" onClick={onShowSidePanel}

8
frontend/src/components/toolbar/mutilple-dir-operation-toolbar.js
View File

@@ -96,10 +96,10 @@ class MutipleDirOperationToolbar extends React.Component {
return (
<Fragment>
<div className="operation multiple-dirents-operation">
<button className="btn btn-secondary operation-item op-icon sf2-icon-move" title={gettext('Move')} onClick={this.onMoveToggle}></button>
<button className="btn btn-secondary operation-item op-icon sf2-icon-copy" title={gettext('Copy')} onClick={this.onCopyToggle}></button>
<button className="btn btn-secondary operation-item op-icon sf2-icon-delete" title={gettext('Delete')} onClick={this.props.onItemsDelete}></button>
<button className="btn btn-secondary operation-item op-icon sf2-icon-download" title={gettext('Download')} onClick={this.onItemsDownload}></button>
<button className="btn btn-secondary operation-item action-icon sf2-icon-move" title={gettext('Move')} onClick={this.onMoveToggle}></button>
<button className="btn btn-secondary operation-item action-icon sf2-icon-copy" title={gettext('Copy')} onClick={this.onCopyToggle}></button>
<button className="btn btn-secondary operation-item action-icon sf2-icon-delete" title={gettext('Delete')} onClick={this.props.onItemsDelete}></button>
<button className="btn btn-secondary operation-item action-icon sf2-icon-download" title={gettext('Download')} onClick={this.onItemsDownload}></button>
</div>
{this.state.isMoveDialogShow &&
<MoveDirentDialog

2
frontend/src/components/toolbar/repo-view-toobar.js
View File

@@ -42,7 +42,7 @@ class RepoViewToolbar extends React.Component {
<span className="sf2-icon-menu side-nav-toggle hidden-md-up d-md-none" title="Side Nav Menu" onClick={this.props.onShowSidePanel}></span>
<div className="operation">
<button className="btn btn-secondary operation-item" title={gettext('New Library')} onClick={this.onCreateToggle}>
<i className="fas fa-plus-square op-icon"></i>
<i className="fas fa-plus-square action-icon"></i>
{gettext('New Library')}
</button>
{this.props.libraryType !== 'group' && (

2
frontend/src/components/tree-dir-view/tree-dir-list.js
View File

@@ -36,7 +36,7 @@ class TreeDirList extends React.Component {
let href = siteRoot + 'wikis' + node.path;
return (
<tr className={this.state.highlight ? 'tr-highlight' : ''} onMouseEnter={this.onMouseEnter} onMouseLeave={this.onMouseLeave}>
<td className="icon">
<td className="text-center">
<img src={node.type === 'dir' ? siteRoot + 'media/img/folder-192.png' : siteRoot + 'media/img/file/192/txt.png'} alt='icon'></img>
</td>
<td className="name">

2
frontend/src/components/wiki-list-view/wiki-list-item.js
View File

@@ -150,7 +150,7 @@ class WikiListItem extends Component {
</td>
<td><a href={userProfileURL} target='_blank'>{gettext(wiki.owner_nickname)}</a></td>
<td>{moment(wiki.updated_at).fromNow()}</td>
<td className="menu-toggle">
<td className="text-center cursor-pointer">
{this.state.isShowMenuControl && (
<Dropdown isOpen={this.state.isShowWikiMenu} toggle={this.onMenuToggle}>
<DropdownToggle