diff --git a/src/ProductList.js b/src/ProductList.js index d8aeeb08682f4d773cf20f688a057952bde4f1da..e184d6d2355ed7743655f84dd9e2ec69e3746c39 100644 --- a/src/ProductList.js +++ b/src/ProductList.js @@ -1,5 +1,5 @@ import React from "react"; -import { Table, Button, Alert } from "react-bootstrap"; +import { Table, Button, Alert, Modal } from "react-bootstrap"; import Fetcher from "./Fetcher"; import EditableCell from "./EditableCell"; import ProductAdder from "./ProductAdder"; @@ -12,9 +12,15 @@ class ProductList extends React.Component { constructor(props) { super(props); this.state = { + delete: { + name: null, + }, products: [], error: null, }; + + this.modalClose = this.modalClose.bind(this); + this.delProduct = this.delProduct.bind(this); } update(row, key, value) { @@ -52,11 +58,13 @@ class ProductList extends React.Component { }); } - delProduct(code) { + delProduct() { + const code = this.state.delete.code; let products = this.state.products; const index = products.findIndex((p) => p.code === code); products.splice(index, 1); this.setState({ products }); + this.modalClose(); fetch(url("/api/product/" + code), { headers: { "x-authentication": this.context.token }, @@ -89,6 +97,10 @@ class ProductList extends React.Component { }); } + modalClose() { + this.setState({ delete: { name: null } }); + } + render() { let alert = null; if (this.state.error !== null) { @@ -127,7 +139,7 @@ class ProductList extends React.Component { <td sm={1}> <Button variant="danger" - onClick={() => this.delProduct(product.code)} + onClick={() => this.setState({ delete: product })} > - </Button> @@ -161,6 +173,23 @@ class ProductList extends React.Component { <ProductAdder addProduct={(p) => this.addProduct(p)} /> </div> )} + + <Modal show={this.state.delete.name != null} onHide={this.modalClose}> + <Modal.Header closeButton> + <Modal.Title>Confirmar la elminicacion</Modal.Title> + </Modal.Header> + <Modal.Body> + ¿Borrar permanentemente el producto {this.state.delete.name}? + </Modal.Body> + <Modal.Footer> + <Button variant="secondary" onClick={this.modalClose}> + Cancelar + </Button> + <Button variant="danger" onClick={this.delProduct}> + Eliminar + </Button> + </Modal.Footer> + </Modal> </Fetcher> ); } diff --git a/src/member/MemberEditer.js b/src/member/MemberEditer.js index d0b325a2507812cd0c0a2bf948c8be8993f9861e..cd0fc80e35677f5636bcf041bba9e35c5333ae57 100644 --- a/src/member/MemberEditer.js +++ b/src/member/MemberEditer.js @@ -102,7 +102,7 @@ function MemberEditer() { <Modal.Title>Confirmar la elminicacion</Modal.Title> </Modal.Header> <Modal.Body> - ¿Borrar la cuenta permanentemente la cuenta de {member.name}? + ¿Borrar permanentemente la cuenta de {member.name}? </Modal.Body> <Modal.Footer> <Button variant="secondary" onClick={handleClose}>