118 lines
3.4 KiB
JavaScript
118 lines
3.4 KiB
JavaScript
import { Card } from "react-bootstrap";
|
|
|
|
// public enum States {
|
|
// Available,
|
|
// BackOrder,
|
|
// Unavailable,
|
|
// Clearance,
|
|
// Promotion,
|
|
// Discontinued
|
|
// }
|
|
function renderStatus(statusCode) {
|
|
if (statusCode !== undefined) {
|
|
|
|
switch (statusCode) {
|
|
case 0:
|
|
return (
|
|
<Card.Text className="item-status item-status-available">
|
|
Disponible
|
|
</Card.Text>
|
|
);
|
|
|
|
case 1:
|
|
return (
|
|
<Card.Text className="item-status item-status-backorder">
|
|
En commande
|
|
</Card.Text>
|
|
);
|
|
case 2:
|
|
return (
|
|
<Card.Text className="item-status item-status-unavailable">
|
|
Indisponible
|
|
</Card.Text>
|
|
);
|
|
case 3:
|
|
return (
|
|
<Card.Text className="item-status item-status-clearence">
|
|
Liquidation
|
|
</Card.Text>
|
|
);
|
|
case 4:
|
|
return (
|
|
<Card.Text className="item-status item-status-promotion">
|
|
Promotion
|
|
</Card.Text>
|
|
);
|
|
case 5:
|
|
return (
|
|
<Card.Text className="item-status item-status-discontinued">
|
|
Discontinué
|
|
</Card.Text>
|
|
);
|
|
default:
|
|
return (
|
|
<></>
|
|
);
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
function renderPrice(price, newPrice, status) {
|
|
if (price !== undefined) {
|
|
|
|
|
|
if (status != 3 && status != 4) {
|
|
return (
|
|
<Card.Text className="item-price-container">
|
|
<span className="item-price">
|
|
{price.toFixed(2).toString().replace(".", ",")} $ CA
|
|
</span>
|
|
</Card.Text>
|
|
);
|
|
}
|
|
else {
|
|
return (
|
|
<Card.Text className="item-price-container">
|
|
<span className="item-old-price">
|
|
{price.toFixed(2).toString().replace(".", ",")} $ CA
|
|
</span>
|
|
<span className="item-new-price">
|
|
{newPrice.toFixed(2).toString().replace(".", ",")} $ CA
|
|
</span>
|
|
</Card.Text>
|
|
);
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
const Item = ({ imageUrl, name, price, newPrice, status }) => {
|
|
if (name !== undefined) {
|
|
return (
|
|
|
|
<Card className="item">
|
|
<Card.Img className="item-img" variant="top" src={`/images/${imageUrl}_thumbnail.jpg`} />
|
|
<Card.Body className="item-info">
|
|
<div className="item-name-container">
|
|
<Card.Title className="item-name">
|
|
{name}
|
|
</Card.Title>
|
|
</div>
|
|
<div className="item-status-container">
|
|
{renderStatus(status)}
|
|
</div>
|
|
<div>
|
|
{renderPrice(price, newPrice, status)}
|
|
</div>
|
|
|
|
</Card.Body>
|
|
</Card>
|
|
);
|
|
}
|
|
else {
|
|
return (<></>);
|
|
}
|
|
}
|
|
|
|
export default Item; |