register + deletions + image request changes
This commit is contained in:
@@ -5,6 +5,8 @@ import FormUpdateItem from "../form/formUpdateItem";
|
||||
import { Image } from "../parts/image";
|
||||
import { Description } from "../parts/description";
|
||||
import { Characteristic } from "../parts/characteristic";
|
||||
import { deleteItem } from '../../api/item'
|
||||
|
||||
|
||||
export const ItemBox = ({ model, brand, purchaseDate, price, _id }) => {
|
||||
const [isModalOpen, setIsModalOpen] = useState(false);
|
||||
@@ -15,7 +17,14 @@ export const ItemBox = ({ model, brand, purchaseDate, price, _id }) => {
|
||||
|
||||
const closeModal = () => {
|
||||
setIsModalOpen(false);
|
||||
};
|
||||
};
|
||||
|
||||
const onDelete = async () => {
|
||||
let response = await deleteItem(_id);
|
||||
if (response?.status >= 200 && response?.status < 300) {
|
||||
window.location.reload();
|
||||
}
|
||||
}
|
||||
|
||||
let productname = brand + " " + model;
|
||||
let formatedPrice = price + "€";
|
||||
@@ -23,30 +32,33 @@ export const ItemBox = ({ model, brand, purchaseDate, price, _id }) => {
|
||||
|
||||
let request = brand + " " + model;
|
||||
|
||||
return (
|
||||
<div className="product-details">
|
||||
<Description title={productname}>
|
||||
<Image request={request} _id={_id} alt="Product" />
|
||||
<Characteristic label="Model" value={model} />
|
||||
<Characteristic label="Brand" value={brand} />
|
||||
<Characteristic label="Purchase Date" value={formatedDate} />
|
||||
<Characteristic label="Price" value={formatedPrice} />
|
||||
{/* Bouton d'édition pour ouvrir la fenêtre modale */}
|
||||
<button onClick={openModal}>Edit</button>
|
||||
</Description>
|
||||
{/* Fenêtre modale */}
|
||||
{isModalOpen && (
|
||||
<div className="modal">
|
||||
<div className="modal-content">
|
||||
<span className="close" onClick={closeModal}>
|
||||
×
|
||||
</span>
|
||||
<FormUpdateItem itemId={_id}>
|
||||
{console.log("item ID :" + _id)}
|
||||
</FormUpdateItem>
|
||||
</div>
|
||||
return (
|
||||
<div className="product-details">
|
||||
<Description title={productname}>
|
||||
<Image request={request} alt="Product" />
|
||||
<Characteristic label="Model" value={model} />
|
||||
<Characteristic label="Brand" value={brand} />
|
||||
<Characteristic label="Purchase Date" value={formatedDate} />
|
||||
<Characteristic label="Price" value={formatedPrice} />
|
||||
{/* Boutons d'édition et de suppression */}
|
||||
<div className="button-group">
|
||||
<button className="edit-button" onClick={openModal}>Edit</button>
|
||||
<button className="delete-button" onClick={onDelete}>Delete</button>
|
||||
</div>
|
||||
</Description>
|
||||
{/* Fenêtre modale */}
|
||||
{isModalOpen && (
|
||||
<div className="modal">
|
||||
<div className="modal-content">
|
||||
<span className="close" onClick={closeModal}>
|
||||
×
|
||||
</span>
|
||||
<FormUpdateItem itemId={_id}>
|
||||
{console.log("item ID :" + _id)}
|
||||
</FormUpdateItem>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
);
|
||||
};
|
||||
|
Reference in New Issue
Block a user