From 8703cc738e43d9b95e8b31d6bc512616f586a009 Mon Sep 17 00:00:00 2001
From: meskio <meskio@sindominio.net>
Date: Fri, 23 Oct 2020 13:30:44 +0200
Subject: [PATCH] Be able to delete products
---
src/ProductList.js | 41 +++++++++++++++++++++++++++++++++++------
1 file changed, 35 insertions(+), 6 deletions(-)
diff --git a/src/ProductList.js b/src/ProductList.js
index 3d60ec4..c706574 100644
--- a/src/ProductList.js
+++ b/src/ProductList.js
@@ -1,5 +1,5 @@
import React from "react";
-import { Table, Alert } from "react-bootstrap";
+import { Table, Button, Alert } from "react-bootstrap";
import Fetcher from "./Fetcher";
import EditableCell from "./EditableCell";
import AuthContext from "./AuthContext";
@@ -49,6 +49,24 @@ class ProductList extends React.Component {
});
}
+ delProduct(code) {
+ let products = this.state.products;
+ const index = products.findIndex((p) => p.code === code);
+ products.splice(index, 1);
+ this.setState({ products });
+
+ fetch("/api/product/" + code, {
+ headers: { "x-authentication": this.context.token },
+ method: "DELETE",
+ }).then((response) => {
+ if (!response.ok) {
+ this.setState({
+ error: response.status.toString() + " " + response.statusText,
+ });
+ }
+ });
+ }
+
render() {
let alert = null;
if (this.state.error !== null) {
@@ -59,30 +77,40 @@ class ProductList extends React.Component {
);
}
- const isAdmin = this.context.role !== "admin";
+ const isAdmin = this.context.role === "admin";
const entries = this.state.products.map((product, row) => {
return (
<tr key={product.code}>
<EditableCell
onChange={(v) => this.update(row, "code", v)}
value={product.code}
- ro={isAdmin}
+ ro={!isAdmin}
/>
<EditableCell
onChange={(v) => this.update(row, "name", v)}
value={product.name}
- ro={isAdmin}
+ ro={!isAdmin}
/>
<EditableCell
onChange={(v) => this.update(row, "price", v)}
value={printMoney(product.price)}
- ro={isAdmin}
+ ro={!isAdmin}
/>
<EditableCell
onChange={(v) => this.update(row, "stock", v)}
value={product.stock}
- ro={isAdmin}
+ ro={!isAdmin}
/>
+ {isAdmin && (
+ <td sm={1}>
+ <Button
+ variant="danger"
+ onClick={() => this.delProduct(product.code)}
+ >
+ -
+ </Button>
+ </td>
+ )}
</tr>
);
});
@@ -100,6 +128,7 @@ class ProductList extends React.Component {
<th>Nombre</th>
<th>Precio</th>
<th>Existencias</th>
+ {isAdmin && <th sm={1}></th>}
</tr>
</thead>
<tbody>{entries}</tbody>
--
GitLab