1
0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-01 07:01:12 +00:00

Merge pull request #3606 from haiwen/modify_choose_style

modify choose style
This commit is contained in:
Daniel Pan
2019-06-03 18:16:35 +08:00
committed by GitHub
3 changed files with 51 additions and 29 deletions

View File

@@ -120,7 +120,8 @@ class RepoListItem extends React.Component {
});
}
onToggleClick = () => {
onToggleClick = (e) => {
e.stopPropagation();
this.setState({isShowChildren: !this.state.isShowChildren});
}
@@ -150,12 +151,18 @@ class RepoListItem extends React.Component {
}
return (
<li className="file-chooser-item">
<span className={`item-toggle fa ${this.state.isShowChildren ? 'fa-caret-down' : 'fa-caret-right'}`} onClick={this.onToggleClick}></span>
<span className={`item-info ${repoActive ? 'item-active' : ''}`} onClick={this.onRepoItemClick}>
<span className="icon far fa-folder"></span>
<span className="name user-select-none ellipsis">{this.props.repo.repo_name}</span>
</span>
<li>
<div className={`${repoActive ? 'item-active' : ''} item-info`} onClick={this.onRepoItemClick}>
<div className="item-text">
<span className="name user-select-none ellipsis">{this.props.repo.repo_name}</span>
</div>
<div className="item-left-icon">
<span className={`item-toggle icon fa ${this.state.isShowChildren ? 'fa-caret-down' : 'fa-caret-right'}`} onClick={this.onToggleClick}></span>
<i className="tree-node-icon">
<span className="icon far fa-folder tree-node-icon"></span>
</i>
</div>
</div>
{this.state.isShowChildren && (
<TreeListView
repo={this.props.repo}

View File

@@ -89,14 +89,20 @@ class TreeViewItem extends React.Component {
return(
<div className="file-chooser-item">
<div className={`${node.path === '/'? 'hide': ''}`}>
<div className={`${(isCurrentRepo && isCurrentPath) ? 'item-active' : ''} item-info`} onClick={this.onItemClick}>
<div className="item-text">
<span className="name user-select-none ellipsis">{node.object && node.object.name}</span>
</div>
<div className="item-left-icon">
{
node.object.type !== 'file' &&
<span className={`item-toggle fa ${node.isExpanded ? 'fa-caret-down' : 'fa-caret-right'}`} onClick={this.onToggleClick}></span>
<span className={`icon item-toggle fa ${node.isExpanded ? 'fa-caret-down' : 'fa-caret-right'}`} onClick={this.onToggleClick}></span>
}
<span className={`item-info ${(isCurrentRepo && isCurrentPath) ? 'item-active' : ''}`} onClick={this.onItemClick}>
<span className={`icon far ${node.object.type === 'dir' ? 'fa-folder' : 'fa-file'}`}></span>
<span className="name user-select-none ellipsis">{node.object && node.object.name}</span>
</span>
<i className="tree-node-icon">
<span className={`icon far ${node.object.type === 'dir' ? 'fa-folder' : 'fa-file'}`}></span>
</i>
</div>
</div>
</div>
{node.isExpanded && this.renderChildren()}
</div>