# Réponse finale obtenue du bot:
response = « Voici un exemple de code JavaScript pour créer une interface Caissier/Caissière (cashier) pour clients et utilisateurs :
« `javascript
// Création du casher
const cashier = {
// Tableau des articles
articles: [
{ id: 1, name: ‘Eau’, price: 0.50 },
{ id: 2, name: ‘Pain’, price: 1.00 },
{ id: 3, name: ‘Jus d’orange’, price: 1.20 }
],
// Tableau des clients
clients: [
{ id: 1, name: ‘Client A’, email: ‘clienta@example.com’ },
{ id: 2, name: ‘Client B’, email: ‘clientb@example.com’ },
{ id: 3, name: ‘Client C’, email: ‘clientc@example.com’ }
],
// Fonction pour ajouter un article au panier
addArticleToCart(articleId) {
const cart = [];
if (localStorage.getItem(‘cart’)) {
cart = JSON.parse(localStorage.getItem(‘cart’));
}
cart.push({ id: articleId, quantity: 1 });
localStorage.setItem(‘cart’, JSON.stringify(cart));
},
// Fonction pour retirer un article du panier
removeArticleFromCart(articleId) {
const cart = [];
if (localStorage.getItem(‘cart’)) {
cart = JSON.parse(localStorage.getItem(‘cart’));
}
cart.forEach((item, index) => {
if (item.id === articleId) {
cart.splice(index, 1);
}
});
localStorage.setItem(‘cart’, JSON.stringify(cart));
},
// Fonction pour calculer le total du panier
calculateTotalCart() {
const cart = [];
if (localStorage.getItem(‘cart’)) {
cart = JSON.parse(localStorage.getItem(‘cart’));
}
let total = 0;
cart.forEach((item) => {
total += item.price * item.quantity;
});
return total;
},
// Fonction pour valider la commande
validateOrder() {
const cart = [];
if (localStorage.getItem(‘cart’)) {
cart = JSON.parse(localStorage.getItem(‘cart’));
}
// Vérification si le panier est vide
if (cart.length === 0) {
alert(‘Veuillez ajouter des articles au panier’);
return false;
}
// Vérification si le client a sélectionné un article
const clientId = prompt(‘Veuillez sélectionner un client:’);
if (!clientId || clientId === ») {
alert(‘Veuillez sélectionner un client’);
return false;
}
// Enregistrement de la commande dans le localStorage
const order = { clientId, cart };
localStorage.setItem(‘order’, JSON.stringify(order));
alert(‘Commande validée !’);
return true;
},
// Fonction pour afficher le panier
showCart() {
const cart = [];
if (localStorage.getItem(‘cart’)) {
cart = JSON.parse(localStorage.getItem(‘cart’));
}
let html = ‘
| Article | Prix | Quantité | Total |
|---|---|---|---|
| ${article.name} | ${article.price.toFixed(2)} | ${item.quantity} | ${(article.price * item.quantity).toFixed(2)} |
‘;
document.getElementById(‘cart’).innerHTML = html;
}
};
// Affichage initial du casher
cashier.showCart();
// Événement pour ajouter un article au panier
document.getElementById(‘add-article-btn’).addEventListener(‘click’, () => {
const articleId = prompt(‘Veuillez sélectionner un article:’);
if (articleId && articleId !== ») {
cashier.addArticleToCart(articleId);
cashier.showCart();
}
});
// Événement pour retirer un article du panier
document.getElementById(‘remove-article-btn’).addEventListener(‘click’, () => {
const articleId = prompt(‘Veuillez sélectionner un article:’);
if (articleId && articleId !== ») {
cashier.removeArticleFromCart(articleId);
cashier.showCart();
}
});
// Événement pour valider la commande
document.getElementById(‘validate-order-btn’).addEventListener(‘click’, () => {
if (cashier.validateOrder()) {
// Affichage du panier vide après validation de la commande
cashier.articles.forEach((article) => {
document.getElementById(`add-article-btn-${article.id}`).disabled = true;
});
}
});
« `
Ce code crée un casher avec les fonctionnalités suivantes :
* Ajout d’un article au panier
* Retrait d’un article du panier
* Calcul du total du panier
* Validation de la commande
* Affichage du panier
Le casher utilise le localStorage pour stocker le panier et la commande. Les clients sont stockés dans un tableau `clients` et les articles dans un tableau `articles`. Les fonctionnalités sont implémentées à l’aide d’événements `click` pour ajouter, retirer et valider des articles.
Notez que ce code est un exemple simple et qu’il faudrait le personnaliser en fonction de vos besoins spécifiques. Vous pouvez également ajouter des règles de validation plus strictes pour les données entrées par les utilisateurs. »