From 593b0eb7ab00304fa195411618515ab703e53ad0 Mon Sep 17 00:00:00 2001
From: meskio <meskio@sindominio.net>
Date: Fri, 23 Oct 2020 16:51:55 +0200
Subject: [PATCH] Add products
---
src/ProductAdder.js | 82 +++++++++++++++++++++++++++++++++++++++++++++
src/ProductList.js | 26 ++++++++++++++
2 files changed, 108 insertions(+)
create mode 100644 src/ProductAdder.js
diff --git a/src/ProductAdder.js b/src/ProductAdder.js
new file mode 100644
index 0000000..a22c513
--- /dev/null
+++ b/src/ProductAdder.js
@@ -0,0 +1,82 @@
+import React, { useState } from "react";
+import { Form, InputGroup, Col, Row, Button } from "react-bootstrap";
+
+function ProductAdder(props) {
+ const [code, setCode] = useState();
+ const [name, setName] = useState();
+ const [eur, setEur] = useState();
+ const [cents, setCents] = useState();
+ const [stock, setStock] = useState();
+
+ const add = (e) => {
+ e.preventDefault();
+ props.addProduct({
+ code: parseInt(code),
+ price: parseInt(eur) * 100 + parseInt(cents),
+ stock: parseInt(stock),
+ name,
+ });
+ setCode("");
+ setName("");
+ setEur("");
+ setCents("");
+ setStock("");
+ };
+
+ return (
+ <Form onSubmit={add}>
+ <Form.Group as={Row}>
+ <Col>
+ <Form.Control
+ type="number"
+ placeholder="codigo"
+ value={code}
+ onChange={(e) => setCode(e.target.value)}
+ />
+ </Col>
+ <Col>
+ <Form.Control
+ placeholder="nombre"
+ value={name}
+ onChange={(e) => setName(e.target.value)}
+ />
+ </Col>
+ <Col sm={3}>
+ <InputGroup>
+ <Form.Control
+ placeholder="euros"
+ value={eur}
+ onChange={(e) => setEur(e.target.value)}
+ />
+ <InputGroup.Append>
+ <InputGroup.Text>.</InputGroup.Text>
+ </InputGroup.Append>
+ <Form.Control
+ placeholder="centimos"
+ value={cents}
+ onChange={(e) => setCents(e.target.value)}
+ min="0"
+ max="99"
+ />
+ <InputGroup.Append>
+ <InputGroup.Text>€</InputGroup.Text>
+ </InputGroup.Append>
+ </InputGroup>
+ </Col>
+ <Col>
+ <Form.Control
+ type="number"
+ placeholder="cantidad"
+ value={stock}
+ onChange={(e) => setStock(e.target.value)}
+ />
+ </Col>
+ <Col sm={1}>
+ <Button type="submit">+</Button>
+ </Col>
+ </Form.Group>
+ </Form>
+ );
+}
+
+export default ProductAdder;
diff --git a/src/ProductList.js b/src/ProductList.js
index c706574..e3bd6fd 100644
--- a/src/ProductList.js
+++ b/src/ProductList.js
@@ -2,6 +2,7 @@ import React from "react";
import { Table, Button, Alert } from "react-bootstrap";
import Fetcher from "./Fetcher";
import EditableCell from "./EditableCell";
+import ProductAdder from "./ProductAdder";
import AuthContext from "./AuthContext";
import { printMoney } from "./util";
@@ -67,6 +68,25 @@ class ProductList extends React.Component {
});
}
+ addProduct(product) {
+ let products = this.state.products;
+ products.push(product);
+ this.setState({ products });
+
+ const body = JSON.stringify(product);
+ fetch("/api/product", {
+ headers: { "x-authentication": this.context.token },
+ method: "POST",
+ body,
+ }).then((response) => {
+ if (!response.ok) {
+ this.setState({
+ error: response.status.toString() + " " + response.statusText,
+ });
+ }
+ });
+ }
+
render() {
let alert = null;
if (this.state.error !== null) {
@@ -133,6 +153,12 @@ class ProductList extends React.Component {
</thead>
<tbody>{entries}</tbody>
</Table>
+ {isAdmin && (
+ <div>
+ <p>Añadir producto:</p>
+ <ProductAdder addProduct={(p) => this.addProduct(p)} />
+ </div>
+ )}
</Fetcher>
);
}
--
GitLab