feat(search): proposal of choices

components/SearchInput.vue

@@ -12,21 +12,36 @@
           @typing="getAsyncData"
           @select="(option) => (selected = option)"
         >
-          <template slot-scope="props">
+          <!--          <template slot-scope="props">-->
-            <div class="media">
+          <!--            <div class="media">-->
-              <div class="media-left"></div>
+          <!--              <div class="media-left"></div>-->
-              <div class="media-content">
+          <!--              <div class="media-content">-->
-                {{ props.option.title }}
+          <!--                {{ props.name }}-->
-                <br />
+          <!--                <br />-->
-                <small>
+          <!--                <small>-->
-                  Released at {{ props.option.release_date }}, rated
+          <!--                  Released at {{ props.option.release_date }}, rated-->
-                  <b>{{ props.option.vote_average }}</b>
+          <!--                  <b>{{ props.option.vote_average }}</b>-->
-                </small>
+          <!--                </small>-->
-              </div>
+          <!--              </div>-->
-            </div>
+          <!--            </div>-->
-          </template>
+          <!--          </template>-->
         </b-autocomplete>
       </b-field>
+      Résultats possibles: {{ data.length }}
+      <div v-if="data.length">
+        <ul>
+          <li v-for="item in data" :key="item.properties.id">
+            <div class="columns">
+              <div class="column">
+                {{ item.properties.name }}
+              </div>
+              <div class="column">
+                {{ item.properties.context }}
+              </div>
+            </div>
+          </li>
+        </ul>
+      </div>
     </section>
     <section class="map">
       <br />
@@ -135,12 +150,6 @@
       <div class="padded">
         {{ xml.tags.opening_hours }}
       </div>
-      <iframe
-        src="https://projets.pavie.info/yohours/"
-        frameborder="0"
-        width="100%"
-        height="800"
-      ></iframe>
 
       <button class="btn button has-background-success">Enregistrer</button>
     </section>
@@ -176,11 +185,11 @@ export default {
       }
       this.isFetching = true
       this.$axios
-        .get(`https://api-adresse.data.gouv.fr/search?&type=poi&q=${name}`)
+        .get(`https://demo.addok.xyz/search?&type=poi&q=${name}`)
         .then(({ data }) => {
           console.log('data', data)
           this.data = []
-          data.results.forEach((item) => this.data.push(item))
+          data.features.forEach((item) => this.data.push(item))
         })
         .catch((error) => {
           this.data = []

config/i18n.ts

@@ -1,8 +1,10 @@
 import en from './locales/en.json'
+import bz from './locales/bz.json'
 import fr from './locales/fr.json'
+import oc from './locales/oc.json'
 
 export default {
-  locale: 'en',
+  locale: 'fr',
-  fallbackLocale: 'en',
+  fallbackLocale: 'fr',
-  messages: { en, fr },
+  messages: { bz, en, fr, oc },
 }

config/locales/bz.json

@@ -0,0 +1,4 @@
+{
+  "locale_descritption": "Brezhoneg",
+  "message": "Bonjour en Breton!"
+}

config/locales/en.json

@@ -1,3 +1,4 @@
 {
-  "message": "hello!"
+  "locale_descritption": "English",
+  "message": "Hello in English!"
 }

config/locales/fr.json

@@ -1,3 +1,4 @@
 {
-  "message": "bonjour!"
+  "locale_descritption": "Français",
+  "message": "Bonjour en Français!"
 }

config/locales/oc.json

@@ -0,0 +1,4 @@
+{
+  "locale_descritption": "Occitan",
+  "message": "bonjour en occitan!"
+}

layouts/default.vue

@@ -42,21 +42,12 @@
 </template>
 
 <script>
+import routelist from './routes'
+
 export default {
   data() {
     return {
-      items: [
+      items: routelist,
-        {
-          title: 'Accueil',
-          icon: 'home',
-          to: { name: 'index' },
-        },
-        {
-          title: 'à propos',
-          icon: 'lightbulb',
-          to: { name: 'A-propos' },
-        },
-      ],
     }
   },
 }

layouts/routes.ts

@@ -0,0 +1,17 @@
+export default [
+  {
+    title: 'Accueil',
+    icon: 'home',
+    to: { name: 'index' },
+  },
+  {
+    title: 'Horaires',
+    icon: 'clock',
+    to: { name: 'Horaires' },
+  },
+  {
+    title: 'à propos',
+    icon: 'lightbulb',
+    to: { name: 'A-propos' },
+  },
+]

pages/Horaires.vue

@@ -0,0 +1,12 @@
+<template>
+  <section class="section">
+    <h1>Horaires</h1>
+    <p>Vos horaires actuelles</p>
+    <iframe
+      src="https://projets.pavie.info/yohours/"
+      frameborder="0"
+      width="100%"
+      height="800"
+    ></iframe>
+  </section>
+</template>

store/index.ts

@@ -0,0 +1,26 @@
+export const state = () => ({
+  counter: 0,
+  list: [],
+  formConfig: {},
+})
+
+export const mutations = {
+  increment(state: any) {
+    state.counter++
+  },
+  add(state: any, text: any) {
+    state.list.push({
+      text,
+      done: false,
+    })
+  },
+  remove(state: any, { todo }: any) {
+    state.list.splice(state.list.indexOf(todo), 1)
+  },
+  toggle(state: any, todo: any) {
+    todo.done = !todo.done
+  },
+  setFormField(state: any, { field }: any) {
+    state.formConfig[state.formConfig.indexOf(field)] = field
+  },
+}