From 302c392b4e5b5d708f3f4f37448f0cf07313793e Mon Sep 17 00:00:00 2001
From: Pierre-Jean CHANCELLIER <paidge_cs@hotmail.com>
Date: Wed, 15 Dec 2021 02:06:47 +0100
Subject: [PATCH] update README

---
 README.md                              | 12 ++++++++++++
 components/navigation/Bar.vue          |  9 +++++----
 components/navigation/menu/Sidebar.vue | 20 ++------------------
 layouts/default.vue                    | 19 +++++++++++++++++--
 4 files changed, 36 insertions(+), 24 deletions(-)

diff --git a/README.md b/README.md
index 651ca2f..00761f6 100644
--- a/README.md
+++ b/README.md
@@ -67,3 +67,15 @@ More information about the usage of this directory in [the documentation](https:
 This directory contains your Vuex store files. Creating a file in this directory automatically activates Vuex.
 
 More information about the usage of this directory in [the documentation](https://nuxtjs.org/docs/2.x/directory-structure/store).
+
+
+## Contributions
+```bash
+$ git clone https://git.duniter.org/paidge/wotwizard-ui.git
+$ cd wotwizard-ui
+$ npm install
+$ npm run dev
+```
+
+### Ajouter des pages
+Il suffit de créer un fichier `./pages/mapage.vue` pour que la nouvelle page soit accessible directement sur http://localhost/mapage. Pensez à insérer la logique pour le fil d'ariane dans ce fichier et à mettre à jour le menu dans la variable `menus` du fichier `./layouts/default.vue`. 3 pages d'exemple sont fournies pour montrer l'utilisation de l'API graphQL et de chartJS.
\ No newline at end of file
diff --git a/components/navigation/Bar.vue b/components/navigation/Bar.vue
index c372889..6f9f89f 100644
--- a/components/navigation/Bar.vue
+++ b/components/navigation/Bar.vue
@@ -4,20 +4,21 @@
       <button class="toggle btn border-secondary position-absolute p-1 m-3" @click="toggleMenu"><span></span></button>
       <NavigationBreadcrumb :breadcrumb="breadcrumb" class="ml-5 py-3 px-4" />
     </div>
-    <NavigationMenuSidebar @toggleMenu="toggleMenu" />
+    <NavigationMenuSidebar @toggleMenu="toggleMenu" :menus="menus" />
     <div class="bg_overlay" @click="toggleMenu"></div>
   </header>
 </template>
 
 <script>
 export default {
+  props: {
+    breadcrumb: Array,
+    menus: Array
+  },
   methods: {
     toggleMenu() {
       document.querySelector('.app').classList.toggle('open')
     }
-  },
-  props: {
-    breadcrumb: Array
   }
 }
 </script>
diff --git a/components/navigation/menu/Sidebar.vue b/components/navigation/menu/Sidebar.vue
index 7d788ab..2114ce6 100644
--- a/components/navigation/menu/Sidebar.vue
+++ b/components/navigation/menu/Sidebar.vue
@@ -14,24 +14,8 @@
 
 <script>
 export default {
-    data() {
-        return {
-            menus : [
-                {
-                title: 'Développement',
-                items : [
-                    {path: '/explore',title: 'Explorer la toile de confiance'},
-                    {path: '/appolo',title: 'Appolo'},
-                    {path: '/chartjs',title: 'ChartJS'}
-                ]},
-                {
-                title: 'Un menu',
-                items : [
-                    {path: '/lien',title: 'Un lien'},
-                    {path: '/autrelien',title: 'Un aure lien'}
-                ]}
-            ]
-        }
+    props: {
+        menus: Array
     },
     methods: {
         toggleMenu() {
diff --git a/layouts/default.vue b/layouts/default.vue
index d6bb1e1..ae8a265 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -1,6 +1,6 @@
 <template>
     <div class="app">
-        <NavigationBar :breadcrumb="breadcrumb" />
+        <NavigationBar :breadcrumb="breadcrumb" :menus="menus" />
         <Nuxt />
     </div>
 </template>
@@ -9,7 +9,22 @@
 export default {
   data() {
     return {
-      breadcrumb: []
+      breadcrumb: [],
+      menus : [
+          {
+          title: 'Développement',
+          items : [
+              {path: '/explore',title: 'Explorer la toile de confiance'},
+              {path: '/appolo',title: 'Appolo'},
+              {path: '/chartjs',title: 'ChartJS'}
+          ]},
+          {
+          title: 'Un menu',
+          items : [
+              {path: '/lien',title: 'Un lien'},
+              {path: '/autrelien',title: 'Un aure lien'}
+          ]}
+      ]
     }
   },
   created() {
-- 
GitLab