From e13e630cd6e4fc0b1ff92098a28a770794c7bb9a Mon Sep 17 00:00:00 2001 From: gabrhr <73925454+gabrhr@users.noreply.github.com> Date: Wed, 20 Apr 2022 10:19:29 -0500 Subject: =?UTF-8?q?A=C3=B1adir=20plantilla?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Base para front --- .../app/containers/Pages/Ecommerce/index.js | 117 +++++++++++++++++++++ 1 file changed, 117 insertions(+) create mode 100644 front/odiparpack/app/containers/Pages/Ecommerce/index.js (limited to 'front/odiparpack/app/containers/Pages/Ecommerce') diff --git a/front/odiparpack/app/containers/Pages/Ecommerce/index.js b/front/odiparpack/app/containers/Pages/Ecommerce/index.js new file mode 100644 index 0000000..8eb15a4 --- /dev/null +++ b/front/odiparpack/app/containers/Pages/Ecommerce/index.js @@ -0,0 +1,117 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import { Helmet } from 'react-helmet'; +import brand from 'ba-api/brand'; +import { bindActionCreators } from 'redux'; +import { connect } from 'react-redux'; +import data from 'ba-api/productData'; +import { SearchProduct, ProductGallery, Notification } from 'ba-components'; +import { + fetchAction, + addAction, + removeAction, + checkoutAction, + detailAction, + searchAction, + closeNotifAction +} from 'ba-actions/EcommerceActions'; + +class Ecommerce extends React.Component { + componentDidMount() { + this.props.fetchData(data); + } + + render() { + const title = brand.name + ' - Ecommerce'; + const description = brand.desc; + const { + dataProduct, + handleAddToCart, + dataCart, + removeItem, + checkout, + showDetail, + productIndex, + totalItems, + totalPrice, + search, + keyword, + closeNotif, + messageNotif + } = this.props; + return ( +
+ + {title} + + + + + + + closeNotif()} message={messageNotif} /> + + +
+ ); + } +} + +Ecommerce.propTypes = { + fetchData: PropTypes.func.isRequired, + handleAddToCart: PropTypes.func.isRequired, + removeItem: PropTypes.func.isRequired, + showDetail: PropTypes.func.isRequired, + checkout: PropTypes.func.isRequired, + search: PropTypes.func.isRequired, + keyword: PropTypes.string.isRequired, + dataProduct: PropTypes.object.isRequired, + dataCart: PropTypes.object.isRequired, + productIndex: PropTypes.number.isRequired, + totalItems: PropTypes.number.isRequired, + totalPrice: PropTypes.number.isRequired, + closeNotif: PropTypes.func.isRequired, + messageNotif: PropTypes.string.isRequired, +}; + +const reducer = 'ecommerce'; +const mapStateToProps = state => ({ + force: state, // force state from reducer + keyword: state.getIn([reducer, 'keywordValue']), + dataProduct: state.getIn([reducer, 'productList']), + dataCart: state.getIn([reducer, 'cart']), + productIndex: state.getIn([reducer, 'productIndex']), + totalItems: state.getIn([reducer, 'totalItems']), + totalPrice: state.getIn([reducer, 'totalPrice']), + messageNotif: state.getIn([reducer, 'notifMsg']), +}); + +const constDispatchToProps = dispatch => ({ + fetchData: bindActionCreators(fetchAction, dispatch), + search: bindActionCreators(searchAction, dispatch), + handleAddToCart: bindActionCreators(addAction, dispatch), + removeItem: bindActionCreators(removeAction, dispatch), + showDetail: bindActionCreators(detailAction, dispatch), + checkout: () => dispatch(checkoutAction), + closeNotif: () => dispatch(closeNotifAction), +}); + +const EcommerceMapped = connect( + mapStateToProps, + constDispatchToProps +)(Ecommerce); + +export default EcommerceMapped; -- cgit v1.2.3