ascribe/onion
1
0
Fork 0
mirror of https://github.com/ascribe/onion.git synced 2024-12-22 17:33:14 +01:00
Code Issues Releases Wiki Activity

resolve merge conflict

Browse Source
This commit is contained in:
Tim Daubenschütz 2015-05-22 18:43:15 +02:00
commit ffd1326366
4 changed files with 51 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
js/components/pagination.js → js/components/ascribe_pagination/pagination.js
View File

@ -5,28 +5,26 @@ import PaginationButton from './pagination_button';
let Pagination = React.createClass({
propTypes: {
goToPage: React.PropTypes.func.isRequired,
currentPage: React.PropTypes.oneOfType([
React.PropTypes.string,
React.PropTypes.number
]).isRequired
currentPage: React.PropTypes.number.isRequired,
totalPages: React.PropTypes.number.isRequired
//itemListCount: React.PropTypes.number.isRequired
},
render() {
let currentPage = parseInt(this.props.currentPage, 10);
return(
<nav>
<ul className="pager">
<PaginationButton
direction='previous'
goToPage={this.props.goToPage}
currentPage={currentPage}>
currentPage={this.props.currentPage}
totalPages={this.props.totalPages}>
</PaginationButton>
<PaginationButton
direction='next'
goToPage={this.props.goToPage}
currentPage={currentPage}>
currentPage={this.props.currentPage}
totalPages={this.props.totalPages}>
</PaginationButton>
</ul>
</nav>

32
js/components/pagination_button.js → js/components/ascribe_pagination/pagination_button.js
View File

@ -7,14 +7,19 @@ let PaginationButton = React.createClass({
propTypes: {
direction: React.PropTypes.oneOf(['previous', 'next']),
goToPage: React.PropTypes.func.isRequired,
currentPage: React.PropTypes.number.isRequired
currentPage: React.PropTypes.number.isRequired,
totalPages: React.PropTypes.number.isRequired
},
isInRange(page) {
return page > 0 && page <= this.props.totalPages;
},
render() {
let page = parseInt(this.props.currentPage, 10);
let directionDisplay;
let page = this.props.currentPage;
let isDisabled = '';
let anchor;
if(this.props.direction === 'previous') {
page -= 1;
@ -32,17 +37,26 @@ let PaginationButton = React.createClass({
);
}
if(page === 0) {
isDisabled += ' disabled';
}
return (
<li className={this.props.direction + isDisabled }>
if (this.isInRange(page)) {
anchor = (
<Link to="pieces"
query={{page}}
onClick={this.props.goToPage(page)}>
{directionDisplay}
</Link>
);
} else {
isDisabled += ' disabled';
anchor = (
<a>
{directionDisplay}
</a>
);
}
return (
<li className={this.props.direction + isDisabled }>
{anchor}
</li>
);
}

1
js/components/ascribe_table/table.js
View File

@ -26,7 +26,6 @@ let Table = React.createClass({
},
render() {
if(this.props.itemList && this.props.itemList.length > 0) {
return (
<div className="ascribe-table">

24
js/components/piece_list.js
View File

@ -16,7 +16,7 @@ import TableItemSubtableButton from './ascribe_table/table_item_subtable_button'
import TableColumnContentModel from '../models/table_column_content_model';
import Pagination from './pagination'
import Pagination from './ascribe_pagination/pagination'
let PieceList = React.createClass({
@ -30,12 +30,23 @@ let PieceList = React.createClass({
PieceListActions.fetchPieceList(page, this.state.pageSize, this.state.search, this.state.orderBy, this.state.orderAsc);
},
componentWillUnmount() {
PieceListStore.unlisten(this.onChange);
},
onChange() {
this.setState(this.getInitialState());
},
paginationGoToPage(page) {
return () => PieceListActions.fetchPieceList(page, this.state.pageSize, this.state.search, this.state.orderBy, this.state.orderAsc);
return (e) => PieceListActions.fetchPieceList(page, this.state.pageSize,
this.state.search, this.state.orderBy,
this.state.orderAsc);
},
tableChangeOrder(orderBy, orderAsc) {
PieceListActions.fetchPieceList(this.state.page, this.state.pageSize, this.state.search, orderBy, orderAsc);
PieceListActions.fetchPieceList(this.state.page, this.state.pageSize,
this.state.search, orderBy, orderAsc);
},
render() {
@ -45,6 +56,9 @@ let PieceList = React.createClass({
new TableColumnContentModel('title', 'Title', TableItemText, 4, true)
];
let currentPage = parseInt(this.props.query.page, 10);
let totalPages = Math.ceil(this.state.pieceListCount / this.state.pageSize)
// Could wrap this altContainer potentially once again.
return (
<AltContainer
@ -63,7 +77,9 @@ let PieceList = React.createClass({
<Table columnList={columnList} changeOrder={this.tableChangeOrder}>
<TableItemSubtable store={EditionListStore} actions={EditionListActions}></TableItemSubtable>
</Table>
<Pagination currentPage={this.props.query.page} goToPage={this.paginationGoToPage} />
<Pagination currentPage={currentPage}
totalPages={totalPages}
goToPage={this.paginationGoToPage} />
</AltContainer>
);
}