forked from M-Labs/web2019
75 lines
2.0 KiB
React
75 lines
2.0 KiB
React
|
import React, {PureComponent} from 'react'
|
||
|
|
import PropTypes from "prop-types";
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Component that renders all things for order.
|
||
|
|
* It acts like-a layout, this component do nothing more.
|
||
|
|
*/
|
||
|
|
export class OrderPanel extends PureComponent {
|
||
|
|
|
||
|
|
static get propTypes() {
|
||
|
|
return {
|
||
|
|
title: PropTypes.string,
|
||
|
|
description: PropTypes.element,
|
||
|
|
crateMode: PropTypes.element,
|
||
|
|
crate: PropTypes.element,
|
||
|
|
summaryPrice: PropTypes.element,
|
||
|
|
form: PropTypes.element,
|
||
|
|
isMobile: PropTypes.bool,
|
||
|
|
onClickToggleMobileSideMenu: PropTypes.func,
|
||
|
|
onClickOpenImport: PropTypes.func,
|
||
|
|
};
|
||
|
|
}
|
||
|
|
|
||
|
|
render() {
|
||
|
|
const {
|
||
|
|
title,
|
||
|
|
description,
|
||
|
|
crateMode,
|
||
|
|
crate,
|
||
|
|
summaryPrice,
|
||
|
|
form,
|
||
|
|
isMobile,
|
||
|
|
onClickToggleMobileSideMenu,
|
||
|
|
onClickOpenImport,
|
||
|
|
} = this.props;
|
||
|
|
|
||
|
|
return (
|
||
|
|
<section className="panel">
|
||
|
|
|
||
|
|
<h2>{title}</h2>
|
||
|
|
|
||
|
|
<div className="control">
|
||
|
|
{description}
|
||
|
|
|
||
|
|
{crateMode}
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div>
|
||
|
|
<button
|
||
|
|
className="btn btn-sm btn-outline-primary m-0 mb-2"
|
||
|
|
style={{'cursor': 'pointer'}}
|
||
|
|
onClick={onClickOpenImport}>Import JSON
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
{isMobile ? (
|
||
|
|
<div className="mobileBtnDisplaySideMenu">
|
||
|
|
<button onClick={onClickToggleMobileSideMenu}>
|
||
|
|
<img src="/images/shop/icon-add.svg" alt="add"/>
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
) : null}
|
||
|
|
|
||
|
|
{crate}
|
||
|
|
|
||
|
|
<section className="summary">
|
||
|
|
{summaryPrice}
|
||
|
|
|
||
|
|
{form}
|
||
|
|
</section>
|
||
|
|
|
||
|
|
</section>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
}
|