register + deletions + image request changes

This commit is contained in:
2024-05-13 19:42:49 +02:00
parent baf31f7959
commit 22ec7f8fdd
16 changed files with 220 additions and 87 deletions

View File

@@ -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}>
&times;
</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}>
&times;
</span>
<FormUpdateItem itemId={_id}>
{console.log("item ID :" + _id)}
</FormUpdateItem>
</div>
</div>
)}
</div>
)}
</div>
);
);
};