87 lines
4.5 KiB
JavaScript
87 lines
4.5 KiB
JavaScript
import React, {Component} from 'react';
|
|
import {connect} from 'react-redux';
|
|
import {Row, Col} from 'reactstrap';
|
|
import {WiaasTable, WiaasTableBody} from '../../mainComponents/table/WiaasTable.jsx';
|
|
import CartItem from './components/CartItem.jsx';
|
|
import {cartTexts} from '../../constants/cartConstants';
|
|
import './style/Cart.css';
|
|
|
|
class CartItemsContainer extends Component {
|
|
getOrderCommercialLead() {
|
|
return this.props.cartItems.length ? this.props.cartItems[0].commercialLead : '';
|
|
}
|
|
|
|
render() {
|
|
const {cartItems, isCartItemsDisabled, orderTotalPrice, isLoading} = this.props;
|
|
|
|
return (
|
|
<WiaasTable>
|
|
{
|
|
isLoading &&
|
|
<div className="loader">
|
|
<i className="fa fa-spinner fa-spin fa-3x" aria-hidden="true"></i>
|
|
</div>
|
|
}
|
|
{
|
|
(cartItems && cartItems.length && !isLoading) &&
|
|
<WiaasTableBody id="cart-items-container">
|
|
|
|
{cartItems.map((cartItem, mapKey) => <CartItem key={cartItem.idPackage}
|
|
cartItem={cartItem}
|
|
cartItemNo={mapKey}
|
|
isFormDisabled={isCartItemsDisabled}/>)}
|
|
|
|
<div id="total-price-in-cart-container" className="cart-show-items">
|
|
<Row id={"cart-total-price"} className="cart-total-price">
|
|
<Col lg="3" xs="3" className="item-name d-flex align-items-center">
|
|
<span>
|
|
{cartTexts.labels.TOTAL_PRICE}:
|
|
</span>
|
|
</Col>
|
|
{
|
|
orderTotalPrice &&
|
|
<Col className="d-flex">
|
|
<div className="d-flex flex-column flex-grow-1">
|
|
<div className="d-flex flex-grow-1 no-wrap cart-total-price-header">
|
|
<Col>
|
|
<span>{cartTexts.labels.ON_DELIVERY}:</span>
|
|
</Col>
|
|
<Col>
|
|
<span>{cartTexts.labels.MONTHLY}:</span>
|
|
</Col>
|
|
</div>
|
|
<div className="d-flex flex-grow-1 no-wrap item-price-value">
|
|
<Col>
|
|
<h5>
|
|
{orderTotalPrice.fixedPrice.toLocaleString()} {orderTotalPrice.currency} {' '}
|
|
</h5>
|
|
</Col>
|
|
<Col>
|
|
<h5>
|
|
{
|
|
orderTotalPrice.recurrentPrice && orderTotalPrice.recurrentPrice.toLocaleString() + ' ' + orderTotalPrice.currency
|
|
}
|
|
</h5>
|
|
</Col>
|
|
</div>
|
|
</div>
|
|
</Col>
|
|
}
|
|
</Row>
|
|
</div>
|
|
</WiaasTableBody>
|
|
}
|
|
</WiaasTable>
|
|
);
|
|
}
|
|
}
|
|
|
|
const mapStateToProps = (state) => ({
|
|
cartItems: state.cartReducer.cartItems,
|
|
isCartItemsDisabled: state.cartReducer.isCartItemsDisabled,
|
|
orderTotalPrice: state.cartReducer.orderTotalPrice,
|
|
isLoading: state.cartReducer.isLoading
|
|
});
|
|
|
|
export default connect(mapStateToProps)(CartItemsContainer);
|