almost finished new design on product page / reproduced bug with amount not updating
This commit is contained in:
@@ -1,6 +1,7 @@
|
||||
var React = require('react');
|
||||
var CartStore = require('../../stores/cartStore.js');
|
||||
var CartActions = require('../../actions/cartActions.js');
|
||||
var Globals = require('../../globals');
|
||||
|
||||
|
||||
|
||||
@@ -12,25 +13,23 @@ var AddToCart = React.createClass({
|
||||
|
||||
render: function() {
|
||||
|
||||
var itemCount = this.state.item.get('count');
|
||||
var itemCount = this.state.count;
|
||||
|
||||
var moreThanZeroItems = (
|
||||
var amountAndAddButton = (
|
||||
<div className="row-fluid add-to-cart">
|
||||
<div className="span12">
|
||||
<div style={buttonHolderStyle}><button className="btn btn-default" onClick={this._onDecreaseClick}>-</button></div>
|
||||
<div style={buttonHolderStyle}><button className="btn white_button" onClick={this._onDecreaseClick}>-</button></div>
|
||||
<div style={buttonHolderStyle}> <div className="add-to-cart-count">{ itemCount }</div> </div>
|
||||
<div style={buttonHolderStyle}><button className="btn btn-success" onClick={this._onIncreaseClick}>+ Dodaj</button></div>
|
||||
<div style={buttonHolderStyle}><button className="btn white_button" onClick={this._onIncreaseClick}>+</button></div>
|
||||
</div>
|
||||
<div>
|
||||
<div style={buttonHolderStyle}><button className="btn mybutton" onClick={this._addToCartClick}>Dodaj na popis za kupovinu</button></div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
var zeroItems = (<div className="row-fluid add-to-cart">
|
||||
<div className="span12">
|
||||
<div style={buttonHolderStyle}><button className="btn btn-success" onClick={this._onIncreaseClick}>Kupi</button></div>
|
||||
</div>
|
||||
</div> );
|
||||
|
||||
return (itemCount <= 0) ? zeroItems : moreThanZeroItems;
|
||||
return amountAndAddButton;
|
||||
},
|
||||
|
||||
// Add change listeners to stores
|
||||
@@ -42,23 +41,38 @@ var AddToCart = React.createClass({
|
||||
|
||||
getInitialState: function() {
|
||||
var itemInCart = CartStore.getStateFor(this.props.itemId);
|
||||
return { item: itemInCart }
|
||||
return {
|
||||
item: itemInCart,
|
||||
count: 0
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
_onChange: function () {
|
||||
if (this.isMounted()) {
|
||||
var item = CartStore.getStateFor(this.props.itemId);
|
||||
this.setState({ item: item });
|
||||
this.setState({ item: item, count: 0 });
|
||||
}
|
||||
},
|
||||
|
||||
_onIncreaseClick: function () {
|
||||
CartActions.addItem(this.props.itemId);
|
||||
//CartActions.addItem(this.props.itemId);
|
||||
if (this.state.count < Globals.MaxNumberOfItemsToBeAdded ) {
|
||||
this.state.count = this.state.count + 1;
|
||||
this.setState(this.state);
|
||||
}
|
||||
},
|
||||
|
||||
_onDecreaseClick: function () {
|
||||
CartActions.takeItemOut(this.props.itemId);
|
||||
// CartActions.takeItemOut(this.props.itemId);
|
||||
if (this.state.count > 0) {
|
||||
this.state.count = this.state.count - 1;
|
||||
this.setState(this.state);
|
||||
}
|
||||
},
|
||||
|
||||
_addToCartClick: function () {
|
||||
CartActions.setItemCount(this.props.itemId, this.state.count);
|
||||
},
|
||||
|
||||
componentWillUnmount: function () {
|
||||
|
||||
@@ -16,22 +16,19 @@ var ItemWithDetailsPage = React.createClass({
|
||||
return (
|
||||
|
||||
<div className="item-with-details row-fluid center">
|
||||
<div className="col-md-5">
|
||||
<Carousel images={this.state.images}
|
||||
selected={this.state.currentImage}
|
||||
onClickLeft={this.onClickLeft}
|
||||
onClickRight={this.onClickRight}
|
||||
onSelectImage={this.onSelectImage} />
|
||||
<AddToCart itemId={this.state.item.get('id')} />
|
||||
|
||||
<div className="col-md-5 col-md-offset-2">
|
||||
<img src={this.state.firstImage} width="100%" />
|
||||
</div>
|
||||
|
||||
<div className="col-md-7">
|
||||
<h3> {this.state.item.get('name')}</h3>
|
||||
<div className="col-md-5">
|
||||
<div className='item_brand_name'> {this.state.item.get('brand').name}</div>
|
||||
<div className='item_name'> {this.state.item.get('name')}</div>
|
||||
<div>
|
||||
<div className='h4'> {this.state.item.get('brand').name}</div>
|
||||
<div className='h4'> {this.state.item.get('list_price')} KM</div>
|
||||
<div className='h5'>{this.state.item.get('pricePerUnit')}</div>
|
||||
<div className='item_price'> {this.state.item.get('list_price')} KM</div>
|
||||
|
||||
<div>Količina</div>
|
||||
|
||||
<div> <AddToCart itemId={this.state.item.get('id')} /></div>
|
||||
<div> {this.state.item.get('description')}</div>
|
||||
</div>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user