memartel_loc/GGMM
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Ajout de promoPrice dans le gestionnaire de produit

Browse Source
This commit is contained in:
Victor Turgeon 2022-10-25 10:02:17 -04:00
parent 13127deee8
commit 7efb6c2351
3 changed files with 46 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
GrossesMitaines/grosses-mitaines-ui/src/components/Ajouter.js
View File

@ -10,26 +10,27 @@ const Ajouter = ({ onCreation }) => {
const [description, setDescription] = useState(""); const [description, setDescription] = useState("");
const [category, setCategory] = useState(""); const [category, setCategory] = useState("");
const [price, setPrice] = useState(""); const [price, setPrice] = useState("");
const [promoPrice, setPromoPrice] = useState("");
const [quantity, setQuantity] = useState(""); const [quantity, setQuantity] = useState("");
const [imageName, setImageName] = useState("sqdc.jpg"); const [imageName, setImageName] = useState("sqdc.jpg");
const [status, setStatusValue] = useState(0) const [status, setStatusValue] = useState(0);
const handleSubmit = (e) => { const handleSubmit = (e) => {
e.preventDefault(); // Empêcher de reloader la page au submit. e.preventDefault(); // Empêcher de reloader la page au submit.
// Appeler le comportement onCreation // Appeler le comportement onCreation
onCreation({ title, description, category, price, quantity, imageName, status }) onCreation({ title, description, category, price, promoPrice, quantity, imageName, status });
// Reset les états du formulaire. // Reset les états du formulaire.
setTitle("") setTitle("");
setDescription("") setDescription("");
setCategory("") setCategory("");
setPrice("") setPrice("");
setQuantity("") setPromoPrice("");
setImageName("sqdc.jpg") setQuantity("");
setImageName("sqdc.jpg");
} }
return ( return (
<div className="inventaire-form-container"> <div className="inventaire-form-container">
<form className="form-horizontal" onSubmit={handleSubmit}> <form className="form-horizontal" onSubmit={handleSubmit}>
@ -37,42 +38,49 @@ const Ajouter = ({ onCreation }) => {
<div className="form-group"> <div className="form-group">
<label>Morceau: </label> <label>Morceau: </label>
<input className="form-control form-input" type='text' <input className="form-control form-input" type='text'
placeholder="Ajouter Morceau" placeholder="Nom du morceau..."
value={title} value={title}
onChange={(e) => setTitle(e.target.value)} /> onChange={(e) => setTitle(e.target.value)} />
</div> </div>
<div className="form-group"> <div className="form-group">
<label>Description: </label> <label>Description: </label>
<input type='text' className="form-control form-input" <input type='text' className="form-control form-input"
placeholder="description" placeholder="Description du morceau..."
value={description} value={description}
onChange={(e) => setDescription(e.target.value)} /> onChange={(e) => setDescription(e.target.value)} />
</div> </div>
<div className="form-group"> <div className="form-group">
<label>Categorie: </label> <label>Catégorie: </label>
<input type='text' className="form-control form-input" <input type='text' className="form-control form-input"
placeholder="categorie" placeholder="Catégorie du morceau..."
value={category} value={category}
onChange={(e) => setCategory(e.target.value)} /> onChange={(e) => setCategory(e.target.value)} />
</div> </div>
<div className="form-group"> <div className="form-group">
<label>Prix: </label> <label>Prix: </label>
<input type='text' className="form-control form-input" <input type='text' className="form-control form-input"
placeholder="prix" placeholder="Prix..."
value={price} value={price}
onChange={(e) => setPrice(e.target.value)} /> onChange={(e) => setPrice(e.target.value)} />
</div> </div>
<div className="form-group">
<label>Prix promotionnel: </label>
<input type='text' className="form-control form-input"
placeholder="Prix promotionnel..."
value={promoPrice}
onChange={(e) => setPromoPrice(e.target.value)} />
</div>
<div className="form-group"> <div className="form-group">
<label>Quantité: </label> <label>Quantité: </label>
<input type='text' className="form-control form-input" <input type='text' className="form-control form-input"
placeholder="Quantité" placeholder="Quantité..."
value={quantity} value={quantity}
onChange={(e) => setQuantity(e.target.value)} /> onChange={(e) => setQuantity(e.target.value)} />
</div> </div>
<div className="form-group"> <div className="form-group">
<label>Nom Image: </label> <label>Nom Image: </label>
<input type='text' className="form-control form-input" <input type='text' className="form-control form-input"
placeholder="nom image" placeholder="Nom de l'image..."
value={imageName} value={imageName}
onChange={(e) => setImageName(e.target.value)} /> onChange={(e) => setImageName(e.target.value)} />
</div> </div>

31
GrossesMitaines/grosses-mitaines-ui/src/components/Modify.js
View File

@ -28,11 +28,11 @@ function renderStatus(statusCode) {
const Modify = ({ morceau, onModify }) => { const Modify = ({ morceau, onModify }) => {
const [currentStatus, setStatus] = useState(renderStatus(morceau.status)); const [currentStatus, setStatus] = useState(renderStatus(morceau.status));
const [title, setTitle] = useState(morceau.title); const [title, setTitle] = useState(morceau.title);
const [description, setDescription] = useState(morceau.description); const [description, setDescription] = useState(morceau.description);
const [category, setCategory] = useState(morceau.category); const [category, setCategory] = useState(morceau.category);
const [price, setPrice] = useState(morceau.price); const [price, setPrice] = useState(morceau.price);
const [promoPrice, setPromoPrice] = useState("");
const [quantity, setQuantity] = useState(morceau.quantity); const [quantity, setQuantity] = useState(morceau.quantity);
const [imageName, setImageName] = useState(morceau.imageName); const [imageName, setImageName] = useState(morceau.imageName);
const [status, setStatusValue] = useState(morceau.status) const [status, setStatusValue] = useState(morceau.status)
@ -43,53 +43,60 @@ const Modify = ({ morceau, onModify }) => {
e.preventDefault(); // Empêcher de reloader la page au submit. e.preventDefault(); // Empêcher de reloader la page au submit.
// Appeler le comportement onCreation // Appeler le comportement onCreation
onModify({ id, title, description, category, price, quantity, imageName, status }) onModify({ id, title, description, category, price, promoPrice, quantity, imageName, status })
} }
return ( return (
<div className="inventaire-form-container"> <div className="inventaire-form-container">
<form className="form-horizontal" onSubmit={handleSubmit}> <form className="form-horizontal" onSubmit={handleSubmit}>
<h4 className="text-center">Modifier un morceau</h4> <h4 className="text-center">Ajouter un morceau</h4>
<div className="form-group"> <div className="form-group">
<label>Morceau: </label> <label>Morceau: </label>
<input className="form-control form-input" type='text' <input className="form-control form-input" type='text'
placeholder={morceau.title} placeholder="Nom du morceau..."
value={title} value={title}
onChange={(e) => setTitle(e.target.value)} /> onChange={(e) => setTitle(e.target.value)} />
</div> </div>
<div className="form-group"> <div className="form-group">
<label>Description: </label> <label>Description: </label>
<input type='text' className="form-control form-input" <input type='text' className="form-control form-input"
placeholder={morceau.description} placeholder="Description du morceau..."
value={description} value={description}
onChange={(e) => setDescription(e.target.value)} /> onChange={(e) => setDescription(e.target.value)} />
</div> </div>
<div className="form-group"> <div className="form-group">
<label>Categorie: </label> <label>Catégorie: </label>
<input type='text' className="form-control form-input" <input type='text' className="form-control form-input"
placeholder={morceau.category} placeholder="Catégorie du morceau..."
value={category} value={category}
onChange={(e) => setCategory(e.target.value)} /> onChange={(e) => setCategory(e.target.value)} />
</div> </div>
<div className="form-group"> <div className="form-group">
<label>Prix: </label> <label>Prix: </label>
<input type='text' className="form-control form-input" <input type='text' className="form-control form-input"
placeholder={morceau.price} placeholder="Prix..."
value={price} value={price}
onChange={(e) => setPrice(e.target.value)} /> onChange={(e) => setPrice(e.target.value)} />
</div> </div>
<div className="form-group">
<label>Prix promotionnel: </label>
<input type='text' className="form-control form-input"
placeholder="Prix promotionnel..."
value={promoPrice}
onChange={(e) => setPromoPrice(e.target.value)} />
</div>
<div className="form-group"> <div className="form-group">
<label>Quantité: </label> <label>Quantité: </label>
<input type='text' className="form-control form-input" <input type='text' className="form-control form-input"
placeholder={morceau.quantity} placeholder="Quantité..."
value={quantity} value={quantity}
onChange={(e) => setQuantity(e.target.value)} /> onChange={(e) => setQuantity(e.target.value)} />
</div> </div>
<div className="form-group"> <div className="form-group">
<label>Nom Image: </label> <label>Nom Image: </label>
<input type='text' className="form-control form-input" <input type='text' className="form-control form-input"
placeholder={morceau.imageName} placeholder="Nom de l'image..."
value={imageName} value={imageName}
onChange={(e) => setImageName(e.target.value)} /> onChange={(e) => setImageName(e.target.value)} />
</div> </div>
@ -141,7 +148,9 @@ const Modify = ({ morceau, onModify }) => {
</Dropdown> </Dropdown>
</div> </div>
<Button className="btn-primary btn-ajouter-morceau" type="submit" >Modifier Morceau</Button>
<Button className="btn-primary btn-ajouter-morceau" type="submit" >Sauvegarder</Button>
</form> </form>
</div> </div>
) )

2
GrossesMitaines/grosses-mitaines-ui/src/components/SimpleItem.js
View File

@ -47,7 +47,7 @@ const SimpleItem = ({ item, onDelete, onModify }) => {
</div> </div>
{isFormvisible && <Modify morceau={item} onModify={onModify}></Modify>} {isFormvisible && <Modify morceau={item} onModify={onModify}></Modify>}
{!isFormvisible && <div> {!isFormvisible && <div>
<p> Catégorie: {item.category}, Prix: {item.price}, Promo: {item.promoPrice}, Quantité: {item.quantity}, Disponibilité: {renderStatus(item.status)}</p> <p> Catégorie: {item.category}, Prix: {item.price.toFixed(2).toString().replace(".", ",")} $ CA, Promo: {item.promoPrice.toFixed(2).toString().replace(".", ",")} $ CA, Quantité: {item.quantity}, Disponibilité: {renderStatus(item.status)}</p>
<p> Description: {item.description}</p> <p> Description: {item.description}</p>
</div> </div>
} }