From 026ae157835d36f19faff29c71237556f4b6b1b2 Mon Sep 17 00:00:00 2001
From: meskio <meskio@sindominio.net>
Date: Mon, 4 Jan 2021 17:29:22 +0100
Subject: [PATCH] Edit price when creating order
---
src/PriceEditor.js | 22 +++++++++++-----------
src/ProductPicker.js | 18 +++++++++++++++++-
src/order/CreateOrder.js | 8 ++++++--
3 files changed, 34 insertions(+), 14 deletions(-)
diff --git a/src/PriceEditor.js b/src/PriceEditor.js
index eccbdf8..cc368b3 100644
--- a/src/PriceEditor.js
+++ b/src/PriceEditor.js
@@ -30,25 +30,25 @@ function str2price(str) {
return parseInt(value[0]) * 100 + cents;
}
-function PriceEditor(props) {
- const [value, setValue] = useState("0,00");
- const [invalid, setInvalid] = useState(false);
-
- if (!isNaN(props.value) && str2price(value) !== props.value) {
- let centStr = (props.value % 100).toString();
- if (centStr.length === 1) {
- centStr = "0" + centStr;
- }
- setValue(Math.floor(props.value / 100) + "," + centStr);
+function price2str(price) {
+ let centStr = (price % 100).toString();
+ if (centStr.length === 1) {
+ centStr = "0" + centStr;
}
+ return Math.floor(price / 100) + "," + centStr;
+}
+
+function PriceEditor(props) {
+ const [value, setValue] = useState(price2str(props.value));
const change = (e) => {
setValue(e.target.value);
const price = str2price(e.target.value);
props.onChange(price);
- setInvalid(isNaN(price));
};
+ const invalid = isNaN(props.value);
+
return <Form.Control value={value} onChange={change} isInvalid={invalid} />;
}
diff --git a/src/ProductPicker.js b/src/ProductPicker.js
index da40153..21c6b98 100644
--- a/src/ProductPicker.js
+++ b/src/ProductPicker.js
@@ -3,6 +3,7 @@ import { Form, Row, Col, Button } from "react-bootstrap";
import { Typeahead } from "react-bootstrap-typeahead";
import Fetcher from "./Fetcher";
import { printMoney } from "./util";
+import PriceEditor from "./PriceEditor";
class ProductPicker extends React.Component {
constructor(props) {
@@ -25,6 +26,12 @@ class ProductPicker extends React.Component {
this.props.setPicks(picks);
}
+ setPrice(index, price) {
+ let picks = this.props.picks;
+ picks[index].price = price;
+ this.props.setPicks(picks);
+ }
+
setCode(codeStr) {
const code = parseInt(codeStr);
const product = this.state.products.find((p) => p.code === code);
@@ -69,7 +76,16 @@ class ProductPicker extends React.Component {
<Col xs={4}>
<p>{p.name}</p>
</Col>
- <Col>{printMoney(p.price) + "€"}</Col>
+ <Col>
+ {this.props.price ? (
+ <PriceEditor
+ value={p.price}
+ onChange={(price) => this.setPrice(i, price)}
+ />
+ ) : (
+ printMoney(p.price) + "€"
+ )}
+ </Col>
{this.props.amount && (
<Col>
<Form.Control
diff --git a/src/order/CreateOrder.js b/src/order/CreateOrder.js
index d3caa3e..a36b438 100644
--- a/src/order/CreateOrder.js
+++ b/src/order/CreateOrder.js
@@ -45,6 +45,8 @@ function CreateOrder() {
? prevOrders.map((o) => <option key={o.name}>{o.name}</option>)
: "";
+ const disabled = picks.find((p) => isNaN(p.price)) !== undefined;
+
return (
<Sender url="/api/order" body={body} onSuccess={setOrder}>
<Form.Group as={Row}>
@@ -100,11 +102,13 @@ function CreateOrder() {
/>
</Col>
</Form.Group>
- <ProductPicker picks={picks} setPicks={setPicks} />
+ <ProductPicker picks={picks} setPicks={setPicks} price />
<Form.Group as={Row}>
<Col>
<div className="text-right">
- <Button type="submit">Abrir pedido</Button>
+ <Button type="submit" disabled={disabled}>
+ Abrir pedido
+ </Button>
</div>
</Col>
</Form.Group>
--
GitLab