From 2061fe288596b6c6ee68c7b96b061d5201d9502e Mon Sep 17 00:00:00 2001
From: Victor Mougel <victor.mougel.etu@univ-lille.fr>
Date: Fri, 11 Feb 2022 09:49:14 +0100
Subject: [PATCH] formulaire
---
src/Router.js | 1 +
src/main.js | 9 +++------
src/pages/Page.js | 12 ++++++++++++
src/pages/PizzaList.js | 3 ++-
src/pages/pizzaForm.js | 20 ++++++++++++++++++++
5 files changed, 38 insertions(+), 7 deletions(-)
create mode 100644 src/pages/Page.js
create mode 100644 src/pages/pizzaForm.js
diff --git a/src/Router.js b/src/Router.js
index 493ba4a..d5df367 100644
--- a/src/Router.js
+++ b/src/Router.js
@@ -18,6 +18,7 @@ export default class Router {
this.titleElement.innerHTML = `<h1>${route.title}</h1>`;
// affichage de la page elle même
this.contentElement.innerHTML = route.page.render();
+ route.page.mount?.(this.contentElement);
}
}
diff --git a/src/main.js b/src/main.js
index 4b3adc0..88d19a4 100644
--- a/src/main.js
+++ b/src/main.js
@@ -2,17 +2,14 @@ import Router from './Router';
import data from './data';
import PizzaList from './pages/PizzaList';
import Component from './components/Component';
+import PizzaForm from './pages/pizzaForm.js';
Router.titleElement = document.querySelector('.pageTitle');
Router.contentElement = document.querySelector('.pageContent');
const pizzaList = new PizzaList(data),
- aboutPage = new Component('section', null, 'Ce site est génial'),
- pizzaForm = new Component(
- 'section',
- null,
- 'Ici vous pourrez ajouter une pizza'
- );
+ aboutPage = new Component('p', null, 'ce site est génial'),
+ pizzaForm = new PizzaForm();
Router.routes = [
{ path: '/', page: pizzaList, title: 'La carte' },
diff --git a/src/pages/Page.js b/src/pages/Page.js
new file mode 100644
index 0000000..8ccf3ed
--- /dev/null
+++ b/src/pages/Page.js
@@ -0,0 +1,12 @@
+import Component from '../components/Component';
+
+export default class Page extends Component {
+ element;
+
+ constructor(className, children) {
+ super('section', { name: 'class', value: className }, children);
+ }
+ mount(element) {
+ this.element = element;
+ }
+}
diff --git a/src/pages/PizzaList.js b/src/pages/PizzaList.js
index c76b6e6..8a07d28 100644
--- a/src/pages/PizzaList.js
+++ b/src/pages/PizzaList.js
@@ -1,7 +1,8 @@
import Component from '../components/Component.js';
import PizzaThumbnail from '../components/PizzaThumbnail.js';
+import Page from './Page.js';
-export default class PizzaList extends Component {
+export default class PizzaList extends Page {
#pizzas; // propriété privée
constructor(pizzas) {
diff --git a/src/pages/pizzaForm.js b/src/pages/pizzaForm.js
new file mode 100644
index 0000000..c97a2d0
--- /dev/null
+++ b/src/pages/pizzaForm.js
@@ -0,0 +1,20 @@
+import Page from './Page.js';
+
+export default class PizzaForm extends Page {
+ render() {
+ return /*html*/ `
+ <form class="pizzaForm">
+ <label>
+ Nom :
+ <input type="text" name="name">
+ </label>
+ <button type="submit">Ajouter</button>
+ </form>`;
+ }
+
+ mount(element) {
+ super.mount(element);
+ }
+
+ submit(event) {}
+}
--
GitLab