address is now collapsable
This commit is contained in:
@@ -477,7 +477,7 @@ One shop to rule them all!
|
|||||||
<option value="88247">Vir Kod Posusja</option>
|
<option value="88247">Vir Kod Posusja</option>
|
||||||
<option value="73240">Visegrad</option>
|
<option value="73240">Visegrad</option>
|
||||||
<option value="88307">Visici</option>
|
<option value="88307">Visici</option>
|
||||||
<option value="71300">Visoko</option>
|
|
||||||
<option value="72250">Vitez</option>
|
<option value="72250">Vitez</option>
|
||||||
<option value="88326">Vitina</option>
|
<option value="88326">Vitina</option>
|
||||||
<option value="74265">Vitkovci Donji</option>
|
<option value="74265">Vitkovci Donji</option>
|
||||||
|
|||||||
@@ -65,6 +65,13 @@ var CartActions = {
|
|||||||
itemId: itemId,
|
itemId: itemId,
|
||||||
count: count
|
count: count
|
||||||
});
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
setAddressColapsed: function(isColapsed) {
|
||||||
|
AppDispatcher.handleAction({
|
||||||
|
actionType: CartConstants.SET_ADDRESS_COLAPSED,
|
||||||
|
isColapsed: isColapsed
|
||||||
|
});
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@@ -17,9 +17,9 @@ var CheckoutPage = React.createClass({
|
|||||||
|
|
||||||
render: function() {
|
render: function() {
|
||||||
|
|
||||||
var supportedPlaceOptions = CartStore.getSupportedPlaces().map ( function (p) { return (<option value={p.code}>{p.placeLabel}</option>)})
|
var supportedPlaceOptions = CartStore.getSupportedPlaces().map ( function (p) { return (<option value={p.code}>{p.placeLabel}</option>)});
|
||||||
|
|
||||||
return (
|
var content = (
|
||||||
<div className="checkout-page center">
|
<div className="checkout-page center">
|
||||||
<div className="form-horizontal">
|
<div className="form-horizontal">
|
||||||
<fieldset>
|
<fieldset>
|
||||||
@@ -88,7 +88,35 @@ var CheckoutPage = React.createClass({
|
|||||||
</fieldset>
|
</fieldset>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|
||||||
|
if(CartStore.isAddressColapsed()) {
|
||||||
|
|
||||||
|
var address = CartStore.getHumanReadableAddress().map(function (a) { return (<span>{a}<br /></span>)});
|
||||||
|
content = (
|
||||||
|
<div className="checkout-page center text-center" >
|
||||||
|
<h2> Roba će biti dostavljena na adresu: </h2>
|
||||||
|
<p className="lead">
|
||||||
|
{address}
|
||||||
|
<br />
|
||||||
|
Ukupno: <CartTotal items={this.state.items} itemCounts={this.state.itemCounts} deliveryCosts={this.state.deliveryCosts} />
|
||||||
|
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
<button id="order" name="order" className="mybutton" disabled={!this.state.isDeliveryDestinationValid} onClick={this._onOrderClick}>Završi narudžbu</button> ili <button className="btn btn-default" onClick={this._onUncolapseClick}>Promijeni adresu</button>
|
||||||
|
</p>
|
||||||
|
<div className="form-group">
|
||||||
|
<label className="col-md-4 control-label" htmlFor="order"></label>
|
||||||
|
<div className="col-md-8">
|
||||||
|
<div> </div>
|
||||||
|
<div></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
return content;
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -116,6 +144,10 @@ var CheckoutPage = React.createClass({
|
|||||||
CartActions.confirmDelivery();
|
CartActions.confirmDelivery();
|
||||||
},
|
},
|
||||||
|
|
||||||
|
_onUncolapseClick: function (event) {
|
||||||
|
CartActions.setAddressColapsed(false);
|
||||||
|
},
|
||||||
|
|
||||||
getInitialState: function () {
|
getInitialState: function () {
|
||||||
return CartStore.getWholeCartState();
|
return CartStore.getWholeCartState();
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -9,5 +9,6 @@ module.exports = keyMirror({
|
|||||||
CONFIRM_DELIVERY: null,
|
CONFIRM_DELIVERY: null,
|
||||||
SET_ITEM_COUNT: null,
|
SET_ITEM_COUNT: null,
|
||||||
ADD_N_ITEMS: null,
|
ADD_N_ITEMS: null,
|
||||||
REMOVE_ITEM: null
|
REMOVE_ITEM: null,
|
||||||
|
SET_ADDRESS_COLAPSED: null
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -25,6 +25,8 @@ var _deliveryCosts = new Place({
|
|||||||
postalCode: _deliveryDestination.get('place')
|
postalCode: _deliveryDestination.get('place')
|
||||||
})
|
})
|
||||||
|
|
||||||
|
var _addressColapsed = false;
|
||||||
|
|
||||||
|
|
||||||
var supportedPlaces = [
|
var supportedPlaces = [
|
||||||
{
|
{
|
||||||
@@ -82,6 +84,16 @@ var supportedPlaces = [
|
|||||||
|
|
||||||
var _cartDataLoadCalled = false;
|
var _cartDataLoadCalled = false;
|
||||||
|
|
||||||
|
var nameOfThePlace = function(code) {
|
||||||
|
for(var i=0; i<supportedPlaces.length; i++ ) {
|
||||||
|
var place = supportedPlaces[i];
|
||||||
|
if (place.code === code) {
|
||||||
|
return place.placeLabel;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return "";
|
||||||
|
}
|
||||||
|
|
||||||
var loadCart = function() {
|
var loadCart = function() {
|
||||||
|
|
||||||
_itemsInCart.fetch({
|
_itemsInCart.fetch({
|
||||||
@@ -98,6 +110,7 @@ var loadCart = function() {
|
|||||||
_deliveryDestination.fetch({
|
_deliveryDestination.fetch({
|
||||||
success: function() {
|
success: function() {
|
||||||
validateDeliveryDestinationForm();
|
validateDeliveryDestinationForm();
|
||||||
|
collapseAddressIfNeeded();
|
||||||
fetchPlace();
|
fetchPlace();
|
||||||
CartActions.dataLoaded();
|
CartActions.dataLoaded();
|
||||||
}
|
}
|
||||||
@@ -110,6 +123,13 @@ var loadCart = function() {
|
|||||||
_cartDataLoadCalled = true;
|
_cartDataLoadCalled = true;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
var collapseAddressIfNeeded = function () {
|
||||||
|
if(isDeliveryDestinationValid()) {
|
||||||
|
_addressColapsed = true;
|
||||||
|
} else {
|
||||||
|
_addressColapsed = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
var fetchPlace = function() {
|
var fetchPlace = function() {
|
||||||
_deliveryCosts = new Place({
|
_deliveryCosts = new Place({
|
||||||
@@ -339,9 +359,24 @@ var CartStore = _.extend({}, EventEmitter.prototype, {
|
|||||||
this.removeListener('change', callback);
|
this.removeListener('change', callback);
|
||||||
},
|
},
|
||||||
|
|
||||||
isDeliveryDestinationValid: isDeliveryDestinationValid
|
isDeliveryDestinationValid: isDeliveryDestinationValid,
|
||||||
|
|
||||||
|
isAddressColapsed: function() {
|
||||||
|
return _addressColapsed;
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
getHumanReadableAddress: function() {
|
||||||
|
var address = [];
|
||||||
|
address.push(_deliveryDestination.get('name'));
|
||||||
|
address.push(_deliveryDestination.get('address'));
|
||||||
|
address.push(_deliveryDestination.get('place') + " " + nameOfThePlace(_deliveryDestination.get('place')));
|
||||||
|
address.push("Bosna i Hercegovina");
|
||||||
|
address.push("+387" + _deliveryDestination.get('phone'))
|
||||||
|
address.push(_deliveryDestination.get('email'))
|
||||||
|
|
||||||
|
return address;
|
||||||
|
}
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -378,6 +413,9 @@ AppDispatcher.register(function(payload) {
|
|||||||
case CartConstants.SET_ITEM_COUNT:
|
case CartConstants.SET_ITEM_COUNT:
|
||||||
setItemCount(action.itemId, action.count);
|
setItemCount(action.itemId, action.count);
|
||||||
break;
|
break;
|
||||||
|
case CartConstants.SET_ADDRESS_COLAPSED:
|
||||||
|
_addressColapsed = action.isColapsed
|
||||||
|
break;
|
||||||
default:
|
default:
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
|
|||||||
35046
front-ui/build/configured/ribica.bundle.js
Normal file
35046
front-ui/build/configured/ribica.bundle.js
Normal file
File diff suppressed because one or more lines are too long
Reference in New Issue
Block a user