senaduka/old-ribica
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

paging done, needs some additional refactoring

Browse Source
This commit is contained in:
Edin Dazdarevic
2015-02-15 14:21:50 +01:00
parent ba22ea8bd7
commit f675f8b024
11 changed files with 136 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
front-ui/app/components/browsing/byCategory.js
View File

@@ -19,7 +19,8 @@ var ByCategory = React.createClass({
return {
category: category,
items: items,
filter :{}
filter :{},
pagination: {}
};
},
filter: {},
@@ -30,16 +31,24 @@ var ByCategory = React.createClass({
var category = this.state.category;
this.filter[fc.field_name] = fcv.filter_value;
NavigationActions.goToCategory(category, section, this.filter);
NavigationActions.goToCategory(category, section, this.filter, 0, this.state.pagination.limit);
},
removeAppliedFilter: function(name) {
delete this.filter[name];
var section = new Section(this.state.category.get('section'));
var category = this.state.category;
NavigationActions.goToCategory(category, section, this.filter);
NavigationActions.goToCategory(category, section, this.filter, 0, this.state.pagination.limit);
},
changePage: function(page) {
var section = new Section(this.state.category.get('section'));
var category = this.state.category;
NavigationActions.goToCategory(category, section, this.filter, parseInt(page) * this.state.pagination.limit, this.state.pagination.limit);
},
render: function() {
var self = this;
return (
<div>
<div className='col-md-2'>
@@ -54,7 +63,7 @@ var ByCategory = React.createClass({
{this.state.category.get('filter_criterias').map(function(fc) {
return (<div>
<div className='h4'>{fc.title}</div>
<div className='h4' style={{color: '#cd3071'}}>{fc.title}</div>
<ul>
{fc.filter_criteria_values.map(function(fcv) {
return (<li>
@@ -68,7 +77,7 @@ var ByCategory = React.createClass({
<div className='col-md-10'>
<h3> Browse products by category : {this.state.category.get('name')}</h3>
<h3> Kategorija - {this.state.category.get('name')}</h3>
Number of items in this category: {this.state.items.length}
<div>
{this.appliedCategoryFiltersArray().map(function(acf) {
@@ -80,7 +89,8 @@ var ByCategory = React.createClass({
</div>
<ItemList items={this.state.items} />
<div> total count is : {this.state.items.totalCount}</div>
<ItemList items={this.state.items} paginationEnabled={true} total={this.state.items.totalCount} limit={this.state.pagination.limit} onPageChange={this.changePage} currentOffset={this.state.pagination.offset} />
</div>
</div>
);
@@ -88,7 +98,7 @@ var ByCategory = React.createClass({
appliedCategoryFiltersArray: function() {
var filters = [];
for(var key in this.state.filter) {
if(this.state.filter.hasOwnProperty(key)) {
if(this.state.filter.hasOwnProperty(key) && key !== 'limit' && key !== 'offset') {
filters.push({name: key, value: this.state.filter[key]});
}
}
@@ -98,21 +108,36 @@ var ByCategory = React.createClass({
var categoryId = this.getParams().id;
this.filter = this.getQuery();
var offset = this.filter.offset || 0;
var limit = this.filter.limit || 30;
this.setState({
filter: this.filter
filter: this.filter,
pagination: {
offset: offset,
limit: limit
}
});
ItemActions.loadByCategory(categoryId, this.filter);
ItemActions.loadByCategory(categoryId, offset, limit, this.filter);
CategoryActions.loadCategoryDetails(categoryId);
},
componentDidMount: function() {
var categoryId = this.getParams().id;
this.filter = this.getQuery();
var offset = this.filter.offset || 0;
var limit = this.filter.limit || 30;
this.setState({
filter: this.filter
filter: this.filter,
pagination: {
offset: offset,
limit: limit
}
});
ItemActions.loadByCategory(categoryId, this.getQuery());
ItemActions.loadByCategory(categoryId, offset, limit, this.getQuery());
CategoryActions.loadCategoryDetails(categoryId);
ItemStore.addChangeListener(this._onChange);