62 lines
1.7 KiB
JavaScript
62 lines
1.7 KiB
JavaScript
var React = require('react'),
|
|
Router = require('react-router'),
|
|
Category = require('../../models/category'),
|
|
ItemCollection = require('../../models/itemCollection'),
|
|
ItemActions = require('../../actions/itemActions.js'),
|
|
ItemStore = require('../../stores/itemStore'),
|
|
NavigationStore = require('../../stores/navigationStore'),
|
|
ItemList = require('../items/itemList'),
|
|
NavigationActions = require('../../actions/navigationActions');
|
|
|
|
var ByCategory = React.createClass({
|
|
mixins: [Router.State],
|
|
getInitialState: function() {
|
|
var category = new Category();
|
|
var items = new ItemCollection();
|
|
return {
|
|
category: category,
|
|
items: items
|
|
};
|
|
},
|
|
render: function() {
|
|
return (
|
|
<div>
|
|
<div className='col-md-2'>
|
|
Here goes section for refining search, by section
|
|
</div>
|
|
|
|
<div className='col-md-10'>
|
|
|
|
<h3> Browse products by category</h3>
|
|
Number of items in this category: {this.state.items.length}
|
|
<ItemList items={this.state.items} />
|
|
</div>
|
|
</div>
|
|
);
|
|
},
|
|
componentWillReceiveProps: function() {
|
|
var categoryId = this.getParams().id;
|
|
ItemActions.loadByCategory(categoryId);
|
|
// TODO: load category details
|
|
},
|
|
componentDidMount: function() {
|
|
var categoryId = this.getParams().id;
|
|
ItemActions.loadByCategory(categoryId);
|
|
|
|
ItemStore.addChangeListener(this._onChange);
|
|
},
|
|
componentWillUnmount: function() {
|
|
ItemStore.removeChangeListener(this._onChange);
|
|
},
|
|
_onChange: function() {
|
|
if(this.isMounted()) {
|
|
this.setState({
|
|
items: ItemStore.getItemsForCategory()
|
|
});
|
|
}
|
|
}
|
|
|
|
});
|
|
|
|
module.exports = ByCategory;
|