From f74a255306999d32cd31f6f729a4b0f9aedbc16e Mon Sep 17 00:00:00 2001
From: Mathis Verleene <mathis.verleene.etu@univ-lille.fr>
Date: Tue, 2 Mar 2021 16:02:23 +0100
Subject: [PATCH] C
---
src/main.js | 2 +-
src/pages/PizzaForm.js | 33 ++++++++++++++++++++++++++++++++-
src/pages/PizzaList.js | 4 ++--
3 files changed, 35 insertions(+), 4 deletions(-)
diff --git a/src/main.js b/src/main.js
index 083fc67..29c4c3d 100644
--- a/src/main.js
+++ b/src/main.js
@@ -78,4 +78,4 @@ window.onpopstate = () => Router.navigate(document.location.pathname, false);
window.onpopstate();
fetch('./news.html')
.then(response => response.text())
- .then(responseText => console.log(responseText));
+ .then(response => console.log(responseText));
diff --git a/src/pages/PizzaForm.js b/src/pages/PizzaForm.js
index 60c977f..2d6acd1 100644
--- a/src/pages/PizzaForm.js
+++ b/src/pages/PizzaForm.js
@@ -1,4 +1,5 @@
import Page from './Page.js';
+import Router from '../Router';
export default class AddPizzaPage extends Page {
render() {
@@ -8,6 +9,19 @@ export default class AddPizzaPage extends Page {
Nom :
<input type="text" name="name">
</label>
+ <label>
+ Image :<br/>
+ <input type="text" name="image" placeholder="https://source.unsplash.com/xxxxxxx/600x600">
+ <small>Vous pouvez trouver des images de pizza sur <a href="https://unsplash.com/">https://unsplash.com/</a> puis utiliser l'URL <code>https://source.unsplash.com/xxxxxxx/600x600</code> où <code>xxxxxxx</code> est l'id de la photo choisie (celui dans la barre d'adresse)</small>
+ </label>
+ <label>
+ Prix petit format :
+ <input type="number" name="price_small" step="0.05">
+ </label>
+ <label>
+ Prix grand format :
+ <input type="number" name="price_large" step="0.05">
+ </label>
<button type="submit">Ajouter</button>
</form>`;
}
@@ -24,12 +38,29 @@ export default class AddPizzaPage extends Page {
submit() {
// D.4. La validation de la saisie
const nameInput = this.element.querySelector('input[name="name"]'),
- name = nameInput.value;
+ imgInput = this.element.querySelector('input[name="image"]'),
+ smallInput = this.element.querySelector('input[name="price_small"]'),
+ bigInput = this.element.querySelector('input[name="price_large"]'),
+ name = nameInput.value,
+ img = imgInput.value,
+ small = smallInput.value,
+ big = bigInput.value;
if (name === '') {
alert('Erreur : le champ "Nom" est obligatoire');
return;
}
+ const pizza = {
+ name: name,
+ image: img,
+ price_small: Number(small),
+ price_large: Number(big),
+ };
alert(`La pizza ${name} a été ajoutée !`);
nameInput.value = '';
+ fetch('http://localhost:8080/api/v1/pizzas', {
+ method: 'POST',
+ headers: { 'Content-Type': 'application/json' },
+ body: JSON.stringify(pizza),
+ }).then(() => Router.navigate('/'));
}
}
diff --git a/src/pages/PizzaList.js b/src/pages/PizzaList.js
index 84fd028..d015454 100644
--- a/src/pages/PizzaList.js
+++ b/src/pages/PizzaList.js
@@ -17,8 +17,8 @@ export default class PizzaList extends Page {
super.mount(element);
fetch('http://localhost:8080/api/v1/pizzas')
.then(response => response.json())
- .then(responseText => {
- this.pizzas = responseText;
+ .then(responseArrayPizza => {
+ this.pizzas = responseArrayPizza;
element.innerHTML = this.render();
});
}
--
GitLab