mirror of
https://github.com/haiwen/seahub.git
synced 2025-09-20 19:08:21 +00:00
['search' page] bugfix for 'total', 'prev/next' & etc.
This commit is contained in:
@@ -1,5 +1,4 @@
|
||||
import React from 'react';
|
||||
import moment from 'moment';
|
||||
import { gettext } from '../../utils/constants';
|
||||
import { seafileAPI } from '../../utils/seafile-api';
|
||||
import SearchResults from './search-results';
|
||||
@@ -52,17 +51,19 @@ class SearchViewPanel extends React.Component {
|
||||
});
|
||||
const stateHistory = _.cloneDeep(this.state);
|
||||
seafileAPI.searchFiles(params, null).then(res => {
|
||||
const { results, has_more, total } = res.data;
|
||||
this.setState({
|
||||
isLoading: false,
|
||||
isResultGot: true,
|
||||
resultItems: res.data.results,
|
||||
hasMore: res.data.has_more,
|
||||
resultItems: results,
|
||||
hasMore: has_more,
|
||||
total: total,
|
||||
page: params.page,
|
||||
isShowSearchFilter: true,
|
||||
});
|
||||
this.stateHistory = stateHistory;
|
||||
this.stateHistory.resultItems = res.data.results;
|
||||
this.stateHistory.hasMore = res.data.has_more;
|
||||
this.stateHistory.resultItems = results;
|
||||
this.stateHistory.hasMore = has_more;
|
||||
this.stateHistory.page = params.page;
|
||||
}).catch((error) => {
|
||||
this.setState({ isLoading: false });
|
||||
@@ -145,7 +146,8 @@ class SearchViewPanel extends React.Component {
|
||||
});
|
||||
}
|
||||
|
||||
handlePrevious = () => {
|
||||
handlePrevious = (e) => {
|
||||
e.preventDefault();
|
||||
if (this.stateHistory && this.state.page > 1) {
|
||||
this.setState(this.stateHistory,() => {
|
||||
const params = this.handleSearchParams(this.state.page - 1);
|
||||
@@ -156,7 +158,8 @@ class SearchViewPanel extends React.Component {
|
||||
}
|
||||
};
|
||||
|
||||
handleNext = () => {
|
||||
handleNext = (e) => {
|
||||
e.preventDefault();
|
||||
if (this.stateHistory && this.state.hasMore) {
|
||||
this.setState(this.stateHistory,() => {
|
||||
const params = this.handleSearchParams(this.state.page + 1);
|
||||
@@ -321,12 +324,17 @@ class SearchViewPanel extends React.Component {
|
||||
/>
|
||||
</div>
|
||||
{this.state.isLoading && <Loading/>}
|
||||
{(!this.state.isLoading && this.state.isResultGot) && <SearchResults resultItems={this.state.resultItems}/>}
|
||||
{(!this.state.isLoading && this.state.isResultGot) &&
|
||||
<SearchResults
|
||||
resultItems={this.state.resultItems}
|
||||
total={this.state.total}
|
||||
/>
|
||||
}
|
||||
{(!this.state.isLoading && this.state.isResultGot) &&
|
||||
<div className="paginator">
|
||||
{this.state.page !== 1 && <a href="#" onClick={() => this.handlePrevious()}>{gettext('Previous')}</a>}
|
||||
{this.state.page !== 1 && <a href="#" onClick={this.handlePrevious}>{gettext('Previous')}</a>}
|
||||
{(this.state.page !== 1 && this.state.hasMore) && <span> | </span>}
|
||||
{this.state.hasMore && <a href="#" onClick={() => this.handleNext()}>{gettext('Next')}</a>}
|
||||
{this.state.hasMore && <a href="#" onClick={this.handleNext}>{gettext('Next')}</a>}
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
|
@@ -39,10 +39,10 @@ class ResultsItem extends React.Component {
|
||||
<img className={linkContent ? 'item-img' : 'lib-item-img'} src={fileIconUrl} alt=""/>
|
||||
<div className="item-content">
|
||||
<div className="item-name ellipsis">
|
||||
<a href={this.handlerFileURL(item)} target="_blank" title={item.name}>{item.name}</a>
|
||||
<a href={this.handlerFileURL(item)} target="_blank" title={item.name} rel="noreferrer">{item.name}</a>
|
||||
</div>
|
||||
<div className="item-link ellipsis">
|
||||
<a href={this.handlerParentDirURL(item)} target="_blank" >{item.repo_name}{this.handlerParentDirPath(item)}</a>
|
||||
<a href={this.handlerParentDirURL(item)} target="_blank" rel="noreferrer" >{item.repo_name}{this.handlerParentDirPath(item)}</a>
|
||||
</div>
|
||||
<div className="item-link ellipsis">
|
||||
{Utils.bytesToSize(item.size) + ' ' + moment(item.last_modified * 1000).format('YYYY-MM-DD')}
|
||||
@@ -67,12 +67,11 @@ class SearchResults extends React.Component {
|
||||
}
|
||||
|
||||
render() {
|
||||
const { resultItems } = this.props;
|
||||
const total = resultItems.length;
|
||||
const { resultItems, total } = this.props;
|
||||
return (
|
||||
<div className="search-result-container position-static">
|
||||
<p className="tip">{total > 0 ? (total + ' ' + (total === 1 ? gettext('result') : gettext('results'))) : gettext('No result')}</p>
|
||||
<ul className="search-result-list">
|
||||
<p className="tip">{total > 0 ? (total + ' ' + (total === 1 ? gettext('result') : gettext('results'))) : gettext('No result')}</p>
|
||||
{resultItems.map((item, index) => {
|
||||
return <ResultsItem key={index} item={item}/>;
|
||||
})}
|
||||
@@ -84,6 +83,7 @@ class SearchResults extends React.Component {
|
||||
|
||||
const searchResultsPropTypes = {
|
||||
resultItems: PropTypes.array.isRequired,
|
||||
total: PropTypes.number.isRequired
|
||||
};
|
||||
|
||||
SearchResults.propTypes = searchResultsPropTypes;
|
||||
|
Reference in New Issue
Block a user