haiwen/seahub
1
0
Fork 0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-20 02:48:51 +00:00
Code Issues Releases Wiki Activity

['search' page] bugfix for 'total', 'prev/next' & etc.

Browse Source
This commit is contained in:
llj
2021-12-17 15:14:51 +08:00
parent beea098437
commit ac45f2b1b1
2 changed files with 23 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
frontend/src/pages/search/main-panel.js
View File

@@ -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>

10
frontend/src/pages/search/search-results.js
View File

@@ -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;